/* Home section styles. Selectors stay inside this section root. */
:where([data-section="home"]) .stageline{position:absolute;top:50%;transform:translateY(-50%);z-index:3;pointer-events:none;width:min(650px,44vw);max-height:80vh;opacity:0;transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
:where([data-section="home"]) .stageline--intro{left:clamp(20px,5vw,80px);transform:translateY(-50%) translateX(-18px)}
:where([data-section="home"]) .stageline.is-on{opacity:1;transform:translateY(-50%)}
:where([data-section="home"]) .stageline h1{font-size:clamp(1.9rem,3.4vw,3rem);font-weight:600;letter-spacing:-.03em;line-height:1.08;color:var(--text)}
:where([data-section="home"]) .stageline__eyebrow{font-size:.78rem;color:var(--accent);margin-bottom:9px}
:where([data-section="home"]) .stageline__mods{margin:24px 0 0;padding:0;list-style:none}
:where([data-section="home"]) .stageline__mods li{display:grid;grid-template-columns:30px 96px 1fr;align-items:baseline;gap:12px;padding:13px 0;border-top:1px solid var(--line)}
:where([data-section="home"]) .stageline__mods .n{color:var(--accent);font-size:.82rem;font-variant-numeric:tabular-nums}
:where([data-section="home"]) .stageline__mods b{font-weight:600;font-size:1rem}
:where([data-section="home"]) .stageline__mods em{font-style:normal;color:var(--muted);font-size:.9rem;line-height:1.45}
:where([data-section="home"]) .stageline p{margin-top:16px;font-size:clamp(.9rem,1.1vw,1.02rem);color:var(--text2);max-width:none}
:where([data-section="home"]) .stageline a{pointer-events:auto}
:where([data-section="home"]) .stageline__cue{display:block;margin-top:26px;font-size:.8rem;color:var(--muted);animation:home-cuepulse 2.4s ease-in-out infinite}
@keyframes home-cuepulse{50%{opacity:.45}}
@media (max-width:900px){
:where([data-section="home"]) .stageline{width:auto;left:16px;right:16px;top:auto;bottom:18vh;transform:translateY(12px);text-align:left}
:where([data-section="home"]) .stageline.is-on{transform:none}
}
@media (prefers-reduced-motion:reduce){
:where([data-section="home"]) .stageline__cue{animation:none}
}
html:not(.js) :where([data-section="home"]) .stageline{position:static;transform:none;opacity:1;width:auto;max-width:720px;margin:20px auto}
/* the loading state owns the screen on its own. the stage copy used to paint straight away and
   sit under the pulsing "Censo" wordmark for the whole time the 4.8 MB model was coming down the
   wire, which read as two overlapping screens on a cold load */
.v1drive:not(.is-3d) :where([data-section="home"]) .stageline{opacity:0}
/* the ignition: a 911 puts its barrel to the left of the wheel, so the key turns clockwise and
   springs back from START to RUN rather than stopping dead where you left it */
:where([data-section="home"]) .ign{position:absolute;right:clamp(20px,9vw,140px);bottom:clamp(40px,11vh,110px);z-index:4;display:flex;flex-direction:column;align-items:center;gap:10px;opacity:0;transition:opacity .7s ease .3s}
.v1drive.is-3d :where([data-section="home"]) .ign{opacity:1}
:where([data-section="home"]) .ign.is-done{opacity:0;pointer-events:none;transition:opacity 1s ease}
:where([data-section="home"]) .ign__key{width:104px;height:104px;padding:0;border-radius:50%;cursor:pointer;background:none;border:0;-webkit-tap-highlight-color:transparent}
:where([data-section="home"]) .ign__key svg{width:100%;height:100%;overflow:visible}
:where([data-section="home"]) .ign__barrel{fill:rgba(255,255,255,.03);stroke:var(--line);stroke-width:1.5}
:where([data-section="home"]) .ign__ring{fill:none;stroke:var(--accent);stroke-width:2;stroke-dasharray:207;stroke-dashoffset:207;opacity:.9;transition:stroke-dashoffset 1.1s cubic-bezier(.2,.7,.2,1)}
:where([data-section="home"]) .ign.is-on .ign__ring{stroke-dashoffset:0}
:where([data-section="home"]) .ign__blade,:where([data-section="home"]) .ign__tooth{fill:#c9ccd4}
:where([data-section="home"]) .ign__bow{fill:#e6e8ec}
:where([data-section="home"]) .ign__eye{fill:#0f1218}
/* view-box, not fill-box: fill-box would put the pivot on the key's own bounding box and
   swing it out of the barrel instead of turning it in the lock */
:where([data-section="home"]) .ign__turn{transform-origin:60px 60px;transform-box:view-box}
:where([data-section="home"]) .ign.is-on .ign__turn{animation:home-ignturn 1.05s cubic-bezier(.3,1.4,.4,1) forwards}
@keyframes home-ignturn{0%{transform:rotate(0)}58%{transform:rotate(88deg)}100%{transform:rotate(72deg)}}
:where([data-section="home"]) .ign__key:hover .ign__barrel{stroke:var(--line2)}
:where([data-section="home"]) .ign__key:focus-visible{outline:2px solid var(--accent);outline-offset:6px;border-radius:50%}
:where([data-section="home"]) .ign__label{font-size:.8rem;color:var(--muted);margin:0}
:where([data-section="home"]) .ign.is-on .ign__label{color:var(--accent)}
:where([data-section="home"]) .ign__mute{font-size:.7rem;color:var(--muted2);padding:2px 6px;border-radius:4px}
:where([data-section="home"]) .ign__mute:hover{color:var(--text2)}
:where([data-section="home"]) .ign__mute:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:900px){
:where([data-section="home"]) .ign{right:auto;left:50%;transform:translateX(-50%);bottom:6vh}
:where([data-section="home"]) .ign__key{width:84px;height:84px}
}
@media (prefers-reduced-motion:reduce){
:where([data-section="home"]) .ign.is-on .ign__turn{animation:none;transform:rotate(72deg)}
:where([data-section="home"]) .ign__ring{transition:none}
}
html:not(.js) :where([data-section="home"]) .ign{display:none}
:where([data-section="home"][aria-hidden="true"]) .ign{display:none}

/* Section presentation refinements. */
:where([data-section="home"]) .stageline__cue{animation:none!important;color:var(--text2);display:inline-flex;align-items:center;gap:10px}
:where([data-section="home"]) .stageline__cue::before{content:'';width:7px;height:7px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg) translateY(-2px)}
:where([data-section="home"]) .ign__mute{padding:9px 12px;min-height:36px;color:var(--muted)}
@media(max-width:900px){
:where([data-section="home"]) .stageline--intro{top:110px!important;bottom:auto!important;max-height:calc(100dvh - 260px);width:min(540px,70vw)!important;transform:none!important}
:where([data-section="home"]) .stageline--intro h1{font-size:clamp(1.8rem,4vw,2.5rem);max-width:22ch}
:where([data-section="home"]) .stageline__mods{display:none}
:where([data-section="home"]) .stageline__lede{max-width:46ch!important}
:where([data-section="home"]) .stageline__cue{margin-top:18px}
:where([data-section="home"]) .ign{bottom:85px!important;right:32px!important;left:auto!important;transform:none!important}
}
@media(max-width:620px){
:where([data-section="home"]) .stageline--intro{top:140px!important;left:22px!important;right:22px!important;width:auto!important}
:where([data-section="home"]) .stageline--intro h1{font-size:clamp(1.8rem,7vw,2.2rem);line-height:1.12}
:where([data-section="home"]) .stageline__eyebrow{display:none}
:where([data-section="home"]) .stageline__lede{font-size:.87rem!important;line-height:1.55}
:where([data-section="home"]) .stageline__cue{font-size:.75rem}
:where([data-section="home"]) .ign{bottom:100px!important;right:22px!important;gap:2px!important}
:where([data-section="home"]) .ign__key{width:72px!important;height:72px!important}
}
@media(max-height:680px) and (min-width:621px){
:where([data-section="home"]) .stageline__mods{display:none}
:where([data-section="home"]) .stageline--intro{max-height:calc(100dvh - 180px)}
}