.journey { background:#131315; padding:clamp(3rem,7vw,7rem) var(--page-pad); color:#f0eae4; }
.journey-inner { position:relative; max-width:1320px; margin:auto; }
.journey-top { display:flex; justify-content:space-between; align-items:center; }
.journey-time { font:clamp(14px,1.7vw,22px)/1 monospace; letter-spacing:.03em; color:#ed786d; font-variant-numeric:tabular-nums; }
.journey-toggle { width:32px; height:32px; background:none; border:1px solid #4b4444; border-radius:50%; color:#b4a5a5; padding:8px; cursor:pointer; }
.journey-toggle svg { width:100%; height:100%; stroke:currentColor; stroke-width:1.7; fill:none; }
.journey-play { display:none; }.journey.is-paused .journey-play { display:block; }.journey.is-paused .journey-pause { display:none; }
.journey-stage { position:relative; display:grid; grid-template-columns:1.2fr 1fr; align-items:center; min-height:270px; padding:25px 0 35px; overflow:hidden; }
.journey-index { display:block; color:#857a7a; font:10px monospace; letter-spacing:.12em; margin-bottom:18px; }
.journey-copy h2 { font:500 clamp(2.8rem,6.5vw,6.8rem)/1.07 var(--font-display); letter-spacing:-.055em; margin-bottom:18px; }
.journey-title-mask { position:relative; overflow:hidden; padding:5px 0 10px; margin:-5px 0 8px; perspective:600px; }
.journey-title-mask h2 { margin:0; white-space:nowrap; }
.journey-title-mask h2 > span { display:inline-block; }
.journey-title-mask .journey-outgoing { position:absolute; top:5px; left:0; pointer-events:none; }
.journey-stage-flash { position:absolute; left:0; right:0; bottom:9px; height:1px; background:linear-gradient(90deg,#ee8072,transparent 80%); transform-origin:left; pointer-events:none; opacity:0; }
.journey-copy p { color:#a49a98; font-size:clamp(12px,1.1vw,15px); line-height:1.5; }
.journey-visual { position:relative; height:180px; width:100%; max-width:310px; justify-self:center; color:#c7bcb8; }
.journey-drawing { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; }
.journey-drawing:first-child { opacity:1; visibility:visible; }
.journey-drawing > svg { width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round; stroke-linejoin:round; }
.drawing-idea circle { fill:#131315; stroke:#ec796e; }.shoot-dot { fill:#ed786d; stroke:none; }.shoot-ring { stroke:#eb786e; }.delivery-tick { stroke:#ed786d; stroke-width:2; }
.journey-piece { position:absolute; top:56px; height:47px; border:1px solid #9b8582; background:repeating-linear-gradient(90deg,#b5979130 0,#b5979130 22px,#131315 22px,#131315 24px); }
.piece-one { width:27%; left:12%; }.piece-out { width:16%; left:39%; border-color:#ec796e; }.piece-two { width:32%; left:55%; }.journey-blade { position:absolute; height:70px; width:1px; background:#ed786d; top:44px; left:39%; transform:rotate(15deg); }.journey-wave { position:absolute; left:7%; bottom:23px; width:86%!important; height:30px!important; stroke:#927c77!important; }
.journey-rail { position:relative; padding-top:24px; border-top:1px solid #52433f; }
.journey-ticks { position:absolute; top:-9px; left:0; right:0; height:8px; background:repeating-linear-gradient(90deg,#75605b 0,#75605b 1px,transparent 1px,transparent 12px); opacity:.5; }
.journey-progress { position:absolute; top:-1px; left:0; right:0; height:1px; background:#f17b6d; transform:scaleX(0); transform-origin:left; }
.journey-head { position:absolute; top:-26px; left:0; width:1px; height:55px; background:#f48678; box-shadow:0 0 15px #ee766a33; pointer-events:none; }
.journey-head i { position:absolute; top:0; width:9px; height:8px; left:-4px; background:#ed786d; clip-path:polygon(0 0,100% 0,100% 45%,50% 100%,0 45%); }
.journey-stops { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.journey-stops button { appearance:none; background:none; border:0; padding:0; text-align:left; font:12px var(--font-display); color:#827572; cursor:pointer; transition:color .3s; }
.journey-stops button span { font:9px monospace; color:#685a57; margin-right:10px; }.journey-stops button[aria-current] { color:#f0ded8; }.journey-stops button[aria-current] span { color:#ee8c7d; }
.journey button:focus-visible { outline:2px solid #ed786d; outline-offset:6px; }
.journey, .journey * { cursor:auto!important; }.journey button { cursor:pointer!important; }
body:has(.journey:hover) .cursor,body:has(.journey:hover) .cursor-follower { opacity:0!important; }
@media(max-width:700px) {
 .journey { padding:45px 20px; }.journey-stage { grid-template-columns:1fr; min-height:350px; gap:10px; padding:25px 0 30px; }.journey-copy h2 { font-size:2.8rem; margin-bottom:10px; }.journey-index { margin-bottom:12px; }.journey-visual { height:150px; max-width:230px; }.journey-stops { gap:8px; }.journey-stops button { font-size:9px; }.journey-stops button span { display:block; margin:0 0 6px; }.journey-piece { top:45px; }.journey-wave { bottom:9px; }.journey-blade { top:33px; }
}
@media(prefers-reduced-motion:reduce) { .journey-stops button { transition:none; } }