.drive-story{position:relative;height:100svh;min-height:720px;background:#131717;isolation:isolate}.drive-story.is-ready{height:650svh;min-height:4000px}.drive-stage{height:100svh;min-height:620px;position:sticky;top:0;overflow:hidden;background:#171c20}.drive-fallback{position:absolute;inset:0;background:linear-gradient(90deg,#111820da,#10182022),url('assets/racetrack.jpg') center/cover;transition:opacity 1s}.is-ready .drive-fallback{opacity:0}#drive-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .8s}.is-ready #drive-canvas{opacity:1}.drive-vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#101517e6,transparent 24%,transparent 70%,#101517b0),linear-gradient(90deg,#10151766,transparent 70%)}.drive-top{position:absolute;top:126px;left:4.5%;right:4.5%;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px;letter-spacing:.11em;z-index:2}.drive-top a{letter-spacing:0;color:#d7d7d7;font-size:13px;border-bottom:1px solid #d7d7d755;padding-bottom:4px}.drive-intro{position:absolute;left:4.5%;top:24%;width:46%;pointer-events:none}.drive-intro h1{font-size:clamp(44px,5vw,80px);line-height:1.03;letter-spacing:-.05em;margin:0 0 25px}.drive-intro em{color:var(--lime)}.drive-intro p{color:#dedede;font-size:16px}.drive-caption{position:absolute;left:4.5%;bottom:180px;max-width:400px;pointer-events:none}.drive-chapter{font-size:12px;letter-spacing:.13em;color:var(--lime)}.drive-caption h2{font-size:clamp(30px,3.1vw,49px);line-height:1.07;margin:14px 0}.drive-caption p{font-size:15px;color:#e0e0e0;max-width:330px}.drive-story:not(.is-ready) .drive-caption{display:none}.drive-bottom{position:absolute;bottom:28px;left:4.5%;right:4.5%;z-index:4}.drive-instruction{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.11em;margin-bottom:20px}.drive-instruction>span:last-child{font-size:22px;color:var(--lime)}.drive-steps{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid #dadada40}.drive-steps button{padding:14px 10px 12px 0;text-align:left;background:transparent;color:#c4c4c4;font-size:14px;transition:color .2s}.drive-steps button span{font-size:11px;margin-right:12px;opacity:.65}.drive-steps button[aria-current=step]{color:var(--lime)}.drive-steps button:disabled{cursor:wait}.drive-progress{height:2px;background:#e0e0e030;position:relative}.drive-progress>span{display:block;width:0;height:2px;background:var(--lime)}.drive-motion{position:absolute;top:168px;right:4.5%;font-size:12px;border:1px solid #dce4e940;border-radius:30px;background:#131a2070;padding:9px 15px;z-index:4}.drive-finish{position:absolute;bottom:180px;left:4.5%;opacity:0;visibility:hidden;z-index:4}.drive-noscript{position:absolute;bottom:170px;left:4.5%;color:#fff;max-width:400px}#drive-loading{position:absolute;right:15%;top:50%;font-size:14px;color:#e4e4e4;max-width:280px;padding:12px 18px;background:#161d2199;border:1px solid #dce4e920;border-radius:3px}.is-ready #drive-loading{display:none}.drive-story.is-static{height:100svh;min-height:760px}.is-static .drive-stage{position:relative}.drive-story.is-error{height:100svh;min-height:760px}.is-error .drive-steps{display:none}.is-error #drive-loading{left:4.5%;right:auto;top:auto;bottom:160px;max-width:440px}.asset-credit{font-size:13px!important}.drive-stage[data-stage="0"] .drive-caption{opacity:0}
@media(max-width:1050px){.drive-intro{width:48%;top:26%}.drive-intro h1{font-size:clamp(42px,5.2vw,65px)}.drive-top{top:124px}.drive-caption{max-width:330px}}
@media(max-width:760px){.drive-stage{min-height:650px}.drive-story{min-height:740px}.drive-story.is-ready{height:650svh}.drive-top{top:102px;left:6%;right:6%;font-size:10px;letter-spacing:.06em;align-items:start}.drive-top a{font-size:12px;max-width:105px;text-align:right}.drive-intro{left:6%;top:21%;width:86%}.drive-intro h1{font-size:clamp(36px,8.7vw,52px);margin-bottom:15px}.drive-intro p{font-size:14px;max-width:300px}.drive-motion{top:148px;right:6%;font-size:11px;padding:7px 11px}.drive-caption{left:6%;bottom:180px;max-width:270px}.drive-caption h2{font-size:33px}.drive-caption p{font-size:14px}.drive-bottom{left:6%;right:6%;bottom:22px}.drive-instruction{font-size:10px;letter-spacing:.04em;max-width:100%;gap:15px}.drive-steps button{font-size:10px;padding:12px 0;letter-spacing:-.03em;min-height:56px;text-align:center}.drive-steps button span{display:block;margin:0 0 5px;font-size:12px}.drive-finish{left:6%;bottom:165px;font-size:13px}#drive-loading{left:6%;right:auto;top:59%;font-size:12px;max-width:300px}.drive-vignette{background:linear-gradient(0deg,#101517e6,transparent 38%,#10151766 70%,#101517bd)}.drive-story.is-static{height:100svh;min-height:740px}.drive-stage[data-stage="5"] .drive-caption{bottom:auto;top:24%}}
@media(prefers-reduced-motion:reduce){.drive-story.is-ready{height:100svh;min-height:760px}.drive-stage{position:relative}#drive-canvas,.drive-fallback{transition:none}}

.drive-instruction,.drive-steps button span{font-size:12px}.drive-intro h1{max-width:570px}
@media(max-width:760px){.drive-steps button,.drive-motion,.drive-top,.drive-instruction{font-size:12px}.drive-steps button{letter-spacing:-.05em}.drive-intro h1{font-size:clamp(35px,8.5vw,49px)}}

@media(max-width:760px){.drive-caption{top:22%;bottom:auto;max-width:88%;width:88%}.drive-caption h2{font-size:29px;max-width:340px;line-height:1.08}.drive-caption p{font-size:14px;max-width:315px}.drive-stage[data-stage="5"] .drive-caption{top:24%;max-width:250px}.drive-stage[data-stage="5"] .drive-caption h2{font-size:29px}}

/* The start line separates the car/stadium scene from the foreground copy. */
.drive-stage{--opening-line:.50;--start-line-y:50svh}
.drive-intro{top:calc(var(--start-line-y) + 26px);width:88%;max-width:920px}
.drive-intro h1{font-size:clamp(40px,4.2vw,64px);line-height:1.02;margin:0 0 16px;max-width:760px}
.drive-intro p{margin:0;line-height:1.5;max-width:620px}
@media(max-width:760px){.drive-intro{top:calc(var(--start-line-y) + 22px);width:88%}.drive-intro h1{font-size:clamp(31px,8vw,42px);margin-bottom:12px}.drive-intro p{font-size:14px;max-width:100%}}
@media(max-height:760px){.drive-stage{--opening-line:.50;--start-line-y:50svh}.drive-intro{top:calc(var(--start-line-y) + 18px)}.drive-intro h1{font-size:clamp(30px,3.3vw,42px);margin-bottom:10px}.drive-intro p{font-size:14px}}
@media(max-width:760px) and (max-height:760px){.drive-intro h1{font-size:30px}.drive-intro p{font-size:14px;line-height:1.45}}

.drive-story.is-error .drive-intro{top:24%}

/* Keep foreground text legible while preserving daylight and material contrast. */
.drive-vignette{background:linear-gradient(0deg,#101517ed,transparent 30%,transparent 79%,#10151770),linear-gradient(90deg,#1015171c,transparent 65%)}
@media(max-width:760px){.drive-vignette{background:linear-gradient(0deg,#101517ed,transparent 42%,transparent 78%,#10151788)}}

/* Center the opening message in the free asphalt area. Its scroll transform
   is driven by the same progress as the car, with a track-anchored exit. */
.drive-intro{left:50%;width:min(600px,60%);max-width:none;text-align:center;transform:translateX(-50%);transform-origin:0 0;will-change:transform,opacity}
@media(max-width:760px){.drive-intro{left:50%;width:88%}}
.reduced-motion .drive-intro{will-change:auto}
@media(prefers-reduced-motion:reduce){.drive-intro{will-change:auto}}

.drive-intro h1,.drive-intro p{margin-left:auto;margin-right:auto}
.drive-caption{will-change:opacity}