/* ==========================================================================
   AirTicketBooking.lk — Premium Corporate Theme
   Pure HTML + CSS (vanilla JS only for interactions)
   ========================================================================== */

/* ---------- 1. Design Tokens ---------- */
:root{
  /* Brand */
  --gold:#BC8A13;
  --gold-600:#A5760C;
  --gold-400:#D4A635;
  --gold-200:#EBD49A;
  --gold-50:#FDF8EC;

  /* Ink / neutrals */
  --ink:#0B1524;
  --ink-700:#132238;
  --ink-500:#24374F;
  --slate:#5A687C;
  --slate-400:#8B97A8;
  --line:#E7E3DA;
  --line-soft:#F1EDE4;
  --cream:#FBF8F2;
  --white:#ffffff;

  --success:#10B981;
  --error:#EF4444;

  /* Type */
  --font-display:'Sora',system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;

  /* Rhythm */
  --container:1240px;
  --gutter:clamp(18px,4vw,32px);
  --section-y:clamp(64px,8vw,116px);
  --radius-xs:10px;
  --radius-sm:14px;
  --radius:20px;
  --radius-lg:28px;
  --radius-pill:999px;

  /* Elevation */
  --shadow-xs:0 1px 2px rgba(11,21,36,.06);
  --shadow-sm:0 6px 18px -8px rgba(11,21,36,.18);
  --shadow:0 18px 44px -22px rgba(11,21,36,.28);
  --shadow-lg:0 40px 90px -40px rgba(11,21,36,.45);
  --shadow-gold:0 18px 40px -18px rgba(188,138,19,.55);

  --ease:cubic-bezier(.22,.61,.36,1);
  --t:.35s var(--ease);
}

/* ---------- 2. Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:110px}
body{
  font-family:var(--font-body);
  font-size:16px;line-height:1.7;
  color:var(--slate);
  background:var(--white);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg,video{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}
::selection{background:var(--gold);color:#fff}
.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- 3. Typography ---------- */
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-display);
  color:var(--ink);
  line-height:1.18;
  font-weight:700;
  letter-spacing:-.02em;
}
h1{font-size:clamp(2.1rem,1.4rem + 2.3vw,3.5rem);letter-spacing:-.035em}
h2{font-size:clamp(1.75rem,1.25rem + 1.6vw,2.6rem);letter-spacing:-.03em}
h3{font-size:clamp(1.25rem,1.05rem + .7vw,1.65rem)}
h4{font-size:1.125rem}
h5{font-size:1rem}
p{max-width:68ch}
strong{color:var(--ink);font-weight:600}

.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--font-body);
  font-size:.74rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gold-600);margin-bottom:16px;
}
.eyebrow::before{content:"";width:26px;height:2px;background:linear-gradient(90deg,var(--gold),transparent);border-radius:2px}
.eyebrow.is-light{color:var(--gold-400)}
.lead{font-size:clamp(1rem,.96rem + .2vw,1.125rem);color:var(--slate)}

/* ---------- 4. Layout ---------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}
.container--narrow{max-width:900px}
.section{padding-block:var(--section-y)}
.section--tight{padding-block:clamp(48px,6vw,80px)}
.section--cream{background:var(--cream)}
.section--ink{background:var(--ink);color:#B9C4D2}
.section--ink h2,.section--ink h3,.section--ink h4{color:#fff}
.section--pattern{position:relative;overflow:hidden}
.section--pattern::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(circle at 1px 1px,rgba(188,138,19,.16) 1px,transparent 0);
  background-size:26px 26px;opacity:.7;
}
.section--pattern > *{position:relative;z-index:1}

.section-head{max-width:720px;margin-bottom:clamp(34px,4vw,56px)}
.section-head--center{margin-inline:auto;text-align:center}
.section-head--center .eyebrow{justify-content:center}
.section-head p{margin-top:16px}
.section-head--center p{margin-inline:auto}
.section-head--split{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px;max-width:none}

.grid{display:grid;gap:clamp(18px,2.2vw,28px)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,72px);align-items:center}

/* ---------- 5. Buttons ---------- */
.btn{
  --btn-bg:var(--gold);--btn-fg:#fff;--btn-bd:var(--gold);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:14px 28px;border-radius:var(--radius-pill);
  background:var(--btn-bg);color:var(--btn-fg);border:1.5px solid var(--btn-bd);
  font-family:var(--font-body);font-size:.94rem;font-weight:600;letter-spacing:.01em;
  white-space:nowrap;cursor:pointer;position:relative;
  transition:transform var(--t),box-shadow var(--t),background var(--t),color var(--t),border-color var(--t);
}
.btn svg{width:17px;height:17px;flex:none}
.btn:hover{transform:translateY(-3px);box-shadow:var(--shadow-gold)}
.btn:active{transform:translateY(-1px)}
.btn--lg{padding:17px 36px;font-size:1rem}
.btn--sm{padding:10px 20px;font-size:.85rem}
.btn--dark{--btn-bg:var(--ink);--btn-bd:var(--ink)}
.btn--dark:hover{box-shadow:0 18px 40px -18px rgba(11,21,36,.6)}
.btn--ghost{--btn-bg:transparent;--btn-fg:var(--ink);--btn-bd:var(--line)}
.btn--ghost:hover{--btn-bg:var(--ink);--btn-fg:#fff;--btn-bd:var(--ink);box-shadow:var(--shadow)}
.btn--light{--btn-bg:#fff;--btn-fg:var(--ink);--btn-bd:#fff}
.btn--outline-light{--btn-bg:transparent;--btn-fg:#fff;--btn-bd:rgba(255,255,255,.32)}
.btn--outline-light:hover{--btn-bg:#fff;--btn-fg:var(--ink);--btn-bd:#fff}
.btn--wa{--btn-bg:#25D366;--btn-bd:#25D366}
.btn--wa:hover{box-shadow:0 18px 40px -18px rgba(37,211,102,.8)}
.btn--block{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center}

.link-arrow{
  display:inline-flex;align-items:center;gap:8px;
  font-weight:600;font-size:.92rem;color:var(--gold-600);
  transition:gap var(--t),color var(--t);
}
.link-arrow svg{width:16px;height:16px}
.link-arrow:hover{gap:14px;color:var(--gold)}

/* ---------- 6. Top bar ---------- */
.topbar{background:var(--ink);color:#9FB0C4;font-size:.83rem}
.topbar .container{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:44px}
.topbar a{transition:color var(--t)}
.topbar a:hover{color:var(--gold-400)}
.topbar-list{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.topbar-list li{display:flex;align-items:center;gap:8px}
.topbar-list svg{width:14px;height:14px;color:var(--gold-400);flex:none}
.topbar-social{display:flex;align-items:center;gap:6px}
.topbar-social a{
  width:29px;height:29px;display:grid;place-items:center;border-radius:50%;
  background:rgba(255,255,255,.07);transition:background var(--t),transform var(--t),color var(--t);
}
.topbar-social a:hover{background:var(--gold);color:#fff;transform:translateY(-2px)}
.topbar-social svg{width:14px;height:14px}

/* ---------- 7. Header / Nav ---------- */
.site-header{
  position:sticky;top:0;z-index:900;background:rgba(255,255,255,.9);
  backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line-soft);transition:box-shadow var(--t),background var(--t);
}
.site-header.is-stuck{box-shadow:0 10px 34px -22px rgba(11,21,36,.4);background:rgba(255,255,255,.97)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:80px}
.brand{display:flex;align-items:center;gap:12px;flex:none}
.brand img{width:auto;height:46px;object-fit:contain}

.menu{display:flex;align-items:center;gap:2px}
.menu > li{position:relative}
.menu > li > a{
  display:flex;align-items:center;gap:6px;white-space:nowrap;
  padding:11px 13px;border-radius:var(--radius-pill);
  font-size:.92rem;font-weight:500;color:var(--ink-500);
  transition:color var(--t),background var(--t);
}
.menu > li > a:hover{color:var(--gold-600);background:var(--gold-50)}
.menu > li.is-active > a{color:var(--gold-600);font-weight:600}
.menu .caret{width:11px;height:11px;transition:transform var(--t)}
.menu > li:hover .caret{transform:rotate(180deg)}

.submenu{
  position:absolute;top:calc(100% + 12px);left:0;min-width:236px;
  background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius-sm);
  box-shadow:var(--shadow);padding:10px;
  opacity:0;visibility:hidden;transform:translateY(10px);
  transition:opacity var(--t),transform var(--t),visibility var(--t);
}
.submenu::before{content:"";position:absolute;top:-12px;left:0;right:0;height:12px}
.menu > li:hover .submenu,.menu > li:focus-within .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.submenu a{
  display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:var(--radius-xs);
  font-size:.9rem;color:var(--ink-500);transition:background var(--t),color var(--t),padding-left var(--t);
}
.submenu a::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--gold-200);transition:background var(--t)}
.submenu a:hover{background:var(--gold-50);color:var(--gold-600);padding-left:18px}
.submenu a:hover::before{background:var(--gold)}

.nav-cta{display:flex;align-items:center;gap:14px;flex:none}
.nav-phone{display:flex;align-items:center;gap:11px}
.nav-phone i{
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;flex:none;
  background:var(--gold-50);color:var(--gold-600);
}
.nav-phone svg{width:18px;height:18px}
.nav-phone span{display:block;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--slate-400);font-weight:600}
.nav-phone b{font-family:var(--font-display);font-size:.95rem;color:var(--ink);white-space:nowrap}

.burger{
  display:none;width:46px;height:46px;border-radius:var(--radius-xs);
  border:1px solid var(--line);place-items:center;background:#fff;
}
.burger span{display:block;width:20px;height:2px;background:var(--ink);border-radius:2px;position:relative;transition:var(--t)}
.burger span::before,.burger span::after{
  content:"";position:absolute;left:0;width:20px;height:2px;background:var(--ink);border-radius:2px;transition:var(--t);
}
.burger span::before{top:-6px}
.burger span::after{top:6px}
body.nav-open .burger span{background:transparent}
body.nav-open .burger span::before{top:0;transform:rotate(45deg)}
body.nav-open .burger span::after{top:0;transform:rotate(-45deg)}

/* Mobile drawer */
.drawer{
  position:fixed;inset:0 0 0 auto;width:min(360px,88vw);background:#fff;z-index:960;
  transform:translateX(102%);transition:transform .42s var(--ease);
  display:flex;flex-direction:column;box-shadow:var(--shadow-lg);
}
body.nav-open .drawer{transform:translateX(0)}
.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:20px var(--gutter);border-bottom:1px solid var(--line-soft)}
.drawer-head img{height:40px}
.drawer-close{width:40px;height:40px;border-radius:50%;background:var(--cream);display:grid;place-items:center;color:var(--ink)}
.drawer-close svg{width:18px;height:18px}
.drawer-body{flex:1;overflow-y:auto;padding:14px var(--gutter) 30px}
.drawer-body a{display:block;padding:13px 4px;font-size:1rem;font-weight:500;color:var(--ink);border-bottom:1px solid var(--line-soft)}
.drawer-body a:hover{color:var(--gold-600)}
.drawer-body .sub a{padding-left:18px;font-size:.92rem;font-weight:400;color:var(--slate)}
.drawer-foot{padding:20px var(--gutter);border-top:1px solid var(--line-soft);display:grid;gap:10px}
.nav-scrim{position:fixed;inset:0;background:rgba(11,21,36,.5);backdrop-filter:blur(2px);z-index:950;opacity:0;visibility:hidden;transition:var(--t)}
body.nav-open .nav-scrim{opacity:1;visibility:visible}
body.nav-open{overflow:hidden}

/* ---------- 8. Hero ---------- */
.hero{
  position:relative;overflow:hidden;color:#fff;
  background:linear-gradient(150deg,#0B1524 0%,#122540 45%,#1B3050 100%);
  padding-block:clamp(56px,7vw,96px) clamp(120px,13vw,180px);
}
.hero::before{
  content:"";position:absolute;top:-22%;right:-14%;width:min(760px,78vw);aspect-ratio:1;
  background:radial-gradient(circle,rgba(188,138,19,.34),transparent 66%);filter:blur(8px);
}
.hero::after{
  content:"";position:absolute;inset:0;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:70px 70px;
  -webkit-mask-image:radial-gradient(ellipse at 30% 30%,#000,transparent 72%);
  mask-image:radial-gradient(ellipse at 30% 30%,#000,transparent 72%);
}
.hero .container{position:relative;z-index:2}
.hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(30px,5vw,64px);align-items:center}
.hero h1{color:#fff;margin-bottom:20px}
.hero h1 em{font-style:normal;color:var(--gold-400);position:relative;white-space:nowrap}
.hero h1 em::after{
  content:"";position:absolute;left:0;right:0;bottom:.06em;height:.09em;border-radius:4px;
  background:linear-gradient(90deg,var(--gold),rgba(212,166,53,0));
}
.hero p{color:#C2CEDD;font-size:clamp(1rem,.95rem + .3vw,1.16rem);max-width:56ch}
.hero-pill{
  display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;
  padding:8px 8px 8px 16px;border-radius:var(--radius-pill);
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  font-size:.83rem;color:#DCE5EF;backdrop-filter:blur(6px);
}
.hero-pill b{
  background:var(--gold);color:#fff;padding:4px 12px;border-radius:var(--radius-pill);
  font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
.hero-trust{display:flex;flex-wrap:wrap;gap:12px 34px;margin-top:38px;padding-top:28px;border-top:1px solid rgba(255,255,255,.13)}
.hero-trust li{display:flex;align-items:center;gap:10px;font-size:.88rem;color:#C2CEDD}
.hero-trust svg{width:18px;height:18px;color:var(--gold-400);flex:none}

.hero-visual{position:relative}
.hero-card{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius-lg);padding:26px;backdrop-filter:blur(16px);box-shadow:var(--shadow-lg);
}
/* over footage the translucent card loses contrast — darken the glass */
.hero--video .hero-card{
  background:rgba(9,17,29,.62);border-color:rgba(255,255,255,.17);
  backdrop-filter:blur(20px) saturate(140%);-webkit-backdrop-filter:blur(20px) saturate(140%);
}
.hero--video .fare-item{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.12)}
.hero--video .hero-card > p,.hero--video .route-node span{color:#B4C2D3}
.hero-card h4{color:#fff;margin-bottom:4px}
.hero-card > p{color:#9FB0C4;font-size:.86rem;margin-bottom:20px}
.route{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;margin-bottom:22px}
.route-node b{display:block;font-family:var(--font-display);font-size:1.6rem;color:#fff;line-height:1}
.route-node span{font-size:.78rem;color:#9FB0C4}
.route-node:last-child{text-align:right}
.route-line{position:relative;height:2px;background:linear-gradient(90deg,rgba(255,255,255,.18),var(--gold),rgba(255,255,255,.18));border-radius:2px;min-width:56px}
.route-line svg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:22px;height:22px;color:var(--gold-400)}
.fare-list{display:grid;gap:10px}
.fare-item{
  display:flex;align-items:center;gap:14px;
  padding:13px 16px;border-radius:var(--radius-sm);
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);
  transition:background var(--t),transform var(--t),border-color var(--t);
}
.fare-item:hover{background:rgba(255,255,255,.12);border-color:rgba(212,166,53,.4);transform:translateX(4px)}
.fare-item img{
  height:34px;width:52px;flex:none;object-fit:contain;
  background:#fff;border-radius:8px;padding:4px;
}
.fare-meta{flex:1;min-width:0}
.fare-meta b{display:block;font-size:.9rem;color:#fff;font-weight:600}
.fare-meta span{font-size:.76rem;color:#9FB0C4}
.fare-price{font-family:var(--font-display);font-size:.95rem;color:var(--gold-400);font-weight:700;white-space:nowrap}
.hero-badge{
  position:absolute;bottom:-26px;left:-18px;display:flex;align-items:center;gap:12px;
  background:#fff;border-radius:var(--radius);padding:14px 20px;box-shadow:var(--shadow-lg);
}
.hero-badge i{width:42px;height:42px;border-radius:50%;background:var(--gold-50);color:var(--gold-600);display:grid;place-items:center;flex:none}
.hero-badge svg{width:20px;height:20px}
.hero-badge b{display:block;font-family:var(--font-display);font-size:1.1rem;color:var(--ink);line-height:1.2}
.hero-badge span{font-size:.76rem;color:var(--slate)}

/* ---------- 9. Search widget ---------- */
.search-wrap{margin-top:calc(-1 * clamp(72px,9vw,104px));position:relative;z-index:20}
.search-card{
  background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);
  border:1px solid var(--line-soft);padding:clamp(20px,3vw,30px);
}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.tab{
  padding:11px 22px;border-radius:var(--radius-pill);border:1.5px solid var(--line);
  font-size:.88rem;font-weight:600;color:var(--slate);background:#fff;
  transition:all var(--t);display:inline-flex;align-items:center;gap:8px;
}
.tab svg{width:16px;height:16px}
.tab:hover{border-color:var(--gold-200);color:var(--gold-600)}
.tab.is-active{background:linear-gradient(135deg,var(--gold),var(--gold-600));border-color:var(--gold);color:#fff;box-shadow:var(--shadow-gold)}
.tab-panel{display:none}
.tab-panel.is-active{display:block;animation:fade .4s var(--ease)}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.field-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:end}
.field{position:relative}
.field label{
  display:block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--slate-400);margin-bottom:8px;
}
.field .control{
  width:100%;padding:14px 16px 14px 44px;border-radius:var(--radius-sm);
  border:1.5px solid var(--line);background:var(--cream);
  font-size:.95rem;color:var(--ink);transition:border-color var(--t),background var(--t),box-shadow var(--t);
  appearance:none;-webkit-appearance:none;
}
.field .control::placeholder{color:var(--slate-400)}
.field .control:focus{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(188,138,19,.12)}
.field .ficon{position:absolute;left:15px;bottom:15px;width:18px;height:18px;color:var(--gold-600);pointer-events:none}
select.control{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A687C' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px;padding-right:40px}
.field--full{grid-column:1/-1}
.search-note{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;margin-top:18px;font-size:.83rem;color:var(--slate-400)}
.search-note span{display:flex;align-items:center;gap:7px}
.search-note svg{width:15px;height:15px;color:var(--success)}

/* ---------- 10. Marquee (airline partners) ---------- */
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;align-items:center;gap:clamp(38px,6vw,80px);width:max-content;animation:slide 34s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track img{height:38px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.55;transition:filter var(--t),opacity var(--t)}
.marquee-track img:hover{filter:none;opacity:1}
@keyframes slide{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none;flex-wrap:wrap;width:auto;justify-content:center}}

/* ---------- 11. Cards ---------- */
.card{
  background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius);
  padding:clamp(24px,2.6vw,32px);position:relative;overflow:hidden;
  transition:transform var(--t),box-shadow var(--t),border-color var(--t);
}
.card::after{
  content:"";position:absolute;inset:auto 0 0 0;height:3px;
  background:linear-gradient(90deg,var(--gold),var(--gold-400));
  transform:scaleX(0);transform-origin:left;transition:transform var(--t);
}
.card:hover{transform:translateY(-7px);box-shadow:var(--shadow);border-color:var(--gold-200)}
.card:hover::after{transform:scaleX(1)}
.card-icon{
  width:60px;height:60px;border-radius:18px;display:grid;place-items:center;margin-bottom:22px;
  background:linear-gradient(140deg,var(--gold-50),#fff);border:1px solid var(--gold-200);
  color:var(--gold-600);transition:background var(--t),color var(--t),transform var(--t);
}
.card-icon svg{width:26px;height:26px}
.card:hover .card-icon{background:linear-gradient(140deg,var(--gold),var(--gold-600));color:#fff;transform:rotate(-6deg) scale(1.05)}
.card h3{margin-bottom:10px}
.card p{font-size:.94rem}
.card .link-arrow{margin-top:18px}
.card-list{margin-top:16px;display:grid;gap:9px}
.card-list li{display:flex;gap:10px;font-size:.9rem;line-height:1.55}
.card-list svg{width:16px;height:16px;color:var(--gold);flex:none;margin-top:4px}
.card-num{
  position:absolute;top:14px;right:22px;font-family:var(--font-display);font-weight:700;
  font-size:2.6rem;color:var(--gold);opacity:.12;line-height:1;
}
.card--ink{background:var(--ink-700);border-color:rgba(255,255,255,.08)}
.card--ink h3,.card--ink h4{color:#fff}
.card--ink p{color:#A9B7C8}
.card--ink .card-icon{background:rgba(188,138,19,.14);border-color:rgba(212,166,53,.3);color:var(--gold-400)}

/* ---------- 12. Destination cards ---------- */
.dest-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2vw,24px)}
.dest{
  position:relative;border-radius:var(--radius);overflow:hidden;isolation:isolate;
  aspect-ratio:3/4;display:flex;align-items:flex-end;box-shadow:var(--shadow-sm);
  transition:transform var(--t),box-shadow var(--t);
}
.dest:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg)}
.dest img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .8s var(--ease)}
.dest:hover img{transform:scale(1.09)}
.dest::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(11,21,36,0) 26%,rgba(11,21,36,.55) 62%,rgba(11,21,36,.93) 100%);
}
.dest-body{padding:22px;width:100%;color:#fff}
.dest-body h3{color:#fff;font-size:1.2rem;margin-bottom:4px}
.dest-body span{font-size:.83rem;color:#C6D1DE;display:flex;align-items:center;gap:7px}
.dest-body svg{width:14px;height:14px;color:var(--gold-400);flex:none}
.dest-tag{
  position:absolute;top:16px;left:16px;padding:6px 14px;border-radius:var(--radius-pill);
  background:rgba(255,255,255,.92);color:var(--ink);font-size:.72rem;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;backdrop-filter:blur(6px);
}
.dest--wide{aspect-ratio:16/10}

/* ---------- 13. Feature / why-us ---------- */
.feature{display:flex;gap:18px;padding:24px;border-radius:var(--radius);transition:background var(--t),transform var(--t),box-shadow var(--t)}
.feature:hover{background:#fff;transform:translateX(6px);box-shadow:var(--shadow-sm)}
.feature i{
  width:52px;height:52px;flex:none;border-radius:16px;display:grid;place-items:center;
  background:var(--gold-50);color:var(--gold-600);border:1px solid var(--gold-200);
}
.feature svg{width:23px;height:23px}
.feature h4{margin-bottom:6px}
.feature p{font-size:.92rem;margin:0}
.section--ink .feature:hover{background:rgba(255,255,255,.05);box-shadow:none}
.section--ink .feature i{background:rgba(188,138,19,.15);border-color:rgba(212,166,53,.3);color:var(--gold-400)}
.section--ink .feature p{color:#A9B7C8}

/* ---------- 14. Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(var(--cols,4),1fr);gap:clamp(16px,2vw,28px);max-width:calc(var(--cols,4) * 300px);margin-inline:auto}
.stat{text-align:center;padding:28px 16px;border-radius:var(--radius);background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09)}
.stat b{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(2rem,1.4rem + 2vw,3rem);color:var(--gold-400);line-height:1}
.stat span{display:block;margin-top:8px;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;color:#9FB0C4;font-weight:600}
.stats--light .stat{background:#fff;border-color:var(--line-soft);box-shadow:var(--shadow-xs)}
.stats--light .stat b{color:var(--gold-600)}
.stats--light .stat span{color:var(--slate)}

/* ---------- 15. Media / about ---------- */
.media{position:relative}
.media > img{border-radius:var(--radius-lg);width:100%;object-fit:cover;box-shadow:var(--shadow)}
.media--stack{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.media--stack img{border-radius:var(--radius);width:100%;object-fit:cover;box-shadow:var(--shadow-sm)}
/* rows 2 & 3 have a definite aspect-ratio, which gives the spanning
   first image a definite height to resolve height:100% against. */
.media--stack img:nth-child(2),.media--stack img:nth-child(3){aspect-ratio:4/3}
.media--stack img:first-child{grid-row:span 2;height:100%}
.media-frame::before{
  content:"";position:absolute;inset:auto -18px -18px auto;width:58%;height:58%;
  border:2px solid var(--gold-200);border-radius:var(--radius-lg);z-index:-1;
}
.check-list{display:grid;gap:12px;margin-top:24px}
.check-list li{display:flex;gap:12px;align-items:flex-start;font-size:.96rem}
.check-list i{
  width:24px;height:24px;flex:none;border-radius:50%;background:var(--gold-50);
  color:var(--gold-600);display:grid;place-items:center;margin-top:3px;border:1px solid var(--gold-200);
}
.check-list svg{width:13px;height:13px}
.section--ink .check-list li{color:#B9C4D2}

/* ---------- 16. Steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.4vw,28px);position:relative}
.step{text-align:center;position:relative}
.step-dot{
  width:74px;height:74px;margin:0 auto 20px;border-radius:50%;display:grid;place-items:center;
  background:#fff;border:2px dashed var(--gold-200);color:var(--gold-600);
  font-family:var(--font-display);font-size:1.35rem;font-weight:700;
  position:relative;z-index:2;transition:var(--t);
}
.step:hover .step-dot{background:var(--gold);border-color:var(--gold);border-style:solid;color:#fff;transform:scale(1.06);box-shadow:var(--shadow-gold)}
.step h4{margin-bottom:8px}
.step p{font-size:.9rem;margin-inline:auto}
.steps::before{
  content:"";position:absolute;top:37px;left:12.5%;right:12.5%;height:2px;
  background:repeating-linear-gradient(90deg,var(--gold-200) 0 8px,transparent 8px 16px);z-index:1;
}

/* ---------- 17. Accordion ---------- */
.accordion{display:grid;gap:12px}
.acc{background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius-sm);overflow:hidden;transition:border-color var(--t),box-shadow var(--t)}
.acc.is-open{border-color:var(--gold-200);box-shadow:var(--shadow-sm)}
.acc-head{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:18px;
  padding:20px 24px;text-align:left;
  font-family:var(--font-display);font-size:1rem;font-weight:600;color:var(--ink);
  transition:color var(--t);
}
.acc-head:hover{color:var(--gold-600)}
.acc-head i{
  width:30px;height:30px;flex:none;border-radius:50%;display:grid;place-items:center;
  background:var(--gold-50);color:var(--gold-600);transition:var(--t);
}
.acc-head svg{width:15px;height:15px}
.acc.is-open .acc-head i{background:var(--gold);color:#fff;transform:rotate(180deg)}
.acc-body{max-height:0;overflow:hidden;transition:max-height .42s var(--ease)}
.acc-body-inner{padding:0 24px 22px;font-size:.94rem}
.acc-body-inner p + p{margin-top:10px}
.acc-body-inner ul{display:grid;gap:8px;margin-top:10px}
.acc-body-inner li{display:flex;gap:10px;font-size:.92rem}
.acc-body-inner li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--gold);flex:none;margin-top:9px}

/* ---------- 18. Testimonials ---------- */
.quote-card{background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius);padding:30px;position:relative;transition:transform var(--t),box-shadow var(--t)}
.quote-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.quote-mark{font-family:var(--font-display);font-size:3.4rem;line-height:.75;color:var(--gold-200)}
.stars{display:flex;gap:3px;margin:12px 0 14px}
.stars svg{width:16px;height:16px;color:var(--gold)}
.quote-card p{font-size:.96rem;color:var(--ink-500)}
.quote-user{display:flex;align-items:center;gap:13px;margin-top:22px;padding-top:20px;border-top:1px solid var(--line-soft)}
.avatar{
  width:46px;height:46px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--gold),var(--gold-600));color:#fff;
  font-family:var(--font-display);font-weight:700;font-size:1rem;
}
.quote-user b{display:block;font-family:var(--font-display);color:var(--ink);font-size:.96rem}
.quote-user span{font-size:.83rem;color:var(--slate-400)}

/* ---------- 19. CTA band ---------- */
.cta-band{
  position:relative;overflow:hidden;border-radius:var(--radius-lg);
  background:linear-gradient(135deg,var(--ink) 0%,#152841 60%,#1E3555 100%);
  padding:clamp(36px,5vw,64px);color:#fff;text-align:center;
}
.cta-band::before{
  content:"";position:absolute;top:-45%;left:50%;transform:translateX(-50%);
  width:min(720px,90%);aspect-ratio:1;
  background:radial-gradient(circle,rgba(188,138,19,.38),transparent 64%);
}
.cta-band > *{position:relative;z-index:1}
.cta-band h2{color:#fff;margin-bottom:14px}
.cta-band p{color:#C2CEDD;margin-inline:auto;margin-bottom:30px}
.cta-band .btn-row{justify-content:center}

/* ---------- 20. Page hero (inner) ---------- */
.page-hero{
  position:relative;overflow:hidden;color:#fff;padding-block:clamp(52px,7vw,92px);
  background:linear-gradient(140deg,#0B1524,#162944 70%,#1D3352);
}
.page-hero::before{
  content:"";position:absolute;top:-40%;right:-10%;width:min(620px,70vw);aspect-ratio:1;
  background:radial-gradient(circle,rgba(188,138,19,.3),transparent 65%);
}
.page-hero::after{
  content:"";position:absolute;left:-8%;bottom:-50%;width:min(520px,60vw);aspect-ratio:1;z-index:0;pointer-events:none;
  background:radial-gradient(circle,rgba(46,110,143,.22),transparent 62%);
}
.page-hero .container{position:relative;z-index:1}
.page-hero .eyebrow{color:#E4C066}
.route-view{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:.82rem;font-weight:700;letter-spacing:.01em;color:#BC8A13;text-decoration:none}
.route-view::after{content:"→";transition:transform .2s ease}
.route-view:hover{color:#9a6f10}
.route-view:hover::after{transform:translateX(3px)}
/* Cookie consent banner */
.cookie-banner{position:fixed;left:16px;right:16px;bottom:16px;z-index:200;max-width:760px;margin:0 auto;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;
  background:#12242F;color:#E6EDF3;border:1px solid rgba(255,255,255,.12);border-radius:14px;
  padding:15px 20px;box-shadow:0 14px 44px rgba(0,0,0,.34)}
.cookie-banner[hidden]{display:none}
.cookie-banner p{margin:0;font-size:.88rem;line-height:1.5;flex:1 1 300px}
.cookie-banner a{color:#E4C066;text-decoration:underline}
.cookie-actions{display:flex;gap:10px;flex:0 0 auto}
.cookie-banner button{cursor:pointer;border-radius:9px;padding:9px 18px;font-weight:700;font-size:.84rem;border:1px solid transparent;font-family:inherit}
#cookie-accept{background:#BC8A13;color:#0C1826}
#cookie-accept:hover{background:#a9791f}
#cookie-decline{background:transparent;color:#E6EDF3;border-color:rgba(255,255,255,.28)}
#cookie-decline:hover{border-color:#E4C066}
@media(max-width:768px){.cookie-banner{left:8px;right:8px;bottom:74px;padding:14px}.cookie-actions{width:100%}.cookie-banner button{flex:1}}
.page-hero h1{color:#fff;max-width:20ch}
.page-hero p{color:#BFCBD9;margin-top:16px;max-width:62ch}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:9px;font-size:.85rem;color:#95A6BA;margin-bottom:18px}
.crumbs a:hover{color:var(--gold-400)}
.crumbs strong{color:var(--gold-400);font-weight:500}
.crumbs .sep{opacity:.45}

/* ---------- 21. Forms & contact ---------- */
.form-card{background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius-lg);padding:clamp(24px,3vw,40px);box-shadow:var(--shadow-sm)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-grid .field--full{grid-column:1/-1}
.field textarea.control{padding-left:16px;min-height:140px;resize:vertical}
.control--plain{padding-left:16px!important}
.consent{display:flex;gap:11px;align-items:flex-start;font-size:.88rem}
.consent input{width:18px;height:18px;accent-color:var(--gold);flex:none;margin-top:4px}
.consent a{color:var(--gold-600);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.form-note{margin-top:14px;font-size:.82rem;color:var(--slate-400)}

.info-tile{display:flex;gap:16px;padding:22px;border-radius:var(--radius);background:#fff;border:1px solid var(--line-soft);transition:transform var(--t),box-shadow var(--t),border-color var(--t)}
.info-tile:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm);border-color:var(--gold-200)}
.info-tile i{width:50px;height:50px;flex:none;border-radius:15px;display:grid;place-items:center;background:var(--gold-50);color:var(--gold-600);border:1px solid var(--gold-200)}
.info-tile svg{width:22px;height:22px}
.info-tile h4{margin-bottom:5px}
.info-tile p,.info-tile a{font-size:.93rem;color:var(--slate);display:block}
.info-tile a:hover{color:var(--gold-600)}
.map-frame{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line-soft);box-shadow:var(--shadow-sm);line-height:0}
.map-frame iframe{width:100%;height:420px;border:0;filter:grayscale(.25) contrast(1.05)}

/* ---------- 22. Table ---------- */
.table-wrap{overflow-x:auto;border:1px solid var(--line-soft);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow-xs)}
table{width:100%;border-collapse:collapse;min-width:620px;font-size:.93rem}
thead th{
  background:var(--ink);color:#fff;text-align:left;padding:16px 20px;
  font-family:var(--font-display);font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;font-weight:600;
}
tbody td{padding:15px 20px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--gold-50)}
tbody td:first-child{font-weight:600;color:var(--ink)}
.pill{display:inline-block;padding:4px 12px;border-radius:var(--radius-pill);font-size:.76rem;font-weight:600;background:var(--gold-50);color:var(--gold-600);border:1px solid var(--gold-200)}
.airline-cell{display:flex;align-items:center;gap:12px}
.airline-cell img{height:26px;width:auto;flex:none}

/* ---------- 23. Job cards ---------- */
.job{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;
  padding:26px 28px;background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius);
  transition:transform var(--t),box-shadow var(--t),border-color var(--t);
}
.job:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--gold-200)}
.job h3{font-size:1.2rem;margin-bottom:8px}
.job-meta{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:.86rem;color:var(--slate)}
.job-meta span{display:flex;align-items:center;gap:7px}
.job-meta svg{width:15px;height:15px;color:var(--gold-600);flex:none}

/* ---------- 24. Footer ---------- */
.site-footer{background:var(--ink);color:#93A3B7;padding-top:clamp(56px,7vw,88px);position:relative;overflow:hidden}
.site-footer::before{
  content:"";position:absolute;top:-30%;left:-8%;width:min(560px,70vw);aspect-ratio:1;
  background:radial-gradient(circle,rgba(188,138,19,.16),transparent 65%);
}
.site-footer .container{position:relative;z-index:1}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.25fr;gap:clamp(28px,4vw,52px);padding-bottom:clamp(20px,2.6vw,30px)}
.footer-brand img{height:52px;margin-bottom:20px}
.footer-brand p{font-size:.92rem;max-width:38ch}
.footer-social{display:flex;gap:9px;margin-top:22px}
.footer-social a{
  width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.09);
  transition:background var(--t),transform var(--t),border-color var(--t),color var(--t);
}
.footer-social a:hover{background:var(--gold);border-color:var(--gold);color:#fff;transform:translateY(-3px)}
.footer-social svg{width:16px;height:16px}
.footer-col h4{color:#fff;font-size:1rem;margin-bottom:20px;position:relative;padding-bottom:14px}
.footer-col h4::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:2px;background:var(--gold);border-radius:2px}
.footer-links{display:grid;gap:11px}
.footer-links a{font-size:.92rem;display:inline-flex;align-items:center;gap:9px;transition:color var(--t),gap var(--t)}
.footer-links a::before{content:"";width:5px;height:5px;border-radius:50%;background:rgba(212,166,53,.55);flex:none;transition:background var(--t)}
.footer-links a:hover{color:#fff;gap:13px}
.footer-links a:hover::before{background:var(--gold)}
.footer-contact{display:grid;gap:16px}
.footer-contact li{display:flex;gap:13px;font-size:.92rem}
.footer-contact svg{width:17px;height:17px;color:var(--gold-400);flex:none;margin-top:4px}
.footer-contact a:hover{color:#fff}
.footer-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.footer-tags a{
  padding:6px 13px;border-radius:var(--radius-pill);font-size:.76rem;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);transition:var(--t);
}
.footer-tags a:hover{background:var(--gold);border-color:var(--gold);color:#fff}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.09);padding-block:24px;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;font-size:.86rem;
}
.footer-bottom nav{display:flex;flex-wrap:wrap;gap:8px 22px}
.footer-bottom a:hover{color:var(--gold-400)}

/* ---------- 25. Floating actions ---------- */
.float-wa{
  position:fixed;right:24px;bottom:26px;z-index:800;
  width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  background:#25D366;color:#fff;box-shadow:0 14px 32px -12px rgba(37,211,102,.85);
  transition:transform var(--t);
}
.float-wa:hover{transform:scale(1.08)}
.float-wa svg{width:28px;height:28px}
.float-wa::after{
  content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;
  animation:pulse 2.4s ease-out infinite;
}
@keyframes pulse{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.7);opacity:0}}
.to-top{
  position:fixed;right:30px;bottom:96px;z-index:800;width:44px;height:44px;border-radius:50%;
  background:var(--ink);color:#fff;display:grid;place-items:center;box-shadow:var(--shadow);
  opacity:0;visibility:hidden;transform:translateY(10px);transition:var(--t);
}
.to-top.is-visible{opacity:1;visibility:visible;transform:none}
.to-top:hover{background:var(--gold)}
.to-top svg{width:18px;height:18px}

/* ---------- 26. Reveal ---------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}

/* ---------- 27. Video hero ---------- */
.hero--video{background:var(--ink);isolation:isolate}
/* the decorative glow/grid layers are replaced by the footage */
.hero--video::before,.hero--video::after{display:none}

.hero-media{position:absolute;inset:0;z-index:-3;overflow:hidden}
.hero-media img,.hero-media video{
  width:100%;height:100%;object-fit:cover;object-position:center;
  transform:scale(1.04);
}
.hero-media img{position:absolute;inset:0}
.hero-media video{position:relative;opacity:0;transition:opacity 1.1s var(--ease)}
.hero-media video.is-ready{opacity:1}

/* Two-layer scrim: a directional wash for text contrast, plus a
   brand-tinted vignette so the footage reads as part of the palette. */
.hero-scrim{position:absolute;inset:0;z-index:-2;pointer-events:none}
.hero-scrim::before{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(100deg,rgba(6,12,22,.95) 0%,rgba(8,17,30,.86) 38%,rgba(11,21,36,.55) 66%,rgba(11,21,36,.42) 100%),
    linear-gradient(180deg,rgba(6,12,22,.72) 0%,transparent 26%,transparent 62%,rgba(6,12,22,.8) 100%);
}
.hero-scrim::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(120% 90% at 82% 18%,rgba(188,138,19,.3),transparent 58%);
  mix-blend-mode:screen;
}
/* fine grain keeps the gradient from banding on wide screens */
.hero-grain{
  position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.35;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:74px 74px;
  -webkit-mask-image:radial-gradient(ellipse at 22% 28%,#000,transparent 76%);
  mask-image:radial-gradient(ellipse at 22% 28%,#000,transparent 76%);
}
.hero--video .container{position:relative;z-index:1}

/* muted-audio hint / play state toggle */
.hero-vidbtn{
  position:absolute;right:calc(var(--gutter) + 4px);bottom:26px;z-index:2;
  display:inline-flex;align-items:center;gap:9px;
  padding:9px 16px 9px 12px;border-radius:var(--radius-pill);
  background:rgba(11,21,36,.5);border:1px solid rgba(255,255,255,.18);
  color:#DCE5EF;font-size:.78rem;font-weight:600;letter-spacing:.04em;
  backdrop-filter:blur(10px);transition:background var(--t),border-color var(--t),transform var(--t);
}
.hero-vidbtn:hover{background:rgba(11,21,36,.75);border-color:var(--gold);transform:translateY(-2px)}
.hero-vidbtn svg{width:15px;height:15px;color:var(--gold-400)}
.hero-vidbtn .lbl-play{display:none}
.hero-vidbtn.is-paused .lbl-play{display:inline}
.hero-vidbtn.is-paused .lbl-pause{display:none}

@media (prefers-reduced-motion:reduce){
  .hero-media video{display:none}
  .hero-vidbtn{display:none}
}
@media (max-width:768px){
  /* never ship 12MB of footage to a phone — the poster carries it */
  .hero-media video{display:none}
  .hero-vidbtn{display:none}
}

/* ---------- 28. Carousel ---------- */
.carousel{position:relative}
.carousel-viewport{
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;
  margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);
  padding-block:6px 10px;
}
.carousel-viewport::-webkit-scrollbar{display:none}
.carousel-track{display:flex;gap:var(--slide-gap,24px);align-items:stretch;--per-view:3}
.carousel-slide{
  flex:0 0 calc((100% - (var(--per-view) - 1) * var(--slide-gap,24px)) / var(--per-view));
  scroll-snap-align:start;min-width:0;
}
.carousel-slide > *{height:100%}

.carousel-ctrl{display:flex;align-items:center;gap:10px}
.carousel-btn{
  width:46px;height:46px;flex:none;border-radius:50%;display:grid;place-items:center;
  background:#fff;border:1.5px solid var(--line);color:var(--ink);
  transition:background var(--t),color var(--t),border-color var(--t),transform var(--t),opacity var(--t);
}
.carousel-btn svg{width:18px;height:18px}
.carousel-btn:hover:not(:disabled){background:var(--gold);border-color:var(--gold);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-gold)}
.carousel-btn:disabled{opacity:.35;cursor:not-allowed}
.section--ink .carousel-btn{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16);color:#fff}
.section--ink .carousel-btn:hover:not(:disabled){background:var(--gold);border-color:var(--gold)}

.carousel-dots{display:flex;justify-content:center;gap:8px;margin-top:26px}
.carousel-foot{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:26px}
.carousel-foot .carousel-dots{margin-top:0}
.carousel-dot{
  width:9px;height:9px;border-radius:var(--radius-pill);background:var(--line);
  transition:width var(--t),background var(--t);
}
.carousel-dot.is-active{width:30px;background:var(--gold)}
.section--ink .carousel-dot{background:rgba(255,255,255,.22)}
.section--ink .carousel-dot.is-active{background:var(--gold)}

@media (max-width:900px){  .carousel-track{--per-view:2} }
@media (max-width:620px){  .carousel-track{--per-view:1;--slide-gap:16px} }

/* ---------- 29. Polish layer ---------- */

/* Skip link — keyboard users shouldn't have to tab the whole nav */
.skip-link{
  position:absolute;left:50%;top:-64px;transform:translateX(-50%);z-index:1000;
  padding:12px 24px;border-radius:0 0 var(--radius-sm) var(--radius-sm);
  background:var(--ink);color:#fff;font-size:.9rem;font-weight:600;
  transition:top .25s var(--ease);
}
.skip-link:focus{top:0}

/* Reading-progress hairline pinned under the header */
.progress{
  position:fixed;top:0;left:0;height:3px;width:100%;z-index:999;
  background:transparent;pointer-events:none;
}
.progress span{
  display:block;height:100%;width:0;
  background:linear-gradient(90deg,var(--gold-600),var(--gold),var(--gold-200));
  box-shadow:0 0 12px rgba(188,138,19,.7);
  transition:width .12s linear;
}

/* Hero: scroll cue */
.hero-cue{
  display:inline-flex;align-items:center;gap:10px;margin-top:34px;
  font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;
  color:#8FA1B6;font-weight:600;
}
.hero-cue i{
  width:26px;height:40px;border-radius:var(--radius-pill);flex:none;
  border:1.5px solid rgba(255,255,255,.24);position:relative;
}
.hero-cue i::after{
  content:"";position:absolute;left:50%;top:9px;width:4px;height:8px;border-radius:4px;
  background:var(--gold-400);transform:translateX(-50%);
  animation:cue 1.9s var(--ease) infinite;
}
@keyframes cue{0%{opacity:0;transform:translate(-50%,-4px)}35%{opacity:1}100%{opacity:0;transform:translate(-50%,14px)}}

/* Hero: assurance rail replaces the plain trust list */
.hero-trust{
  gap:0;border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.09);
  padding-block:20px;margin-top:36px;
  display:grid;grid-template-columns:repeat(3,1fr);
}
.hero-trust li{position:relative;padding-inline:22px;font-size:.86rem;align-items:flex-start}
.hero-trust li:first-child{padding-left:0}
.hero-trust li + li::before{
  content:"";position:absolute;left:0;top:2px;bottom:2px;width:1px;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,.2),transparent);
}

/* Search card: titled header + gold cap */
.search-card{position:relative;overflow:hidden}
.search-card::before{
  content:"";position:absolute;inset:0 0 auto 0;height:4px;
  background:linear-gradient(90deg,var(--gold-600),var(--gold),var(--gold-200));
}
.search-head{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:8px 20px;margin-bottom:20px;
}
.search-head h2{font-size:clamp(1.2rem,1.05rem + .5vw,1.5rem);letter-spacing:-.02em}
.search-head p{font-size:.86rem;color:var(--slate-400);margin:0}
.search-head strong{color:var(--gold-600)}

/* Editorial hairline rail for the partner logos */
.logo-rail{border-block:1px solid var(--line-soft);padding-block:clamp(26px,3vw,38px)}
.rail-label{
  display:flex;align-items:center;justify-content:center;gap:14px;
  font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--slate-400);font-weight:700;margin:0 auto 28px;max-width:none;
}
.rail-label::before,.rail-label::after{
  content:"";height:1px;flex:1;max-width:110px;
  background:linear-gradient(90deg,transparent,var(--gold-200));
}
.rail-label::after{background:linear-gradient(90deg,var(--gold-200),transparent)}

/* Promise strip */
.promise{
  display:grid;grid-template-columns:repeat(4,1fr);
  border:1px solid var(--line-soft);border-radius:var(--radius-lg);
  background:#fff;box-shadow:var(--shadow-xs);overflow:hidden;
}
.promise li{
  display:flex;align-items:flex-start;gap:14px;padding:26px 24px;position:relative;
  transition:background var(--t);
}
.promise li:hover{background:var(--gold-50)}
.promise li + li::before{
  content:"";position:absolute;left:0;top:18px;bottom:18px;width:1px;background:var(--line-soft);
}
.promise i{
  width:40px;height:40px;flex:none;border-radius:12px;display:grid;place-items:center;
  background:var(--gold-50);border:1px solid var(--gold-200);color:var(--gold-600);
}
.promise svg{width:19px;height:19px}
.promise b{display:block;font-family:var(--font-display);font-size:.98rem;color:var(--ink);line-height:1.3}
.promise span{font-size:.83rem;color:var(--slate);display:block;margin-top:3px}

/* Destination fare badge + feature tile */
.dest-fare{
  position:absolute;top:16px;right:16px;z-index:1;
  padding:6px 13px;border-radius:var(--radius-pill);
  background:rgba(11,21,36,.62);border:1px solid rgba(255,255,255,.22);
  color:#fff;font-size:.75rem;font-weight:600;backdrop-filter:blur(8px);
}
.dest-fare b{color:var(--gold-400);font-weight:700}
.dest-grid--feature .dest:first-child{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.dest-grid--feature .dest:first-child .dest-body{padding:30px}
.dest-grid--feature .dest:first-child .dest-body h3{font-size:clamp(1.5rem,1.2rem + .9vw,2.1rem)}
.dest-blurb{margin-top:10px;font-size:.9rem;color:#C6D1DE;max-width:46ch}

/* Card hover lift refinement — gold ring instead of a hard border swap */
.card{will-change:transform}
.card::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 0 0 1px transparent;transition:box-shadow var(--t);
}
.card:hover::before{box-shadow:inset 0 0 0 1px var(--gold-200)}

@media (max-width:900px){
  .promise{grid-template-columns:repeat(2,1fr)}
  .promise li:nth-child(3)::before{display:none}
  .promise li:nth-child(odd)::before{display:none}
}
@media (max-width:768px){
  .hero-trust{grid-template-columns:1fr;gap:14px;padding-block:18px}
  .hero-trust li{padding-inline:0}
  .hero-trust li + li::before{display:none}
  .dest-grid--feature .dest:first-child{grid-column:span 2;grid-row:auto;aspect-ratio:16/10}
  .hero-cue{display:none}
}
@media (max-width:560px){
  .promise{grid-template-columns:1fr}
  .promise li::before{display:none!important}
  .dest-grid--feature .dest:first-child{grid-column:auto;aspect-ratio:4/3}
}

/* ---------- 29b. Transparent nav overlay (home) ----------
   The topbar + header float over the full-bleed video hero. On scroll the
   header re-solidifies (.is-stuck keeps the standard white design). JS sets
   --overlay-h to the combined topbar+header height so the hero can slide up
   underneath them. */
body.nav-overlay .topbar{
  background:transparent;position:relative;z-index:20;
  border-bottom:1px solid rgba(255,255,255,.1);
}
body.nav-overlay .site-header{
  background:transparent;border-bottom-color:transparent;
  backdrop-filter:none;-webkit-backdrop-filter:none;
}
/* white nav text while transparent */
body.nav-overlay .site-header:not(.is-stuck) .menu > li > a{color:#EAF0F7}
body.nav-overlay .site-header:not(.is-stuck) .menu > li > a:hover,
body.nav-overlay .site-header:not(.is-stuck) .menu > li.is-active > a{color:var(--gold-400);background:rgba(255,255,255,.08)}
body.nav-overlay .site-header:not(.is-stuck) .nav-phone span{color:#9FB0C4}
body.nav-overlay .site-header:not(.is-stuck) .nav-phone b{color:#fff}
body.nav-overlay .site-header:not(.is-stuck) .nav-phone i{background:rgba(255,255,255,.12);color:var(--gold-400)}
body.nav-overlay .site-header:not(.is-stuck) .burger{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.25)}
body.nav-overlay .site-header:not(.is-stuck) .burger span,
body.nav-overlay .site-header:not(.is-stuck) .burger span::before,
body.nav-overlay .site-header:not(.is-stuck) .burger span::after{background:#fff}

/* the stuck state restores the standard chrome + slides down cleanly */
body.nav-overlay .site-header.is-stuck{
  background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);
}

/* pull the hero up under the transparent chrome so the video runs full-bleed */
.hero--full{
  margin-top:calc(-1 * var(--overlay-h, 124px));
  padding-top:calc(var(--overlay-h, 124px) + clamp(46px,6vw,92px));
  min-height:clamp(620px,92vh,900px);
  display:flex;align-items:center;
}
.hero--full .container{width:100%}

@media (max-width:1024px){
  body.nav-overlay .drawer .drawer-body a{color:var(--ink)}
}

/* ---------- 30. Destination detail ---------- */
.page-hero--img{padding-block:clamp(72px,9vw,130px);isolation:isolate}
.page-hero--img::before{display:none}
.page-hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.page-hero-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.03)}
.page-hero--img::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(95deg,rgba(6,12,22,.94) 0%,rgba(8,17,30,.82) 42%,rgba(11,21,36,.5) 100%),
    linear-gradient(180deg,rgba(6,12,22,.66),transparent 34%,rgba(6,12,22,.72));
}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:10px;margin-bottom:16px;
  padding:7px 16px;border-radius:var(--radius-pill);
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);
  font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-400);
  backdrop-filter:blur(8px);
}

/* Quick-facts bar under a detail hero */
.factbar{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  margin-top:clamp(28px,4vw,44px);border-radius:var(--radius);overflow:hidden;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.16);
}
.factbar li{background:rgba(8,16,28,.62);padding:20px 22px;backdrop-filter:blur(10px)}
.factbar span{
  display:block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;
  color:#8FA1B6;font-weight:700;margin-bottom:6px;
}
.factbar b{font-family:var(--font-display);font-size:1.02rem;color:#fff;font-weight:600;line-height:1.35}
.factbar b em{font-style:normal;color:var(--gold-400)}

/* Spec list (key/value pairs) */
.speclist{display:grid;gap:0;border:1px solid var(--line-soft);border-radius:var(--radius);overflow:hidden;background:#fff}
.speclist li{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 18px;
  padding:15px 22px;border-bottom:1px solid var(--line-soft);font-size:.93rem;
}
.speclist li:last-child{border-bottom:0}
.speclist li:nth-child(odd){background:var(--cream)}
.speclist dt,.speclist .k{color:var(--slate);font-weight:500}
.speclist dd,.speclist .v{color:var(--ink);font-weight:600;font-family:var(--font-display);text-align:right}

/* Fare cards */
.fare-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,24px)}
.fare-card{
  background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius);
  padding:26px;position:relative;transition:transform var(--t),box-shadow var(--t),border-color var(--t);
}
.fare-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--gold-200)}
.fare-card.is-featured{border-color:var(--gold);box-shadow:var(--shadow-sm)}
.fare-card .cabin{
  font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-600);font-weight:700;
}
.fare-card .amount{
  display:flex;align-items:baseline;gap:7px;margin:12px 0 4px;
  font-family:var(--font-display);font-weight:700;color:var(--ink);
}
.fare-card .amount i{font-style:normal;font-size:.9rem;color:var(--slate);font-weight:600}
.fare-card .amount b{font-size:clamp(1.7rem,1.4rem + .9vw,2.2rem);line-height:1}
.fare-card .per{font-size:.82rem;color:var(--slate-400)}
.fare-card ul{margin-top:18px;display:grid;gap:9px}
.fare-card li{display:flex;gap:10px;font-size:.89rem}
.fare-card li svg{width:15px;height:15px;color:var(--gold);flex:none;margin-top:4px}
.fare-ribbon{
  position:absolute;top:-1px;right:20px;padding:5px 13px;border-radius:0 0 10px 10px;
  background:var(--gold);color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
}

/* Highlight chips */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.chips li{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 16px;border-radius:var(--radius-pill);
  background:var(--gold-50);border:1px solid var(--gold-200);
  font-size:.88rem;color:var(--ink-500);font-weight:500;
}
.chips svg{width:14px;height:14px;color:var(--gold-600);flex:none}

/* Season meter */
.seasons{display:grid;grid-template-columns:repeat(12,1fr);gap:5px;margin-top:20px}
.season{text-align:center}
.season i{
  display:block;height:44px;border-radius:7px;background:var(--line-soft);
  position:relative;overflow:hidden;
}
.season i::after{
  content:"";position:absolute;inset:auto 0 0 0;
  background:linear-gradient(180deg,var(--gold-400),var(--gold-600));
  height:var(--lvl,20%);
}
.season.is-peak i::after{background:linear-gradient(180deg,#E4B94A,var(--gold))}
.season.is-value i::after{background:linear-gradient(180deg,#7FD1A8,var(--success))}
.season span{display:block;margin-top:8px;font-size:.7rem;font-weight:700;letter-spacing:.06em;color:var(--slate-400);text-transform:uppercase}
.season-key{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:20px;font-size:.84rem;color:var(--slate)}
.season-key span{display:flex;align-items:center;gap:8px}
.season-key i{width:12px;height:12px;border-radius:3px;flex:none}

@media (max-width:900px){
  .factbar{grid-template-columns:repeat(2,1fr)}
  .fare-grid{grid-template-columns:1fr}
  .seasons{grid-template-columns:repeat(6,1fr);gap:8px}
}
@media (max-width:560px){
  .factbar{grid-template-columns:1fr}
  .seasons{grid-template-columns:repeat(4,1fr)}
  .speclist dd,.speclist .v{text-align:left}
}

/* ---------- 31. Responsive ---------- */
@media (max-width:1340px){
  .menu > li > a{padding:10px 10px;font-size:.87rem}
  .nav-phone i{display:none}
  .nav-phone b{font-size:.9rem}
}
@media (max-width:1180px){
  .menu{gap:0}
  .menu > li > a{padding:10px 8px;font-size:.84rem}
  .nav-phone{display:none}
}
@media (max-width:1024px){
  .topbar-list li:nth-child(3){display:none}
  .burger{display:grid}
  .menu,.nav-phone{display:none}
  .hero-grid{grid-template-columns:1fr;gap:52px}
  .hero-visual{max-width:560px}
  .split{grid-template-columns:1fr;gap:40px}
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .dest-grid{grid-template-columns:repeat(3,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .steps::before{display:none}
  .footer-grid{grid-template-columns:repeat(2,1fr)}
  .field-row{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:768px){
  .topbar-list li:nth-child(2){display:none}
  .grid-3{grid-template-columns:1fr}
  .dest-grid{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .hero-badge{position:static;margin-top:18px;width:fit-content}
  .media--stack img:first-child{grid-row:auto;aspect-ratio:4/3}
  .form-grid{grid-template-columns:1fr}
  .job{flex-direction:column;align-items:flex-start}
  .footer-bottom{flex-direction:column;text-align:center;justify-content:center}
  .map-frame iframe{height:320px}
}
@media (max-width:560px){
  .grid-2,.grid-4{grid-template-columns:1fr}
  .dest-grid{grid-template-columns:1fr}
  .field-row{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .topbar-list li:first-child{display:none}
  .btn{width:100%}
  .btn-row{flex-direction:column;align-items:stretch}
  .brand img{height:38px}
  .marquee-track img{height:30px}
  .card-num{font-size:2.1rem}
}

/* ==========================================================================
   32. CORPORATE POLISH LAYER
   Site-wide refinements: typography rhythm, focus, motion, consistency.
   ========================================================================== */

/* --- Typographic finish --- */
body{font-feature-settings:"kern" 1,"liga" 1,"calt" 1}
h1,h2,h3,h4,h5,h6{text-wrap:balance}      /* avoid orphaned single words in headings */
p,li{text-wrap:pretty}                     /* nicer ragged edges, fewer widows */
.lead{max-width:60ch}
.eyebrow{position:relative}

/* Tabular figures wherever numbers must line up */
.stat b,.route-node b,.fare-price,.factbar b,.fare-card .amount b,
.speclist .v,.nav-phone b,table td,.hero-badge b{font-variant-numeric:tabular-nums}

/* --- Unified focus ring (accessible, on-brand) --- */
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,.tab:focus-visible,
.acc-head:focus-visible,.carousel-btn:focus-visible,.dest:focus-visible{
  outline:2px solid var(--gold);outline-offset:3px;border-radius:8px;
}
.btn:focus-visible{outline-offset:4px}
/* dark surfaces need a lighter ring */
.section--ink a:focus-visible,.hero a:focus-visible,.page-hero a:focus-visible,
.site-footer a:focus-visible,.cta-band a:focus-visible,
body.nav-overlay .site-header:not(.is-stuck) a:focus-visible{outline-color:var(--gold-400)}

/* --- Buttons: subtle sheen + crisper press --- */
.btn{overflow:hidden;isolation:isolate;transition:transform var(--t),box-shadow var(--t),background var(--t),color var(--t),border-color var(--t)}
.btn::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .6s var(--ease);
}
.btn:hover::after{transform:translateX(120%)}
.btn:active{transform:translateY(0) scale(.99)}

/* --- Links in body copy (policy/detail pages) --- */
.acc-body-inner a,.form-note a,.info-tile a[href^="mailto"],
.dest-blurb a{text-underline-offset:3px}

/* --- Selection consistency on dark --- */
.section--ink ::selection,.hero ::selection,.page-hero ::selection,
.site-footer ::selection,.cta-band ::selection{background:var(--gold-400);color:var(--ink)}

/* --- Cards: smoother, more premium easing + inner highlight --- */
.card,.quote-card,.info-tile,.job,.fare-card,.dest,.feature{
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease),background .45s var(--ease);
}
.card-icon{transition:transform .45s var(--ease),background .45s var(--ease),color .45s var(--ease)}

/* --- Header brand: gentle hover --- */
.brand{transition:opacity var(--t)}
.brand:hover{opacity:.82}

/* --- Search tabs: active indicator polish already gold; add press --- */
.tab:active{transform:translateY(0) scale(.98)}

/* --- Footer: crisper link rhythm + focus --- */
.footer-links a,.footer-contact a,.footer-tags a,.footer-bottom a{border-radius:4px}

/* --- Marquee: pause affordance for reduced-motion already handled --- */

/* --- Consistent max-width for prose-heavy inner sections --- */
.acc-body-inner p,.acc-body-inner li{max-width:70ch}

/* --- Loading state for images (avoid layout flash) --- */
.dest img,.media img,.page-hero-media img,.hero-media img{background:var(--line-soft)}

/* --- Refined scrollbar (desktop) --- */
@supports (scrollbar-width: thin){
  html{scrollbar-width:thin;scrollbar-color:var(--gold-200) transparent}
}
::-webkit-scrollbar{width:11px;height:11px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--gold-200);border-radius:20px;border:3px solid var(--white)}
::-webkit-scrollbar-thumb:hover{background:var(--gold)}

/* --- Larger tap targets on touch --- */
@media (hover:none){
  .menu > li > a,.footer-links a,.submenu a{padding-block:12px}
  .btn{padding-block:15px}
}

/* --- Print: keep it clean --- */

/* ---------- 33. Print ---------- */
@media print{
  .site-header,.topbar,.float-wa,.to-top,.site-footer,.drawer,.nav-scrim{display:none!important}
  body{color:#000}
  .hero,.page-hero,.section--ink{background:#fff!important;color:#000!important}
  .reveal{opacity:1;transform:none}
}

/* ---------- 34. Form alerts (Laravel flash) ---------- */
.form-alert{padding:14px 18px;border-radius:var(--radius-sm);margin-bottom:20px;font-size:.92rem;font-weight:500;display:flex;align-items:center;gap:10px}
.form-alert--ok{background:#ECFDF5;border:1px solid #A7F3D0;color:#065F46}
.form-alert--err{background:#FEF2F2;border:1px solid #FECACA;color:#991B1B}
.form-alert::before{content:"";width:8px;height:8px;border-radius:50%;flex:none;background:currentColor}

/* ---------- 35. Flash toast ---------- */
.flash-toast{position:fixed;top:20px;left:50%;transform:translateX(-50%);z-index:990;
  display:flex;align-items:center;gap:14px;max-width:min(560px,92vw);
  padding:14px 18px;border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);
  font-size:.93rem;font-weight:500;animation:toastIn .5s var(--ease)}
.flash-toast--ok{background:#065F46;color:#fff}
.flash-toast--err{background:#991B1B;color:#fff}
.flash-close{color:inherit;font-size:1.4rem;line-height:1;opacity:.8;flex:none}
.flash-close:hover{opacity:1}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,-14px)}to{opacity:1;transform:translate(-50%,0)}}

/* ==========================================================================
   36. MOBILE-FIRST UX LAYER  (≤768px)
   Thumb-reachable actions, bigger touch targets, less desktop weight.
   ========================================================================== */

/* --- Sticky bottom action bar: primary conversions within thumb reach --- */
.mobile-bar{display:none}
@media (max-width:768px){
  .mobile-bar{
    display:grid;grid-template-columns:1fr 1fr 1fr;
    position:fixed;left:0;right:0;bottom:0;z-index:850;
    background:rgba(255,255,255,.97);backdrop-filter:saturate(180%) blur(12px);
    border-top:1px solid var(--line-soft);
    padding:8px 8px calc(8px + env(safe-area-inset-bottom,0));
    box-shadow:0 -8px 28px -18px rgba(11,21,36,.4);
  }
  .mobile-bar a{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    min-height:52px;border-radius:var(--radius-sm);
    font-size:.72rem;font-weight:600;letter-spacing:.01em;color:var(--ink-500);
    transition:background var(--t),color var(--t);
  }
  .mobile-bar a svg{width:21px;height:21px}
  .mobile-bar a:active{background:var(--gold-50)}
  .mobile-bar a.is-primary{background:var(--gold);color:#fff}
  .mobile-bar a.is-wa{color:#128C4B}
  .mobile-bar a.is-wa svg{color:#25D366}

  /* lift page content so the bar never covers the footer's last row */
  body{padding-bottom:70px}
  /* the floating bubble + to-top would collide with the bar — retire them */
  .float-wa{display:none}
  .to-top{bottom:80px;right:14px}
}

/* --- Bigger, calmer touch targets --- */
@media (max-width:768px){
  .btn{min-height:50px;padding-block:14px}
  .drawer-body a{padding-block:15px;font-size:1.05rem}
  .drawer-body .sub a{font-size:.95rem}
  .tab{min-height:46px;padding-block:12px}
  .acc-head{padding-block:18px;min-height:56px}
  .field .control{min-height:50px;font-size:16px}       /* 16px stops iOS zoom-on-focus */
  .dest{aspect-ratio:4/3}                                 /* shorter cards = less scrolling */
  .card,.quote-card,.info-tile{padding:22px}
}

/* --- Performance: kill heavy motion on small screens --- */
@media (max-width:768px){
  .hero::after,.section--pattern::before{display:none}   /* drop decorative grids */
  .reveal{transition-duration:.45s}                       /* snappier reveals */
  .dest:hover img,.card:hover{transform:none}             /* no hover transforms on touch */
  .marquee-track{animation-duration:24s}
}
@media (max-width:768px) and (prefers-reduced-data:reduce){
  .hero-media img{display:none}                           /* respect data-saver */
}

/* --- Trim desktop-only chrome on mobile --- */
@media (max-width:768px){
  .hero-trust{gap:10px}
  .hero-badge{display:none}                               /* decorative rating chip */
  .search-note span:nth-child(3){display:none}            /* keep the note short */
}

/* --- Mobile typography rhythm --- */
@media (max-width:560px){
  :root{--section-y:clamp(48px,11vw,72px)}                /* tighter vertical rhythm */
  h1{font-size:clamp(2rem,1.5rem + 4vw,2.6rem)}
  .lead{font-size:1rem}
  .section-head{margin-bottom:28px}
}

/* ==========================================================================
   37. PREMIUM POLISH v2  — depth, gold light, refined physics
   Appended last so it elevates the base system without touching structure.
   ========================================================================== */

:root{
  /* Layered, softer shadows read as "expensive" vs a single flat drop */
  --shadow-xs:0 1px 2px rgba(11,21,36,.05);
  --shadow-sm:0 2px 6px -2px rgba(11,21,36,.08),0 8px 20px -12px rgba(11,21,36,.18);
  --shadow:0 3px 8px -3px rgba(11,21,36,.07),0 14px 30px -14px rgba(11,21,36,.18),0 40px 80px -44px rgba(11,21,36,.28);
  --shadow-lg:0 6px 16px -6px rgba(11,21,36,.10),0 28px 56px -24px rgba(11,21,36,.30),0 60px 120px -60px rgba(11,21,36,.5);
  --shadow-gold:0 8px 20px -8px rgba(188,138,19,.45),0 20px 44px -18px rgba(188,138,19,.5);
  --ease:cubic-bezier(.16,.84,.44,1);
  --gold-grad:linear-gradient(135deg,#E4B94A 0%,#BC8A13 55%,#A5760C 100%);
}

/* --- Gold gradient text on hero emphasis (richer than flat gold) --- */
.hero h1 em{
  background:linear-gradient(120deg,#F0CE6A 0%,#D4A635 40%,#BC8A13 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--gold-400);
}
.hero h1 em::after{height:.1em;background:linear-gradient(90deg,var(--gold-400),rgba(212,166,53,0))}

/* --- Eyebrow: a lit dot + gradient bar for a crafted detail --- */
.eyebrow::before{height:2px;background:var(--gold-grad);box-shadow:0 0 8px rgba(212,166,53,.4)}

/* --- Buttons: richer gold, refined press physics --- */
.btn--dark,.btn{transition:transform .4s var(--ease),box-shadow .4s var(--ease),background .3s,color .3s,border-color .3s}
.btn:not(.btn--ghost):not(.btn--outline-light):not(.btn--light):not(.btn--wa){
  background:var(--gold-grad);border-color:transparent;
}
.btn:hover{transform:translateY(-3px)}
.btn:active{transform:translateY(-1px) scale(.985)}

/* --- Cards: gold-lit hover ring + smoother, deeper lift --- */
.card,.quote-card,.info-tile,.job,.feature{transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease),background .5s var(--ease)}
.card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:var(--gold-200)}
.card:hover::before{box-shadow:inset 0 0 0 1px var(--gold-200),0 0 0 4px rgba(212,166,53,.08)}
.card-icon{box-shadow:0 6px 16px -10px rgba(188,138,19,.5) inset,0 1px 0 rgba(255,255,255,.6)}
.card:hover .card-icon{box-shadow:var(--shadow-gold)}

/* --- Search card: premium float + brighter gold cap --- */
.search-card{box-shadow:var(--shadow-lg);border-color:var(--line-soft)}
.search-card::before{height:4px;background:var(--gold-grad);box-shadow:0 1px 8px rgba(212,166,53,.5)}
.field .control:focus{box-shadow:0 0 0 4px rgba(188,138,19,.14),0 4px 12px -6px rgba(188,138,19,.3)}
.tab.is-active{background:var(--gold-grad);box-shadow:var(--shadow-gold)}

/* --- Hero: deeper cinematic scrim + soft vignette for premium contrast --- */
.hero--video .hero-scrim::before{
  background:
    linear-gradient(103deg,rgba(5,10,18,.96) 0%,rgba(7,14,26,.88) 34%,rgba(11,21,36,.5) 64%,rgba(11,21,36,.34) 100%),
    linear-gradient(180deg,rgba(5,10,18,.7) 0%,transparent 22%,transparent 60%,rgba(5,10,18,.82) 100%);
}
.hero--video::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  box-shadow:inset 0 0 220px 40px rgba(5,10,18,.55);
}
.hero-card{box-shadow:var(--shadow-lg)}
.hero--video .hero-card{border-color:rgba(212,166,53,.16);box-shadow:0 40px 90px -50px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.06)}

/* --- Destination cards: slower, richer zoom + refined overlay + gold tag --- */
.dest img{transition:transform 1.1s var(--ease),filter 1.1s var(--ease)}
.dest:hover img{transform:scale(1.08);filter:saturate(1.08)}
.dest::before{background:linear-gradient(180deg,rgba(11,21,36,0) 24%,rgba(11,21,36,.5) 58%,rgba(8,15,26,.95) 100%)}
.dest:hover{box-shadow:var(--shadow-lg)}
.dest-tag{box-shadow:0 4px 12px -6px rgba(11,21,36,.4);font-weight:700}
.dest-body h3{transition:transform .5s var(--ease)}
.dest:hover .dest-body h3{transform:translateY(-2px)}

/* --- Section headings: tighter, more confident display tracking --- */
h1{letter-spacing:-.04em}
h2{letter-spacing:-.032em}

/* --- Links & arrows: smoother --- */
.link-arrow{transition:gap .4s var(--ease),color .3s}
.link-arrow:hover{gap:12px}

/* --- Marquee logos: gentle lift on hover for tactility --- */
.marquee-track img{transition:filter .4s var(--ease),opacity .4s var(--ease),transform .4s var(--ease)}
.marquee-track img:hover{transform:translateY(-3px) scale(1.04)}

/* --- CTA band: subtle inner sheen --- */
.cta-band{box-shadow:var(--shadow-lg),inset 0 1px 0 rgba(255,255,255,.06)}
.cta-band::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background:radial-gradient(120% 100% at 15% 0%,rgba(212,166,53,.14),transparent 55%);
}

/* --- Reveal: gentler, more premium entrance --- */
.reveal{transform:translateY(22px) scale(.995)}
.reveal.is-in{transform:none;transition:opacity .8s var(--ease),transform .8s var(--ease)}

/* --- Stat numbers: subtle gradient gold on light stat blocks --- */
.stats--light .stat b{
  background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}

/* --- Feature icons + info tiles: refined --- */
.feature:hover{box-shadow:var(--shadow)}
.info-tile:hover{box-shadow:var(--shadow);border-color:var(--gold-200)}

@media (prefers-reduced-motion:reduce){
  .dest:hover img,.dest:hover .dest-body h3,.marquee-track img:hover{transform:none}
}

/* --- fix: keep the destination tag from colliding with the fare badge --- */
.dest-tag{max-width:calc(100% - 130px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dest-grid--feature .dest:first-child .dest-tag{max-width:none}
.dest-fare{z-index:2}

/* ==========================================================================
   38. PREMIUM — Booking & Contact (forms, tiles, map)
   ========================================================================== */

/* --- Contact info tiles: gradient-gold icons + premium lift --- */
.info-tile{
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease);
  position:relative;overflow:hidden;
}
.info-tile::after{
  content:"";position:absolute;inset:0 0 auto 0;height:3px;transform:scaleX(0);transform-origin:left;
  background:var(--gold-grad);transition:transform .5s var(--ease);
}
.info-tile:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:var(--gold-200)}
.info-tile:hover::after{transform:scaleX(1)}
.info-tile i{
  background:var(--gold-grad);color:#fff;border-color:transparent;
  box-shadow:0 8px 18px -10px rgba(188,138,19,.6),inset 0 1px 0 rgba(255,255,255,.35);
}

/* --- Form card: gold top hairline, layered float, generous surface --- */
.form-card{
  position:relative;overflow:hidden;box-shadow:var(--shadow);border-color:var(--line-soft);
}
.form-card::before{
  content:"";position:absolute;inset:0 0 auto 0;height:4px;
  background:var(--gold-grad);box-shadow:0 1px 8px rgba(212,166,53,.45);
}
.form-card .eyebrow{margin-top:4px}

/* --- Fields: premium filled + focus states --- */
.field .control{transition:border-color .3s,background .3s,box-shadow .35s var(--ease)}
.field .control:hover:not(:focus){border-color:var(--gold-200)}
.field .control:focus{
  border-color:var(--gold);background:#fff;
  box-shadow:0 0 0 4px rgba(188,138,19,.13),0 6px 16px -8px rgba(188,138,19,.28);
}
.field label{transition:color .3s}
.field:focus-within label{color:var(--gold-600)}
.consent{transition:color .3s}
.consent input{accent-color:var(--gold)}

/* --- Office-hours dark card: warmer depth + gold rule --- */
.card--ink,.card[style*="--ink"]{position:relative;overflow:hidden}
.form-card + *, .split .card{will-change:transform}

/* --- Map frame: refined frame + hover reveal of colour --- */
.map-frame{box-shadow:var(--shadow);border-color:var(--line-soft);transition:box-shadow .5s var(--ease)}
.map-frame iframe{filter:grayscale(.35) contrast(1.05);transition:filter .6s var(--ease)}
.map-frame:hover iframe{filter:grayscale(0) contrast(1)}

/* --- Booking tabs on the search card: premium active + hover --- */
.tabs .tab{transition:all .35s var(--ease)}
.tab:hover:not(.is-active){transform:translateY(-2px);border-color:var(--gold-200)}

/* --- Inner page hero: subtle gold aurora for depth --- */
.page-hero{position:relative}
.page-hero::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.6;
  background:radial-gradient(70% 90% at 92% 0%,rgba(212,166,53,.18),transparent 60%);
}
.page-hero .container{position:relative;z-index:1}

/* --- Submit buttons in forms: full-gradient + lift already inherited --- */
.form-card .btn,.search-card .btn{box-shadow:var(--shadow-gold)}
.form-card .btn:hover,.search-card .btn:hover{box-shadow:0 12px 30px -10px rgba(188,138,19,.7)}

/* --- Section-level premium rhythm on form pages --- */
.form-note{font-size:.85rem}

/* ==========================================================================
   39. PREMIUM — Accordions (FAQ · Services · Booking)
   ========================================================================== */

.accordion{--acc-ease:cubic-bezier(.16,.84,.44,1)}

/* base card: refined border + smoother transitions */
.acc{
  position:relative;background:var(--surface,#fff);border:1px solid var(--line-soft);
  border-radius:var(--radius-sm);overflow:hidden;
  transition:border-color .4s var(--acc-ease),box-shadow .4s var(--acc-ease),transform .4s var(--acc-ease),background .4s var(--acc-ease);
}
/* a gold rail slides in on the left when open — the crafted "you are here" cue */
.acc::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--gold-grad,linear-gradient(180deg,#D4A635,#BC8A13));
  transform:scaleY(0);transform-origin:top;transition:transform .45s var(--acc-ease);
}

/* hover (closed): hint the gold, gentle lift */
.acc:not(.is-open):hover{border-color:var(--gold-200);box-shadow:var(--shadow-sm);transform:translateY(-1px)}

/* open: gold rail, warm tint, layered float */
.acc.is-open{
  border-color:var(--gold-200);
  box-shadow:0 4px 12px -6px rgba(188,138,19,.14),0 16px 34px -20px rgba(11,21,36,.22);
  background:linear-gradient(180deg,var(--gold-50) 0%,var(--surface,#fff) 26%);
}
.acc.is-open::before{transform:scaleY(1)}

/* head: refined type + hover colour */
.acc-head{padding:20px 24px;gap:20px;transition:color .3s var(--acc-ease)}
.acc-head:hover{color:var(--gold-600)}
.acc.is-open .acc-head{color:var(--ink)}

/* chevron chip: gradient gold + spring rotate when open */
.acc-head i{
  width:32px;height:32px;background:var(--gold-50);color:var(--gold-600);
  border:1px solid var(--gold-200);
  transition:transform .5s var(--acc-ease),background .4s var(--acc-ease),color .4s var(--acc-ease),box-shadow .4s var(--acc-ease);
}
.acc-head:hover i{border-color:var(--gold)}
.acc.is-open .acc-head i{
  background:var(--gold-grad,linear-gradient(135deg,#D4A635,#BC8A13));color:#fff;border-color:transparent;
  transform:rotate(180deg);
  box-shadow:0 6px 14px -6px rgba(188,138,19,.6),inset 0 1px 0 rgba(255,255,255,.3);
}

/* body: hairline divider + smoother reveal */
.acc-body{transition:max-height .5s var(--acc-ease)}
.acc.is-open .acc-body-inner{border-top:1px solid var(--gold-100,rgba(212,166,53,.18))}
.acc-body-inner{padding:16px 24px 22px;color:var(--slate)}
.acc-body-inner p{color:var(--slate)}
.acc-body-inner strong{color:var(--ink)}
/* bullet lists inside answers — gold markers */
.acc-body-inner li::before{background:var(--gold-grad,var(--gold))}

/* FAQ category section heads: a touch more air + gold eyebrow already gold */
#main .container--narrow .section-head + .accordion{margin-bottom:8px}

/* ==========================================================================
   40. Popular-routes SLIDER (hero card)
   ========================================================================== */
.route-slider{overflow:hidden}
.route-card-head{margin-bottom:22px}
.route-card-head h4{margin-bottom:4px}
.route-viewport{overflow:hidden;margin-inline:-2px;padding-inline:2px}
.route-track{
  display:flex;align-items:stretch;
  transition:transform .7s cubic-bezier(.16,.84,.44,1);
  will-change:transform;
}
.route-slide{flex:0 0 100%;min-width:0}
.route-slide .route{margin-bottom:20px}
.route-slide .fare-list{display:grid;gap:10px}

/* dots */
.route-dots{display:flex;gap:8px;justify-content:center;margin-top:20px}
.route-dot{
  width:8px;height:8px;border-radius:99px;background:rgba(255,255,255,.24);
  cursor:pointer;transition:width .45s cubic-bezier(.16,.84,.44,1),background .45s;
}
.route-dot:hover{background:rgba(255,255,255,.45)}
.route-dot.is-active{width:26px;background:var(--gold-grad,var(--gold-400));box-shadow:0 0 10px rgba(212,166,53,.5)}

/* on the light (non-video) hero fallback, dots go gold-on-dark differently */
.hero:not(.hero--video) .route-dot{background:var(--line)}
.hero:not(.hero--video) .route-dot.is-active{background:var(--gold)}

@media (prefers-reduced-motion:reduce){
  .route-track{transition:none}
}

/* --- fix: let the slider viewport clip instead of forcing the hero column wide --- */
.hero-visual{min-width:0}
.hero-card.route-slider{min-width:0;max-width:100%}
.route-viewport{width:100%}

/* slider: viewport clips the carousel; slides keep their content unclipped */
.route-viewport{overflow:hidden}
.route-slide{padding-inline:1px}
.route-slide .route-node:last-child{padding-right:2px}

/* ==========================================================================
   41. PREMIUM — "Popular routes today" card
   ========================================================================== */

/* fix clipping: viewport clips the carousel cleanly, no negative margins */
.route-viewport{overflow:hidden;margin:0;padding:0;width:100%;border-radius:2px}
.route-slide{padding:0;overflow:visible}

/* header row: heading + live badge */
.route-card-head{margin-bottom:20px}
.route-head-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.route-head-top h4{margin:0}
.route-live{
  display:inline-flex;align-items:center;gap:7px;flex:none;
  font-size:.68rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gold-400);padding:5px 11px;border-radius:99px;
  background:rgba(212,166,53,.12);border:1px solid rgba(212,166,53,.28);
}
.route-live i{
  width:7px;height:7px;border-radius:50%;background:var(--gold-400);flex:none;position:relative;
  box-shadow:0 0 0 0 rgba(212,166,53,.6);animation:routePulse 2s ease-out infinite;
}
@keyframes routePulse{0%{box-shadow:0 0 0 0 rgba(212,166,53,.55)}70%{box-shadow:0 0 0 7px rgba(212,166,53,0)}100%{box-shadow:0 0 0 0 rgba(212,166,53,0)}}

/* route row: breathing room so airport codes never clip at the card edge */
.route-slide .route{margin-bottom:20px;padding-inline:2px}
.route-node b{letter-spacing:-.02em}
.route-node:last-child{padding-right:1px}
.route-line svg{filter:drop-shadow(0 2px 4px rgba(212,166,53,.4))}

/* fare rows: premium glass + gold price + hover glide */
.route-slide .fare-item{
  transition:background .4s var(--ease),border-color .4s var(--ease),transform .4s var(--ease);
}
.route-slide .fare-item:hover{transform:translateX(3px)}
.route-slide .fare-price{font-weight:700}

/* dots: gold gradient active (already set) — add breathing room */
.route-dots{margin-top:18px}

@media (prefers-reduced-motion:reduce){
  .route-live i{animation:none}
}

/* ==========================================================================
   42. FIX — destination name clipping in the routes card
   The viewport's overflow:hidden was clipping the right-aligned destination
   flush at the edge. Extend the viewport into the card padding so the clip
   happens *outside* the content, and give the route real end padding.
   ========================================================================== */
.route-viewport{
  overflow:hidden;
  margin-inline:-16px;
  padding-inline:16px;
}
.route-slide .route{
  padding-inline:2px;
  gap:16px;
}
.route-slide .route-node:first-child{padding-left:2px}
.route-slide .route-node:last-child{padding-right:4px}
.route-slide .route-node b{white-space:nowrap}
.route-slide .route-node span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ==========================================================================
   43. FIX v2 — clip without revealing neighbouring slides
   Keep the viewport clip tight (no gutter) and instead inset the slide's
   OWN content, so the right-aligned destination never touches the edge and
   adjacent slides stay fully hidden.
   ========================================================================== */
.route-viewport{overflow:hidden;margin:0;padding:0;width:100%}
.route-slide{padding:0 5px}
.route-slide .route{padding:0;gap:14px}
.route-slide .route-node:first-child{padding-left:0}
.route-slide .route-node:last-child{padding-right:6px}
/* align the header + fares with the padded slide content */
.route-card-head{padding:0 5px}

/* ==========================================================================
   44. Routes progress bar — plane flying (left → right) to the destination
   ONE clean implementation (supersedes the earlier layered attempts).
   The gold trail is anchored to the left edge and grows rightward; the plane
   is a child of that trail, pinned to its leading (right) tip, nose pointing
   right, so it rides the front of the progress toward the destination marker
   on the right. When the trail reaches it, JS auto-advances the slide.
   ========================================================================== */
.route-progress{position:relative;height:22px;margin-top:12px;background:none;overflow:visible}
/* dotted flight path */
.route-progress::before{
  content:"";position:absolute;left:2px;right:8px;top:50%;height:2px;transform:translateY(-50%);
  background-image:radial-gradient(circle,rgba(255,255,255,.32) 1px,transparent 1px);
  background-size:8px 2px;background-repeat:repeat-x;
}
/* destination marker (right — the plane flies toward it) */
.route-progress::after{
  content:"";position:absolute;right:3px;top:50%;width:9px;height:9px;border-radius:50%;
  transform:translate(50%,-50%);background:var(--gold-400);
  box-shadow:0 0 0 3px rgba(212,166,53,.18),0 0 10px rgba(212,166,53,.6);
}
/* the growing gold trail — anchored left, grows rightward */
.route-progress-fill{
  position:absolute;left:2px;top:50%;height:2px;transform:translateY(-50%);
  width:14px;max-width:calc(100% - 16px);overflow:visible;
  background:var(--gold-grad,var(--gold-400));border-radius:2px;
  box-shadow:0 0 8px rgba(212,166,53,.55);
  animation:routeTrail var(--route-delay,5200ms) linear infinite;
}
@keyframes routeTrail{0%{width:14px}100%{width:calc(100% - 16px)}}
/* the plane pinned to the trail's leading (right) edge, nose pointing right */
.route-plane{
  position:absolute;right:0;top:50%;width:20px;height:20px;display:block;
  transform:translate(55%,-50%);
  color:var(--gold-400);line-height:0;z-index:2;
  filter:drop-shadow(0 2px 5px rgba(212,166,53,.6));
}
.route-plane svg{width:20px;height:20px;max-width:none;display:block;transform:rotate(90deg)}
/* pause while the visitor is reading */
.route-slider:hover .route-progress-fill{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){
  .route-progress-fill{animation:none;width:calc(100% - 16px)}
}

/* ==========================================================================
   49. Searchable airport dropdown (Flying from / to)
   A custom combobox over the DB-fed <datalist>: type to filter by city,
   IATA code or country; the paired field can never pick the same airport.
   ========================================================================== */
.combo-menu{
  position:absolute;z-index:60;display:none;
  max-height:288px;overflow-y:auto;
  background:#fff;border:1.5px solid var(--line);border-radius:var(--radius-sm);
  box-shadow:0 20px 44px -22px rgba(11,21,36,.4),0 3px 10px rgba(11,21,36,.08);
  padding:6px;
}
.field.combo-open .combo-menu{display:block}
.combo-opt{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:10px;cursor:pointer;
  transition:background .15s;
}
.combo-opt:hover,.combo-opt.is-active{background:var(--gold-50)}
.combo-city{font-weight:600;color:var(--ink);font-size:.92rem;white-space:nowrap}
.combo-code{
  font-size:.68rem;font-weight:700;letter-spacing:.04em;color:var(--gold-600);
  background:var(--gold-50);border:1px solid var(--gold-200);
  padding:2px 7px;border-radius:99px;flex:none;
}
.combo-country{
  margin-left:auto;font-size:.79rem;color:var(--slate-400);
  text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%;
}
.combo-empty{padding:12px;color:var(--slate-400);font-size:.88rem;text-align:center}
.combo-menu::-webkit-scrollbar{width:10px}
.combo-menu::-webkit-scrollbar-thumb{background:var(--line);border-radius:99px;border:3px solid #fff}

/* duplicate origin/destination flash */
.field-dupe .control{border-color:#d9534f !important;background:#fff !important;box-shadow:0 0 0 4px rgba(217,83,79,.14) !important}
.field-dupe::after{
  content:"Origin and destination can't be the same";
  position:absolute;left:2px;top:calc(100% + 5px);
  font-size:.74rem;font-weight:600;color:#d9534f;
}

/* ==========================================================================
   50. Airline picker with logos (Preferred airline)
   ========================================================================== */
select.is-enhanced{position:absolute!important;opacity:0;pointer-events:none;height:0;padding:0;margin:0;border:0}
.logosel{
  display:flex;align-items:center;gap:10px;width:100%;text-align:left;cursor:pointer;
  /* inherits .control look (padding/border/bg); keep the plane ficon room */
}
.logosel::after{
  content:"";margin-left:auto;width:16px;height:16px;flex:none;
  background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A687C' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat center/contain;
  transition:transform var(--t);
}
.field.combo-open .logosel::after{transform:rotate(180deg)}
.logosel-logo{height:20px;width:auto;max-width:34px;object-fit:contain;flex:none}
.logosel-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.logo-opt{gap:12px}
.logo-opt-img{height:22px;width:34px;object-fit:contain;flex:none;background:#fff;border-radius:4px}
.logo-opt-blank{width:34px;flex:none}
.logo-opt-name{font-weight:600;color:var(--ink);font-size:.92rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ==========================================================================
   51. Footer Quick Links — full-width band (own row under the grid)
   Premium treatment: an eyebrow heading flanked by hairlines, and links laid
   out on a subtle inset panel with crisp gold-dot dividers.
   ========================================================================== */
.footer-quicklinks{
  margin-top:clamp(14px,1.8vw,22px);
  padding:clamp(18px,2vw,24px) clamp(20px,3vw,40px);
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.02);
  border-radius:var(--radius-lg);
  text-align:center;
}
/* eyebrow heading: — QUICK LINKS — with fading hairlines either side */
.footer-quicklinks h4{
  display:flex;align-items:center;justify-content:center;gap:18px;
  max-width:360px;margin:0 auto clamp(14px,1.6vw,18px);
  font-family:var(--font-display);font-size:.8rem;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--gold-400);
  padding:0;
}
.footer-quicklinks h4::before,
.footer-quicklinks h4::after{
  content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(212,166,53,.45));
}
.footer-quicklinks h4::after{background:linear-gradient(90deg,rgba(212,166,53,.45),transparent)}

/* links row — plain, evenly spaced, crisp gold-dot dividers (no pills) */
.footer-quicklinks .footer-tags{
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:6px 0;margin:0;width:100%;max-width:940px;margin-inline:auto;
}
.footer-quicklinks .footer-tags a{
  position:relative;padding:8px 26px;border:0;background:none;border-radius:0;
  color:#C6D2E0;font-size:.9rem;font-weight:500;white-space:nowrap;letter-spacing:.01em;
  transition:color var(--t);
}
.footer-quicklinks .footer-tags a:hover{background:none;border-color:transparent;color:var(--gold-400)}
.footer-quicklinks .footer-tags a:not(:last-child)::after{
  content:"";position:absolute;right:-3px;top:50%;transform:translateY(-50%);
  width:4px;height:4px;border-radius:50%;background:rgba(212,166,53,.4);
}
@media (max-width:560px){
  .footer-quicklinks h4{max-width:250px;gap:12px}
  .footer-quicklinks .footer-tags{gap:2px 4px}
  .footer-quicklinks .footer-tags a{padding:7px 14px;font-size:.85rem}
  /* links wrap into rows on mobile — drop the dots so none dangle at row ends */
  .footer-quicklinks .footer-tags a:not(:last-child)::after{display:none}
}

/* ==========================================================================
   52. Footer bottom — premium alignment + FIDHAPS credit line
   ========================================================================== */
.footer-bottom{
  margin-top:6px;
  padding-block:26px;
  gap:10px 28px;
  font-size:.85rem;
  flex-wrap:nowrap;               /* keep the three parts on one line */
}
.footer-bottom > p{color:#8A9AAE;margin:0;white-space:nowrap}
.footer-bottom nav{flex:none}
.footer-bottom nav a{transition:color var(--t);white-space:nowrap}
/* maker's credit — inline, sits at the right end of the single row */
.footer-credit{
  margin:0;white-space:nowrap;
  font-size:.8rem;letter-spacing:.02em;color:#6B7C90;
}
.footer-credit .credit-brand{
  display:inline;color:var(--gold-400);font-weight:700;letter-spacing:.12em;
  padding-left:2px;transition:color var(--t);
}
.footer-credit .credit-brand:hover{color:#fff}
/* stack cleanly on small screens */
@media (max-width:768px){
  .footer-bottom{flex-wrap:wrap;justify-content:center;text-align:center}
}

/* ==========================================================================
   53. Home "Ticket booking" section — premium header + framing
   ========================================================================== */
.search-head{
  align-items:flex-end;
  padding-bottom:clamp(16px,1.8vw,22px);
  margin-bottom:clamp(20px,2.4vw,28px);
  border-bottom:1px solid var(--line-soft);
}
.search-head-main{display:flex;flex-direction:column;gap:10px}
.search-eyebrow{
  display:inline-flex;align-items:center;gap:7px;width:fit-content;
  font-family:var(--font-display);font-size:.66rem;font-weight:600;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gold-600);
  background:var(--gold-50);border:1px solid var(--gold-200);
  padding:5px 12px;border-radius:var(--radius-pill);
}
.search-eyebrow svg{width:13px;height:13px}
.search-head h2{margin:0}
.search-head p{max-width:44ch;text-align:right;line-height:1.55}
/* frame the trust note with a matching hairline */
.search-note{
  margin-top:clamp(18px,2.2vw,24px);
  padding-top:clamp(14px,1.6vw,18px);
  border-top:1px solid var(--line-soft);
}
@media (max-width:768px){
  .search-head{flex-direction:column;align-items:flex-start}
  .search-head p{text-align:left;max-width:none}
}

/* ==========================================================================
   54. Ticketing-partners rail moved INSIDE the ticket booking card
   Frame it with a top hairline (like the header/note) instead of the
   full border-block it had as a standalone section.
   ========================================================================== */
.logo-rail--incard{
  border-block:0;
  border-top:1px solid var(--line-soft);
  margin-top:clamp(18px,2.2vw,24px);
  padding:clamp(20px,2.4vw,26px) 0 2px;
}
.logo-rail--incard .rail-label{
  margin:0 auto clamp(16px,1.8vw,20px);
  font-size:.68rem;
}
/* keep the scrolling marquee — full-colour logos, ~8 visible at a time.
   Spacing uses margin-right (not flex gap) so every logo — including the last
   of each duplicated set — carries a trailing space. That makes the two halves
   exactly equal width, so the -50% keyframe loops with no half-gap break. */
.logo-rail--incard .marquee-track{gap:0}
.logo-rail--incard .marquee-track img{
  height:44px;filter:none;opacity:1;margin-right:clamp(34px,4.2vw,62px);
}
@media (max-width:560px){
  .logo-rail--incard .marquee-track img{height:34px;margin-right:28px}
}

/* ==========================================================================
   55. Airport dropdown — show only city + IATA code (hide the country)
   Country stays in the data so type-to-filter by country still works.
   ========================================================================== */
.combo-country{display:none}
/* push the IATA code badge to the right edge of each row */
.combo-code{margin-left:auto}

/* ==========================================================================
   56. Premium calendar / date control
   Hide the browser's default b/w picker button (the gold .ficon on the left
   is the single, on-brand calendar cue) and let the whole field open the
   picker via JS. Style the date text to match the other controls.
   ========================================================================== */
.field input[type="date"],
.field input[type="month"]{cursor:pointer}
/* remove the native picker button entirely — a custom calendar replaces it */
.field input[type="date"]::-webkit-calendar-picker-indicator{display:none}
.field input[type="month"]::-webkit-calendar-picker-indicator{opacity:0;cursor:pointer}
.field input[type="date"]::-webkit-datetime-edit,
.field input[type="month"]::-webkit-datetime-edit{color:var(--ink)}
.field input[type="date"]::-webkit-datetime-edit-fields-wrapper,
.field input[type="month"]::-webkit-datetime-edit-fields-wrapper{padding:0}
/* subtle gold tint on the segment being edited */
.field input[type="date"]::-webkit-datetime-edit-day-field:focus,
.field input[type="date"]::-webkit-datetime-edit-month-field:focus,
.field input[type="date"]::-webkit-datetime-edit-year-field:focus{
  background:var(--gold-50);color:var(--gold-600);border-radius:4px;outline:none;
}

/* ==========================================================================
   57. Booking field row — 4-column grid
   Four fields per line: Row 1 route + dates, Row 2 pax + cabin + airline,
   Row 3 passenger + contact + submit. Airport columns get a touch more width
   than the date columns.
   ========================================================================== */
.field-row{
  display:grid;
  grid-template-columns:repeat(12, minmax(0,1fr));
  gap:16px;align-items:end;
}
.field-row > .field{grid-column:span 3;min-width:0}       /* default */
.field-row > .field--full{grid-column:1 / -1}
/* airports — wide */
.field-row > .field:has(input[name="from"]),
.field-row > .field:has(input[name="to"]){grid-column:span 4}
/* dates — narrow, and Departure = Return exactly */
.field-row > .field:has(input[type="date"]){grid-column:span 2}
/* passenger counts — small */
.field-row > .field:has(select[name="adults"]),
.field-row > .field:has(select[name="child"]){grid-column:span 2}
/* cabin + preferred airline — wide */
.field-row > .field:has(select[name="cabin"]),
.field-row > .field:has(select[name="pref"]){grid-column:span 4}
/* passenger name, WhatsApp, email — the three share the row equally (4 each) */
.field-row > .field:has(input[name="name"]),
.field-row > .field:has(input[name="wa"]),
.field-row > .field:has(input[name="email"]){grid-column:span 4}
/* submit — its own line, CTA right-aligned */
.field-row > .field:has(button[type="submit"]){grid-column:1 / -1}
@media (max-width:1024px){
  .field-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .field-row > .field{grid-column:auto !important}
  .field-row > .field--full{grid-column:1 / -1 !important}
}
@media (max-width:560px){ .field-row{grid-template-columns:1fr} }

/* airline with no logo yet — small gold initials badge (aviation table) */
.airline-badge{
  display:inline-grid;place-items:center;width:36px;height:26px;flex:none;
  background:var(--gold-50);border:1px solid var(--gold-200);border-radius:6px;
  font-size:.6rem;font-weight:700;letter-spacing:.02em;color:var(--gold-600);
}

/* ==========================================================================
   58. Aviation — enriched airlines table (alliance / flights / destinations)
   ========================================================================== */
.airlines-table td{vertical-align:middle}
.airlines-table .airline-cell{display:flex;align-items:center;gap:12px}
.airline-meta{display:flex;flex-direction:column;gap:2px;min-width:0}
.airline-meta b{font-weight:600;color:var(--ink);line-height:1.25}
.airline-meta small{font-size:.78rem;color:var(--slate-400);line-height:1.35;max-width:36ch}
.airline-dests{color:var(--slate);font-size:.86rem;max-width:30ch;line-height:1.4}
.airlines-table .muted{color:var(--slate-400)}
.airlines-table .pill{white-space:nowrap}

/* ==========================================================================
   59. Premium custom calendar (date picker)
   ========================================================================== */
.datecal{
  position:fixed;z-index:1000;width:auto;max-width:calc(100vw - 24px);
  display:none;padding:14px;
  background:#fff;border:1px solid var(--line);border-radius:16px;
  box-shadow:0 24px 50px -22px rgba(11,21,36,.45),0 4px 12px rgba(11,21,36,.08);
}
.datecal.is-open{display:block;animation:datecalIn .16s var(--ease)}
@keyframes datecalIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.datecal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.datecal-title{font-family:var(--font-display);font-weight:600;font-size:.9rem;color:var(--slate);letter-spacing:.02em}
.datecal-months{display:flex;gap:22px}
.datecal-month{width:252px}
.datecal-mtitle{text-align:center;font-family:var(--font-display);font-weight:600;font-size:.92rem;color:var(--ink);margin-bottom:8px}
.datecal-nav{
  width:32px;height:32px;border-radius:10px;display:grid;place-items:center;flex:none;
  color:var(--slate);background:var(--cream);border:1px solid var(--line-soft);transition:all var(--t);
}
.datecal-nav:hover{background:var(--gold-50);border-color:var(--gold-200);color:var(--gold-600)}
.datecal-nav svg{width:16px;height:16px}
.datecal-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:4px}
.datecal-dow span{text-align:center;font-size:.68rem;font-weight:700;letter-spacing:.04em;color:var(--slate-400);text-transform:uppercase;padding:4px 0}
.datecal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.datecal-day{
  aspect-ratio:1;display:grid;place-items:center;border:0;background:none;border-radius:9px;
  font-size:.86rem;color:var(--ink);cursor:pointer;transition:background .15s,color .15s;
}
.datecal-day.is-empty{cursor:default}
.datecal-day:not(.is-empty):not([disabled]):hover{background:var(--gold-50);color:var(--gold-600)}
.datecal-day.is-today{box-shadow:inset 0 0 0 1.5px var(--gold-300,rgba(212,166,53,.5));font-weight:600}
.datecal-day.is-sel{background:var(--gold-grad,var(--gold-500));color:#fff;font-weight:700;box-shadow:0 4px 12px -4px rgba(188,138,19,.6)}
.datecal-day.is-sel:hover{background:var(--gold-grad,var(--gold-500));color:#fff}
.datecal-day[disabled]{color:var(--line);cursor:not-allowed}
.datecal-foot{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding-top:10px;border-top:1px solid var(--line-soft)}
.datecal-link{background:none;border:0;cursor:pointer;font-size:.82rem;font-weight:600;color:var(--slate);padding:6px 8px;border-radius:8px;transition:color var(--t)}
.datecal-link:hover{color:var(--gold-600)}
.datecal-today{color:var(--gold-600)}
@media (max-width:640px){
  .datecal-months{gap:0}
  .datecal-month:nth-child(2){display:none}   /* one month on small screens */
  .datecal-month{width:min(300px,calc(100vw - 60px))}
}

/* ==========================================================================
   60. Booking submit — compact, premium CTA (not full-width)
   ========================================================================== */
.field-row > .field:has(button[type="submit"]){
  display:flex;justify-content:flex-end;align-items:center;margin-top:4px;
}
.field-row > .field:has(button[type="submit"]) > label{display:none}
.field-row > .field:has(button[type="submit"]) .btn{
  width:auto !important;min-width:210px;
  padding:16px 40px !important;font-size:.96rem;font-weight:700;letter-spacing:.01em;
  box-shadow:0 12px 26px -10px rgba(188,138,19,.55);
  transition:transform var(--t),box-shadow var(--t),filter var(--t);
}
.field-row > .field:has(button[type="submit"]) .btn:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 38px -12px rgba(188,138,19,.75);
  filter:brightness(1.03);
}
.field-row > .field:has(button[type="submit"]) .btn:active{transform:translateY(0)}

/* mobile: make the submit CTA full-width for an easy tap target */
@media (max-width:560px){
  .field-row > .field:has(button[type="submit"]){justify-content:stretch}
  .field-row > .field:has(button[type="submit"]) .btn{width:100% !important;min-width:0}
}

/* ==========================================================================
   61. Mobile fix — stack the contact split (form + info) into one column
   ========================================================================== */
@media (max-width:768px){
  .split{display:block !important}
  .split > *{width:auto !important;min-width:0 !important}
  .split > * + *{margin-top:36px}
}

/* ==========================================================================
   62. Site search — header entry point + results page
   ========================================================================== */
.nav-search{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-pill);color:var(--ink);border:1px solid var(--line);transition:var(--t)}
.nav-search svg{width:18px;height:18px}
.nav-search:hover{color:var(--gold-600);border-color:var(--gold);background:var(--cream)}
@media (max-width:1024px){ .nav-search{display:none} }

.site-search{position:relative;display:flex;align-items:center;gap:10px}
.site-search > svg{position:absolute;left:16px;width:20px;height:20px;color:var(--slate);pointer-events:none}
.site-search input[type="search"]{flex:1;width:100%;padding:15px 16px 15px 46px;border:1px solid var(--line);border-radius:var(--radius-pill);background:var(--white);font:inherit;font-size:1rem;color:var(--ink);box-shadow:var(--shadow-xs);transition:border-color var(--t),box-shadow var(--t);-webkit-appearance:none;appearance:none}
.site-search input[type="search"]:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(188,138,19,.14)}
.site-search input[type="search"]::placeholder{color:var(--slate)}
.site-search--lg{max-width:620px;margin-top:22px}
.site-search--lg .btn{flex:none}
.site-search--drawer{margin:2px 0 16px}
.site-search--drawer input[type="search"]{padding-block:12px}

.search-group{margin-bottom:34px}
.search-group__title{font-family:var(--font-display);font-size:1.05rem;color:var(--ink);margin:0 0 12px;display:flex;align-items:center;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--line-soft)}
.search-group__title span{font-family:var(--font-body);font-size:.72rem;font-weight:700;color:var(--gold-700,#8a6510);background:var(--cream);border:1px solid var(--line);border-radius:var(--radius-pill);padding:2px 9px}
.search-results{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.search-results a{display:block;padding:16px 18px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--white);box-shadow:var(--shadow-xs);transition:border-color var(--t),box-shadow var(--t),transform var(--t)}
.search-results a:hover{border-color:var(--gold);box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.search-results h3{margin:0 0 4px;font-size:1.02rem;color:var(--ink)}
.search-results p{margin:0 0 6px;font-size:.9rem;color:var(--slate);line-height:1.5}
.search-results__url{font-size:.76rem;color:var(--gold-700,#8a6510);word-break:break-all}

.search-suggest{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.chip{display:inline-flex;align-items:center;padding:7px 14px;border:1px solid var(--line);border-radius:var(--radius-pill);font-size:.85rem;font-weight:500;color:var(--ink);background:var(--white);transition:var(--t)}
.chip:hover{border-color:var(--gold);color:var(--gold-700,#8a6510);background:var(--cream)}
.search-empty{max-width:560px;padding:30px 0}
.search-cta{margin-top:20px;padding-top:26px;border-top:1px solid var(--line-soft);display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.search-cta p{margin:0;font-family:var(--font-display);color:var(--ink)}

@media (max-width:560px){
  .site-search--lg{flex-wrap:wrap}
  .site-search--lg input[type="search"]{flex:1 1 100%}
  .site-search--lg .btn{width:100%}
}

/* ==========================================================================
   63. Airline chips — flight route "who flies this route"
   ========================================================================== */
.airline-list{display:flex;flex-wrap:wrap;gap:12px}
.airline-chip{display:inline-flex;align-items:center;gap:12px;padding:11px 20px 11px 11px;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-pill);box-shadow:var(--shadow-xs);transition:transform var(--t),box-shadow var(--t),border-color var(--t)}
.airline-chip:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);border-color:var(--gold)}
.airline-chip__ic{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--cream);color:var(--gold-600);flex:0 0 auto}
.airline-chip__ic svg{width:19px;height:19px;transform:rotate(45deg)}
.airline-chip__name{font-family:var(--font-display);font-weight:600;color:var(--ink);font-size:.98rem;white-space:nowrap}
@media (max-width:560px){ .airline-chip{flex:1 1 100%} }

/* ==========================================================================
   64. Inline form validation (enquiry / booking)
   ========================================================================== */
.field-error{display:block;margin-top:6px;color:var(--error,#EF4444);font-size:.8rem;font-weight:600;line-height:1.35}
.control.is-invalid{border-color:var(--error,#EF4444) !important;box-shadow:0 0 0 3px rgba(239,68,68,.13) !important}

/* ==========================================================================
   65. Inline form success (thank-you shown at the form)
   ========================================================================== */
.form-success{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-left:4px solid var(--success,#10B981);border-radius:var(--radius-sm);padding:16px 18px;margin-bottom:20px;box-shadow:var(--shadow-sm);animation:datecalIn .3s var(--ease)}
.form-success__ic{flex:0 0 auto;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:rgba(16,185,129,.12);color:var(--success,#10B981)}
.form-success__ic svg{width:18px;height:18px}
.form-success b{display:block;font-family:var(--font-display);color:var(--ink);font-size:1rem;margin-bottom:2px}
.form-success p{margin:0;font-size:.88rem;color:var(--slate);line-height:1.45}
.datecal-nav[disabled]{opacity:.3;cursor:not-allowed;pointer-events:none}

/* ==========================================================================
   66. Thank-you popup modal (after enquiry / booking submission)
   ========================================================================== */
.modal-ok{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;padding:20px;opacity:0;transition:opacity .2s var(--ease)}
.modal-ok.is-open{opacity:1}
.modal-ok.is-closing{opacity:0}
.modal-ok__backdrop{position:absolute;inset:0;background:rgba(11,21,36,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.modal-ok__card{position:relative;z-index:1;width:min(440px,100%);background:#fff;border-radius:var(--radius);padding:40px 32px 30px;text-align:center;box-shadow:var(--shadow-lg);transform:translateY(14px) scale(.97);transition:transform .28s var(--ease)}
.modal-ok.is-open .modal-ok__card{transform:none}
.modal-ok__x{position:absolute;top:12px;right:16px;background:none;border:0;font-size:26px;line-height:1;color:var(--slate);cursor:pointer;transition:color var(--t)}
.modal-ok__x:hover{color:var(--ink)}
.modal-ok__ic{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 18px;border-radius:50%;background:rgba(16,185,129,.13);color:var(--success,#10B981);animation:okpop .4s var(--ease)}
.modal-ok__ic svg{width:32px;height:32px}
@keyframes okpop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}
.modal-ok__card h3{font-family:var(--font-display);font-size:1.55rem;color:var(--ink);margin:0 0 8px}
.modal-ok__card p{margin:0 0 6px;color:var(--ink)}
.modal-ok__sub{font-size:.9rem;color:var(--slate) !important}
.modal-ok__actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:24px}