#home.hero{background:#000;perspective:1200px}
#home.hero.intro-finished{background:#000}
#home.hero::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;background:repeating-linear-gradient(90deg,transparent 0,transparent 31px,rgba(0,0,0,.07) 32px,transparent 33px);opacity:1}
#home.hero[data-intro-phase="complete"]{background:transparent!important}
#home.hero[data-intro-phase="complete"]::before{opacity:0;transition:opacity 600ms}
body>.spectrum-canvas{opacity:0;transition:opacity 900ms}
body:has(#home[data-intro-phase="complete"])>.spectrum-canvas{opacity:1}
#home .logo-sequence{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;z-index:1;perspective:1200px;overflow:hidden}
#home .logo-sequence img{position:absolute;display:block;width:min(100vw,115svh,1100px);height:auto;max-width:none;border-radius:0;object-fit:contain;will-change:transform,opacity;user-select:none}
#home .logo-sequence .intro-lc{width:min(76vw,74svh,650px);mix-blend-mode:multiply;filter:contrast(10)}
#home .hero-title{position:relative;z-index:2}
#home:not(.intro-finished) .hero-title{visibility:hidden}
#home .hero-title h1{color:#fff}
#home .subtitle{color:#eee}
#home:not(.intro-finished) .scroll-cue{opacity:0!important;pointer-events:none}
body:has(#home.intro-light) .language-switch{background:#ffffff40;border-color:#0002}
body:has(#home.intro-light) .language-switch button{color:#161616;text-shadow:none;border-color:#0002;background:#ffffff30}
body:has(#home.intro-light) .language-switch button[aria-pressed=true]{background:#00000012}
main.wrap>#about{background:rgba(12,14,17,.72)}
@media(prefers-reduced-motion:reduce){#home.hero{background:#000}.logo-sequence{display:none!important}}
#home canvas.logo-sequence{display:block;width:100%;height:100%;border-radius:0;pointer-events:none}#home.intro-finished .hero-title{pointer-events:auto;cursor:pointer}#home .hero-title:focus-visible{outline:1px solid #ffffff80;outline-offset:12px;border-radius:8px}

#home.hero::before{display:none}

/* One charcoal ground from the first frame through the entire portfolio. */
:root{--portfolio-ground:#141414}
html,body{background:var(--portfolio-ground)!important}
main.wrap>section,main.wrap>footer,#series .series-screen{background:var(--portfolio-ground)!important}
main.wrap>#about{background:rgba(20,20,20,.72)!important}
body>header.portfolio-header,.suite-jump-nav{background:rgba(20,20,20,.86)!important}
#home.hero,#home.hero.intro-finished{background:transparent!important}
body>.spectrum-canvas{opacity:1;transition:none}
#home .hero-title h1,#home .subtitle{mask-image:linear-gradient(#000,rgba(0,0,0,.8));-webkit-mask-image:linear-gradient(#000,rgba(0,0,0,.8))}


#home .subtitle{font-size:clamp(24px,5.5vw,76px);letter-spacing:-.045em;margin-top:16px}