/* Browser chrome: the page canvas matches the opening section.
   theme-color is a hint; the browser ultimately owns its toolbar appearance. */
html,body{background-color:#0B0D14}
#navigation{padding-top:calc(14px + env(safe-area-inset-top,0px))}
#navigation .menu{padding-top:calc(14px + env(safe-area-inset-top,0px))}
@media(max-width:899px){
 #navigation{padding-top:calc(11px + env(safe-area-inset-top,0px))}
 #hero .hero__intro{padding-top:calc(84px + env(safe-area-inset-top,0px))}
}

/* A complete document layout when motion is reduced, disabled, or unsupported.
   Never leave the static cards inside a track sized for an animated carousel. */
html:not([data-8b-live]) #work .work__track{height:auto;max-height:none;transform:none;translate:none;rotate:none}
html:not([data-8b-live]) #work .case{height:auto;min-height:440px;aspect-ratio:auto;grid-column:auto;transform:none;translate:none;rotate:none}
html:not([data-8b-live]) #work .work__window{height:auto;overflow:visible}
html:not([data-8b-live]) #work .work__stage{height:auto;position:relative}
html:not([data-8b-live]) #again .again__swing,
html:not([data-8b-live]) #again .again__wheel{height:auto;transform:none;translate:none;rotate:none}
html:not([data-8b-live]) #again .partner{position:relative;transform:none;translate:none;rotate:none}
html:not([data-8b-live]) #hero .hero__orbit{display:none}
html:not([data-8b-live]) #hero .hero__tint{display:none}
html:not([data-8b-live]) #hero .hero-ai-window{opacity:1;transform:none}
html:not([data-8b-live]) #hero .hero-ai-conversation{opacity:1;transform:none;filter:none}
html:not([data-8b-live]) #hero .hero-ai-final{display:none}
html:not([data-8b-live]) #hero .hero-ai-results{opacity:1;transform:none}
html:not([data-8b-live]) #hero .hero-ai-caret{display:none}
html:not([data-8b-live]) #hero .hero-ai-disc{opacity:.35}
@media(min-width:900px){
 html:not([data-8b-live]) #work .case{min-height:550px}
}
@media(max-width:899px){
 html:not([data-8b-live]) #work .work__track{grid-template-columns:minmax(0,1fr);gap:22px}
 html:not([data-8b-live]) #work .case{max-width:none;width:100%;grid-template-rows:24px 96px minmax(0,1fr);padding:22px}
 html:not([data-8b-live]) #work .case__text{min-height:220px}
}


/* Let page content extend into browser glass instead of painting a header slab. */
#navigation{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
#navigation::before,#navigation::after{background:transparent;pointer-events:none}