.route-loader{display:none}
.route-loader[hidden]{display:none!important}
.cinematic-js .route-loader{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;background:#090b0f;color:#f4f7fa}
.route-loader__wordmark{position:absolute;left:clamp(20px,4vw,56px);top:clamp(22px,4vw,42px);font:500 18px/1 Arial,sans-serif;letter-spacing:.18em}
.route-loader__meta{position:absolute;left:clamp(20px,4vw,56px);right:clamp(20px,4vw,56px);bottom:clamp(24px,5vw,48px);display:flex;justify-content:space-between;gap:20px;color:#9da4ae;font-size:11px;line-height:1.5;letter-spacing:.12em}
.route-loader__route{width:min(1120px,92vw);height:auto;filter:drop-shadow(0 0 16px rgba(255,36,23,.18))}
.route-loader__ghost{fill:none;stroke:#343a44;stroke-width:3;vector-effect:non-scaling-stroke}
.route-loader__known,.route-loader__unknown{fill:none;stroke:#ff2417;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.route-loader__known{stroke-dasharray:520;stroke-dashoffset:520;animation:route-known 1.2s cubic-bezier(.4,0,.2,1) forwards}
.route-loader__known--last{animation-delay:1.05s}
.route-loader__unknown{stroke:#f4f7fa;stroke-width:3;stroke-dasharray:13 15;stroke-dashoffset:180;opacity:.8;animation:route-unknown .72s linear .72s forwards}
.route-loader__point{fill:#f4f7fa;opacity:0;animation:route-point .2s ease-out 1.7s forwards}
.route-loader__label{fill:#9da4ae;font:500 12px/1 ui-monospace,'SFMono-Regular',Consolas,monospace;letter-spacing:.14em;opacity:0;animation:route-point .25s ease-out .78s forwards}
.route-loader.is-leaving{pointer-events:none;animation:loader-leave .58s cubic-bezier(.4,0,.2,1) forwards}

.cinematic-hero{position:relative;isolation:isolate;background:#090b0f;min-height:100svh}
.cinematic-hero__media{position:absolute;inset:0;z-index:-2;overflow:hidden;background:#11151a}
.cinematic-hero__media:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,11,15,.92) 0%,rgba(9,11,15,.62) 34%,rgba(9,11,15,.12) 66%,rgba(9,11,15,.34) 100%),linear-gradient(0deg,rgba(9,11,15,.74) 0%,transparent 42%,rgba(9,11,15,.2) 100%)}
.cinematic-hero__image{position:absolute;inset:-3%;width:106%;height:106%;object-fit:cover;opacity:0;transform:scale(1.035);transition:opacity .8s ease,transform 5s cubic-bezier(.2,.7,.2,1)}
.cinematic-hero[data-mode='RIDE'] .cinematic-hero__image[data-scene='RIDE'],.cinematic-hero[data-mode='DRIVE'] .cinematic-hero__image[data-scene='DRIVE'],.cinematic-hero[data-mode='PEDAL'] .cinematic-hero__image[data-scene='PEDAL'],.cinematic-hero[data-mode='HIKE'] .cinematic-hero__image[data-scene='HIKE']{opacity:1;transform:scale(1)}
.cinematic-hero .top,.cinematic-hero .hero,.cinematic-hero .bottom{position:relative;z-index:1}
.cinematic-hero .q{text-shadow:0 2px 28px rgba(0,0,0,.45)}
.cinematic-hero .line svg{filter:drop-shadow(0 2px 16px rgba(0,0,0,.35))}
.cinematic-hero .status,.cinematic-hero .a2{color:#c1c6cd;text-shadow:0 1px 12px rgba(0,0,0,.7)}

@keyframes route-known{to{stroke-dashoffset:0}}
@keyframes route-unknown{to{stroke-dashoffset:0}}
@keyframes route-point{to{opacity:1}}
@keyframes loader-leave{to{opacity:0;visibility:hidden;transform:translateY(-2%)}}
@media(max-width:820px){
 .route-loader__route{width:138vw;transform:rotate(-8deg)}
 .route-loader__meta{align-items:flex-end}.route-loader__meta span:last-child{text-align:right}
 .cinematic-hero__media:after{background:linear-gradient(180deg,rgba(9,11,15,.52),rgba(9,11,15,.1) 34%,rgba(9,11,15,.76) 72%,rgba(9,11,15,.9))}
 .cinematic-hero__image{inset:0;width:100%;height:100%;object-position:62% center}
 .cinematic-hero__image[data-scene='HIKE']{object-position:40% center}
}

@media(prefers-reduced-motion:reduce){
 .cinematic-js .route-loader{display:none}
 .cinematic-hero__image{transition:none;transform:none!important}
}
