/* Baba Rental Car Service, Dhule */
:root {
  --ink: #0B1220;
  --night: #111A2E;
  --navy: #18234A;
  --sun: #FFB81C;
  --sun-2: #FFC94A;
  --saffron: #FF7A1A;
  --red: #E0352B;
  --paper: #F7F3EA;
  --paper-2: #EFE7D6;
  --cream: #FFF6E0;
  --text: #18202F;
  --muted: #5A6476;
  --line: #E6E0D3;
  --wa: #1FAF5A;
  --amber-ink: #A86A00;
  --road: #262b38;
  --hill-far: #5d4677;
  --hill-mid: #45355f;
  --hill-near: #2b2346;
  --trees: #15132a;
  --r: 14px;
  --r-lg: 22px;
  --hdr: 76px;
  --font-h: 'Bricolage Grotesque', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mr: 'Mukta', 'Nirmala UI', sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; overflow-x: clip; }
body { margin: 0; font-family: var(--font); font-size: 16px; color: var(--text); background: #fff; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
button { font: inherit; }
h1, h2, h3 { font-family: var(--font-h); line-height: 1.08; letter-spacing: -.02em; margin: 0 0 .5em; color: inherit; }
p { margin: 0 0 1em; }
.wrap { width: min(1200px, 100% - 32px); margin-inline: auto; }
.narrow { width: min(880px, 100% - 32px); }
.ic { width: 1.15em; height: 1.15em; flex: none; vertical-align: -.18em; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: -999px; top: 8px; z-index: 200; background: #fff; padding: 10px 14px; border-radius: 8px; }
.skip:focus { left: 16px; }
:focus-visible { outline: 3px solid var(--sun); outline-offset: 2px; }
.mr { font-family: var(--font-mr); }

/* ---------- buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5em; font: 700 15px/1 var(--font); padding: 13px 20px; border-radius: 999px; text-decoration: none; border: 2px solid transparent; cursor: pointer; transition: transform .2s, box-shadow .2s, background-color .2s, color .2s, border-color .2s; white-space: nowrap; }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn-sun { background: var(--sun); color: var(--ink); box-shadow: 0 10px 22px -10px rgba(255, 170, 0, .8); }
.btn-sun:hover { background: var(--sun-2); }
.btn-ink { background: var(--ink); color: #fff; }
.btn-ink:hover { background: var(--navy); }
.btn-line { border-color: currentColor; color: var(--ink); background: transparent; }
.btn-line:hover { background: var(--ink); color: #fff; border-color: var(--ink); }
.btn-glass { background: rgba(255, 255, 255, .1); color: #fff; border-color: rgba(255, 255, 255, .35); backdrop-filter: blur(6px); }
.btn-glass:hover { background: rgba(255, 255, 255, .2); }
.btn-wa { background: var(--wa); color: #fff; box-shadow: 0 10px 22px -12px rgba(31, 175, 90, .9); }
.btn-wa:hover { background: #1a9d50; }
.btn-lg { padding: 16px 24px; font-size: 16px; }
.btn-sm { padding: 9px 14px; font-size: 14px; }
.btn-block { width: 100%; }
.link { font-weight: 700; color: var(--amber-ink); text-decoration: none; display: inline-flex; gap: 6px; align-items: center; }

/* ---------- top bar + header ---------- */
.topbar { background: var(--ink); color: #c9d1e0; font-size: 13px; }
.topbar-in { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 8px 0; }
.topbar p { margin: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.topbar .ic { color: var(--sun); }
.topbar a { color: #fff; text-decoration: none; display: inline-flex; gap: 6px; align-items: center; font-weight: 600; }
.topbar a:hover { color: var(--sun); }
.topbar-r { gap: 18px !important; }
.dot { color: var(--sun); }

.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .94); backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--line); transition: box-shadow .25s; }
.site-header.is-stuck { box-shadow: 0 10px 30px -18px rgba(11, 18, 32, .45); }
.hdr { display: flex; align-items: center; gap: 20px; height: var(--hdr); }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); flex: none; }
.mark { width: 44px; height: 44px; flex: none; }
.brand:hover .mark { transform: rotate(-30deg); }
.mark { transition: transform .5s cubic-bezier(.2, .8, .2, 1); }
.brand-text { display: block; }
.brand-name { display: block; font: 800 25px/1 var(--font-h); letter-spacing: .05em; }
.brand-sub { display: block; font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-top: 4px; }

.nav { margin-left: auto; height: 100%; }
.nav-list { display: flex; list-style: none; margin: 0; padding: 0; gap: 2px; align-items: center; height: 100%; }
.nav-list > li { display: flex; align-items: center; height: 100%; }
.nav-link { display: block; white-space: nowrap; padding: 9px 12px; font-weight: 600; font-size: 15px; text-decoration: none; color: var(--text); border-radius: 10px; transition: background-color .2s, color .2s; }
.nav-link:hover, .nav-link.is-active { color: var(--ink); background: var(--paper); }
.nav-link.is-active { box-shadow: inset 0 -2px 0 var(--sun); border-radius: 10px 10px 4px 4px; }
.mega-toggle { background: none; border: 0; padding: 6px 4px; margin-left: -6px; cursor: pointer; color: var(--muted); display: grid; place-items: center; border-radius: 6px; }
.mega-toggle .ic { transition: transform .25s; }
.has-mega.is-open .mega-toggle .ic { transform: rotate(180deg); }
.nav-head, .nav-foot { display: none; }

.mega { position: absolute; left: 0; right: 0; top: 100%; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .2s, transform .25s, visibility .2s; }
.mega-in { width: min(1200px, 100% - 32px); margin: 0 auto; background: #fff; border: 1px solid var(--line); border-top: 0; border-radius: 0 0 var(--r-lg) var(--r-lg); box-shadow: 0 40px 70px -30px rgba(11, 18, 32, .45); padding: 22px; }
@media (min-width: 981px) {
  .has-mega:hover .mega, .has-mega:focus-within .mega, .has-mega.is-open .mega { opacity: 1; visibility: visible; transform: none; }
  .has-mega:hover .mega-toggle .ic { transform: rotate(180deg); }
}
.mega-grid { display: grid; gap: 12px; }
.fleet-mega { grid-template-columns: repeat(4, 1fr); }
.mega-vehicle { display: flex; flex-direction: column; padding: 14px 16px 16px; border-radius: 16px; text-decoration: none; color: var(--ink); background: var(--paper); transition: background-color .2s, transform .2s; }
.mega-vehicle:hover { background: var(--cream); transform: translateY(-3px); }
.mega-vehicle:hover .wheel { animation: spin .5s linear infinite; }
.mv-art { display: block; }
.mv-art svg { width: 100%; height: auto; display: block; }
.mv-name { font-weight: 700; margin-top: 6px; line-height: 1.3; }
.mv-seats { font-size: 13px; color: var(--muted); display: flex; gap: 6px; align-items: center; }
.mega-all { background: var(--ink); color: #fff; justify-content: center; }
.mega-all:hover { background: var(--navy); }
.mv-big { font: 800 44px/1 var(--font-h); color: var(--sun); }
.mega-all .mv-seats { color: #c6cddb; }
.mega-split { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; }
.svc-mega { grid-template-columns: repeat(2, 1fr); gap: 4px; }
.mega-svc { display: flex; gap: 14px; padding: 12px; border-radius: 14px; text-decoration: none; color: var(--ink); transition: background-color .2s; }
.mega-svc:hover { background: var(--paper); }
.ms-ic { width: 42px; height: 42px; border-radius: 12px; background: #FFF1CC; color: var(--amber-ink); display: grid; place-items: center; flex: none; }
.ms-ic .ic { width: 22px; height: 22px; }
.ms-t { display: block; font-weight: 700; }
.ms-d { display: block; font-size: 13px; color: var(--muted); line-height: 1.45; margin-top: 2px; }
.mega-promo { background: radial-gradient(circle at 90% 110%, rgba(255, 122, 26, .55), transparent 55%), linear-gradient(160deg, var(--navy), var(--ink)); color: #fff; border-radius: 18px; padding: 24px; display: flex; flex-direction: column; gap: 8px; text-decoration: none; }
.mp-k { font-size: 12px; text-transform: uppercase; letter-spacing: .14em; color: var(--sun); font-weight: 800; }
.mp-t { font: 800 24px/1.12 var(--font-h); }
.mp-d { color: #c6cddb; font-size: 14px; }
.mp-cta { margin-top: auto; font-weight: 700; color: var(--sun); display: flex; gap: 6px; align-items: center; }

.hdr-cta { display: flex; align-items: center; gap: 14px; flex: none; }
.hdr-phone { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.hp-ic { width: 42px; height: 42px; border-radius: 50%; background: var(--paper); display: grid; place-items: center; transition: background-color .2s; }
.hdr-phone:hover .hp-ic { background: var(--sun); }
.hp-t { display: flex; flex-direction: column; font-weight: 800; font-size: 15px; line-height: 1.2; }
.hp-t small { font-weight: 600; color: var(--muted); font-size: 12px; }
.burger { display: none; width: 46px; height: 46px; border-radius: 12px; border: 1px solid var(--line); background: #fff; place-items: center; cursor: pointer; color: var(--ink); }
.burger .ic { width: 24px; height: 24px; }
.nav-scrim { position: fixed; inset: 0; background: rgba(11, 18, 32, .55); z-index: 70; }

/* ---------- home hero: the highway ---------- */
.hero { --road-h: 170px; --far-h: 260px; --near-h: 150px; --trees-h: 150px; position: relative; overflow: hidden; isolation: isolate; min-height: clamp(700px, calc(100svh - var(--hdr) - 34px), 880px); color: #fff; background: var(--ink); }
.sky { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, #0B1220 0%, #17214a 34%, #3a2f64 54%, #93496c 70%, #ec8048 83%, #ffc46b 100%); }
.stars { position: absolute; inset: 0 0 45% 0; opacity: .75; animation: twinkle 3.5s ease-in-out infinite alternate;
  background-image:
    radial-gradient(1.5px 1.5px at 8% 18%, #fff, transparent), radial-gradient(1px 1px at 22% 9%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 35% 28%, #fff, transparent), radial-gradient(1px 1px at 48% 12%, #fff, transparent),
    radial-gradient(2px 2px at 63% 22%, #ffe9b8, transparent), radial-gradient(1px 1px at 72% 8%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 84% 30%, #fff, transparent), radial-gradient(1px 1px at 93% 14%, #fff, transparent),
    radial-gradient(1px 1px at 15% 40%, #fff, transparent), radial-gradient(1px 1px at 56% 40%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 78% 46%, #fff, transparent), radial-gradient(1px 1px at 41% 52%, #fff, transparent); }
@keyframes twinkle { to { opacity: .35; } }
.sun { position: absolute; left: 60%; bottom: calc(var(--road-h) + 96px); width: clamp(120px, 13vw, 190px); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, #fff7dc 0%, #ffd56e 42%, #ffa44a 68%, rgba(255, 140, 60, 0) 71%); filter: drop-shadow(0 0 70px rgba(255, 180, 90, .9)); }
.hero::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(11, 18, 32, .72) 0%, rgba(11, 18, 32, .35) 38%, rgba(11, 18, 32, 0) 60%); }

.layer { position: absolute; left: 0; right: 0; bottom: var(--road-h); overflow: hidden; pointer-events: none; }
.layer .strip { display: flex; width: max-content; height: 100%; animation: slide var(--dur) linear infinite; will-change: transform; }
.layer .tile { height: 100%; flex: none; display: block; }
.far { height: var(--far-h); --dur: 110s; }
.far .tile { width: calc(var(--far-h) * 6.1538); }
.near { height: var(--near-h); --dur: 55s; }
.near .tile { width: calc(var(--near-h) * 7); }
.trees { height: var(--trees-h); --dur: 16s; }
.trees .tile { width: calc(var(--trees-h) * 6.6667); }
@keyframes slide { to { transform: translateX(-25%); } }

.road { position: absolute; left: 0; right: 0; bottom: 0; height: var(--road-h); background: linear-gradient(180deg, #2c3140 0%, #1c202b 55%, #12151d 100%); overflow: hidden; }
.road-edge { position: absolute; top: 0; left: 0; right: 0; height: 12px; background: linear-gradient(#6b5641, #3d3128); }
.road-edge::after { content: ''; position: absolute; left: 0; right: 0; bottom: -7px; height: 3px; background: rgba(255, 255, 255, .7); }
.lane { position: absolute; left: 0; right: -180px; top: 52%; height: 6px; border-radius: 3px; background: repeating-linear-gradient(90deg, #f6d27a 0 80px, transparent 80px 180px); animation: lane .55s linear infinite; }
@keyframes lane { to { transform: translateX(-180px); } }
.road-lip { position: absolute; left: 0; right: 0; bottom: 16px; height: 3px; background: rgba(255, 255, 255, .45); }

.milestone { position: absolute; left: 0; bottom: calc(var(--road-h) - 8px); width: 58px; height: 86px; border-radius: 29px 29px 4px 4px; background: #f3efe6; color: var(--ink); display: flex; flex-direction: column; align-items: center; font-family: var(--font-h); text-align: center; overflow: hidden; box-shadow: inset -6px -6px 0 rgba(0, 0, 0, .1); animation: stone 8s linear infinite; will-change: transform; }
.ms-top { width: 100%; background: var(--sun); font-size: 9px; font-weight: 800; padding: 9px 0 4px; letter-spacing: .04em; }
.ms-place { font-size: 8.5px; font-weight: 800; margin-top: 8px; letter-spacing: .02em; max-width: 54px; line-height: 1.1; }
.ms-km { font-size: 19px; font-weight: 800; line-height: 1.1; margin-top: 2px; }
@keyframes stone { from { transform: translateX(calc(100vw + 40px)); } to { transform: translateX(-120px); } }

.hero-car-wrap { position: absolute; z-index: 2; left: calc(50% + 20px); bottom: 34px; width: clamp(320px, 43vw, 650px); }
.hero-car svg { width: 100%; height: auto; display: block; overflow: visible; }
.hero .wheel, .mini-car .wheel { transform-box: fill-box; transform-origin: center; animation: spin .5s linear infinite; }
.hero-car-wrap.arriving .wheel { animation-duration: .16s; }
.hero .v-body { animation: bob .32s ease-in-out infinite alternate; }
.hero .beam { opacity: .85; mix-blend-mode: screen; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes bob { to { transform: translateY(.9px); } }
.speedlines { position: absolute; right: 92%; top: 22%; width: 55%; height: 55%; opacity: 0; pointer-events: none; }
.speedlines i { position: absolute; right: 0; height: 3px; border-radius: 3px; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .75)); }
.speedlines i:nth-child(1) { top: 5%; width: 80%; }
.speedlines i:nth-child(2) { top: 28%; width: 100%; }
.speedlines i:nth-child(3) { top: 50%; width: 65%; }
.speedlines i:nth-child(4) { top: 72%; width: 90%; }
.speedlines i:nth-child(5) { top: 92%; width: 55%; }
.dust { position: absolute; left: 6%; bottom: 4%; width: 1px; height: 1px; }
.dust i { position: absolute; left: 0; bottom: 0; width: 34px; height: 34px; border-radius: 50%; background: rgba(226, 204, 170, .5); opacity: 0; filter: blur(3px); }

.hero-copy { position: relative; z-index: 3; padding: clamp(36px, 6vh, 80px) 0 40px; }
.hero-copy > * { max-width: 600px; }
.eyebrow { display: inline-flex; gap: 10px; align-items: center; font-size: 12.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--sun); background: rgba(11, 18, 32, .5); padding: 8px 15px; border-radius: 999px; border: 1px solid rgba(255, 184, 28, .35); margin: 0; }
.pulse { width: 8px; height: 8px; border-radius: 50%; background: var(--sun); animation: pulse 1.8s infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 184, 28, .7); } 100% { box-shadow: 0 0 0 12px rgba(255, 184, 28, 0); } }
.hero h1 { font-size: clamp(44px, 6vw, 88px); font-weight: 800; line-height: .94; margin: 20px 0 12px; letter-spacing: -.03em; text-shadow: 0 6px 40px rgba(11, 18, 32, .5); }
.line { display: block; overflow: hidden; padding-bottom: .07em; }
.line > span { display: inline-block; }
.hero h1 .line:last-child > span { color: var(--sun); }
.hero-mr { font-size: clamp(21px, 2.3vw, 28px); font-weight: 700; color: #ffe2a3; margin: 0 0 8px; }
.hero-lead { font-size: clamp(16px, 1.35vw, 18.5px); color: #e1e6f0; max-width: 520px; text-shadow: 0 2px 16px rgba(11, 18, 32, .6); }
.hero-btns { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0; }
.hero-seats { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.hs-label { font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: #b4bdd0; margin-right: 6px; font-weight: 800; }
.hero-seats a { min-width: 40px; height: 36px; padding: 0 8px; display: grid; place-items: center; border-radius: 10px; background: rgba(11, 18, 32, .45); border: 1px solid rgba(255, 255, 255, .22); color: #fff; text-decoration: none; font-weight: 800; font-size: 14px; backdrop-filter: blur(4px); transition: background-color .2s, color .2s, transform .2s; }
.hero-seats a:hover { background: var(--sun); color: var(--ink); transform: translateY(-2px); }
.replay { position: absolute; left: 16px; bottom: 14px; z-index: 4; display: flex; gap: 6px; align-items: center; background: rgba(11, 18, 32, .6); color: #fff; border: 1px solid rgba(255, 255, 255, .25); border-radius: 999px; padding: 7px 13px; font: 600 12.5px var(--font); cursor: pointer; transition: background-color .2s; }
.replay:hover { background: rgba(11, 18, 32, .9); }
.hero.is-static .replay { display: none; }

/* ---------- inner page hero ---------- */
.page-hero { position: relative; background: var(--ink); color: #fff; overflow: hidden; padding: 40px 0 112px; isolation: isolate; }
.ph-sky { position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 60% 90% at 85% 120%, rgba(255, 130, 60, .55), transparent 60%), radial-gradient(ellipse 40% 60% at 10% -10%, rgba(80, 100, 200, .35), transparent 60%), linear-gradient(180deg, #0B1220, #19244d); }
.page-hero h1 { font-size: clamp(36px, 5.4vw, 66px); max-width: 920px; font-weight: 800; margin-bottom: 14px; }
.page-hero h1 em, .page-hero h1 em { font-style: normal; color: var(--sun); }
.page-hero .lead { font-size: clamp(16px, 1.4vw, 19px); color: #cfd6e4; max-width: 700px; margin: 0; }
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 0; margin: 0 0 24px; font-size: 13.5px; color: #aeb8cc; }
.crumbs li + li::before { content: '/'; margin-right: 6px; opacity: .5; }
.crumbs a { color: #fff; text-decoration: none; }
.crumbs a:hover { text-decoration: underline; }
.mini-road { position: absolute; left: 0; right: 0; bottom: 0; height: 48px; background: #1a1e29; border-top: 4px solid #4a3b2e; }
.mini-road::after { content: ''; position: absolute; left: 0; right: -120px; top: 50%; height: 4px; margin-top: -2px; background: repeating-linear-gradient(90deg, #f6d27a 0 50px, transparent 50px 120px); animation: lane2 .7s linear infinite; }
@keyframes lane2 { to { transform: translateX(-120px); } }
.mini-car { position: absolute; z-index: 1; bottom: 18px; left: 0; width: 180px; animation: cruise 16s linear infinite; }
.mini-car svg { width: 100%; height: auto; display: block; }
@keyframes cruise { from { transform: translateX(-220px); } to { transform: translateX(calc(100vw + 20px)); } }

/* ---------- sections ---------- */
.sec { padding: clamp(60px, 8vw, 104px) 0; }
.sec-dark { background: var(--ink); color: #fff; }
.sec-paper { background: var(--paper); }
.sec-head { max-width: 720px; margin-bottom: 38px; }
.sec-head h2 { font-size: clamp(30px, 4vw, 48px); font-weight: 800; }
.sec-head p { color: var(--muted); font-size: 17.5px; margin: 0; }
.sec-dark .sec-head p { color: #b9c2d3; }
.sec-head-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; max-width: none; }
.kicker { font-size: 12.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--amber-ink); margin: 0 0 12px; }
.sec-dark .kicker, .page-hero .kicker { color: var(--sun); }
.fine { font-size: 13px; color: var(--muted); margin: 16px 0 0; }
.ticks { list-style: none; padding: 0; margin: 18px 0; display: grid; gap: 10px; }
.ticks li { display: flex; gap: 10px; align-items: flex-start; }
.ticks .ic { color: #fff; background: var(--wa); border-radius: 50%; padding: 3px; width: 21px; height: 21px; margin-top: 2px; stroke-width: 3; }
.ticks-lg li { font-size: 17px; }
.big-p { font-size: clamp(18px, 1.6vw, 21px); line-height: 1.65; }

/* ---------- booking form ---------- */
.book-strip { position: relative; z-index: 5; margin-top: -46px; }
.book-card { background: #fff; border-radius: 26px; box-shadow: 0 40px 70px -35px rgba(11, 18, 32, .5); padding: 30px; border: 1px solid var(--line); }
.book-card-flat { box-shadow: 0 20px 50px -35px rgba(11, 18, 32, .35); }
.book-card > h2 { font-size: 28px; }
.book-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: 18px; }
.book-head h2 { font-size: 28px; margin: 0; }
.book-head p { color: var(--muted); margin: 0; max-width: 460px; }
.trip-tabs { border: 0; padding: 0; margin: 0 0 16px; display: flex; flex-wrap: wrap; gap: 8px; }
.trip-tabs label { cursor: pointer; position: relative; }
.trip-tabs input, .chip input { position: absolute; opacity: 0; pointer-events: none; }
.trip-tabs span { display: block; padding: 9px 15px; border-radius: 999px; background: var(--paper); font-weight: 700; font-size: 14px; transition: background-color .2s, color .2s; }
.trip-tabs label:hover span { background: var(--paper-2); }
.trip-tabs input:checked + span { background: var(--ink); color: #fff; }
.trip-tabs input:focus-visible + span, .chip input:focus-visible + span { outline: 3px solid var(--sun); outline-offset: 2px; }
.bk-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 14px; }
.book-card-flat .bk-grid { grid-template-columns: repeat(2, 1fr); }
.fld { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.fld > span, .seat-pick legend { font-size: 12px; font-weight: 800; color: var(--muted); display: flex; gap: 6px; align-items: center; text-transform: uppercase; letter-spacing: .07em; }
.fld input, .fld select, .f-seats select { font: 500 15.5px var(--font); padding: 12px 14px; border: 1.5px solid var(--line); border-radius: 12px; background: #fff; color: var(--text); width: 100%; min-height: 50px; transition: border-color .2s, box-shadow .2s; }
.fld input:focus, .fld select:focus, .f-seats select:focus { outline: none; border-color: var(--sun); box-shadow: 0 0 0 4px rgba(255, 184, 28, .25); }
.fld input.is-bad { border-color: #d92d20; box-shadow: 0 0 0 4px rgba(217, 45, 32, .15); }
.fld-wide { grid-column: span 2; }
.seat-pick { border: 0; padding: 0; margin: 2px 0 16px; }
.seat-pick legend { padding: 0; margin-bottom: 8px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { cursor: pointer; position: relative; }
.chip span { display: grid; place-items: center; min-width: 48px; height: 44px; padding: 0 10px; border-radius: 12px; border: 1.5px solid var(--line); font-weight: 800; transition: background-color .2s, border-color .2s, transform .15s; }
.chip:hover span { border-color: var(--ink); }
.chip input:checked + span { background: var(--sun); border-color: var(--sun); color: var(--ink); transform: translateY(-2px); }
.bk-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.bk-note { font-size: 13px; color: var(--muted); margin: 12px 0 0; }
.bk-msg { color: #b42318; font-weight: 700; font-size: 14px; margin: 10px 0 0; }

/* ---------- seat finder ---------- */
.sf-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; }
.sf-chip { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 76px; height: 76px; border-radius: 20px; border: 2px solid var(--line); background: #fff; font: 800 28px/1 var(--font-h); color: var(--ink); cursor: pointer; transition: background-color .2s, border-color .2s, transform .2s, color .2s; }
.sf-chip small { font: 700 10.5px var(--font); color: var(--muted); margin-top: 5px; text-transform: uppercase; letter-spacing: .1em; }
.sf-chip:hover { border-color: var(--ink); transform: translateY(-3px); }
.sf-chip.is-on { background: var(--ink); border-color: var(--ink); color: var(--sun); }
.sf-chip.is-on small { color: #aeb8cc; }
.sf-stage { position: relative; background: radial-gradient(circle at 85% 0%, #fff 0, transparent 40%), linear-gradient(180deg, var(--cream), #FCE3AE); border-radius: 30px; padding: 40px 40px 40px; overflow: hidden; }
.sf-road { position: absolute; left: 0; right: 0; bottom: 0; height: 74px; background: var(--road); }
.sf-road::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 4px; margin-top: -2px; background: repeating-linear-gradient(90deg, #f6d27a 0 46px, transparent 46px 100px); }
.sf-panel { position: relative; display: grid; grid-template-columns: 1.15fr 1fr; gap: 40px; align-items: end; }
.sf-panel[hidden] { display: none; }
.sf-art svg { width: 100%; height: auto; display: block; }
.sf-panel.is-on .sf-art svg { animation: driveIn .95s cubic-bezier(.2, .8, .2, 1) both; }
.sf-panel.is-on .sf-art .wheel { transform-box: fill-box; transform-origin: center; animation: spin .28s linear 3; }
@keyframes driveIn { from { transform: translateX(-70%); opacity: 0; } 60% { opacity: 1; } to { transform: none; opacity: 1; } }
.sf-info { align-self: center; padding-bottom: 70px; }
.sf-info h3 { font-size: clamp(28px, 3vw, 38px); font-weight: 800; margin-bottom: 8px; }
.sf-info > p { color: var(--muted); }
.sf-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.sf-also { font-size: 14px; color: var(--muted); margin: 14px 0 0; }
.sf-also a { font-weight: 800; color: var(--ink); }
.v-cat { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--amber-ink); margin: 0 0 6px; }

/* ---------- services cards ---------- */
.svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.svc-card { display: flex; flex-direction: column; gap: 8px; padding: 28px; border-radius: 22px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .1); text-decoration: none; color: inherit; transition: background-color .25s, border-color .25s, transform .25s; position: relative; overflow: hidden; }
.svc-card::after { content: ''; position: absolute; right: -40px; bottom: -40px; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(circle, rgba(255, 184, 28, .25), transparent 70%); opacity: 0; transition: opacity .3s; }
.svc-card:hover { background: rgba(255, 255, 255, .08); border-color: rgba(255, 184, 28, .55); transform: translateY(-4px); }
.svc-card:hover::after { opacity: 1; }
.svc-ic { width: 54px; height: 54px; border-radius: 16px; background: var(--sun); color: var(--ink); display: grid; place-items: center; flex: none; }
.svc-ic .ic { width: 27px; height: 27px; }
.svc-ic-lg { width: 70px; height: 70px; border-radius: 20px; margin-bottom: 20px; }
.svc-ic-lg .ic { width: 34px; height: 34px; }
.svc-card h3 { font-size: 22px; margin: 10px 0 0; }
.svc-card p { color: #b9c2d3; margin: 0; }
.svc-more { margin-top: auto; padding-top: 12px; font-weight: 700; color: var(--sun); display: flex; gap: 6px; align-items: center; }
.svc-more .ic { transition: transform .2s; }
.svc-card:hover .svc-more .ic { transform: translateX(4px); }
.svc-grid-light .svc-card { background: #fff; border-color: var(--line); }
.svc-grid-light .svc-card:hover { border-color: var(--sun); box-shadow: 0 24px 40px -30px rgba(11, 18, 32, .45); }
.svc-grid-light .svc-card p { color: var(--muted); }
.svc-grid-light .svc-more { color: var(--amber-ink); }

/* ---------- own cars ---------- */
.own-grid { display: grid; grid-template-columns: 1fr 1.25fr; gap: 56px; align-items: center; }
.own-copy h2 { font-size: clamp(30px, 3.8vw, 46px); font-weight: 800; }
.own-copy > p { color: var(--muted); font-size: 17px; }
.mosaic { display: grid; grid-template-columns: 1.25fr 1fr; grid-template-rows: 1fr 1fr; gap: 12px; height: clamp(400px, 40vw, 540px); }
.mosaic figure { margin: 0; border-radius: 20px; overflow: hidden; background: var(--paper); }
.mosaic img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .8, .2, 1); }
.mosaic figure:hover img { transform: scale(1.05); }
.m1 { grid-row: span 2; }

/* ---------- routes ---------- */
.route-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.route-card { display: flex; flex-direction: column; gap: 12px; padding: 20px; border: 1px solid var(--line); border-radius: 20px; text-decoration: none; color: var(--ink); background: #fff; transition: border-color .2s, transform .2s, box-shadow .2s; }
.route-card:hover { border-color: var(--ink); transform: translateY(-3px); box-shadow: 0 24px 40px -30px rgba(11, 18, 32, .5); }
.rc-line { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.rc-from { font-size: 13px; color: var(--muted); font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
.rc-line i { flex: 1; min-width: 30px; height: 2px; background: repeating-linear-gradient(90deg, var(--sun) 0 8px, transparent 8px 14px); position: relative; }
.rc-line i::after { content: ''; position: absolute; right: -3px; top: -4px; width: 10px; height: 10px; border-radius: 50%; background: var(--saffron); }
.route-card:hover .rc-line i { animation: march .6s linear infinite; }
@keyframes march { to { background-position: 14px 0; } }
.rc-to { flex-basis: 100%; font: 800 21px/1.12 var(--font-h); }
.rc-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 14px; color: var(--muted); }
.rc-meta span { display: inline-flex; gap: 5px; align-items: center; }
.rc-tag { align-self: flex-start; margin-top: auto; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .09em; background: var(--paper); padding: 4px 10px; border-radius: 999px; }

/* ---------- why + steps ---------- */
.why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.why-item, .value { background: #fff; border-radius: 22px; padding: 28px; border: 1px solid var(--line); }
.why-ic { width: 50px; height: 50px; border-radius: 50%; background: var(--ink); color: var(--sun); display: grid; place-items: center; margin-bottom: 14px; }
.why-ic .ic { width: 24px; height: 24px; }
.why-item h3, .value h3 { font-size: 20px; margin-bottom: 6px; }
.why-item p, .value p { color: var(--muted); margin: 0; font-size: 15.5px; }
.step-row { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; position: relative; }
.step-row::before { content: ''; position: absolute; left: 12%; right: 12%; top: 52px; border-top: 2px dashed #e2cf9f; z-index: -1; }
.step-row li { padding: 28px; border-radius: 22px; background: var(--paper); position: relative; }
.step-n { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; background: var(--sun); font: 800 22px var(--font-h); margin-bottom: 16px; box-shadow: 0 0 0 6px #fff; }
.step-row h3 { font-size: 21px; margin-bottom: 6px; }
.step-row p { color: var(--muted); margin: 0; }

/* ---------- CTA band + footer ---------- */
.cta-band { background-color: var(--sun); background-image: repeating-linear-gradient(-45deg, rgba(0, 0, 0, .045) 0 16px, transparent 16px 32px); }
.cta-in { display: flex; justify-content: space-between; align-items: center; gap: 28px; padding: 52px 0; }
.cta-band h2 { font-size: clamp(26px, 3.4vw, 40px); font-weight: 800; margin: 0 0 6px; color: var(--ink); }
.cta-band p { margin: 0; color: #3b2d07; max-width: 560px; font-weight: 500; }
.cta-btns { display: flex; gap: 12px; flex-wrap: wrap; flex: none; }

.site-footer { background: var(--ink); color: #c2cada; }
.foot-road { height: 12px; background: repeating-linear-gradient(90deg, var(--sun) 0 44px, #1c2436 44px 88px); }
.foot-grid { display: grid; grid-template-columns: 1.6fr 1fr 1.25fr 1.25fr 1.3fr; gap: 32px; padding: 60px 0 44px; }
.site-footer .brand { color: #fff; }
.site-footer .brand-sub { color: #96a1b6; }
.foot-brand > p { margin: 18px 0 0; font-size: 15px; }
.foot-brand .mr { font-size: 21px; color: var(--sun); font-weight: 700; margin-top: 10px; }
.foot-seats { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.foot-seats span { border: 1px solid rgba(255, 255, 255, .2); border-radius: 8px; padding: 2px 8px; font-size: 13px; font-weight: 700; color: #fff; }
.site-footer h3 { font: 800 13px/1.2 var(--font); color: #fff; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 16px; }
.site-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 9px; font-size: 15px; }
.site-footer a { color: #c2cada; text-decoration: none; transition: color .2s; }
.site-footer a:hover { color: var(--sun); }
.fc-name { color: #fff; font-weight: 700; margin-bottom: 10px; }
.fc-line { display: flex !important; gap: 8px; align-items: center; margin: 0 0 10px; }
.foot-contact .btn { margin-top: 8px; color: var(--ink); }
.foot-contact .btn:hover { color: var(--ink); }
.foot-bottom { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; border-top: 1px solid rgba(255, 255, 255, .1); padding: 18px 0 24px; font-size: 13.5px; }
.foot-bottom p { margin: 0; display: flex; gap: 18px; flex-wrap: wrap; }

.dock { display: none; }
.wa-float { position: fixed; right: 22px; bottom: 22px; z-index: 60; width: 60px; height: 60px; border-radius: 50%; background: var(--wa); color: #fff; display: grid; place-items: center; box-shadow: 0 14px 30px -8px rgba(31, 175, 90, .75); transition: transform .2s; }
.wa-float::before { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--wa); animation: ring 2.2s ease-out infinite; }
@keyframes ring { from { transform: scale(1); opacity: .8; } to { transform: scale(1.6); opacity: 0; } }
.wa-float:hover { transform: scale(1.08); }
.wa-float .ic { width: 31px; height: 31px; }

/* ---------- fleet ---------- */
.filters { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; align-items: center; margin-bottom: 26px; }
.f-group { display: flex; flex-wrap: wrap; gap: 8px; }
.f-btn { border: 1.5px solid var(--line); background: #fff; border-radius: 999px; padding: 9px 17px; font: 700 14px var(--font); cursor: pointer; color: var(--ink); transition: background-color .2s, color .2s, border-color .2s; }
.f-btn:hover { border-color: var(--ink); }
.f-btn.is-on { background: var(--ink); border-color: var(--ink); color: #fff; }
.f-seats { display: flex; gap: 8px; align-items: center; font-weight: 700; }
.f-seats select { min-height: 44px; padding: 8px 14px; border-radius: 999px; width: auto; }
.v-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(268px, 1fr)); gap: 18px; }
.v-grid-3 { grid-template-columns: repeat(3, 1fr); }
.v-card { background: #fff; border: 1px solid var(--line); border-radius: 24px; overflow: hidden; display: flex; flex-direction: column; transition: transform .25s, box-shadow .25s, border-color .25s; }
.v-card:hover { transform: translateY(-4px); box-shadow: 0 30px 50px -36px rgba(11, 18, 32, .55); border-color: #dccfae; }
.v-card[hidden] { display: none; }
.v-art { display: block; position: relative; background: radial-gradient(circle at 80% 0, #fff, transparent 45%), linear-gradient(180deg, var(--cream), #FBE2AA); padding: 28px 20px 12px; }
.v-art::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 26px; background: var(--road); }
.v-art svg { position: relative; z-index: 1; width: 100%; height: auto; display: block; transition: transform .5s cubic-bezier(.2, .8, .2, 1); }
.v-art .wheel { transform-box: fill-box; transform-origin: center; }
.v-card:hover .v-art svg { transform: translateX(8px); }
.v-card:hover .v-art .wheel { animation: spin .45s linear infinite; }
.v-body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.v-body h3 { font-size: 23px; margin: 0; }
.v-body h3 a { text-decoration: none; }
.v-body h3 a:hover { color: var(--amber-ink); }
.v-models { font-size: 14px; color: var(--muted); margin: 0; }
.v-seats { display: flex; gap: 6px; flex-wrap: wrap; }
.v-seats span { display: inline-flex; gap: 5px; align-items: center; background: var(--ink); color: #fff; border-radius: 8px; padding: 4px 10px; font-size: 13px; font-weight: 700; }
.v-seats-lg span { font-size: 15px; padding: 8px 14px; background: var(--sun); color: var(--ink); border-radius: 10px; }
.v-tag { font-size: 15px; margin: 2px 0 6px; }
.v-actions { margin-top: auto; display: flex; gap: 8px; }
.empty { text-align: center; padding: 30px; color: var(--muted); }
.table-wrap { overflow-x: auto; border-radius: 20px; border: 1px solid var(--line); background: #fff; }
.compare { width: 100%; border-collapse: collapse; min-width: 760px; }
.compare th, .compare td { padding: 16px 18px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: middle; font-size: 15px; }
.compare thead th { font-size: 12px; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); background: var(--paper); }
.compare tbody tr:last-child > * { border-bottom: 0; }
.compare tbody th a { font-weight: 800; text-decoration: none; display: block; font-size: 16px; }
.compare tbody th small { color: var(--muted); font-weight: 500; }
.compare tbody tr:hover { background: #FFFBF0; }
.compare td:nth-child(2) { font-weight: 800; white-space: nowrap; }

.vd-hero { background: linear-gradient(180deg, var(--cream), #fff); padding: 28px 0 44px; }
.vd-hero .crumbs ol { color: var(--muted); }
.vd-hero .crumbs a { color: var(--ink); }
.vd-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; align-items: center; }
.vd-stage { position: relative; padding: 40px 10px 46px; }
.vd-road { position: absolute; left: -12px; right: -12px; bottom: 18px; height: 58px; background: var(--road); border-radius: 12px; }
.vd-road::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 4px; margin-top: -2px; background: repeating-linear-gradient(90deg, #f6d27a 0 46px, transparent 46px 100px); }
.vd-art { position: relative; z-index: 1; }
.vd-art svg { width: 100%; height: auto; display: block; }
.drive-in { animation: driveIn 1.3s cubic-bezier(.2, .8, .2, 1) both; }
.drive-in .wheel { transform-box: fill-box; transform-origin: center; animation: spin .25s linear 5; }
.vd-info h1 { font-size: clamp(36px, 4.6vw, 58px); font-weight: 800; margin-bottom: 6px; }
.vd-models { color: var(--muted); font-weight: 600; margin-bottom: 16px; }
.vd-tag { font-size: 18px; margin: 18px 0 24px; }
.vd-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.vd-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.vd-box { border: 1px solid var(--line); border-radius: 24px; padding: 32px; }
.vd-box h2 { font-size: 26px; }
.vd-lug { display: flex; gap: 8px; align-items: center; background: var(--paper); padding: 12px 16px; border-radius: 12px; margin: 0; }
.gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.gallery figure { margin: 0; border-radius: 18px; overflow: hidden; aspect-ratio: 4 / 3; background: var(--paper-2); }
.gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.gallery figure:hover img { transform: scale(1.05); }

/* ---------- services pages ---------- */
.svc-list { display: grid; gap: 26px; }
.svc-row { display: grid; grid-template-columns: 1fr 1.2fr; gap: 48px; align-items: center; padding: 28px; border-radius: 30px; border: 1px solid var(--line); }
.svc-row.flip .svc-row-art { order: 2; }
.svc-row-art { position: relative; background: radial-gradient(circle at 80% 0, #fff, transparent 45%), linear-gradient(180deg, var(--cream), #FBE2AA); border-radius: 22px; padding: 64px 32px 16px; overflow: hidden; }
.svc-row-art::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 36px; background: var(--road); }
.svc-row-art svg { position: relative; z-index: 1; width: 100%; height: auto; display: block; }
.svc-row-art .wheel { transform-box: fill-box; transform-origin: center; }
.svc-row:hover .svc-row-art .wheel { animation: spin .45s linear infinite; }
.svc-num { position: absolute; top: 14px; left: 22px; font: 800 64px/1 var(--font-h); color: rgba(11, 18, 32, .09); }
.svc-row-body h2 { font-size: clamp(26px, 3vw, 36px); margin: 16px 0 10px; font-weight: 800; }
.svc-row-body > p { color: var(--muted); }
.svc-detail { display: grid; grid-template-columns: 1.6fr 1fr; gap: 56px; align-items: start; }
.svc-main h2 { font-size: 28px; margin-top: 36px; }
.side-card { position: sticky; top: calc(var(--hdr) + 20px); background: var(--ink); color: #fff; border-radius: 24px; padding: 28px; display: grid; gap: 10px; }
.side-card h3 { font-size: 24px; margin: 0; }
.side-card p { color: #c6cddb; margin: 0 0 8px; }
.side-card .btn-line { color: #fff; }
.side-card .btn-line:hover { background: #fff; color: var(--ink); border-color: #fff; }
.side-plain { position: static; background: var(--paper); color: var(--text); }
.side-plain p { color: var(--muted); }
.side-plain .ticks { margin: 4px 0 10px; font-size: 15px; }
.pill-list { display: flex; flex-wrap: wrap; gap: 8px; }
.pill { display: inline-flex; gap: 8px; align-items: baseline; padding: 10px 16px; border-radius: 999px; background: var(--paper); text-decoration: none; font-weight: 700; color: var(--ink); transition: background-color .2s; }
.pill small { color: var(--muted); font-weight: 500; }
.pill:hover { background: var(--sun); }

/* ---------- routes page ---------- */
.routes-layout { display: grid; grid-template-columns: 1fr 1.15fr; gap: 40px; align-items: start; }
.map-card { position: sticky; top: calc(var(--hdr) + 16px); background: var(--ink); border-radius: 28px; padding: 18px 18px 14px; }
.route-map { width: 100%; height: auto; display: block; }
.sea { fill: #13284a; }
.sea-t { fill: #5876a3; font: 700 10px var(--font); letter-spacing: .32em; }
.state { fill: rgba(255, 255, 255, .1); font: 800 15px var(--font-h); letter-spacing: .22em; }
.rm-line { fill: none; stroke: rgba(255, 184, 28, .5); stroke-width: 1.6; stroke-dasharray: 5 5; animation: dash 1s linear infinite; transition: stroke .2s, stroke-width .2s; }
@keyframes dash { to { stroke-dashoffset: -10; } }
.rm-line.is-hl { stroke: var(--sun); stroke-width: 3.2; stroke-dasharray: none; }
.rm-pt { cursor: pointer; }
.rm-pt circle { fill: #fff; transition: fill .2s; }
.rm-pt text { fill: #d7deea; font: 600 11.5px var(--font); }
.rm-pt.is-hl circle { fill: var(--sun); }
.rm-pt.is-hl text { fill: var(--sun); font-weight: 800; }
.rm-home circle { fill: var(--sun); }
.rm-home text { fill: #fff; font: 800 14px var(--font-h); letter-spacing: .12em; }
.rm-pulse { opacity: .4; transform-box: fill-box; transform-origin: center; animation: ping 2s ease-out infinite; }
@keyframes ping { from { transform: scale(1); opacity: .55; } to { transform: scale(3.2); opacity: 0; } }
.map-card .fine { color: #8592a8; margin: 8px 4px 0; }
.route-list { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 10px; }
.route-row { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 20px; background: #fff; transition: border-color .2s, box-shadow .2s; scroll-margin-top: calc(var(--hdr) + 20px); }
.route-row:hover, .route-row.is-hl, .route-row:target { border-color: var(--sun); box-shadow: 0 16px 34px -24px rgba(11, 18, 32, .5); }
.route-row[hidden] { display: none; }
.route-row h3 { font-size: 21px; margin: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.route-row h3 span { font: 700 13px var(--font); color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.route-row h3 .ic { color: var(--saffron); }
.rr-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 6px 0 0; font-size: 14px; color: var(--muted); }
.rr-meta span { display: inline-flex; gap: 5px; align-items: center; }
.rr-tag { background: var(--paper); padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.rr-sugg { font-size: 13.5px; margin: 6px 0 0; color: var(--muted); }
.rr-act { display: flex; gap: 8px; flex: none; }

/* ---------- about ---------- */
.about-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 56px; align-items: start; }
.about-copy h2 { font-size: clamp(30px, 3.6vw, 44px); font-weight: 800; }
.about-copy > p { color: var(--muted); font-size: 17px; }
.about-copy > .big-p { color: var(--text); }
.owner-card { background: var(--paper); border-radius: 28px; padding: 34px; text-align: center; display: grid; gap: 10px; position: sticky; top: calc(var(--hdr) + 20px); }
.owner-avatar { width: 124px; height: 124px; margin: 0 auto 8px; border-radius: 50%; background: var(--ink); display: grid; place-items: center; box-shadow: 0 0 0 8px #fff; }
.owner-avatar .mark { width: 78px; height: 78px; }
.owner-card h3 { font-size: 25px; margin: 0; }
.owner-card > p { margin: 0 0 8px; color: var(--muted); }
.owner-card .kicker { margin: 0; }
.wide-photo { margin: 0 0 36px; border-radius: 26px; overflow: hidden; position: relative; }
.wide-photo img { width: 100%; max-height: 540px; object-fit: cover; }
.wide-photo figcaption { position: absolute; left: 16px; bottom: 16px; background: rgba(11, 18, 32, .78); color: #fff; padding: 8px 15px; border-radius: 999px; font-size: 14px; }
.values { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.numbers { background: var(--ink); color: #fff; }
.num-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; text-align: center; }
.num-row strong { display: block; font: 800 clamp(34px, 4.6vw, 58px)/1 var(--font-h); color: var(--sun); margin-bottom: 8px; }
.num-row span { color: #c6cddb; font-weight: 600; }

/* ---------- contact + book ---------- */
.contact-grid { display: grid; grid-template-columns: 1fr 1.35fr; gap: 32px; align-items: start; }
.contact-cards { display: grid; gap: 14px; }
.c-card { display: grid; grid-template-columns: auto 1fr; column-gap: 18px; align-items: center; padding: 22px; border-radius: 22px; border: 1px solid var(--line); text-decoration: none; color: var(--ink); background: #fff; transition: border-color .2s, transform .2s; }
a.c-card:hover { border-color: var(--ink); transform: translateY(-2px); }
.c-ic { grid-row: span 3; width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; background: var(--paper); }
.c-ic .ic { width: 26px; height: 26px; }
.c-call .c-ic { background: var(--sun); }
.c-wa .c-ic { background: var(--wa); color: #fff; }
.c-k { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.c-v { font: 800 23px/1.2 var(--font-h); }
.c-d { font-size: 14px; color: var(--muted); }
.map-embed { border-radius: 22px; overflow: hidden; border: 1px solid var(--line); aspect-ratio: 4 / 3; background: var(--paper); }
.map-embed iframe { width: 100%; height: 100%; border: 0; display: block; }
.book-layout { display: grid; grid-template-columns: 1.7fr 1fr; gap: 28px; align-items: start; }
.book-side { display: grid; gap: 16px; position: sticky; top: calc(var(--hdr) + 20px); }
.book-side .side-card { position: static; }

/* ---------- FAQ ---------- */
.faq { display: grid; gap: 12px; }
.faq-item { border: 1px solid var(--line); border-radius: 20px; background: #fff; overflow: hidden; transition: border-color .2s; }
.faq-item[open] { border-color: #e8cf8f; }
.faq-item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 24px; font: 700 18.5px/1.3 var(--font-h); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-plus { width: 30px; height: 30px; border-radius: 50%; background: var(--paper); position: relative; flex: none; transition: background-color .2s; }
.faq-plus::before, .faq-plus::after { content: ''; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; background: var(--ink); transform: translate(-50%, -50%); transition: transform .25s; }
.faq-plus::after { transform: translate(-50%, -50%) rotate(90deg); }
.faq-item[open] .faq-plus { background: var(--sun); }
.faq-item[open] .faq-plus::after { transform: translate(-50%, -50%) rotate(0); }
.faq-a { padding: 0 24px 22px; color: var(--muted); font-size: 16.5px; }
.faq-a p { margin: 0; }

/* ---------- 404 ---------- */
.lost { padding: 70px 0 100px; text-align: center; background: linear-gradient(180deg, var(--cream), #fff); }
.lost-in { display: flex; flex-direction: column; align-items: center; }
.lost-art { width: min(420px, 80vw); margin-bottom: 24px; }
.lost-art svg { width: 100%; height: auto; }
.lost-car { animation: lost 3s ease-in-out infinite; }
@keyframes lost { 0%, 100% { transform: translateX(-14px) rotate(-1.2deg); } 50% { transform: translateX(14px) rotate(1.2deg); } }
.lost h1 { font-size: clamp(32px, 4.4vw, 54px); font-weight: 800; }
.lost p { color: var(--muted); font-size: 18px; }
.lost .hero-btns { justify-content: center; }

/* ---------- reveal on scroll ---------- */
.js .reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .8s cubic-bezier(.2, .8, .2, 1); }
.js .reveal.in { opacity: 1; transform: none; }

/* ---------- responsive ---------- */
@media (max-width: 1140px) {
  .hp-t { display: none; }
  .nav-link { padding: 9px 9px; font-size: 14.5px; }
  .nav-list > li:first-child { display: none; }
  .foot-grid { grid-template-columns: repeat(3, 1fr); }
  .foot-brand { grid-column: span 3; }
  .route-grid { grid-template-columns: repeat(2, 1fr); }
  .values { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 980px) {
  :root { --hdr: 68px; }
  .burger { display: grid; }
  .nav { position: fixed; top: 0; right: 0; bottom: 0; left: auto; height: auto; width: min(400px, 88vw); background: #fff; z-index: 80; transform: translateX(105%); transition: transform .35s cubic-bezier(.2, .8, .2, 1); display: flex; flex-direction: column; overflow-y: auto; padding: 14px 18px 22px; box-shadow: -30px 0 60px -30px rgba(0, 0, 0, .4); }
  .nav.is-open { transform: none; }
  .nav-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
  .nav-close { width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--line); background: #fff; display: grid; place-items: center; cursor: pointer; }
  .nav-close .ic { width: 22px; height: 22px; }
  .nav-list { flex-direction: column; align-items: stretch; gap: 0; height: auto; }
  .nav-list > li, .nav-list > li:first-child { display: flex; height: auto; flex-wrap: wrap; border-bottom: 1px solid var(--line); }
  .nav-link { flex: 1; padding: 15px 4px; font-size: 17px; }
  .nav-link:hover, .nav-link.is-active { background: none; box-shadow: none; color: var(--amber-ink); }
  .mega-toggle { padding: 12px; margin: 0; }
  .mega { position: static; opacity: 1; visibility: visible; transform: none; display: none; width: 100%; transition: none; }
  .has-mega.is-open .mega { display: block; }
  .mega-in { width: auto; border: 0; box-shadow: none; padding: 0 0 14px; border-radius: 0; }
  .fleet-mega { grid-template-columns: 1fr 1fr; gap: 8px; }
  .mega-vehicle { padding: 10px; }
  .mv-name { font-size: 14px; }
  .mega-split { grid-template-columns: 1fr; }
  .svc-mega { grid-template-columns: 1fr; }
  .mega-promo { display: none; }
  .nav-foot { display: grid; gap: 10px; margin-top: auto; padding-top: 18px; }
  .bk-grid { grid-template-columns: repeat(2, 1fr); }
  .svc-grid { grid-template-columns: repeat(2, 1fr); }
  .own-grid, .about-grid, .contact-grid, .book-layout, .svc-detail, .routes-layout, .vd-grid { grid-template-columns: 1fr; }
  .map-card, .owner-card, .side-card, .book-side { position: static; }
  .why-grid { grid-template-columns: repeat(2, 1fr); }
  .v-grid-3 { grid-template-columns: repeat(2, 1fr); }
  .svc-row { grid-template-columns: 1fr; gap: 20px; }
  .svc-row.flip .svc-row-art { order: 0; }
  .sf-panel { grid-template-columns: 1fr; gap: 10px; }
  .sf-info { order: -1; padding-bottom: 0; }
  .sf-stage { padding-bottom: 30px; }
  .hero-car-wrap { left: 45%; width: clamp(300px, 52vw, 520px); }
  .hero-copy > * { max-width: 520px; }
}

@media (max-width: 760px) {
  .hide-sm { display: none !important; }
  .btn { white-space: normal; text-align: center; line-height: 1.25; }
  .topbar-in { justify-content: center; }
  .topbar-in > p:first-child { display: none; }
  .hdr { gap: 10px; }
  .mark { width: 38px; height: 38px; }
  .brand-name { font-size: 21px; }
  .brand-sub { font-size: 9px; letter-spacing: .06em; }
  .hp-ic { width: 44px; height: 44px; background: var(--sun); }
  .hero { --road-h: 118px; --far-h: 170px; --near-h: 90px; --trees-h: 96px; min-height: 790px; }
  .hero::after { background: linear-gradient(180deg, rgba(11, 18, 32, .55) 0%, rgba(11, 18, 32, .2) 55%, rgba(11, 18, 32, 0) 70%); }
  .hero h1 { font-size: clamp(42px, 12vw, 56px); margin-top: 16px; }
  .hero-copy { padding-top: 26px; }
  .hero-btns { margin: 18px 0; }
  .hero-btns .btn { flex: 1 1 auto; }
  .hero-car-wrap { width: min(88vw, 430px); left: calc(50% - min(44vw, 215px)); bottom: 26px; }
  .sun { left: 66%; width: 110px; bottom: calc(var(--road-h) + 70px); }
  .milestone { width: 50px; height: 76px; }
  .replay { left: auto; right: 12px; bottom: auto; top: 12px; padding: 7px 10px; }
  .replay span { display: none; }
  .book-strip { margin-top: -26px; }
  .book-card { padding: 20px; border-radius: 22px; }
  .bk-grid, .book-card-flat .bk-grid { grid-template-columns: 1fr; }
  .fld-wide { grid-column: auto; }
  .bk-actions .btn { flex: 1 1 100%; }
  .svc-grid, .why-grid, .step-row, .values, .gallery, .v-grid-3, .vd-cols { grid-template-columns: 1fr; }
  .route-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .route-card { padding: 16px; }
  .rc-to { font-size: 18px; }
  .step-row::before { display: none; }
  .num-row { grid-template-columns: repeat(2, 1fr); row-gap: 32px; }
  .cta-in { flex-direction: column; align-items: flex-start; padding: 44px 0; }
  .cta-btns { width: 100%; }
  .cta-btns .btn { flex: 1 1 auto; }
  .foot-grid { grid-template-columns: 1fr 1fr; padding-top: 44px; }
  .foot-brand, .foot-contact { grid-column: span 2; }
  .dock { display: grid; grid-template-columns: repeat(3, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -12px 30px -12px rgba(0, 0, 0, .25); padding-bottom: env(safe-area-inset-bottom); }
  .dock a { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 9px 0 8px; font-size: 12px; font-weight: 800; text-decoration: none; color: var(--ink); }
  .dock .ic { width: 23px; height: 23px; }
  .dock-wa { color: var(--wa) !important; }
  .dock-book { background: var(--sun); }
  body { padding-bottom: 64px; }
  .wa-float { display: none; }
  .sec-head-row { flex-direction: column; align-items: flex-start; }
  .route-row { flex-direction: column; align-items: flex-start; }
  .mosaic { height: auto; grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .m1 { grid-column: span 2; grid-row: auto; aspect-ratio: 4 / 3; }
  .m2, .m3 { aspect-ratio: 1; }
  .sf-stage { padding: 24px 18px 30px; border-radius: 24px; }
  .sf-road { height: 60px; }
  .sf-chips { gap: 8px; }
  .sf-chip { width: calc(20% - 7px); min-width: 56px; height: 62px; font-size: 22px; border-radius: 16px; }
  .vd-box { padding: 24px; }
  .page-hero { padding: 28px 0 96px; }
  .mini-car { width: 140px; }
  .svc-row { padding: 16px; border-radius: 24px; }
  .svc-row-art { padding: 50px 18px 12px; }
  .faq-item summary { padding: 18px; font-size: 17px; }
  .faq-a { padding: 0 18px 18px; }
  .filters { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 380px) {
  .brand-sub { display: none; }
  .route-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .js .reveal { opacity: 1; transform: none; }
  .milestone, .speedlines, .mini-car { display: none; }
}