/* NeoV roadmap: a continuous route, with native vertical scrolling. */
:root {
  --route-gold:#e0b454;
  --route-muted:#8a7750;
  --route-line:#c8973f36;
  --motion-enter:500ms;
  --motion-ui:250ms;
  --motion-close:150ms;
  --motion-stagger:40ms;
  --motion-ease:cubic-bezier(.22,1,.36,1);
  --tilt-perspective:1000px;
  --tilt-return:1000ms;
  --tilt-return-ease:cubic-bezier(.22,1,.36,1);
  --tilt-follow:400ms;
  --tilt-follow-ease:cubic-bezier(.22,1,.36,1);
  --tilt-glare-opacity:.32;
  --tilt-glare-fade:300ms;
  --tilt-glare-ease:cubic-bezier(.22,1,.36,1);
}
.roadmap-page { overflow:clip; }
.road-reading { position:fixed; z-index:101; top:73px; left:0; right:0; height:2px; background:var(--brass-hi); transform:scaleX(var(--page-read,0)); transform-origin:left; pointer-events:none; }
#roadmap-title { scroll-margin-top:110px; }
.roadmap-page h1,.roadmap-page h2,.roadmap-page h3 { font-family:'Corvent',sans-serif; }
.roadmap-page em { color:var(--route-gold); font-style:normal; }
.roadmap-page a { -webkit-tap-highlight-color:transparent; }
.roadmap-page svg { fill:none; }
.future-hero { min-height:min(900px,100svh); padding:0; display:flex; align-items:center; isolation:isolate; background:#0b0c0f; }
.future-hero__image { position:absolute; inset:0 0 0 29%; z-index:-2; overflow:hidden; clip-path:polygon(17% 0,100% 0,100% 100%,0 100%); }
.future-hero__image img { width:100%; height:100%; object-fit:cover; object-position:58% 50%; transform:scale(1.04) translate3d(0,var(--hero-shift,0px),0); }
.future-hero__image-shade { position:absolute; inset:0; background:linear-gradient(90deg,#0b0c0ff2,transparent 60%),linear-gradient(0deg,#0b0c0f,transparent 35%,#0b0c0f30); }
.future-hero__grid { position:absolute; inset:74px 0 0; z-index:-1; background:linear-gradient(90deg,#ffffff06 1px,transparent 1px) 0 0 / 8.333% 100%; pointer-events:none; mask-image:linear-gradient(90deg,#000,transparent 75%); }
.future-hero__content { position:relative; padding-top:150px; padding-bottom:118px; }
.future-hero__copy { position:relative; z-index:2; max-width:800px; }
.future-hero h1 { margin:0; font-size:clamp(5rem,10.65vw,10rem); font-weight:700; line-height:.85; letter-spacing:-.055em; }
.title-mask { display:block; overflow:hidden; padding:0 .03em .08em 0; margin-bottom:-.07em; }
.title-mask > span { display:block; }
.future-hero h1 .title-outline { color:transparent; -webkit-text-stroke:1.5px var(--route-gold); }
.future-hero__copy > p { margin:35px 0; font-size:clamp(1.05rem,1.65vw,1.5rem); line-height:1.5; color:#c7c9cf; }
.route-start { display:inline-flex; align-items:center; gap:18px; font:600 1rem 'Corvent',sans-serif; }
.route-start__icon { display:grid; place-items:center; width:52px; height:52px; border:1px solid #c8973f99; border-radius:50%; font:400 1.65rem 'Helvena',sans-serif; color:var(--route-gold); transition:background var(--motion-close),color var(--motion-close),transform var(--motion-close) var(--motion-ease); }
.route-start:hover .route-start__icon { color:#101015; background:var(--route-gold); transform:translateY(4px); transition-duration:var(--motion-ui); }
.hero-preview { position:absolute; right:16px; bottom:145px; width:190px; z-index:2; padding:20px 20px 12px; background:#0a0b0dc7; border-left:2px solid var(--route-gold); backdrop-filter:blur(12px); transition:transform var(--motion-close) var(--motion-ease),border-color var(--motion-close); }
.hero-preview:hover { transform:translateY(-4px); border-color:#fff; transition-duration:var(--motion-ui); }
.hero-preview > span:first-child { font:700 1.15rem 'Corvent',sans-serif; text-transform:uppercase; }
.hero-preview strong { display:block; font:700 6rem/.94 'Corvent',sans-serif; letter-spacing:-.07em; color:var(--route-gold); }
.hero-preview__arrow { position:absolute; top:14px; right:15px; font-size:1.4rem; color:var(--route-gold); }
.future-hero__bottom { position:absolute; bottom:30px; left:0; right:0; display:flex; justify-content:space-between; gap:24px; padding-top:20px; border-top:1px solid #ffffff26; font-size:.87rem; color:#b8bbc5; }
.future-hero__bottom a { color:var(--route-gold); }
.future-hero__bottom a span { display:inline-block; margin-left:12px; }

/* The same six nodes stay available while the route is explored. */
.route-nav { position:sticky; top:74px; z-index:55; background:#0a0b0df5; border-block:1px solid #c8973f32; backdrop-filter:blur(18px); }
.route-nav__list { position:relative; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:0; list-style:none; padding:0; margin-block:0; }
.route-nav__list::before { content:''; position:absolute; top:29px; left:8.333%; right:8.333%; height:1px; background:#c8973f40; }
.route-nav li { min-width:0; }
.route-nav a { position:relative; display:flex; flex-direction:column; align-items:center; gap:9px; padding:12px 6px 15px; color:#a7a8b0; font:600 .8rem/1.2 'Corvent',sans-serif; transition:color var(--motion-close); }
.route-nav a:hover { color:#fff; transition-duration:var(--motion-ui); }
.route-nav__node { display:grid; place-items:center; position:relative; width:34px; height:34px; border:1px solid #665534; border-radius:50%; background:var(--bg); color:#bd9b59; font:400 .65rem 'JetBrains Mono',monospace; transition:background var(--motion-ui),color var(--motion-ui),box-shadow var(--motion-ui),border-color var(--motion-ui); }
.route-nav__node--voice { font-size:1.05rem; }
.route-nav a[aria-current=step] { color:var(--route-gold); }
.route-nav a[aria-current=step] .route-nav__node { color:#111; background:var(--route-gold); border-color:var(--route-gold); box-shadow:0 0 0 5px #c8973f12,0 0 25px #c8973f22; }
.route-nav a.is-past .route-nav__node { border-color:var(--route-gold); color:var(--route-gold); }
.route-intro { padding-block:95px 80px; display:grid; grid-template-columns:1fr 1fr; gap:120px; align-items:center; scroll-margin-top:200px; }
.route-intro h2 { margin:0; font-size:clamp(2.8rem,4.6vw,4.5rem); line-height:.98; letter-spacing:-.035em; text-transform:uppercase; }
.route-intro h2 span { color:var(--route-gold); }
.route-intro p { max-width:56ch; margin:0; color:var(--dim); font-size:1rem; }

/* Route geometry is measured from the real markers, so it survives reflow. */
.journey { position:relative; --route-center:50%; }
.journey::before { content:''; position:absolute; top:0; bottom:200px; left:var(--route-center); width:1px; background:var(--route-line); }
.route-ready .journey::before { display:none; }
.journey__route { position:absolute; left:0; top:0; width:100%; height:100%; pointer-events:none; overflow:visible; }
.journey__halo { stroke:#c8973f; stroke-width:15; opacity:.035; }
.journey__base { stroke:#c8973f42; stroke-width:1.5; }
.journey__route path { stroke-linejoin:round; stroke-linecap:round; }
.journey__progress { stroke:var(--route-gold); stroke-width:2; filter:drop-shadow(0 0 5px #e0b45450); }
.journey__traveller { fill:#fff4ce; stroke:var(--route-gold); stroke-width:3; filter:drop-shadow(0 0 7px #e0b454); opacity:0; }
.milestone { --accent:var(--route-gold); position:relative; display:grid; grid-template-columns:minmax(0,1fr) 120px minmax(0,1fr); column-gap:0; align-items:center; padding:70px 0 130px; scroll-margin-top:184px; }
.milestone::before { content:''; position:absolute; top:107px; left:calc(50% - 60px); right:calc(50% - 60px); border-top:1px solid var(--route-line); }
.milestone__marker { position:absolute; z-index:3; left:50%; top:70px; width:76px; height:76px; margin-left:-38px; display:grid; place-items:center; background:var(--bg); border:1px solid #8d7442; border-radius:50%; box-shadow:0 0 0 8px var(--bg); color:#b8995c; transition:color var(--motion-ui),border-color var(--motion-ui),box-shadow var(--motion-ui); }
.milestone__marker::before { content:''; position:absolute; inset:7px; border:1px dashed #c8973f40; border-radius:50%; transition:transform var(--motion-enter) var(--motion-ease); }
.milestone__marker span { font:500 1rem 'JetBrains Mono',monospace; }
.milestone.is-active .milestone__marker,.voice-finale.is-active .milestone__marker { color:var(--route-gold); border-color:var(--route-gold); box-shadow:0 0 0 8px var(--bg),0 0 0 9px #c8973f22,0 0 42px #c8973f20; }
.milestone.is-active .milestone__marker::before { transform:rotate(90deg); }
.milestone__copy { grid-column:1; grid-row:1; min-width:0; }
.milestone__visual { grid-column:3; grid-row:1; min-width:0; position:relative; }
.milestone--reverse .milestone__copy { grid-column:3; }
.milestone--reverse .milestone__visual { grid-column:1; }
.milestone__status { display:inline-flex; align-items:center; gap:8px; color:#bcac8b; font:.72rem 'JetBrains Mono',monospace; margin-bottom:22px; }
.milestone__status::before { content:''; width:7px; height:7px; border:1px solid currentColor; transform:rotate(45deg); }
.milestone__status--open::before { border-style:dashed; }
.milestone h2 { font-size:clamp(3rem,5.1vw,5rem); font-weight:700; line-height:.96; letter-spacing:-.045em; margin:0 0 26px; text-transform:uppercase; }
.milestone h2 em { color:var(--accent); }
.milestone__lead { font-size:1.15rem; line-height:1.55; margin:0 0 28px; color:#c4c6cf; max-width:40ch; }
.milestone__copy > p:not(.milestone__lead) { color:var(--dim); font-size:.98rem; line-height:1.8; }
.milestone__link { display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid #c8973f50; padding:18px 0; margin-top:25px; color:var(--accent); font:600 .97rem 'Corvent',sans-serif; }
.milestone__link span { font-size:1.3rem; transition:transform var(--motion-close) var(--motion-ease); }
.milestone__link:hover span { transform:translate(4px,-4px); transition-duration:var(--motion-ui); }
.scene-frame { position:relative; overflow:hidden; background:var(--panel); border:1px solid #ffffff24; isolation:isolate; }
.scene-frame img { position:absolute; inset:-30px 0; width:100%; height:calc(100% + 60px); object-fit:cover; transform:translate3d(0,var(--scene-shift,0px),0); }
.scene-frame__shade { position:absolute; inset:0; background:linear-gradient(0deg,#0a0b0dc9,transparent 50%,#0a0b0d55); }
.scene-caption { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 0; border-bottom:1px solid #c8973f40; color:#ae9a76; font:.72rem 'JetBrains Mono',monospace; }
.scene-caption > span:last-child { font:400 1.5rem 'Helvena',sans-serif; }
.milestone--crime { --accent:#d99176; padding-top:40px; }
.milestone--crime .milestone__copy { align-self:end; }
.milestone--crime .milestone__visual { grid-row:1 / span 2; }
.milestone__details { grid-column:1; grid-row:2; min-width:0; }
.milestone--crime::before { top:77px; }
.milestone--crime .milestone__marker { top:40px; }
.milestone--crime h2 em { display:block; font-size:1.4em; }
.crime-systems { border-top:1px solid #d9917640; }
.crime-systems article { display:flex; gap:15px; padding:16px 0; border-bottom:1px solid #ffffff12; }
.crime-systems article > span { color:#b98b71; font:.64rem 'JetBrains Mono',monospace; padding-top:4px; }
.crime-systems h3 { margin:0 0 4px; font-size:1.1rem; }
.crime-systems p { margin:0; color:var(--dim); font-size:.87rem; line-height:1.55; max-width:46ch; }
.scene-frame--crime { height:650px; clip-path:polygon(0 0,calc(100% - 38px) 0,100% 38px,100% 100%,0 100%); }
.scene-frame--crime img { object-position:49% center; }
.crime-visual__type { position:absolute; top:30px; left:30px; color:#f3e7d9; font:700 clamp(3rem,5vw,4.8rem)/.84 'Corvent',sans-serif; letter-spacing:-.04em; }
.crime-visual__version { position:absolute; bottom:6px; right:20px; font:700 clamp(7rem,13vw,12rem)/.85 'Corvent',sans-serif; letter-spacing:-.08em; color:transparent; -webkit-text-stroke:1.5px #efcda1; }
.milestone--places { --accent:#d59fac; }
.scene-frame--places { height:560px; transform:rotate(-3deg); }
.scene-frame--places img { object-position:59% center; filter:saturate(.72); }
.places-visual { padding:0 14px 65px; }
.places-visual__neon { position:absolute; top:30px; left:28px; font:700 clamp(3rem,5vw,4.8rem)/.92 'Corvent',sans-serif; color:transparent; -webkit-text-stroke:1px #ecc4cf; text-shadow:0 0 24px #d9848830; letter-spacing:.02em; }
.places-visual__neon i { font-style:normal; color:#efc5d1; -webkit-text-stroke:0; }
.place-ticket { position:absolute; right:-10px; bottom:20px; padding:22px 26px; width:74%; background:#d5ae65; color:#171410; transform:rotate(3deg); box-shadow:0 20px 50px #0004; }
.place-ticket > span { font:.64rem 'JetBrains Mono',monospace; letter-spacing:.1em; }
.place-ticket strong { display:block; margin-top:14px; font:700 1.9rem/.96 'Corvent',sans-serif; text-transform:uppercase; letter-spacing:-.02em; }
.place-ticket svg { position:absolute; right:20px; bottom:23px; width:38px; height:38px; stroke:currentColor; stroke-width:1.5; }
.place-list { list-style:none; padding:0; margin:30px 0 0; }
.place-list li { display:flex; align-items:center; gap:20px; border-top:1px solid #ffffff1a; padding:22px 0; }
.place-list li > span,.place-list li > svg { width:34px; flex:none; text-align:center; color:var(--accent); font:400 2rem 'Helvena',sans-serif; }
.place-list li > svg { height:34px; stroke:var(--accent); stroke-width:1.25; }
.place-list h3 { margin:0 0 4px; font-size:1.22rem; }
.place-list p { margin:0; color:var(--dim); font-size:.89rem; }
.milestone--life { --accent:#9fc5b1; }
.scene-frame--life { height:510px; border-radius:200px 200px 0 0; }
.scene-frame--life img { object-position:69% center; }
.life-visual { padding-right:28px; }
.life-visual__type { position:absolute; bottom:28px; left:30px; font:700 clamp(3rem,4.6vw,4.6rem)/.88 'Corvent',sans-serif; letter-spacing:-.035em; color:#e0e7e2; }
.life-visual__type i { font-style:normal; color:var(--accent); }
.life-visual__stamp { display:grid; place-items:center; position:absolute; width:108px; height:108px; bottom:-30px; right:0; border:1px solid #95b8a475; border-radius:50%; background:#11201b; transform:rotate(-15deg); box-shadow:0 0 0 10px var(--bg); }
.life-visual__stamp svg { width:60px; height:60px; stroke:var(--accent); stroke-width:1; }
.milestone--style { --accent:#a6b9db; }
.scene-frame--garage { height:570px; clip-path:polygon(0 0,100% 0,100% calc(100% - 44px),calc(100% - 44px) 100%,0 100%); }
.scene-frame--garage img { object-position:42% center; }
.garage-visual__type { position:absolute; bottom:38px; left:28px; color:#edf0f5; font:700 clamp(3rem,4.6vw,4.5rem)/.9 'Corvent',sans-serif; letter-spacing:-.04em; }
.garage-visual__type i { font-style:normal; color:var(--accent); }
.garage-visual__stripes { display:flex; gap:8px; position:absolute; right:-17px; top:25px; transform:skewX(-18deg); }
.garage-visual__stripes span { width:18px; height:70px; background:var(--accent); box-shadow:0 5px 20px #0004; }
.garage-visual__stripes span:nth-child(2) { opacity:.6; }
.garage-visual__stripes span:nth-child(3) { opacity:.25; }
.style-options { display:grid; grid-template-columns:1fr 1fr; gap:28px; padding-top:8px; }
.style-options article { padding-top:22px; border-top:1px solid #a6b9db50; }
.style-options svg { height:32px; width:32px; stroke:var(--accent); stroke-width:1.2; margin-bottom:20px; }
.style-options h3 { margin:0 0 10px; font-size:1.25rem; }
.style-options p { color:var(--dim); font-size:.9rem; margin:0; }

/* The pass is a graphic artifact, not a promise of rewards or pricing. */
.pass-visual { min-height:540px; display:grid; place-items:center; isolation:isolate; }
.pass-orbit { position:absolute; inset:0; overflow:hidden; z-index:-1; }
.pass-orbit span { position:absolute; top:50%; left:50%; width:440px; height:440px; border:1px solid #c8973f25; border-radius:50%; transform:translate(-50%,-50%); }
.pass-orbit span:nth-child(2) { width:340px; height:340px; border-style:dashed; }
.pass-orbit span:nth-child(3) { width:520px; height:520px; border-color:#c8973f0c; }
.pass-stack { position:relative; width:268px; height:374px; transform:rotate(-9deg); }
.pass-echo { position:absolute; inset:0; border:1px solid #c8973f45; background:linear-gradient(145deg,#272317,#121315 70%); border-radius:10px; transition:transform var(--motion-enter) var(--motion-ease); }
.pass-echo--back { transform:translate(35px,14px) rotate(17deg); }
.pass-echo--middle { transform:translate(18px,5px) rotate(8deg); }
.pass-card { height:100%; padding:23px; color:#21180a; background:linear-gradient(115deg,#a8782c,#eac578 37%,#c59a47 70%,#efcf8b); border:1px solid #f3d598; box-shadow:0 25px 60px #0007; }
.pass-card::before { content:''; position:absolute; inset:8px; border:1px solid #49381150; border-radius:5px; pointer-events:none; }
.pass-card::after { content:''; position:absolute; inset:0; background:repeating-linear-gradient(115deg,transparent 0px,transparent 3px,#f8deaa0b 3px,#f8deaa0b 4px); pointer-events:none; }
.pass-card__top { display:flex; justify-content:space-between; font:700 .8rem 'Corvent',sans-serif; letter-spacing:.08em; }
.pass-card__mark { display:block; width:86px; height:86px; margin:23px auto 18px; filter:brightness(0); opacity:.83; }
.pass-card__name { font:700 3.9rem/.84 'Corvent',sans-serif; letter-spacing:-.04em; }
.pass-card__bottom { display:flex; align-items:center; justify-content:space-between; border-top:1px solid #201a0b65; margin-top:22px; padding-top:13px; font:.6rem 'JetBrains Mono',monospace; }
.pass-card__bars { display:block; width:50px; height:18px; background:repeating-linear-gradient(90deg,#31230e 0 2px,transparent 2px 4px,#31230e 4px 5px,transparent 5px 8px); }
.pass-caption { position:absolute; bottom:4px; left:0; right:0; text-align:center; color:#b29c73; font:.72rem 'JetBrains Mono',monospace; }

/* transitions.dev card-tilt primitive. */
.t-tilt { touch-action: none; }
.t-tilt-card {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  transform:
    perspective(var(--tilt-perspective))
    rotateX(var(--tilt-rx, 0deg))
    rotateY(var(--tilt-ry, 0deg));
  transform-style: preserve-3d;
  transition: transform var(--tilt-return) var(--tilt-return-ease);
  will-change: transform;
}
.t-tilt-card.is-tilting {
  transition: transform var(--tilt-follow) var(--tilt-follow-ease);
}
.t-tilt-glare {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  mix-blend-mode: screen;
  background:
    radial-gradient(circle 95px at var(--tilt-gx, 50%) var(--tilt-gy, 50%),
      rgba(255,255,255,0.48), rgba(255,255,255,0.06) 52%, rgba(255,255,255,0) 84%),
    radial-gradient(circle 200px at var(--tilt-gx, 50%) var(--tilt-gy, 50%),
      rgba(255,255,255,0.22), rgba(255,255,255,0.04) 58%, rgba(255,255,255,0) 78%),
    radial-gradient(circle 360px at var(--tilt-gx, 50%) var(--tilt-gy, 50%),
      rgba(255,255,255,0.10), rgba(255,255,255,0) 88%);
  transition: opacity var(--tilt-glare-fade) var(--tilt-glare-ease);
}
.t-tilt.is-hover .t-tilt-glare { opacity: var(--tilt-glare-opacity); }
@media (prefers-reduced-motion: reduce) {
  .t-tilt-card { transform: none !important; transition: none !important; }
}
/* Scrolling always belongs to the page on touchscreens. */
.roadmap-page .t-tilt { touch-action:pan-y; }

.voice-finale { position:relative; padding:150px 0 70px; text-align:center; scroll-margin-top:190px; }
.voice-finale .milestone__marker { top:12px; }
.milestone__marker--voice span { font:400 2rem 'Helvena',sans-serif; }
.voice-finale h2 { margin:24px 0; font:700 clamp(4rem,8.7vw,8.5rem)/.88 'Corvent',sans-serif; text-transform:uppercase; letter-spacing:-.045em; }
.voice-finale__head > p { margin:30px 0 50px; color:#afb2bc; font-size:1.1rem; line-height:1.75; }
.voice-board { display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; text-align:left; border:1px solid #c8973f4d; background:linear-gradient(120deg,#161610,#101114 70%); position:relative; overflow:hidden; }
.voice-board__art { position:relative; min-width:0; height:420px; overflow:hidden; }
.voice-board__art > svg { position:absolute; inset:0; width:100%; height:100%; stroke:#c8973f66; stroke-width:1; }
.voice-board__center { position:absolute; top:50%; left:50%; width:138px; height:138px; transform:translate(-50%,-50%); border:1px solid #c8973fa0; border-radius:50%; background:#252014; display:grid; place-items:center; box-shadow:0 0 60px #c8973f15; }
.voice-board__center img { width:70px; height:70px; }
.voice-board__ring { position:absolute; top:50%; left:50%; width:238px; height:238px; border:1px dashed #c8973f38; border-radius:50%; transform:translate(-50%,-50%); }
.voice-board__ring--outer { width:335px; height:335px; border-style:solid; border-color:#c8973f12; }
.voice-tag { position:absolute; z-index:1; background:#191b18; border:1px solid #b594594d; padding:10px 15px; font:.72rem 'JetBrains Mono',monospace; color:#d3ba8b; }
.voice-tag--one { left:12%; top:16%; transform:rotate(-6deg); }
.voice-tag--two { right:6%; top:31%; transform:rotate(5deg); }
.voice-tag--three { bottom:19%; left:17%; transform:rotate(-4deg); }
.voice-board__copy { padding:45px 45px 45px 15px; }
.voice-board__copy article { display:flex; gap:18px; padding:15px 0 23px; }
.voice-board__copy article > span { font:.65rem 'JetBrains Mono',monospace; color:var(--route-gold); padding-top:5px; }
.voice-board h3 { font-size:1.25rem; line-height:1.25; margin:0 0 12px; }
.voice-board p { color:var(--dim); font-size:.9rem; line-height:1.7; margin:0; max-width:55ch; }
.voice-board .page-actions { margin-top:12px; gap:24px; }
.voice-board .btn { gap:24px; }
.voice-team { font-size:.8rem; color:#c4b491; text-decoration:underline; text-underline-offset:5px; }
.back-to-route { display:inline-flex; gap:20px; align-items:center; min-height:48px; margin-top:42px; color:var(--dim); font-size:.82rem; }
.back-to-route span { color:var(--route-gold); font-size:1.2rem; }

/* Progressive enhancement: content is visible with no JavaScript. */
.road-motion [data-reveal] { opacity:0; transform:translate3d(0,30px,0); transition:opacity var(--motion-enter) var(--motion-ease),transform var(--motion-enter) var(--motion-ease); }
.road-motion [data-reveal].is-revealed { opacity:1; transform:none; }
.road-motion .future-hero__copy { opacity:1; transform:none; }
.road-motion .title-mask > span { transform:translateY(105%); transition:transform var(--motion-enter) var(--motion-ease); }
.road-motion .is-revealed .title-mask > span { transform:none; }
.road-motion .title-mask:nth-child(2) > span { transition-delay:80ms; }
.road-motion .crime-systems article,.road-motion .place-list li,.road-motion .style-options article { opacity:0; transform:translateY(12px); transition:opacity var(--motion-enter) var(--motion-ease),transform var(--motion-enter) var(--motion-ease); transition-delay:calc(var(--item,0) * var(--motion-stagger)); }
.road-motion .is-revealed .crime-systems article,.road-motion .is-revealed .place-list li,.road-motion .is-revealed .style-options article { opacity:1; transform:none; }
.road-motion .crime-systems.is-revealed article { opacity:1; transform:none; }
.road-motion .scene-frame { clip-path:inset(0 0 100% 0); transition:clip-path var(--motion-enter) var(--motion-ease); }
.road-motion .scene-frame--crime { clip-path:polygon(0 0,calc(100% - 38px) 0,100% 0,100% 0,0 0); }
.road-motion .scene-frame--garage { clip-path:polygon(0 0,100% 0,100% 0,calc(100% - 44px) 0,0 0); }
.road-motion .is-revealed .scene-frame { clip-path:inset(0); }
.road-motion .is-revealed .scene-frame--crime { clip-path:polygon(0 0,calc(100% - 38px) 0,100% 38px,100% 100%,0 100%); }
.road-motion .is-revealed .scene-frame--garage { clip-path:polygon(0 0,100% 0,100% calc(100% - 44px),calc(100% - 44px) 100%,0 100%); }
.road-motion .pass-visual:not(.is-revealed) .pass-echo { transform:none; }
.road-motion .voice-tag { opacity:0; transition:opacity var(--motion-enter) var(--motion-ease),translate var(--motion-enter) var(--motion-ease); translate:0 12px; }
.road-motion .is-revealed .voice-tag { opacity:1; translate:0 0; }
.voice-tag--two { transition-delay:var(--motion-stagger) !important; }
.voice-tag--three { transition-delay:calc(2 * var(--motion-stagger)) !important; }

@media (min-width:1600px) { .future-hero__content { padding-top:180px; padding-bottom:155px; } }
@media (max-width:1100px) {
  .milestone { grid-template-columns:minmax(0,1fr) 90px minmax(0,1fr); }
  .milestone__marker { width:60px; height:60px; margin-left:-30px; }
  .milestone::before { top:100px; left:calc(50% - 45px); right:calc(50% - 45px); }
  .milestone--crime::before { top:70px; }
  .milestone h2 { font-size:clamp(2.5rem,5.2vw,4rem); }
  .crime-visual__type { left:22px; }
  .scene-frame--crime { height:610px; }
  .scene-frame--places { height:490px; }
  .scene-frame--garage { height:500px; }
  .route-intro { gap:90px; }
  .pass-stack { width:230px; height:340px; }
  .pass-card { padding:20px; }
  .pass-card__mark { width:70px; height:70px; }
  .pass-card__name { font-size:3.6rem; }
  .voice-board__copy { padding:30px 28px 30px 0; }
}
@media (max-width:800px) {
  .future-hero { min-height:760px; }
  .future-hero__content { padding-top:160px; padding-bottom:230px; }
  .future-hero h1 { font-size:clamp(4.8rem,12.8vw,7rem); }
  .future-hero__image { left:12%; clip-path:none; opacity:.75; }
  .future-hero__image-shade { background:linear-gradient(90deg,#0b0c0fdc,transparent),linear-gradient(0deg,#0b0c0f,transparent 65%); }
  .future-hero__bottom { font-size:.76rem; }
  .hero-preview { bottom:100px; width:148px; padding:17px 17px 10px; }
  .hero-preview strong { font-size:4.6rem; }
  .route-nav__list { display:flex; overflow-x:auto; scrollbar-width:none; width:100%; max-width:none; padding-inline:12px; scroll-padding-inline:12px; }
  .route-nav__list::-webkit-scrollbar { display:none; }
  .route-nav__list::before { display:none; }
  .route-nav li { flex:0 0 130px; }
  .route-nav a::before { content:''; position:absolute; top:29px; height:1px; left:0; right:0; background:var(--route-line); z-index:-1; }
  .route-nav li:first-child a::before { left:50%; }
  .route-nav li:last-child a::before { right:50%; }
  .route-nav a { font-size:.78rem; }
  .route-intro { gap:36px; padding-block:64px; }
  .route-intro h2 { font-size:2.8rem; }
  .route-intro p { font-size:.9rem; }
  .journey { --route-center:28px; }
  .milestone { display:flex; flex-direction:column; align-items:stretch; padding:35px 0 80px 83px; gap:36px; }
  .milestone__marker { left:28px; top:35px; width:50px; height:50px; margin-left:-25px; }
  .milestone::before { top:60px; left:28px; right:auto; width:55px; }
  .milestone__copy,.milestone__visual { width:100%; }
  .milestone__details { order:3; width:100%; }
  .milestone__status { margin-bottom:20px; }
  .milestone h2 { font-size:clamp(2.8rem,7.3vw,4.5rem); }
  .milestone h2 br { display:none; }
  .milestone h2 em { display:block; }
  .milestone--crime h2 em { font-size:1.1em; display:inline; }
  .milestone__lead { max-width:45ch; }
  .scene-frame--crime { height:500px; }
  .crime-visual__type { font-size:4rem; }
  .crime-visual__version { font-size:10rem; }
  .scene-frame--places { height:430px; }
  .places-visual__neon { font-size:4rem; }
  .place-ticket { right:0; width:70%; }
  .scene-frame--life { height:450px; }
  .life-visual__type,.garage-visual__type { font-size:4rem; }
  .scene-frame--garage { height:460px; }
  .garage-visual__stripes { right:-7px; }
  .pass-visual { min-height:480px; }
  .pass-stack { width:250px; height:360px; }
  .pass-card__mark { width:85px; height:85px; }
  .voice-finale { padding:115px 0 45px 83px; text-align:left; }
  .voice-finale .milestone__marker { left:28px; top:18px; }
  .voice-finale h2 { font-size:clamp(3.3rem,9vw,5.5rem); }
  .voice-finale__head > p { font-size:1rem; }
  .voice-finale__head > p br { display:none; }
  .voice-board { grid-template-columns:1fr; }
  .voice-board__art { height:280px; }
  .voice-board__copy { padding:8px 28px 32px; }
  .voice-board__center { width:108px; height:108px; }
  .voice-board__ring { width:185px; height:185px; }
  .voice-board__ring--outer { width:270px; height:270px; }
  .voice-tag--two { right:4%; top:26%; }
}
@media (max-width:520px) {
  .future-hero { min-height:760px; min-height:calc(100svh - 45px); }
  .future-hero__content { padding-top:155px; padding-bottom:210px; }
  .future-hero h1 { font-size:clamp(3.65rem,13.6vw,4.65rem); }
  .future-hero h1 .title-outline { -webkit-text-stroke-width:1px; }
  .future-hero__copy > p { font-size:1.03rem; margin-block:26px; }
  .future-hero__image { inset:0; opacity:.7; }
  .future-hero__image img { object-position:57% center; }
  .future-hero__image-shade { background:linear-gradient(90deg,#0b0c0fa6,transparent),linear-gradient(0deg,#0b0c0f,transparent 55%,#0b0c0f35); }
  .hero-preview { right:0; bottom:87px; width:127px; }
  .hero-preview > span:first-child { font-size:.9rem; }
  .hero-preview strong { font-size:3.7rem; }
  .hero-preview__arrow { top:10px; right:10px; font-size:1.1rem; }
  .future-hero__bottom { bottom:23px; display:block; }
  .future-hero__bottom > span { display:none; }
  .route-start { font-size:.88rem; gap:12px; }
  .route-start__icon { width:46px; height:46px; }
  .route-nav li { flex-basis:118px; }
  .route-intro { display:block; padding-block:54px 35px; }
  .route-intro h2 { font-size:2.6rem; }
  .route-intro h2 br { display:none; }
  .route-intro p { margin-top:24px; font-size:.88rem; }
  .journey { --route-center:12px; }
  .milestone { padding-left:47px; padding-bottom:70px; gap:28px; }
  .milestone__marker { left:12px; top:31px; width:34px; height:34px; margin-left:-17px; box-shadow:0 0 0 6px var(--bg); }
  .milestone__marker span { font-size:.65rem; }
  .milestone__marker::before { inset:4px; }
  .milestone::before { left:12px; width:35px; top:48px; }
  .milestone.is-active .milestone__marker,.voice-finale.is-active .milestone__marker { box-shadow:0 0 0 5px var(--bg),0 0 0 6px #c8973f35,0 0 30px #c8973f20; }
  .milestone__status { font-size:.68rem; margin-bottom:20px; }
  .milestone h2 { font-size:clamp(2.35rem,9.8vw,3.2rem); line-height:.99; margin-bottom:22px; }
  .milestone--crime h2 em { display:block; }
  .milestone__lead { font-size:1rem; }
  .milestone__copy > p:not(.milestone__lead) { font-size:.9rem; }
  .crime-systems article { gap:10px; padding:15px 0; }
  .crime-systems h3 { font-size:1.02rem; }
  .crime-systems p { font-size:.84rem; }
  .scene-frame--crime { height:390px; }
  .crime-visual__type { top:22px; left:20px; font-size:3rem; }
  .crime-visual__version { font-size:7.4rem; }
  .scene-caption { font-size:.6rem; gap:10px; }
  .place-list li { gap:13px; padding-block:18px; }
  .place-list h3 { font-size:1.05rem; }
  .place-list p { font-size:.85rem; }
  .places-visual { padding:0 6px 50px; }
  .scene-frame--places { height:360px; }
  .places-visual__neon { top:22px; left:20px; font-size:2.7rem; }
  .place-ticket { width:90%; padding:18px 20px; }
  .place-ticket strong { font-size:1.55rem; }
  .place-ticket svg { width:28px; right:15px; }
  .scene-frame--life { height:350px; border-radius:160px 160px 0 0; }
  .life-visual { padding-right:12px; }
  .life-visual__type { font-size:2.8rem; left:18px; bottom:24px; }
  .life-visual__stamp { width:70px; height:70px; right:-4px; bottom:-16px; }
  .life-visual__stamp svg { width:38px; height:38px; }
  .scene-frame--garage { height:360px; }
  .garage-visual__type { font-size:2.8rem; left:18px; }
  .garage-visual__stripes span { height:48px; width:12px; }
  .style-options { gap:18px; }
  .style-options h3 { font-size:1.06rem; }
  .style-options p { font-size:.84rem; }
  .style-options svg { margin-bottom:14px; }
  .milestone__link { font-size:.85rem; }
  .pass-visual { min-height:390px; }
  .pass-stack { width:190px; height:278px; }
  .pass-card { padding:17px; }
  .pass-card__top { font-size:.65rem; }
  .pass-card__mark { width:57px; height:57px; margin-block:16px; }
  .pass-card__name { font-size:2.8rem; }
  .pass-card__bottom { margin-top:15px; padding-top:10px; font-size:.5rem; }
  .pass-card__bars { width:38px; height:14px; }
  .pass-echo--back { transform:translate(20px,10px) rotate(12deg); }
  .pass-echo--middle { transform:translate(10px,5px) rotate(6deg); }
  .pass-orbit span { width:280px; height:280px; }
  .pass-orbit span:nth-child(2) { width:200px; height:200px; }
  .pass-orbit span:nth-child(3) { width:355px; height:355px; }
  .pass-caption { font-size:.6rem; }
  .voice-finale { padding:100px 0 35px 47px; }
  .voice-finale .milestone__marker { left:12px; top:18px; }
  .milestone__marker--voice span { font-size:1.2rem; }
  .voice-finale h2 { font-size:clamp(2.6rem,10vw,3.4rem); }
  .voice-finale__head > p { font-size:.92rem; margin-bottom:30px; }
  .voice-board { margin-left:-47px; width:calc(100% + 47px); }
  .voice-board__copy { padding:0 22px 30px; }
  .voice-board__copy article { gap:13px; }
  .voice-board h3 { font-size:1.15rem; }
  .voice-board p { font-size:.87rem; }
  .voice-board .btn { font-size:.73rem; gap:12px; }
  .voice-tag { font-size:.65rem; padding:9px 12px; }
  .voice-board__art { height:260px; }
  .voice-board .page-actions { justify-content:center; gap:20px; }
}
@media (prefers-reduced-motion:reduce) {
  .road-motion [data-reveal],.road-motion .crime-systems article,.road-motion .place-list li,.road-motion .style-options article,.road-motion .title-mask > span,.road-motion .voice-tag { opacity:1; transform:none; translate:none; transition:none; }
  .road-motion .scene-frame { clip-path:none; transition:none; }
  .future-hero__image img,.scene-frame img { transform:none; }
  .journey__traveller { display:none; }
  .roadmap-page .route-nav__list { scroll-behavior:auto; }
  .t-tilt-glare { display:none; }
}
