/* =====================================================
   ALP Executive Ride — clean light design system
   ===================================================== */
:root {
  --bg:       #f5f5f5;   /* neutral off-white (page) */
  --bg-alt:   #ececec;   /* slightly deeper stage  */
  --card:     #ffffff;
  --ink:      #121212;
  --ink-dim:  #565656;
  --ink-mute: #949494;
  --line:     rgba(18,18,18,.1);
  --ghost:    #e2e2e2;   /* giant background type  */
  --accent:   #b78e4e;   /* gold accent */
  --dark:     #111111;   /* banners, footer        */
  --whatsapp: #25d366;
  --whatsapp-dark:#128c7e;
  --whatsapp-ink:#063b2f;
  --sms:      #111111;
  --sms-ink:  #ffffff;
  --media-grayscale: none;
  --radius:   18px;
  --radius-lg:28px;
  --ease:     cubic-bezier(.22,1,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --container:1200px;
  --serif: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --sans:  "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:calc(90px + env(safe-area-inset-top)); }
body {
  font-family:var(--sans);
  background:var(--bg);
  color:var(--ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
}
body.menu-open { overflow:hidden; overscroll-behavior:none; }
img { display:block; max-width:100%; }

/* ---------- Monochrome photography ----------
   Every photographic surface on the page. Flip --media-grayscale to `none`
   in :root to bring the colour originals back — the source files are
   untouched. */
.hero-media img,
.hero-media video,
.areas::before,
.areas-video,
.ss-bg,
.ss-car,
.fleet-car { filter:var(--media-grayscale); }
a { color:inherit; text-decoration:none; }
ul { list-style:none; }
button { font-family:inherit; cursor:pointer; touch-action:manipulation; }
::selection { background:var(--ink); color:#fff; }
:focus-visible { outline:2px solid currentColor; outline-offset:4px; }

.skip-link { position:fixed; left:20px; top:16px; z-index:1000; padding:10px 16px; background:#fff; color:var(--ink); border-radius:100px; transform:translateY(-160%); transition:transform .25s var(--ease); }
.skip-link:focus { transform:none; }
.page-progress { position:fixed; inset:0 0 auto; height:2px; z-index:300; pointer-events:none; }
.page-progress span { display:block; width:100%; height:100%; background:#fff; transform:scaleX(0); transform-origin:left; will-change:transform; mix-blend-mode:difference; }
.route-wipe { position:fixed; inset:0; z-index:250; display:grid; place-items:center; background:var(--dark); color:#fff; clip-path:inset(100% 0 0 0); pointer-events:none; will-change:clip-path; }
.route-wipe span { font-size:clamp(3.5rem,10vw,8rem); font-weight:700; letter-spacing:-.07em; opacity:.95; }

.container { width:100%; max-width:var(--container); margin:0 auto; padding:0 28px; }

/* =====================================================
   SCROLL ANIMATIONS
   ===================================================== */
/* fade-up reveal */
.reveal { opacity:0; transform:translateY(34px); transition:opacity 1s var(--ease-out) var(--d,0s), transform 1s var(--ease-out) var(--d,0s); }
.reveal.in { opacity:1; transform:none; }

/* masked line reveal (headlines) */
.reveal-lines .line { display:block; overflow:hidden; }
.reveal-lines .line > span { display:block; transform:translateY(115%); transition:transform 1.1s var(--ease-out); }
.reveal-lines .line:nth-child(2) > span { transition-delay:.12s; }
.reveal-lines .line:nth-child(3) > span { transition-delay:.24s; }
.reveal-lines.in .line > span { transform:none; }

/* vehicle slide-in */
.reveal-car { opacity:0; transform:translateY(60px) scale(.96); transition:opacity 1.2s var(--ease-out), transform 1.2s var(--ease-out); }
.reveal-car.in { opacity:1; transform:none; }

.compact-ui .reveal,
.compact-ui .reveal-car,
.compact-ui .reveal-lines .line > span {
  opacity:1 !important; transform:none !important; transition:none !important;
}
.compact-ui .manifesto-char { opacity:1; transform:none; filter:none; }

@media (prefers-reduced-motion: reduce){
  .reveal, .reveal-car, .reveal-lines .line > span { opacity:1 !important; transform:none !important; transition:none !important; }
  html { scroll-behavior:auto; }
  [data-parallax] { transform:none !important; }
  .areas-video { display:none; animation:none; }
  .route-wipe { display:none; }
}

/* =====================================================
   BUTTONS
   ===================================================== */
.btn {
  display:inline-flex; align-items:center; justify-content:center;
  gap:.5em; padding:.9em 1.9em; border-radius:100px;
  font-size:.9rem; font-weight:700; letter-spacing:.01em;
  border:1px solid transparent; transition:all .35s var(--ease); white-space:nowrap;
}
.btn:active { transform:translateY(0); }
.btn-pill { background:var(--ink); color:#fff; }
.btn-pill:hover { background:#000; transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.18); }
.btn-light { background:#fff; color:var(--ink); }
.btn-light:hover { transform:translateY(-2px); box-shadow:0 12px 28px rgba(0,0,0,.25); }
.btn-outline-light { background:transparent; border-color:rgba(255,255,255,.35); color:#fff; }
.btn-outline-light:hover { border-color:#fff; background:rgba(255,255,255,.08); }
.btn-block { width:100%; }

/* =====================================================
   HEADER
   ===================================================== */
.site-header {
  position:fixed; top:0; left:0; right:0; z-index:100;
  color:#fff; padding:12px 0;
  transition:background .45s var(--ease), color .45s var(--ease), border-color .45s, backdrop-filter .45s;
  border-bottom:1px solid transparent;
}
.site-header.scrolled {
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  color:var(--ink);
  border-bottom-color:transparent;
}
.header-inner {
  display:flex; align-items:center; justify-content:space-between; height:62px; gap:24px;
  max-width:1120px; padding:0 12px 0 26px;
  background:rgba(18,18,16,.2); border:1px solid rgba(255,255,255,.24); border-radius:999px;
  box-shadow:0 10px 32px rgba(0,0,0,.12);
  backdrop-filter:blur(12px) saturate(125%); -webkit-backdrop-filter:blur(12px) saturate(125%);
  transition:background .45s var(--ease), border-color .45s var(--ease), box-shadow .45s var(--ease), backdrop-filter .45s var(--ease);
}
.site-header.scrolled .header-inner {
  background:rgba(255,255,255,.38); border-color:rgba(255,255,255,.52);
  box-shadow:0 10px 32px rgba(19,19,17,.1);
  backdrop-filter:blur(12px) saturate(125%); -webkit-backdrop-filter:blur(12px) saturate(125%);
}
.logo { display:flex; align-items:center; gap:.5em; min-width:44px; min-height:44px; }
.logo-mark { font-family:var(--serif); font-size:1.65rem; font-weight:700; letter-spacing:-.04em; line-height:1; }
.logo-text { font-size:.76rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase; opacity:.9; }

.nav { display:flex; gap:34px; }
.nav a { font-size:.9rem; font-weight:600; opacity:.82; position:relative; transition:opacity .3s; }
.nav a::after { content:""; position:absolute; left:0; bottom:-6px; width:0; height:1.5px; background:currentColor; transition:width .35s var(--ease); }
.nav a:hover { opacity:1; }
.nav a:hover::after { width:100%; }

.header-actions { display:flex; align-items:center; gap:14px; }
.lang-select { position:relative; }
.lang-btn { display:flex; align-items:center; gap:6px; background:none; border:none; color:inherit; opacity:.85; font-size:.85rem; font-weight:700; letter-spacing:.05em; padding:8px; transition:opacity .3s; }
.lang-btn:hover { opacity:1; }
.lang-menu {
  position:absolute; top:calc(100% + 10px); right:0; min-width:160px;
  background:#fff; color:var(--ink); border:1px solid var(--line); border-radius:14px; padding:6px;
  opacity:0; visibility:hidden; transform:translateY(-8px); transition:all .3s var(--ease); box-shadow:0 24px 50px rgba(0,0,0,.14);
}
.lang-select:hover .lang-menu, .lang-select:focus-within .lang-menu { opacity:1; visibility:visible; transform:none; }
.lang-menu li { padding:9px 12px; font-size:.85rem; color:var(--ink-dim); border-radius:9px; cursor:pointer; transition:.2s; }
.lang-menu li:hover { background:var(--bg); color:var(--ink); }

.site-header .btn-book { background:#fff; color:var(--ink); padding:.72em 1.5em; }
.site-header.scrolled .btn-book { background:var(--ink); color:#fff; }

.menu-toggle { display:none; width:48px; height:48px; align-items:center; justify-content:center; flex-direction:column; gap:6px; background:none; border:none; color:inherit; padding:0; border-radius:50%; }
.menu-toggle span { width:24px; height:2px; background:currentColor; border-radius:2px; transition:.35s var(--ease); }
.menu-toggle.open span:nth-child(1){ transform:translateY(4px) rotate(45deg); }
.menu-toggle.open span:nth-child(2){ transform:translateY(-4px) rotate(-45deg); }
.mobile-drawer { display:none; }

/* =====================================================
   HERO
   ===================================================== */
.hero { position:relative; min-height:100svh; display:flex; align-items:flex-end; overflow:hidden; }
.hero-media { position:absolute; inset:0; z-index:0; overflow:hidden; line-height:0; }
.hero-media img, .hero-media video { display:block; width:100%; height:100%; object-fit:cover; object-position:center 42%; transform:scale(1.12); animation:heroZoom 16s var(--ease-out) forwards; }
.hero-media .hero-mobile-poster { display:none; }
.hero-media video { pointer-events:none; }
@keyframes heroZoom { to { transform:scale(1.02); } }
.hero-overlay { position:absolute; top:0; right:0; bottom:0; left:0; width:100%; height:100%; z-index:1; pointer-events:none; background:
  radial-gradient(circle at 50% 44%, rgba(0,0,0,.08) 10%, rgba(0,0,0,.32) 75%),
  linear-gradient(to bottom, rgba(0,0,0,.5), rgba(0,0,0,.3) 34%, rgba(0,0,0,.32) 55%, rgba(0,0,0,.68) 100%); }

.hero-inner { position:relative; z-index:2; width:100%; padding:150px 0 96px; will-change:transform,opacity; transform:translate3d(0,0,0); }
.hero-content { text-align:center; color:#fff; }
.hero-eyebrow { font-size:.78rem; letter-spacing:.34em; text-transform:uppercase; font-weight:700; opacity:.85; margin-bottom:22px; }
.hero-title { font-family:var(--serif); font-weight:500; font-size:clamp(2.7rem,6.8vw,5.4rem); line-height:1.04; letter-spacing:-.045em; text-shadow:0 2px 40px rgba(0,0,0,.3); }
.hero-sub { font-size:clamp(1rem,1.8vw,1.3rem); font-weight:400; letter-spacing:.22em; text-transform:uppercase; opacity:.88; margin-top:22px; }

/* ---------- Booking (Blacklane-style bar) ---------- */
.booking-wrap { margin-top:56px; display:flex; flex-direction:column; align-items:center; gap:18px; }

.booking-tabs {
  display:inline-flex; padding:5px; border-radius:100px;
  background:rgba(18,18,16,.55);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.14);
}
.booking-tab {
  padding:10px 26px; border:none; border-radius:100px; background:transparent;
  color:rgba(255,255,255,.75); font-size:.92rem; font-weight:700; transition:all .35s var(--ease);
}
.booking-tab.active { background:#fff; color:var(--ink); }

.booking-bar {
  width:100%; max-width:1060px;
  background:rgba(18,18,16,.6);
  backdrop-filter:blur(20px) saturate(140%); -webkit-backdrop-filter:blur(20px) saturate(140%);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius-lg);
  box-shadow:0 30px 80px rgba(0,0,0,.35);
  padding:10px;
}
.booking-panel { display:none; align-items:center; gap:0; }
.booking-panel.active { display:flex; animation:fadeIn .5s var(--ease); }
@keyframes fadeIn { from{opacity:0;transform:translateY(6px);} to{opacity:1;transform:none;} }

.bfield { flex:1 1 0; min-width:0; padding:12px 22px; display:flex; flex-direction:column; gap:4px; }
.bfield-sm { flex:0 0 175px; }
.bfield label { font-size:.78rem; font-weight:600; color:rgba(255,255,255,.85); }
.bfield input, .bfield select {
  background:none; border:none; border-bottom:1px solid rgba(255,255,255,.3); outline:none;
  color:#fff; font-family:inherit; font-size:.95rem; font-weight:500; padding:5px 0 7px;
  transition:border-color .3s; width:100%;
}
.bfield input:focus, .bfield select:focus { border-bottom-color:#fff; }
.bfield input:focus-visible, .bfield select:focus-visible {
  outline:2px solid #fff; outline-offset:4px; border-radius:2px;
}
.bfield input::placeholder { color:rgba(255,255,255,.42); }
.bfield input[type=date], .bfield input[type=time] { color-scheme:dark; }
.bfield select { appearance:none; cursor:pointer; }
.bfield option { background:#1b1b19; color:#fff; }
.bdivider { width:1px; align-self:stretch; margin:10px 0; background:rgba(255,255,255,.14); }
.booking-submit { margin:0 8px 0 14px; flex:none; }
.booking-details {
  margin-top:10px; padding:16px 12px 10px; border-top:1px solid rgba(255,255,255,.14);
}
.booking-details-heading { margin:0 4px 12px; color:#fff; }
.booking-details-title { font-size:.86rem; font-weight:800; letter-spacing:.01em; }
.booking-details-heading > div > p:last-child {
  margin-top:2px; color:rgba(255,255,255,.66); font-size:.72rem; line-height:1.45;
}
.booking-details-grid {
  display:grid; grid-template-columns:minmax(120px,.55fr) minmax(110px,.5fr) minmax(430px,2.2fr) auto;
  gap:10px; align-items:stretch;
}
.booking-count-field {
  min-width:0; padding:10px 14px;
  background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.1); border-radius:13px;
}
.child-seat-group {
  min-width:0; margin:0; padding:8px 12px 10px;
  border:1px solid rgba(255,255,255,.1); border-radius:13px; color:#fff;
  background:rgba(255,255,255,.055);
}
.child-seat-group legend {
  padding:0 5px; font-size:.78rem; font-weight:700; color:rgba(255,255,255,.9);
}
.child-seat-group legend span { margin-left:5px; color:rgba(255,255,255,.5); font-size:.66rem; font-weight:500; }
.child-seat-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.child-seat-option {
  min-width:0; display:flex; align-items:center; justify-content:space-between; gap:8px;
  color:rgba(255,255,255,.9); font-size:.72rem; font-weight:650; line-height:1.2;
}
.child-seat-option > span { min-width:0; }
.child-seat-option small { display:block; margin-top:2px; color:rgba(255,255,255,.5); font-size:.61rem; font-weight:500; }
.child-seat-option select {
  width:48px; min-width:48px; min-height:40px; padding:0 5px; border:1px solid rgba(255,255,255,.24);
  border-radius:9px; background:#232321; color:#fff; font:700 .82rem var(--sans); text-align:center;
}
.child-seat-option select:focus-visible { outline:2px solid #fff; outline-offset:2px; }
.booking-submit-shared { min-height:100%; margin:0; align-self:stretch; white-space:nowrap; }
.booking-area-note {
  max-width:760px; margin:-2px auto 0; color:rgba(255,255,255,.84);
  font-size:.82rem; font-weight:500; line-height:1.55; text-align:center;
  text-shadow:0 1px 14px rgba(0,0,0,.42);
}

/* ---------- Address autocomplete ---------- */
.ac-field { position:relative; }

.ac-clear {
  position:absolute; right:16px; bottom:14px; z-index:3;
  width:26px; height:26px; display:grid; place-items:center;
  border:0; border-radius:50%; padding:0; cursor:pointer;
  background:transparent; color:rgba(255,255,255,.55);
  transition:color .2s, background .2s;
}
.ac-clear:hover { color:#fff; background:rgba(255,255,255,.12); }
.ac-clear svg { width:15px; height:15px; }
@media (pointer:coarse) {
  .ac-field input { padding-right:48px; }
  .ac-clear { right:3px; bottom:5px; width:44px; height:44px; }
}

.ac-panel {
  position:absolute; z-index:60; top:calc(100% + 10px); left:6px; right:6px;
  display:flex; flex-direction:column; overflow:hidden;
  background:#1c1c1e; color:#fff;
  border:1px solid rgba(255,255,255,.1); border-radius:16px;
  box-shadow:0 30px 70px rgba(0,0,0,.55);
  animation:acIn .18s var(--ease);
}
/* A bare `display:flex` would override the hidden attribute, leaving an empty
   panel floating under the field and showing local
   results — both selectors below need the extra specificity to win. */
.ac-panel[hidden], .ac-attrib[hidden], .ac-selected-attrib[hidden], .dt-panel[hidden], .ac-clear[hidden] { display:none; }
.ac-panel.panel-up, .dt-panel.panel-up { top:auto; bottom:calc(100% + 10px); animation-name:acInUp; }
@keyframes acIn { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:none; } }
@keyframes acInUp { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }

/* Phone suggestions use a viewport-level sheet. It remains above the software
   keyboard instead of flipping around while the visual viewport is resizing. */
.ac-panel.ac-panel-sheet {
  position:fixed; z-index:160; top:auto;
  right:max(12px,env(safe-area-inset-right),calc((100vw - 560px)/2));
  bottom:var(--ac-sheet-bottom,max(12px,env(safe-area-inset-bottom)));
  left:max(12px,env(safe-area-inset-left),calc((100vw - 560px)/2));
  border-radius:18px; animation-name:acSheetIn;
}
@keyframes acSheetIn { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }

.ac-list {
  margin:0; padding:8px; list-style:none;
  max-height:310px; overflow-y:auto; overscroll-behavior:contain;
  touch-action:pan-y; -webkit-overflow-scrolling:touch;
  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.22) transparent;
}
.ac-list::-webkit-scrollbar { width:8px; }
.ac-list::-webkit-scrollbar-thumb { background:rgba(255,255,255,.22); border-radius:99px; border:2px solid transparent; background-clip:content-box; }

.ac-item {
  display:flex; align-items:flex-start; gap:15px;
  padding:13px 14px; border-radius:11px; cursor:pointer;
  transition:background .15s;
}
.ac-item.active, .ac-item:hover { background:rgba(255,255,255,.08); }
.ac-icon { flex:none; width:21px; height:21px; margin-top:2px; color:rgba(255,255,255,.62); }
.ac-text { min-width:0; display:flex; flex-direction:column; gap:3px; }
.ac-text strong { font-size:.97rem; font-weight:700; letter-spacing:-.01em; }
.ac-text small {
  font-size:.83rem; line-height:1.35; color:rgba(255,255,255,.52);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}

.ac-attrib {
  display:flex; align-items:center; justify-content:flex-end; gap:6px;
  padding:11px 20px; background:#161618;
  border-top:1px solid rgba(255,255,255,.07);
  font-family:Roboto,"Plus Jakarta Sans",sans-serif; font-size:.76rem; font-weight:400;
  letter-spacing:normal; white-space:nowrap; color:#fff;
}
.ac-field > label { display:flex; align-items:center; gap:10px; }
.ac-selected-attrib {
  margin-left:auto; flex:none; color:#fff; font-family:Roboto,"Plus Jakarta Sans",sans-serif;
  font-size:.75rem; font-style:normal; font-weight:400; letter-spacing:normal; white-space:nowrap;
}
.ac-message { padding:15px 14px; color:rgba(255,255,255,.78); font-size:.84rem; line-height:1.45; }
.ac-live {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ---------- Date & time pickers ---------- */
.dt-field { position:relative; }
.dt-trigger {
  display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%;
  padding:5px 0 7px; background:none; border:none; border-bottom:1px solid rgba(255,255,255,.3);
  color:#fff; font-family:inherit; font-size:.95rem; font-weight:500; text-align:left;
  cursor:pointer; transition:border-color .3s;
}
.dt-trigger:hover, .dt-trigger[aria-expanded="true"] { border-bottom-color:#fff; }
.dt-trigger:focus-visible { border-bottom-color:#fff; outline:2px solid #fff; outline-offset:4px; border-radius:2px; }
.dt-value { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dt-value.is-placeholder { color:rgba(255,255,255,.42); }
.dt-icon { flex:none; display:grid; place-items:center; color:rgba(255,255,255,.6); }
.dt-icon svg { width:17px; height:17px; }

.dt-panel {
  position:absolute; z-index:60; top:calc(100% + 10px); left:0; min-width:288px;
  display:flex; flex-direction:column; overflow:hidden;
  background:#1c1c1e; color:#fff;
  border:1px solid rgba(255,255,255,.1); border-radius:16px;
  box-shadow:0 30px 70px rgba(0,0,0,.55);
  animation:acIn .18s var(--ease);
}
.bfield:last-of-type .dt-panel, .bfield-sm:nth-last-of-type(2) .dt-panel { left:auto; right:0; }

.dt-head { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:15px 15px 9px; }
.dt-head strong { font-size:.95rem; font-weight:700; letter-spacing:-.01em; }
.dt-nav {
  width:30px; height:30px; display:grid; place-items:center; padding:0;
  background:none; border:0; border-radius:50%; cursor:pointer;
  color:rgba(255,255,255,.75); transition:background .18s, color .18s;
}
.dt-nav svg { width:16px; height:16px; }
.dt-nav:hover:not(:disabled) { background:rgba(255,255,255,.12); color:#fff; }
.dt-nav:disabled { opacity:.28; cursor:default; }

.dt-weekdays, .dt-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; padding:0 12px; }
.dt-weekdays { padding-bottom:6px; }
.dt-weekdays span { text-align:center; font-size:.7rem; font-weight:700; letter-spacing:.06em; color:rgba(255,255,255,.42); }
.dt-grid { padding-bottom:14px; }
.dt-day {
  aspect-ratio:1; display:grid; place-items:center; padding:0;
  background:none; border:0; border-radius:9px; cursor:pointer;
  color:#fff; font:600 .87rem inherit; transition:background .15s, color .15s;
}
.dt-day.is-blank { pointer-events:none; }
.dt-day:hover:not(:disabled):not(.is-selected) { background:rgba(255,255,255,.12); }
.dt-day:disabled { color:rgba(255,255,255,.2); cursor:default; }
.dt-day.is-today:not(.is-selected) { color:var(--accent); }
.dt-day.is-selected { background:#fff; color:#121210; font-weight:700; }

.dt-times {
  padding:8px; overflow-y:auto; overscroll-behavior:contain;
  scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.22) transparent;
}
.dt-times::-webkit-scrollbar { width:8px; }
.dt-times::-webkit-scrollbar-thumb { background:rgba(255,255,255,.22); border-radius:99px; border:2px solid transparent; background-clip:content-box; }
.dt-time {
  display:block; width:100%; padding:9px 14px; margin-bottom:2px;
  background:none; border:0; border-radius:9px; cursor:pointer;
  color:#fff; font:600 .9rem inherit; text-align:left; transition:background .15s;
}
.dt-time:hover:not(:disabled):not(.is-selected) { background:rgba(255,255,255,.09); }
.dt-time:disabled { color:rgba(255,255,255,.22); cursor:default; }
.dt-time.is-selected { background:#fff; color:#121210; font-weight:700; }

@media (prefers-reduced-motion:reduce) { .ac-panel, .dt-panel { animation:none; } }

/* ---------- Scroll indicator ---------- */
.scroll-indicator { position:absolute; bottom:22px; left:50%; transform:translateX(-50%); z-index:3; }
.scroll-line { display:block; width:1.5px; height:52px; background:rgba(255,255,255,.25); overflow:hidden; border-radius:2px; }
.scroll-dot { display:block; width:100%; height:14px; background:#fff; border-radius:2px; animation:scrollDot 2s var(--ease) infinite; }
@keyframes scrollDot { 0%{transform:translateY(-16px);} 70%{transform:translateY(54px);} 100%{transform:translateY(54px);} }

/* =====================================================
   BRAND STATEMENT
   ===================================================== */
.manifesto { background:var(--dark); color:#fff; padding:88px 0 130px; position:relative; overflow:hidden; }
.manifesto::before { content:"ALP"; position:absolute; right:-.04em; bottom:-.3em; font-size:clamp(12rem,32vw,34rem); line-height:1; font-weight:800; letter-spacing:-.09em; color:rgba(255,255,255,.025); pointer-events:none; }
.manifesto-grid { position:relative; z-index:1; }
.manifesto-kicker { display:flex; justify-content:space-between; align-items:center; padding-bottom:20px; border-bottom:1px solid rgba(255,255,255,.18); color:rgba(255,255,255,.62); font-size:.72rem; font-weight:700; letter-spacing:.2em; text-transform:uppercase; }
.manifesto-copy { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(260px,.65fr); gap:8vw; align-items:end; padding:78px 0 96px; }
.manifesto-title { position:relative; max-width:830px; perspective:900px; font-size:clamp(3rem,7.4vw,7rem); line-height:.96; letter-spacing:-.065em; font-weight:500; }
.manifesto-title .line > span { display:block; transform:none; transition:none; }
.manifesto-word { display:inline-block; white-space:nowrap; }
.manifesto-char {
  display:inline-block; opacity:0; transform-origin:50% 50%;
  font-variant-numeric:tabular-nums; will-change:transform,opacity,filter;
}
.manifesto-space { width:.24em; }
.manifesto-char.is-spinning {
  opacity:1; filter:blur(.7px);
  animation:manifestoSlotSpin 140ms ease-in-out infinite;
}
.manifesto-char.is-settled { opacity:1; animation:manifestoSlotLock .3s var(--ease-out) both; }
.manifesto-title .line:last-child .manifesto-char { color:rgba(255,255,255,.42); }
@keyframes manifestoSlotSpin {
  0% { transform:translateY(-.16em) rotateX(-52deg); }
  50% { transform:translateY(0) rotateX(0); }
  100% { transform:translateY(.16em) rotateX(52deg); }
}
@keyframes manifestoSlotLock {
  0% { transform:translateY(-.25em) rotateX(-55deg) scale(.9); filter:blur(2px); }
  70% { transform:translateY(.025em) rotateX(3deg) scale(1.015); filter:blur(0); }
  100% { transform:none; filter:none; }
}
@media (prefers-reduced-motion:reduce) {
  .manifesto-char { opacity:1; filter:none; transform:none; transition:none; }
  .manifesto-char.is-spinning, .manifesto-char.is-settled { animation:none; }
}
.manifesto-detail { padding-bottom:8px; }
.manifesto-detail p { color:rgba(255,255,255,.66); font-size:1rem; line-height:1.75; max-width:370px; }
.trust-row { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,255,255,.18); }
.trust-row > div { display:flex; flex-direction:column; gap:3px; padding:28px 28px 0 0; border-right:1px solid rgba(255,255,255,.18); }
.trust-row > div + div { padding-left:28px; }
.trust-row > div:last-child { border-right:0; }
.trust-row strong { font-size:1.55rem; letter-spacing:-.04em; font-weight:600; }
.trust-row span { color:rgba(255,255,255,.5); font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; }

/* =====================================================
   SECTIONS
   ===================================================== */
.section { padding:130px 0; position:relative; }
.section-head { max-width:640px; margin-bottom:64px; }
.section-head.centered { margin-left:auto; margin-right:auto; text-align:center; }
.section-eyebrow { font-size:.76rem; letter-spacing:.28em; text-transform:uppercase; color:var(--ink-mute); font-weight:800; margin-bottom:18px; }
.section-title { font-family:var(--serif); font-weight:500; font-size:clamp(2.2rem,5vw,3.6rem); line-height:1.05; letter-spacing:-.04em; }
.section-lead { color:var(--ink-dim); font-size:1.08rem; margin-top:18px; font-weight:400; max-width:520px; }
.section-head.centered .section-lead { margin-left:auto; margin-right:auto; }

/* =====================================================
   SERVICES — cinematic scroll
   ===================================================== */
.services-cinematic { background:var(--bg); padding:0; }
.services-cinematic.is-static { background:var(--bg-alt); padding:0; }
.ss-head {
  position:absolute; top:clamp(96px,12vh,136px); left:0; right:0; z-index:5;
  color:#fff; pointer-events:none;
}
.ss-head .section-eyebrow { color:rgba(255,255,255,.68); }
.ss-head .section-title {
  width:fit-content; color:#fff; background:none;
  text-shadow:none;
}
.ss-head .section-title .line,
.ss-head .section-title .line > span {
  background:transparent !important; box-shadow:none !important;
  text-shadow:none !important; backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.ss-head .section-title.reveal-lines.in .line { overflow:visible; }
.ss-head .section-lead { color:rgba(255,255,255,.82); text-shadow:0 2px 20px rgba(0,0,0,.4); }

.ss-pin { position:relative; }
.ss-stage {
  position:sticky; top:0; height:100svh; overflow:hidden;
  background:var(--dark); opacity:0; transition:opacity .7s var(--ease-out);
}
.ss-stage.is-ready { opacity:1; }

.ss-media-layer { position:absolute; inset:0; z-index:1; }
.ss-panel { position:absolute; inset:0; opacity:0; will-change:opacity,transform; transform:translate3d(0,0,0) scale(1.035); }
.ss-panel:first-child { opacity:1; }
.ss-bg { position:absolute; inset:0; background-size:cover; background-position:center; }

.ss-car-layer {
  position:absolute; inset:0; z-index:2;
  display:flex; align-items:flex-end; justify-content:center;
  padding-bottom:1.5%; pointer-events:none;
}
.ss-car {
  width:min(74%,940px); max-height:60%; object-fit:contain;
  filter:drop-shadow(0 40px 60px rgba(0,0,0,.4));
  transform:translate3d(-48vw,0,0);
  will-change:transform;
}

.ss-text-layer { position:absolute; inset:0; z-index:3; pointer-events:none; }
.ss-text-panel {
  position:absolute; left:0; right:0; bottom:0; padding-bottom:120px;
  opacity:0; will-change:opacity,transform; pointer-events:none;
}
.ss-text-panel:first-child { opacity:1; }
.ss-text-panel h3 {
  font-family:var(--serif); font-weight:500; color:#fff;
  font-size:clamp(1.9rem,3.6vw,2.9rem); letter-spacing:-.035em;
  text-shadow:0 4px 30px rgba(0,0,0,.4); max-width:600px;
}
.ss-text-panel p { color:rgba(255,255,255,.82); margin-top:14px; max-width:460px; font-size:1.02rem; }

.ss-progress {
  position:absolute; left:0; right:0; bottom:36px; z-index:4;
  display:flex; flex-direction:column; align-items:center; gap:14px; pointer-events:none;
}
.ss-progress-track { width:min(560px,70%); height:2px; background:rgba(255,255,255,.22); border-radius:2px; overflow:hidden; }
.ss-progress-fill { height:100%; width:0%; background:#fff; }
.ss-dots { display:flex; gap:6px; pointer-events:auto; }
.ss-dot {
  width:36px; height:30px; border:none; background:transparent; border-radius:8px;
  color:rgba(255,255,255,.5); font-size:.72rem; font-weight:700; letter-spacing:.02em; transition:.3s var(--ease);
}
.ss-dot:hover { color:rgba(255,255,255,.85); }
.ss-dot.active { color:#131311; background:#fff; }

/* Static fallback: no GSAP, or prefers-reduced-motion */
.is-static .ss-stage {
  position:relative; height:auto; overflow:visible; opacity:1; background:var(--bg-alt);
  display:flex; flex-direction:column; gap:0; padding:18px;
  border-radius:0;
}
.is-static .ss-pin { height:auto !important; }
.is-static .ss-head {
  position:relative; inset:auto; order:-1; padding-top:74px; padding-bottom:34px;
  color:var(--ink); pointer-events:auto;
}
.is-static .ss-head .section-eyebrow { color:var(--ink-mute); }
.is-static .ss-head .section-title { color:var(--ink); }
.is-static .ss-head .section-lead { color:var(--ink-dim); text-shadow:none; }
.is-static .ss-media-layer,
.is-static .ss-text-layer { display:contents; }
.is-static .ss-car-layer,
.is-static .ss-progress { display:none; }
.is-static .ss-panel,
.is-static .ss-text-panel { order:var(--i,0); }
.is-static .ss-panel {
  position:relative; inset:auto; opacity:1; aspect-ratio:16/10; margin-top:18px;
  border-radius:var(--radius-lg) var(--radius-lg) 0 0; overflow:hidden;
  transform:none; will-change:auto; isolation:isolate; contain:paint;
}
.is-static .ss-panel .ss-bg { width:100%; height:100%; border-radius:inherit; }
.is-static .ss-text-panel { position:relative; opacity:1; padding:22px 24px 26px; pointer-events:auto; background:var(--card); border-radius:0 0 var(--radius-lg) var(--radius-lg); }
.is-static .ss-text-panel h3 { color:var(--ink); text-shadow:none; }
.is-static .ss-text-panel p { color:var(--ink-dim); }

/* =====================================================
   FLEET (Rivian-style showcase)
   ===================================================== */
.fleet { background:var(--bg-alt); padding:0 0 60px; }
.fleet-side-title { padding:90px 28px 0; text-align:center; }
.fleet-side-title > span { display:block; color:var(--ink-mute); font-size:.72rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.fleet-side-title h2 { margin-top:10px; font-size:clamp(2.2rem,5vw,3.6rem); font-weight:500; letter-spacing:-.04em; line-height:1; }
.fleet-side-title .split-char { display:inline-block; font-size:inherit; font-weight:inherit; letter-spacing:inherit; text-transform:inherit; will-change:transform,opacity; }
.fleet-side-title .split-space { display:inline-block; width:.28em; font-size:inherit; }

.fleet-item { padding:110px 24px 90px; text-align:center; position:relative; overflow:hidden; }
.fleet-stage { position:relative; max-width:900px; margin:0 auto; display:flex; justify-content:center; align-items:flex-end; min-height:340px; }
.ghost {
  position:absolute; left:0; right:0; top:0; z-index:0;
  width:100%; text-align:center;
  font-family:var(--sans); font-weight:800; text-transform:uppercase;
  font-size:clamp(4.6rem,15vw,12.5rem); line-height:.9; letter-spacing:-.03em;
  color:var(--ghost); user-select:none; pointer-events:none;
  will-change:transform;
}
.fleet-car { position:relative; z-index:1; max-height:330px; width:auto; max-width:88%; object-fit:contain; mix-blend-mode:multiply; }

.fleet-info { position:relative; z-index:2; width:100%; max-width:720px; margin:34px auto 0; text-align:center; }
.fleet-info h3 { font-family:var(--serif); font-size:2rem; font-weight:600; letter-spacing:-.03em; }
.fleet-tag { color:var(--ink-dim); margin-top:6px; }
.fleet-specs { display:flex; align-items:center; justify-content:center; gap:14px; margin:18px 0 26px; color:var(--ink-dim); font-size:.95rem; font-weight:600; }
.fleet-specs span { display:inline-flex; align-items:center; gap:8px; }
.fleet-specs .dot { color:var(--ink-mute); }
.spec-ic { width:19px; height:19px; color:var(--ink); }

/* Horizontal scroll enhancement (JS adds .is-horizontal when GSAP is
   available and motion isn't reduced; otherwise the items above stack
   vertically exactly as before). */
/* overflow:hidden lives on the static pin wrapper, not on .fleet-track —
   .fleet-track is the wide (300%) element that gets transformed, so
   clipping it to its own box would cut off item 2/3 before the transform
   ever slides them into view. */
.fleet-pin { position:relative; overflow:hidden; }
.fleet-pin.is-horizontal .fleet-side-title {
  position:absolute; left:clamp(18px,3vw,56px); top:50%; z-index:5; padding:0;
  display:block; writing-mode:vertical-rl;
  transform:translateY(-50%) rotate(180deg); text-align:left; pointer-events:none;
}
.fleet-pin.is-horizontal .fleet-side-title > span { display:none; }
.fleet-pin.is-horizontal .fleet-side-title h2 {
  margin:0; color:rgba(19,19,17,.82); font-size:clamp(7.5rem,11vw,13rem);
  font-weight:600; line-height:.82; letter-spacing:-.04em; white-space:nowrap;
}
.fleet-track.is-horizontal {
  position:relative; height:100dvh;
}
.fleet-track.is-horizontal .fleet-item {
  position:absolute; inset:0; width:100%; height:100%; opacity:0;
  display:flex; flex-direction:column; justify-content:center;
  padding:24px 24px 90px; pointer-events:none;
  will-change:opacity;
}
.fleet-track.is-horizontal .fleet-car,
.fleet-track.is-horizontal .fleet-info,
.fleet-track.is-horizontal .ghost {
  will-change:transform,opacity;
  /* .reveal-car/.reveal (below) carry a 1-1.2s opacity/transform CSS
     transition meant for the one-time page-load fade-in. Once horizontal
     mode drives these same properties continuously via gsap.set() on
     every scroll tick, that leftover transition fights it — every GSAP
     update gets smoothed over ~1.2s instead of applying instantly, which
     is what made the car look perpetually half-faded/washed out. */
  transition:none !important;
}

.fleet-progress { display:none; }
.fleet-pin.is-horizontal .fleet-progress {
  position:absolute; left:0; right:0; bottom:28px; z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:14px;
}
.fleet-progress-track { width:min(320px,50%); height:2px; background:var(--line); border-radius:2px; overflow:hidden; }
.fleet-progress-fill { height:100%; width:0%; background:var(--ink); }
.fleet-dots { display:flex; gap:6px; }
.fleet-dot {
  width:36px; height:30px; border:none; background:transparent; border-radius:8px;
  color:var(--ink-mute); font-size:.72rem; font-weight:700; letter-spacing:.02em; transition:.3s var(--ease);
}
.fleet-dot:hover { color:var(--ink); }
.fleet-dot.active { color:#fff; background:var(--ink); }

/* =====================================================
   SERVICE AREAS
   ===================================================== */
.areas { position:relative; overflow:hidden; min-height:100svh; display:flex; align-items:center; }
.areas::before {
  content:""; position:absolute; inset:0;
  background:url('../assets/images/airport-bg.jpg') center 30%/cover no-repeat;
  z-index:0;
}
.areas-video {
  position:absolute; inset:0; z-index:0; width:100%; height:100%; object-fit:cover; object-position:center; pointer-events:none;
  animation:areasZoom 22s ease-in-out infinite alternate;
}
@keyframes areasZoom { from { transform:scale(1); } to { transform:scale(1.09); } }
.areas::after {
  content:""; position:absolute; inset:0;
  background:linear-gradient(to left, rgba(12,11,10,.82) 0%, rgba(12,11,10,.55) 55%, rgba(12,11,10,.3) 100%),
             linear-gradient(to bottom, rgba(12,11,10,.35), transparent 25%, transparent 75%, rgba(12,11,10,.35));
  z-index:1;
}
.areas-inner { position:relative; z-index:2; display:grid; grid-template-columns:1.25fr .9fr; gap:64px; align-items:center; }
.areas .section-eyebrow { color:rgba(255,255,255,.6); }
.areas .section-title { color:#fff; }
.areas .section-lead { color:rgba(255,255,255,.78); }
.areas-panel { max-width:640px; }
.areas-panel-title {
  font-size:.8rem; font-weight:700; letter-spacing:.3em; text-transform:uppercase;
  color:rgba(255,255,255,.5); margin-bottom:4px;
}

/* =====================================================
   OPTION WHEEL — vanilla port of react-bits' OptionWheel.
   No React/build step: main.js drives the same eased rAF
   layout loop directly over these DOM nodes. Falls back to
   a plain static list (no absolute positioning) until JS
   adds .option-wheel--ready, so it degrades cleanly with
   no-JS or if the enhancement script fails. No card chrome —
   it sits directly on the video background; position is
   scrubbed by the section's scroll progress (see main.js).
   ===================================================== */
.areas-wheel-row {
  display:grid; grid-template-columns:minmax(260px,1fr) minmax(190px,.72fr);
  gap:clamp(24px,4vw,60px); align-items:center;
}
.option-wheel {
  --ow-text-color: rgba(255,255,255,.3);
  --ow-active-color: #ffffff;
  --ow-font-size: clamp(3.2rem, 5.7vw, 5.8rem);
  --ow-inset: clamp(72px,7vw,104px);
  position:relative; width:100%; height:clamp(480px,68vh,720px); overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 15%,#000 85%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0%,#000 15%,#000 85%,transparent 100%);
  outline:none; user-select:none;
}
.option-wheel:focus-visible { outline:1px solid rgba(255,255,255,.4); outline-offset:4px; border-radius:8px; }
.option-wheel--ready { cursor:grab; touch-action:none; }
.option-wheel--ready.option-wheel--dragging { cursor:grabbing; }

.option-wheel__item {
  display:block; padding:6px 0; font-family:var(--serif); font-weight:600;
  font-size:1.4rem; color:var(--ow-text-color); cursor:pointer;
}
.option-wheel__item--selected { color:#fff; }

.option-wheel--ready .option-wheel__item {
  position:absolute; top:50%; left:var(--ow-inset); padding:0;
  white-space:nowrap; font-size:var(--ow-font-size); line-height:1;
  letter-spacing:-.02em; transform-origin:left center; will-change:transform,opacity,filter;
  color:var(--ow-text-color);
  color:color-mix(in srgb, var(--ow-active-color) calc(var(--ow-p,0) * 100%), var(--ow-text-color));
}

.areas-wheel-detail { padding-left:0; min-width:0; }
.areas-wheel-name { color:#fff; font-family:var(--serif); font-size:1.3rem; font-weight:600; line-height:1.3; }

/* =====================================================
   REVIEWS
   ===================================================== */
.reviews { background:var(--bg-alt); }
.reviews .section-head { max-width:720px; margin-inline:auto; }
.reviews .section-lead { max-width:620px; margin:18px auto 0; }
.review-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:52px; }
.review-card {
  display:flex; flex-direction:column; min-width:0; min-height:330px; padding:30px;
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius-lg);
  box-shadow:0 14px 40px rgba(22,18,12,.06); transition:transform .25s var(--ease),box-shadow .25s var(--ease);
}
.review-card--featured { background:var(--ink); color:#fff; border-color:transparent; box-shadow:0 20px 52px rgba(22,18,12,.16); }
.review-card-top { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.review-stars { color:var(--accent); font-size:.94rem; letter-spacing:.16em; white-space:nowrap; }
.review-trip { color:var(--ink-mute); font-size:.7rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; text-align:right; }
.review-card--featured .review-trip { color:rgba(255,255,255,.62); }
.review-card blockquote { margin:34px 0 32px; color:var(--ink); font-family:var(--serif); font-size:clamp(1.25rem,1.45vw,1.55rem); line-height:1.48; letter-spacing:-.015em; }
.review-card--featured blockquote { color:#fff; }
.review-card footer { display:flex; align-items:center; gap:12px; margin-top:auto; }
.review-avatar { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; border-radius:50%; background:var(--bg-alt); color:var(--ink); font-size:.72rem; font-weight:800; letter-spacing:.06em; }
.review-card--featured .review-avatar { background:rgba(255,255,255,.13); color:#fff; }
.review-card footer > span:last-child { display:grid; gap:2px; min-width:0; }
.review-card footer strong { font-size:.88rem; }
.review-card footer small { color:var(--ink-mute); font-size:.76rem; line-height:1.4; }
.review-card--featured footer small { color:rgba(255,255,255,.62); }
.reviews-disclosure { margin:24px auto 0; color:var(--ink-mute); font-size:.72rem; line-height:1.5; text-align:center; }
@media (hover:hover) and (pointer:fine){
  .review-card:hover { transform:translateY(-5px); box-shadow:0 22px 54px rgba(22,18,12,.1); }
  .review-card--featured:hover { box-shadow:0 26px 62px rgba(22,18,12,.2); }
}
@media (max-width:1024px) and (min-width:761px){
  .review-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .review-card:last-child { grid-column:1 / -1; min-height:280px; }
}

/* =====================================================
   CONTACT
   ===================================================== */
.contact { background:var(--bg); }
.contact-inner { max-width:760px; }
.contact-methods { margin-top:40px; border-top:1px solid var(--line); }
.contact-method {
  display:flex; align-items:baseline; gap:20px; padding:20px 4px;
  border-bottom:1px solid var(--line); transition:padding .3s var(--ease), background .3s;
}
.contact-method:hover { padding-left:14px; }
.contact-method[data-sms-booking] { background:linear-gradient(90deg,rgba(18,18,18,.08),rgba(18,18,18,0) 72%); }
.contact-method[data-sms-booking] .cm-label,
.contact-method[data-sms-booking] .cm-arrow { color:var(--ink); }
.contact-method[data-sms-booking]:hover { background:linear-gradient(90deg,rgba(18,18,18,.14),rgba(18,18,18,0) 78%); }
.contact-method[data-whatsapp-booking] { background:linear-gradient(90deg,rgba(37,211,102,.08),rgba(37,211,102,0) 72%); }
.contact-method[data-whatsapp-booking] .cm-label,
.contact-method[data-whatsapp-booking] .cm-arrow { color:var(--whatsapp-dark); }
.contact-method[data-whatsapp-booking]:hover { background:linear-gradient(90deg,rgba(37,211,102,.2),rgba(37,211,102,0) 78%); }
.cm-label { flex:0 0 92px; font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; font-weight:800; color:var(--ink-mute); }
.cm-value { flex:1; font-size:1.02rem; font-weight:600; color:var(--ink); min-width:0; overflow-wrap:anywhere; }
.cm-arrow { color:var(--ink-mute); transition:transform .3s var(--ease), color .3s; }
.contact-method:hover .cm-arrow { transform:translateX(6px); color:var(--ink); }

/* =====================================================
   FOOTER
   ===================================================== */
.site-footer { background:var(--dark); color:#fff; padding-top:80px; }
.footer-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1.4fr; gap:44px; padding-bottom:56px; }
.footer-brand .logo { margin-bottom:22px; }
.footer-addr { color:rgba(255,255,255,.6); font-size:.93rem; line-height:1.95; }
.footer-addr a { display:inline-flex; align-items:center; min-height:44px; }
.footer-addr a:hover { color:#fff; }
.socials { display:flex; gap:12px; margin-top:24px; }
.socials a { width:44px; height:44px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(255,255,255,.2); border-radius:50%; color:rgba(255,255,255,.7); transition:all .3s var(--ease); }
.socials a svg { width:18px; height:18px; }
.socials a:hover { border-color:#fff; color:#fff; transform:translateY(-3px); }
.footer-col h4 { font-size:.78rem; letter-spacing:.18em; text-transform:uppercase; margin-bottom:20px; font-weight:800; color:rgba(255,255,255,.5); }
.footer-col a { display:block; color:rgba(255,255,255,.75); font-size:.93rem; padding:6px 0; transition:color .3s, transform .3s; }
.footer-col a:hover { color:#fff; }
.footer-cta p { color:rgba(255,255,255,.6); font-size:.93rem; margin-bottom:20px; }
.footer-col a.btn-light { display:inline-flex; color:var(--ink); padding:.9em 1.9em; }
.footer-col a.btn-light:hover { color:var(--ink); }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; padding:28px; border-top:1px solid rgba(255,255,255,.12); color:rgba(255,255,255,.45); font-size:.85rem; }
.footer-legal { display:flex; gap:28px; }
.footer-legal a { display:flex; align-items:center; min-height:44px; }
.footer-legal a:hover { color:#fff; }

/* =====================================================
   SMS FAB
   ===================================================== */
.fab-sms { position:fixed; bottom:26px; right:26px; z-index:90; width:56px; height:56px; border:1px solid rgba(255,255,255,.32); border-radius:50%; background:var(--sms); color:var(--sms-ink); display:flex; align-items:center; justify-content:center; box-shadow:0 12px 30px rgba(0,0,0,.28); transition:transform .3s var(--ease),background-color .2s ease,box-shadow .2s ease,opacity .2s ease,visibility .2s; }
.fab-sms.is-mobile-hidden { opacity:0; visibility:hidden; pointer-events:none; transform:translateY(12px); }
.fab-sms svg { width:27px; height:27px; }
.fab-sms:hover { background:#2b2b2b; box-shadow:0 14px 34px rgba(0,0,0,.36); transform:scale(1.08); }

/* =====================================================
   RESPONSIVE
   ===================================================== */
@media (max-width:1024px){
  .footer-grid { grid-template-columns:1fr 1fr; gap:36px; }
  .booking-panel.active { flex-wrap:wrap; }
  .bfield { flex:1 1 45%; }
  .bfield-sm { flex:1 1 45%; }
  .bdivider { display:none; }
  .booking-submit { flex:1 1 100%; margin:8px 12px 10px; }
  .booking-details-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .child-seat-group { grid-column:1 / -1; }
  .booking-submit-shared { grid-column:1 / -1; min-height:52px; margin:0; }
  .ss-car { width:min(76%,780px); max-height:56%; }
  .ss-text-panel { padding-bottom:100px; }
}
@media (max-width:960px){
  .nav { display:none; }
  .btn-book { display:none; }
  .lang-select { display:none; }
  .menu-toggle { display:flex; }
  .areas-inner { grid-template-columns:1fr; gap:44px; }
  .areas-copy { order:-1; }
  .areas { padding-top:100px; padding-bottom:70px; }
  .areas-wheel-row { grid-template-columns:minmax(180px,1fr) minmax(145px,.75fr); gap:24px; }
  .option-wheel { --ow-font-size:clamp(2.75rem,11vw,4.6rem); --ow-inset:clamp(48px,8vw,72px); height:clamp(390px,58vh,560px); }
  .areas-wheel-name { font-size:1.05rem; }
  .ss-dots { display:none; }
  .ss-progress { bottom:22px; }
  .ss-text-panel { padding-bottom:64px; }
  .ss-text-panel h3 { font-size:clamp(1.5rem,5.5vw,2rem); }
  .ss-car { width:min(88%,620px); max-height:48%; }

  .mobile-drawer { display:block; position:fixed;
    top:calc(84px + env(safe-area-inset-top)); left:max(12px,env(safe-area-inset-left)); right:max(12px,env(safe-area-inset-right)); z-index:99;
    background:rgba(246,245,241,.98); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
    border:1px solid rgba(255,255,255,.75); box-shadow:0 24px 70px rgba(0,0,0,.2);
    max-height:0; overflow:hidden; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-8px);
    transition:max-height .35s var(--ease),opacity .22s ease,transform .35s var(--ease),visibility 0s linear .35s;
    color:var(--ink); border-radius:22px; }
  .mobile-drawer.open { max-height:calc(100dvh - 100px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); overflow-y:auto; opacity:1; visibility:visible; pointer-events:auto; transform:none; transition-delay:0s; }
  .mobile-nav { display:flex; flex-direction:column; padding:22px 28px 32px; gap:4px; }
  .mobile-nav a { display:flex; align-items:center; min-height:48px; padding:10px 0; font-size:1.05rem; font-weight:600; color:var(--ink-dim); border-bottom:1px solid var(--line); }
  .mobile-nav a.btn { width:100%; align-self:stretch; justify-content:center; border:none; margin:16px 0 0; color:#fff; }
  .manifesto-copy { grid-template-columns:1fr; gap:44px; padding:60px 0 72px; }
  .manifesto-detail { max-width:480px; }
}
@media (max-width:560px){
  .container { padding:0 20px; }
  .section { padding:90px 0; }
  .services-cinematic { padding:0; }
  .ss-head { top:92px; }
  .areas { padding-top:86px; padding-bottom:48px; }
  .areas-inner { gap:24px; }
  .areas-wheel-row { grid-template-columns:minmax(135px,1fr) minmax(120px,.82fr); gap:16px; }
  .option-wheel { --ow-font-size:clamp(2.5rem,13vw,3.75rem); --ow-inset:36px; height:clamp(340px,52vh,470px); }
  .areas-wheel-name { font-size:.95rem; }
  .footer-grid { grid-template-columns:1fr; }
  .bfield, .bfield-sm { flex:1 1 100%; }
  .footer-bottom { flex-direction:column; text-align:center; }
  .fleet-item { padding:80px 16px 70px; }
  .fleet-stage { min-height:210px; }
  .fleet-car { max-height:190px; }
  .hero-inner { padding-bottom:76px; }
  .cm-label { flex-basis:74px; }
  .is-static .ss-panel { aspect-ratio:4/3; }
  .manifesto { padding:64px 0 90px; }
  .manifesto-title { font-size:clamp(2.65rem,14vw,4.25rem); }
  .manifesto-kicker { letter-spacing:.12em; }
  .trust-row { grid-template-columns:1fr; }
  .trust-row > div, .trust-row > div + div { padding:20px 0; border-right:0; border-bottom:1px solid rgba(255,255,255,.14); }
  .trust-row > div:last-child { border-bottom:0; }
}

/* Phone-first refinements */
@media (max-width:960px){
  .site-header { padding-top:calc(12px + env(safe-area-inset-top)); }
  .header-inner {
    width:auto; height:60px; gap:12px;
    margin-left:max(12px,env(safe-area-inset-left));
    margin-right:max(12px,env(safe-area-inset-right));
    padding:0 6px 0 18px;
  }
  .header-actions { gap:8px; }
  .lang-btn { min-width:44px; min-height:44px; justify-content:center; }
}

.option-wheel--compact {
  width:100%; height:auto; overflow:visible; padding:4px;
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px;
  -webkit-mask-image:none; mask-image:none; touch-action:pan-y; cursor:default;
}
.option-wheel--compact .option-wheel__item {
  position:static; min-width:0; min-height:48px; padding:10px 8px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.28); border-radius:12px;
  color:rgba(255,255,255,.76); font-size:1rem; font-weight:700;
  line-height:1; letter-spacing:.04em; text-align:center;
  transform:none !important; filter:none !important; opacity:1 !important;
  white-space:normal; transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.option-wheel--compact .option-wheel__item--selected {
  background:#fff; border-color:#fff; color:var(--ink);
}

@media (max-width:760px){
  .container { padding-right:max(20px,env(safe-area-inset-right)); padding-left:max(20px,env(safe-area-inset-left)); }
  .hero { min-height:100svh; }
  .hero-media img, .hero-media video { object-position:58% center; animation:none; transform:scale(1.02); }
  .hero-media .hero-video { display:none; }
  .hero-media .hero-mobile-poster { display:block; }
  .hero-overlay { background:linear-gradient(to bottom,rgba(0,0,0,.58),rgba(0,0,0,.28) 30%,rgba(0,0,0,.5) 62%,rgba(0,0,0,.82)); }
  .hero-inner { padding:calc(112px + env(safe-area-inset-top)) 0 54px; }
  .hero-eyebrow { margin-bottom:14px; font-size:.72rem; letter-spacing:.25em; }
  .hero-title { font-size:clamp(1.95rem,9.5vw,2.5rem); line-height:1.08; letter-spacing:-.045em; }
  .hero-title .line { overflow:visible; }
  .hero-sub { margin-top:14px; font-size:.82rem; letter-spacing:.17em; }

  .booking-wrap { margin-top:30px; gap:12px; }
  .booking-tabs { width:100%; padding:4px; }
  .booking-tab { flex:1; min-height:46px; padding:10px 12px; font-size:.9rem; }
  .booking-bar { padding:10px; border-radius:22px; }
  .booking-panel.active { display:grid; grid-template-columns:minmax(0,1fr); align-items:stretch; gap:10px; }
  .bfield, .bfield-sm {
    width:100%; min-width:0; flex:none; padding:9px 14px 10px; gap:2px;
    background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.1); border-radius:13px;
  }
  .bfield label { font-size:.75rem; }
  .bfield input, .bfield select, .dt-trigger { min-height:44px; padding:4px 0 6px; font-size:16px; }
  .booking-submit { width:100%; min-height:52px; margin:0; align-self:stretch; justify-self:stretch; font-size:.95rem; }
  .booking-details { margin-top:12px; padding:16px 0 0; }
  .booking-details-heading { margin-right:4px; margin-left:4px; }
  .booking-details-heading > div > p:last-child { font-size:.75rem; }
  .booking-details-grid { grid-template-columns:minmax(0,1fr); }
  .booking-count-field, .child-seat-group, .booking-submit-shared { grid-column:auto; }
  .booking-count-field { width:100%; padding:9px 14px 10px; }
  .child-seat-group { padding:10px 13px 12px; }
  .child-seat-option select { min-height:44px; font-size:16px; }
  .booking-area-note { margin-top:0; padding:0 4px; font-size:.875rem; line-height:1.55; }
  .ac-clear { right:3px; bottom:5px; width:44px; height:44px; }
  .ac-panel { left:0; right:0; top:calc(100% + 8px); border-radius:14px; }
  .ac-panel.panel-up { bottom:calc(100% + 8px); }
  .ac-list { max-height:min(300px,48dvh); }
  .ac-item { min-height:52px; padding:12px; }

  .is-static .ss-stage { padding:0 16px; }
  .is-static .ss-head { padding:72px 4px 24px; }
  .is-static .ss-panel { aspect-ratio:4/3; margin-top:14px; }
  .is-static .ss-text-panel { padding:20px 20px 24px; }
  .is-static .ss-text-panel h3 { font-size:1.35rem; }
  .is-static .ss-text-panel p { margin-top:8px; font-size:.95rem; line-height:1.6; }

  .fleet { padding-bottom:24px; }
  .fleet-side-title { padding:68px 20px 0; }
  .fleet-item { padding:58px 16px 62px; }
  .fleet-stage { min-height:190px; }
  .fleet-car { max-height:180px; max-width:96%; }
  .ghost { font-size:clamp(3.5rem,20vw,6rem); }
  .fleet-info { margin-top:20px; }
  .fleet-info h3 { font-size:1.65rem; }
  .fleet-specs { flex-wrap:wrap; gap:8px 12px; margin:14px 0 22px; }
  .fleet-specs .dot { display:none; }

  .areas { min-height:auto; padding:76px 0 64px; }
  .areas-video { display:none; }
  .areas::after { background:linear-gradient(to bottom,rgba(12,11,10,.68),rgba(12,11,10,.78)); }
  .areas-wheel-row { display:block; }
  .areas-wheel-detail { margin-top:18px; min-height:48px; }
  .areas-wheel-name { font-size:1rem; line-height:1.5; }

  .review-grid { grid-template-columns:1fr; gap:16px; margin-top:34px; }
  .review-card { min-height:0; padding:24px; }
  .review-card blockquote { margin:26px 0 28px; font-size:1.22rem; }
  .contact-method { min-height:58px; padding:14px 2px; }
  .fab-sms {
    right:max(18px,env(safe-area-inset-right));
    bottom:max(18px,calc(env(safe-area-inset-bottom) + 12px));
    width:52px; height:52px;
  }
  .site-footer { padding-bottom:env(safe-area-inset-bottom); }
  .footer-col a { min-height:44px; display:flex; align-items:center; }
  .footer-col a.btn-light { display:inline-flex; }
  .footer-bottom { padding:24px 20px; }
}

@media (max-width:560px){
  .lang-select { display:none; }
  .header-inner { width:auto; }
  .logo-mark { font-size:1.5rem; }
  .logo-text { font-size:.68rem; letter-spacing:.18em; }
  .section { padding:76px 0; }
  .section-title { font-size:clamp(2rem,11vw,2.8rem); }
  .section-lead { font-size:1rem; }
  .manifesto-copy { padding-top:48px; gap:34px; }
  .manifesto-title { font-size:clamp(2.1rem,10vw,2.65rem); line-height:1.02; }
  .mobile-nav { padding:16px 22px 24px; }
  .option-wheel--compact { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (max-width:430px){
  .child-seat-grid { grid-template-columns:minmax(0,1fr); gap:6px; }
  .child-seat-option { min-height:44px; }
  .child-seat-option small { display:inline; margin:0 0 0 4px; }
}

@media (max-width:360px){
  .logo-text { display:none; }
  .hero-inner { padding-top:calc(104px + env(safe-area-inset-top)); }
  .hero-title { font-size:1.9rem; }
  .hero-sub { font-size:.75rem; letter-spacing:.13em; }
  .booking-wrap { margin-top:24px; }
  .bfield, .bfield-sm { padding-right:11px; padding-left:11px; }
  .option-wheel--compact { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .cm-label { flex-basis:64px; }
}

@media (max-height:500px) and (max-width:960px){
  .container { padding-right:max(20px,env(safe-area-inset-right)); padding-left:max(20px,env(safe-area-inset-left)); }
  .hero-inner { padding-top:92px; padding-bottom:36px; }
  .hero-content { text-align:left; }
  .hero-eyebrow { margin-bottom:8px; }
  .hero-title { max-width:620px; font-size:clamp(2rem,6vw,3rem); }
  .hero-sub { margin-top:8px; }
  .booking-wrap { margin-top:20px; }
  .booking-tab { min-height:44px; }
  .booking-panel.active { display:grid; grid-template-columns:minmax(0,1fr); align-items:stretch; gap:10px; }
  .bfield, .bfield-sm { width:100%; min-width:0; flex:none; }
  .bfield input, .bfield select, .dt-trigger { min-height:44px; font-size:16px; }
  .booking-submit { width:100%; min-height:52px; margin:0; align-self:stretch; justify-self:stretch; }
  .mobile-drawer.open { max-height:calc(100dvh - 90px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
  .mobile-nav { padding:6px 18px; gap:0; }
  .mobile-nav a { min-height:44px; padding:4px 0; }
  .mobile-nav a.btn { min-height:44px; margin-top:4px; }
  .fleet-item { padding-top:48px; padding-bottom:48px; }
  .manifesto-copy { padding:48px 0 56px; gap:28px; }
  .manifesto-title { max-width:100%; font-size:clamp(2rem,6vw,3.5rem); line-height:1; letter-spacing:-.05em; }
}

/* Coarse pointers identify touch-first devices even when a wide landscape
   viewport would otherwise fall back to the two-column tablet form. */
@media (pointer:coarse) and (max-width:1024px){
  .booking-panel.active { display:grid; grid-template-columns:minmax(0,1fr); align-items:stretch; gap:10px; }
  .bfield, .bfield-sm {
    width:100%; min-width:0; flex:none; padding:9px 14px 10px; gap:2px;
    background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.1); border-radius:13px;
  }
  .bfield input, .bfield select, .dt-trigger { min-height:44px; padding:4px 0 6px; font-size:16px; }
  .booking-submit { width:100%; min-height:52px; margin:0; align-self:stretch; justify-self:stretch; }
}

@media (hover:none), (pointer:coarse), (prefers-reduced-motion:reduce){
  .hero-media .hero-video, .areas-video { display:none; }
  .hero-media .hero-mobile-poster { display:block; animation:none; transform:scale(1.02); }
}

@media (hover:none){
  .btn:hover, .btn-pill:hover, .btn-light:hover, .socials a:hover, .contact-method:hover { transform:none; box-shadow:none; }
  .contact-method:hover { padding-left:2px; }
}