.navigation-ground{position:fixed;inset:0 0 auto;height:90px;background:var(--ground);z-index:39;pointer-events:none}
/* body[class] deliberately outranks legacy page-specific header positions on every route. */
/* Studio Utte-inspired navigation: quiet inline reveal on desktop, open space on phones. */
body[class] .menu-toggle{position:fixed;top:18px;left:auto;right:24px;z-index:42;width:82px;height:48px;justify-content:flex-end;padding:0 8px;font-size:16px;line-height:1.4;text-transform:none;letter-spacing:.16em;background:var(--ground)}
body[class] .brand-monogram{position:fixed;top:23px;left:30px;right:auto;width:42px;height:56px;z-index:41}
body[class] .brand-monogram img{width:100%;height:100%}
.site-menu{position:fixed;inset:18px 120px auto auto;margin:0;width:auto;max-width:calc(100vw - 210px);height:auto;max-height:calc(100dvh - 36px);padding:0;border:0;border-radius:0;box-shadow:none;background:var(--ground);color:var(--ink);overflow:auto;z-index:40}
.site-menu[open]{display:block;animation:menu-reveal .24s ease-out}
.site-menu::backdrop{background:transparent}
.site-menu .menu-close,.site-menu .menu-home{display:none}
.site-menu nav{display:flex;flex-direction:row;align-items:center;gap:25px;padding:0 12px;font-size:16px;line-height:1.5;letter-spacing:.12em}
.site-menu nav>a{display:inline-flex;align-items:center;min-height:48px;width:auto;white-space:nowrap;padding:0;text-decoration:none}
.site-menu nav>a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.3em}
.site-menu nav>a:focus-visible,.menu-toggle:focus-visible,.site-menu .menu-close:focus-visible{outline:1px solid var(--ink);outline-offset:3px}
body.menu-open{overflow:hidden}
@keyframes menu-reveal{from{opacity:0;transform:translateX(-7px)}to{opacity:1;transform:translateX(0)}}
@media(max-width:1024px){
 body[class] .menu-toggle{top:14px;left:auto;right:17px}
 body[class] .brand-monogram{top:21px;left:24px;right:auto;width:36px;height:48px}
 .site-menu{inset:0;margin:0;width:100%;max-width:none;height:100dvh;max-height:100dvh;padding:90px 28px 50px;overflow:auto;overscroll-behavior:contain}
 .site-menu[open]{display:flex;align-items:center;justify-content:center;animation:menu-reveal-mobile .28s ease-out}
 .site-menu .menu-close{display:flex;position:fixed;top:14px;left:auto;right:17px;align-items:center;justify-content:flex-end;padding:0 8px;width:82px;height:48px;border:0;background:var(--ground);font-size:16px;line-height:1.4;letter-spacing:.16em}
 .site-menu .menu-home{display:block;position:fixed;top:21px;left:24px;right:auto;width:36px;height:48px}
 .site-menu .menu-home img{width:100%;height:100%;object-fit:contain}
 .site-menu nav{width:100%;flex-direction:column;align-items:center;gap:clamp(15px,5vh,45px);padding:0;font-size:18px;letter-spacing:.13em;text-align:center}
 .site-menu nav>a{justify-content:center;min-height:48px;max-width:100%;white-space:normal;overflow-wrap:break-word}
 .site-menu[data-focus-mode="pointer"] .menu-close:focus-visible{outline:none}
}
@media(max-height:500px) and (max-width:1024px){.site-menu[open]{align-items:flex-start}.site-menu nav{gap:8px}.site-menu{padding-top:72px;padding-bottom:28px}}
@keyframes menu-reveal-mobile{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.site-menu[open]{animation:none}}
