/* RaideX public site — studio-1.
   Black and white carry the brand. Red marks selected brand highlights. Green is reserved
   for primary action buttons only. Depth comes from layered transforms driven by two custom
   properties (--px/--py pointer, --sp scroll); nothing here needs a 3D engine. */

/* ---------------------------------------------------------------- tokens */
:root{
  color-scheme:light;
  --ink:#070707;--ink-2:#111;--ink-3:#1b1b1b;--ink-4:#262626;
  --paper:#f3f2ee;--white:#fff;--text:#0b0b0b;--muted:#5d5d5a;--muted-2:#8a8a86;
  --on-dark:#f5f5f2;--on-dark-muted:#a9a9a4;--line:#dedcd6;--line-dark:#ffffff1c;
  --red:#dc2632;--red-bright:#f0323f;--go:#05c46b;--go-press:#03a95b;--go-ink:#03170c;
  --display:"Archivo","Helvetica Neue",Arial,sans-serif;--body:"DM Sans","Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);--ease-out:cubic-bezier(.16,1,.3,1);
  --gutter:clamp(16px,5vw,80px);--max:1320px;--radius:6px;
  --edge:max(var(--gutter),calc((100% - var(--max)) / 2));
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px;-webkit-text-size-adjust:100%;overflow-x:clip}
body{margin:0;background:var(--white);color:var(--text);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--display);font-stretch:112%;font-weight:800;letter-spacing:-.022em;line-height:.98;margin:0;text-wrap:balance}
h1 em,h2 em,h3 em{font-style:normal;color:var(--red)}
p{margin:0 0 1em}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
::selection{background:var(--red);color:#fff}
.visually-hidden,.rx-sprite{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:fixed;left:16px;top:12px;z-index:60;padding:12px 16px;background:var(--white);color:var(--ink);font-weight:700;transform:translateY(-200%)}
.skip-link:focus{transform:none}
.brand-red{color:var(--red)}

/* ---------------------------------------------------------------- type helpers */
.section-eyebrow,.hero-kicker,.category-index,.art-caption,.guide-meta,.listing-badge,.step-where,.store-badge small,.app-status,.footer-col strong,.legal-toc strong,.article-toc strong{
  font-family:var(--display);font-stretch:100%;font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.section-eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--muted);margin-bottom:18px}
.section-eyebrow::before{content:"";width:18px;height:2px;background:var(--red)}
.text-link{display:inline-flex;align-items:center;gap:8px;font-weight:700;border-bottom:1.5px solid currentColor;padding-bottom:2px;transition:gap .2s var(--ease),color .2s}
.text-link:hover{gap:12px;color:var(--red)}
.page-lede{font-size:clamp(17px,1.5vw,20px);color:var(--muted);max-width:62ch}

/* ---------------------------------------------------------------- buttons */
.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border:1.5px solid transparent;border-radius:4px;font-weight:700;font-size:15px;line-height:1.1;cursor:pointer;
  transition:transform .2s var(--ease),background-color .2s,border-color .2s,color .2s,box-shadow .2s;text-align:center}
.button:active{transform:translateY(1px) scale(.99)}
.button-accent{background:var(--go);color:var(--go-ink)}
.button-accent:hover{background:var(--go-press);transform:translateY(-2px);box-shadow:0 10px 24px -12px #05c46bcc}
.button-dark{background:var(--ink);color:var(--white)}
.button-dark:hover{background:var(--ink-4);transform:translateY(-2px)}
.button-quiet{background:transparent;border-color:#0b0b0b33;color:var(--text)}
.button-quiet:hover{border-color:var(--text)}
.button-outline-light{background:transparent;border-color:#ffffff55;color:var(--white)}
.button-outline-light:hover{border-color:var(--white);background:#ffffff0f}
.hero-actions,.hero-ctas,.page-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.load-more{grid-column:1/-1;justify-self:center;min-height:48px;padding:0 26px;border:1.5px solid var(--text);background:transparent;border-radius:4px;font-weight:700;cursor:pointer}
.load-more:hover{background:var(--ink);color:var(--white)}

/* ---------------------------------------------------------------- announcement + nav */
.announcement{min-height:36px;padding:8px var(--gutter);background:var(--ink);color:var(--on-dark-muted);display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px;border-bottom:1px solid var(--line-dark);text-align:center}
.announcement a{color:var(--on-dark);font-weight:600;margin-left:6px;white-space:nowrap}
.announcement a:hover{color:var(--white);text-decoration:underline}
.announce-dot{width:7px;height:7px;flex:none;border-radius:50%;background:var(--red);box-shadow:0 0 0 4px #dc263226}
.site-nav{position:sticky;top:0;z-index:40;height:72px;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:24px;background:#070707eb;color:var(--on-dark);
  -webkit-backdrop-filter:saturate(140%) blur(14px);backdrop-filter:saturate(140%) blur(14px);border-bottom:1px solid var(--line-dark);transition:height .25s var(--ease)}
.site-nav.scrolled{height:62px}
.wordmark{display:flex;align-items:center;width:124px;flex:none}
.wordmark img{width:100%;height:auto;max-height:30px;object-fit:contain;object-position:left center}
.desktop-nav{display:flex;align-items:center;gap:clamp(18px,2.4vw,38px)}
.desktop-nav a{position:relative;font-size:14px;font-weight:600;color:var(--on-dark-muted);padding:8px 0;transition:color .2s}
.desktop-nav a:hover,.desktop-nav a[aria-current]{color:var(--white)}
.desktop-nav a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.desktop-nav a:hover::after,.desktop-nav a[aria-current]::after{transform:scaleX(1)}
.nav-actions{display:flex;align-items:center;gap:12px}
.app-pill{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border:1px solid #ffffff33;border-radius:999px;font-size:13px;font-weight:700;color:var(--on-dark);white-space:nowrap;transition:border-color .2s,background .2s}
.app-pill i{width:7px;height:7px;border-radius:50%;background:var(--red)}
.app-pill.is-live i{background:var(--white)}
.nav-login:hover .app-pill{border-color:var(--white);background:#ffffff10}
.menu-toggle{display:none;width:46px;height:46px;border:1px solid #ffffff33;border-radius:4px;background:transparent;cursor:pointer;position:relative}
.menu-toggle span{position:absolute;left:12px;right:12px;height:2px;background:var(--white);transition:transform .25s var(--ease),top .25s}
.menu-toggle span:first-child{top:17px}.menu-toggle span:last-child{top:26px}
.menu-toggle[aria-expanded="true"] span:first-child{top:21.5px;transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:last-child{top:21.5px;transform:rotate(-45deg)}
.mobile-nav{position:absolute;top:100%;left:0;right:0;max-height:calc(100svh - 72px);overflow:auto;background:var(--ink);border-bottom:1px solid var(--line-dark);padding:12px var(--gutter) 28px;display:grid}
.mobile-nav[hidden]{display:none}
.mobile-nav a{font-family:var(--display);font-stretch:108%;font-weight:700;font-size:24px;padding:14px 0;border-bottom:1px solid var(--line-dark);color:var(--on-dark)}
.mobile-nav a[aria-current]{color:var(--red-bright)}
.mobile-nav .mobile-nav-app{border:0;padding-top:22px}
.mobile-nav .mobile-nav-app .app-pill{font-family:var(--body);font-size:14px;min-height:44px}
@media (max-width:1080px){.desktop-nav{display:none}.menu-toggle{display:block}}
@media (max-width:520px){.nav-actions .nav-login{display:none}.announcement{font-size:12px;justify-content:flex-start;text-align:left}.announcement a{display:none}}

/* ---------------------------------------------------------------- shared vehicle art */
.rx-art{display:block;width:100%;height:auto;overflow:visible}
/* Concept vehicle stills: a body layer plus a wheel layer; each
   wheel is a clipped copy of the wheel layer turned about its own axle by --spin. */
.rx-vehicle{position:relative;display:block;width:100%;aspect-ratio:1600/700}
.rx-vehicle img{position:absolute;inset:0;width:100%;height:100%;display:block;user-select:none;-webkit-user-drag:none}
.rx-v-body{position:absolute;inset:0;z-index:1}
/* The SUV's body layer shows the arch liner where each wheel was, so its wheels sit on top; the bike keeps
   its wheels underneath because the fork, exhaust and calipers are in front of them. */
.rx-art-car .rx-v-wheel{z-index:2}
/* Live 3D (capable desktops only, see rx3d.js): the canvas fades in over the matching still, which then fades out. */
.rx3d-canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block;opacity:0;transition:opacity .7s var(--ease);pointer-events:none;z-index:3}
.rx3d-holder{position:absolute;inset:0;z-index:2;pointer-events:none}
.is-3d > .rx3d-canvas{opacity:1}
.is-3d > .rx-vehicle{opacity:0;transition:opacity .7s var(--ease) .15s}
.story-frame:has(.rx3d-holder.is-3d) .story-visual .rx-vehicle{opacity:0;transition:opacity .7s var(--ease) .15s}
.story-frame:has(.rx3d-holder.is-3d) .story-visual-ev{z-index:4}
.story-frame .story-index,.story-frame .art-caption{z-index:4}
.rx-v-wheel{position:absolute;inset:0;clip-path:circle(var(--r) at var(--cx) var(--cy));transform-origin:var(--cx) var(--cy);transform:rotate(var(--spin,0deg));will-change:transform}

.art-caption{color:var(--on-dark-muted);font-size:11px;letter-spacing:.16em;opacity:.75}
.stage-floor,.hero-floor,.story-floor{position:absolute;left:-30%;right:-30%;bottom:-6%;height:62%;pointer-events:none;
  background:
    linear-gradient(to top,transparent,var(--ink) 92%),
    repeating-linear-gradient(90deg,#ffffff14 0 1px,transparent 1px 64px),
    repeating-linear-gradient(0deg,#ffffff14 0 1px,transparent 1px 64px);
  -webkit-mask:linear-gradient(to top,#000 30%,transparent);mask:linear-gradient(to top,#000 30%,transparent);
  transform-origin:50% 100%;transform:perspective(700px) rotateX(64deg) translate3d(calc(var(--px,0) * var(--d,0) * 30px),0,0)}

/* ---------------------------------------------------------------- hero: a scroll-driven scene
   Tall screens: .hero-track is taller than the viewport and the hero sticks inside it, so the
   extra scroll length (--sp, 0 → 1) drives the camera, the car, its wheels, the road and the route.
   Other screens: the stage measures its own pass through the viewport (--vp) and the car drives
   through the frame. Native scrolling throughout; nothing intercepts wheel or touch input. */
.hero-track{position:relative;background:var(--ink)}
.hero-v2{position:relative;isolation:isolate;overflow:clip;background:var(--ink);color:var(--on-dark);min-height:clamp(620px,calc(100svh - 108px),900px);
  display:grid;grid-template-columns:minmax(0,1fr);align-items:center;padding:clamp(40px,6vw,88px) var(--edge) 120px;--px:0;--py:0}
.hero-sky{position:absolute;inset:0;z-index:-2;background:
  radial-gradient(60% 55% at 72% 62%,#ffffff17,transparent 70%),
  radial-gradient(40% 30% at 90% 70%,#dc263222,transparent 70%),
  linear-gradient(180deg,#050505,#0c0c0c 60%,#070707)}
.hero-mark{position:absolute;right:-6%;top:-10%;width:min(720px,62vw);opacity:.05;z-index:-1;pointer-events:none;
  transform:translate3d(calc(var(--px,0) * var(--d,0) * 40px),calc(var(--py,0) * var(--d,0) * 30px + var(--sp,0) * 170px),0) scale(calc(1 + var(--sp,0) * .14))}
.hero-mark img{width:100%;height:auto;display:block}
.hero-content{position:relative;z-index:3;max-width:min(780px,58vw)}
.hero-kicker{display:flex;align-items:center;gap:12px;color:var(--on-dark-muted);margin-bottom:26px}
.kicker-line{width:34px;height:2px;background:var(--red)}
.hero-v2 h1{font-size:clamp(44px,5.3vw,90px);font-stretch:110%;font-weight:850;line-height:.92;letter-spacing:-.03em}
.hero-v2 h1 span{color:var(--red-bright)}
.hero-lede{margin-top:28px;max-width:42ch;font-size:clamp(17px,1.35vw,19px);color:var(--on-dark-muted)}
.hero-facts{list-style:none;padding:0;margin:34px 0 0;display:flex;flex-wrap:wrap;gap:10px 22px;font-size:14px;color:var(--on-dark)}
.hero-facts li{display:flex;align-items:center;gap:10px}
.hero-facts li::before{content:"";width:6px;height:6px;background:var(--red)}

/* Stage: the drive. --drive is 0 → 1; each layer maps it to its own depth. */
.hero-stage{position:absolute;z-index:1;right:calc(var(--edge) - 5vw);bottom:13%;width:min(50vw,900px);aspect-ratio:800/420;pointer-events:none;
  --drive:clamp(0,calc((var(--vp,.5) - .08) / .84),1);--car-x:calc((.5 - var(--drive)) * 88%);--cam-x:0%;--cam-z:calc(1.03 - var(--drive) * .03);
  --spin:calc(var(--vp,.5) * -1080deg);--draw:calc(.25 + var(--drive) * .75)}
.hero-camera{position:absolute;inset:0;perspective:1400px;transform-origin:70% 80%;transform:translate3d(var(--cam-x),0,0) scale(var(--cam-z))}
.hero-floor{height:78%;bottom:-4%;transform:perspective(700px) rotateX(66deg) translate3d(calc(var(--px,0) * var(--d,0) * 40px),0,0)}
/* Two lane lines at different depths slide at different speeds: that parallax is the road. */
.hero-lane{position:absolute;left:-40%;width:180%;overflow:hidden;pointer-events:none}
.hero-lane i{display:block;width:200%;height:100%;background:repeating-linear-gradient(90deg,#ffffffa6 0 46px,transparent 46px 128px)}
.hero-lane-near{bottom:3%;height:3px;opacity:.5}
.hero-lane-near i{transform:translate3d(calc(var(--drive) * 36% - 30%),0,0)}
.hero-lane-far{bottom:21%;height:1.5px;opacity:.22;left:-10%;width:130%}
.hero-lane-far i{background:repeating-linear-gradient(90deg,#fff 0 22px,transparent 22px 64px);transform:translate3d(calc(var(--drive) * 14% - 20%),0,0)}
.hero-beam{position:absolute;left:-40%;top:18%;width:80%;height:62%;background:radial-gradient(closest-side,#ffffff2b,transparent);filter:blur(8px);
  transform:translate3d(calc(var(--px,0) * var(--d,0) * 30px + var(--car-x) * .5),0,0)}
.hero-route{position:absolute;left:-12%;right:-6%;bottom:6%;width:118%;height:46%;overflow:visible;transform:translate3d(calc(var(--px,0) * var(--d,0) * 26px),0,0)}
.hero-route path{fill:none;stroke-width:2.4}
.hero-route-ghost{stroke:#ffffff1f;stroke-dasharray:6 10}
.hero-route-line{stroke:var(--red-bright);stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--draw));filter:drop-shadow(0 0 6px #f0323f99)}
.hero-car{position:absolute;inset:auto 2% 6% 4%;transform-style:preserve-3d;
  transform:translate3d(calc(var(--car-x) + var(--px,0) * var(--d,0) * 18px),calc(var(--py,0) * var(--d,0) * 8px),0) rotateY(calc(var(--px,0) * -5deg)) rotateX(calc(var(--py,0) * 2deg))}
.hero-car::before{content:"";position:absolute;right:1%;top:40%;width:16%;height:22%;background:radial-gradient(closest-side,#f0323f88,transparent);filter:blur(10px)}
.hero-car::after{content:"";position:absolute;left:-26%;top:42%;width:34%;height:30%;background:linear-gradient(270deg,#ffffff55,transparent);clip-path:polygon(100% 38%,0 0,0 100%,100% 62%);filter:blur(8px);opacity:.38}
/* Speed streaks trail the car only while it is moving (peak mid-drive). */
.hero-streaks{position:absolute;left:94%;top:34%;width:34%;height:38%;display:grid;align-content:space-between;
  opacity:calc(clamp(0,calc(var(--drive) * 5 - .25),1) * clamp(0,calc((1 - var(--drive)) * 5),1));transform:translate3d(calc(var(--drive) * 18%),0,0)}
.hero-streaks i{display:block;height:2px;background:linear-gradient(90deg,#ffffff8c,transparent)}
.hero-streaks i:nth-child(2){width:70%;margin-left:12%;background:linear-gradient(90deg,#f0323fa6,transparent)}
.hero-streaks i:nth-child(3){width:85%;margin-left:4%}
.rx-spin{transform-box:fill-box;transform-origin:center;transform:rotate(var(--spin,0deg))}
.hero-stage .art-caption{position:absolute;right:4%;bottom:-8%}
.hero-live-stage{position:absolute;z-index:4;right:var(--edge);bottom:112px;display:flex;gap:14px;align-items:flex-end}
.hero-live-stage[hidden]{display:none}
.hero-live-card{position:relative;display:block;width:clamp(150px,15vw,230px);aspect-ratio:4/3;overflow:hidden;border-radius:var(--radius);border:1px solid #ffffff2e;background:var(--ink-3);box-shadow:0 24px 50px -20px #000}
.hero-live-card[hidden]{display:none}
.hero-live-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.hero-live-card:hover img{transform:scale(1.05)}
.hero-live-label{position:absolute;left:0;right:0;bottom:0;padding:22px 12px 10px;background:linear-gradient(transparent,#000d);display:grid;font-size:13px}
.hero-live-label small{font-size:10px;letter-spacing:.14em;color:var(--on-dark-muted)}
.hero-live-label i{position:absolute;right:10px;bottom:10px;font-style:normal}
.hero-live-note{position:absolute;right:0;top:-28px;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--on-dark-muted);white-space:nowrap}
.hero-live-note i{width:6px;height:6px;border-radius:50%;background:var(--white)}
.hero-v2.has-live .hero-stage{opacity:.5}
.hero-caption{position:absolute;left:var(--edge);right:var(--edge);bottom:30px;display:flex;justify-content:space-between;align-items:center;z-index:3;
  font-family:var(--display);font-size:12px;letter-spacing:.14em;color:var(--on-dark-muted)}
.hero-scroll{display:inline-flex;align-items:center;gap:12px;color:var(--on-dark);text-transform:uppercase;min-height:44px}
.hero-scroll span{width:1px;height:30px;background:linear-gradient(var(--white),transparent)}
.hero-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:#ffffff14;z-index:3;display:none}
.hero-progress i{display:block;height:100%;background:var(--red-bright);transform-origin:left;transform:scaleX(var(--sp,0))}

/* Wide but short screens (no pin): the stage is already on screen at load, so the car starts parked
   and drives left as the hero scrolls away. */
@media (min-width:901px){
  .hero-stage{--drive:clamp(0,calc((var(--vp,.3) - .3) / .6),1);--car-x:calc(var(--drive) * -72%);--draw:calc(.3 + var(--drive) * .7)}
}
/* Pinned version for screens tall enough to hold the whole hero. Only when motion runs (.motion-boot is set
   before first paint and never under reduced motion), so there is never a stretch of scroll where nothing happens. */
@media (min-width:901px) and (min-height:760px){
  .motion-boot .hero-track{height:190svh}
  .motion-boot .hero-v2{position:sticky;top:62px;height:calc(100svh - 108px);min-height:0;padding-top:clamp(24px,4vh,64px);padding-bottom:96px}
  /* Two beats: the car rolls a short way while the camera pushes in (clear of the headline), then, once the
     copy has stepped back, it accelerates out to the left. Road, streaks and route follow the combined drive. */
  .motion-boot .hero-stage{--roll:clamp(0,calc((var(--sp,0) - .04) / .5),1);--exit:clamp(0,calc((var(--sp,0) - .56) / .38),1);
    --drive:calc(var(--roll) * .4 + var(--exit) * .6);--car-x:calc(var(--roll) * -20% + var(--exit) * -104%);--cam-x:calc(var(--roll) * 6% + var(--exit) * 12%);
    --cam-z:calc(1 + var(--roll) * .1 - var(--exit) * .04);--spin:calc(var(--sp,0) * -1440deg);--draw:calc(.3 + var(--drive) * .7)}
  /* The copy steps back only late in the pinned phase, as the car crosses under it and the next section arrives. */
  .motion-boot .hero-content,.motion-boot .hero-caption{--fade:clamp(0,calc((var(--sp,0) - .38) / .22),1);opacity:calc(1 - var(--fade));transform:translate3d(0,calc(var(--fade) * -44px),0)}
  .motion-boot .hero-progress{display:block}
}
@media (max-width:900px){
  .hero-v2{grid-template-columns:1fr;align-items:start;padding-bottom:110px;min-height:0}
  .hero-content{max-width:640px}
  .hero-stage{position:relative;right:auto;bottom:auto;width:104%;margin:36px -2% 18px;aspect-ratio:800/400}
  .hero-live-stage{position:relative;right:auto;bottom:auto;margin-top:34px;justify-content:flex-start}
  .hero-live-note{left:0;right:auto}
  .hero-v2.has-live .hero-stage{display:none}
  .hero-mark{width:90vw;right:-30%;top:auto;bottom:10%}
}
@media (max-width:520px){.hero-caption span:first-child{display:none}.hero-caption{justify-content:flex-end}}

/* ---------------------------------------------------------------- sections */
.section-pad{padding:clamp(80px,10vw,148px) var(--edge)}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px 64px;flex-wrap:wrap;margin-bottom:clamp(40px,5vw,72px)}
.section-head h2,.places-head h2,.trust-intro h2,.host-band h2,.download-section h2,.faq-tease h2,.inner-head h2{font-size:clamp(38px,5vw,76px)}
.section-side,.section-side-text{max-width:420px;color:var(--muted);font-size:17px}
.section-side p{margin-bottom:14px}
.section-side-text a,.places-head a,.trust-intro a,.trust-item a,.store-pending a{text-decoration:underline;text-underline-offset:3px;font-weight:600}

/* ---------------------------------------------------------------- category story (sticky stage) */
.category-story{background:var(--white)}
.story-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(32px,6vw,96px);align-items:start}
.story-stage{position:sticky;top:96px;height:min(640px,calc(100svh - 140px));min-height:420px}
.story-frame{position:relative;height:100%;overflow:hidden;border-radius:var(--radius);background:radial-gradient(70% 60% at 50% 70%,#1f1f1f,var(--ink) 75%);perspective:1400px;
  transform:perspective(1600px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s var(--ease-out)}
.story-frame.is-tilting{transition:transform .12s linear}
.story-floor{height:70%;opacity:.9}
.story-visual{position:absolute;inset:0;margin:0;display:grid;place-items:center;padding:12% 8% 16%;opacity:0;visibility:hidden;
  transform:translate3d(18%,0,-240px) rotateY(-32deg) scale(.86);transition:transform .65s var(--ease-out),visibility 0s linear .65s}
.story-visual.is-active{opacity:1;visibility:visible;transform:none;transition:transform .65s var(--ease-out),visibility 0s}
.story-visual .rx-art{width:100%}

.story-live-photo{position:absolute;inset:12% 10% 18%;width:80%;height:70%;object-fit:cover;border-radius:4px;box-shadow:0 40px 60px -24px #000}
.story-visual.has-photo .rx-art{opacity:0}
.ev-bolt{position:absolute;top:22%;right:16%;width:54px;height:54px;fill:var(--red-bright);filter:drop-shadow(0 0 16px #f0323f88)}
.story-index{position:absolute;left:24px;top:22px;font-family:var(--display);font-size:13px;letter-spacing:.14em;color:var(--on-dark-muted)}
.story-index b{color:var(--white);font-size:28px;font-stretch:115%;margin-right:4px}
.story-frame .art-caption{position:absolute;right:22px;bottom:18px}
.story-chapter{min-height:min(78vh,720px);display:flex;flex-direction:column;justify-content:center;padding:24px 0;border-top:1px solid var(--line)}
.story-chapter:first-child{border-top:0}
.story-chapter h3{font-size:clamp(34px,3.6vw,56px);margin:14px 0 18px}
.story-chapter p{color:var(--muted);font-size:18px;max-width:42ch}
.category-index{color:var(--red)}
.story-count{font-size:14px!important;font-weight:600;color:var(--text)!important;display:flex;align-items:center;gap:8px;margin-bottom:22px!important}
.story-count::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ink)}
.story-chapter .text-link{align-self:flex-start}
.story-inline-art{display:none}
.motion-ready .story-chapter{opacity:.32;transition:opacity .5s var(--ease)}
.motion-ready .story-chapter.is-active{opacity:1}
@media (max-width:900px){
  .story-grid{grid-template-columns:1fr}
  .story-stage{display:none}
  .story-chapter,.motion-ready .story-chapter{min-height:0;opacity:1;padding:36px 0}
  .story-inline-art{display:block;position:relative;overflow:hidden;border-radius:var(--radius);background:radial-gradient(70% 70% at 50% 70%,#222,var(--ink));padding:10% 8% 8%;margin-bottom:24px}
  
  
}

/* ---------------------------------------------------------------- vehicle cards + inventory */
.inventory{background:var(--paper)}
.inventory-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:28px}
.inventory-tabs,.explore-tabs{display:inline-flex;gap:4px;padding:4px;border:1px solid var(--line);border-radius:6px;background:var(--white)}
.filter-tab,.explore-tab{min-height:42px;padding:0 18px;border:0;border-radius:4px;background:transparent;font-weight:700;font-size:14px;cursor:pointer;display:inline-flex;align-items:center;color:var(--muted);transition:background .2s,color .2s}
.filter-tab:hover,.explore-tab:hover{color:var(--text)}
.filter-tab.active,.explore-tab[aria-current]{background:var(--ink);color:var(--white)}
.result-count{font-size:14px;color:var(--muted);font-weight:600}
.vehicle-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:clamp(16px,2vw,28px)}
.vehicle-card{--rx:0deg;--ry:0deg;position:relative;display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  transform:perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .45s var(--ease-out),box-shadow .3s,border-color .3s}
.vehicle-card.is-tilting{transition:transform .1s linear,box-shadow .3s}
.vehicle-card::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),#ffffff40,transparent 45%)}
.vehicle-card:hover{box-shadow:0 30px 50px -30px #0007;border-color:#0b0b0b40}
.vehicle-card:hover::after{opacity:1}
.vehicle-card:focus-visible{outline-offset:4px}
.vehicle-photo-wrap{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--ink-3)}
.vehicle-image{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s var(--ease-out)}
.vehicle-card:hover .vehicle-image{transform:scale(1.05)}
.listing-badge{position:absolute;left:12px;top:12px;padding:6px 9px;background:#070707cc;color:var(--white);border-radius:3px;font-size:10px}
.photo-placeholder{height:100%;min-height:180px;display:grid;place-items:center;align-content:center;gap:10px;padding:10% 12%;background:radial-gradient(80% 80% at 50% 70%,#242424,var(--ink));color:var(--on-dark-muted);font-size:12px;text-align:center}
.photo-placeholder .rx-art{width:100%}

.vehicle-body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.vehicle-top{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.vehicle-top h3{font-size:20px;font-stretch:104%;line-height:1.15;letter-spacing:-.01em}
.rate{text-align:right;font-weight:700;font-size:16px;white-space:nowrap;display:grid}
.rate small{font-size:11px;color:var(--muted);font-weight:500}
.vehicle-meta{color:var(--muted);font-size:14px;margin:0}
.vehicle-foot{margin-top:auto;padding-top:12px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;font-weight:600}
.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:var(--paper);font-size:12px;font-weight:700}
.inventory-message{padding:20px 22px;border:1px solid var(--line);border-left:3px solid var(--red);background:var(--white);color:var(--text);border-radius:4px;margin:0 0 20px;font-size:15px}
.inventory-message a{text-decoration:underline}
.inventory-empty{padding:48px 28px;border:1px dashed #0b0b0b33;border-radius:var(--radius);text-align:center;background:var(--white)}
.inventory-empty h2{font-size:clamp(24px,2.6vw,34px);margin-bottom:12px}
.inventory-empty p{color:var(--muted);max-width:52ch;margin:0 auto 20px}
.explore-empty{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:center;padding:clamp(20px,3vw,36px);border:1px solid var(--line);border-radius:var(--radius);background:var(--white)}
.explore-empty[hidden]{display:none}
.explore-empty-art{position:relative;border-radius:4px;background:radial-gradient(80% 80% at 50% 70%,#262626,var(--ink));padding:12% 8% 14%}


.explore-empty-art .art-caption{position:absolute;right:14px;bottom:12px}
.explore-empty h2,.explore-empty h3{font-size:clamp(28px,3vw,44px);margin-bottom:14px}
.explore-empty p{color:var(--muted);font-size:17px}
@media (max-width:760px){.explore-empty{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- how it works (dark, route draws with scroll) */
.how-section{background:var(--ink);color:var(--on-dark)}
.how-section .section-eyebrow{color:var(--on-dark-muted)}
.how-section .section-side-text{color:var(--on-dark-muted)}
.journey{position:relative}
.journey-line{position:absolute;left:0;right:0;top:0;width:100%;height:40px;overflow:visible}
.journey-line path{fill:none;stroke-width:2}
.journey-line-ghost{stroke:#ffffff26;stroke-dasharray:4 8}
.journey-line-draw{stroke:var(--red-bright);stroke-dasharray:1;stroke-dashoffset:max(0,calc(1 - var(--sp,1) * 1.9))}
.journey-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,44px)}
.journey-step{position:relative;padding-top:64px}
.journey-step::before{content:"";position:absolute;top:13px;left:0;width:14px;height:14px;border-radius:50%;background:var(--ink);border:2px solid var(--red-bright)}
.step-number{font-family:var(--display);font-stretch:120%;font-weight:800;font-size:clamp(44px,4vw,64px);line-height:1;color:#ffffff24;display:block;margin-bottom:16px}
.journey-step h3{font-size:clamp(24px,2vw,30px);margin-bottom:12px}
.journey-step p{color:var(--on-dark-muted);font-size:16px}
.step-where{display:inline-block;margin-top:6px;padding:6px 10px;border:1px solid #ffffff2e;border-radius:3px;color:var(--on-dark);font-size:11px}
@media (max-width:900px){
  .journey-grid{grid-template-columns:1fr 1fr}
  .journey-line{display:none}
  .journey-step{padding-top:0;padding-left:30px;border-left:1px solid #ffffff26}
  .journey-step::before{top:4px;left:-8px}
}
@media (max-width:560px){.journey-grid{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- trust */
.trust-section{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(40px,7vw,120px);align-items:start;background:var(--white)}
.trust-intro{position:sticky;top:110px}
.trust-intro p{color:var(--muted);font-size:17px;max-width:44ch;margin-top:24px}
.trust-list{list-style:none;margin:0;padding:0}
.trust-item{display:grid;grid-template-columns:72px 1fr;gap:20px;padding:32px 0;border-top:1px solid var(--line)}
.trust-item:last-child{border-bottom:1px solid var(--line)}
.trust-num{font-family:var(--display);font-weight:800;font-stretch:120%;font-size:28px;color:var(--red)}
.trust-item h3{font-size:clamp(22px,2vw,28px);margin-bottom:10px;font-stretch:106%}
.trust-item p{color:var(--muted);margin:0;max-width:52ch}
@media (max-width:900px){.trust-section{grid-template-columns:1fr}.trust-intro{position:static}.trust-item{grid-template-columns:52px 1fr}}

/* ---------------------------------------------------------------- host band */
.host-band{position:relative;overflow:hidden;background:var(--ink);color:var(--on-dark);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:center;padding:clamp(80px,10vw,140px) var(--edge) 120px}
.host-band .section-eyebrow{color:var(--on-dark-muted)}
.host-band-art{position:relative;aspect-ratio:4/3;perspective:1200px;border-radius:var(--radius);overflow:hidden;background:radial-gradient(70% 70% at 50% 72%,#232323,var(--ink) 80%)}
.stage-vehicle{position:absolute;inset:6% 2% 10%;display:grid;place-items:center;transform:translate3d(calc(var(--px,0) * var(--d,0) * 18px),calc(var(--py,0) * var(--d,0) * 10px),0) rotateY(calc(var(--px,0) * -6deg))}

.host-band-art .art-caption{position:absolute;right:16px;bottom:14px}
.host-band-copy p{color:var(--on-dark-muted);font-size:18px;max-width:48ch;margin-top:24px}
.host-band-note{position:absolute;left:var(--edge);right:var(--edge);bottom:34px;display:flex;gap:28px;flex-wrap:wrap;font-family:var(--display);font-size:12px;letter-spacing:.16em;color:#ffffff59}
.host-band-note span::before{content:"";display:inline-block;width:6px;height:6px;background:var(--red);margin-right:10px;vertical-align:middle}
@media (max-width:900px){.host-band{grid-template-columns:1fr}.host-band-art{order:2}}

/* ---------------------------------------------------------------- places, chips */
.places-section{background:var(--paper)}
.places-head{max-width:760px;margin-bottom:32px}
.places-head p{color:var(--muted);font-size:17px;margin-top:18px}
.place-chips{display:flex;flex-wrap:wrap;gap:10px}
.place-chip{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 18px;border:1.5px solid #0b0b0b26;border-radius:999px;font-weight:700;background:var(--white);transition:background .2s,color .2s,border-color .2s}
.place-chip small{font-weight:500;color:var(--muted);font-size:13px}
.place-chip:hover{background:var(--ink);color:var(--white);border-color:var(--ink)}
.place-chip:hover small{color:var(--on-dark-muted)}
.place-loading{color:var(--muted);font-size:15px}

/* ---------------------------------------------------------------- journal cards */
.journal-section{background:var(--white)}
.guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:clamp(16px,2vw,28px)}
.guide-grid-home{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr)}
.guide-grid-index{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:32px}
.guide-grid-index .guide-card-featured{grid-column:span 2}
.guide-card{--rx:0deg;--ry:0deg;position:relative;display:flex;flex-direction:column;gap:12px;padding:0 0 24px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  transform:perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .45s var(--ease-out),box-shadow .3s,border-color .3s}
.guide-card.is-tilting{transition:transform .1s linear,box-shadow .3s}
.guide-card:hover{box-shadow:0 30px 50px -32px #0007;border-color:#0b0b0b40}
.guide-card > :not(.guide-plate){margin-left:24px;margin-right:24px}
.guide-card h2,.guide-card h3{font-size:clamp(21px,1.8vw,26px);font-stretch:104%;line-height:1.12;letter-spacing:-.012em}
.guide-card-featured h2,.guide-card-featured h3{font-size:clamp(26px,2.6vw,38px)}
.guide-card p{color:var(--muted);font-size:15px;margin:0}
.guide-meta{color:var(--muted);font-size:11px;margin-top:8px}
.read-link{margin-top:auto;padding-top:8px;font-weight:700;font-size:14px;display:inline-flex;gap:6px;transition:gap .2s}
.guide-card:hover .read-link{gap:10px;color:var(--red)}
.guide-plate{position:relative;display:block;aspect-ratio:16/7;background:var(--ink);overflow:hidden;margin-bottom:8px}
.guide-card-featured .guide-plate{aspect-ratio:16/8}.guide-grid-index .guide-card-featured .guide-plate{aspect-ratio:16/5}
.guide-plate b{position:absolute;left:22px;bottom:14px;font-family:var(--display);font-stretch:125%;font-weight:850;font-size:clamp(56px,6vw,96px);line-height:1;color:var(--white);letter-spacing:-.04em}
.guide-plate i{position:absolute;inset:0;background:repeating-linear-gradient(90deg,#ffffff12 0 1px,transparent 1px 40px);transition:transform .8s var(--ease-out)}
.guide-plate::after{content:"";position:absolute;right:-10%;top:50%;width:70%;height:3px;background:var(--red-bright);transform:rotate(-14deg);transform-origin:right;box-shadow:0 0 18px #f0323f88}
.guide-plate-bike::after{transform:rotate(-26deg)}
.guide-plate-host::after{transform:rotate(0);top:62%}
.guide-card:hover .guide-plate i{transform:translateX(-20px)}
.journal-count{color:var(--muted);font-size:14px;font-weight:600;margin-top:32px}
@media (max-width:1000px){.guide-grid-home,.guide-grid-index{grid-template-columns:1fr 1fr}.guide-grid-home .guide-card-featured{grid-column:span 2}}
@media (max-width:640px){.guide-grid-home,.guide-grid-index{grid-template-columns:1fr}.guide-grid-home .guide-card-featured,.guide-grid-index .guide-card-featured{grid-column:auto}}

/* ---------------------------------------------------------------- app availability */
.download-section{background:linear-gradient(160deg,#0d0d0d,var(--ink) 55%);color:var(--on-dark);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(40px,6vw,96px);align-items:center;padding:clamp(80px,10vw,140px) var(--edge)}
.download-copy p{color:var(--on-dark-muted);font-size:18px;max-width:52ch;margin-top:22px}
.app-status{display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border:1px solid #ffffff33;border-radius:999px;margin-bottom:26px;color:var(--on-dark)}
.app-status i{width:8px;height:8px;border-radius:50%;background:var(--red)}
.app-status.is-live i{background:var(--white)}
.store-area{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.store-badge{display:grid;gap:2px;min-width:180px;min-height:60px;padding:10px 18px;border:1.5px dashed #ffffff40;border-radius:6px;color:var(--on-dark-muted);cursor:not-allowed}
.store-badge small{font-size:10px}
.store-badge strong{font-family:var(--display);font-size:18px;font-weight:700;color:var(--on-dark)}
.store-badge.is-live{border-style:solid;border-color:var(--white);background:var(--white);color:var(--ink);cursor:pointer}
.store-badge.is-live strong{color:var(--ink)}
.store-pending{font-size:14px!important;margin-top:18px!important}
.download-art{position:relative;justify-self:center;width:min(320px,70vw);aspect-ratio:1;perspective:1200px;--rx:0deg;--ry:0deg}
.download-tile{position:absolute;inset:12%;display:grid;place-items:center;border-radius:22%;background:linear-gradient(145deg,#2a2a2a,#050505 60%);border:1px solid #ffffff22;
  box-shadow:inset 0 1px 0 #ffffff26,0 50px 80px -30px #000;transform:rotateX(calc(16deg + var(--rx))) rotateY(calc(-22deg + var(--ry))) rotateZ(4deg);transition:transform .6s var(--ease-out)}
.download-art.is-tilting .download-tile{transition:transform .12s linear}
.download-tile img{width:52%;height:auto}
.download-tile::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 35%,#ffffff1c 50%,transparent 65%)}
.download-tile-shadow{position:absolute;left:16%;right:16%;bottom:0;height:10%;border-radius:50%;background:radial-gradient(closest-side,#dc263255,transparent);filter:blur(6px)}
@media (max-width:900px){.download-section{grid-template-columns:1fr}.download-art{width:min(240px,60vw)}}

/* ---------------------------------------------------------------- FAQ */
.faq-tease{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,96px);background:var(--paper)}
.faq-tease-intro .text-link{margin-top:28px}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item:first-child{border-top:1px solid var(--line)}
.faq-item summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;cursor:pointer;font-family:var(--display);font-stretch:104%;font-weight:700;font-size:clamp(18px,1.6vw,22px);line-height:1.25}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary span{flex:none;display:grid;place-items:center;width:34px;height:34px;border:1.5px solid #0b0b0b33;border-radius:50%;font-family:var(--body);font-size:18px;transition:transform .3s var(--ease),background .2s,color .2s}
.faq-item[open] summary span{transform:rotate(45deg);background:var(--ink);color:var(--white);border-color:var(--ink)}
.faq-item p{color:var(--muted);max-width:68ch;padding-bottom:22px;margin:0}
.faq-search{display:block;margin:40px 0 24px}
.faq-search input{width:100%;min-height:60px;padding:0 20px;border:1.5px solid var(--line);border-radius:6px;background:var(--white);font-size:18px}
.faq-search input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 4px #0b0b0b12}
.faq-empty{color:var(--muted)}
.faq-empty a{text-decoration:underline}
@media (max-width:900px){.faq-tease{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- footer */
.site-footer{background:var(--ink);color:var(--on-dark);padding:clamp(56px,7vw,96px) var(--edge) 28px;overflow:hidden}
.footer-display{font-family:var(--display);font-stretch:125%;font-weight:850;font-size:clamp(44px,9vw,150px);line-height:.9;letter-spacing:-.04em;margin-bottom:clamp(48px,6vw,80px);
  color:transparent;-webkit-text-stroke:1px #ffffff2e;text-wrap:balance}
.footer-main{display:grid;grid-template-columns:1.6fr repeat(3,1fr) 1.3fr;gap:36px;padding-bottom:48px;border-bottom:1px solid var(--line-dark)}
.footer-brand-col p{color:var(--on-dark-muted);font-size:15px;max-width:34ch;margin:20px 0}
.footer-col{display:grid;align-content:start;gap:12px}
.footer-col strong{color:var(--on-dark-muted);font-size:11px;margin-bottom:6px}
.footer-col a{color:var(--on-dark);font-size:15px;width:fit-content;transition:color .2s}
.footer-col a:hover{color:var(--red-bright)}
.footer-note p{color:var(--on-dark-muted);font-size:14px;margin:6px 0 0}
.footer-app-link{display:inline-flex}
.footer-credits{margin:0;padding:20px 0 0;font-size:12px;line-height:1.6;color:var(--on-dark-muted);max-width:90ch}
.footer-credits a{color:var(--on-dark);text-decoration:underline;text-underline-offset:2px}
.footer-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:24px;font-size:13px;color:var(--on-dark-muted)}
.footer-bottom a:hover{color:var(--white)}
.footer-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--red);margin-left:6px;vertical-align:middle}
@media (max-width:1000px){.footer-main{grid-template-columns:1fr 1fr}.footer-brand-col{grid-column:1/-1}}
@media (max-width:480px){.footer-main{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- editorial pages */
.marketing-page{padding:0 var(--edge) clamp(80px,9vw,128px)}
.marketing-page > h1{font-size:clamp(40px,5.6vw,84px);margin-bottom:22px}
.marketing-page > .section-eyebrow:first-child,.marketing-page > .article-back:first-child{margin-top:48px}
.article-back{display:flex;width:fit-content;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--muted);margin-bottom:22px;min-height:32px}
.article-back:hover{color:var(--text)}
.breadcrumbs{padding:18px 0}
.breadcrumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--muted)}
.breadcrumbs li+li::before{content:"/";margin-right:6px;color:var(--muted-2)}
.breadcrumbs a:hover{color:var(--text);text-decoration:underline}

/* Full-bleed dark page opener with layered art. */
.page-stage,.page-hero-dark{position:relative;isolation:isolate;overflow:hidden;margin:0 calc(50% - 50vw) clamp(56px,7vw,96px);padding:clamp(56px,8vw,112px) max(var(--gutter),calc((100vw - var(--max)) / 2));
  background:radial-gradient(60% 70% at 80% 70%,#ffffff12,transparent 70%),var(--ink);color:var(--on-dark);--px:0;--py:0}
.page-stage{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,80px);align-items:center;min-height:min(620px,calc(100svh - 108px))}
.page-stage-plain,.page-stage-compact{min-height:0}
.page-stage-plain{grid-template-columns:minmax(0,1fr)}
.page-stage-compact{padding-top:clamp(48px,6vw,88px);padding-bottom:clamp(48px,6vw,88px)}
.page-stage .article-back{color:var(--on-dark-muted)}
.page-stage .article-back:hover{color:var(--white)}
.page-stage .section-eyebrow,.page-hero-dark .section-eyebrow{color:var(--on-dark-muted)}
.page-stage h1,.page-hero-dark h1{font-size:clamp(40px,4.8vw,80px);font-stretch:112%;line-height:.95}
.page-stage-compact h1{font-size:clamp(36px,4.4vw,66px)}
.page-stage h1 em,.page-hero-dark h1 em{color:var(--red-bright)}
.page-stage-lede,.page-hero-dark > p,.explore-hero-copy > p{color:var(--on-dark-muted);font-size:clamp(17px,1.4vw,20px);max-width:58ch;margin-top:24px}
.page-stage-lede a,.page-hero-dark p a:not(.button){color:var(--on-dark);text-decoration:underline;text-underline-offset:3px}
.page-stage-art{position:relative}
.stage-scene{position:relative;aspect-ratio:5/4;perspective:1200px}
.stage-scene .stage-floor{height:70%}
.stage-glow{position:absolute;inset:20% 10% 10%;background:radial-gradient(closest-side,#ffffff1f,transparent);transform:translate3d(calc(var(--px,0) * var(--d,0) * 30px),0,0)}
.stage-scene .art-caption{position:absolute;right:0;bottom:0}
.stage-scene-route{display:grid;place-items:center}
.stage-scene-route > div{width:min(420px,90%);transform:translate3d(calc(var(--px,0) * var(--d,0) * 24px),calc(var(--py,0) * var(--d,0) * 16px),0)}
.page-note{color:var(--on-dark-muted);font-size:14px;margin-top:22px;max-width:58ch}
.status-chip{display:inline-flex;align-items:center;gap:8px;padding:5px 12px;margin-right:8px;border:1px solid #ffffff38;border-radius:999px;color:var(--on-dark);font-weight:700;font-size:12px}
.status-chip::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--red)}
.legal-meta{font-size:14px!important;color:var(--on-dark-muted)!important;margin-top:18px}
.legal-meta a{text-decoration:underline}
@media (max-width:900px){.page-stage{grid-template-columns:1fr;min-height:0}.page-stage-art{max-width:560px}}

/* Route motif (decorative). */
.page-route-art{width:100%;height:auto;overflow:visible}
.pra-orbit{fill:none;stroke:#ffffff1f;stroke-width:1}
.pra-ghost{fill:none;stroke:#ffffff26;stroke-width:2;stroke-dasharray:6 9}
.pra-route{fill:none;stroke:var(--red-bright);stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0;filter:drop-shadow(0 0 6px #f0323f88)}
.pra-route-glint{fill:none;stroke:none}
.pra-stop{fill:var(--ink);stroke:var(--white);stroke-width:2}
.pra-end{fill:var(--red-bright);stroke:none}

.inner-section{margin:clamp(64px,8vw,112px) 0}
.inner-head{margin-bottom:36px;max-width:760px}
.inner-head p{color:var(--muted);font-size:17px;margin-top:16px}
.page-content-grid,.principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,40px);margin:clamp(48px,6vw,80px) 0}
.value-card,.principle{padding-top:24px;border-top:2px solid var(--ink)}
.value-card > span:first-child,.principle > span{font-family:var(--display);font-size:12px;letter-spacing:.14em;color:var(--red);font-weight:700}
.value-card h2,.value-card h3,.principle h2{font-size:clamp(22px,2vw,30px);font-stretch:106%;line-height:1.1;margin:14px 0 12px}
.value-card p,.principle p{color:var(--muted);margin:0}
.value-card a,.cms-section a:not(.button),.seo-section a:not(.button):not(.text-link):not(.place-chip),.legal-body a,.founder-story a{text-decoration:underline;text-underline-offset:3px}
.control-card .need-icon{margin-bottom:6px}
@media (max-width:900px){.page-content-grid,.principles{grid-template-columns:1fr}}

.manifesto{margin:clamp(56px,7vw,96px) 0;padding:clamp(32px,4vw,56px) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.manifesto h2{font-family:var(--display);font-size:12px;letter-spacing:.16em;color:var(--muted);font-weight:700;font-stretch:100%;margin-bottom:18px}
.manifesto p{font-family:var(--display);font-stretch:108%;font-weight:700;font-size:clamp(24px,3vw,42px);line-height:1.15;letter-spacing:-.015em;max-width:26ch;margin:0}
.manifesto a{text-decoration:underline;text-underline-offset:4px}
.manifesto-motto{border:0;margin-inline:calc(50% - 50vw);padding:clamp(64px,8vw,112px) max(var(--gutter),calc((100vw - var(--max)) / 2));background:var(--ink);color:var(--on-dark)}
.manifesto-motto h2{color:var(--on-dark-muted)}
.manifesto-motto p{font-size:clamp(34px,5vw,76px);font-stretch:118%;font-weight:850;max-width:none;line-height:1}
.manifesto-motto .brand-red{color:var(--red-bright)}

/* Founder story */
.founder-story{max-width:740px;font-size:clamp(17px,1.3vw,19px);line-height:1.75}
.founder-story h2{font-size:clamp(28px,3vw,42px);margin:56px 0 18px}
.story-lede{font-size:clamp(21px,2vw,26px);line-height:1.5;font-weight:500}
.story-quote{margin:48px 0;padding:0 0 0 28px;border-left:3px solid var(--red)}
.story-quote p{font-family:var(--display);font-stretch:108%;font-weight:700;font-size:clamp(24px,2.6vw,36px);line-height:1.2;letter-spacing:-.015em;margin:0}
.story-flow{margin:48px 0}
.story-flow ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.story-flow li{display:grid;gap:8px;padding:24px 20px;border-right:1px solid var(--line);font-size:15px;line-height:1.5}
.story-flow li:last-child{border-right:0;background:var(--ink);color:var(--on-dark)}
.story-flow li span:last-child{color:var(--muted)}
.story-flow li:last-child span:last-child{color:var(--on-dark-muted)}
.story-flow strong{font-family:var(--display);font-size:20px}
.flow-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1.5px solid currentColor}
.flow-icon-live{color:var(--red-bright)}
.ui-icon{width:22px;height:22px}
.story-signoff{margin-top:40px;padding-top:24px;border-top:1px solid var(--line)}
@media (max-width:640px){.story-flow ol{grid-template-columns:1fr}.story-flow li{border-right:0;border-bottom:1px solid var(--line)}}

/* Hosts */
.host-timeline{list-style:none;margin:0;padding:0;display:grid;gap:0;max-width:880px;counter-reset:none}
.host-timeline-step{position:relative;display:grid;grid-template-columns:64px 1fr;gap:20px;padding:0 0 40px}
.host-timeline-step::before{content:"";position:absolute;left:21px;top:46px;bottom:4px;width:2px;background:var(--line)}
.host-timeline-step:last-child::before{display:none}
.step-dot{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--white);font-family:var(--display);font-weight:800;font-size:14px;position:relative;z-index:1}
.host-timeline-step h3{font-size:clamp(22px,2vw,28px);margin:8px 0 10px}
.host-timeline-step p{color:var(--muted);max-width:62ch;margin:0}
.need-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.need-card{display:grid;gap:10px;align-content:start;padding:26px 24px;background:var(--white)}
.need-card strong{font-family:var(--display);font-size:19px;font-stretch:104%}
.need-card span:last-child{color:var(--muted);font-size:15px}
.need-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:6px;background:var(--paper);color:var(--ink)}
@media (max-width:900px){.need-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.need-grid{grid-template-columns:1fr}}
.faq-page-list{max-width:900px}

/* Legal */
.legal-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.legal-toc,.article-toc{position:sticky;top:96px;font-size:14px}
.legal-toc strong,.article-toc strong{display:block;color:var(--muted);font-size:11px;margin-bottom:14px}
.legal-toc ol,.article-toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;border-left:1px solid var(--line)}
.legal-toc a,.article-toc a{display:block;padding:7px 0 7px 16px;margin-left:-1px;border-left:2px solid transparent;color:var(--muted);line-height:1.35;transition:color .2s,border-color .2s}
.legal-toc a:hover,.article-toc a:hover{color:var(--text)}
.legal-toc a.is-current,.article-toc a.is-current{color:var(--text);border-left-color:var(--red);font-weight:600}
.legal-body{max-width:760px;font-size:17px;line-height:1.7}
.legal-section{padding-bottom:36px;margin-bottom:36px;border-bottom:1px solid var(--line);scroll-margin-top:96px}
.legal-section h2{font-size:clamp(22px,2vw,28px);font-stretch:106%;margin-bottom:16px}
.legal-section ul{padding-left:20px}
.legal-section li{margin-bottom:8px}
@media (max-width:900px){.legal-layout{grid-template-columns:1fr}.legal-toc{position:static;padding:18px;border:1px solid var(--line);border-radius:6px}}

/* Journal article */
.read-progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:50;pointer-events:none}
.read-progress span{display:block;height:100%;background:var(--red);transform-origin:left;transform:scaleX(0)}
.article{padding-top:48px}
.article-head{max-width:900px;margin-bottom:clamp(40px,5vw,72px)}
.article-head h1{font-size:clamp(38px,5.4vw,80px);margin-bottom:28px}
.article-intro{font-size:clamp(20px,1.8vw,25px);line-height:1.5;font-weight:500;max-width:52ch}
.article-byline{font-size:14px;color:var(--muted);padding-top:18px;border-top:1px solid var(--line);margin-top:28px}
.article-layout{display:grid;grid-template-columns:240px minmax(0,720px);gap:clamp(32px,6vw,96px);align-items:start}
.article-body{font-size:clamp(17px,1.3vw,19px);line-height:1.75}
.article-body section{margin-bottom:44px;scroll-margin-top:96px}
.article-body h2{display:flex;gap:16px;align-items:baseline;font-size:clamp(24px,2.4vw,34px);font-stretch:106%;line-height:1.12;margin-bottom:16px}
.article-num{font-size:.55em;color:var(--red);font-stretch:120%}
.article-summary{margin:48px 0 32px;padding:32px;background:var(--ink);color:var(--on-dark);border-radius:var(--radius)}
.article-summary strong{font-family:var(--display);font-size:12px;letter-spacing:.16em;color:var(--on-dark-muted)}
.article-summary p{font-family:var(--display);font-stretch:104%;font-weight:600;font-size:clamp(19px,1.8vw,24px);line-height:1.35;margin:14px 0 0}
.article-disclaimer{font-size:14px!important;color:var(--muted);margin-top:28px;line-height:1.55}
.related-guides{margin-top:clamp(64px,8vw,112px);padding-top:48px;border-top:1px solid var(--line)}
@media (max-width:900px){.article-layout{grid-template-columns:1fr}.article-toc{position:static;padding:18px;border:1px solid var(--line);border-radius:6px}}

/* CMS pages */
.cms-section-list{display:grid;gap:40px;max-width:820px}
.cms-section h2{font-size:clamp(24px,2.4vw,34px);margin-bottom:14px}
.cms-section p{color:var(--muted);font-size:17px}
.cms-return{margin-top:48px}
.cms-home-sections{background:var(--paper)}
.cms-home-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:28px}
.cms-home-card{padding-top:24px;border-top:2px solid var(--ink)}
.cms-home-card h2{font-size:clamp(24px,2.4vw,34px);margin-bottom:12px}
.cms-home-card p{color:var(--muted)}

/* ---------------------------------------------------------------- explore / SEO pages */
.seo-hero{display:block}
.explore-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,64px);align-items:center}
.explore-hero-art{position:relative;aspect-ratio:5/4;perspective:1200px}
.explore-hero-art .art-caption{position:absolute;right:0;bottom:0}
.explore-tabs{margin-top:28px;background:#ffffff0d;border-color:#ffffff24}
.explore-tab{color:var(--on-dark-muted)}
.explore-tab:hover{color:var(--white)}
.explore-tab[aria-current]{background:var(--white);color:var(--ink)}
.seo-stats{display:flex;flex-wrap:wrap;gap:12px 40px;margin:32px 0 0}
.seo-stats div{display:grid;gap:4px}
.seo-stats dt{font-family:var(--display);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--on-dark-muted)}
.seo-stats dd{margin:0;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:clamp(24px,2.4vw,34px)}
.vdp-summary .seo-stats dt{color:var(--muted)}
.seo-section{margin:clamp(48px,6vw,80px) 0;max-width:980px}
.seo-section h2{font-size:clamp(26px,2.8vw,40px);margin-bottom:20px}
.seo-section h3{font-size:20px;margin:26px 0 12px}
.seo-section p{color:var(--muted);font-size:17px;max-width:72ch}
.seo-table{width:100%;border-collapse:collapse;font-size:16px;margin:8px 0 20px}
.seo-table caption{text-align:left;font-family:var(--display);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding-bottom:10px}
.seo-table th,.seo-table td{text-align:left;vertical-align:top;padding:14px 16px 14px 0;border-bottom:1px solid var(--line)}
.seo-table th{width:34%;font-weight:700}
.seo-table td{color:var(--muted)}
.seo-links{margin:48px 0}
.seo-links h2{font-size:clamp(22px,2vw,28px);margin-bottom:16px}
.seo-links > .place-chip,.seo-links > a{margin:0 8px 8px 0}
.geo-answer{padding:22px 0;border-bottom:1px solid var(--line)}
.geo-answer h3{font-size:19px;margin:0 0 8px;font-stretch:104%}
.geo-answer p{margin:0}
.plain-steps{padding-left:20px;color:var(--muted);font-size:17px}
.plain-steps li{margin-bottom:10px}
.plain-steps strong{color:var(--text)}
.detail-features{list-style:none;padding:0;margin:8px 0 20px;display:flex;flex-wrap:wrap;gap:8px}
.detail-features li{padding:8px 14px;border:1px solid var(--line);border-radius:999px;font-size:14px;font-weight:600}
.review-list{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:14px}
.review{padding:18px 20px;border:1px solid var(--line);border-radius:6px}
.review strong{color:var(--red);letter-spacing:.1em}
.review span{color:var(--muted);font-size:13px;margin-left:8px}
.review p{margin:10px 0 0;color:var(--text)!important}
@media (max-width:900px){.explore-hero{grid-template-columns:1fr}.explore-hero-art{max-width:520px}}

/* Filter page (discovery filters only — no location, dates or times). */
.filter-head{padding-top:24px;max-width:820px}
.filter-head h1{font-size:clamp(38px,5vw,72px);margin-bottom:18px}
.filter-panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;align-items:end;margin:32px 0 24px;padding:20px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper)}
.field{display:grid;gap:6px}
.field span{font-family:var(--display);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.field select,.field input{min-height:48px;padding:0 14px;border:1.5px solid var(--line);border-radius:4px;background:var(--white);font-size:15px;width:100%}
.field select:focus,.field input:focus{outline:none;border-color:var(--ink)}
.filter-submit{min-height:48px}

/* Vehicle detail */
.vehicle-detail-page{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:0 clamp(32px,5vw,72px);align-items:start;padding-top:8px}
.vehicle-detail-page > .seo-section,.vehicle-detail-page > .seo-links{grid-column:1}
.vehicle-detail-page > .seo-section:has(.vehicle-grid),.vehicle-detail-page > .seo-links{grid-column:1/-1;max-width:none}
.vdp-gallery{grid-column:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.vdp-gallery img{width:100%;height:100%;aspect-ratio:3/2;object-fit:cover;border-radius:4px;background:var(--ink-3)}
.vdp-gallery > :first-child{grid-column:1/-1;border-radius:var(--radius)}.vdp-gallery > .photo-placeholder{aspect-ratio:3/2;border-radius:var(--radius);font-size:14px}
.vdp-gallery-empty .photo-placeholder{border-radius:var(--radius);aspect-ratio:3/2;padding:10% 12%}
.vdp-summary{grid-column:2;grid-row:1/span 4;position:sticky;top:96px;padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:var(--white)}
.vdp-summary h1{font-size:clamp(30px,3vw,44px);font-stretch:106%;line-height:1.02;margin-bottom:16px}
.vdp-summary .page-lede{font-size:16px}
.vdp-status{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:4px;background:var(--paper);font-size:14px;font-weight:600}
.vdp-status::before{content:"";flex:none;width:8px;height:8px;margin-top:6px;border-radius:50%;background:var(--ink)}
.vdp-status.is-paused::before{background:var(--red)}
.vdp-cta{display:grid;gap:14px;margin-top:24px}
.vdp-cta .button{width:100%}
.vdp-note{font-size:13px;color:var(--muted);margin:16px 0 0}
.sticky-cta{display:none}
@media (max-width:980px){
  .vehicle-detail-page{grid-template-columns:1fr}
  .vdp-summary{grid-column:1;grid-row:auto;position:static;margin-top:24px}
  .vehicle-detail-page > .seo-section:has(.vehicle-grid),.vehicle-detail-page > .seo-links{grid-column:1}
  .sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px var(--gutter) calc(12px + env(safe-area-inset-bottom));background:#070707f2;color:var(--on-dark);border-top:1px solid var(--line-dark)}
  .sticky-cta div{display:grid;min-width:0}
  .sticky-cta strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .sticky-cta span{font-size:13px;color:var(--on-dark-muted)}
  .sticky-cta .button{min-height:44px;padding:0 16px;flex:none;width:auto}
  body:has(.sticky-cta) .site-footer{padding-bottom:96px}
  body:has(.site-nav.menu-open) .sticky-cta{display:none}
}

/* ---------------------------------------------------------------- scroll story: the scenes after the hero
   Every value falls back to its resting state (vehicle parked, route drawn), which is also what
   reduced motion and no-JavaScript visitors see. */

/* Categories: the hero's car leaves the hero heading left; the stage's car arrives from the right
   as the section comes up, then keeps rolling (floor slides, wheels turn) while the chapters scroll. */
.category-story{--arrive:clamp(0,calc((var(--ep,1) - .3) / .55),1)}
.story-visual .rx-rolling{transform:translate3d(calc((1 - var(--arrive)) * 78%),0,0);--spin:calc(var(--arrive) * -900deg + var(--sp,0) * -1500deg)}
.story-visual[data-visual="bike"] .rx-rolling{transform:none;--spin:calc(var(--sp,0) * 1500deg)}
.story-floor{transform:perspective(700px) rotateX(64deg) translate3d(calc((var(--sp,.5) - .5) * 380px * var(--dir,1)),0,0)}
.story-frame[data-active="bike"]{--dir:-1}
/* Small screens: each chapter's drawing rolls into its own frame as that chapter scrolls in. */
.story-inline-art{--in:clamp(0,calc((var(--ep,1) - .06) / .5),1)}
.story-inline-art .rx-rolling{transform:translate3d(calc((1 - var(--in)) * 64%),0,0);--spin:calc(var(--in) * -800deg)}
.story-inline-art .rx-art-bike.rx-rolling{transform:translate3d(calc((var(--in) - 1) * 64%),0,0);--spin:calc(var(--in) * 800deg)}
.story-inline-art .ev-bolt{opacity:var(--in);transform:scale(calc(.6 + var(--in) * .4))}

/* Host band: the bike rides in from the left as its frame comes into view (measured on the frame,
   so it also plays on phones, where the frame sits below the copy). */
.host-band-art{--arrive:clamp(0,calc((var(--ep,1) - .12) / .5),1)}
.host-band .stage-vehicle{--spin:calc(var(--arrive) * 900deg + var(--xp,0) * 500deg);
  transform:translate3d(calc((var(--arrive) - 1) * 78% + var(--px,0) * var(--d,0) * 18px),calc(var(--py,0) * var(--d,0) * 10px),0) rotateY(calc(var(--px,0) * -6deg))}
.host-band .stage-floor{transform:perspective(700px) rotateX(64deg) translate3d(calc(var(--arrive) * -180px + var(--px,0) * var(--d,0) * 30px),0,0)}

/* Inner-page openers: the vehicle drives off as the opener scrolls away. */
.page-stage{--leave:clamp(0,calc(var(--xp,0) * 1.7),1)}
.stage-scene-car .stage-vehicle{--spin:calc(var(--leave) * -900deg);transform:translate3d(calc(var(--leave) * -72% + var(--px,0) * var(--d,0) * 18px),calc(var(--py,0) * var(--d,0) * 10px),0) rotateY(calc(var(--px,0) * -6deg))}
.stage-scene-bike .stage-vehicle{--spin:calc(var(--leave) * 900deg);transform:translate3d(calc(var(--leave) * 72% + var(--px,0) * var(--d,0) * 18px),calc(var(--py,0) * var(--d,0) * 10px),0) rotateY(calc(var(--px,0) * -6deg))}
.page-stage .stage-floor{transform:perspective(700px) rotateX(64deg) translate3d(calc(var(--leave) * 160px + var(--px,0) * var(--d,0) * 30px),0,0)}
.stage-scene-route > div{transform:translate3d(calc(var(--px,0) * var(--d,0) * 24px),calc(var(--py,0) * var(--d,0) * 16px + var(--xp,0) * 60px),0) rotate(calc(var(--xp,0) * 40deg)) scale(calc(1 + var(--xp,0) * .12))}

/* Journey: the route draws, and each step lights up as the reader reaches it. */
.journey-line-draw{stroke-dashoffset:calc(1 - clamp(0,calc((var(--jp,1) - .2) / .42),1))}
.journey-rail{display:none}
.journey-step::before{transition:background-color .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.journey-step .step-number,.journey-step h3{transition:color .4s var(--ease)}
.journey-step::before{background:var(--red-bright);box-shadow:0 0 0 5px #f0323f2e}
.motion-ready .journey-step:not(.is-reached)::before{background:var(--ink);border-color:#ffffff4d;box-shadow:none}
.motion-ready .journey-step:not(.is-reached) .step-number{color:#ffffff12}
.motion-ready .journey-step:not(.is-reached) h3{color:var(--on-dark-muted)}
@media (max-width:900px){
  .journey-rail{display:block;position:absolute;left:0;top:0;bottom:0;width:2px;margin-left:-.5px;background:#ffffff1a;z-index:1}
  .journey-rail i{display:block;height:100%;background:var(--red-bright);transform-origin:top;transform:scaleY(clamp(0,calc((var(--jp,1) - .12) / .62),1))}
  .journey-step::before{z-index:2}
}

/* Smaller screens drop per-frame drop shadows on moving art (the ground shadow in the drawing stays). */
@media (max-width:900px){.hero-car,.story-inline-art .rx-art,.stage-vehicle .rx-art,.story-visual .rx-art{filter:none}}

/* ---------------------------------------------------------------- motion (opt-in, never hides content for long) */
.motion-ready .reveal{opacity:0;transform:translate3d(0,26px,0);transition:opacity .8s var(--ease),transform .9s var(--ease-out)}
.motion-ready .reveal.is-visible{opacity:1;transform:none}
.motion-boot .hero-content > *{animation:rx-rise .9s var(--ease-out) both}
.motion-boot .hero-content > :nth-child(2){animation-delay:.08s}
.motion-boot .hero-content > :nth-child(3){animation-delay:.16s}
.motion-boot .hero-content > :nth-child(4){animation-delay:.24s}
.motion-boot .hero-content > :nth-child(5){animation-delay:.32s}
.motion-boot .hero-car > .rx-art{animation:rx-arrive 1.5s var(--ease-out) .15s backwards}
.motion-boot .pra-route{animation:rx-draw 1.8s var(--ease) .35s both}
.motion-boot .page-stage .stage-vehicle > .rx-art{animation:rx-arrive 1.3s var(--ease-out) .1s backwards}
@keyframes rx-rise{from{opacity:0;transform:translate3d(0,22px,0)}to{opacity:1;transform:none}}
@keyframes rx-arrive{from{opacity:0;transform:translate3d(14%,0,0)}to{opacity:1;transform:none}}
@keyframes rx-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
/* Scroll already moves in small steps every frame; a short ease only smooths pointer jitter. */
.hero-car,.hero-camera,.hero-floor,.hero-beam,.hero-route,.hero-mark,.stage-vehicle,.stage-floor,.stage-glow,.stage-scene-route > div,.story-floor{transition:transform .18s var(--ease-out)}

/* Low-powered or data-saving devices: the scroll story stays (it is transform-only), while pointer
   parallax, blurs, glows and per-frame shadows go. */
.motion-lite [data-depth-scene]{--px:0!important;--py:0!important}
.motion-lite .hero-car,.motion-lite .hero-beam,.motion-lite .hero-car::before,.motion-lite .hero-car::after,.motion-lite .hero-route-line,.motion-lite .pra-route,
.motion-lite .ev-bolt,.motion-lite .rx-art{filter:none}
.motion-lite .hero-beam,.motion-lite .hero-car::after{display:none}
.motion-lite .hero-mark{display:none}
.motion-lite .site-nav{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--ink)}
.motion-lite .hero-car,.motion-lite .hero-camera,.motion-lite .stage-vehicle,.motion-lite .stage-floor,.motion-lite .story-floor{transition:none}

/* Reduced motion: a composed, static version. Nothing pins, moves with scroll, tilts or animates in. */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
.motion-reduced .hero-track{height:auto}
.motion-reduced .hero-v2{position:relative;top:auto;height:auto}
.motion-reduced .hero-content,.motion-reduced .hero-caption{opacity:1!important;transform:none!important}
.motion-reduced .hero-progress,.motion-reduced .hero-streaks{display:none}
.motion-reduced .hero-route-line,.motion-reduced .journey-line-draw{stroke-dashoffset:0}
.motion-reduced .journey-rail i{transform:none}
.motion-reduced .hero-car,.motion-reduced .hero-camera,.motion-reduced .hero-beam,.motion-reduced .hero-route,.motion-reduced .hero-mark,.motion-reduced .hero-lane i,
.motion-reduced .stage-vehicle,.motion-reduced .stage-glow,.motion-reduced .stage-scene-route > div,.motion-reduced .rx-spin,.motion-reduced .rx-rolling,.motion-reduced .ev-bolt,
.motion-reduced .vehicle-card,.motion-reduced .guide-card,.motion-reduced .story-frame,.motion-reduced .download-tile{transform:none!important;will-change:auto}
.motion-reduced .story-inline-art .ev-bolt{opacity:1}
.motion-reduced .download-tile{transform:rotateX(12deg) rotateY(-18deg)!important}
.motion-reduced .stage-floor,.motion-reduced .hero-floor,.motion-reduced .story-floor{transform:perspective(700px) rotateX(64deg)!important}
.motion-reduced .story-visual{transition:none}
.motion-reduced .story-chapter{opacity:1!important}
.motion-reduced .vehicle-card:hover .vehicle-image,.motion-reduced .hero-live-card:hover img{transform:none}

/* ---------------------------------------------------------------- small screens */
@media (max-width:640px){
  body{font-size:16px}
  .section-head{margin-bottom:36px}
  .hero-v2 h1{font-size:clamp(40px,11.5vw,56px)}
  .hero-facts{font-size:13px}
  .button{width:100%}
  .hero-ctas .button,.hero-actions .button,.page-actions .button{flex:1 1 100%}
  .inventory-tabs{width:100%}
  .filter-tab{flex:1;justify-content:center;padding:0 10px}
  .explore-tabs{display:flex;width:100%}
  .explore-tab{flex:1;justify-content:center;padding:0 8px;font-size:13px}
  .trust-item{grid-template-columns:1fr;gap:8px}
  .vdp-summary{padding:20px}
  .seo-table th,.seo-table td{display:block;width:auto;padding:4px 0}
  .seo-table tr{display:block;padding:12px 0;border-bottom:1px solid var(--line)}
  .seo-table th,.seo-table td{border:0}
}