/* Local VOLTA wheel story. The regular hero remains the no-script fallback. */
.landing-chrome{position:sticky;top:0;z-index:30;background:var(--paper)}
.ride-stage{position:relative}
.ride-camera{position:relative}
.ride-opening,.ride-wheel{display:none}
.ride-button-travel{scroll-behavior:auto!important}
.ride-ready{scroll-padding-top:calc(var(--ride-chrome,130px) + 20px)}
.ride-ready .ride-story{position:relative;height:calc(100svh - var(--ride-chrome,130px) + var(--ride-scroll-length,1400px))}
.ride-ready .ride-stage{position:sticky;top:var(--ride-chrome,130px);height:calc(100svh - var(--ride-chrome,130px));isolation:isolate;overflow:clip;background:var(--paper)}
.ride-ready .ride-camera{position:absolute;inset:0;transform-origin:0 0;will-change:transform}
.ride-ready .ride-camera>.hero{height:100%;min-height:0;padding-block:24px;align-content:center}
.ride-ready .hero-product>img{transition:none;z-index:6;-webkit-mask-image:url("assets/front-wheel-frame-mask.svg?v=2");mask-image:url("assets/front-wheel-frame-mask.svg?v=2");-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
/* EDITORIAL_V5 — composition only. Wheel, window, shutter and camera geometry are preserved below. */
.ride-ready .ride-opening{display:block;position:absolute;inset:0;z-index:5;pointer-events:none;--ride-stage-height:calc(100svh - var(--ride-chrome,130px))}
.ride-opening-inner{width:calc(100% - 96px);max-width:1824px;height:100%;margin:auto;position:relative}
.ride-intro-copy{position:absolute;right:0;top:6%;width:49%;max-width:none}
.ride-intro-copy .eyebrow{color:var(--muted);font-size:clamp(8px,.68vw,11px);letter-spacing:.18em;line-height:1.5;margin-bottom:clamp(17px,2.6vh,25px);white-space:nowrap}
.ride-intro-copy .signal{width:7px;height:7px;flex-shrink:0}
.ride-intro-copy h2{font-family:Archivo,Arial,sans-serif;font-size:clamp(44px,min(calc(8.43vw - 8.1px),calc(var(--ride-stage-height) * .166)),156px);font-weight:700;line-height:.97;letter-spacing:-.065em;color:var(--ink)}
.ride-title-first,.ride-title-middle{display:block;white-space:nowrap}
.ride-title-middle{line-height:.97;padding-left:.005em}
.ride-intro-copy .ride-title-giro{display:block;font-family:Georgia,'Times New Roman',serif;font-size:2.6em;font-weight:400;font-style:italic;line-height:.67;letter-spacing:-.085em;color:var(--clay);text-align:right;padding-right:.055em;margin-top:.03em}
.ride-intro-copy .ride-intro-support{margin-top:clamp(12px,1.9vh,20px);margin-left:auto;color:var(--muted);font-size:clamp(12px,1.1vw,18px);line-height:1.5;text-align:right;max-width:none}
.ride-scenes{position:absolute;left:51%;right:auto;top:auto;bottom:11.8%;width:22%;min-width:0;max-width:300px}
.ride-scene-line{display:flex;align-items:center;gap:18px}
.ride-scene-number{font:400 clamp(36px,3.05vw,58px)/1 Archivo,sans-serif;letter-spacing:-.07em;color:var(--clay)}
.ride-scene-label{font-size:clamp(9px,.67vw,12px);line-height:1.5;min-width:0}
.ride-scene-label small{display:block;color:var(--muted);font-size:clamp(7px,.54vw,9px);letter-spacing:.1em;line-height:1.5;margin-bottom:3px;white-space:nowrap}
.ride-scene-label>span{display:block}
.ride-progress{display:flex;gap:10px;margin-top:16px;width:min(260px,100%)}
.ride-progress>span{flex:1;height:3px;background:#c7cfca;position:relative;overflow:hidden}
.ride-progress i{display:block;width:100%;height:100%;background:var(--ink);transform:scaleX(0);transform-origin:left}
.ride-enter{pointer-events:auto;position:absolute;right:0;bottom:10.5%;width:clamp(290px,23.3vw,390px);max-width:49%;display:flex;align-items:center;justify-content:space-between;gap:30px;border:1px solid var(--ink);border-radius:100px;background:var(--ink);color:var(--paper);padding:19px 27px;font-size:clamp(13px,.95vw,17px);font-weight:550;line-height:1.5;min-height:65px;transition:background .25s ease,border-color .25s ease}
.ride-enter>span{font-size:24px;font-weight:400;line-height:1;flex-shrink:0}
.ride-enter:hover{background:#245357;border-color:#245357}
.ride-enter:focus-visible{outline:3px solid var(--clay);outline-offset:6px}
.ride-footer{position:absolute;bottom:2.7%;right:0;width:clamp(290px,23.3vw,390px);max-width:49%;display:flex;justify-content:space-between;gap:18px;align-items:center}
.ride-scroll-hint{display:flex;gap:15px;align-items:center;font-size:clamp(7px,.48vw,9px);letter-spacing:.13em;line-height:1.5;color:var(--muted);white-space:nowrap}
.ride-scroll-hint>span{color:var(--clay);font-size:23px;line-height:1}
.ride-pause{pointer-events:auto;background:none;border:0;padding:10px 0;font-size:clamp(7px,.5vw,9px);letter-spacing:.12em;color:var(--muted);text-underline-offset:5px;text-decoration:underline;min-height:38px}
.ride-pause:hover{color:var(--ink)}
.ride-pause:focus-visible{outline:2px solid var(--clay);outline-offset:4px}
/* The main hero's five children are hooks for the camera's staged welcome. */
.ride-ready .ride-welcome-item{will-change:opacity,transform}
.ride-ready .ride-wheel{display:block;position:absolute;top:0;left:0;z-index:4;pointer-events:none;will-change:transform,opacity;transform-origin:50% 50%;--wheel-angle:0deg;--ride-wipe:inset(0 100% 0 0)}
/* Center on the measured axle. The photo reaches 18px beneath the opaque
   inner rim at source size, avoiding a cream crescent as the rim rotates. */
.ride-window{position:absolute;inset:0;overflow:hidden;clip-path:circle(40% at 50.1% 50.8%);isolation:isolate}
.ride-window>img,.ride-shutter,.ride-shutter>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ride-window img{max-width:none}
.ride-window>img,.ride-shutter>img{object-position:center;filter:saturate(.85)}
.ride-shutter{clip-path:var(--ride-wipe);will-change:clip-path}
.ride-rim{position:relative;width:100%;height:100%;max-width:none;transform:rotate(var(--wheel-angle));transform-origin:50.1% 50.8%;will-change:transform}
@media(min-width:761px) and (max-height:820px){
 .ride-intro-copy{top:5.6%}.ride-intro-copy .eyebrow{margin-bottom:17px}
 .ride-intro-copy .ride-intro-support{font-size:13px;margin-top:12px}
 .ride-scenes{bottom:10%}.ride-scene-number{font-size:42px}.ride-scene-label{font-size:9px}.ride-progress{margin-top:12px}
 .ride-enter{bottom:8.5%;min-height:57px;padding:15px 24px;font-size:13px}
 .ride-footer{bottom:1.5%}.ride-scroll-hint{font-size:7px;gap:11px}.ride-pause{font-size:7px}
}
@media(min-width:761px) and (max-height:760px){.ride-ready .ride-stage .hero h1{font-size:clamp(64px,6vw,90px);margin-block:20px}.ride-ready .ride-stage .hero-product{min-height:340px}.ride-ready .ride-stage .hero-bottom{margin-top:20px}}
@media(min-width:761px) and (max-width:1100px){
 .ride-opening-inner{width:calc(100% - 64px)}
 .ride-intro-copy h2{font-size:clamp(42px,min(calc(8.43vw - 5.4px),calc(var(--ride-stage-height) * .166)),90px)}
 .ride-intro-copy .eyebrow{font-size:7px;letter-spacing:.12em}
 .ride-intro-copy .ride-intro-support{font-size:11px}
 .ride-enter{width:26%;max-width:none;min-width:225px;gap:15px;padding:15px 20px;font-size:11px;min-height:55px}
 .ride-enter>span{font-size:20px}
 .ride-scenes{width:22%;max-width:220px;bottom:10.7%}.ride-scene-line{gap:11px}.ride-scene-number{font-size:35px}.ride-scene-label{font-size:8px}.ride-scene-label small{font-size:6px;letter-spacing:.05em}.ride-progress{margin-top:12px;gap:6px}
 .ride-footer{width:26%;max-width:none;min-width:225px}.ride-scroll-hint{font-size:6px;gap:9px}.ride-pause{font-size:7px}
}
@media(max-width:760px){
 .ride-ready .ride-camera>.hero{width:calc(100% - 40px);padding-block:18px;grid-template-rows:auto auto;align-content:center;gap:0}
 .ride-ready .ride-stage .hero h1{font-size:clamp(51px,13.8vw,72px);line-height:.97;margin:16px 0 15px}
 .ride-ready .ride-stage .hero-desc{font-size:11px;line-height:1.6;margin-bottom:16px}
 .ride-ready .ride-stage .hero-copy>.eyebrow{font-size:7px}
 .ride-ready .ride-stage .hero-product{margin-top:16px;padding-top:0;padding-bottom:4px;max-width:470px;width:min(100%,50svh);justify-self:center}
 .ride-ready .ride-stage .hero-product>img{max-height:none}
 .ride-ready .ride-stage .color-picker{margin-top:13px;gap:25px}
 .ride-ready .ride-stage .color-picker button{font-size:8px;padding-block:8px}
 .ride-ready .ride-stage .vertical-label{display:none}
 .ride-ready .ride-stage .button{padding:14px 22px;font-size:10px}
 .ride-opening-inner{width:calc(100% - 40px)}
 .ride-intro-copy{top:3%;width:100%;max-width:none;text-align:right}
 .ride-intro-copy .eyebrow{font-size:6.5px;letter-spacing:.11em;line-height:1.5;margin-bottom:12px;white-space:normal}
 .ride-intro-copy .signal{width:5px;height:5px}
 .ride-intro-copy h2{font-size:clamp(36px,min(12.1vw,calc(var(--ride-stage-height) * .07)),60px);line-height:.97;letter-spacing:-.065em}
 .ride-title-first,.ride-title-middle{line-height:.98}
 .ride-intro-copy .ride-title-giro{font-size:2.2em;line-height:.72;padding-right:.04em;padding-bottom:.14em;margin-top:.02em;letter-spacing:-.075em}
 .ride-intro-copy .ride-intro-support{display:block;font-size:10px;line-height:1.5;margin-top:8px;max-width:none}
 .ride-enter{top:36%;bottom:auto;right:0;width:min(240px,76%);min-width:0;max-width:none;min-height:48px;font-size:11px;padding:12px 18px;gap:20px}
 .ride-enter>span{font-size:19px}
 .ride-scenes{top:44.8%;bottom:auto;left:auto;right:0;min-width:0;width:min(190px,52%);max-width:none}
 .ride-scene-line{gap:10px;justify-content:flex-start}
 .ride-scene-number{font-size:32px}
 .ride-scene-label{font-size:8px;line-height:1.4}
 .ride-scene-label small{font-size:6px;letter-spacing:.06em;line-height:1.4;margin-bottom:2px}
 .ride-progress{width:100%;margin-top:10px;gap:7px}.ride-progress>span{height:2px}
 .ride-footer{top:53%;bottom:auto;right:0;width:52%;min-width:0;max-width:none;gap:9px;align-items:center}
 .ride-scroll-hint{font-size:6px;letter-spacing:.08em;gap:6px;line-height:1.5}
 .ride-scroll-hint>span{font-size:15px}
 .ride-pause{font-size:6px;letter-spacing:.06em;min-height:30px;padding:8px 0}
}
@media(max-width:760px) and (max-height:800px){
 .ride-intro-copy{top:2.5%}.ride-intro-copy .eyebrow{margin-bottom:9px}
 .ride-intro-copy h2{font-size:clamp(33px,min(11.5vw,calc(var(--ride-stage-height) * .068)),54px)}
 .ride-intro-copy .ride-intro-support{display:none}
 .ride-enter{min-height:46px;padding:11px 17px;font-size:10px}
 .ride-scene-number{font-size:29px}.ride-progress{margin-top:8px}
 .ride-footer{justify-content:flex-end}.ride-footer .ride-scroll-hint{display:none}
}
@media(max-width:760px) and (max-height:760px){.ride-ready .ride-stage .hero h1{font-size:49px;margin:10px 0}.ride-ready .ride-stage .hero-desc{font-size:10px;margin-bottom:12px}.ride-ready .ride-stage .hero-product{margin-top:8px;width:min(100%,46svh)}}
@media(max-width:760px) and (max-height:700px){.ride-intro-copy .ride-intro-support{display:none}.ride-intro-copy .eyebrow{margin-bottom:8px}.ride-intro-copy h2{font-size:clamp(31px,min(11vw,calc(var(--ride-stage-height) * .068)),49px)}.ride-enter{min-height:44px;padding-block:10px}.ride-scene-number{font-size:28px}.ride-progress{margin-top:7px}.ride-footer{top:53.5%}}
@media(max-width:370px){.ride-opening-inner{width:calc(100% - 32px)}.ride-intro-copy .eyebrow{font-size:6px;letter-spacing:.08em}.ride-enter{font-size:10px;width:73%;padding-inline:16px}.ride-footer{width:54%}.ride-scenes{width:54%}.ride-scroll-hint{font-size:5.5px}.ride-pause{font-size:6px}}
@media(prefers-reduced-motion:reduce){.ride-ready .ride-welcome-item{will-change:auto}}
@media(prefers-reduced-motion:reduce){.ride-opening,.ride-wheel{display:none!important}.ride-ready .ride-story{height:auto}.ride-ready .ride-stage{position:relative;top:auto;height:auto;overflow:visible}.ride-ready .ride-camera{position:relative;inset:auto;transform:none!important}.ride-ready .ride-camera>.hero{height:auto;min-height:0;padding-block:40px}.ride-ready .hero-product>img{opacity:1!important}}
