/* INYOFiT system pass: shared navigation and component safety net. */
.navbar,
.navbar.scrolled {
  min-height: 62px !important;
  background: rgba(253, 249, 245, 0.97) !important;
  border-bottom: 1px solid rgba(200, 100, 50, 0.15) !important;
}
.nav-inner { min-height: 62px !important; }
.nav-logo.scrolled .yinyang { transform: none; }

/* Never make content invisible while animation JavaScript initialises. */
.fade-in,
.fade-in.visible,
.fade-up,
.fade-up.visible {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/* Contact methods are cards, with readable labels instead of crushed circles. */
.contact-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
}
.contact-item {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-areas:
    "icon label"
    "icon value"
    "icon copy";
  align-items: start;
  column-gap: 0.9rem;
  row-gap: 0.18rem;
  min-height: 156px;
  margin: 0;
  padding: 1.35rem;
  border: 1px solid rgba(200, 100, 50, 0.22);
  border-radius: var(--radius-sm);
  background: var(--white);
}
.contact-item .icon {
  grid-area: icon;
  width: auto;
  min-width: 42px;
  height: auto;
  min-height: 30px;
  padding: 0.34rem 0.45rem;
  border-radius: 999px;
  font-size: 0.58rem !important;
  line-height: 1.1;
  letter-spacing: 0.04em;
  text-align: center;
}
.contact-item .label { grid-area: label; align-self: end; }
.contact-item .value { grid-area: value; font-size: 1rem; line-height: 1.35; }
.contact-item p { grid-area: copy; margin: 0.25rem 0 0 !important; line-height: 1.55; }

@media (max-width: 900px) {
  .contact-grid { grid-template-columns: 1fr; }
  .contact-item { min-height: 0; }
}