/* Vertical alignment for the public site (2026-10-14).
   Layout only: flex/grid alignment and even row heights.
   Colors, type, and photography stay as they are. */

html body nav,
html body nav#main-nav {
  display: flex;
  align-items: center;
}

html body .logo-wrap,
html body .nav-logo {
  display: flex;
  align-items: center;
}

/* Align the desktop link row. Do not set display here. A display
   value on this selector beats each page's own hide rule and pulls
   the links back on while the menu button is still the page's nav. */
@media (min-width: 1025px) {
  html body .nav-links {
    align-items: center;
  }

  html body .nav-links > li,
  html body .nav-links > a {
    display: flex;
    align-items: center;
  }

  html body .nav-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    line-height: 1.2;
    min-height: 48px;
  }
}

html body .btn-gold,
html body .btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  line-height: 1.2;
  min-height: 48px;
}

html body .hero-btns,
html body .btnrow,
html body .hero-cta,
html body .quick-call-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
}

html body .footer-grid,
html body .foot-grid {
  align-items: start;
}

html body .footer-bottom,
html body .foot-bottom,
html body .footer-socials {
  display: flex;
  align-items: center;
}

html body .footer-socials {
  flex-wrap: wrap;
  gap: 12px 20px;
}

html body .services-grid,
html body .cert-grid,
html body .county-grid,
html body .standard-grid,
html body .fit-grid,
html body .process-grid,
html body .chaptergrid,
html body .guides .grid {
  align-items: stretch;
}

html body .svc-card,
html body .cert-card,
html body .county-card,
html body .standard-card,
html body .fit-card,
html body .guides .card {
  height: 100%;
}

html body .ribbon ul {
  align-items: stretch;
}

html body .ribbon li {
  display: flex;
  align-items: center;
}

html body .qf-row,
html body .quick-fields {
  align-items: stretch;
}

html body .qf-row > .form-group,
html body .quick-fields > .form-group {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

html body .form-group label {
  display: block;
}

html body .qf-check {
  display: flex;
  align-items: flex-start;
}

html body .qf-check > input {
  flex: none;
  margin-top: 0.22em;
}

html body .book-contact-links > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

/* A wide photo (16/9, two columns) sat taller than the 4/3 cell beside it.
   Stretch only that neighbor. The wide cell keeps its ratio and sets the
   row height. Later cells keep 4/3 so their own row does not collapse.
   Below 961px the wide cell takes a full row by itself. */
@media (min-width: 961px) {
  html body .photo-3:has(> .wide) {
    align-items: stretch;
  }

  html body .photo-3 > .photo-cell.wide + .photo-cell {
    aspect-ratio: auto;
    height: 100%;
    align-self: stretch;
  }

  html body .photo-3 > .photo-cell.wide + .photo-cell img,
  html body .photo-3 > .photo-cell.wide + .photo-cell picture {
    height: 100%;
    object-fit: cover;
  }
}