/* ============================================================
   Comfort Luxury Rides - global stylesheet
   Dark-first, photography-led, gold hairlines, Cormorant + Inter.
   Architecture ported from MBC SRL/assets/css/styles.css and re-tokened.
   Order: fonts, tokens, reset, type, layout, buttons, header, hero, trust,
   cards, split, fleet, steps, airports, areas, quotes, faq, cta, form, footer,
   call bar, fab, back-to-top, gallery + lightbox, tables, prose, reveal,
   a11y, responsive.
   ============================================================ */

/* ---------- Fonts (self-hosted, zero third-party requests) ---------- */
@font-face {
  font-family: "Cormorant Garamond";
  src: url("/assets/fonts/cormorant-var.woff2") format("woff2");
  font-weight: 300 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Cormorant Garamond";
  src: url("/assets/fonts/cormorant-var-italic.woff2") format("woff2");
  font-weight: 300 700; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("/assets/fonts/inter-var.woff2") format("woff2");
  font-weight: 100 900; font-style: normal; font-display: swap;
}
/* metric-matched fallbacks so the swap does not shift layout */
@font-face {
  font-family: "Cormorant Fallback";
  src: local("Georgia"), local("Times New Roman");
  size-adjust: 106%; ascent-override: 90%; descent-override: 26%; line-gap-override: 0%;
}
@font-face {
  font-family: "Inter Fallback";
  src: local("Arial"), local("Helvetica");
  size-adjust: 107%; ascent-override: 90%; descent-override: 22%; line-gap-override: 0%;
}

/* ---------- Design tokens ---------- */
:root {
  --bg:            #0B0B0D;
  --surface:       #16161A;
  --surface-2:     #1E1E24;
  --gold:          #C9A15A;   /* 8.17:1 on --bg */
  --gold-deep:     #B8923F;   /* button hover, 6.76:1 on --bg */
  --gold-text-l:   #7D5F1D;   /* gold text on paper, 5.24:1 */
  --gold-line-l:   #9A7A38;   /* hairlines on paper, 3.54:1 */
  --text:          #EDE8DF;   /* 16.1:1 on --bg */
  --text-muted:    #B5B0A6;   /* 9.1:1 on --bg */
  --paper:         #F4F0E8;
  --paper-2:       #ECE6DA;
  --ink:           #15151A;   /* 16:1 on paper */
  --ink-muted:     #5B5850;   /* 6.25:1 on paper */
  --line-dark:     rgba(201, 161, 90, .28);
  --line-dark-2:   rgba(237, 232, 223, .12);
  --line-paper:    #D9D2C3;
  --sunset:        #D96C3D;
  --wa:            #25D366;
  --wa-deep:       #1FBF5B;
  --wa-ink:        #062A12;
  --err:           #9A2A1D;
  --err-line:      #B23A2B;
  --focus:         #E8C57A;
  --gold-a05:      rgba(201, 161, 90, .05);
  --gold-a10:      rgba(201, 161, 90, .10);
  --gold-a50:      rgba(201, 161, 90, .50);

  --serif: "Cormorant Garamond", "Cormorant Fallback", Georgia, serif;
  --sans:  "Inter", "Inter Fallback", system-ui, "Segoe UI", Arial, sans-serif;

  --fs-h1:     clamp(2.5rem, 1.2rem + 5vw, 5rem);
  --fs-h2:     clamp(2.1rem, 1rem + 3.6vw, 3.6rem);
  --fs-h3:     clamp(1.15rem, 1rem + .6vw, 1.35rem);
  --fs-lead:   clamp(1.08rem, 1rem + .45vw, 1.28rem);
  --fs-body:   clamp(1rem, .3vw + .96rem, 1.0625rem);
  --fs-small:  .875rem;
  --fs-body-s: .95rem;    /* body copy inside cards, features, steps */
  --fs-caption:.82rem;    /* captions, notes, chips, table notes */
  --fs-eyebrow:.72rem;
  --fs-stat:   clamp(2.1rem, 1rem + 1.9vw, 2.7rem);   /* the gauge numerals */
  --track-label:   .2em;
  --track-eyebrow: .26em;

  --container: 1240px;
  --narrow:    820px;
  --gutter:    clamp(1.15rem, 4vw, 3rem);
  --section-y: clamp(3rem, 8vw, 7.5rem);
  --header-h:  72px;
  --callbar-h: 78px;
  --radius-xs: 5px;
  --radius-s:  4px;
  --radius:    10px;
  --shadow:    0 18px 50px -28px rgba(21, 21, 26, .35);
  --shadow-sm: 0 10px 30px -20px rgba(21, 21, 26, .40);
  --ease:      cubic-bezier(.22, .61, .36, 1);
  --dur:       .3s;
  --dur-slow:  .7s;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 1rem);
  background: var(--bg);
}
/* No scrollbar-gutter: reserving it leaves a strip of page background down the right edge on
   every device with overlay scrollbars (all phones, and Macs). The layout shift it used to
   prevent when the scroll is locked is handled in main.js, which pads by the measured width. */
#main { scroll-margin-top: calc(var(--header-h) + 1rem); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  font-family: var(--sans);
  font-size: var(--fs-body);
  line-height: 1.65;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-synthesis: none;
  overflow-x: hidden;
}
img, svg, video { display: block; max-width: 100%; }
[hidden] { display: none !important; } /* the reset above would otherwise out-rank the UA rule on hidden sprites */
picture { display: contents; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
ul, ol { list-style: none; padding: 0; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-radius: 3px; }
.on-paper :focus-visible, .section--paper :focus-visible { outline-color: var(--gold-text-l); }
::selection { background: var(--gold); color: var(--bg); }

/* ---------- Typography ---------- */
h1, h2, .display { font-family: var(--serif); font-weight: 600; line-height: 1.04; letter-spacing: -.012em; color: #fff; }
h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); line-height: 1.08; }
h3 { font-family: var(--sans); font-weight: 600; font-size: var(--fs-h3); line-height: 1.25; color: #fff; }
h4 { font-family: var(--sans); font-weight: 600; font-size: 1rem; color: #fff; }
p { max-width: 66ch; }
.lead { font-size: var(--fs-lead); color: var(--text-muted); line-height: 1.55; }
.small { font-size: var(--fs-small); }
.muted { color: var(--text-muted); }
.eyebrow {
  display: block;
  font-size: var(--fs-eyebrow); font-weight: 600; letter-spacing: var(--track-eyebrow); text-transform: uppercase;
  color: var(--gold); margin-bottom: .9rem;
}
strong { font-weight: 600; }
em { font-family: var(--serif); font-style: italic; font-size: 1.08em; }
.serif { font-family: var(--serif); }
.num { font-family: var(--serif); font-weight: 600; font-variant-numeric: lining-nums; }

/* ---------- Layout ---------- */
.container { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }
.container--narrow { max-width: var(--narrow); }
.section { padding-block: var(--section-y); position: relative; }
/* skip layout/paint of below-fold sections until near (not the hero, not the footer) */
.section:not(.hero), .cta-band { content-visibility: auto; contain-intrinsic-size: auto 700px; }
.section--paper { background: var(--paper); color: var(--ink); }
.section--paper h1, .section--paper h2, .section--paper h3, .section--paper h4 { color: var(--ink); }
.section--paper .lead, .section--paper .muted { color: var(--ink-muted); }
.section--paper .eyebrow { color: var(--gold-text-l); }
.section--paper-2 { background: var(--paper-2); }
.section--surface { background: var(--surface); }
.section-head { max-width: 760px; margin-bottom: clamp(2.4rem, 5vw, 4rem); }
.section-head.center { margin-inline: auto; text-align: center; }
.section-head .lead { margin-top: 1rem; }
.stack > * + * { margin-top: 1rem; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.5rem, 4vw, 3.5rem); }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.4rem, 3vw, 2.4rem); }
/* grid children default to min-width:auto, so a scrollable table inside one would widen the column past the viewport */
.grid-2 > *, .grid-3 > *, .split > *, .fleet-card > *, .hero__grid > *, .cards > * { min-width: 0; }
.rule { border: 0; border-top: 1px solid var(--line-dark); margin: 0; }
.section--paper .rule { border-top-color: var(--line-paper); }
.center { text-align: center; }
.grid-2--top { align-items: start; }
/* one spacing scale, so pages stop inventing their own margins */
.mt-1 { margin-top: .6rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.4rem; }
.mt-4 { margin-top: 1.8rem; }
.mt-5 { margin-top: clamp(2.2rem, 5vw, 3.4rem); }
.note { font-size: var(--fs-body-s); }
.section--pt-0 { padding-top: 0; }
.section--pt-sm { padding-top: clamp(2.2rem, 5vw, 3.4rem); }
.section--pb-sm { padding-bottom: clamp(2.2rem, 5vw, 3.4rem); }
/* a lane marking where two bands of the same tint meet */
.section--lane::before {
  content: ""; position: absolute; top: 0; left: var(--gutter); right: var(--gutter); height: 1px;
  background: repeating-linear-gradient(90deg, var(--line-dark) 0 26px, transparent 26px 46px);
}
.section--paper.section--lane::before {
  background: repeating-linear-gradient(90deg, var(--gold-line-l) 0 26px, transparent 26px 46px); opacity: .5;
}
/* running text links, so pages stop colouring them inline */
.section--paper p a:not(.btn):not(.link-arrow) { color: var(--gold-text-l); text-decoration: underline; text-underline-offset: 2px; }
.section:not(.section--paper) p a:not(.btn):not(.link-arrow) { color: var(--gold); }

/* ---------- Chips (the only pill on the site) ---------- */
.chip {
  display: inline-flex; align-items: center; gap: .45em; white-space: nowrap;
  padding: .4em .85em; border: 1px solid var(--line-dark); border-radius: 999px;
  font-size: var(--fs-caption); font-weight: 600; letter-spacing: .06em;
  color: var(--gold); background: var(--gold-a05);
}
.chip svg { width: 1.05em; height: 1.05em; flex: none; }
.chip-row { display: flex; flex-wrap: wrap; gap: .55rem; }
.section--paper .chip { border-color: var(--gold-line-l); color: var(--gold-text-l); background: rgba(154, 122, 56, .07); }

/* ---------- Feature cell: the site's most repeated block, finally a component ---------- */
.feature { padding-top: 1.05rem; border-top: 1px solid var(--line-dark); }
.feature h3 { font-size: var(--fs-h3); }
.feature h3 a { color: var(--gold); }
.section--paper .feature h3 a { color: var(--gold-text-l); }
.feature p { margin-top: .55rem; font-size: var(--fs-body-s); color: var(--text-muted); }
.feature__code {
  display: block; margin-bottom: .5rem; font-family: var(--serif); font-weight: 600;
  font-size: var(--fs-stat); line-height: 1; letter-spacing: .02em; color: var(--gold);
  font-variant-numeric: lining-nums tabular-nums;
}
.section--paper .feature { border-top-color: var(--gold-line-l); }
.section--paper .feature p { color: var(--ink-muted); }
.section--paper .feature__code { color: var(--gold-text-l); }

/* ---------- Choice card (two ways to book) ---------- */
.choice-card { border: 1px solid var(--line-dark); border-radius: var(--radius); padding: clamp(1.4rem, 3vw, 2.2rem); background: var(--surface); }
.choice-card h3 { font-family: var(--serif); font-weight: 600; font-size: clamp(1.5rem, 2.4vw, 1.9rem); line-height: 1.1; letter-spacing: -.012em; margin: .8rem 0 .8rem; color: #fff; }
.choice-card .ticks { margin-top: 1.2rem; }

/* ---------- Review panel (stands in until the client sends real reviews) ---------- */
.review-panel {
  position: relative; border: 1px solid var(--gold-line-l); border-radius: var(--radius); background: #fff;
  box-shadow: var(--shadow-sm); padding: clamp(1.6rem, 4vw, 2.6rem); display: grid; gap: 1.2rem; justify-items: start;
}
.review-panel::before {
  content: "\201C"; font-family: var(--serif); font-weight: 600; font-size: 4.5rem; line-height: .7;
  color: var(--gold-line-l); opacity: .55;
}
.review-panel p { font-family: var(--serif); font-style: italic; font-weight: 500; font-size: clamp(1.25rem, 2vw, 1.6rem); line-height: 1.35; color: var(--ink); max-width: 46ch; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .6em;
  font-family: var(--sans); font-weight: 600; font-size: .82rem; letter-spacing: .12em; text-transform: uppercase;
  padding: 1em 1.8em; min-height: 48px; border-radius: 999px;
  border: 1.5px solid transparent; white-space: nowrap;
  transition: transform .25s var(--ease), background .25s, color .25s, border-color .25s;
}
.btn:hover { text-decoration: none; transform: translateY(-2px); }
.btn:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
/* the gold ring is invisible on a gold button, so those two invert it */
.btn--primary:focus-visible, .btn--wa:focus-visible { outline-color: var(--ink); }
.btn:active { transform: translateY(0) scale(.985); }
.btn svg { width: 1.1em; height: 1.1em; flex: none; }
.btn--primary { background: var(--gold); color: var(--bg); border-color: var(--gold); }
.btn--primary:hover { background: var(--gold-deep); border-color: var(--gold-deep); color: var(--bg); }
.btn--ghost { border-color: var(--gold); color: var(--gold); }
.btn--ghost:hover { background: rgba(201, 161, 90, .1); color: var(--gold); }
.btn--ink { border-color: var(--ink); color: var(--ink); }
.btn--ink:hover { background: var(--ink); color: var(--paper); }
.btn--wa { background: var(--wa); color: var(--wa-ink); border-color: var(--wa); }
.btn--wa:hover { background: var(--wa-deep); border-color: var(--wa-deep); color: var(--wa-ink); }
.btn--sm { padding: .7em 1.2em; min-height: 40px; font-size: .76rem; }
.btn-row { display: flex; flex-wrap: wrap; gap: .9rem; align-items: center; }
.link-arrow { font-weight: 600; display: inline-flex; align-items: center; gap: .45em; color: var(--gold); }
.link-arrow svg { width: 1.1em; height: 1.1em; flex: none; transition: transform .25s var(--ease); }
.link-arrow:hover { text-decoration: none; }
.link-arrow:hover svg, .card:hover .link-arrow svg, .card:focus-visible .link-arrow svg { transform: translateX(4px); }
.section--paper .link-arrow { color: var(--gold-text-l); }
.phone-link { display: inline-flex; align-items: center; gap: .5em; font-weight: 600; color: var(--text); white-space: nowrap; }
.phone-link svg { width: 1.05em; height: 1.05em; color: var(--gold); }
.section--paper .phone-link { color: var(--ink); }
.section--paper .phone-link svg { color: var(--gold-text-l); }

/* ---------- Header ---------- */
.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 100;
  height: var(--header-h); display: flex; align-items: center;
  color: var(--text);
}
/* frosted background on a pseudo-element, never on the header itself (see MBC note:
   backdrop-filter would make the header the containing block of the fixed mobile menu) */
.site-header::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(11, 11, 13, .82), rgba(11, 11, 13, 0));
  transition: background .35s var(--ease), box-shadow .35s;
}
.site-header.is-solid::before {
  background: rgba(11, 11, 13, .86);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 var(--line-dark-2);
}
.site-header .container { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.logo { display: inline-flex; align-items: center; gap: .75rem; color: #fff; }
.logo:hover { text-decoration: none; }
.logo img { width: 44px; height: 44px; flex: none; }
.logo-word { font-family: var(--serif); font-weight: 600; font-size: 1.22rem; letter-spacing: .06em; text-transform: uppercase; line-height: 1.05; white-space: nowrap; }
.logo-word small { display: block; font-family: var(--sans); font-weight: 500; font-size: .62rem; letter-spacing: .22em; color: var(--gold); margin-top: .25rem; }
.nav { display: flex; align-items: center; gap: 2rem; }
.nav-menu { display: flex; align-items: center; gap: 1.6rem; }
.nav-menu a { font-size: .92rem; font-weight: 500; color: var(--text); position: relative; padding: .3rem 0; }
.nav-menu a::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 0; height: 1.5px; background: var(--gold); transition: width .28s var(--ease); }
.nav-menu a:hover, .nav-menu a[aria-current="page"] { color: #fff; text-decoration: none; }
.nav-menu a:hover::after, .nav-menu a:focus-visible::after, .nav-menu a[aria-current="page"]::after { width: 100%; }
.nav-menu .nav-only-mobile { display: none; }
.nav-side { display: flex; align-items: center; gap: 1.1rem; }
.nav-side .phone-link { font-size: .92rem; }
.nav-toggle { display: none; width: 46px; height: 46px; border-radius: 8px; position: relative; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after {
  content: ""; position: absolute; left: 11px; width: 24px; height: 2px; background: var(--gold); border-radius: 2px;
  transition: transform .3s var(--ease), opacity .2s;
}
.nav-toggle span { top: 22px; } .nav-toggle span::before { top: -7px; } .nav-toggle span::after { top: 7px; }
.nav-toggle:active { transform: scale(.94); }
body.nav-open .nav-toggle span { background: transparent; }
body.nav-open .nav-toggle span::before { transform: translateY(7px) rotate(45deg); }
body.nav-open .nav-toggle span::after { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Hero ---------- */
.hero { position: relative; padding-top: calc(var(--header-h) + clamp(1.5rem, 4vw, 3rem)); padding-bottom: clamp(3rem, 7vw, 5.5rem); isolation: isolate; overflow: hidden; }
/* headlight: one soft gold wash behind the hero, the same gradient the CTA band uses */
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(56% 60% at 74% 6%, var(--gold-a10), transparent 68%);
}
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.hero__copy { max-width: 640px; }
.hero__title { margin-bottom: 1.2rem; text-wrap: balance; letter-spacing: -.02em; }
.hero__sub { font-size: var(--fs-lead); color: var(--text-muted); max-width: 54ch; line-height: 1.55; }
.hero__btns { margin-top: 2rem; }
.hero__note { margin-top: 1.6rem; display: flex; flex-wrap: wrap; gap: .55rem; }
.hero__note span {
  display: inline-flex; align-items: center; gap: .45em; white-space: nowrap;
  padding: .4em .85em; border: 1px solid var(--line-dark); border-radius: 999px;
  font-size: var(--fs-caption); font-weight: 600; letter-spacing: .06em; color: var(--gold); background: var(--gold-a05);
}
.hero__note svg { width: 1em; height: 1em; flex: none; color: var(--gold); }
/* Photos are shown whole: natural aspect, never cropped. The frame is an offset hairline behind the image. */
.hero__media { position: relative; justify-self: end; width: 100%; max-width: 600px; margin: 0; }
/* Photos are mounted like a print: a small mat, a hairline and a soft shadow. No corner marks:
   they read as an image placeholder rather than a frame. */
.hero__media, .split__media--frame, .split__media--wide {
  padding: 8px; background: var(--surface); border: 1px solid var(--line-dark-2);
  border-radius: 14px; box-shadow: 0 30px 60px -34px rgba(0, 0, 0, .85);
}
.section--paper .split__media--frame, .section--paper .split__media--wide {
  background: #fff; border-color: var(--line-paper); box-shadow: var(--shadow-sm);
}
.hero__media > picture > img, .hero__media > img { width: 100%; height: auto; border-radius: 7px; display: block; }
.hero__media figcaption { position: absolute; left: 1.4rem; bottom: 1.4rem; font-size: .7rem; letter-spacing: .16em; text-transform: uppercase; color: var(--text);
  background: rgba(11, 11, 13, .62); padding: .35rem .65rem; border-radius: 4px; backdrop-filter: blur(4px); }
/* inset second photo on the home hero, overlapping the main one bottom-left */
.hero__media--stack { margin-bottom: 2.5rem; }
.hero__media--stack figcaption { left: auto; right: 1.4rem; }
.hero__inset { display: block; position: absolute; left: -13%; bottom: -11%; width: 42%; padding: 6px; background: var(--bg); border: 1px solid var(--line-dark); border-radius: 8px; box-shadow: 0 28px 60px -24px rgba(0, 0, 0, .85); z-index: 2; }
.hero__inset img { width: 100%; height: auto; border-radius: 4px; display: block; }
.hero--short { padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.hero--short .hero__media { max-width: 440px; }
.hero--short .hero__title { font-size: clamp(2.3rem, 1rem + 3.4vw, 3.8rem); }
.hero--bare { padding-bottom: clamp(1.5rem, 4vw, 3rem); }
.hero--bare .hero__grid { grid-template-columns: 1fr; }
.hero--404 { min-height: 60vh; }
.breadcrumb { display: flex; flex-wrap: wrap; gap: .35rem .6rem; font-size: var(--fs-small); color: var(--text-muted); margin-bottom: 1.4rem; }
.breadcrumb li + li::before { content: "/"; margin-right: .6rem; color: var(--line-dark); }
.breadcrumb a:hover { color: var(--gold); }

/* ---------- Trust strip ---------- */
.trust { border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); }
.trust ul { display: grid; grid-template-columns: repeat(4, 1fr); }
.trust li { display: flex; align-items: center; gap: .9rem; padding: 1.3rem 1.2rem; font-size: .92rem; font-weight: 500; color: var(--text); border-left: 1px solid var(--line-dark-2); }
.trust li:first-child { border-left: 0; padding-left: 0; }
.trust svg { width: 26px; height: 26px; flex: none; color: var(--gold); }
.trust b { display: block; font-weight: 600; color: #fff; }
.trust span { display: block; font-size: .8rem; color: var(--text-muted); }

/* ---------- Cards ---------- */
.cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1rem, 2vw, 1.6rem); }
.cards--3 { grid-template-columns: repeat(3, 1fr); }
.card { background: var(--surface); border: 1px solid var(--line-dark-2); border-radius: var(--radius); overflow: hidden; display: flex; flex-direction: column;
  transition: transform .35s var(--ease), border-color .35s; color: var(--text); }
.card:hover { transform: translateY(-5px); border-color: var(--line-dark); text-decoration: none; }
.card__media { aspect-ratio: 4 / 5; overflow: hidden; background: var(--surface-2); }
.card__media img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); transition: transform var(--dur-slow) var(--ease); }
.card:hover .card__media img, .card:focus-visible .card__media img { transform: scale(1.05); }
.card:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; border-color: var(--line-dark); }
.card:active { transform: translateY(-2px); }
.card__body { padding: 1.35rem 1.4rem 1.5rem; display: flex; flex-direction: column; gap: .55rem; flex: 1; }
.card__body h3 { font-size: 1.15rem; }
.card__body p { font-size: var(--fs-body-s); color: var(--text-muted); }
.card__body .link-arrow { margin-top: auto; padding-top: .6rem; font-size: .9rem; }
.section--paper .card { background: #fff; border-color: var(--line-paper); color: var(--ink); box-shadow: var(--shadow); }
.section--paper .card__body p { color: var(--ink-muted); }

/* ---------- Split (image + copy) ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.8rem, 5vw, 4.5rem); align-items: center; }
.split + .split { margin-top: clamp(3rem, 6vw, 5.5rem); }
.split__media { position: relative; width: 100%; max-width: 520px; justify-self: center; }
.split__media img { width: 100%; height: auto; border-radius: 7px; display: block; }
.split--rev .split__media { order: 2; }
.split__body h2 { margin-bottom: 1rem; }
.split__body .lead { margin-bottom: 1rem; }
.ticks { display: grid; gap: .7rem; margin-top: 1.3rem; }
.ticks li { position: relative; padding-left: 1.9rem; }
.ticks li::before {
  content: ""; position: absolute; left: 0; top: .42em; width: 1.05rem; height: 1.05rem; background: var(--gold);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.section--paper .ticks li::before { background: var(--gold-text-l); }

/* ---------- Fleet card ---------- */
.fleet-card { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: center;
  background: var(--surface); border: 1px solid var(--line-dark-2); border-radius: var(--radius); padding: clamp(1.2rem, 3vw, 2.4rem); }
.fleet-card__media img { width: 100%; height: auto; border-radius: var(--radius-s); display: block; }
.fleet-card__tag { font-size: var(--fs-eyebrow); letter-spacing: .2em; text-transform: uppercase; color: var(--gold); font-weight: 600; }
.fleet-card h3, .fleet-card__title { font-family: var(--serif); font-weight: 600; font-size: clamp(1.6rem, 2.6vw, 2.2rem); line-height: 1.1; margin: .4rem 0 .8rem; letter-spacing: -.012em; }
.specs { display: grid; grid-template-columns: repeat(2, 1fr); gap: .9rem 1.4rem; margin: 1.2rem 0 1.4rem; }
.specs li { display: flex; align-items: flex-start; gap: .75rem; font-size: .95rem; }
.specs svg { width: 22px; height: 22px; flex: none; color: var(--gold); margin-top: .1em; }
.specs b { display: block; font-weight: 600; color: #fff; }
.specs span { color: var(--text-muted); font-size: var(--fs-caption); }
.section--paper .fleet-card { background: #fff; border-color: var(--line-paper); box-shadow: var(--shadow-sm); }
.section--paper .fleet-card__tag { color: var(--gold-text-l); }
.section--paper .specs b { color: var(--ink); }
.section--paper .specs span { color: var(--ink-muted); }
.section--paper .specs svg { color: var(--gold-text-l); }

/* ---------- Steps ---------- */
/* The route: one rail across the steps with a stop at each one. */
.steps, .next-steps { --rail: var(--line-dark); --rail-dot: var(--gold); --rail-bg: var(--bg); }
.section--paper .steps, .section--paper .next-steps { --rail: var(--gold-line-l); --rail-dot: var(--gold-text-l); --rail-bg: var(--paper); }
.section--paper-2 .steps, .section--paper-2 .next-steps { --rail-bg: var(--paper-2); }
.steps { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.4rem, 3vw, 2.6rem); counter-reset: step; }
.steps::before, .next-steps::before {
  content: ""; position: absolute; left: 5px; right: 0; top: 5px; height: 1px;
  background: linear-gradient(90deg, var(--rail) 0%, var(--rail) 76%, transparent 100%);
}
.step, .next-steps li { position: relative; padding-top: 2.1rem; border-top: 0; }
.step::before, .next-steps li::before {
  content: ""; position: absolute; top: 0; left: 0; width: 11px; height: 11px; border-radius: 999px;
  background: var(--rail-dot); box-shadow: 0 0 0 4px var(--rail-bg);
}
.step b { counter-increment: step; font-family: var(--serif); font-weight: 600; font-size: var(--fs-stat); line-height: 1; color: var(--gold); display: block; font-variant-numeric: lining-nums tabular-nums; }
.step b::before { content: "0" counter(step); }
.step h3 { margin: .7rem 0 .45rem; font-size: 1.15rem; }
.step p { font-size: var(--fs-body-s); color: var(--text-muted); }
.section--paper .step b { color: var(--gold-text-l); }
.section--paper .step p { color: var(--ink-muted); }
/* Icon variant: the marker on the rail becomes the thing that happens at that stop. */
.steps--icons::before { top: 23px; left: 23px; }
.steps--icons .step { padding-top: 3.9rem; }
.steps--icons .step::before {
  width: 46px; height: 46px; top: 0; left: 0; background: var(--surface);
  border: 1px solid var(--line-dark); box-shadow: 0 0 0 6px var(--rail-bg);
}
.section--paper .steps--icons .step::before { background: #fff; border-color: var(--gold-line-l); }
.step__icon { position: absolute; top: 0; left: 0; width: 46px; height: 46px; display: grid; place-items: center; color: var(--gold); z-index: 1; }
.section--paper .step__icon { color: var(--gold-text-l); }
.step__icon svg { width: 20px; height: 20px; }
.steps--icons .step b { font-family: var(--sans); font-size: .74rem; font-weight: 600; letter-spacing: var(--track-label); color: var(--text-muted); }
.section--paper .steps--icons .step b { color: var(--ink-muted); }
.steps--icons .step h3 { margin-top: .5rem; }

/* ---------- Airports: boarding-pass stubs ---------- */
.airports { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.airport {
  position: relative; background: var(--surface); border: 1px solid var(--line-dark-2); border-radius: var(--radius);
  padding: 1.3rem 1.3rem 1.4rem; overflow: hidden;
  transition: border-color var(--dur) var(--ease), transform var(--dur) var(--ease);
}
.airport:hover { border-color: var(--line-dark); transform: translateY(-3px); }
.airport__head { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.airport b { font-family: var(--serif); font-weight: 600; font-size: var(--fs-stat); line-height: 1; color: var(--gold); letter-spacing: .04em; font-variant-numeric: lining-nums tabular-nums; }
/* the perforation: a dashed tear line with a notch punched out of each edge */
.airport__perf { position: relative; border: 0; border-top: 1px dashed var(--line-dark); margin: .95rem -1.3rem 1rem; }
.airport__perf::before, .airport__perf::after {
  content: ""; position: absolute; top: 50%; width: 12px; height: 12px; border-radius: 999px;
  background: var(--bg); transform: translateY(-50%);
}
.airport__perf::before { left: -6px; }
.airport__perf::after { right: -6px; }
.airport h3 { font-size: 1rem; }
.airport p { margin-top: .35rem; font-size: var(--fs-caption); color: var(--text-muted); }

/* ---------- Departure board: one row per airport ---------- */
.board { border-top: 1px solid var(--line-dark); }
.board__row {
  display: grid; grid-template-columns: 6rem minmax(0, 1fr) auto; gap: .6rem 1.6rem; align-items: start;
  padding: 1.4rem 0; border-bottom: 1px solid var(--line-dark-2);
  transition: background var(--dur) var(--ease);
}
.board__row:hover { background: var(--gold-a05); }
.board__code {
  font-family: var(--serif); font-weight: 600; font-size: var(--fs-stat); line-height: .9; color: var(--gold);
  letter-spacing: .04em; font-variant-numeric: tabular-nums;
}
.board__body h3 { font-size: 1.05rem; }
.board__body p { margin-top: .45rem; font-size: var(--fs-body-s); color: var(--text-muted); }
.board__row > .chip { justify-self: end; align-self: center; }
.section--paper .board { border-top-color: var(--gold-line-l); }
.section--paper .board__row { border-bottom-color: var(--line-paper); }
.section--paper .board__code { color: var(--gold-text-l); }
.section--paper .board__body p { color: var(--ink-muted); }

/* ---------- Areas band ---------- */
.areas { position: relative; isolation: isolate; color: #fff; overflow: hidden; }
.areas__media { position: absolute; inset: 0; z-index: -2; }
.areas__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.areas::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(11, 11, 13, .9) 0%, rgba(11, 11, 13, .78) 45%, rgba(11, 11, 13, .92) 100%); }
.areas .container { padding-block: clamp(4rem, 8vw, 6.5rem); }
.areas__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.4rem, 3vw, 2.6rem); margin-top: 2rem; }
.areas__grid h3 { font-family: var(--serif); font-weight: 600; font-size: 1.5rem; color: var(--gold); margin-bottom: .5rem; }
.areas__grid p { font-size: var(--fs-body-s); color: var(--text); }

/* ---------- Quotes (testimonials) ---------- */
.quotes { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.2rem, 2.5vw, 2rem); }
.quote { border-top: 1px solid var(--gold-line-l); padding-top: 1.4rem; }
.quote blockquote { font-family: var(--serif); font-style: italic; font-size: 1.35rem; line-height: 1.35; font-weight: 500; }
.quote blockquote::before { content: "\201C"; color: var(--gold-text-l); margin-right: .1em; }
.quote figcaption { margin-top: 1rem; font-size: var(--fs-small); color: var(--ink-muted); }
.quote figcaption b { color: var(--ink); font-weight: 600; }
.review-links { display: flex; flex-wrap: wrap; gap: .8rem 1.6rem; margin-top: 2rem; }

/* ---------- FAQ ---------- */
.faq { max-width: var(--narrow); }
.faq-item { border-top: 1px solid var(--line-paper); }
.faq-item:last-child { border-bottom: 1px solid var(--line-paper); }
.faq-item summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 1.1rem 0; font-weight: 600; font-size: 1.05rem; color: var(--ink); min-height: 56px;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
  content: ""; flex: none; width: 12px; height: 12px; border-right: 1.5px solid var(--gold-text-l); border-bottom: 1.5px solid var(--gold-text-l);
  transform: rotate(45deg); transition: transform .25s var(--ease); margin-right: .3rem; margin-top: -4px;
}
.faq-item[open] summary::after { transform: rotate(225deg); margin-top: 4px; }
.faq-item summary:hover, .faq-item summary:focus-visible { color: var(--gold-text-l); }
.faq-item summary:active { color: var(--gold-text-l); }
.faq-item > div { padding: 0 0 1.3rem; color: var(--ink-muted); max-width: 62ch; }
.faq-item > div p + p { margin-top: .7rem; }
.section:not(.section--paper) .faq-item { border-color: var(--line-dark-2); }
.section:not(.section--paper) .faq-item summary { color: var(--text); }
.section:not(.section--paper) .faq-item summary::after { border-color: var(--gold); }
.section:not(.section--paper) .faq-item > div { color: var(--text-muted); }

/* ---------- CTA band ---------- */
.cta-band { position: relative; isolation: isolate; }
.cta-band .container { padding-block: clamp(3rem, 7vw, 5.5rem); }
.cta-band__box { border: 1px solid var(--line-dark); border-radius: var(--radius); padding: clamp(2rem, 5vw, 4rem); text-align: center; position: relative; overflow: hidden; background: var(--surface); }
.cta-band__box::before { content: ""; position: absolute; inset: 0; background: radial-gradient(60% 80% at 50% 0%, rgba(201, 161, 90, .12), transparent 70%); pointer-events: none; }
.cta-band h2 { margin-bottom: .8rem; }
.cta-band p { color: var(--text-muted); margin: 0 auto 1.8rem; max-width: 52ch; }
.cta-band .btn-row { justify-content: center; }

/* ---------- Quote form ---------- */
.qf { display: grid; gap: 1.1rem; }
.qf__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
.field { display: grid; gap: .4rem; }
.field label { font-size: .88rem; font-weight: 600; color: var(--ink); }
.field label .opt { font-weight: 400; color: var(--ink-muted); }
.field input, .field select, .field textarea {
  width: 100%; background: #fff; color: var(--ink); border: 1px solid var(--line-paper); border-radius: var(--radius-s);
  padding: .8rem .9rem; min-height: 48px; transition: border-color .2s, box-shadow .2s;
}
.field textarea { min-height: 120px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: 2px solid var(--gold-text-l); outline-offset: 0; border-color: var(--gold-text-l); }
.field select { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%235B5850' stroke-width='2' d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .8rem center; background-size: 18px; padding-right: 2.6rem; }
.field-err { display: none; font-size: var(--fs-caption); color: var(--err); }
.qf.was-validated :invalid { border-color: var(--err-line); }
.qf.was-validated :invalid ~ .field-err, .qf.was-validated [aria-invalid="true"] ~ .field-err { display: block; }
.qf-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.qf__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: .4rem; }
.qf__say { font-size: .9rem; color: var(--ink-muted); min-height: 1.4em; }
.qf__say.is-err { color: var(--err); font-weight: 600; }
.qf__privacy { font-size: .82rem; color: var(--ink-muted); }
.qf__privacy a { text-decoration: underline; text-underline-offset: 2px; }
.qf-done { display: none; border: 1px solid var(--gold-line-l); border-radius: var(--radius); padding: 1.6rem 1.8rem; background: #fff; box-shadow: var(--shadow-sm); }
.qf-done h2 { font-size: 1.6rem; margin-bottom: .5rem; }
.qf-done p { color: var(--ink-muted); }
.qf-done:target, .is-sent .qf-done { display: block; }
.qf-done:target ~ .qf, .is-sent .qf { display: none; }
.contact-card { background: var(--surface); border: 1px solid var(--line-dark-2); border-radius: var(--radius); padding: clamp(1.4rem, 3vw, 2.2rem); color: var(--text); display: grid; gap: 1.3rem; align-content: start; }
.contact-card h2 { font-size: 1.6rem; }
.contact-card h3 { font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); margin-bottom: .35rem; }
.contact-card a { color: #fff; }
.contact-card address { font-style: normal; color: var(--text); }
.contact-card p, .contact-card address { font-size: .98rem; }
.section--paper .contact-card { color: var(--text); }
.section--paper .contact-card h2 { color: #fff; }
.section--paper .contact-card h3 { color: var(--gold); }
.section--paper .contact-card .muted { color: var(--text-muted); }
.section--paper .contact-card .phone-link { color: #fff; }
.section--paper .contact-card .phone-link svg { color: var(--gold); }
.contact-card .btn--wa { color: var(--wa-ink); }
.section--paper .contact-card :focus-visible { outline-color: var(--focus); }
.socials { display: flex; gap: .7rem; }
.socials a { width: 42px; height: 42px; border-radius: 999px; border: 1px solid var(--line-dark-2); display: grid; place-items: center; color: var(--text); }
.socials a:hover, .socials a:focus-visible { background: var(--gold); border-color: var(--gold); color: var(--bg); text-decoration: none; }
.socials a:active { transform: scale(.94); }
.socials svg { width: 18px; height: 18px; }

/* ---------- Contact layout ---------- */
.contact-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(1.8rem, 4vw, 3.5rem); align-items: start; }
.contact-grid > * { min-width: 0; }
.next-steps { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; margin-top: 2rem; }
.next-steps li { font-size: var(--fs-body-s); color: var(--ink-muted); }
.next-steps li b { display: block; color: var(--ink); font-weight: 600; margin-bottom: .2rem; }

/* ---------- Footer ---------- */
.site-footer { border-top: 1px solid var(--line-dark-2); background: var(--bg); color: var(--text-muted); padding-top: clamp(3.5rem, 7vw, 5.5rem); }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.1fr; gap: clamp(1.8rem, 4vw, 3rem); padding-bottom: 3rem; }
.footer-about p { margin-top: 1.1rem; font-size: .95rem; max-width: 40ch; }
.footer-about address { font-style: normal; margin-top: 1rem; font-size: .95rem; line-height: 1.7; }
.footer-about address a { color: var(--text); }
.footer-col h3 { font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); margin-bottom: 1.1rem; }
.footer-col ul { display: grid; gap: .55rem; }
.footer-col a { color: var(--text-muted); font-size: var(--fs-body-s); }
.footer-hours { font-size: var(--fs-body-s); }
.footer-col a:hover { color: #fff; }
.footer-bottom { border-top: 1px solid var(--line-dark-2); padding-block: 1.5rem calc(1.5rem + env(safe-area-inset-bottom, 0px)); display: flex; flex-wrap: wrap; gap: .6rem 1.5rem; justify-content: space-between; align-items: center; font-size: .82rem; }
.footer-bottom a { color: var(--text-muted); }
.footer-bottom a:hover { color: #fff; }
.footer-credit { display: inline-flex; align-items: center; gap: .5rem; }
.footer-credit img { height: 18px; width: auto; opacity: .8; }

/* ---------- Mobile call bar ---------- */
.call-bar { display: none; }

/* ---------- WhatsApp FAB (desktop) ---------- */
.wa-fab {
  position: fixed; right: 1.4rem; bottom: 1.4rem; z-index: 90;
  display: inline-flex; align-items: center; gap: .6rem; height: 54px; padding: 0 1.2rem 0 1rem; border-radius: 999px;
  background: rgba(11, 11, 13, .86); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border: 1px solid var(--line-dark); color: var(--text); font-weight: 600; font-size: .9rem;
  box-shadow: 0 18px 40px -20px rgba(0, 0, 0, .9);
  transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
}
.wa-fab svg { color: var(--wa); }
.wa-fab:hover { text-decoration: none; background: var(--surface); color: #fff; }
.wa-fab:active { transform: scale(.96); }
.wa-fab svg { width: 26px; height: 26px; flex: none; }
.js .wa-fab { opacity: 0; transform: translateY(12px); visibility: hidden; }
.js .wa-fab.is-in { opacity: 1; transform: none; visibility: visible; }
body.nav-open .wa-fab, body.lb-open .wa-fab { display: none; }

/* ---------- Back to top ---------- */
.to-top {
  position: fixed; right: 1.4rem; bottom: calc(1.4rem + 54px + 1rem); z-index: 90; width: 44px; height: 44px; border-radius: 999px;
  border: 1px solid var(--line-dark); background: rgba(11, 11, 13, .8); color: var(--gold); display: grid; place-items: center;
  opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
}
.to-top.is-in { opacity: 1; visibility: visible; transform: none; }
.to-top:hover, .to-top:focus-visible { background: var(--gold); color: var(--bg); }
.to-top:active { transform: scale(.94); }
.to-top svg { width: 18px; height: 18px; }

/* ---------- Gallery (editorial grid) + lightbox ---------- */
.gallery-grid { display: grid; grid-template-columns: 1.15fr 1fr 1fr; grid-auto-rows: 320px; gap: 14px; }
.g-item { position: relative; overflow: hidden; border-radius: var(--radius); background: var(--surface-2); cursor: zoom-in; margin: 0; isolation: isolate; }
.g-item img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); transition: transform var(--dur-slow) var(--ease); }
.g-item picture { display: contents; }
.g-item:hover img, .g-item:focus-visible img { transform: scale(1.045); }
.g-item figcaption { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 3rem 1.1rem 1rem; display: flex; align-items: baseline; gap: .75rem;
  color: #fff; font-size: .85rem; letter-spacing: .02em; background: linear-gradient(180deg, rgba(11, 11, 13, 0) 0%, rgba(11, 11, 13, .82) 100%); }
.g-item figcaption b { font-family: var(--serif); font-weight: 600; font-size: 1.4rem; line-height: 1; color: var(--gold); }
.g-feature { grid-row: span 2; }
.g-feature figcaption { padding-bottom: 1.6rem; padding-left: 1.8rem; }
.g-note { background: var(--surface); border: 1px solid var(--line-dark); border-radius: var(--radius); padding: clamp(1.3rem, 2.4vw, 1.8rem); display: flex; flex-direction: column; justify-content: center; gap: 1rem; min-height: 0; overflow: hidden; }
.g-note__count { font-family: var(--serif); font-weight: 600; font-size: var(--fs-stat); line-height: 1; color: var(--gold); }
.g-note__count small { display: block; font-family: var(--sans); font-weight: 600; font-size: .7rem; letter-spacing: .22em; text-transform: uppercase; color: var(--text-muted); margin-top: .35rem; }
.g-note > p { font-size: var(--fs-body-s); color: var(--text-muted); }
.g-minis { display: flex; gap: .8rem; align-items: flex-end; }
.g-mini { margin: 0; cursor: zoom-in; flex: none; }
.g-mini img { height: 104px; width: auto; border-radius: var(--radius-xs); display: block; border: 1px solid var(--line-dark-2); transition: transform var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.g-mini:hover img, .g-mini:focus-visible img { transform: translateY(-3px); border-color: var(--gold); }
.g-mini figcaption { font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); margin-top: .4rem; }
.g-mini figcaption b { color: var(--gold); font-family: var(--serif); font-size: .95rem; margin-right: .35rem; }
.gallery-item[hidden] { display: none; }
.lightbox { position: fixed; inset: 0; z-index: 200; background: rgba(11, 11, 13, .95); display: none; align-items: center; justify-content: center; padding: clamp(1rem, 4vw, 3rem);
  opacity: 0; transition: opacity .28s var(--ease), display .28s allow-discrete; }
.lightbox.is-open { display: flex; opacity: 1; }
@starting-style { .lightbox.is-open { opacity: 0; } }
.lightbox__img { width: auto; height: auto; max-width: min(1100px, 94vw); max-height: 84vh; border-radius: 8px; box-shadow: 0 30px 80px -20px rgba(0, 0, 0, .8); }
.lightbox__cap { position: absolute; bottom: 1.4rem; left: 0; right: 0; text-align: center; color: var(--text-muted); font-size: .9rem; padding-inline: 1rem; }
.lb-btn { position: absolute; background: rgba(255, 255, 255, .08); border: 1px solid var(--line-dark); color: #fff; width: 52px; height: 52px; border-radius: 999px; display: grid; place-items: center; transition: background .2s; }
.lb-btn:hover, .lb-btn:focus-visible { background: var(--gold); color: var(--bg); }
.lb-close:active { transform: scale(.94); }
.lb-prev:active, .lb-next:active { transform: translateY(-50%) scale(.94); }
.lb-close { top: 1.2rem; right: 1.2rem; }
.lb-prev { left: clamp(.6rem, 2vw, 2rem); top: 50%; transform: translateY(-50%); }
.lb-next { right: clamp(.6rem, 2vw, 2rem); top: 50%; transform: translateY(-50%); }
.lb-btn svg { width: 22px; height: 22px; }

/* ---------- Facts list ---------- */
.facts { display: grid; grid-template-columns: max-content 1fr; gap: .75rem 1.6rem; max-width: var(--narrow); border-top: 1px solid var(--line-paper); padding-top: 1.2rem; }
.facts dt { font-size: var(--fs-eyebrow); font-weight: 600; letter-spacing: var(--track-label); text-transform: uppercase; color: var(--gold-text-l); padding-top: .2rem; }
.facts dd { margin: 0; color: var(--ink); font-size: var(--fs-body); max-width: 62ch; padding-bottom: .75rem; border-bottom: 1px solid var(--line-paper); }
.facts dt:last-of-type, .facts dd:last-of-type { border-bottom: 0; }
@media (max-width: 560px) { .facts { grid-template-columns: 1fr; gap: .2rem; } .facts dd { padding-bottom: .9rem; margin-bottom: .4rem; } }

/* ---------- Tables (travel times) ---------- */
.table-wrap { overflow-x: auto; border: 1px solid var(--line-paper); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-sm); }
.table { width: 100%; border-collapse: collapse; font-size: .95rem; min-width: 520px; }
.table th, .table td { text-align: left; padding: .85rem 1rem; border-bottom: 1px solid var(--line-paper); }
.table th { font-size: var(--fs-eyebrow); letter-spacing: var(--track-label); text-transform: uppercase; color: var(--ink-muted); font-weight: 600; background: var(--paper-2); }
/* distances and times are numbers: right-aligned and tabular so the columns read down */
.table th:nth-child(n+2), .table td:nth-child(n+2) { text-align: right; font-variant-numeric: tabular-nums; }
.table tbody tr:nth-child(even) { background: rgba(21, 21, 26, .022); }
.table tbody tr { transition: background var(--dur) var(--ease); }
.table tbody tr:hover { background: var(--paper-2); }
.table tr:last-child td { border-bottom: 0; }
.table td b { font-weight: 600; }
.table-note { font-size: var(--fs-caption); font-style: italic; color: var(--ink-muted); margin-top: .7rem; }

/* ---------- Prose (privacy, about body) ---------- */
.prose { max-width: var(--narrow); }
.prose h2 { margin: 2.4rem 0 .8rem; font-size: 1.7rem; }
.prose h3 { margin: 1.6rem 0 .5rem; }
.prose p + p { margin-top: 1rem; }
.prose ul { list-style: disc; padding-left: 1.3rem; display: grid; gap: .5rem; margin-top: .6rem; }
.prose a { text-decoration: underline; text-underline-offset: 2px; }
.section--paper .prose a { color: var(--gold-text-l); }

/* ---------- Reveal on scroll (only with JS; no-JS shows everything) ---------- */
.js .reveal { opacity: 0; transform: translateY(14px); transition: opacity .7s var(--ease), transform .7s var(--ease); transition-delay: var(--d, 0ms); }
.js .reveal.is-visible { opacity: 1; transform: none; }
.js .reveal[data-delay="1"] { --d: .08s; }
.js .reveal[data-delay="2"] { --d: .16s; }
.js .reveal[data-delay="3"] { --d: .24s; }
.js .card.reveal.is-visible:hover { transition: transform .35s var(--ease), border-color .35s var(--ease); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important;
  }
  .js .reveal { opacity: 1 !important; transform: none !important; }
  /* the guard above kills the timing; these kill the movement itself */
  .btn:hover, .btn:active, .card:hover, .card:active, .card:hover .card__media img, .card:focus-visible .card__media img,
  .g-item:hover img, .g-item:focus-visible img, .g-mini:hover img, .link-arrow:hover svg, .wa-fab:active,
  .to-top:active, .nav-toggle:active, .socials a:active { transform: none !important; }
}

/* ---------- Film grain: one fixed layer, which also hides compression in the client photos.
   Desktop only: on a phone the full-viewport composite costs more than the texture is worth. ---------- */
@media (min-width: 861px) {
body::after {
  content: ""; position: fixed; inset: 0; z-index: 1; pointer-events: none; opacity: .028;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 160px 160px;
}
}
@media print { body::after { display: none; } }

/* ---------- A11y helpers ---------- */
.skip-link { position: absolute; left: 1rem; top: -60px; background: var(--gold); color: var(--bg); padding: .7rem 1.1rem; border-radius: 6px; z-index: 300; font-weight: 600; transition: top .2s; }
.skip-link:focus { top: 1rem; text-decoration: none; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ============================================================
   Responsive
   ============================================================ */
@media (max-width: 1080px) {
  .nav-side .phone-link { display: none; }
  .cards { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .trust ul { grid-template-columns: repeat(2, 1fr); }
  .trust li:nth-child(3) { border-left: 0; padding-left: 0; }
  .trust li:nth-child(-n+2) { border-bottom: 1px solid var(--line-dark-2); }
}
@media (max-width: 860px) {
  :root { --header-h: 64px; }
  body { padding-bottom: var(--callbar-h); }
  .nav-menu {
    position: fixed; inset: 0; height: 100dvh; flex-direction: column; justify-content: safe center; gap: 1.1rem;
    background: var(--bg); padding: 5rem 2rem 2rem; padding-bottom: calc(2rem + env(safe-area-inset-bottom, 0px));
    transform: translateX(100%); visibility: hidden; transition: transform .4s var(--ease), visibility .4s; z-index: 90; overflow-y: auto; overscroll-behavior: contain;
  }
  body.nav-open .nav-menu { visibility: visible; transform: none; }
  .nav-menu a { font-family: var(--serif); font-size: 1.9rem; font-weight: 600; color: #fff; padding: .25rem .6rem; }
  .nav-menu a::after { display: none; }
  .nav-menu .nav-only-mobile { display: block; }
  .nav-menu .nav-only-mobile a { font-family: var(--sans); font-size: 1rem; font-weight: 500; color: var(--gold); letter-spacing: .08em; }
  .nav-menu .nav-only-mobile + .nav-only-mobile { margin-top: -.4rem; }
  .nav-menu li.nav-mobile-sep { width: 48px; height: 1px; background: var(--line-dark); margin: .6rem 0; }
  .nav-side .btn { display: none; }
  .nav-toggle { display: block; z-index: 95; }
  .hero { padding-top: calc(var(--header-h) + 1.4rem); padding-bottom: clamp(2.2rem, 6vw, 3.5rem); }
  .hero__grid { grid-template-columns: 1fr; gap: 2.2rem; }
  .hero__title { font-size: 2.35rem; }
  .hero--short .hero__title { font-size: 2.15rem; }
  .eyebrow { font-size: .66rem; letter-spacing: .2em; }
  .hero__media { justify-self: start; max-width: 560px; margin: .4rem 0 0; }
  .hero__media, .split__media--frame, .split__media--wide { padding: 6px; border-radius: 12px; }
  .hero__media--stack { margin-bottom: 0; }
  .hero__inset { display: none; }
  .hero--short .hero__media { max-width: 82%; }
  .hero__copy { max-width: none; }
  .cards, .cards--3 { grid-template-columns: 1fr 1fr; }
  .split, .split--rev, .grid-2, .grid-3, .fleet-card { grid-template-columns: 1fr; }
  .split--rev .split__media { order: 0; }
  .split__media { max-width: 86%; justify-self: start; }
  .steps { grid-template-columns: 1fr; gap: 1.8rem; }
  /* the route turns vertical on a phone */
  .steps::before, .next-steps::before { left: 5px; right: auto; top: 5px; bottom: 6px; width: 1px; height: auto;
    background: linear-gradient(180deg, var(--rail) 0%, var(--rail) 84%, transparent 100%); }
  .step, .next-steps li { padding-top: 0; padding-left: 2rem; }
  .step::before, .next-steps li::before { top: 3px; }
  .next-steps { gap: 1.6rem; }
  .airports { grid-template-columns: 1fr 1fr; gap: 10px; }
  .steps--icons::before { left: 23px; top: 23px; }
  .steps--icons .step, .steps--icons .next-steps li { padding-top: 0; padding-left: 4rem; min-height: 46px; }
  .steps--icons .step::before { top: 0; }
  .board__row { grid-template-columns: 4.4rem minmax(0, 1fr); }
  .board__row > .chip { grid-column: 2; justify-self: start; }
  .hero::after { background: radial-gradient(70% 40% at 60% 0%, var(--gold-a10), transparent 70%); }
  .review-panel::before { font-size: 3.4rem; }
  .areas__grid { grid-template-columns: 1fr; }
  .quotes { grid-template-columns: 1fr; }
  .gallery-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 210px; gap: 10px; }
  .g-feature { grid-column: span 2; grid-row: span 2; }
  .g-item:nth-child(4) { grid-column: span 2; }
  .g-note { grid-column: span 2; grid-row: auto; min-height: 0; }
  .gallery-grid { grid-auto-rows: auto; }
  .g-item { height: 210px; }
  .g-feature { height: 430px; }
  .g-item figcaption { font-size: .78rem; padding: 2.2rem .8rem .7rem; }
  .g-item figcaption b { font-size: 1.15rem; }
  .qf__row { grid-template-columns: 1fr; }
  .contact-grid { grid-template-columns: 1fr; }
  .next-steps { grid-template-columns: 1fr; }
  .wa-fab, .to-top { display: none; }
  /* A floating bar, not two slabs: one gold pill for the number and one round WhatsApp button. */
  .call-bar {
    display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center;
    position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 95;
    padding: 7px; border-radius: 999px; border: 1px solid var(--line-dark);
    background: rgba(11, 11, 13, .86); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
    box-shadow: 0 18px 40px -20px rgba(0, 0, 0, .9);
  }
  .call-bar a { display: flex; align-items: center; justify-content: center; gap: .5rem; font-weight: 600; }
  .call-bar a:hover { text-decoration: none; }
  .call-bar svg { width: 19px; height: 19px; flex: none; }
  .call-bar__call { min-height: 50px; border-radius: 999px; background: var(--gold); color: var(--bg); font-size: .95rem; }
  .call-bar__call:active { background: var(--gold-deep); }
  .call-bar__wa { width: 50px; height: 50px; border-radius: 999px; background: var(--surface); border: 1px solid var(--line-dark-2); color: var(--wa); }
  .call-bar__wa:active { transform: scale(.94); }
  body.nav-open .call-bar, body.lb-open .call-bar { display: none; }
  .footer-bottom { padding-bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 560px) {
  .cards, .cards--3 { grid-template-columns: 1fr; gap: .8rem; }
  .card { display: grid; grid-template-columns: 104px minmax(0, 1fr); align-items: center; gap: 1rem; padding: .7rem; }
  .card:hover { transform: none; }
  .card__media { aspect-ratio: 4 / 5; border-radius: 8px; }
  .card__body { padding: 0 .2rem 0 0; gap: .3rem; }
  .card__body h3 { font-size: 1.02rem; }
  .card__body p { font-size: .86rem; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .card__body .link-arrow { font-size: .8rem; padding-top: .2rem; margin-top: 0; }
  .airports { grid-template-columns: 1fr; }
  .board__row { grid-template-columns: 3.8rem minmax(0, 1fr); gap: .5rem 1rem; }
  .trust ul { grid-template-columns: 1fr 1fr; }
  .trust li { flex-direction: column; align-items: flex-start; gap: .55rem; padding: 1rem .9rem 1rem 0; font-size: .86rem; border-left: 0; border-bottom: 1px solid var(--line-dark-2); }
  .trust li:nth-child(even) { border-left: 1px solid var(--line-dark-2); padding-left: .9rem; }
  .trust li:nth-child(3) { padding-left: 0; }
  .trust li:nth-last-child(-n+2) { border-bottom: 0; }
  .trust li:first-child { padding-left: 0; }
  .specs { grid-template-columns: 1fr; }
  .feature { padding-top: .9rem; }
  .hero__note span { font-size: .78rem; padding: .35em .7em; }
  .footer-grid { grid-template-columns: 1fr; }
  .hero__btns .btn { width: 100%; }
  .logo-word { font-size: 1.05rem; }
  .logo-word small { display: none; }
  .cta-band .btn-row .btn { width: 100%; }
}
@media print {
  .site-header, .call-bar, .wa-fab, .to-top, .skip-link, .cta-band { display: none !important; }
  body { background: #fff; color: #000; }
}