/* One black field, with raw data and the approved organic material. */
html,body,dialog{background:#000!important}
body{position:relative;isolation:isolate}
.experience,header,.site-footer{background:transparent!important}
.experience{isolation:auto;z-index:1}.site-footer{position:relative;z-index:1}
:root{background:#000}.reading-shade{display:none}h1{text-shadow:none}.site-footer{border-top-color:#171b20}
.scene{position:absolute;inset:0;z-index:0;pointer-events:none}.scene>#universe{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:2;pointer-events:none}
.presence-host{position:absolute;left:55%;top:100px;width:30vw;aspect-ratio:1;z-index:1;pointer-events:none;mix-blend-mode:screen}
.presence-host img,.presence-host canvas{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain}
.presence-host canvas{visibility:hidden}.presence-host.ready canvas{visibility:visible}.presence-host.ready img{visibility:hidden}
@media(min-width:1100px){main{min-height:600px;padding-right:53vw}.hero-copy{max-width:640px;width:100%}}
@media(min-width:1100px) and (max-height:820px){main{min-height:530px}}
@media(min-width:1100px) and (max-width:1250px){main{padding-right:55vw}h1{font-size:4.2vw}}
@media(max-width:1099px){
 .presence-host{width:54vw;left:23vw;top:150px}
 main{min-height:0;align-items:flex-start;padding:calc(var(--visual-bottom,560px) - 70px) 7vw 46px}
 .hero-copy{max-width:100%;width:100%}h1{font-size:clamp(39px,7.5vw,64px)}.description{max-width:620px}
}

/* One shared left edge for the brand, headline and supporting paragraph. */
:root{--content-left:6vw}
header,main{padding-left:var(--content-left)}
@media(max-width:1099px){:root{--content-left:7vw}}

/* Vector arrows keep the same appearance on iOS and desktop. */
.arrow-icon{width:1em;height:1em;display:inline-block;flex:none;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.contact .arrow-icon{width:22px;height:22px;color:var(--theme-blue)}
@media(max-width:700px){.contact .arrow-icon{width:20px;height:20px}}
/* Safari fallback: CSS blur on cached graph labels, driven by the V42 clock. */
.graph-focus-layer{position:absolute;inset:0;z-index:2;pointer-events:none}
.graph-focus-layer>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.graph-focus-layer>canvas{position:absolute;pointer-events:none}
