/* Keep header geometry independent of page theme and scrollbar presence. */
html{scrollbar-gutter:stable}
body header #nav .nav-cta{background:var(--gold);color:var(--bg);border:1px solid var(--gold);box-sizing:border-box;padding-inline:14px;min-height:44px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}

/* Center the mobile navigation as one composition, with a primary consultation CTA. */
@media(max-width:1000px){
 body header #nav{align-items:center;text-align:center}
 body header #nav>a{align-self:center;text-align:center;justify-content:center}
 body header #nav .nav-cta,body.reading-light header #nav .nav-cta{align-self:center;justify-content:center;width:220px;min-width:220px;min-height:56px;padding:16px 24px;margin:16px 0 4px;border:1px solid var(--gold);background:var(--gold);color:var(--bg)}
 body.light-film header.over-film #nav .nav-cta,body.reading-light header #nav .nav-cta{background:#795a30;border-color:#795a30;color:#fffaf1}
}
/* Mobile menu motion preserves the centered composition and touch targets. */
@media(max-width:1000px){
 body header #nav,body header #nav.open{display:flex;max-height:calc(100dvh - 84px);overflow-y:auto;overscroll-behavior:contain;transform-origin:top;transition:opacity 320ms ease,transform 420ms cubic-bezier(.22,1,.36,1),clip-path 420ms cubic-bezier(.22,1,.36,1),visibility 0s linear 420ms}
 body header #nav{visibility:hidden;pointer-events:none;opacity:0;transform:translateY(-10px);clip-path:inset(0 0 100% 0)}
 body header #nav.open{visibility:visible;pointer-events:auto;opacity:1;transform:translateY(0);clip-path:inset(0);transition-delay:0s}
 body header #nav>a{opacity:0;transform:translateY(-6px);transition:opacity 180ms ease,transform 180ms ease}
 body header #nav.open>a{opacity:1;transform:translateY(0);transition-duration:360ms;transition-delay:calc(70ms + var(--menu-order,0)*35ms)}
 body header .menu{transition:background 240ms,color 240ms,border-color 240ms}
 body header .menu[aria-expanded=true]{background:var(--gold);color:var(--bg)}
 body.light-film header.over-film .menu[aria-expanded=true]{background:#795a30;color:#fffaf1}
}
@media(prefers-reduced-motion:reduce){body header #nav,body header #nav>a,body header .menu{transition:none!important}}
/* Fine-line menu icon transforms into a close mark. */
@media(max-width:1000px){
 body header:has(#nav) .menu{position:relative;width:48px;height:48px;min-width:48px;padding:0;border-color:transparent;background:transparent;color:inherit}
 body header:has(#nav) .menu .menu-line{position:absolute;left:12px;top:23px;width:24px;height:1.5px;background:currentColor;transform-origin:center;transition:transform 360ms cubic-bezier(.22,1,.36,1),opacity 200ms ease}
 body header:has(#nav) .menu .menu-line:nth-child(1){transform:translateY(-7px)}
 body header:has(#nav) .menu .menu-line:nth-child(3){transform:translateY(7px)}
 body header:has(#nav) .menu[aria-expanded=true]{background:transparent;color:inherit;border-color:transparent}
 body header:has(#nav) .menu[aria-expanded=true] .menu-line:nth-child(1){transform:rotate(45deg)}
 body header:has(#nav) .menu[aria-expanded=true] .menu-line:nth-child(2){opacity:0;transform:scaleX(.4)}
 body header:has(#nav) .menu[aria-expanded=true] .menu-line:nth-child(3){transform:rotate(-45deg)}
}
@media(prefers-reduced-motion:reduce){body header .menu .menu-line{transition:none!important}}
/* The menu glyph stands alone; keyboard focus uses a soft circular marker. */
@media(max-width:1000px){
 body header:has(#nav) .menu,body header:has(#nav) .menu[aria-expanded=true]{border:0!important;box-shadow:none;background:transparent}
 body header:has(#nav) .menu:focus:not(:focus-visible){outline:none}
 body header:has(#nav) .menu:focus-visible{border-radius:50%;outline:2px solid var(--gold);outline-offset:2px}
}
/* Translucent mobile navigation retains each page's dark or light palette. */
@media(max-width:1000px){
 body header #nav{background:rgba(10,10,10,.5);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
 body.reading-light header #nav,body.light-film header.over-film #nav.open{background:rgba(250,249,246,.5)}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 @media(max-width:1000px){body header #nav{background:#0a0a0a}body.reading-light header #nav,body.light-film header.over-film #nav.open{background:#faf9f6}}
}

/* Desktop consultation uses the same filled primary action as mobile. */
@media(min-width:1001px){body header #nav .nav-cta{background:var(--gold);color:var(--bg);border:1px solid var(--gold)}body.reading-light header #nav .nav-cta{background:#795a30;color:#fffaf1;border-color:#795a30}}
@media(max-width:1000px){body:is(.journal-index,.journal-article) header #nav{background:rgba(250,249,246,.5)}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){@media(max-width:1000px){body:is(.journal-index,.journal-article) header #nav{background:#faf9f6}}}