/* ============================================================
 COLOMBIA ADVENTURE MOTO TOURS — guided motorcycle tours and rentals, Medellín
 Base: Compass (tooplate 2164, free) — full-bleed hero, prologue, sticky crossfading route.
 Scrollers after La Casa del Camarón (ticker, two-row strip, snap carousel), restyled.
 Fonts: Barlow Condensed (display) · Instrument Sans (body) · JetBrains Mono (labels)
 Palette: ink #0C100D · paper #F2F0E8 · logo green #006401 · signal green #62D65B
 ============================================================ */
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url('../font/barlow-condensed-700-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url('../font/barlow-condensed-700-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Instrument Sans'; font-style: normal; font-weight: 400 600; font-display: swap; src: url('../font/instrument-sans-400-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Instrument Sans'; font-style: normal; font-weight: 400 600; font-display: swap; src: url('../font/instrument-sans-400-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('../font/jetbrains-mono-500-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'JetBrains Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url('../font/jetbrains-mono-500-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
 /* palette — road-dark first, logo green #006401 on paper, signal green #62D65B on dark */
 --ink: #0C100D;
 --ink-2: #141A15;
 --ink-3: #1E2620;
 --asphalt: #262B27;
 --paper: #F2F0E8;
 --paper-2: #E6E3D8;
 --card: #FBFAF6;
 --green: #006401;
 --green-ink: #0A4A0B;
 --green-bright: #62D65B;
 --text-dark: #EDEBE3;
 --muted: #4E554B;
 --muted-dark: #A3AA9F;
 --line: rgba(12, 16, 13, 0.16);
 --line-dark: rgba(237, 235, 227, 0.14);

 --font-display: "Barlow Condensed", "Arial Narrow", Impact, sans-serif;
 --font-body: "Instrument Sans", -apple-system, system-ui, sans-serif;
 --font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;

 --text-hero: clamp(3.6rem, 1.2rem + 9vw, 10rem);
 --text-h2: clamp(2.4rem, 1.2rem + 4.2vw, 5rem);
 --text-lead: clamp(1.05rem, 0.98rem + 0.4vw, 1.28rem);
 --container: 1280px;
 --gutter: clamp(1.15rem, 0.6rem + 2.6vw, 3rem);
 --space: clamp(4.5rem, 3rem + 6vw, 9rem);
 --radius: 4px;
 --ease: cubic-bezier(0.16, 1, 0.3, 1);
 --dur: 320ms;
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { font-family: var(--font-body); background: var(--ink); color: var(--text-dark); line-height: 1.6; font-size: 1.02rem; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; border: 0; background: none; color: inherit; }
ul, ol { list-style: none; padding: 0; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 700; text-transform: uppercase; line-height: 0.94; letter-spacing: 0.005em; }
::selection { background: var(--green-bright); color: var(--ink); }
:focus-visible { outline: 3px solid var(--green-bright); outline-offset: 3px; }
.light :focus-visible { outline-color: var(--green); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link { position: absolute; left: -999px; top: 0; z-index: 300; background: var(--green-bright); color: var(--ink); padding: 0.7rem 1.1rem; font-weight: 600; }
.skip-link:focus { left: 0; }
.wrap { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.section { padding-block: var(--space); position: relative; }
.light { background: var(--paper); color: var(--ink); }
.light-2 { background: var(--paper-2); color: var(--ink); }
.label { font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--green-bright); display: inline-flex; align-items: center; gap: 0.7rem; }
.label::after { content: ""; width: 40px; height: 1px; background: currentColor; opacity: 0.6; }
.light .label, .light-2 .label { color: var(--green); }
.head { display: grid; gap: 1rem; max-width: 760px; margin-bottom: clamp(2.2rem, 1rem + 4vw, 4rem); }
.head h2 { font-size: var(--text-h2); }
.head p { font-size: var(--text-lead); color: var(--muted-dark); }
.light .head p, .light-2 .head p { color: var(--muted); }
.note { font-size: 0.86rem; color: var(--muted); margin-top: 1.4rem; }

/* ---------- buttons ---------- */
.btn { display: inline-flex; align-items: center; gap: 0.6rem; font-weight: 600; font-size: 0.95rem; padding: 0.95rem 1.5rem; border-radius: var(--radius); transition: transform var(--dur) var(--ease), background var(--dur), color var(--dur), border-color var(--dur); white-space: nowrap; }
.btn svg { width: 17px; height: 17px; transition: transform var(--dur) var(--ease); }
.btn:hover svg { transform: translate(3px, -3px); }
.btn-signal { background: var(--green-bright); color: var(--ink); }
.btn-signal:hover { background: #fff; }
.btn-green { background: var(--green); color: #fff; }
.btn-green:hover { background: var(--green-ink); }
.btn-line { border: 1.5px solid var(--line-dark); color: var(--text-dark); }
.btn-line:hover { border-color: var(--text-dark); }
.light .btn-line, .light-2 .btn-line { border-color: var(--line); color: var(--ink); }
.light .btn-line:hover, .light-2 .btn-line:hover { border-color: var(--ink); }
.btn-lg { padding: 1.1rem 1.8rem; font-size: 1.02rem; }

/* ---------- nav (overlays the hero, solid on scroll) ---------- */
.nav-bar { position: fixed; inset: 0 0 auto 0; z-index: 100; transition: background var(--dur), border-color var(--dur); border-bottom: 1px solid transparent; }
.nav-bar.scrolled, .nav-bar.solid { background: rgba(12, 16, 13, 0.92); backdrop-filter: blur(12px); border-color: var(--line-dark); }
.nav-inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; height: 76px; }
.brand { display: inline-flex; align-items: center; gap: 0.75rem; line-height: 1; }
.brand-logo { width: 46px; height: 46px; background: var(--paper); border-radius: 50%; padding: 2px; flex: 0 0 auto; }
.brand .word { display: grid; gap: 0.22rem; }
.brand .w1 { font-family: var(--font-display); font-weight: 700; font-size: 1.2rem; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; }
.brand .w2 { font-family: var(--font-mono); font-size: 0.6rem; letter-spacing: 0.26em; text-transform: uppercase; color: var(--muted-dark); white-space: nowrap; }
.nav-links { display: flex; gap: 2rem; font-weight: 500; font-size: 0.95rem; }
.nav-links a { color: rgba(237,235,227,0.86); transition: color var(--dur); position: relative; padding-block: 0.4rem; }
.nav-links a:hover, .nav-links a[aria-current="page"] { color: var(--text-dark); }
.nav-links a[aria-current="page"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--green-bright); }
.nav-cta { display: flex; align-items: center; gap: 0.8rem; }
.lang { font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.12em; padding: 0.6rem 0.75rem; border: 1.5px solid var(--line-dark); border-radius: var(--radius); color: var(--muted-dark); }
.lang:hover { color: var(--text-dark); border-color: var(--text-dark); }
.nav-toggle { display: none; width: 44px; height: 44px; border: 1.5px solid var(--line-dark); border-radius: var(--radius); }
.nav-toggle span { display: block; width: 18px; height: 2px; background: var(--text-dark); margin: 4px auto; transition: transform var(--dur); }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.nav-mobile-cta { display: none; }

/* ---------- hero (Compass: full-bleed photograph, title bottom-left) ---------- */
.hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; overflow: hidden; }
.hero-image { position: absolute; inset: 0; }
.hero-image img { width: 100%; height: 100%; object-fit: cover; }
.hero-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(12,16,13,0.78) 0%, rgba(12,16,13,0.12) 26%, rgba(12,16,13,0.35) 58%, rgba(12,16,13,0.94) 100%); }
.hero-content { position: relative; z-index: 1; width: 100%; padding-top: 120px; padding-bottom: clamp(2rem, 1rem + 3vw, 3.5rem); }
.hero h1 { font-size: var(--text-hero); line-height: 0.86; margin-top: 1.1rem; max-width: 12ch; }
.hero h1 .accent { color: var(--green-bright); }
.hero-row { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(1.5rem, 1rem + 3vw, 4rem); align-items: end; margin-top: clamp(1.4rem, 1rem + 2vw, 2.4rem); }
.hero-lead { font-size: var(--text-lead); color: rgba(237,235,227,0.88); max-width: 48ch; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: 1.6rem; }
.hero-meta { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line-dark); }
.hero-meta div { padding: 1rem 0.8rem 0 0; }
.hero-meta div:nth-child(n+3) { border-top: 1px solid var(--line-dark); margin-top: 1rem; }
.hero-meta .num { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.5rem); line-height: 1; }
.hero-meta .lbl { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted-dark); margin-top: 0.4rem; }
.hero-scroll { position: absolute; right: var(--gutter); top: 50%; z-index: 1; writing-mode: vertical-rl; font-family: var(--font-mono); font-size: 0.66rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--muted-dark); display: flex; align-items: center; gap: 1rem; }
.hero-scroll::after { content: ""; width: 1px; height: 64px; background: linear-gradient(var(--green-bright), transparent); animation: cue 2.4s var(--ease) infinite; transform-origin: top; }
@keyframes cue { 0% { transform: scaleY(0); } 60% { transform: scaleY(1); } 100% { transform: scaleY(1); opacity: 0; } }

/* ---------- scroller 1: destination ticker (outline / solid alternating) ---------- */
.ticker { overflow: hidden; border-block: 1px solid var(--line-dark); padding-block: clamp(1rem, 0.6rem + 1.4vw, 1.8rem); background: var(--ink); }
.ticker-track { display: flex; width: max-content; animation: ticker 40s linear infinite; }
.ticker:hover .ticker-track { animation-play-state: paused; }
.ticker-group { display: flex; align-items: center; gap: clamp(1.4rem, 1rem + 2vw, 3rem); padding-right: clamp(1.4rem, 1rem + 2vw, 3rem); font-family: var(--font-display); font-weight: 700; font-size: clamp(2.4rem, 1.4rem + 4vw, 5.4rem); text-transform: uppercase; line-height: 1; white-space: nowrap; }
.ticker-group span:nth-child(4n+1) { color: transparent; -webkit-text-stroke: 1.5px rgba(237,235,227,0.55); }
.ticker-group span:nth-child(4n+3) { color: var(--green-bright); }
.ticker-group i { width: clamp(22px, 2vw, 34px); height: 6px; background: var(--green-bright); transform: skewX(-24deg); flex: 0 0 auto; }
@keyframes ticker { to { transform: translateX(-50%); } }

/* ---------- prologue (Compass: drop cap + pull quote) ---------- */
.prologue-inner { max-width: 760px; margin-inline: auto; }
.prologue h2 { font-size: var(--text-h2); margin: 1.2rem 0 1.8rem; }
.prologue-text { font-size: clamp(1.1rem, 1rem + 0.5vw, 1.35rem); line-height: 1.75; }
.prologue-text + .prologue-text { margin-top: 1.4rem; }
.prologue-text.drop::first-letter { float: left; font-family: var(--font-display); font-weight: 700; font-size: 5.2em; line-height: 0.8; padding: 0.06em 0.12em 0 0; color: var(--green); }
.pullquote { margin: clamp(2.4rem, 1.5rem + 3vw, 3.6rem) 0; padding-left: clamp(1.2rem, 1rem + 1.5vw, 2rem); border-left: 3px solid var(--green); }
.pullquote blockquote { font-family: var(--font-display); font-weight: 700; text-transform: uppercase; font-size: clamp(1.7rem, 1.1rem + 2.2vw, 2.8rem); line-height: 1.02; }
.pullquote figcaption { font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); margin-top: 1rem; }

/* ---------- route (Compass: sticky background that crossfades per chapter) ---------- */
.route { position: relative; }
.route-bg { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; }
.route-bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.2s var(--ease); }
.route-bg img.active { opacity: 1; }
.route-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12,16,13,0.96) 0%, rgba(12,16,13,0.86) 34%, rgba(12,16,13,0.35) 70%, rgba(12,16,13,0.15) 100%); }
.route-chapters { position: relative; z-index: 1; margin-top: -100vh; margin-top: -100svh; }
.chapter { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; max-width: 620px; padding-block: 12vh; }
.chapter-number { font-family: var(--font-display); font-weight: 700; font-size: clamp(5rem, 3rem + 7vw, 9rem); line-height: 0.8; color: transparent; -webkit-text-stroke: 1.5px var(--green-bright); }
.chapter-location { font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--green-bright); margin: 1.4rem 0 1rem; }
.chapter h2 { font-size: clamp(2.6rem, 1.4rem + 4vw, 4.6rem); }
.chapter p { color: rgba(237,235,227,0.86); font-size: var(--text-lead); margin-top: 1.2rem; max-width: 46ch; }
.chapter-foot { display: flex; align-items: center; gap: 1.6rem; flex-wrap: wrap; margin-top: 2rem; }
.chapter-price { font-family: var(--font-mono); font-size: 0.8rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted-dark); }
.chapter-price strong { display: block; font-family: var(--font-display); font-size: 2rem; letter-spacing: 0.02em; color: var(--text-dark); }

/* ---------- scroller 2: two-row photo strip, rows drift in opposite directions ---------- */
.strip { overflow: hidden; padding-block: 0 var(--space); -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent); }
.strip-row { display: flex; width: max-content; gap: 0.9rem; padding-right: 0; animation: strip-left 60s linear infinite; }
.strip-row + .strip-row { margin-top: 0.9rem; animation-name: strip-right; animation-duration: 70s; }
.strip:hover .strip-row { animation-play-state: paused; }
.strip-dup { display: flex; gap: 0.9rem; margin-right: 0.9rem; }
.strip-row figure { flex: 0 0 auto; width: clamp(150px, 10vw + 100px, 250px); aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--radius); background: var(--ink-3); }
.strip-row img { width: 100%; height: 100%; object-fit: cover; filter: saturate(1.05); }
.strip-head { padding-top: var(--space); }
@keyframes strip-left { to { transform: translateX(-50%); } }
@keyframes strip-right { from { transform: translateX(-50%); } to { transform: none; } }

/* ---------- scroller 3: snap carousel with prev/next ---------- */
.car-head { display: flex; justify-content: space-between; align-items: end; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 2rem; }
.car-head .head { margin-bottom: 0; }
.car-nav { display: flex; gap: 0.6rem; }
.car-btn { width: 48px; height: 48px; border-radius: var(--radius); border: 1.5px solid var(--line); display: grid; place-items: center; color: var(--ink); transition: background var(--dur), color var(--dur), border-color var(--dur); }
.car-btn:hover { background: var(--green); border-color: var(--green); color: #fff; }
.car-btn svg { width: 20px; height: 20px; }
.car-track { display: flex; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 0.4rem; }
.car-track::-webkit-scrollbar { display: none; }
.car-slide { flex: 0 0 clamp(260px, 24vw, 330px); scroll-snap-align: start; background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column; }
.car-slide .cs-media { aspect-ratio: 4 / 5; overflow: hidden; background: var(--paper-2); }
.car-slide .cs-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.9s var(--ease); }
.car-slide:hover .cs-media img { transform: scale(1.04); }
.car-slide .cs-body { padding: 1.1rem 1.2rem 1.3rem; display: grid; gap: 0.35rem; }
.car-slide h3 { font-size: 1.6rem; }
.cs-rate { font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.cs-rate strong { color: var(--green); font-size: 0.9rem; }

/* ---------- reviews ---------- */
.reviews { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line-dark); }
.review { padding: 2rem 2rem 0 0; display: flex; flex-direction: column; justify-content: space-between; gap: 1.4rem; }
.review + .review { padding-left: 2rem; border-left: 1px solid var(--line-dark); }
.review blockquote { font-size: 1.1rem; line-height: 1.55; }
.review blockquote::before { content: "“"; display: block; font-family: var(--font-display); font-size: 4rem; line-height: 0.6; color: var(--green-bright); margin-bottom: 0.4rem; }
.review figcaption { font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted-dark); }
.reviews + .note { color: var(--muted-dark); }

/* ---------- full-bleed CTA ---------- */
.cta-full { position: relative; overflow: hidden; }
.cta-full > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cta-full::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12,16,13,0.94), rgba(12,16,13,0.6) 60%, rgba(12,16,13,0.3)); z-index: 1; }
.cta-full .wrap { position: relative; z-index: 2; }
.cta-full h2 { font-size: var(--text-h2); max-width: 14ch; margin-top: 1rem; }
.cta-full p { font-size: var(--text-lead); max-width: 46ch; margin-top: 1.1rem; color: rgba(237,235,227,0.88); }
.cta-full .actions { display: flex; gap: 0.8rem; flex-wrap: wrap; margin-top: 2rem; }

/* ---------- page hero (inner pages) ---------- */
.page-hero { position: relative; min-height: 64svh; display: flex; align-items: flex-end; overflow: hidden; }
.page-hero.plain { min-height: auto; padding-top: 150px; }
.page-hero .hero-image::after { background: linear-gradient(180deg, rgba(12,16,13,0.6), rgba(12,16,13,0.2) 40%, rgba(12,16,13,0.95)); }
.page-hero .hero-content { padding-bottom: clamp(2rem, 1rem + 3vw, 3.5rem); }
.page-hero h1 { font-size: clamp(3rem, 1.4rem + 6vw, 7rem); line-height: 0.88; margin-top: 1rem; max-width: 14ch; }
.page-hero p { font-size: var(--text-lead); color: rgba(237,235,227,0.88); max-width: 56ch; margin-top: 1.2rem; }
.crumb { font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted-dark); }
.crumb a { display: inline-block; padding-block: 0.35rem; }
.crumb a:hover { color: var(--text-dark); }

/* ---------- tour ledger (tours page): numbered rows, not cards ---------- */
.ledger { border-top: 1px solid var(--line); counter-reset: tour; }
.ledger-row { display: grid; grid-template-columns: 60px 300px 1fr auto; gap: clamp(1rem, 0.5rem + 2vw, 2.5rem); align-items: center; padding-block: clamp(1.2rem, 0.8rem + 1.2vw, 2rem); border-bottom: 1px solid var(--line); }
.ledger-num { font-family: var(--font-display); font-weight: 700; font-size: 2.6rem; line-height: 1; color: transparent; -webkit-text-stroke: 1.2px var(--green); }
.ledger-media { aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--radius); background: var(--paper-2); }
.ledger-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.9s var(--ease); }
.ledger-row:hover .ledger-media img { transform: scale(1.05); }
.ledger-meta { font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--green); }
.ledger-body h3 { font-size: clamp(1.8rem, 1.3rem + 1.4vw, 2.6rem); margin-top: 0.4rem; }
.ledger-body p { color: var(--muted); margin-top: 0.5rem; max-width: 52ch; }
.ledger-side { display: grid; justify-items: end; gap: 0.8rem; text-align: right; }
.price { display: grid; line-height: 1.15; }
.price .p-from { font-family: var(--font-mono); font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.price strong { font-family: var(--font-display); font-size: 2rem; letter-spacing: 0.02em; }
.price .p-cop { font-size: 0.84rem; color: var(--muted); }
.dark .price .p-from, .dark .price .p-cop { color: var(--muted-dark); }

/* ---------- golden loop: vertical route line ---------- */
.loop-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: start; }
.loop-media img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--radius); position: sticky; top: 100px; }
.loop-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem 1.6rem; margin-top: 2rem; }
.loop-facts li { border-top: 1px solid var(--line-dark); padding-top: 0.8rem; display: grid; gap: 0.2rem; }
.loop-facts .k { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted-dark); }
.stops { margin-top: 2.2rem; position: relative; padding-left: 1.8rem; }
.stops::before { content: ""; position: absolute; left: 5px; top: 0.5rem; bottom: 0.5rem; width: 2px; background: repeating-linear-gradient(var(--green-bright) 0 10px, transparent 10px 18px); }
.stops li { position: relative; font-family: var(--font-display); font-weight: 700; text-transform: uppercase; font-size: 1.35rem; padding-block: 0.25rem; }
.stops li::before { content: ""; position: absolute; left: -1.8rem; top: 50%; width: 12px; height: 12px; margin-top: -6px; border-radius: 50%; background: var(--ink); border: 2px solid var(--green-bright); }
.stops li:first-child::before, .stops li:last-child::before { background: var(--green-bright); }

/* ---------- fleet: spec-sheet rows ---------- */
.spec { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(1.5rem, 1rem + 4vw, 5rem); align-items: center; padding-block: clamp(2rem, 1rem + 3vw, 4rem); border-bottom: 1px solid var(--line); }
.spec:nth-child(even) .spec-media { order: 2; }
.spec-media { aspect-ratio: 4 / 5; overflow: hidden; border-radius: var(--radius); background: var(--paper-2); max-width: 460px; }
.spec:nth-child(even) .spec-media { justify-self: end; }
.spec-media img { width: 100%; height: 100%; object-fit: cover; }
.spec-idx { font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--green); }
.spec h3 { font-size: clamp(2.4rem, 1.4rem + 3vw, 4rem); margin: 0.6rem 0 1.4rem; }
.rates { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 2px solid var(--ink); }
.rate { padding: 1rem 1rem 1rem 0; }
.rate + .rate { padding-left: 1rem; border-left: 1px solid var(--line); }
.rate dt { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.rate dd { display: grid; margin-top: 0.3rem; }
.rate dd strong { font-family: var(--font-display); font-size: 1.6rem; letter-spacing: 0.02em; white-space: nowrap; }
.rate dd span { font-size: 0.84rem; color: var(--muted); }
.spec .btn { margin-top: 1.4rem; }

/* ---------- equipment + faq ---------- */
.eq { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line-dark); }
.eq li { padding: 1.6rem 1.6rem 0 0; }
.eq li + li { padding-left: 1.6rem; border-left: 1px solid var(--line-dark); }
.eq .n { font-family: var(--font-mono); font-size: 0.74rem; color: var(--green-bright); }
.eq h3 { font-size: 1.7rem; margin-top: 0.6rem; }
.eq p { color: var(--muted-dark); margin-top: 0.4rem; font-size: 0.96rem; }
.faq { max-width: 860px; border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); padding-block: 1.3rem; }
.faq summary { font-family: var(--font-display); font-weight: 700; text-transform: uppercase; font-size: 1.5rem; cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--green); }
.faq details[open] summary::after { content: "\2013"; }
.faq p { color: var(--muted); margin-top: 0.7rem; max-width: 64ch; }

/* ---------- about ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
.split-media img { width: 100%; aspect-ratio: 5 / 6; object-fit: cover; border-radius: var(--radius); }
.split h2 { font-size: var(--text-h2); margin: 1rem 0 1.2rem; }
.split p { font-size: var(--text-lead); color: var(--muted-dark); }
.light .split p { color: var(--muted); }
.split p + p { margin-top: 1rem; }
.principles { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }
.principles li { padding: 1.8rem 1.8rem 1.8rem 0; border-bottom: 1px solid var(--line); }
.principles li:not(:nth-child(3n+1)) { padding-left: 1.8rem; border-left: 1px solid var(--line); }
.principles .n { font-family: var(--font-display); font-weight: 700; font-size: 2.6rem; color: transparent; -webkit-text-stroke: 1.2px var(--green); line-height: 1; }
.principles h3 { font-size: 1.7rem; margin-top: 0.8rem; }
.principles p { color: var(--muted); margin-top: 0.4rem; }
.facts { display: grid; gap: 1.2rem; margin-top: 2rem; }
.facts li { border-top: 1px solid var(--line-dark); padding-top: 0.8rem; display: grid; gap: 0.2rem; }
.facts .k { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted-dark); }
.facts a { font-weight: 600; display: inline-block; padding-block: 0.3rem; }
.facts a:hover { color: var(--green-bright); }
.socials { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.social { border: 1px solid var(--line); border-radius: var(--radius); padding: 1.6rem; display: grid; gap: 0.4rem; background: var(--card); transition: border-color var(--dur), transform var(--dur) var(--ease); }
.social:hover { border-color: var(--green); transform: translateY(-3px); }
.social svg { width: 28px; height: 28px; color: var(--green); }
.social h3 { font-size: 1.7rem; margin-top: 0.6rem; }
.social p { color: var(--muted); overflow-wrap: anywhere; }

/* ---------- contact ---------- */
.contact-grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: start; }
.info-item { display: grid; grid-template-columns: 44px 1fr; gap: 1rem; padding-block: 1.3rem; border-bottom: 1px solid var(--line); }
.info-item:first-child { border-top: 1px solid var(--line); }
.ii-ico { width: 44px; height: 44px; border-radius: var(--radius); background: var(--ink); color: var(--green-bright); display: grid; place-items: center; }
.ii-ico svg { width: 21px; height: 21px; }
.info-item h2 { font-size: 1.35rem; }
.info-item a { display: inline-block; padding-block: 0.3rem; font-weight: 600; overflow-wrap: anywhere; }
.info-item a:hover { color: var(--green); }
.info-item p { color: var(--muted); font-size: 0.95rem; }
.form-card { background: var(--ink); color: var(--text-dark); border-radius: var(--radius); padding: clamp(1.5rem, 1rem + 2vw, 2.6rem); }
.form-card h2 { font-size: 2.4rem; margin-bottom: 1.4rem; }
.field { display: grid; gap: 0.45rem; margin-bottom: 1.1rem; }
.field label { font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted-dark); }
.field input, .field select, .field textarea { font: inherit; font-size: 1rem; padding: 0.85rem 1rem; background: var(--ink-3); color: var(--text-dark); border: 1px solid var(--line-dark); border-radius: var(--radius); color-scheme: dark; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--green-bright); }
.field textarea { resize: vertical; min-height: 120px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.form-card .btn { width: 100%; justify-content: center; margin-top: 0.4rem; }
.form-note { font-size: 0.84rem; color: var(--muted-dark); margin-top: 0.9rem; text-align: center; }

/* ---------- reveal ---------- */
.js [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity 0.8s var(--ease), transform 0.8s var(--ease); }
.js [data-reveal].in { opacity: 1; transform: none; }

/* ============================================================
 SIGNATURE FOOTER — road + tach + throttle + rev (motorcycle motifs)
 Transform/opacity only; readable with JS off; still under prefers-reduced-motion.
 ============================================================ */
.site-footer { position: relative; overflow: hidden; isolation: isolate; background: var(--ink); color: var(--muted-dark); border-top: 1px solid var(--line-dark); }

/* kinetic: road — asphalt lane, centre dashes run toward the rider */
.fm-road { position: relative; height: 76px; background: var(--asphalt); border-block: 3px solid rgba(237,235,227,0.85); overflow: hidden; display: flex; align-items: center; }
.fm-road .lane { position: absolute; left: 0; top: 50%; height: 4px; margin-top: -2px; width: calc(100% + 120px); background: repeating-linear-gradient(90deg, #F2C200 0 64px, transparent 64px 120px); animation: lane 0.7s linear infinite; }
.fm-road .post { position: relative; z-index: 1; font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--text-dark); background: var(--asphalt); padding: 0.35rem 0.8rem; margin-inline: var(--gutter); border: 1px solid rgba(237,235,227,0.4); border-radius: 2px; white-space: nowrap; }
.fm-road .post + .post { margin-left: auto; }
@keyframes lane { to { transform: translateX(-120px); } }

.footer-hero { display: grid; grid-template-columns: 1fr auto; gap: 2rem; align-items: center; padding-block: clamp(3rem, 2rem + 4vw, 5.5rem) clamp(2rem, 1rem + 3vw, 3.5rem); border-bottom: 1px solid var(--line-dark); }
.footer-tag { font-family: var(--font-display); font-weight: 700; text-transform: uppercase; font-size: clamp(2.6rem, 1.2rem + 5vw, 6rem); line-height: 0.88; color: var(--text-dark); max-width: 14ch; }
.footer-tag em { font-style: normal; color: var(--green-bright); }

/* ornament: tach — rev counter; needle sweeps to the redline then idles */
.fm-tach { width: clamp(180px, 16vw + 80px, 280px); flex: 0 0 auto; }
.fm-tach svg { width: 100%; height: auto; overflow: visible; }
.fm-tach .dial { fill: none; stroke: rgba(237,235,227,0.18); stroke-width: 1.5; }
.fm-tach .red { fill: none; stroke: var(--green-bright); stroke-width: 5; }
.fm-tach .tick { stroke: rgba(237,235,227,0.55); stroke-width: 1.2; }
.fm-tach .tick.major { stroke: var(--text-dark); stroke-width: 2.2; }
.fm-tach .num { font-family: var(--font-display); font-weight: 700; font-size: 13px; fill: var(--text-dark); text-anchor: middle; dominant-baseline: middle; }
.fm-tach .unit { font-family: var(--font-mono); font-size: 7px; letter-spacing: 0.18em; fill: var(--muted-dark); text-anchor: middle; }
.fm-tach .needle { transform-box: view-box; transform-origin: 100px 100px; transform: rotate(-120deg); }
.fm-tach .needle line { stroke: var(--green-bright); stroke-width: 3; stroke-linecap: round; }
.fm-tach .hub { fill: var(--ink); stroke: var(--green-bright); stroke-width: 3; }
.site-footer.is-in .fm-tach .needle { animation: tach-rev 2.4s cubic-bezier(0.3, 0, 0.2, 1) forwards, tach-idle 1.6s ease-in-out 2.4s infinite alternate; }
.site-footer .fm-tach.revving .needle { animation: none; transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1); }
@keyframes tach-rev { 0% { transform: rotate(-120deg); } 45% { transform: rotate(96deg); } 58% { transform: rotate(84deg); } 100% { transform: rotate(-94deg); } }
@keyframes tach-idle { from { transform: rotate(-94deg); } to { transform: rotate(-88deg); } }
.no-js .fm-tach .needle { transform: rotate(-94deg); }

.footer-top { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr; gap: 2rem; padding-block: clamp(2.4rem, 1.5rem + 3vw, 4rem) 3rem; border-bottom: 1px solid var(--line-dark); }
.footer-brand .brand { margin-bottom: 1.1rem; color: var(--text-dark); }
.footer-brand p { max-width: 34ch; font-size: 0.95rem; }
.footer-h { font-family: var(--font-mono); font-size: 0.73rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--green-bright); margin-bottom: 1rem; }
.footer-col a { display: block; padding-block: 0.35rem; font-size: 0.96rem; color: var(--text-dark); opacity: 0.8; transition: opacity var(--dur); }
.footer-col a:hover { opacity: 1; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 1rem 2rem; flex-wrap: wrap; padding-block: 1.8rem; font-family: var(--font-mono); font-size: 0.76rem; letter-spacing: 0.04em; }

/* reveal: throttle — columns launch in with a speed skew, staggered */
.js .reveal-throttle .footer-top > *, .js .reveal-throttle .footer-tag { opacity: 0; transform: translateX(-56px) skewX(-14deg); transition: opacity 0.5s ease-out, transform 0.9s var(--ease); transition-delay: calc(var(--i, 0) * 90ms); }
.js .reveal-throttle.is-in .footer-top > *, .js .reveal-throttle.is-in .footer-tag { opacity: 1; transform: none; }

/* typed credit (constant Lyvek signature) */
.credit { position: relative; padding-right: 0.72em; white-space: nowrap; letter-spacing: 0.1em; }
.credit a { display: inline-block; padding: 0.35rem 0; margin: -0.35rem 0; color: var(--green-bright); text-decoration: underline; text-underline-offset: 0.22em; text-decoration-thickness: 1px; }
.credit .ch { transition: opacity 90ms linear; }
.credit.is-armed .ch { opacity: 0; }
.credit .caret { position: absolute; right: 0; top: 50%; width: 0.5em; height: 1.02em; margin-top: -0.51em; background: var(--green-bright); opacity: 0; pointer-events: none; }
.credit.is-armed .caret { opacity: 0.85; }
.credit.is-done .caret { animation: caret-blink 0.6s ease-in-out infinite alternate; }
@keyframes caret-blink { to { opacity: 0.1; } }

/* ============================================================ responsive */
@media (max-width: 1020px) {
 .hero-row, .loop-grid, .split, .contact-grid { grid-template-columns: 1fr; }
 .reviews { grid-template-columns: 1fr; }
 .review + .review { padding-left: 0; border-left: 0; border-top: 1px solid var(--line-dark); margin-top: 2rem; }
 .ledger-row { grid-template-columns: 48px 200px 1fr; }
 .ledger-side { grid-column: 3; justify-items: start; text-align: left; grid-auto-flow: column; align-items: end; }
 .eq { grid-template-columns: 1fr 1fr; }
 .eq li:nth-child(3) { padding-left: 0; border-left: 0; }
 .principles { grid-template-columns: 1fr 1fr; }
 .principles li:not(:nth-child(3n+1)) { padding-left: 0; border-left: 0; }
 .principles li:nth-child(even) { padding-left: 1.8rem; border-left: 1px solid var(--line); }
 .loop-media img { position: static; aspect-ratio: 16 / 10; }
 .footer-top { grid-template-columns: 1fr 1fr 1fr; }
 .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 860px) {
 .nav-links, .nav-cta .btn { display: none; }
 .nav-toggle { display: block; }
 .nav-links.open { display: flex; position: fixed; inset: 76px 0 auto 0; flex-direction: column; gap: 0; background: var(--ink); border-bottom: 1px solid var(--line-dark); padding: 0.6rem var(--gutter) 1.6rem; }
 .nav-links.open a { display: block; padding: 0.95rem 0; border-bottom: 1px solid var(--line-dark); font-size: 1.1rem; color: var(--text-dark); }
 .nav-links.open a[aria-current="page"]::after { display: none; }
 .nav-links.open .nav-mobile-cta { display: block; padding-top: 1.2rem; }
 .nav-links.open .nav-mobile-cta a { display: inline-flex; border: 0; padding: 0.95rem 1.4rem; color: var(--ink); font-size: 1rem; }
}
@media (max-width: 760px) {
 .hero-scroll { display: none; }
 .hero-meta { grid-template-columns: 1fr 1fr; }
 .chapter { min-height: 90svh; }
 .route-bg::after { background: linear-gradient(180deg, rgba(12,16,13,0.55), rgba(12,16,13,0.9)); }
 .ledger-row { grid-template-columns: 1fr; gap: 0.9rem; }
 .ledger-num { display: none; }
 .ledger-side { grid-column: auto; grid-auto-flow: row; justify-items: start; }
 .spec, .spec:nth-child(even) .spec-media { grid-template-columns: 1fr; order: 0; }
 .spec-media, .spec:nth-child(even) .spec-media { max-width: none; justify-self: stretch; aspect-ratio: 4 / 3; }
 .rates { grid-template-columns: 1fr; }
 .rate { display: flex; justify-content: space-between; align-items: baseline; padding: 0.8rem 0; }
 .rate + .rate { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); }
 .rate dd { text-align: right; margin-top: 0; }
 .eq, .principles, .socials { grid-template-columns: 1fr; }
 .eq li + li, .principles li:nth-child(even) { padding-left: 0; border-left: 0; }
 .loop-facts, .field-row { grid-template-columns: 1fr; }
 .car-slide { flex-basis: 78vw; }
 .footer-hero { grid-template-columns: 1fr; }
 .fm-tach { justify-self: center; }
 .footer-top { grid-template-columns: 1fr 1fr; }
 .fm-road .post:first-child { display: none; }
 .brand .w1 { font-size: 1.05rem; }
}
@media (max-width: 380px) { .brand .w2 { display: none; } }

@media (prefers-reduced-motion: reduce) {
 *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
 .js [data-reveal] { opacity: 1; transform: none; }
 .ticker-track, .strip-row, .fm-road .lane { animation: none; }
 .strip { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
 .site-footer.is-in .fm-tach .needle, .fm-tach .needle { animation: none; transform: rotate(-94deg); }
 .js .reveal-throttle .footer-top > *, .js .reveal-throttle .footer-tag { opacity: 1; transform: none; }
 .credit.is-armed .ch { opacity: 1; }
 .credit .caret { display: none; }
}
.hero .label, .page-hero .label { color: var(--text-dark); }
@media (max-width: 760px) { .hero .hero-image::after { background: linear-gradient(180deg, rgba(12,16,13,0.8) 0%, rgba(12,16,13,0.5) 30%, rgba(12,16,13,0.62) 60%, rgba(12,16,13,0.95) 100%); } }