/* Shared navigation, including a complete readable fallback without JavaScript. */
body > .site-header { column-gap: 24px; }
.site-header .brand { flex-shrink: 0; }
.site-header .site-nav { align-items: center; display: flex; font-size: 13px; gap: clamp(12px, 1.4vw, 22px); min-width: 0; }
.site-header .site-nav > a { white-space: nowrap; }
.site-header .site-nav > a[aria-current]:not(.nav-cta) { color: #557a29; font-weight: 700; }
.site-header .site-nav > a[aria-current]:not(.nav-cta)::after { background: currentColor; content: ""; display: block; height: 2px; margin-top: 3px; width: 100%; }
.site-header .site-nav > .nav-cta[aria-current] { background: #29453e; color: #fff; box-shadow: inset 0 0 0 1px #b7c8bd; }
.site-header .nav-toggle { cursor: pointer; display: none; min-height: 44px; min-width: 44px; }
.site-header a:focus-visible, .site-header button:focus-visible { outline: 2px solid #557a29; outline-offset: 5px; }
@media (max-width: 1100px) {
  body > .site-header { flex-wrap: wrap; height: auto; min-height: 64px; padding-bottom: 10px; padding-top: 10px; }
  .site-header .site-nav { align-items: stretch; background: var(--paper); border-bottom: 1px solid var(--line); display: flex; flex-basis: 100%; flex-direction: column; gap: 4px; padding: 12px 0; position: static; }
  .site-header .site-nav > a { align-items: center; display: flex; min-height: 40px; padding: 9px 4px; }
  .site-header .site-nav > .nav-cta { justify-content: center; margin-top: 8px; padding: 12px 18px; }
  .site-header .site-nav > a[aria-current]:not(.nav-cta)::after { display: none; }
  body > .site-header[data-navigation-ready] { flex-wrap: nowrap; height: 68px; padding-bottom: 0; padding-top: 0; }
  .site-header[data-navigation-ready] .nav-toggle { display: block; }
  .site-header[data-navigation-ready] .site-nav { display: none; left: 0; max-height: calc(100vh - 84px); max-height: calc(100dvh - 84px); overflow-y: auto; padding: 16px 24px; position: absolute; right: 0; top: 100%; }
  .site-header[data-navigation-ready] .site-nav.open { display: flex; gap: 4px; }
}
@media (max-width: 760px) {
  body > .site-header[data-navigation-ready] { height: 64px; }
  .site-header[data-navigation-ready] .site-nav { padding-left: 20px; padding-right: 20px; }
}
