/* Route guides — night palette of the home atlas, same type system and glass. */
.page-dark{background:var(--night);color:var(--paper)}
.page-dark .grain{mix-blend-mode:overlay;opacity:.1}
.page-dark .footer{border-color:#ffffff14}
.page-dark .footer-mark img{filter:none;mix-blend-mode:normal;content:url('/assets/trinityx-light-640.webp')}
.page-dark .footer-links,.page-dark .footer-bottom{color:#ece7dc99;border-color:#ffffff14}
.lang a{display:grid;place-items:center;min-width:34px;height:30px;padding:0 8px;border-radius:99px;font-size:11px;letter-spacing:.1em;opacity:.6;transition:.3s}
.lang a:hover{opacity:1}
.lang a[aria-current]{background:var(--paper);color:var(--ink);opacity:1}
.header-nav a[aria-current]{background:#ffffff1a}
.button-light{background:var(--paper);color:var(--ink)}
.button-light i{background:#1b1a1714}
.button-light:hover{background:#fff}

.route,.routes-index{max-width:var(--max);margin:auto;padding:120px var(--space) 60px}
.crumbs{display:flex;flex-wrap:wrap;gap:10px;color:#ece7dc80}
.crumbs a:hover{color:var(--paper)}
.route-hero{padding:clamp(24px,4vw,56px) 0 clamp(40px,5vw,70px)}
.route-hero-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(30px,6vw,100px);align-items:end;margin-top:clamp(36px,5vw,70px)}
.route-hero .eyebrow{color:var(--bronze-light);margin-bottom:18px}
.route-hero h1{font-size:clamp(46px,7vw,120px);line-height:.9;letter-spacing:-.055em;font-weight:300}
.route-lead{margin-top:26px;max-width:34em;color:#ece7dcb3;font-size:clamp(16px,1.35vw,20px)}
.route-stats{margin:0;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #ffffff1f}
.route-stats div{padding:18px 0;border-bottom:1px solid #ffffff1f}
.route-stats div:nth-child(odd){padding-right:18px;border-right:1px solid #ffffff1f}
.route-stats div:nth-child(even){padding-left:18px}
.route-stats dt{font-family:var(--brand);font-size:8.5px;letter-spacing:.14em;text-transform:uppercase;color:#ece7dc80;margin-bottom:6px}
.route-stats dd{margin:0;font-size:14px;color:#ece7dcb3}
.route-stats b{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(34px,3.4vw,50px);line-height:1;color:var(--ivory)}
.index-atlas{justify-self:end}

.route-map-section{position:relative;height:min(78vh,820px);min-height:460px;border-radius:24px;overflow:hidden;background:#12100d;box-shadow:inset 0 0 0 1px #ffffff14}
.route-map{position:absolute;inset:0}
.route-map .maplibregl-canvas{outline:none}
.route-map-ui{position:absolute;left:16px;right:16px;top:16px;display:flex;justify-content:space-between;align-items:center;gap:12px;pointer-events:none;color:#ece7dcb3}
.route-map-ui .caps{padding:8px 14px;border-radius:99px;background:#12100db3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.route-map-actions{display:flex;gap:6px;pointer-events:auto}
.route-map-actions button{height:38px;padding:0 14px;border-radius:12px;background:#1b1915cc;border:1px solid #ffffff24;color:var(--paper);font-family:var(--brand);font-size:9px;letter-spacing:.12em;text-transform:uppercase;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.route-map-actions button:hover{background:#2a2720}
.route-way{position:absolute;left:16px;bottom:16px;display:flex;align-items:center;gap:12px;padding:8px 16px;border-radius:99px;background:#12100db3;font-size:13px;color:#ece7dccc;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.route-way i{width:40px;height:1px;background:linear-gradient(90deg,#d8ae62,#fff3d9)}
.route-pin{display:flex;align-items:center;gap:8px;color:#f7f3ea;font-size:12px;white-space:nowrap;pointer-events:none}
.route-pin.is-flip{flex-direction:row-reverse}
.route-pin i{width:10px;height:10px;border-radius:50%;background:#ece7dc;border:2px solid #12100d;flex:none}
.route-pin span{padding:4px 10px;border-radius:99px;background:#12100de0;border:1px solid #ffffff26}
.route-pin.is-summit i{width:14px;height:14px;background:#fff3d9;box-shadow:0 0 0 2px #fff3d988,0 0 18px #f1cf8caa}
.route-pin.is-summit span{background:var(--paper);color:var(--ink)}
.route-cursor{width:14px;height:14px;border-radius:50%;background:#d8ae62;border:2px solid #12100d;box-shadow:0 0 0 6px #d8ae6240}

.route-section{padding:clamp(70px,8vw,120px) 0 0;scroll-margin-top:60px}
.route-section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:clamp(26px,3vw,40px);padding-bottom:18px;border-bottom:1px solid #ffffff1f}
.route-section-head h2{font-size:clamp(32px,3.6vw,56px);letter-spacing:-.045em;line-height:1;font-weight:300}
.route-section-head p{color:#ece7dc80;font-size:14px;max-width:30em}
.profile{position:relative}
.profile svg{width:100%;height:auto;overflow:visible;touch-action:pan-y}
.profile-grid line{stroke:#ffffff14}
.profile-grid text,.profile-km{font-family:Manrope,sans-serif;font-size:13px;fill:#ece7dc73}
.profile-area{fill:url(#profile-fill)}
.profile-line{fill:none;stroke:#d8ae62;stroke-width:2.4;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.profile-summit circle{fill:#fff3d9}
.profile-summit text{font-family:Manrope,sans-serif;font-size:14px;fill:#f7f3ea}
.profile-cursor[hidden]{display:none}
.profile-cursor line{stroke:#ece7dc66;stroke-dasharray:4 4}
.profile-cursor circle{fill:#d8ae62;stroke:#12100d;stroke-width:2}
.profile-hit{cursor:crosshair}
.profile-readout{position:absolute;right:0;top:-8px;display:flex;gap:12px;align-items:baseline;opacity:0;transition:opacity .3s}
.profile.is-active .profile-readout{opacity:1}
.profile-readout b{font-family:var(--serif);font-style:italic;font-weight:400;font-size:30px;color:var(--ivory)}
.profile-readout span{font-size:13px;color:#ece7dc99}

.sides{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.side{padding:clamp(24px,3vw,36px);border-radius:22px;background:linear-gradient(135deg,#ffffff10,#ffffff05);border:1px solid #ffffff1a;display:grid;gap:8px}
.side .numeral{font-size:34px;line-height:1;color:var(--bronze-light)}
.side h3{font-size:clamp(22px,2vw,30px);letter-spacing:-.03em;font-weight:300}
.side-from{color:#ece7dc80}
.side dl{margin:14px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.side dl div{display:flex;flex-direction:column-reverse;justify-content:flex-end}
.side dd{margin:0;color:#ece7dcb3;font-size:13px}
.side dd b{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(28px,2.6vw,38px);color:var(--ivory)}
.side dt{font-family:var(--brand);font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:#ece7dc73;margin-top:4px}

.before{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(30px,5vw,80px)}
.before li{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:22px 0;border-bottom:1px solid #ffffff14}
.before .numeral{font-size:26px;line-height:1;color:var(--bronze-light)}
.before p{color:#ece7dcb3}
.before a{color:var(--bronze-light);border-bottom:1px solid currentColor}

.route-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.route-cards li[hidden]{display:none}
.route-card{display:grid;gap:6px;height:100%;padding:16px 16px 18px;border-radius:18px;background:linear-gradient(135deg,#ffffff0f,#ffffff05);border:1px solid #ffffff17;transition:transform .5s var(--ease),background .3s,border-color .3s}
.route-card:hover{transform:translateY(-4px);background:#ffffff14;border-color:#ffffff33}
.route-card svg{width:100%;height:auto;margin-bottom:6px;border-radius:12px;background:#0d0c0a}
.route-card path{fill:none;stroke:#d8ae62;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.route-card circle{fill:#fff3d9}
.route-card .caps{color:#ece7dc80;font-size:8.5px}
.route-card b{font-weight:400;font-size:18px;letter-spacing:-.02em;line-height:1.2}
.route-card-meta{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;font-size:13px;color:#ece7dc99}
.route-card-meta em{font-size:19px;color:var(--bronze-light)}
.route-cards-index{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}

.index-tools{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-bottom:28px;padding:16px 0;border-top:1px solid #ffffff14;border-bottom:1px solid #ffffff14}
.index-tools .atlas-filters{flex:1}
.index-sort{display:flex;align-items:center;gap:10px;color:#ece7dc80}
.index-sort select{appearance:none;padding:8px 30px 8px 14px;border-radius:99px;border:1px solid #ffffff24;background:#1b1915 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23ece7dc' stroke-width='1.2'/%3E%3C/svg%3E") no-repeat right 12px center;color:var(--paper);font-family:var(--sans);font-size:12px;letter-spacing:0;text-transform:none}
.index-count{color:var(--bronze-light)}

.route-cta{margin-top:clamp(80px,10vw,140px);padding:clamp(40px,6vw,80px);border-radius:28px;background:radial-gradient(90% 120% at 100% 0%,#3a2f1f,transparent 60%),#1b1915;border:1px solid #ffffff14;display:grid;justify-items:start;gap:18px}
.route-cta img{width:90px}
.route-cta h2{font-size:clamp(34px,4.4vw,72px);line-height:.95;letter-spacing:-.05em;font-weight:300}
.route-cta h2 em{color:var(--bronze-light)}
.route-cta p{max-width:32em;color:#ece7dcb3}
.route-credits{margin-top:40px;font-size:11px;color:#ece7dcb3;max-width:70em}
.atlas-guide{display:inline-flex;align-items:center;gap:10px;margin-top:6px;font-family:var(--brand);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--bronze-light)}
.atlas-guide:hover{color:var(--paper)}

@media(max-width:1100px){.route-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){
  .route,.routes-index{padding-top:100px}
  .route-hero-grid,.sides,.before{grid-template-columns:1fr}
  .index-atlas{justify-self:start}
  .route-map-section{height:62vh;min-height:380px;border-radius:18px}
  .route-section-head{flex-direction:column;align-items:start;gap:10px}
  .side dl{grid-template-columns:repeat(3,1fr)}
  .profile-readout{position:static;margin-top:10px;min-height:40px}
  .route-way{font-size:11px;max-width:calc(100% - 32px)}
}
@media(max-width:600px){
  .route-cards{grid-template-columns:1fr 1fr;gap:10px}
  .route-card{padding:10px 10px 14px}
  .route-card b{font-size:15px}
  .route-map-ui .caps{display:none}
  .route-pin span{white-space:normal;max-width:130px;line-height:1.25;border-radius:12px}
  .profile-grid text,.profile-km{font-size:28px}
  .profile-summit text{font-size:30px}
  .profile-km:nth-of-type(even){display:none}
  .profile svg{padding-left:10px}
  .header .lang{display:none}
}
