/* Transparent overlay navigation. The scene remains visible behind it. */
.site-nav.topbar{position:fixed;inset:0 0 auto;z-index:100;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:24px;padding:22px 5vw;background:transparent;color:#eee6d9;border:0;box-shadow:none}
.site-nav.topbar .logo{display:block;width:50px;padding:0;background:none;flex-shrink:0}.site-nav.topbar .logo img{display:block;width:50px;height:50px;object-fit:contain}
.site-nav.topbar .desktop-nav{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:clamp(14px,2.5vw,36px);width:auto;margin-left:auto;font-size:11px;letter-spacing:.7px;font-weight:600;text-transform:uppercase}
.site-nav.topbar nav a{display:flex;align-items:center;min-height:44px;padding:8px 0;white-space:nowrap;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}.site-nav.topbar nav a:is(:hover,:focus-visible,:active),.site-nav.topbar nav a[aria-current=page]{color:#d51d37;border-bottom-color:#d51d37}
.projects-page .site-nav{color:#1d1b1c}.projects-page .site-nav .logo img{filter:brightness(0)}
.mobile-menu{display:none}
@media(max-width:700px){
.site-nav.topbar{flex-direction:row;gap:16px;padding:12px 6vw}
.site-nav.topbar .logo,.site-nav.topbar .logo img{width:35px;height:35px}
.site-nav.topbar .desktop-nav{display:none}
.site-nav.topbar .mobile-menu{display:block;position:static}
.mobile-menu summary{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:88px;min-height:44px;cursor:pointer;font-size:12px;list-style:none;text-transform:uppercase;letter-spacing:1px}
.mobile-menu summary::-webkit-details-marker{display:none}
.mobile-menu summary svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}
.mobile-menu summary .menu-close{display:none}
.mobile-menu[open] summary .menu-lines{display:none}
.mobile-menu[open] summary .menu-close{display:block}
.site-nav.topbar .mobile-menu nav{position:fixed;inset:74px 6vw auto;box-sizing:border-box;width:auto;max-width:none;max-height:calc(100vh - 100px);max-height:calc(100dvh - 100px);overflow-y:auto;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;margin:0;padding:12px 22px;background:#17151d;color:#eee6d9;border:1px solid #eee6d94a;border-radius:12px;box-shadow:0 12px 28px #00000020;font-size:13px;letter-spacing:.5px;text-align:left}
.site-nav.topbar .mobile-menu:not([open]) nav{display:none}
.site-nav.topbar .mobile-menu nav a{box-sizing:border-box;display:flex;align-items:center;justify-content:center;min-height:48px;width:100%;margin:0;padding:8px 0;border:0;text-align:center}
.site-nav.topbar .mobile-menu nav a:is(:hover,:focus-visible,:active),.site-nav.topbar .mobile-menu nav a[aria-current=page]{color:#d51d37;border:0}
.projects-page .site-nav.topbar .mobile-menu nav{background:#eee6d9;color:#1d1b1c;border-color:#1d1b1c33}
.lab-page .lab-stage{padding-top:120px}
}

/* Desktop: leave the scene clear while reading downward. */
@media(min-width:701px){
 .site-nav.topbar{transition:transform .24s ease,opacity .2s ease}
 .site-nav.topbar.nav-hidden{transform:translateY(-110%);opacity:0;pointer-events:none}
 .site-nav.topbar:focus-within{transform:none;opacity:1;pointer-events:auto}
}
@media(min-width:701px) and (prefers-reduced-motion:reduce){.site-nav.topbar{transition:none}}
