/* Line of Ascent: mobile menu panel (pairs with assets/js/nav.js). Phones and narrow tablets (<=850px, where the header hides its links; raised from 640px with hero v07, 2026-10-29).
   Interior headers (.site): ivory panel, ink links. Homepage header over the hero (.nav): navy panel, ivory links. */
.mpanel{display:none;}
@media (max-width:850px){
  header.menu-open .mpanel{display:flex; flex-direction:column; position:absolute; left:0; right:0; top:100%; z-index:60;
    padding:6px 24px 22px; background:#FAF9F5; border-bottom:1px solid rgba(24,35,51,0.13); box-shadow:0 10px 24px rgba(17,37,64,0.08);}
  header.menu-open .mpanel a{font-family:'Source Sans 3', system-ui, sans-serif; font-weight:500; font-size:17px; color:#182333;
    text-decoration:none; padding:14px 0; border-bottom:1px solid rgba(24,35,51,0.10);}
  header.menu-open .mpanel a.active{color:#AF3545;}
  header.menu-open .mpanel a.msub{align-self:flex-start; margin-top:18px; padding:11px 20px; border:0; border-radius:2px;
    background:#112540; color:#FAF9F5; font-weight:600; font-size:15px;}
  /* homepage: header sits over the navy hero */
  header.nav.menu-open .mpanel{background:#112540; border-bottom-color:rgba(250,249,245,0.14); box-shadow:none;}
  header.nav.menu-open .mpanel a{color:#FAF9F5; border-bottom-color:rgba(250,249,245,0.14);}
  header.nav.menu-open .mpanel a.msub{background:#FAF9F5; color:#112540;}
  header.menu-open .burger:focus-visible{outline:2px solid #C85B68; outline-offset:4px;}
}

/* v07 (2026-10-29): interior headers switch to the menu at 850px too (fixes the crowded links at 641-850px).
   header.site outranks each page's inline .site rules. */
@media (max-width:850px){
  header.site .lk, header.site .sub{display:none;}
  header.site .burger{display:block;}
}