/* ============================================================
   WOOW LANKA LEISURE — Design System
   Tokens, base styles, components, sections, motion, responsive
   ============================================================ */

:root{
  /* --- Colour tokens -------------------------------------
     Rebuilt directly from the WOOW mark: brand coral (the
     infinity/wordmark red) is the dominant accent, brand teal
     (the "Leisure" wordmark) is the secondary accent, and the
     page runs on white — no invented green or gold. Token
     names are kept as-is so every rule below still resolves
     correctly; only the hex values changed.                */
  --forest-950:#0A2E38;   /* deepest teal — hero/footer base    */
  --forest-900:#0E3A46;   /* dark teal — overlays               */
  --forest-800:#135A6C;   /* primary brand teal                 */
  --forest-600:#1C7F98;   /* brand mark teal — hovers, links     */
  --forest-400:#5FA8BB;   /* soft teal — supporting text on dk  */

  --ivory:      #FFFFFF;  /* page background — white            */
  --ivory-deep: #F4F7F8;  /* alternate section background       */
  --paper:      #FFFFFF;  /* card surface                       */
  --sand-line:  #E3E9EA;  /* hairline dividers                  */

  --gold:       #DB4A2C;  /* signature accent = brand coral      */
  --gold-soft:  #F2967A;  /* soft coral, emphasis on dark        */
  --gold-dim:   #B93A20;  /* deep coral for labels on light      */

  --coral:      #DB4A2C;  /* brand mark red — primary CTA        */
  --coral-dark: #B93A20;  /* CTA hover                           */
  --teal:       #1C7F98;  /* brand mark teal — small accents     */

  --ink:        #17222A;  /* primary text                        */
  --ink-soft:   #4A5A61;  /* secondary text                      */
  --ink-faint:  #63737A;  /* tertiary / captions — darkened for AA contrast (was #7C8B90 at 3.53:1) */

  --cream-text: #F2F8F8;  /* text on dark teal                   */
  --cream-soft: #C7DBDF;  /* muted text on dark teal             */

  /* --- Type ------------------------------------------------ */
  --f-display: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  --f-body: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* --- Layout ------------------------------------------------ */
  --container: 1280px;
  --gutter: clamp(20px, 5vw, 64px);
  --radius-sm: 6px;
  --radius-md: 14px;
  --radius-lg: 28px;

  --ease: cubic-bezier(.16,.8,.28,1);
  --dur: .7s;
}

*,*::before,*::after{ box-sizing:border-box; }
html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
}
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

body{
  margin:0;
  background:var(--ivory);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p{ margin:0; }
svg{ display:block; }

:focus-visible{
  outline:2px solid var(--gold);
  outline-offset:3px;
  border-radius:4px;
}

.container{
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--gutter);
}

/* --- Eyebrow / label system ---------------------------------
   Small caps utility labels used as structural signposts —
   they mark what KIND of content follows (place, category,
   service), not a numbered sequence. */
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.6em;
  font-family:var(--f-body);
  font-weight:700;
  font-size:.72rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold-dim);
}
.eyebrow::before{
  content:"";
  width:22px; height:1px;
  background:var(--gold-dim);
  display:inline-block;
}
.on-dark .eyebrow{ color:var(--gold-soft); }
.on-dark .eyebrow::before{ background:var(--gold-soft); }

/* --- Headings ------------------------------------------------ */
.h-display{
  font-family:var(--f-display);
  font-weight:440;
  letter-spacing:-.01em;
  color:var(--ink);
  line-height:1.06;
}
.on-dark .h-display{ color:var(--cream-text); }

.section-head{
  max-width:640px;
  margin-bottom:clamp(36px,5vw,64px);
}
.section-head.center{ margin-inline:auto; text-align:center; }
.section-head h2{
  font-family:var(--f-display);
  font-size:clamp(2rem, 4vw, 3rem);
  letter-spacing:-.01em;
  margin-top:.5em;
}
.section-head p{
  margin-top:1em;
  color:var(--ink-soft);
  font-size:1.05rem;
  line-height:1.7;
  max-width:52ch;
}
.section-head.center p{ margin-inline:auto; }
.on-dark .section-head p{ color:var(--cream-soft); }

/* --- Buttons --------------------------------------------------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6em;
  padding:1em 1.7em;
  font-family:var(--f-body);
  font-weight:700;
  font-size:.85rem;
  letter-spacing:.07em;
  text-transform:uppercase;
  border-radius:999px;
  white-space:nowrap;
  transition:transform .45s var(--ease), background-color .3s ease, color .3s ease, box-shadow .3s ease, border-color .3s ease;
  border:1px solid transparent;
}
.btn svg{ width:16px; height:16px; flex:none; }

.btn-primary{
  background:var(--coral);
  color:#fff;
  box-shadow:0 10px 28px -12px rgba(219,74,44,.65);
}
.btn-primary:hover{ background:var(--coral-dark); transform:translateY(-2px); box-shadow:0 16px 32px -12px rgba(219,74,44,.75); }

.btn-ghost-dark{
  border-color:rgba(242,248,248,.55);
  color:var(--cream-text);
}
.btn-ghost-dark:hover{ border-color:var(--cream-text); background:rgba(242,248,248,.08); transform:translateY(-2px); }

.btn-line{
  border-color:var(--forest-800);
  color:var(--forest-800);
}
.btn-line:hover{ background:var(--forest-800); color:var(--cream-text); transform:translateY(-2px); }

.btn-whatsapp{
  background:#128C5A;
  color:#fff;
}
.btn-whatsapp:hover{ background:#0F714A; transform:translateY(-2px); }

.btn-sm{ padding:.8em 1.3em; font-size:.78rem; }

/* --- Signature motif: the infinity line --------------------------
   Echoes the WOOW mark's double-loop. Used sparingly as a section
   divider that draws itself in on scroll. This is the one recurring
   flourish in the system — everything else stays quiet. */
.infinity-divider{
  width:100%;
  max-width:220px;
  margin:0 auto;
  opacity:.9;
}
.infinity-divider path{
  fill:none;
  stroke:var(--gold);
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-dasharray:340;
  stroke-dashoffset:340;
  transition:stroke-dashoffset 1.6s var(--ease);
}
.infinity-divider.in-view path{ stroke-dashoffset:0; }
.on-dark .infinity-divider path{ stroke:var(--gold-soft); }

/* =============================================================
   NAVIGATION
   ============================================================= */
.site-header{
  position:fixed; inset:0 0 auto 0;
  z-index:100;
  padding:20px 0;
  transition:padding .4s var(--ease), background-color .4s ease, box-shadow .4s ease, border-color .4s ease;
  border-bottom:1px solid transparent;
}
.site-header .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  max-width:1440px;
}
.site-header.scrolled{
  padding:12px 0;
  background:rgba(250,246,236,.92);
  backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--sand-line);
  box-shadow:0 8px 30px -20px rgba(14,36,27,.35);
}

.brand{ display:flex; align-items:center; gap:.7em; flex:none; }
.brand img{ height:64px; width:auto; transition:height .4s var(--ease), filter .4s ease; filter:drop-shadow(0 2px 10px rgba(0,0,0,.25)); }
.site-header.scrolled .brand img{ height:54px; filter:none; }
.brand .brand-word{
  font-family:var(--f-display);
  font-size:1.45rem;
  font-weight:560;
  letter-spacing:.02em;
  color:var(--cream-text);
  line-height:1.1;
  transition:color .4s ease;
}
.brand .brand-word small{
  display:block;
  font-family:var(--f-body);
  font-weight:700;
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--forest-400);
  margin-top:.35em;
}
.site-header.scrolled .brand .brand-word{ color:var(--ink); }
.site-header.scrolled .brand .brand-word small{ color:var(--forest-800); }

.primary-nav{ display:flex; align-items:center; gap:clamp(10px,1.5vw,22px); flex-wrap:nowrap; }
.primary-nav a{
  position:relative;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--cream-text);
  padding:6px 1px;
  white-space:nowrap;
  transition:color .35s ease;
}
.primary-nav a::after{
  content:"";
  position:absolute; left:0; right:100%; bottom:0;
  height:1.5px; background:var(--gold);
  transition:right .4s var(--ease);
}
.primary-nav a:hover{ color:var(--gold-soft); }
.primary-nav a:hover::after{ right:0; }
.site-header.scrolled .primary-nav a{ color:var(--ink); }
.site-header.scrolled .primary-nav a:hover{ color:var(--forest-800); }
.site-header.scrolled .primary-nav a::after{ background:var(--coral); }

.header-actions{ display:flex; align-items:center; gap:10px; flex:none; }
.wa-icon-btn{
  width:40px; height:40px;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:50%;
  background:#128C5A;
  color:#fff;
  transition:transform .35s var(--ease), background-color .3s ease;
  flex:none;
}
.wa-icon-btn:hover{ transform:translateY(-2px) scale(1.04); background:#0F714A; }
.wa-icon-btn svg{ width:19px; height:19px; }

.nav-toggle{
  display:none;
  width:42px; height:42px;
  border-radius:50%;
  align-items:center; justify-content:center;
  flex:none;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:""; display:block;
  width:20px; height:1.6px;
  background:var(--cream-text);
  border-radius:2px;
  position:relative;
  transition:transform .35s ease, opacity .35s ease, background-color .3s ease;
}
.site-header.scrolled .nav-toggle span,
.site-header.scrolled .nav-toggle span::before,
.site-header.scrolled .nav-toggle span::after{ background:var(--ink); }
.nav-toggle span::before{ position:absolute; top:-7px; }
.nav-toggle span::after{ position:absolute; top:7px; }
.menu-open{ overflow:hidden; }
.menu-open .nav-toggle span{ background:transparent; }
.menu-open .nav-toggle span::before{ top:0; transform:rotate(45deg); background:var(--ink); }
.menu-open .nav-toggle span::after{ top:0; transform:rotate(-45deg); background:var(--ink); }

/* Mobile drawer */
.mobile-nav{
  position:fixed; inset:0;
  background:
    radial-gradient(circle at 90% 12%, rgba(219,74,44,.10), transparent 30%),
    linear-gradient(180deg, #fffdf8 0%, var(--ivory) 100%);
  z-index:99;
  display:flex; flex-direction:column;
  padding:112px max(var(--gutter), 24px) 30px;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  transform:translateY(-12px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .32s ease, transform .4s var(--ease), visibility .32s ease;
}
.menu-open .mobile-nav{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.mobile-nav-kicker{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
  color:var(--coral);
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.mobile-nav-kicker::before{ content:""; width:30px; height:1px; background:currentColor; }
.mobile-nav-links{ display:grid; }
.mobile-nav-links a{
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:10px 2px;
  border-bottom:1px solid rgba(10,46,56,.12);
  color:var(--ink);
  font-family:var(--f-body);
  font-size:clamp(1rem, 4.7vw, 1.22rem);
  font-weight:700;
  line-height:1.15;
  letter-spacing:.01em;
  transition:color .2s ease, padding-left .25s ease;
}
.mobile-nav-links a::after,
.mobile-nav-links a::before{ display:none !important; content:none !important; }
.mobile-nav-links a:hover,
.mobile-nav-links a[aria-current="page"]{ color:var(--coral); padding-left:8px; }
.mobile-nav-links a small{
  min-width:28px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(10,46,56,.16);
  border-radius:50%;
  color:var(--ink-faint);
  font-family:var(--f-body);
  font-size:.64rem;
  font-weight:800;
  letter-spacing:.04em;
}
.mobile-nav-links a[aria-current="page"] small{
  border-color:var(--coral);
  background:var(--coral);
  color:#fff;
}
.mobile-nav .mobile-cta{
  margin-top:22px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.mobile-nav .mobile-cta .btn{
  width:100%;
  min-height:48px;
  padding:12px 14px;
  border:0;
  font-family:var(--f-body);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.04em;
  line-height:1.2;
  text-align:center;
}
.mobile-nav .mobile-cta .btn svg{ width:16px !important; height:16px !important; flex:none; }
.mobile-nav .mobile-cta .btn-whatsapp{ background:#128C5A; color:#fff; }
.mobile-nav-note{
  margin-top:16px;
  color:var(--ink-faint);
  font-size:.72rem;
  line-height:1.5;
  text-align:center;
}
.mobile-nav svg,
.mobile-nav img{ max-width:22px !important; max-height:22px !important; }

/* =============================================================
   HERO
   ============================================================= */
.hero{
  position:relative;
  min-height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  overflow:hidden;
  background:
    radial-gradient(120% 70% at 82% 8%, rgba(219,74,44,.30), transparent 60%),
    linear-gradient(190deg, #0F4550 0%, #0A2E38 46%, #071F26 100%);
  color:var(--cream-text);
}

.hero-scene{ position:absolute; inset:0; z-index:0; background:var(--site-photo) center 30%/cover no-repeat; }
.hero-scene svg{ display:none; }
.hero-grain{
  position:absolute; inset:0;
  z-index:1;
  opacity:.5;
  mix-blend-mode:overlay;
  pointer-events:none;
}
.hero-vignette{
  position:absolute; inset:0; z-index:2;
  background:linear-gradient(0deg, rgba(7,26,31,.92) 0%, rgba(7,26,31,.35) 42%, rgba(7,26,31,0) 66%);
  pointer-events:none;
}

.hero-inner{
  position:relative; z-index:3;
  padding:170px var(--gutter) 76px;
  width:100%;
  max-width:var(--container);
  margin-inline:auto;
}
.hero-eyebrow-row{
  display:flex; align-items:center; gap:14px;
  margin-bottom:22px;
  opacity:0; transform:translateY(14px);
  animation:rise .9s var(--ease) .25s forwards;
}
.hero-mark{ height:30px; width:auto; }
.hero-eyebrow-row .eyebrow::before{ display:none; }

.hero h1{
  font-family:var(--f-display);
  font-weight:440;
  font-size:clamp(2.6rem, 7vw, 5.6rem);
  line-height:.98;
  letter-spacing:-.01em;
  max-width:15ch;
  opacity:0; transform:translateY(22px);
  animation:rise 1s var(--ease) .4s forwards;
}
.hero h1 em{
  font-style:italic;
  font-weight:420;
  color:var(--gold-soft);
}
.hero .lede{
  margin-top:26px;
  max-width:46ch;
  font-size:clamp(1rem,1.6vw,1.18rem);
  color:var(--cream-soft);
  opacity:0; transform:translateY(18px);
  animation:rise 1s var(--ease) .6s forwards;
}
.hero-actions{
  margin-top:40px;
  display:flex; flex-wrap:wrap; gap:16px;
  opacity:0; transform:translateY(18px);
  animation:rise 1s var(--ease) .78s forwards;
}

.hero-foot{
  position:relative; z-index:3;
  border-top:1px solid rgba(242,248,248,.18);
}
.hero-foot .container{
  display:flex; align-items:center; justify-content:space-between;
  padding:20px var(--gutter);
  gap:20px; flex-wrap:wrap;
}
.hero-tagline{
  font-family:var(--f-display);
  font-style:italic;
  font-size:.98rem;
  letter-spacing:.02em;
  color:var(--gold-soft);
}
.scroll-cue{
  display:flex; align-items:center; gap:10px;
  font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--cream-soft);
}
.scroll-cue .line{
  width:34px; height:1px; background:rgba(242,248,248,.5);
  position:relative; overflow:hidden;
}
.scroll-cue .line::after{
  content:""; position:absolute; inset:0;
  background:var(--gold-soft);
  animation:scrollcue 2.4s ease-in-out infinite;
}
@keyframes scrollcue{
  0%{ transform:translateX(-100%); }
  50%{ transform:translateX(0); }
  100%{ transform:translateX(100%); }
}
@keyframes rise{ to{ opacity:1; transform:translateY(0); } }

/* =============================================================
   INTRO / EDITORIAL STATEMENT
   ============================================================= */
.intro{
  padding:clamp(80px,11vw,140px) 0 clamp(60px,8vw,100px);
  background:var(--ivory);
}
.intro-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:clamp(32px,6vw,90px);
  align-items:start;
}
.intro .eyebrow{ margin-bottom:20px; }
.intro h2{
  font-family:var(--f-display);
  font-size:clamp(1.9rem,3.6vw,2.7rem); letter-spacing:-.01em;
  line-height:1.16;
  color:var(--ink);
}
.intro h2 em{ font-style:italic; color:var(--gold-dim); font-weight:420; }
.intro-copy p{
  color:var(--ink-soft);
  font-size:1.06rem;
  max-width:56ch;
}
.intro-visual{
  position:relative;
  width:100%;
  aspect-ratio:16/10;
  border-radius:var(--radius-lg);
  overflow:hidden;
  margin-bottom:32px;
  background-color:var(--forest-800);
  background-image:var(--photo-hillcountry);
  background-position:center 42%;
  background-size:cover;
  background-repeat:no-repeat;
}
.intro-copy p + p{ margin-top:1.2em; }
.intro-copy .signoff{
  margin-top:28px;
  font-family:var(--f-display);
  font-style:italic;
  color:var(--forest-800);
  font-size:1.1rem;
}

/* =============================================================
   REUSABLE: reveal-on-scroll
   ============================================================= */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in-view{ opacity:1; transform:translateY(0); }
.reveal-stagger > *{ transition-delay:calc(var(--i,0) * 90ms); }

/* =============================================================
   SECTION SHELL
   ============================================================= */
.section{ padding:clamp(70px,9vw,120px) 0; }
.section.alt{ background:var(--ivory-deep); }
.section.dark{ background:linear-gradient(180deg, var(--forest-900), var(--forest-950)); color:var(--cream-text); }

.section-top{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:24px; flex-wrap:wrap;
  margin-bottom:clamp(36px,5vw,56px);
}
.section-top .section-head{ margin-bottom:0; }
.section-link{
  display:inline-flex; align-items:center; gap:.5em;
  font-size:.78rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:var(--forest-800);
  padding-bottom:3px; border-bottom:1px solid var(--sand-line);
  transition:border-color .3s ease, color .3s ease, gap .3s ease;
}
.section-link svg{ width:14px; height:14px; flex:none; }
.section-link:hover{ gap:.8em; border-color:var(--coral); color:var(--coral); }
.on-dark .section-link{ color:var(--cream-text); border-color:rgba(242,248,248,.3); }
.on-dark .section-link:hover{ color:var(--gold-soft); border-color:var(--gold-soft); }

/* =============================================================
   DESTINATION SCENES — illustrated placeholder photography
   Consistent duotone system: deep forest ground + gold/cream
   linework, standing in for commissioned photography. Swap the
   .scene-fill / .scene-art per card for real photos later.
   ============================================================= */
:root{
  /* The one approved tourism photograph, used everywhere a real
     image is needed (hero, page headers, cards, gallery). Sourced
     from Wikimedia Commons — see footer credit. Swap this single
     line to update the photo site-wide. */
  /* A small library of real, verified, CC-licensed photographs —
     each genuinely depicts what it's used for. Reused thoughtfully
     across thematically-matching destinations/experiences rather
     than one photo standing in for everywhere (see footer credits
     on every page for full attribution of each photo used). The
     Sigiriya photo below is the approved Home-page image — it is
     deliberately NOT reused as a fallback for other destinations;
     unrelated destinations use the closest genuinely-relevant photo
     from this library instead, or fall back to the neutral
     --site-photo tint only where no relevant photo exists yet. */
  --site-photo: url('https://commons.wikimedia.org/wiki/Special:FilePath/Sigiriya_Rock_Fortress_View_from_Pidurangala_Rock.jpg?width=2400');
  --photo-sigiriya: url('../images/sigiriya-guests-water-gardens.jpg'); /* real guest photo, water gardens & rock fortress, Sigiriya */
  --photo-kandy: url('https://commons.wikimedia.org/wiki/Special:FilePath/Sri_Dalada_Maligawa_or_the_Temple_of_the_Sacred_Tooth_Relic.jpg?width=2400'); /* verified CC BY-SA 4.0 */
  --photo-ella: url('../images/ella-nine-arches-couple.jpg'); /* real guest photo, Nine Arches Bridge, Ella */
  --photo-galle: url('https://commons.wikimedia.org/wiki/Special:FilePath/Galle_Fort,_Sri_Lanka.JPG?width=2400'); /* verified CC BY-SA 4.0 */
  --photo-tea: url('https://commons.wikimedia.org/wiki/Special:FilePath/Misty_tea_estates_in_Sri_Lanka,_Wewalthalawa.jpg?width=2400'); /* verified CC BY-SA 4.0 */
  --photo-anuradhapura: url('https://commons.wikimedia.org/wiki/Special:FilePath/Ruwanweli_Maha_Seya_-_Anuradhapura.jpg?width=2400'); /* verified CC BY-SA 4.0 */
  --photo-jaffna: url('https://commons.wikimedia.org/wiki/Special:FilePath/Jaffna_fort-7-jaffna-Sri_Lanka.jpg?width=2400'); /* verified CC BY-SA 4.0 */
  --photo-hillcountry: url('../images/our-guests-kandy-temple.jpg'); /* real guest photo, Temple of the Sacred Tooth Relic, Kandy */
  --photo-tea-picker: url('../images/hill-country-tea-picker.jpg'); /* real guest photo, tea plantation, hill country */
  --photo-nuwara-eliya: url('../images/nuwara-eliya-tea-couple.jpg'); /* real guest photo, tea plantation, Nuwara Eliya */
  --photo-dambulla: url('https://commons.wikimedia.org/wiki/Special:FilePath/Golden_Buddha_and_Buddhist_Museum_at_Dambulla.jpg?width=2400'); /* verified CC BY-SA 3.0, Julia W */
  /* Vehicle model photos — real, licensed photographs of each model.
     These illustrate the vehicle TYPE offered, not a specific physical
     unit — see the note on the Fleet page. */
  --photo-veh-prius: url('https://commons.wikimedia.org/wiki/Special:FilePath/Toyota_Prius_(20).JPG?width=1600');
  --photo-veh-fit: url('https://commons.wikimedia.org/wiki/Special:FilePath/Honda_Fit_shuttle_1.5L-Model.JPG?width=1600');
  --photo-veh-kdh: url('https://commons.wikimedia.org/wiki/Special:FilePath/Toyota_Hiace_H200_505.JPG?width=1600');
  --photo-veh-coaster: url('https://commons.wikimedia.org/wiki/Special:FilePath/Toyota_Coaster_(53596942126).jpg?width=1600');
  --photo-veh-fuso: url('https://commons.wikimedia.org/wiki/Special:FilePath/White_Fuso_Rosa_bus.JPG?width=1600');
  --photo-veh-prado: url('https://commons.wikimedia.org/wiki/Special:FilePath/Toyota_Land_Cruiser_Prado_120_003.JPG?width=1600');
  --photo-veh-x5: url('https://commons.wikimedia.org/wiki/Special:FilePath/2016_BMW_X5_xDrive40d_M_Sport_Automatic_3.0_Front.jpg?width=1600');
  --photo-polonnaruwa: url('https://commons.wikimedia.org/wiki/Special:FilePath/Polonnaruwa_0358.jpg?width=2400'); /* verified CC BY-SA 4.0 */
  --photo-wildlife: url('../images/yala-elephants-safari.jpg'); /* real guest safari photo, wild elephants, Sri Lanka */
  --photo-yala: url('../images/yala-elephants-safari.jpg'); /* real guest safari photo, wild elephants, Sri Lanka */
  --photo-wilpattu: url('../images/yala-elephants-safari.jpg'); /* real guest safari photo, shared wildlife photo */
  --photo-mirissa: url('https://commons.wikimedia.org/wiki/Special:FilePath/Secret_beach_-_Mirissa_Sri_Lanka.jpg?width=2400'); /* verified CC BY-SA 4.0 */
  --photo-bentota: url('https://commons.wikimedia.org/wiki/Special:FilePath/Sri_Lanka,_Bentota,_beach_(1).JPG?width=2400'); /* verified CC BY-SA 3.0 */
  --photo-trincomalee: url('https://commons.wikimedia.org/wiki/Special:FilePath/Nillaveli_Beach.JPG?width=2400'); /* verified CC BY-SA 4.0 */
  --photo-arugam: url('https://commons.wikimedia.org/wiki/Special:FilePath/Arugam_Bay_Beach.jpg?width=2400'); /* Wikimedia Commons, Beaches of Sri Lanka category */
  --photo-pasikuda: url('https://commons.wikimedia.org/wiki/Special:FilePath/Amaya_Beach_Pasikudah.jpg?width=2400'); /* Wikimedia Commons, Beaches of Sri Lanka category */
}
.scene{
  position:relative;
  overflow:hidden;
  background:var(--forest-800) var(--site-photo) center/cover no-repeat;
  isolation:isolate;
}
.scene svg{ display:none; }
.scene::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(7,25,31,.78) 0%, rgba(7,25,31,.12) 45%, rgba(7,25,31,.02) 65%);
}
.scene-tone-a{ background:linear-gradient(160deg,rgba(44,140,163,.55),rgba(14,50,58,.78)), var(--site-photo) center 25%/cover no-repeat; }
.scene-tone-b{ background:linear-gradient(160deg,rgba(19,90,108,.6),rgba(7,31,38,.82)), var(--site-photo) center 55%/cover no-repeat; }
.scene-tone-c{ background:linear-gradient(160deg,rgba(226,105,74,.55),rgba(122,40,20,.78)), var(--site-photo) right center/cover no-repeat; }
.scene-tone-d{ background:linear-gradient(160deg,rgba(194,74,44,.6),rgba(74,20,10,.82)), var(--site-photo) left center/cover no-repeat; }
.scene-tone-sunset{ background:linear-gradient(160deg,rgba(231,147,90,.55),rgba(120,50,20,.78)), var(--site-photo) center 40%/cover no-repeat; }

/* =============================================================
   DESTINATIONS — asymmetric editorial grid
   ============================================================= */
.dest-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  grid-auto-rows:minmax(120px,auto);
  gap:clamp(14px,1.6vw,22px);
}
.dest-card{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  color:#fff;
  display:flex; align-items:flex-end;
  min-height:260px;
  grid-column:span 3;
  transition:transform .6s var(--ease), box-shadow .6s var(--ease);
  box-shadow:0 18px 40px -26px rgba(14,36,27,.5);
}
.dest-card::after{
  content:"";
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(0deg, rgba(6,20,24,.88) 0%, rgba(6,20,24,.42) 45%, rgba(6,20,24,0) 78%);
  pointer-events:none;
}
.dest-card:hover{ transform:translateY(-6px); box-shadow:0 28px 54px -22px rgba(14,36,27,.55); }
/* Asymmetric editorial layout — scoped to the homepage's 6-card
   .dest-grid only, so it never leaks into other grids that reuse
   the .dest-card component (Destinations, Experiences, Tours). */
.dest-grid .dest-card:nth-child(1){ grid-column:span 4; min-height:440px; }
.dest-grid .dest-card:nth-child(2){ grid-column:span 2; }
.dest-grid .dest-card:nth-child(3){ grid-column:span 2; }
.dest-grid .dest-card:nth-child(4){ grid-column:span 4; min-height:320px; }
.dest-grid .dest-card:nth-child(5){ grid-column:span 3; }
.dest-grid .dest-card:nth-child(6){ grid-column:span 3; }

.dest-card .scene{ position:absolute; inset:0; z-index:0; }
.dest-card .card-body{ position:relative; z-index:2; padding:26px 26px 24px; width:100%; }
.dest-card .tag{
  display:inline-block;
  font-size:.66rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.9);
  margin-bottom:10px;
}
.dest-card h3{
  font-family:var(--f-display); font-weight:500; font-size:1.5rem; line-height:1.15;
  text-shadow:0 2px 10px rgba(0,0,0,.35);
}
.dest-card p{
  margin-top:8px; font-size:.92rem; line-height:1.5; color:var(--cream-soft); max-width:34ch;
  text-shadow:0 1px 6px rgba(0,0,0,.4);
}
.dest-card .arrow{
  position:absolute; top:22px; right:22px; z-index:2;
  width:38px; height:38px; border-radius:50%;
  border:1px solid rgba(255,255,255,.45);
  display:flex; align-items:center; justify-content:center;
  transition:background-color .35s ease, transform .5s var(--ease), border-color .35s ease;
}
.dest-card .arrow svg{ width:15px; height:15px; }
.dest-card:hover .arrow{ background:var(--coral); border-color:var(--coral); transform:rotate(45deg); }

/* =============================================================
   EXPERIENCES — horizontal editorial scroller
   ============================================================= */
.exp-scroller{
  display:flex; gap:20px;
  overflow-x:auto;
  padding:6px 0 26px;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
}
.exp-scroller::-webkit-scrollbar{ display:none; }
.exp-card{
  scroll-snap-align:start;
  flex:0 0 auto;
  width:min(320px,78vw);
  border-radius:var(--radius-md);
  overflow:hidden;
  background:var(--paper);
  border:1px solid var(--sand-line);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease);
}
.exp-card:hover{ transform:translateY(-6px); box-shadow:0 24px 44px -28px rgba(14,36,27,.4); }
.exp-card .scene{ height:210px; }
.exp-card .card-body{ padding:22px 22px 26px; }
.exp-card .num{
  font-family:var(--f-display); font-style:italic; font-size:.85rem; color:var(--gold-dim);
}
.exp-card h3{
  margin-top:8px; font-family:var(--f-display); font-weight:500; font-size:1.28rem;
}
.exp-card p{ margin-top:8px; color:var(--ink-soft); font-size:.95rem; line-height:1.6; }

.scroller-controls{ display:flex; gap:10px; margin-top:6px; justify-content:flex-end; }
.scroller-btn{
  width:44px; height:44px; border-radius:50%;
  border:1px solid var(--sand-line);
  display:flex; align-items:center; justify-content:center;
  transition:background-color .3s ease, border-color .3s ease, transform .3s ease;
}
.scroller-btn:hover{ background:var(--forest-800); border-color:var(--forest-800); color:#fff; transform:translateY(-2px); }
.scroller-btn svg{ width:16px; height:16px; }

/* =============================================================
   TOURS teaser
   ============================================================= */
.tour-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2vw,24px);
}
.tour-card{
  border-radius:var(--radius-md);
  overflow:hidden;
  background:var(--paper);
  border:1px solid var(--sand-line);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease);
}
.tour-card:hover{ transform:translateY(-6px); box-shadow:0 24px 44px -28px rgba(14,36,27,.4); }
.tour-card .scene{ height:200px; }
.tour-card .card-body{ padding:24px; }
.tour-meta{
  display:flex; gap:16px; margin-top:14px; flex-wrap:wrap;
}
.tour-meta span{
  display:flex; align-items:center; gap:6px;
  font-size:.76rem; color:var(--ink-faint); font-weight:600;
}
.tour-meta svg{ width:14px; height:14px; color:var(--gold-dim); }
.tour-card h3{ font-family:var(--f-display); font-weight:500; font-size:1.3rem; }
.tour-card p{ margin-top:8px; color:var(--ink-soft); font-size:.95rem; line-height:1.6; }
.tour-note{
  margin-top:30px;
  display:flex; align-items:center; gap:14px;
  padding:18px 22px;
  border:1px dashed var(--sand-line);
  border-radius:var(--radius-md);
  color:var(--ink-soft); font-size:.88rem;
}
.tour-note svg{ width:20px; height:20px; flex:none; color:var(--gold-dim); }

/* =============================================================
   HONEYMOON — split feature band
   ============================================================= */
.honeymoon{
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:640px;
}
.honeymoon > *{ min-width:0; }
.honeymoon .scene{ min-height:360px; }
.honeymoon .copy-side{
  background:var(--forest-950);
  color:var(--cream-text);
  display:flex; align-items:center;
  padding:clamp(40px,6vw,90px);
}
.honeymoon .copy-inner{ max-width:460px; }
.honeymoon .copy-inner{ min-width:0; max-width:100%; }
.honeymoon h2{
  margin-top:18px;
  font-family:var(--f-display); font-weight:440;
  font-size:clamp(2rem,3.4vw,2.9rem); letter-spacing:-.01em;
  line-height:1.1;
  overflow-wrap:break-word;
}
.honeymoon h2 em{ font-style:italic; color:var(--gold-soft); font-weight:420; }
.honeymoon p{ margin-top:20px; color:var(--cream-soft); font-size:1.02rem; max-width:44ch; }
.honeymoon .btn{ margin-top:32px; }

/* =============================================================
   FLEET — dark band
   ============================================================= */
.fleet{
  position:relative;
  overflow:hidden;
  color:var(--cream-text);
}
.fleet-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(30px,6vw,80px);
  align-items:center;
}
.fleet-copy h2{ font-family:var(--f-display); margin-top:18px; font-size:clamp(2rem,3.4vw,2.7rem); letter-spacing:-.01em; }
.fleet-copy p{ margin-top:20px; color:var(--cream-soft); font-size:1.02rem; max-width:46ch; }
.fleet-points{ margin-top:30px; display:grid; gap:16px; }
.fleet-points li{ display:flex; gap:14px; align-items:flex-start; color:var(--cream-soft); font-size:.95rem; }
.fleet-points svg{ width:20px; height:20px; flex:none; color:var(--gold-soft); margin-top:2px; }
.fleet-points strong{ color:var(--cream-text); font-weight:700; display:block; margin-bottom:2px; }
.fleet-copy .btn{ margin-top:34px; }
.fleet-art{ border-radius:var(--radius-lg); overflow:hidden; min-height:420px; position:relative; }

/* =============================================================
   TRUST / PILLARS strip
   ============================================================= */
.pillars{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(24px,3vw,40px);
}
.pillar{ text-align:left; }
.pillar .icon-wrap{
  width:56px; height:56px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--ivory-deep);
  border:1px solid var(--sand-line);
  margin-bottom:20px;
}
.pillar .icon-wrap svg{ width:24px; height:24px; color:var(--forest-800); }
.pillar h3{ font-family:var(--f-display); font-weight:500; font-size:1.2rem; }
.pillar p{ margin-top:10px; color:var(--ink-soft); font-size:.96rem; line-height:1.6; max-width:32ch; }

/* =============================================================
   GALLERY — mosaic preview
   ============================================================= */
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:130px;
  gap:12px;
}
.gallery-grid .scene{ border-radius:var(--radius-sm); }
.gallery-grid .g1{ grid-column:span 2; grid-row:span 2; }
.gallery-grid .g2{ grid-column:span 2; grid-row:span 1; }
.gallery-grid .g3{ grid-column:span 1; grid-row:span 1; }
.gallery-grid .g4{ grid-column:span 1; grid-row:span 1; }
.gallery-grid .g5{ grid-column:span 2; grid-row:span 1; }
.gallery-grid .g6{ grid-column:span 2; grid-row:span 2; }
.gallery-grid .g7{ grid-column:span 1; grid-row:span 1; }
.gallery-grid .g8{ grid-column:span 1; grid-row:span 1; }
.gallery-cta{ margin-top:36px; text-align:center; }

/* =============================================================
   ABOUT teaser
   ============================================================= */
.about-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(30px,6vw,80px);
  align-items:center;
}
.about-copy h2{ font-family:var(--f-display); margin-top:18px; font-size:clamp(2rem,3.4vw,2.7rem); letter-spacing:-.01em; }
.about-copy p{ margin-top:20px; color:var(--ink-soft); font-size:1.02rem; max-width:48ch; }
.about-copy p + p{ margin-top:14px; }
.about-art{ position:relative; }
.about-art .scene{ border-radius:var(--radius-lg); min-height:420px; }
.about-badge{
  position:absolute; left:-24px; bottom:-24px;
  background:var(--paper);
  border:1px solid var(--sand-line);
  border-radius:var(--radius-md);
  padding:20px 24px;
  box-shadow:0 20px 44px -24px rgba(14,36,27,.4);
  max-width:230px;
}
.about-badge .infinity-divider{ max-width:70px; margin:0 0 10px; }
.about-badge p{ font-family:var(--f-display); font-style:italic; font-size:.98rem; color:var(--forest-800); line-height:1.3; }

/* =============================================================
   CTA / PLAN YOUR JOURNEY band
   ============================================================= */
.plan-band{
  position:relative;
  overflow:hidden;
  text-align:center;
  color:var(--cream-text);
  background:
    radial-gradient(90% 140% at 50% 0%, rgba(219,74,44,.22), transparent 60%),
    linear-gradient(180deg, var(--forest-900), var(--forest-950));
}
.plan-band .container{ max-width:760px; }
.plan-band h2{
  margin-top:18px;
  font-family:var(--f-display); font-weight:440;
  font-size:clamp(2.1rem,4.6vw,3.4rem); letter-spacing:-.01em;
  line-height:1.08;
}
.plan-band h2 em{ font-style:italic; color:var(--gold-soft); font-weight:420; }
.plan-band p{ margin-top:20px; color:var(--cream-soft); font-size:1.05rem; max-width:52ch; margin-inline:auto; }
.plan-actions{ margin-top:38px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.plan-contact-row{
  margin-top:56px; padding-top:36px;
  border-top:1px solid rgba(242,248,248,.16);
  display:flex; justify-content:center; gap:clamp(24px,5vw,64px); flex-wrap:wrap;
}
.plan-contact-item{ text-align:left; }
.plan-contact-item .eyebrow{ margin-bottom:8px; }
.plan-contact-item a, .plan-contact-item span{ font-family:var(--f-display); font-size:1.1rem; color:var(--cream-text); }

/* =============================================================
   FOOTER
   ============================================================= */
.site-footer{
  background:var(--forest-950);
  color:var(--cream-soft);
  padding:clamp(56px,7vw,80px) 0 28px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr 1fr 1fr;
  gap:clamp(26px,4vw,40px);
  padding-bottom:44px;
  border-bottom:1px solid rgba(242,248,248,.14);
}
.footer-brand img{ height:88px; width:auto; margin-bottom:18px; }
.footer-brand p{ max-width:34ch; font-size:.92rem; color:var(--cream-soft); }
.footer-social{ display:flex; flex-wrap:wrap; gap:14px; margin-top:22px; max-width:220px; }
.footer-social a{
  width:52px; height:52px; border-radius:50%;
  border:1px solid rgba(242,248,248,.25);
  display:flex; align-items:center; justify-content:center;
  transition:background-color .3s ease, border-color .3s ease, transform .3s ease;
}
.footer-social a:hover{ background:var(--coral); border-color:var(--coral); transform:translateY(-2px); }
.footer-social svg{ width:23px; height:23px; }

.footer-col h4{
  font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-soft); margin-bottom:18px;
}
.footer-col ul{ display:grid; gap:12px; }
.footer-col a{ font-size:.92rem; color:var(--cream-soft); transition:color .3s ease; }
.footer-col a:hover{ color:var(--cream-text); }
.footer-contact-list li{ font-size:.92rem; color:var(--cream-soft); word-break:break-word; }

.footer-bottom{
  padding-top:28px;
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:14px;
  font-size:.86rem; color:var(--cream-soft);
}
.footer-bottom .legal-links{ display:flex; gap:20px; }
.footer-bottom .legal-links a:hover{ color:var(--cream-text); }

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width: 1080px){
  .primary-nav{ display:none; }
  .nav-toggle{ display:inline-flex; }
  .intro-grid{ grid-template-columns:1fr; }
  .intro-visual{ aspect-ratio:16/11; }
  .honeymoon{ grid-template-columns:1fr; }
  .fleet-grid{ grid-template-columns:1fr; }
  .fleet-art{ min-height:320px; order:-1; }
  .about-grid{ grid-template-columns:1fr; }
  .about-art{ order:-1; }
  .about-badge{ position:static; margin-top:-40px; margin-left:24px; }
  .footer-grid{ grid-template-columns:1fr 1fr 1fr; }
}

@media (max-width: 860px){
  .tour-grid{ grid-template-columns:1fr; }
  .pillars{ grid-template-columns:1fr; }
  .dest-grid{ grid-template-columns:repeat(2,1fr); }
  .dest-grid .dest-card, .dest-grid .dest-card:nth-child(1), .dest-grid .dest-card:nth-child(2),
  .dest-grid .dest-card:nth-child(3), .dest-grid .dest-card:nth-child(4),
  .dest-grid .dest-card:nth-child(5), .dest-grid .dest-card:nth-child(6){
    grid-column:span 2; min-height:280px;
  }
  .gallery-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:150px; }
  .gallery-grid .g1,.gallery-grid .g6{ grid-column:span 2; grid-row:span 1; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width: 600px){
  .site-header{ padding:14px 0; }
  .site-header.scrolled{ padding:10px 0; }
  .site-header .container{ gap:10px; }
  .header-actions{ gap:7px; }
  .wa-icon-btn,
  .nav-toggle{ width:40px; height:40px; }
  .mobile-nav{ padding-top:96px; }
  .mobile-nav .mobile-cta{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; gap:32px; }
  .plan-contact-row{ flex-direction:column; align-items:center; text-align:center; }
  .plan-contact-item{ text-align:center; }
  .hero-inner{ padding-top:150px; }
  .hero-foot .container{ flex-direction:column; align-items:flex-start; gap:12px; }
}

/* =============================================================
   ADDITIONAL SCENE TONES (destinations page palette variety)
   ============================================================= */
.scene-tone-e{ background:linear-gradient(160deg,rgba(63,160,181,.55),rgba(10,50,60,.78)), var(--site-photo) center 15%/cover no-repeat; }
.scene-tone-f{ background:linear-gradient(160deg,rgba(138,74,48,.6),rgba(50,20,10,.82)), var(--site-photo) center 70%/cover no-repeat; }

/* --- Destination-specific real photographs (Command 14) --------- */
.scene-photo-kandy{ background:linear-gradient(160deg,rgba(19,90,108,.35),rgba(7,31,38,.6)), var(--photo-kandy) center 35%/cover no-repeat; }
.scene-photo-ella{ background:linear-gradient(160deg,rgba(63,160,181,.3),rgba(10,50,60,.55)), var(--photo-ella) center/cover no-repeat; }
.scene-photo-galle{ background:linear-gradient(160deg,rgba(226,105,74,.3),rgba(122,40,20,.55)), var(--photo-galle) center/cover no-repeat; }
.scene-photo-tea{ background:linear-gradient(160deg,rgba(44,140,163,.3),rgba(14,50,58,.55)), var(--photo-tea) center/cover no-repeat; }

/* =============================================================
   PAGE HEADER BANNER — used by interior pages (Destinations, etc.)
   Reuses the hero's dark/gold language at a shorter height so the
   brand foundation stays consistent without repeating the full hero.
   ============================================================= */
.page-header{
  position:relative;
  overflow:hidden;
  padding:168px 0 84px;
  color:var(--cream-text);
  background:
    radial-gradient(100% 120% at 84% 0%, rgba(219,74,44,.26), transparent 60%),
    linear-gradient(190deg, #0F4550 0%, #0A2E38 55%, #071F26 100%);
}
.page-header .scene-bg{ position:absolute; inset:0; z-index:0; opacity:.9; background:var(--site-photo) center 35%/cover no-repeat; }
.page-header .scene-bg svg{ display:none; }
.page-header::after{
  content:"";
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(0deg, rgba(7,26,31,.85) 0%, rgba(7,26,31,.25) 60%, rgba(7,26,31,0) 100%);
}
.page-header .container{ position:relative; z-index:2; }
.breadcrumb{
  display:flex; align-items:center; gap:8px;
  font-size:.74rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase;
  color:var(--cream-soft);
  margin-bottom:24px;
}
.breadcrumb a{ color:var(--cream-soft); transition:color .3s ease; }
.breadcrumb a:hover{ color:var(--gold-soft); }
.breadcrumb .sep{ opacity:.5; }
.breadcrumb .current{ color:var(--gold-soft); }
.page-header h1{
  font-family:var(--f-display); font-weight:440;
  font-size:clamp(2.4rem, 5.4vw, 4.2rem);
  line-height:1.04; letter-spacing:-.01em; max-width:16ch;
}
.page-header .lede{
  margin-top:22px; max-width:62ch;
  font-size:clamp(1rem,1.5vw,1.14rem);
  color:var(--cream-soft);
}

/* =============================================================
   EXPLORE GRID — the 15-destination editorial guide
   Reuses .dest-card exactly as defined for the homepage teaser,
   extended here with a highlights list and an explore link.
   ============================================================= */
.explore-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2vw,26px);
}
.explore-grid .dest-card{ min-height:460px; grid-column:span 1; }
.explore-grid .dest-card.featured{ grid-column:1 / -1; min-height:520px; }
.explore-grid .dest-card.featured .card-body{ max-width:640px; }
.explore-grid .dest-card.featured h3{ font-family:var(--f-display); font-size:clamp(1.8rem,3vw,2.6rem); }

.dest-card .highlights{
  display:flex; flex-wrap:wrap; gap:7px 14px;
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid rgba(242,248,248,.22);
}
.dest-card .highlights li{
  display:flex; align-items:center; gap:7px;
  font-size:.8rem; font-weight:600;
  color:var(--cream-soft);
  text-shadow:0 1px 4px rgba(0,0,0,.35);
}
.dest-card .highlights li::before{
  content:"";
  width:4px; height:4px; border-radius:50%;
  background:var(--gold-soft);
  flex:none;
}
.dest-card .explore-link{
  margin-top:18px;
  display:inline-flex; align-items:center; gap:.55em;
  font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:#fff;
  padding-bottom:4px;
  border-bottom:1px solid rgba(255,255,255,.5);
  transition:gap .35s var(--ease), border-color .3s ease, color .3s ease;
}
.dest-card .explore-link svg{ width:14px; height:14px; }
.dest-card:hover .explore-link{ gap:.85em; border-color:var(--gold-soft); color:var(--gold-soft); }
.dest-card .card-links{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.dest-card .card-links .explore-link{ margin-top:0; }
.dest-card .plan-trip-link{
  display:inline-flex; align-items:center; gap:.5em;
  margin-top:18px;
  font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--gold-soft);
  padding-bottom:4px;
  border-bottom:1px solid rgba(231,206,147,.5);
  transition:gap .35s var(--ease), border-color .3s ease, color .3s ease;
}
.dest-card .plan-trip-link svg{ width:14px; height:14px; }
.dest-card .plan-trip-link:hover{ gap:.85em; border-color:#fff; color:#fff; }

/* Destinations filter bar */
.dest-filter{
  display:flex; flex-wrap:wrap; gap:10px;
  margin-bottom:clamp(30px,4vw,46px);
}
.dest-filter button{
  padding:.7em 1.3em;
  border-radius:999px;
  border:1px solid var(--sand-line);
  font-size:.76rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-soft);
  transition:background-color .3s ease, color .3s ease, border-color .3s ease;
}
.dest-filter button:hover{ border-color:var(--forest-800); color:var(--forest-800); }
.dest-filter button.active{ background:var(--forest-800); border-color:var(--forest-800); color:#fff; }

@media (max-width: 980px){
  .explore-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 640px){
  .explore-grid{ grid-template-columns:1fr; }
  .explore-grid .dest-card, .explore-grid .dest-card.featured{ min-height:400px; }
  .page-header{ padding:150px 0 64px; }
}

/* =============================================================
   EXPERIENCES PAGE — feature pair + supporting grid
   Reuses .dest-card exactly (same scene/highlights/explore-link
   parts), so the visual language matches Destinations precisely.
   ============================================================= */
.exp-feature-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(16px,2vw,26px);
  margin-bottom:clamp(16px,2vw,26px);
}
.exp-feature-grid .dest-card{ min-height:540px; }
.exp-feature-grid .dest-card .card-body{ max-width:520px; }
.exp-feature-grid .dest-card h3{ font-family:var(--f-display); font-size:clamp(1.7rem,2.6vw,2.2rem); }
.exp-feature-grid .dest-card .eyebrow-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px; border-radius:50%;
  border:1px solid rgba(255,255,255,.4);
  margin-bottom:16px;
}
.exp-feature-grid .dest-card .eyebrow-icon svg{ width:20px; height:20px; color:#fff; }

.exp-subhead{
  margin:clamp(50px,6vw,76px) 0 clamp(28px,4vw,40px);
  text-align:center;
}
.exp-subhead h3{
  font-family:var(--f-display); font-weight:500;
  font-size:clamp(1.4rem,2.4vw,1.9rem);
  margin-top:.4em;
}

/* Compact CTA band used mid-page (distinct from the full plan-band) */
.mini-cta{
  margin-top:clamp(50px,6vw,80px);
  border-radius:var(--radius-lg);
  padding:clamp(40px,6vw,64px);
  text-align:center;
  position:relative;
  overflow:hidden;
  color:var(--cream-text);
  background:
    radial-gradient(80% 160% at 50% 0%, rgba(219,74,44,.24), transparent 60%),
    linear-gradient(180deg, var(--forest-900), var(--forest-950));
}
.mini-cta h3{
  font-family:var(--f-display); font-weight:440;
  font-size:clamp(1.6rem,3.2vw,2.4rem);
  max-width:20ch; margin:0 auto;
}
.mini-cta .btn{ margin-top:26px; }

@media (max-width: 900px){
  .exp-feature-grid{ grid-template-columns:1fr; }
  .exp-feature-grid .dest-card{ min-height:420px; }
}

/* =============================================================
   TOUR PACKAGE CARDS — Popular Journeys
   Extends .dest-card with a duration badge, route line, theme
   tags, a "best for" note, price line and two CTAs. Same base
   component as Destinations/Experiences for visual consistency.
   ============================================================= */
.tours-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2vw,26px);
}
/* Reset the homepage's asymmetric nth-child spans (defined for
   .dest-grid) so they don't leak into this uniform 3-col grid. */
.tours-grid .dest-card{ grid-column:span 1; }
.dest-card.tour-pkg{ min-height:560px; }
.dest-card.tour-pkg .card-body{ padding-bottom:26px; }
.dest-card.tour-pkg .duration-badge{
  position:absolute; top:22px; left:22px; z-index:2;
  background:rgba(255,255,255,.14);
  backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.4);
  color:#fff;
  font-size:.7rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  padding:.5em 1em;
  border-radius:999px;
}
.dest-card.tour-pkg .pkg-num{
  display:block;
  font-size:.66rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-soft);
  margin-bottom:8px;
}
.dest-card.tour-pkg h3{ font-family:var(--f-display); font-size:1.32rem; }
.dest-card.tour-pkg .route{
  margin-top:10px;
  font-size:.82rem; line-height:1.5;
  color:rgba(255,255,255,.92);
}
.dest-card.tour-pkg .route svg{ width:13px; height:13px; margin-right:4px; vertical-align:-1px; color:var(--gold-soft); }
.dest-card.tour-pkg .tag-line{
  margin-top:12px;
  font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--gold-soft);
}
.dest-card.tour-pkg .best-for{
  margin-top:8px;
  font-family:var(--f-display); font-style:italic; font-size:.86rem;
  color:rgba(255,255,255,.82);
}
.dest-card.tour-pkg .price-line{
  margin-top:14px; padding-top:14px;
  border-top:1px solid rgba(255,255,255,.22);
  font-size:.82rem; font-weight:700; letter-spacing:.03em;
  color:#fff;
}
.dest-card.tour-pkg .card-actions{
  display:flex; flex-wrap:wrap; gap:10px;
  margin-top:16px;
}
.dest-card.tour-pkg .card-actions .btn{ padding:.75em 1.25em; font-size:.74rem; }

@media (max-width: 980px){
  .tours-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 640px){
  .tours-grid{ grid-template-columns:1fr; }
  .dest-card.tour-pkg{ min-height:520px; }
}

/* =============================================================
   HONEYMOON PAGE — cinematic hero, reasons grid, enquiry form
   ============================================================= */

/* --- Cinematic hero (page-scoped; distinct from the homepage
   .hero, which is protected and untouched) -------------------- */
.hm-hero{
  position:relative;
  min-height:92svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  overflow:hidden;
  color:var(--cream-text);
  background:
    radial-gradient(120% 60% at 50% 100%, rgba(219,74,44,.30), transparent 62%),
    linear-gradient(180deg, #0A2E38 0%, #0E323A 55%, #7A3A22 130%);
}
.hm-hero-scene{ position:absolute; inset:0; z-index:0; background:var(--photo-galle) center 45%/cover no-repeat; }
.hm-hero-scene svg{ display:none; }
.hm-hero-vignette{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(0deg, rgba(7,20,18,.90) 0%, rgba(7,20,18,.32) 45%, rgba(7,20,18,0) 68%);
}
.hm-hero-inner{
  position:relative; z-index:2;
  padding:180px var(--gutter) 80px;
  width:100%; max-width:var(--container); margin-inline:auto;
}
.hm-hero h1{
  font-family:var(--f-display); font-weight:440;
  font-size:clamp(2.4rem,6vw,4.6rem);
  line-height:1.06; letter-spacing:-.01em; max-width:18ch;
}
.hm-hero h1 em{ font-style:italic; font-weight:420; color:var(--gold-soft); }
.hm-hero .lede{
  margin-top:24px; max-width:52ch;
  font-size:clamp(1rem,1.5vw,1.14rem);
  color:var(--cream-soft);
}
.hm-hero-actions{ margin-top:36px; display:flex; flex-wrap:wrap; gap:16px; }
.hm-hero-foot{ position:relative; z-index:2; border-top:1px solid rgba(242,248,248,.18); }
.hm-hero-foot .container{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px var(--gutter); gap:16px; flex-wrap:wrap;
}

/* --- Why Sri Lanka — 5-reason grid --------------------------- */
.why-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:clamp(18px,2.4vw,28px);
}
.why-item{ text-align:left; }
.why-item .icon-wrap{
  width:52px; height:52px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--ivory-deep); border:1px solid var(--sand-line);
  margin-bottom:18px;
}
.why-item .icon-wrap svg{ width:22px; height:22px; color:var(--forest-800); }
.why-item h3{ font-family:var(--f-display); font-weight:500; font-size:1.08rem; }
.why-item p{ margin-top:8px; color:var(--ink-soft); font-size:.92rem; line-height:1.6; }

/* --- Enquiry form --------------------------------------------- */
.hm-form-wrap{
  background:var(--paper);
  border:1px solid var(--sand-line);
  border-radius:var(--radius-lg);
  padding:clamp(28px,5vw,56px);
  box-shadow:0 30px 70px -40px rgba(14,36,27,.35);
}
.form-row{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:20px; margin-bottom:22px;
}
.form-row.two{ grid-template-columns:repeat(2,1fr); }
.field label{
  display:block; font-size:.72rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:var(--forest-800); margin-bottom:8px;
}
.field input, .field select{
  width:100%;
  font-family:var(--f-body); font-size:.94rem; color:var(--ink);
  padding:.85em 1em;
  border:1px solid var(--sand-line);
  border-radius:var(--radius-sm);
  background:var(--ivory);
  transition:border-color .3s ease, box-shadow .3s ease;
}
.field input:focus, .field select:focus{
  outline:none; border-color:var(--forest-600);
  box-shadow:0 0 0 3px rgba(28,127,152,.15);
}
.form-section-title{
  font-size:.72rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:var(--forest-800); margin:30px 0 12px;
}
.chip-group{ display:flex; flex-wrap:wrap; gap:10px; }
.chip-group button{
  padding:.65em 1.2em;
  border-radius:999px;
  border:1px solid var(--sand-line);
  font-size:.78rem; font-weight:700; letter-spacing:.03em;
  color:var(--ink-soft);
  background:var(--ivory);
  transition:background-color .3s ease, color .3s ease, border-color .3s ease;
}
.chip-group button:hover{ border-color:var(--forest-800); color:var(--forest-800); }
.chip-group button.active{ background:var(--coral); border-color:var(--coral); color:#fff; }
.hm-form-actions{
  margin-top:34px; padding-top:28px;
  border-top:1px solid var(--sand-line);
  display:flex; flex-wrap:wrap; align-items:center; gap:18px;
}
.hm-form-note{ font-size:.82rem; color:var(--ink-faint); }

@media (max-width: 900px){
  .why-grid{ grid-template-columns:repeat(2,1fr); }
  .form-row, .form-row.two{ grid-template-columns:1fr; }
}
@media (max-width: 560px){
  .why-grid{ grid-template-columns:1fr; }
  .hm-hero-inner{ padding-top:150px; }
  .intro-visual{ aspect-ratio:4/3; margin-bottom:26px; }
}

/* =============================================================
   ABOUT PAGE — trust strip, process steps, fleet preview, CTA
   ============================================================= */

/* --- Trust strip: safe, factual statements only --------------- */
.trust-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--sand-line);
  border-bottom:1px solid var(--sand-line);
}
.trust-item{
  padding:32px 24px;
  text-align:center;
  border-left:1px solid var(--sand-line);
}
.trust-item:first-child{ border-left:none; }
.trust-item .icon-wrap{
  width:44px; height:44px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--ivory-deep); border:1px solid var(--sand-line);
  margin:0 auto 14px;
}
.trust-item .icon-wrap svg{ width:19px; height:19px; color:var(--forest-800); }
.trust-item span{
  display:block;
  font-size:.76rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:var(--ink);
}

/* --- Process steps ---------------------------------------------- */
.process-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:clamp(20px,3vw,32px);
}
.process-step{ position:relative; padding-top:8px; }
.process-step .step-num{
  font-family:var(--f-display); font-style:italic; font-weight:420;
  font-size:2.4rem; color:var(--sand-line);
  line-height:1;
}
.process-step h3{
  margin-top:14px;
  font-family:var(--f-display); font-weight:500; font-size:1.1rem;
}
.process-step p{ margin-top:8px; color:var(--ink-soft); font-size:.88rem; }
.process-step:not(:last-child)::after{
  content:"";
  position:absolute; top:22px; left:calc(100% - 6px);
  width:calc(clamp(20px,3vw,32px) + 12px);
  height:1px;
  background:var(--sand-line);
  display:none;
}
@media (min-width: 901px){
  .process-step:not(:last-child)::after{ display:block; }
}

/* --- Fleet preview row ------------------------------------------ */
.fleet-preview-row{
  display:flex; flex-wrap:wrap;
  gap:14px;
  justify-content:center;
}
.fleet-chip{
  display:flex; align-items:center; gap:10px;
  padding:12px 20px 12px 12px;
  border:1px solid var(--sand-line);
  border-radius:999px;
  background:var(--paper);
}
.fleet-chip .icon-wrap{
  width:36px; height:36px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--ivory-deep); flex:none;
}
.fleet-chip .icon-wrap svg{ width:17px; height:17px; color:var(--forest-800); }
.fleet-chip span{ font-size:.86rem; font-weight:600; color:var(--ink); white-space:nowrap; }

/* --- Final CTA — full-width illustrated image band --------------- */
.cta-image-band{
  position:relative;
  overflow:hidden;
  min-height:480px;
  display:flex; align-items:center;
  color:var(--cream-text);
  text-align:center;
  background:linear-gradient(180deg, #123E48, #061619);
}
.cta-image-band .scene-bg{ position:absolute; inset:0; z-index:0; background:var(--site-photo) center 30%/cover no-repeat; }
.cta-image-band .scene-bg svg{ display:none; }
.cta-image-band::after{
  content:"";
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(0deg, rgba(7,26,31,.82) 0%, rgba(7,26,31,.5) 55%, rgba(7,26,31,.35) 100%);
}
.cta-image-band .container{ position:relative; z-index:2; max-width:760px; }
.cta-image-band h2{
  margin-top:18px;
  font-family:var(--f-display); font-weight:440;
  font-size:clamp(2.1rem,4.6vw,3.4rem); letter-spacing:-.01em; line-height:1.08;
}
.cta-image-band p{ margin-top:20px; color:var(--cream-soft); font-size:1.05rem; max-width:52ch; margin-inline:auto; }
.cta-image-band .plan-actions{ margin-top:34px; }

@media (max-width: 900px){
  .trust-strip{ grid-template-columns:repeat(2,1fr); }
  .trust-item:nth-child(3){ border-left:none; }
  .trust-item:nth-child(3), .trust-item:nth-child(4){ border-top:1px solid var(--sand-line); }
  .process-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 560px){
  .trust-strip{ grid-template-columns:1fr; }
  .trust-item{ border-left:none; border-top:1px solid var(--sand-line); }
  .trust-item:first-child{ border-top:none; }
  .process-grid{ grid-template-columns:1fr; }
}

/* =============================================================
   REVIEWS PAGE — placeholder-safe review system
   No real review data has been supplied yet, so every card here
   is an explicit, clearly-labelled placeholder rather than
   invented content. Swap the placeholder text/photos for real
   verified reviews as they're provided.
   ============================================================= */

/* --- Star rating row (outline = "not yet rated") -------------- */
.star-row{ display:flex; gap:4px; }
.star-row svg{ width:16px; height:16px; color:var(--sand-line); }
.star-row.on-dark svg{ color:rgba(242,248,248,.35); }

/* --- Review card ------------------------------------------------ */
.review-card{
  background:var(--paper);
  border:1px solid var(--sand-line);
  border-radius:var(--radius-md);
  padding:32px 28px;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease);
}
.review-card:hover{ transform:translateY(-6px); box-shadow:0 24px 44px -28px rgba(14,36,27,.35); }
.review-card .avatar{
  width:56px; height:56px; border-radius:50%;
  background:var(--ivory-deep); border:1px solid var(--sand-line);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:18px;
}
.review-card .avatar svg{ width:24px; height:24px; color:var(--ink-faint); }
.review-card .star-row{ margin-bottom:16px; }
.review-card blockquote{
  margin:0; font-family:var(--f-display); font-style:italic; font-weight:420;
  font-size:1.05rem; line-height:1.5; color:var(--ink-soft);
}
.review-card .reviewer{ margin-top:22px; padding-top:18px; border-top:1px solid var(--sand-line); }
.review-card .reviewer .name{
  font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink);
}
.review-card .reviewer .meta{ margin-top:4px; font-size:.78rem; color:var(--ink-faint); }
.review-card .travel-tag{
  display:inline-block; margin-top:12px;
  font-size:.66rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--forest-800); background:var(--ivory-deep);
  padding:.4em .9em; border-radius:999px;
}
.review-card .placeholder-flag{
  display:inline-flex; align-items:center; gap:6px;
  font-size:.64rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--gold-dim); margin-bottom:14px;
}
.review-card .placeholder-flag svg{ width:12px; height:12px; }

/* --- Featured client story -------------------------------------- */
.featured-story{
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:clamp(30px,6vw,70px);
  align-items:center;
}
.featured-story .photo-panel{
  aspect-ratio:4/5;
  border-radius:var(--radius-lg);
  background:var(--ivory-deep);
  border:1px dashed var(--sand-line);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:14px;
  text-align:center;
  padding:24px;
}
.featured-story .photo-panel svg{ width:40px; height:40px; color:var(--ink-faint); }
.featured-story .photo-panel span{
  font-size:.7rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-faint);
  max-width:20ch;
}
.featured-story .story-copy blockquote{
  margin:20px 0 0;
  font-family:var(--f-display); font-style:italic; font-weight:420;
  font-size:clamp(1.2rem,2.2vw,1.6rem); line-height:1.4; color:var(--ink);
}
.featured-story .story-attribution{ margin-top:22px; }
.featured-story .story-attribution .name{ font-weight:700; color:var(--ink); }
.featured-story .story-attribution .meta{ margin-top:2px; font-size:.88rem; color:var(--ink-faint); }
.featured-story .btn{ margin-top:30px; }

/* --- Trust / review source area ---------------------------------- */
.trust-source-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(18px,2.4vw,28px);
}
.trust-source-card{
  padding:32px;
  border:1px solid var(--sand-line);
  border-radius:var(--radius-md);
  background:var(--paper);
  text-align:center;
}
.trust-source-card h3{ font-family:var(--f-display); font-weight:500; font-size:1.2rem; }
.trust-source-card .star-row{ justify-content:center; margin:14px 0; }
.trust-source-card p{ font-size:.86rem; color:var(--ink-faint); }

/* --- Guest photo gallery preview --------------------------------- */
.guest-gallery-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:14px;
}
.guest-tile{
  aspect-ratio:3/4;
  border-radius:var(--radius-sm);
  background:var(--ivory-deep);
  border:1px dashed var(--sand-line);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:10px; text-align:center; padding:12px;
}
.guest-tile svg{ width:22px; height:22px; color:var(--ink-faint); }
.guest-tile span{ font-size:.66rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint); }

@media (max-width: 980px){
  .featured-story{ grid-template-columns:1fr; }
  .featured-story .photo-panel{ aspect-ratio:16/9; }
  .guest-gallery-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width: 640px){
  .trust-source-grid{ grid-template-columns:1fr; }
  .guest-gallery-grid{ grid-template-columns:repeat(2,1fr); }
}

/* =============================================================
   GALLERY PAGE — masonry grid, hover captions, lightbox
   Real-photo tiles reuse the single Command-07 photograph (see
   --site-photo) with different crops/tints per tile — the same
   "one image, reused carefully" system used site-wide. Guest,
   honeymoon and vehicle tiles are honest placeholders until real
   photographs are supplied.
   ============================================================= */

/* --- Featured banner -------------------------------------------- */
.gallery-feature{
  position:relative;
  overflow:hidden;
  min-height:56vh;
  border-radius:var(--radius-lg);
  display:flex; align-items:flex-end;
  color:var(--cream-text);
}
.gallery-feature img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:center 30%;
}
.gallery-feature::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(7,26,31,.85) 0%, rgba(7,26,31,.25) 55%, rgba(7,26,31,.15) 100%);
}
.gallery-feature .feature-body{ position:relative; z-index:2; padding:clamp(28px,5vw,56px); }
.gallery-feature .eyebrow{ color:var(--gold-soft); }
.gallery-feature h2{
  margin-top:.4em;
  font-family:var(--f-display); font-weight:440;
  font-size:clamp(2rem,4.6vw,3.4rem); letter-spacing:-.01em; line-height:1.05;
}
.gallery-feature h2 em{ font-style:italic; color:var(--gold-soft); font-weight:420; }

/* --- Masonry grid + tile ------------------------------------------ */
.masonry-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  grid-auto-rows:140px;
  grid-auto-flow:dense;
  gap:clamp(12px,1.6vw,20px);
}
.gallery-tile{
  position:relative;
  overflow:hidden;
  border-radius:var(--radius-md);
  cursor:pointer;
  background:var(--forest-800);
}
.gallery-tile img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover;
  transition:transform .7s var(--ease);
}
.gallery-tile:hover img{ transform:scale(1.06); }
.gallery-tile .tile-tint{ position:absolute; inset:0; mix-blend-mode:normal; opacity:.6; }
.gallery-tile .tile-caption{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  padding:20px;
  background:linear-gradient(0deg, rgba(7,26,31,.88) 0%, rgba(7,26,31,.15) 80%, transparent 100%);
  color:#fff;
}
.gallery-tile .tile-name{
  display:block;
  font-size:.78rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
}
.gallery-tile .tile-tag{
  display:block;
  margin-top:6px; font-size:.82rem; color:rgba(255,255,255,.88);
  max-height:0; opacity:0; overflow:hidden;
  transition:max-height .4s var(--ease), opacity .4s var(--ease), margin-top .4s var(--ease);
}
.gallery-tile:hover .tile-tag{ max-height:2.4em; opacity:1; }
.gallery-tile:focus-visible .tile-tag{ max-height:2.4em; opacity:1; }

.gallery-tile.size-xl{ grid-column:span 4; grid-row:span 2; }
.gallery-tile.size-lg{ grid-column:span 3; grid-row:span 2; }
.gallery-tile.size-md{ grid-column:span 3; grid-row:span 1; }
.gallery-tile.size-sm{ grid-column:span 2; grid-row:span 1; }
.gallery-tile.size-full{ grid-column:1 / -1; grid-row:span 1; min-height:200px; }

/* --- Placeholder sub-galleries (guests / honeymoon / vehicles) --- */
.subgallery-block{ margin-top:clamp(56px,7vw,84px); }
.subgallery-head{ margin-bottom:28px; }
.placeholder-tile-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:14px;
}
.placeholder-tile{
  aspect-ratio:3/4;
  border-radius:var(--radius-sm);
  background:var(--ivory-deep);
  border:1px dashed var(--sand-line);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:10px; text-align:center; padding:14px;
}
.placeholder-tile svg{ width:22px; height:22px; color:var(--ink-faint); }
.placeholder-tile span{ font-size:.68rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ink-faint); }

/* A real, supplied guest photo — same grid slot as the placeholder
   tiles, but shows the actual photograph with a caption instead of
   the dashed "awaiting photo" state. */
.guest-photo-tile{
  position:relative;
  aspect-ratio:3/4;
  border-radius:var(--radius-sm);
  overflow:hidden;
}
.guest-photo-tile img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 30%; }
.guest-photo-tile .tile-caption{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  padding:12px;
  background:linear-gradient(0deg, rgba(7,26,31,.85) 0%, transparent 100%);
}
.guest-photo-tile .tile-caption span{ font-size:.66rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:#fff; }

/* --- Lightbox ------------------------------------------------------ */
.lightbox{
  position:fixed; inset:0; z-index:200;
  background:rgba(6,22,25,.96);
  display:flex; align-items:center; justify-content:center;
  padding:clamp(16px,4vw,48px);
  opacity:0; pointer-events:none;
  transition:opacity .35s ease;
}
.lightbox.open{ opacity:1; pointer-events:auto; }
.lightbox-inner{ position:relative; width:100%; max-width:1100px; }
.lightbox-frame{ position:relative; width:100%; aspect-ratio:16/10; border-radius:var(--radius-md); overflow:hidden; background:var(--forest-900); }
.lightbox-frame img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.lightbox-caption{ margin-top:20px; text-align:center; color:var(--cream-text); }
.lightbox-caption .name{ font-family:var(--f-display); font-size:1.3rem; }
.lightbox-caption .meta{ margin-top:6px; font-size:.85rem; color:var(--cream-soft); }
.lightbox-close, .lightbox-prev, .lightbox-next{
  position:absolute;
  width:46px; height:46px; border-radius:50%;
  background:rgba(242,248,248,.1);
  border:1px solid rgba(242,248,248,.3);
  color:var(--cream-text);
  display:flex; align-items:center; justify-content:center;
  transition:background-color .3s ease, transform .3s ease;
}
.lightbox-close:hover, .lightbox-prev:hover, .lightbox-next:hover{ background:var(--coral); border-color:var(--coral); }
.lightbox-close{ top:-58px; right:0; }
.lightbox-close svg{ width:18px; height:18px; }
.lightbox-prev, .lightbox-next{ top:50%; transform:translateY(-50%); }
.lightbox-prev{ left:-58px; } .lightbox-next{ right:-58px; }
.lightbox-prev svg, .lightbox-next svg{ width:18px; height:18px; }

@media (max-width: 900px){
  .masonry-grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:170px; }
  .gallery-tile.size-xl, .gallery-tile.size-lg, .gallery-tile.size-md{ grid-column:span 2; grid-row:span 2; }
  .gallery-tile.size-sm{ grid-column:span 1; grid-row:span 1; }
  .gallery-tile.size-full{ grid-column:span 2; }
  .placeholder-tile-grid{ grid-template-columns:repeat(3,1fr); }
  .lightbox-prev{ left:0; } .lightbox-next{ right:0; }
  .lightbox-close{ top:-50px; }
}
@media (max-width: 560px){
  .masonry-grid{ grid-template-columns:1fr; grid-auto-rows:220px; }
  .gallery-tile.size-xl, .gallery-tile.size-lg, .gallery-tile.size-md, .gallery-tile.size-sm, .gallery-tile.size-full{ grid-column:1; grid-row:span 1; }
  .placeholder-tile-grid{ grid-template-columns:repeat(2,1fr); }
}

/* =============================================================
   PLAN YOUR JOURNEY — multi-step enquiry form
   Reuses the form field / chip-group system from the Honeymoon
   enquiry (Command 05) for visual consistency, extended with a
   stepper, progress bar, per-step validation and a confirmation
   state.
   ============================================================= */
.selected-journey-card{
  background:var(--ivory-deep); border:1px solid var(--sand-line);
  border-radius:var(--radius-md); padding:20px 24px; margin-bottom:30px;
  display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap;
}
.selected-journey-card .label{ font-size:.68rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--forest-800); margin-bottom:6px; }
.selected-journey-card .summary{ font-family:var(--f-display); font-size:1.1rem; color:var(--ink); }
.selected-journey-card .summary small{ display:block; font-family:var(--f-body); font-size:.82rem; color:var(--ink-faint); margin-top:4px; }
.selected-journey-card button{
  font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-faint); border-bottom:1px solid var(--sand-line); padding-bottom:2px; flex:none;
}
.selected-journey-card button:hover{ color:var(--coral); border-color:var(--coral); }

.stepper{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.stepper .step-pill{
  font-size:.66rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  padding:.5em 1em; border-radius:999px; border:1px solid var(--sand-line); color:var(--ink-faint);
  transition:background-color .3s ease, color .3s ease, border-color .3s ease;
}
.stepper .step-pill.active{ background:var(--forest-800); border-color:var(--forest-800); color:#fff; }
.stepper .step-pill.done{ border-color:var(--forest-600); color:var(--forest-800); }

.progress-label{ font-size:.76rem; font-weight:700; color:var(--forest-800); letter-spacing:.06em; text-transform:uppercase; margin-bottom:10px; }
.progress-bar{ height:4px; background:var(--sand-line); border-radius:999px; overflow:hidden; margin-bottom:32px; }
.progress-bar-fill{ height:100%; width:14.28%; background:var(--coral); transition:width .4s var(--ease); }

.form-step{ display:none; }
.form-step.active{ display:block; animation:stepIn .45s var(--ease); }
@keyframes stepIn{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:translateY(0); } }
.form-step .step-title{ font-family:var(--f-display); font-weight:500; font-size:1.3rem; margin-bottom:6px; }
.form-step .step-sub{ color:var(--ink-faint); font-size:.9rem; margin-bottom:26px; }

.field.error input{ border-color:var(--coral); }
.field-error-msg{ display:none; margin-top:6px; font-size:.78rem; color:var(--coral); }
.field.error .field-error-msg{ display:block; }

.chip-group button.single-mode.active{ background:var(--forest-800); border-color:var(--forest-800); }
.budget-note{
  margin-top:18px; padding:14px 18px;
  background:var(--ivory-deep); border-radius:var(--radius-sm);
  font-size:.84rem; color:var(--ink-soft);
}

.step-nav{
  display:flex; justify-content:space-between; align-items:center;
  margin-top:36px; padding-top:26px; border-top:1px solid var(--sand-line);
  gap:16px; flex-wrap:wrap;
}
.step-nav .btn-back{ color:var(--ink-faint); font-size:.78rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.step-nav .btn-back:hover{ color:var(--ink); }
.step-nav .btn-back[disabled]{ visibility:hidden; }

.hp-field{ position:absolute; left:-9999px; top:-9999px; }

.confirmation-panel{ display:none; text-align:center; padding:20px 10px 10px; }
.confirmation-panel.show{ display:block; }
.confirmation-panel .icon-wrap{
  width:64px; height:64px; border-radius:50%;
  background:var(--ivory-deep); border:1px solid var(--sand-line);
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 22px;
}
.confirmation-panel .icon-wrap svg{ width:28px; height:28px; color:var(--forest-800); }
.confirmation-panel h3{ font-family:var(--f-display); font-weight:500; font-size:1.5rem; }
.confirmation-panel p{ margin-top:12px; color:var(--ink-soft); max-width:52ch; margin-inline:auto; }
.confirmation-panel .conf-actions{ margin-top:26px; display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

.privacy-note{ display:flex; align-items:flex-start; gap:10px; margin-top:20px; font-size:.8rem; color:var(--ink-faint); }
.privacy-note svg{ width:16px; height:16px; flex:none; margin-top:1px; color:var(--forest-600); }

@media (max-width: 640px){
  .step-nav{ flex-direction:column-reverse; align-items:stretch; }
  .step-nav .btn{ width:100%; text-align:center; justify-content:center; }
  .step-nav .btn-back{ text-align:center; }
}

/* =============================================================
   CONTACT SECTION — three-option cards, location, social row
   Reused identically across every page as the site's single
   contact touchpoint.
   ============================================================= */
.contact-cards{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2vw,24px);
  margin-top:40px;
  text-align:left;
}
.contact-card{
  background:rgba(242,248,248,.06);
  border:1px solid rgba(242,248,248,.16);
  border-radius:var(--radius-md);
  padding:28px 26px;
  transition:transform .5s var(--ease), background-color .3s ease, border-color .3s ease;
}
.contact-card:hover{ transform:translateY(-5px); background:rgba(242,248,248,.1); border-color:rgba(242,248,248,.3); }
.contact-card .icon-wrap{
  width:44px; height:44px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(242,248,248,.1); border:1px solid rgba(242,248,248,.2);
  margin-bottom:18px;
}
.contact-card .icon-wrap svg{ width:19px; height:19px; color:var(--gold-soft); }
.contact-card h3{
  font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--gold-soft);
}
.contact-card .detail{
  margin-top:10px; font-family:var(--f-display); font-size:1rem; color:var(--cream-text);
  overflow-wrap:break-word;
}
.contact-card .btn{ margin-top:20px; width:100%; justify-content:center; }

.contact-location{
  margin-top:36px;
  display:flex; align-items:center; justify-content:center; gap:10px;
  font-size:.92rem; color:var(--cream-soft);
}
.contact-location svg{ width:16px; height:16px; color:var(--gold-soft); }

/* --- Social media row -------------------------------------------- */
.social-row{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-top:26px; }
.social-row a{
  position:relative;
  width:42px; height:42px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(242,248,248,.25);
  color:var(--cream-text);
  transition:background-color .3s ease, border-color .3s ease, transform .3s ease, opacity .3s ease;
}
.social-row a svg{ width:17px; height:17px; }
.social-row a:not(.social-inactive):hover{ background:var(--coral); border-color:var(--coral); transform:translateY(-2px); }
.social-row a.social-inactive{
  opacity:.35;
  cursor:default;
  pointer-events:none;
}
.social-row-note{ margin-top:14px; text-align:center; font-size:.76rem; color:var(--cream-soft); opacity:.75; }

@media (max-width: 780px){
  .contact-cards{ grid-template-columns:1fr; }
}

/* =============================================================
   FLOATING WHATSAPP BUTTON — fixed, bottom-right, all pages
   ============================================================= */
.wa-float{
  position:fixed;
  right:22px; bottom:22px;
  z-index:90;
  width:58px; height:58px;
  border-radius:50%;
  background:#128C5A;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 14px 32px -8px rgba(7,26,31,.55);
  transition:transform .3s ease, box-shadow .3s ease;
}
.wa-float:hover{ transform:translateY(-3px) scale(1.05); box-shadow:0 18px 38px -8px rgba(7,26,31,.6); }
.wa-float svg{ width:27px; height:27px; color:#fff; }
.wa-float .wa-float-tip{
  position:absolute;
  right:calc(100% + 12px);
  top:50%; transform:translateY(-50%) translateX(6px);
  background:var(--ink);
  color:#fff;
  font-size:.76rem; font-weight:600;
  padding:.6em 1em;
  border-radius:8px;
  white-space:nowrap;
  opacity:0; pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;
}
.wa-float .wa-float-tip::after{
  content:"";
  position:absolute; left:100%; top:50%; transform:translateY(-50%);
  border:6px solid transparent; border-left-color:var(--ink);
}
.wa-float:hover .wa-float-tip, .wa-float:focus-visible .wa-float-tip{
  opacity:1; transform:translateY(-50%) translateX(0);
}
@media (max-width: 640px){
  .wa-float{ right:16px; bottom:16px; width:52px; height:52px; }
  .wa-float svg{ width:24px; height:24px; }
  .wa-float .wa-float-tip{ display:none; }
}

/* =============================================================
   VERY SMALL SCREENS (<=400px) — allow long button labels to
   wrap instead of forcing horizontal overflow.
   ============================================================= */
@media (max-width: 400px){
  .btn{ white-space:normal; text-align:center; }
}

/* =============================================================
   TOUR DETAIL PAGES — one reusable system for all 15 packages
   ============================================================= */

/* --- Tour hero ---------------------------------------------------- */
.tour-hero{
  position:relative; overflow:hidden;
  min-height:64vh;
  display:flex; align-items:flex-end;
  color:var(--cream-text);
}
.tour-hero .scene-bg{ position:absolute; inset:0; z-index:0; }
.tour-hero::after{
  content:"";
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(0deg, rgba(7,26,31,.92) 0%, rgba(7,26,31,.35) 55%, rgba(7,26,31,.12) 100%);
}
.tour-hero .container{ position:relative; z-index:2; padding-top:150px; padding-bottom:56px; }
.tour-hero .duration-badge{
  display:inline-block; margin-bottom:16px;
  background:rgba(242,248,248,.14); border:1px solid rgba(242,248,248,.35);
  padding:.5em 1.1em; border-radius:999px;
  font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
}
.tour-hero h1{
  font-family:var(--f-display); font-weight:440;
  font-size:clamp(2.2rem,5vw,3.8rem); line-height:1.05; letter-spacing:-.01em;
  max-width:18ch;
}
.tour-hero .hero-route{
  margin-top:16px; font-size:1rem; color:var(--cream-soft);
  max-width:64ch;
}
.tour-hero .hero-actions{ margin-top:30px; display:flex; gap:14px; flex-wrap:wrap; }

/* --- Route timeline (vertical) ----------------------------------- */
.route-timeline{ max-width:420px; margin-inline:auto; }
.route-stop{
  position:relative;
  padding:0 0 34px 40px;
}
.route-stop::before{
  content:"";
  position:absolute; left:8px; top:6px; bottom:-6px;
  width:1px; background:var(--sand-line);
}
.route-stop:last-child::before{ display:none; }
.route-stop::after{
  content:"";
  position:absolute; left:2px; top:2px;
  width:13px; height:13px; border-radius:50%;
  background:var(--paper); border:2px solid var(--coral);
}
.route-stop .stop-name{
  font-family:var(--f-display); font-weight:500; font-size:1.15rem; color:var(--ink);
}
.route-stop:first-child .stop-name, .route-stop:last-child .stop-name{ color:var(--coral); }

/* --- Itinerary timeline -------------------------------------------- */
.itinerary-timeline{ position:relative; }
.itinerary-day{
  position:relative;
  padding:0 0 40px 64px;
}
.itinerary-day::before{
  content:"";
  position:absolute; left:23px; top:8px; bottom:-8px;
  width:1px; background:var(--sand-line);
}
.itinerary-day:last-child::before{ display:none; }
.itinerary-day .day-num{
  position:absolute; left:0; top:0;
  width:47px; height:47px; border-radius:50%;
  background:var(--forest-800); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--f-display); font-weight:500; font-size:.92rem;
}
.itinerary-day .day-title{ font-family:var(--f-display); font-weight:500; font-size:1.2rem; color:var(--ink); }
.itinerary-day .day-route{
  margin-top:4px; font-size:.76rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-dim);
}
.itinerary-day .day-desc{ margin-top:12px; color:var(--ink-soft); font-size:.95rem; line-height:1.65; max-width:64ch; }
.itinerary-day .day-activities{ margin-top:14px; display:flex; flex-wrap:wrap; gap:8px; }
.itinerary-day .day-activities span{
  font-size:.72rem; font-weight:600; color:var(--forest-800);
  background:var(--ivory-deep); border:1px solid var(--sand-line);
  padding:.4em .85em; border-radius:999px;
}

/* --- Tag pills (highlights / accommodation options, display-only) - */
.tag-pill-row{ display:flex; flex-wrap:wrap; gap:10px; }
.tag-pill{
  font-size:.78rem; font-weight:700; letter-spacing:.03em;
  padding:.65em 1.2em; border-radius:999px;
  background:var(--ivory-deep); border:1px solid var(--sand-line); color:var(--ink);
}
.tag-pill.on-dark{ background:rgba(242,248,248,.08); border-color:rgba(242,248,248,.25); color:var(--cream-text); }

/* --- Included / Not included checklist ----------------------------- */
.check-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,50px); }
.check-list{ display:grid; gap:14px; }
.check-list li{ display:flex; align-items:flex-start; gap:12px; font-size:.94rem; color:var(--ink-soft); }
.check-list.included svg{ width:19px; height:19px; flex:none; margin-top:1px; color:var(--forest-600); }
.check-list.excluded svg{ width:19px; height:19px; flex:none; margin-top:1px; color:var(--ink-faint); }

/* --- Optional experiences ------------------------------------------- */
.optional-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.optional-card{
  padding:20px 22px; border:1px solid var(--sand-line); border-radius:var(--radius-md); background:var(--paper);
}
.optional-card .badge{
  display:inline-block; font-size:.62rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:var(--gold-dim); background:var(--ivory-deep); padding:.3em .8em; border-radius:999px; margin-bottom:10px;
}
.optional-card h4{ font-family:var(--f-display); font-weight:500; font-size:1.02rem; }

/* --- Summary strip reuses .trust-strip; tour-specific label tweak --- */
.tour-summary-strip .trust-item span{ font-size:.82rem; }
.tour-summary-strip .trust-item .strip-label{
  display:block; font-size:.64rem; letter-spacing:.1em; color:var(--ink-faint); margin-bottom:4px; font-weight:700; text-transform:uppercase;
}

@media (max-width: 860px){
  .check-grid{ grid-template-columns:1fr; }
  .optional-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width: 560px){
  .optional-grid{ grid-template-columns:1fr; }
  .itinerary-day{ padding-left:52px; }
  .itinerary-day .day-num{ width:38px; height:38px; font-size:.78rem; }
  .itinerary-day::before{ left:18px; }
}

/* =============================================================
   NAMED PHOTO TILES — real, verified, distinctly different
   photographs used where they are genuinely relevant, instead of
   the single Sigiriya photo standing in everywhere.
   ============================================================= */
.scene-photo-sigiriya{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(19,90,108,.32),rgba(7,31,38,.58)), var(--photo-sigiriya); background-position:center, center 30%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-kandy{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(219,74,44,.22),rgba(74,20,10,.5)), var(--photo-kandy); background-position:center, center 38%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-ella{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(63,160,181,.26),rgba(10,50,60,.5)), var(--photo-ella); background-position:center, center 42%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-galle{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(226,105,74,.24),rgba(90,40,20,.5)), var(--photo-galle); background-position:center, center 35%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-tea{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(44,140,163,.24),rgba(14,50,58,.5)), var(--photo-tea); background-position:center, center 28%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-anuradhapura{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(219,74,44,.22),rgba(74,20,10,.5)), var(--photo-anuradhapura); background-position:center, center 35%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-jaffna{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(19,90,108,.24),rgba(7,31,38,.5)), var(--photo-jaffna); background-position:center, center 35%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-nuwara-eliya{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(44,140,163,.2),rgba(14,50,58,.42)), var(--photo-nuwara-eliya); background-position:center, center 22%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-dambulla{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(219,74,44,.22),rgba(74,20,10,.48)), var(--photo-dambulla); background-position:center, center 32%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-polonnaruwa{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(226,105,74,.22),rgba(90,40,20,.5)), var(--photo-polonnaruwa); background-position:center, center 30%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-wildlife{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(138,74,48,.24),rgba(50,20,10,.5)), var(--photo-wildlife); background-position:center, center 40%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-yala{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(44,110,76,.22),rgba(10,40,22,.52)), var(--photo-yala); background-position:center, center 48%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-wilpattu{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(76,120,72,.22),rgba(20,45,24,.52)), var(--photo-wilpattu); background-position:center, center 52%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-mirissa{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(25,145,170,.20),rgba(8,60,72,.45)), var(--photo-mirissa); background-position:center, center 48%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-bentota{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(226,145,78,.18),rgba(76,48,20,.42)), var(--photo-bentota); background-position:center, center 48%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-trincomalee{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(26,150,180,.18),rgba(8,65,78,.44)), var(--photo-trincomalee); background-position:center, center 50%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-arugam{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(38,143,167,.18),rgba(8,55,67,.46)), var(--photo-arugam); background-position:center, center 50%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-pasikuda{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(48,154,190,.18),rgba(10,66,86,.42)), var(--photo-pasikuda); background-position:center, center 52%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }


/* Honest "photo coming soon" treatment — used only where no
   verified, correctly-matching photograph exists yet. Deliberately
   does NOT borrow another destination's photograph. */
.scene-awaiting-photo{ position:relative; }
.scene-awaiting-photo .awaiting-tag{
  position:absolute; left:16px; bottom:16px; z-index:2;
  display:inline-flex; align-items:center; gap:6px;
  font-size:.64rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
  color:rgba(242,248,248,.85);
  background:rgba(7,26,31,.55); border:1px solid rgba(242,248,248,.25);
  padding:.4em .8em; border-radius:999px;
}
.scene-awaiting-photo .awaiting-tag svg{ width:12px; height:12px; }

/* =============================================================
   FLEET VEHICLE PHOTOS — real, licensed model photographs.
   Each illustrates the vehicle type offered, not a specific
   physical unit (see the note on the Fleet page).
   ============================================================= */
.scene-veh-prius{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(44,140,163,.22),rgba(14,50,58,.4)), var(--photo-veh-prius); background-position:center, center 55%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-veh-fit{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(219,74,44,.2),rgba(74,20,10,.38)), var(--photo-veh-fit); background-position:center, center 55%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-veh-kdh{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(63,160,181,.22),rgba(10,50,60,.4)), var(--photo-veh-kdh); background-position:center, center 50%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-veh-coaster{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(226,105,74,.2),rgba(90,40,20,.38)), var(--photo-veh-coaster); background-position:center, center 50%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-veh-fuso{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(44,140,163,.2),rgba(14,50,58,.38)), var(--photo-veh-fuso); background-position:center, center 50%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-veh-prado{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(219,74,44,.22),rgba(74,20,10,.4)), var(--photo-veh-prado); background-position:center, center 50%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-veh-x5{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(23,34,42,.3),rgba(10,15,20,.5)), var(--photo-veh-x5); background-position:center, center 50%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }
.scene-photo-tea-picker{ background-color:var(--forest-800); background-image:linear-gradient(160deg,rgba(44,140,163,.2),rgba(14,50,58,.38)), var(--photo-tea-picker); background-position:center, center 30%; background-size:cover, cover; background-repeat:no-repeat, no-repeat; }

/* =====================================================================
   PHP-conversion additions — classes used by the new dynamic pages
   (Reviews grid, Plan Your Journey form) that did not yet have rules.
   ===================================================================== */
.reviews-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:24px; }
.review-stars{ color:var(--gold); font-size:1.05rem; letter-spacing:.1em; margin-bottom:14px; }
.review-meta{ margin-top:16px; font-size:.86rem; color:var(--ink-faint); }
.field-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:16px 20px; }
@media (max-width: 640px){ .field-grid-2{ grid-template-columns:1fr; } }
.form-actions{ margin-top:24px; }

/* =====================================================================
   PREMIUM HOVER POLISH — subtle image zoom on destination/tour cards.
   A common, elegant pattern on high-end travel sites: the photo scales
   gently within its clipped card on hover, while the card itself lifts
   (already implemented above). Generic UI technique, not copied from
   any specific site.
   ===================================================================== */
.dest-card .scene{ transition:transform .7s var(--ease); }
.dest-card:hover .scene{ transform:scale(1.07); }

.tour-card .scene{ transition:transform .7s var(--ease); }
.tour-card:hover .scene{ transform:scale(1.07); }

/* Gentle title shift on hover for extra polish */
.dest-card h3{ transition:color .35s ease; }
.tour-card h3{ transition:color .35s ease; }

/* =====================================================================
   WOOW READABILITY SYSTEM — approved ivory/coral/forest treatment
   Keeps photography visible while placing contrast only behind copy.
   ===================================================================== */
:root{
  --woow-ivory:#FFF8EA;
  --woow-coral:#F06F5B;
  --woow-forest:#0A3534;
  --woow-forest-deep:#062725;
}

/* Homepage hero */
.hero .hero-scene{
  filter:saturate(.94) contrast(1.02);
}
.hero .hero-vignette{
  background:
    linear-gradient(90deg, rgba(4,37,36,.76) 0%, rgba(4,37,36,.48) 42%, rgba(4,37,36,.08) 72%),
    linear-gradient(0deg, rgba(4,28,28,.64) 0%, rgba(4,28,28,.08) 55%);
}
.hero .hero-inner{
  margin-inline:auto;
  padding-top:clamp(150px,22vh,230px);
  padding-bottom:clamp(58px,9vh,92px);
}
.hero h1{
  color:var(--woow-ivory);
  text-shadow:0 3px 22px rgba(0,22,22,.72);
}
.hero h1 span,
.hero h1 em{ display:block; }
.hero h1 em{
  color:var(--woow-coral);
  font-style:normal;
  font-weight:500;
}
.hero .lede{
  color:var(--woow-ivory);
  font-weight:600;
  text-shadow:0 2px 12px rgba(0,20,20,.78);
}
.hero .btn-line{
  border-color:rgba(255,248,234,.76) !important;
  color:var(--woow-ivory) !important;
  background:rgba(4,37,36,.32);
  backdrop-filter:blur(5px);
}
.hero .btn-ghost-dark{
  color:#fff;
  border-color:rgba(255,255,255,.5);
  background:rgba(10,92,65,.78);
}

/* Destination and experience photo cards */
.dest-card::after{
  background:linear-gradient(
    0deg,
    rgba(6,39,37,.98) 0%,
    rgba(6,39,37,.91) 25%,
    rgba(6,39,37,.58) 52%,
    rgba(6,39,37,.05) 82%
  );
}
.dest-card .scene{
  filter:saturate(.96) contrast(1.02);
}
.dest-card .card-body{
  padding:30px 28px 26px;
}
.dest-card .tag{
  color:var(--woow-coral);
  font-size:.7rem;
  font-weight:800;
  text-shadow:0 1px 8px rgba(0,20,20,.8);
}
.dest-card h3{
  color:var(--woow-ivory);
  font-size:clamp(1.55rem,2.4vw,2.15rem);
  font-weight:560;
  text-shadow:0 3px 16px rgba(0,18,18,.86);
}
.dest-card p{
  color:rgba(255,248,234,.96);
  font-weight:500;
  text-shadow:0 2px 10px rgba(0,18,18,.86);
}
.dest-card .arrow{
  color:var(--woow-coral);
  border-color:rgba(240,111,91,.9);
}
.dest-card .explore-link{
  color:var(--woow-ivory);
  border-color:var(--woow-coral);
  font-weight:800;
  text-shadow:0 1px 8px rgba(0,18,18,.7);
}
.experience-card::after{
  background:linear-gradient(0deg,rgba(6,39,37,.99) 0%,rgba(6,39,37,.93) 34%,rgba(6,39,37,.52) 64%,rgba(6,39,37,.04) 88%);
}

@media (max-width:700px){
  .hero .hero-inner{
    padding-top:132px;
    padding-bottom:48px;
  }
  .hero h1{ font-size:clamp(2.55rem,12vw,4.1rem); max-width:10ch; }
  .hero .lede{ font-size:1rem; max-width:32ch; }
  .hero-actions{ gap:10px; }
  .hero-actions .btn{ width:100%; justify-content:center; }
  .dest-card .card-body{ padding:24px 22px 22px; }
  .dest-card h3{ font-size:1.7rem; }
  .dest-card p{ font-size:.9rem; line-height:1.55; }
}

/* =====================================================================
   HOMEPAGE ROTATING DESTINATIONS + TOURS
   Scoped to the two homepage carousels so interior pages are unchanged.
   ===================================================================== */
#destinations .section-head,
#tours .section-head{
  align-items:center;
  justify-content:center;
  flex-direction:column;
  text-align:center;
  gap:20px;
}
#destinations .section-head > div,
#tours .section-head > div{ margin-inline:auto; }
#destinations .section-head p{ margin-inline:auto; max-width:68ch; }
#destinations .section-head .eyebrow,
#tours .section-head .eyebrow{ justify-content:center; }

/* Centred destination introduction and the requested Kandy feature image. */
#destinations .home-destination-intro{
  max-width:860px;
  margin-inline:auto;
  margin-bottom:clamp(28px,4vw,44px);
}
#destinations .home-destination-intro > div{ width:100%; }
#destinations .home-destination-intro h2,
#destinations .home-destination-intro p{ text-align:center; }
#destinations .home-destination-intro .btn{ margin-inline:auto; }
.home-kandy-banner{
  position:relative;
  display:block;
  width:min(100%,1080px);
  aspect-ratio:16/7;
  margin:0 auto clamp(34px,5vw,58px);
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--forest-900);
  box-shadow:0 18px 45px rgba(10,46,56,.14);
}
.home-kandy-banner::after{
  display:none;
}
.home-kandy-banner img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 54%;
  transition:transform .6s ease;
}
.home-kandy-banner:hover img{ transform:scale(1.025); }
.home-kandy-banner-copy{
  position:absolute;
  z-index:1;
  left:clamp(22px,4vw,52px);
  right:clamp(22px,4vw,52px);
  bottom:clamp(20px,3vw,40px);
  color:#fff;
  text-shadow:0 2px 14px rgba(0,0,0,.55);
}
.home-kandy-banner-copy small{
  display:block;
  margin-bottom:6px;
  color:var(--coral-soft,#ffb0a2);
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.home-kandy-banner-copy strong{
  display:block;
  font-family:var(--f-display);
  font-size:clamp(2rem,4vw,3.5rem);
  font-weight:500;
  line-height:1;
}
.home-kandy-banner-copy > span{
  display:block;
  margin-top:10px;
  max-width:520px;
  font-size:clamp(.9rem,1.5vw,1.08rem);
  font-weight:600;
}

/* Final homepage-only alignment and readability refinements. */
#tours .home-tour-intro{
  width:min(100%,860px);
  margin-inline:auto;
  margin-bottom:clamp(30px,4vw,48px);
  text-align:center;
}
#tours .home-tour-intro > div{ width:100%; }
#tours .home-tour-intro h2{ text-align:center; }
#tours .home-tour-intro .btn{ margin-inline:auto; }

.home-why-section .section-head{
  width:min(100%,900px);
  margin-inline:auto;
  text-align:center;
}
.home-why-section .why-grid{
  width:min(100%,1180px);
  margin-inline:auto;
  gap:clamp(20px,2.5vw,34px);
}
.home-why-section .why-item{
  text-align:center;
  padding-inline:clamp(8px,1vw,16px);
}
.home-why-section .why-item .icon-wrap{
  width:48px;
  height:48px;
  margin:0 auto 18px;
}
.home-why-section .why-item h3{
  font-size:clamp(1.25rem,1.6vw,1.38rem);
  line-height:1.3;
}
.home-why-section .why-item p{
  max-width:31ch;
  margin-inline:auto;
  font-size:clamp(1rem,1.15vw,1.08rem);
  line-height:1.7;
}

.home-reviews-section .section-head{
  width:min(100%,860px);
  margin-inline:auto clamp(30px,4vw,46px);
  text-align:center;
}
.home-reviews-section .section-head p{
  max-width:62ch;
  margin-inline:auto;
}
.home-reviews-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
  align-items:stretch;
}
.home-review-card{
  height:100%;
  padding:clamp(24px,2.4vw,34px);
}
.home-review-card[hidden]{ display:none !important; }
.home-review-card p{
  color:var(--ink-soft);
  font-size:.98rem;
  line-height:1.75;
}
.home-reviews-controls{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  margin-top:26px;
}
.home-reviews-controls[hidden]{ display:none !important; }
.home-reviews-nav{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border:1px solid var(--sand-line);
  border-radius:50%;
  background:var(--paper);
  color:var(--forest-950);
  font-size:1.45rem;
  cursor:pointer;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease;
}
.home-reviews-nav:hover{
  background:var(--forest-950);
  border-color:var(--forest-950);
  color:#fff;
}
.home-reviews-controls [data-reviews-status]{
  min-width:72px;
  color:var(--ink-faint);
  font-size:.84rem;
  font-weight:700;
  text-align:center;
}
.home-reviews-toggle-wrap{
  display:flex;
  justify-content:center;
  margin-top:20px;
}

@media (max-width:900px){
  .home-why-section .why-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .home-reviews-grid{ grid-template-columns:1fr; }
}
@media (max-width:600px){
  .home-why-section .why-grid{ grid-template-columns:1fr; }
  .home-why-section .why-item{ max-width:420px; margin-inline:auto; }
  .home-review-card{ padding:22px; }
}

.home-carousel{
  position:relative;
  padding-inline:54px;
}
.home-carousel-viewport{
  overflow:hidden;
  border-radius:var(--radius-lg);
}
.home-carousel-track{
  display:flex;
  gap:20px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
  padding:4px 2px 12px;
}
.home-carousel-track::-webkit-scrollbar{ display:none; }
.home-carousel-slide{
  flex:0 0 calc((100% - 40px) / 3);
  min-width:0;
  scroll-snap-align:start;
}
.home-carousel .dest-card{
  grid-column:auto !important;
  min-height:430px !important;
}
.home-carousel-btn{
  position:absolute;
  top:50%;
  z-index:8;
  width:44px;
  height:44px;
  border-radius:50%;
  transform:translateY(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--sand-line);
  background:var(--paper);
  color:var(--forest-950);
  box-shadow:0 12px 28px -18px rgba(6,39,37,.55);
  font-family:Arial,sans-serif;
  font-size:2rem;
  line-height:1;
  transition:background-color .25s ease,color .25s ease,transform .25s ease;
}
.home-carousel-btn:hover{
  color:#fff;
  background:var(--coral);
  border-color:var(--coral);
  transform:translateY(-50%) scale(1.05);
}
.home-carousel-btn.prev{ left:0; }
.home-carousel-btn.next{ right:0; }
.home-carousel-dots{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
}
.home-carousel-dot{
  width:8px;
  height:8px;
  padding:0;
  border-radius:999px;
  background:var(--sand-line);
  transition:width .25s ease,background-color .25s ease;
}
.home-carousel-dot.active{ width:24px; background:var(--coral); }

/* Tour copy sits clearly on the photograph, with contrast only below it. */
.home-tour-card{
  position:relative;
  min-height:430px;
  display:flex;
  align-items:flex-end;
  isolation:isolate;
  color:#fff;
  border:0;
  background:var(--forest-900);
}
.home-tour-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(0deg,rgba(6,39,37,.98) 0%,rgba(6,39,37,.88) 32%,rgba(6,39,37,.30) 62%,rgba(6,39,37,.02) 82%);
}
.home-tour-card .scene{ position:absolute; inset:0; height:auto; z-index:0; }
.home-tour-card .card-body{ position:relative; z-index:2; width:100%; padding:30px 28px 26px; }
.home-tour-card h3{
  color:var(--woow-ivory);
  font-size:clamp(1.45rem,2.1vw,1.9rem);
  font-weight:560;
  text-shadow:0 3px 14px rgba(0,18,18,.85);
}
.home-tour-card p{
  color:rgba(255,248,234,.96);
  font-weight:600;
  text-shadow:0 2px 10px rgba(0,18,18,.86);
}
.home-tour-card .tour-meta span{ color:rgba(255,248,234,.94); }
.home-tour-card .tour-meta svg{ color:var(--woow-coral); }
.home-tour-card .explore-link{
  display:inline-flex;
  align-items:center;
  gap:.55em;
  margin-top:16px;
  padding-bottom:4px;
  border-bottom:2px solid var(--woow-coral);
  color:var(--woow-ivory);
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.home-tour-card .explore-link svg{ width:14px; height:14px; }

@media (max-width:1080px){
  .brand img{ height:54px; }
  .brand .brand-word{ font-size:1.25rem; }
  .site-header.scrolled .brand img{ height:48px; }
}
@media (max-width:820px){
  .home-carousel-slide{ flex-basis:calc((100% - 18px) / 2); }
  .home-carousel-track{ gap:18px; }
}
@media (max-width:600px){
  .brand img{ height:48px; }
  .brand .brand-word{ font-size:1.05rem; }
  .brand .brand-word small{ font-size:.58rem; }
  .site-header.scrolled .brand img{ height:44px; }
  .home-carousel{ padding-inline:0; padding-bottom:58px; }
  .home-carousel-viewport{ overflow:visible; }
  .home-carousel-track{ gap:14px; overflow-x:auto; }
  .home-carousel-slide{ flex-basis:88%; }
  .home-carousel .dest-card,
  .home-tour-card{ min-height:410px !important; }
  .home-carousel-btn{ top:auto; bottom:0; transform:none; }
  .home-carousel-btn:hover{ transform:scale(1.05); }
  .home-carousel-btn.prev{ left:calc(50% - 52px); }
  .home-carousel-btn.next{ right:calc(50% - 52px); }
  .home-carousel-dots{ display:none; }
  .footer-brand img{ height:72px; }
  .footer-social{ max-width:200px; }
  .footer-social a{ width:48px; height:48px; }
  .footer-social svg{ width:21px; height:21px; }
  #destinations .home-destination-intro{ margin-bottom:24px; }
  .home-kandy-banner{
    aspect-ratio:4/5;
    margin-bottom:32px;
    border-radius:18px;
  }
  .home-kandy-banner img{ object-position:center; }
}

/* =========================================================
   WOOW PREMIUM MOBILE MENU — CLEAN FINAL OVERRIDE
   MOBILE ONLY
========================================================= */

@media (max-width: 780px) {

    html,
    body {
        overflow-x: hidden;
    }

    body.menu-open {
        overflow: hidden !important;
    }

    .site-header .primary-nav {
        display: none !important;
    }

    .site-header .language-switcher {
        display: none !important;
    }

    .site-header .nav-toggle {
        display: inline-flex !important;
    }

    #mobileNav.mobile-nav.woow-premium-mobile {
        position: fixed !important;
        inset: 0 !important;
        z-index: 999999 !important;

        display: block !important;
        width: 100% !important;
        height: 100dvh !important;

        margin: 0 !important;
        padding: 0 !important;

        overflow-y: auto !important;
        overflow-x: hidden !important;

        background: #fffaf5 !important;

        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;

        transform: translateY(-10px) !important;

        transition:
            opacity .28s ease,
            transform .28s ease,
            visibility .28s ease !important;
    }

    body.menu-open #mobileNav.mobile-nav.woow-premium-mobile {
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        transform: translateY(0) !important;
    }

    #mobileNav .wpm-shell {
        width: 100% !important;
        min-height: 100% !important;
        box-sizing: border-box !important;

        padding:
            calc(12px + env(safe-area-inset-top))
            16px
            calc(28px + env(safe-area-inset-bottom)) !important;

        background:
            radial-gradient(
                circle at top right,
                rgba(219, 74, 44, .07),
                transparent 34%
            ),
            linear-gradient(
                180deg,
                #fffdf9 0%,
                #fff8f1 100%
            ) !important;
    }

    #mobileNav .wpm-top {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        margin: 0 0 14px !important;
    }

    #mobileNav .wpm-brand {
        display: flex !important;
        align-items: center !important;
        gap: 9px !important;
        text-decoration: none !important;
    }

    #mobileNav .wpm-brand img {
        display: block !important;
        width: 58px !important;
        height: 58px !important;
        object-fit: contain !important;
        margin: 0 !important;
    }

    #mobileNav .wpm-brand div {
        display: flex !important;
        flex-direction: column !important;
    }

    #mobileNav .wpm-brand strong {
        color: #15323c !important;
        font-family: Georgia, "Times New Roman", serif !important;
        font-size: 1rem !important;
        font-weight: 700 !important;
        line-height: 1 !important;
    }

    #mobileNav .wpm-brand span {
        margin-top: 5px !important;
        color: #4f91a5 !important;
        font-family: Arial, sans-serif !important;
        font-size: .56rem !important;
        font-weight: 800 !important;
        letter-spacing: .18em !important;
    }

    #mobileNav .wpm-top-actions {
        display: flex !important;
        align-items: center !important;
        gap: 10px !important;
    }

    #mobileNav .wpm-top-whatsapp {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 46px !important;
        height: 46px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: #12915a !important;
        color: #fff !important;
    }

    #mobileNav .wpm-top-whatsapp svg {
        width: 22px !important;
        height: 22px !important;
    }

    #mobileNav .wpm-close {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 44px !important;
        height: 44px !important;

        padding: 0 !important;

        border: 0 !important;
        border-radius: 50% !important;

        background: #f1f4f4 !important;
        color: #17323c !important;

        font-size: 2rem !important;
        line-height: 1 !important;
    }

    #mobileNav .wpm-hero-card {
        position: relative !important;
        display: block !important;

        width: 100% !important;
        height: auto !important;
        aspect-ratio: 3 / 4 !important;

        margin: 0 0 18px !important;
        padding: 0 !important;

        overflow: hidden !important;

        border: 0 !important;
        border-radius: 20px !important;

        background-image: url('../images/mobile-menu-hero.jpg') !important;
        background-size: 100% auto !important;
        background-position: center top !important;
        background-repeat: no-repeat !important;
        background-color: #f5eee7 !important;

        box-shadow: 0 14px 35px rgba(0,0,0,.14) !important;
    }

    #mobileNav .wpm-hero-overlay,
    #mobileNav .wpm-hero-copy,
    #mobileNav .wpm-discover {
        display: none !important;
    }

    #mobileNav .wpm-main-links {
        display: block !important;
        width: 100% !important;
        margin: 0 0 24px !important;
    }

    #mobileNav .wpm-main-links a {
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) 24px !important;
        align-items: center !important;

        width: 100% !important;
        min-height: 57px !important;

        padding: 0 4px !important;

        border: 0 !important;
        border-bottom: 1px solid #e4eaec !important;

        background: transparent !important;
        text-decoration: none !important;
    }

    #mobileNav .wpm-link-icon {
        color: #db4a2c !important;
        font-size: 1.22rem !important;
        text-align: center !important;
    }

    #mobileNav .wpm-link-text {
        color: #16323c !important;
        font-family: Georgia, serif !important;
        font-size: 1.02rem !important;
        font-weight: 600 !important;
    }

    #mobileNav .wpm-main-links a.active .wpm-link-text {
        color: #db4a2c !important;
    }

    #mobileNav .wpm-chevron {
        color: #7d8a8e !important;
        font-size: 1.45rem !important;
        text-align: center !important;
    }

    #mobileNav .wpm-explore {
        margin-bottom: 24px !important;
    }

    #mobileNav .wpm-section-heading {
        display: grid !important;
        grid-template-columns: 1fr auto 1fr !important;
        align-items: center !important;
        gap: 10px !important;
        margin-bottom: 14px !important;
    }

    #mobileNav .wpm-section-heading span {
        height: 1px !important;
        background: #efc7bb !important;
    }

    #mobileNav .wpm-section-heading strong {
        color: #db4a2c !important;
        font-family: Arial, sans-serif !important;
        font-size: .66rem !important;
        font-weight: 800 !important;
        letter-spacing: .13em !important;
        white-space: nowrap !important;
    }

    #mobileNav .wpm-explore-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0,1fr)) !important;
        gap: 10px !important;
    }

    #mobileNav .wpm-explore-card {
        display: grid !important;
        grid-template-columns: 46px minmax(0,1fr) !important;
        align-items: center !important;
        gap: 10px !important;

        min-height: 90px !important;
        padding: 12px !important;

        border: 1px solid #e7edef !important;
        border-radius: 15px !important;

        background: #fff !important;
        color: #16323c !important;

        text-decoration: none !important;

        box-shadow: 0 8px 22px rgba(9,45,54,.06) !important;
    }

    #mobileNav .wpm-explore-icon {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 44px !important;
        height: 44px !important;

        border-radius: 50% !important;
        font-size: 1.2rem !important;
    }

    #mobileNav .wpm-explore-icon.coral {
        background: #fff0ea !important;
        color: #db4a2c !important;
    }

    #mobileNav .wpm-explore-icon.blue {
        background: #eaf5f8 !important;
        color: #176a7d !important;
    }

    #mobileNav .wpm-explore-icon.pink {
        background: #fff0f2 !important;
        color: #d76878 !important;
    }

    #mobileNav .wpm-explore-icon.green {
        background: #eaf6ef !important;
        color: #148154 !important;
    }

    #mobileNav .wpm-explore-card strong {
        display: block !important;
        color: #16323c !important;
        font-family: Arial, sans-serif !important;
        font-size: .73rem !important;
        font-weight: 800 !important;
    }

    #mobileNav .wpm-explore-card small {
        display: block !important;
        margin-top: 4px !important;
        color: #78868b !important;
        font-family: Arial, sans-serif !important;
        font-size: .57rem !important;
    }

    #mobileNav .wpm-language {
        display: grid !important;
        grid-template-columns: minmax(0,1fr) minmax(145px,1fr) !important;
        align-items: center !important;
        gap: 12px !important;

        margin-bottom: 18px !important;
        padding: 14px !important;

        border: 1px solid #e4eaec !important;
        border-radius: 14px !important;

        background: #fff !important;
    }

    #mobileNav .wpm-language-title {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

    #mobileNav .wpm-language select {
        display: block !important;
        width: 100% !important;
        height: 47px !important;

        padding: 0 12px !important;

        border: 1px solid #d8e1e4 !important;
        border-radius: 10px !important;

        background: #f8fafb !important;
        color: #16323c !important;
    }

    #mobileNav .wpm-mobile-cta {
        display: grid !important;
        gap: 10px !important;
        margin-bottom: 20px !important;
    }

    #mobileNav .wpm-plan-btn,
    #mobileNav .wpm-whatsapp-btn {
        display: grid !important;
        grid-template-columns: 44px minmax(0,1fr) 22px !important;
        align-items: center !important;
        gap: 10px !important;

        min-height: 72px !important;
        padding: 12px 16px !important;

        border: 0 !important;
        border-radius: 16px !important;

        color: #fff !important;
        text-decoration: none !important;
    }

    #mobileNav .wpm-plan-btn {
        background: linear-gradient(100deg,#e34b2d,#c93d25) !important;
    }

    #mobileNav .wpm-whatsapp-btn {
        background: linear-gradient(100deg,#13915a,#0f774b) !important;
    }

    #mobileNav .wpm-cta-copy strong {
        display: block !important;
        color: #fff !important;
        font-family: Georgia, serif !important;
        font-size: 1.05rem !important;
    }

    #mobileNav .wpm-cta-copy small {
        display: block !important;
        margin-top: 3px !important;
        color: rgba(255,255,255,.85) !important;
        font-size: .57rem !important;
    }

    #mobileNav .wpm-trust {
        display: grid !important;
        grid-template-columns: repeat(3,minmax(0,1fr)) !important;

        overflow: hidden !important;

        border: 1px solid #efd9d2 !important;
        border-radius: 14px !important;

        background: #fff3ed !important;
    }

    #mobileNav .wpm-trust > div {
        display: grid !important;
        grid-template-columns: 28px minmax(0,1fr) !important;
        align-items: center !important;
        gap: 6px !important;

        min-height: 64px !important;
        padding: 8px !important;

        border-right: 1px solid #ead4cd !important;
    }

    #mobileNav .wpm-trust > div:last-child {
        border-right: 0 !important;
    }
}

@media (max-width: 420px) {

    #mobileNav .wpm-shell {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    #mobileNav .wpm-language {
        grid-template-columns: 1fr !important;
    }

    #mobileNav .wpm-explore-grid {
        gap: 8px !important;
    }

    #mobileNav .wpm-hero-card {
        aspect-ratio: 3 / 4 !important;
        background-size: 100% auto !important;
        background-position: center top !important;
    }
}

/* =====================================================================
   MOBILE LUXURY EXPERIENCE — FINAL OVERRIDE
   Scope: phones only. Desktop/tablet layouts above 768px are untouched.
   ===================================================================== */
@media (max-width: 767px){
  :root{
    --m-pad:18px;
    --m-radius:22px;
    --m-radius-sm:16px;
    --m-shadow:0 18px 44px rgba(8,24,34,.12);
    --m-shadow-soft:0 10px 28px rgba(8,24,34,.08);
  }
  html{ scroll-behavior:smooth; overflow-x:hidden; }
  body{ overflow-x:hidden; -webkit-text-size-adjust:100%; text-rendering:optimizeLegibility; }
  img,svg,video,iframe{ max-width:100%; }
  .container{ width:100%; max-width:none; padding-inline:var(--m-pad); }
  .section{ padding:58px 0; }
  .section.alt{ background:linear-gradient(180deg,#f8f6f1 0%,#fff 100%); }
  .section.dark{ background:linear-gradient(155deg,#071f2b 0%,#0b3440 100%); }
  .section-head{ margin-bottom:26px; }
  .section-head h2,.section-top h2{ font-size:clamp(1.9rem,8.2vw,2.55rem); line-height:1.06; letter-spacing:-.025em; text-wrap:balance; }
  .section-head p{ font-size:.96rem; line-height:1.72; max-width:34ch; }
  .section-top{ display:block; margin-bottom:26px; }
  .section-top .section-link{ margin-top:16px; }
  .eyebrow{ font-size:.68rem; letter-spacing:.16em; }

  /* touch controls */
  .btn,.btn-primary,.btn-secondary,.btn-ghost,.section-link{ min-height:48px; border-radius:999px; }
  .btn{ padding:.9em 1.35em; font-size:.82rem; }
  input,select,textarea,button{ font-size:16px; }

  /* compact premium mobile header */
  .site-header{ padding:9px 0 !important; background:rgba(7,31,43,.88); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid rgba(255,255,255,.09); }
  .site-header.scrolled{ padding:7px 0 !important; background:rgba(255,255,255,.96); box-shadow:0 8px 30px rgba(8,24,34,.09); }
  .site-header .container{ min-height:58px; gap:8px; }
  .brand{ min-width:0; }
  .brand img,.site-header.scrolled .brand img{ height:52px !important; width:auto !important; max-width:148px; object-fit:contain; filter:none !important; }
  .brand-word{ display:none !important; }
  .header-actions{ margin-left:auto; gap:7px; }
  .wa-icon-btn,.nav-toggle{ width:42px !important; height:42px !important; border-radius:50%; }
  .nav-toggle{ border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.08); }
  .site-header.scrolled .nav-toggle{ border-color:rgba(8,24,34,.12); background:#f6f4ef; }

  /* homepage hero: cinematic, concise and readable */
  .hero{ min-height:100svh; max-height:900px; }
  .hero-scene{ background-position:center 32%; }
  .hero-vignette{ background:linear-gradient(180deg,rgba(3,18,25,.18) 0%,rgba(3,18,25,.30) 36%,rgba(3,18,25,.82) 100%); }
  .hero-inner{ min-height:100svh; padding:126px var(--m-pad) 112px; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-start; }
  .hero-eyebrow-row{ margin-bottom:14px; }
  .hero h1{ max-width:10ch; font-size:clamp(2.65rem,12vw,4rem); line-height:.94; letter-spacing:-.045em; text-shadow:0 3px 24px rgba(0,0,0,.26); text-wrap:balance; }
  .hero .lede{ max-width:32ch; margin-top:18px; font-size:.98rem; line-height:1.68; color:rgba(255,255,255,.9); }
  .hero-actions{ width:100%; margin-top:24px; display:grid; grid-template-columns:1fr; gap:10px; }
  .hero-actions .btn{ width:100%; justify-content:center; min-height:52px; }
  .hero-foot{ bottom:16px; }
  .hero-foot .container{ gap:7px; }
  .hero-tagline{ font-size:.72rem; }

  /* interior page hero */
  .page-header{ min-height:56svh; padding:132px 0 46px !important; display:flex; align-items:flex-end; }
  .page-header::after{ background:linear-gradient(180deg,rgba(4,20,28,.18),rgba(4,20,28,.78)); }
  .page-header h1{ font-size:clamp(2.35rem,11vw,3.5rem); line-height:.96; letter-spacing:-.04em; text-wrap:balance; }
  .page-header .lede{ margin-top:15px; font-size:.95rem; line-height:1.65; max-width:33ch; color:rgba(255,255,255,.9); }

  /* cards — one strong visual per swipe/scroll */
  .tour-grid,.dest-grid,.explore-grid,.tours-grid,.exp-feature-grid{ grid-template-columns:1fr !important; gap:16px !important; }
  .tour-card,.review-card,.dest-card,.gallery-tile{ border-radius:var(--m-radius) !important; box-shadow:var(--m-shadow-soft); overflow:hidden; }
  .tour-card:hover,.review-card:hover,.dest-card:hover{ transform:none; }
  .tour-card .scene{ height:230px; }
  .tour-card .card-body{ padding:21px 20px 23px; }
  .tour-card h3{ font-size:1.35rem; line-height:1.18; }
  .tour-card p{ font-size:.91rem; line-height:1.62; }
  .dest-grid .dest-card,.dest-grid .dest-card:nth-child(n),.explore-grid .dest-card,.explore-grid .dest-card.featured,.dest-card.tour-pkg,.exp-feature-grid .dest-card{ grid-column:1 !important; min-height:430px !important; }
  .dest-card .card-body{ padding:24px 20px; }
  .dest-card h3{ font-size:1.65rem; line-height:1.05; }

  /* about/fleet — photo first, then clean copy */
  .about-grid,.fleet-grid,.intro-grid,.honeymoon{ grid-template-columns:1fr !important; gap:30px !important; }
  .about-art,.fleet-art{ order:-1; }
  .about-art .scene,.fleet-art{ min-height:330px !important; border-radius:var(--m-radius); }
  .about-copy h2,.fleet-copy h2{ font-size:2.05rem; line-height:1.08; }
  .about-copy p,.fleet-copy p{ font-size:.95rem; line-height:1.72; }
  .about-badge{ margin:-54px 16px 0 !important; position:relative !important; z-index:2; border-radius:18px; box-shadow:var(--m-shadow); }
  .fleet-points{ gap:13px; }
  .fleet-points li{ font-size:.9rem; }

  /* galleries: editorial mobile rhythm */
  .gallery-grid{ display:grid; grid-template-columns:1fr 1fr !important; grid-auto-rows:150px; gap:8px; }
  .gallery-grid .scene{ border-radius:14px; }
  .gallery-grid .g1,.gallery-grid .g6{ grid-column:span 2 !important; grid-row:span 2 !important; }
  .gallery-grid .g2,.gallery-grid .g5{ grid-column:span 2 !important; }
  .gallery-grid .g3,.gallery-grid .g4,.gallery-grid .g7,.gallery-grid .g8{ grid-column:span 1 !important; }
  .gallery-feature{ min-height:480px; border-radius:var(--m-radius); }
  .gallery-feature .feature-body{ padding:28px 20px; }

  /* reviews / trust / process */
  .trust-strip,.process-grid,.why-grid,.trust-source-grid{ grid-template-columns:1fr !important; }
  .trust-item{ border-left:0 !important; border-top:1px solid var(--sand-line); padding:22px 18px; }
  .trust-item:first-child{ border-top:0; }
  .review-card{ padding:24px 20px; }
  .review-card blockquote{ font-size:1rem; line-height:1.7; }

  /* forms */
  .form-row,.form-row.two{ grid-template-columns:1fr !important; gap:14px; }
  input:not([type="checkbox"]):not([type="radio"]),select,textarea{ width:100%; min-height:50px; border-radius:14px !important; padding:13px 14px !important; }
  textarea{ min-height:130px; }
  .plan-contact-row{ align-items:stretch !important; text-align:left !important; gap:12px; }
  .plan-contact-item{ text-align:left !important; width:100%; }

  /* footer: compact and premium instead of an endless column */
  .site-footer{ padding-top:52px; }
  .footer-grid{ grid-template-columns:1fr !important; gap:0 !important; }
  .footer-brand{ padding-bottom:28px; }
  .footer-brand img{ height:72px; margin-bottom:14px; }
  .footer-col{ padding:20px 0; border-top:1px solid rgba(255,255,255,.11); }
  .footer-col h4{ margin-bottom:12px; }
  .footer-col ul{ gap:9px; }
  .footer-bottom{ margin-top:26px; padding:22px 0 28px; flex-direction:column; align-items:flex-start; gap:13px; font-size:.76rem; }
  .footer-bottom .legal-links{ flex-wrap:wrap; gap:10px 16px; }

  /* no accidental horizontal page growth */
  .section,.site-footer,.page-header,.hero,main{ max-width:100vw; overflow-x:clip; }
}

@media (max-width: 390px){
  .container{ padding-inline:15px; }
  .hero-inner{ padding-left:15px; padding-right:15px; }
  .hero h1{ font-size:2.55rem; }
  .page-header h1{ font-size:2.35rem; }
  .brand img,.site-header.scrolled .brand img{ max-width:132px; height:48px !important; }
}