:root{
  --paper:#FFFFFF;
  --paper-dim:#F2F2F2;
  --ink:#160C2C;
  --ink-soft:#655D74;
  --navy:#1B0E33;
  --navy-2:#120823;
  --violet:#6D28D9;
  --violet-light:#9D6FFF;
  --orange:#F5A623;
  --line:rgba(22,12,44,.13);
  --line-on-dark:rgba(255,255,255,.18);
  --nav-fg:#FFFFFF;
  --nav-bg:transparent;
  --nav-border:transparent;

  --font:'Kumbh Sans','Helvetica Neue',Arial,sans-serif;

  --s-1:.5rem; --s-2:.875rem; --s-3:1.5rem; --s-4:2.25rem;
  --s-5:3.5rem; --s-6:5rem; --s-7:7rem;

  --ease:cubic-bezier(.16,1,.3,1);
  color-scheme: light;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
#top, #destinations, #process, #reviews, #faq{ scroll-margin-top:90px; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0; background:var(--paper); color:var(--ink); font-family:var(--font);
  font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
button{ font-family:inherit; }
h1,h2,h3,p{ margin:0; }
img,svg{ display:block; max-width:100%; }
section{ position:relative; }
::selection{ background:var(--orange); color:var(--navy); }

.wrap{ max-width:1240px; margin:0 auto; padding-left:clamp(1.25rem,4vw,3.5rem); padding-right:clamp(1.25rem,4vw,3.5rem); }

h1,h2,h3{ text-wrap:balance; font-weight:700; letter-spacing:-.01em; }

.eyebrow{ font-size:.75rem; letter-spacing:.15em; text-transform:uppercase; font-weight:700; color:var(--violet); display:block; margin-bottom:.9rem; }
.eyebrow.on-dark{ color:var(--violet-light); }

.btn{
  font-family:var(--font); font-weight:700; font-size:.92rem; cursor:pointer;
  display:inline-flex; align-items:center; gap:.5em; border:none; white-space:nowrap;
  padding:.85rem 1.6rem; border-radius:100px; transition:transform .35s var(--ease), background .25s, color .25s, border-color .25s;
}
.btn:hover{ transform:translateY(-2px); }
.btn-primary{ background:var(--orange); color:var(--navy); }
.btn-primary:hover{ background:var(--ink); color:var(--paper); }
.btn-ghost{ background:transparent; color:var(--ink); border:1.5px solid var(--ink); }
.btn-ghost:hover{ background:var(--ink); color:var(--paper); }
.btn-ghost.on-dark{ color:var(--paper); border-color:var(--line-on-dark); }
.btn-ghost.on-dark:hover{ background:var(--paper); color:var(--navy); }

/* ================= SCENIC BACKGROUNDS (shared, for destination cards) ================= */
.scene-beach{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23FBEBD0'/%3E%3Cstop offset='.55' stop-color='%23F6A65B'/%3E%3Cstop offset='1' stop-color='%23E8635B'/%3E%3C/linearGradient%3E%3ClinearGradient id='b' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%232FA8A0'/%3E%3Cstop offset='1' stop-color='%23125E59'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='400' height='300' fill='url(%23a)'/%3E%3Ccircle cx='300' cy='110' r='40' fill='%23FFF3D6' opacity='.85'/%3E%3Cpath d='M0 175 Q80 155 160 172 T400 165 V300 H0 Z' fill='%23C97B63' opacity='.55'/%3E%3Crect y='188' width='400' height='112' fill='url(%23b)'/%3E%3Cg stroke='%230E2E2B' stroke-width='6' stroke-linecap='round' fill='none'%3E%3Cpath d='M64 300 C60 255 64 222 72 192'/%3E%3Cpath d='M72 192 C54 182 34 185 16 175'/%3E%3Cpath d='M72 192 C52 172 38 150 24 136'/%3E%3Cpath d='M72 192 C74 164 84 140 90 118'/%3E%3Cpath d='M72 192 C92 178 110 178 126 168'/%3E%3C/g%3E%3C/svg%3E"); }
.scene-desert{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23FBD9A6'/%3E%3Cstop offset='.5' stop-color='%23F2854B'/%3E%3Cstop offset='1' stop-color='%237A3B8C'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='400' height='300' fill='url(%23a)'/%3E%3Ccircle cx='300' cy='150' r='46' fill='%23FFE7B8' opacity='.8'/%3E%3Cpath d='M0 210 Q100 175 200 205 T400 195 V300 H0 Z' fill='%23D9A868'/%3E%3Cpath d='M0 240 Q120 205 220 235 T400 225 V300 H0 Z' fill='%23B97A3E'/%3E%3Cpath d='M0 270 Q140 240 260 265 T400 258 V300 H0 Z' fill='%238A5223'/%3E%3C/svg%3E"); }
.scene-mountain{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23CDEBFF'/%3E%3Cstop offset='1' stop-color='%234C6FA5'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='400' height='300' fill='url(%23a)'/%3E%3Cpath d='M0 200 L60 130 L110 175 L170 100 L230 170 L280 140 L340 190 L400 150 V300 H0 Z' fill='%239FB6D6'/%3E%3Cpath d='M60 130 L70 145 L50 145 Z' fill='%23fff'/%3E%3Cpath d='M170 100 L182 118 L158 118 Z' fill='%23fff'/%3E%3Cpath d='M0 230 L90 165 L150 210 L220 155 L300 220 L400 190 V300 H0 Z' fill='%235C7A9E'/%3E%3Cpath d='M90 165 L100 180 L80 180 Z' fill='%23fff'/%3E%3Cpath d='M220 155 L231 172 L209 172 Z' fill='%23fff'/%3E%3C/svg%3E"); }
.scene-city{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23FCE3C8'/%3E%3Cstop offset='.55' stop-color='%23F3A96A'/%3E%3Cstop offset='1' stop-color='%23C97BA0'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='400' height='300' fill='url(%23a)'/%3E%3Cg fill='%232A1B3D'%3E%3Crect x='10' y='190' width='34' height='110'/%3E%3Crect x='50' y='160' width='30' height='140'/%3E%3Crect x='86' y='205' width='28' height='95'/%3E%3Crect x='120' y='140' width='22' height='160'/%3E%3Cpolygon points='131,110 142,140 120,140'/%3E%3Crect x='150' y='185' width='32' height='115'/%3E%3Crect x='190' y='150' width='26' height='150'/%3E%3Crect x='222' y='200' width='30' height='100'/%3E%3Crect x='258' y='170' width='24' height='130'/%3E%3Crect x='288' y='195' width='34' height='105'/%3E%3Crect x='328' y='155' width='24' height='145'/%3E%3Crect x='358' y='210' width='30' height='90'/%3E%3C/g%3E%3Cg fill='%23F5A623' opacity='.75'%3E%3Crect x='18' y='205' width='6' height='6'/%3E%3Crect x='58' y='180' width='6' height='6'/%3E%3Crect x='94' y='220' width='6' height='6'/%3E%3Crect x='160' y='205' width='6' height='6'/%3E%3Crect x='198' y='170' width='6' height='6'/%3E%3Crect x='296' y='215' width='6' height='6'/%3E%3Crect x='336' y='175' width='6' height='6'/%3E%3C/g%3E%3Cpath d='M60 60 L70 55 L80 60' stroke='%232A1B3D' stroke-width='2' fill='none' opacity='.5'/%3E%3Cpath d='M110 80 L120 75 L130 80' stroke='%232A1B3D' stroke-width='2' fill='none' opacity='.5'/%3E%3C/svg%3E"); }
.scene-savanna{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23FCE9B8'/%3E%3Cstop offset='1' stop-color='%23D97748'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='400' height='300' fill='url(%23a)'/%3E%3Ccircle cx='290' cy='140' r='54' fill='%23FFEFC2' opacity='.8'/%3E%3Cpath d='M0 215 Q140 190 260 218 T400 205 V300 H0 Z' fill='%237A4A2A'/%3E%3Cline x1='110' y1='230' x2='110' y2='170' stroke='%233D2814' stroke-width='6'/%3E%3Cellipse cx='110' cy='150' rx='46' ry='16' fill='%233D2814'/%3E%3Cline x1='300' y1='245' x2='300' y2='205' stroke='%233D2814' stroke-width='5'/%3E%3Cellipse cx='300' cy='190' rx='32' ry='11' fill='%233D2814'/%3E%3C/svg%3E"); }

/* ================= REAL DESTINATION PHOTOS (hero slider + gallery thumbnails only) ================= */
.photo-hero-thailand{ background-image:url("assets/hero-thailand.jpg"); }
.photo-hero-uae{ background-image:url("assets/hero-uae.jpg"); }
.photo-hero-japan{ background-image:url("assets/hero-japan.jpg"); }
.photo-hero-france{ background-image:url("assets/hero-france.jpg"); }
.photo-hero-egypt{ background-image:url("assets/hero-egypt.jpg"); }
.photo-thumb-thailand{ background-image:url("assets/thumb-thailand.jpg"); }
.photo-thumb-uae{ background-image:url("assets/thumb-uae.jpg"); }
.photo-thumb-japan{ background-image:url("assets/thumb-japan.jpg"); }
.photo-thumb-france{ background-image:url("assets/thumb-france.jpg"); }
.photo-thumb-egypt{ background-image:url("assets/thumb-egypt.jpg"); }

/* real photos for destination grid cards (saturation/brightness enhanced) */
.photo-dest-indonesia{ background-image:url("assets/dest-indonesia.jpg"); }
.photo-dest-malaysia{ background-image:url("assets/dest-malaysia.jpg"); }
.photo-dest-srilanka{ background-image:url("assets/dest-srilanka.jpg"); }
.photo-dest-thailand{ background-image:url("assets/dest-thailand.jpg"); }
.photo-dest-vietnam{ background-image:url("assets/dest-vietnam.jpg"); }
.photo-dest-cambodia{ background-image:url('assets/dest-cambodia.jpg'); }
.photo-dest-japan{ background-image:url('assets/dest-japan.jpg'); }
.photo-dest-philippines{ background-image:url('assets/dest-philippines.jpg'); }
.photo-dest-singapore{ background-image:url('assets/dest-singapore.jpg'); }
.photo-dest-southkorea{ background-image:url('assets/dest-southkorea.jpg'); }

/* ================= NAV ================= */
.nav{ position:fixed; top:0; left:0; right:0; z-index:500; background:var(--nav-bg); border-bottom:1px solid var(--nav-border); transition:background .35s var(--ease), border-color .35s var(--ease); }
/* fully opaque once scrolled — a translucent bar let a faint blurred sliver of whatever
   was scrolling underneath show through at the top edge */
.nav.scrolled{ --nav-bg:var(--paper); --nav-border:var(--line); --nav-fg:var(--ink); }
.nav-inner{ max-width:1240px; margin:0 auto; padding:1rem clamp(1.25rem,4vw,3.5rem); display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
/* Two supplied logo lockups, swapped with the nav: white over the hero photo, purple/ink once the bar turns light */
.brand{ display:flex; align-items:center; position:relative; }
.brand-logo-img{ height:34px; width:auto; flex:none; display:block; transition:opacity .35s var(--ease); }
.brand-logo-onwhite{ position:absolute; left:0; top:0; opacity:0; }
.nav.scrolled .brand-logo-ondark{ opacity:0; }
.nav.scrolled .brand-logo-onwhite{ opacity:1; }

.nav-links{ display:flex; gap:2.2rem; }
.nav-links a{ font-size:.92rem; font-weight:600; position:relative; padding:.2rem 0; color:var(--nav-fg); transition:color .35s var(--ease); }
.nav-links a::after{ content:''; position:absolute; left:0; right:100%; bottom:-2px; height:2px; background:var(--orange); transition:right .3s var(--ease); }
.nav-links a:hover::after{ right:0; }

.nav-actions{ display:flex; align-items:center; gap:.9rem; }
.nav .btn-ghost{ color:var(--nav-fg); border-color:var(--nav-fg); }
.nav .btn-ghost:hover{ background:var(--nav-fg); color:var(--navy); }
.nav.scrolled .btn-ghost:hover{ background:var(--ink); color:var(--paper); }

.menu-toggle{ display:none; width:42px; height:42px; border-radius:50%; border:1.5px solid var(--nav-fg); background:transparent; flex-direction:column; align-items:center; justify-content:center; gap:5px; flex:none; }
.menu-toggle span{ width:16px; height:2px; background:var(--nav-fg); transition:transform .3s var(--ease), opacity .3s; }
.menu-toggle[aria-expanded="true"] span:first-child{ transform:translateY(3.5px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child{ transform:translateY(-3.5px) rotate(-45deg); }

.mobile-panel{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s var(--ease); background:var(--paper); border-bottom:1px solid var(--line); }
.mobile-panel.open{ grid-template-rows:1fr; }
.mobile-panel-inner{ overflow:hidden; }
.mobile-panel ul{ display:flex; flex-direction:column; padding:.5rem clamp(1.25rem,4vw,3.5rem) 1.5rem; gap:1rem; }
.mobile-panel a{ font-size:1.1rem; font-weight:700; color:var(--ink); }

/* ================= HERO SLIDER ================= */
.hero{ position:relative; min-height:92vh; display:flex; flex-direction:column; justify-content:flex-end; overflow:hidden; color:#fff; }
/* Track is taller than the hero so the parallax pans across the photo instead of zooming into it:
   same pixel scale as a flush track, just more image to travel through. It hangs from the hero's
   BOTTOM edge, so what stays on screen at rest is the bottom of the frame (beach, water,
   foreground) and the overflow is trimmed off the top (sky). */
.hero-track{ position:absolute; left:0; right:0; bottom:0; height:130%; z-index:0; will-change:transform; }
/* anchored to the bottom of the photo: the beach, water and foreground subjects live down there,
   so any overflow is trimmed off the top (sky) rather than cutting the scene away */
.hero-slide{ position:absolute; inset:0; background-size:cover; background-position:center bottom; opacity:0; transition:opacity 1.4s var(--ease); }
.hero-slide.active{ opacity:1; }
/* Localized darkening for text legibility up top, then — no blur, no hazy tint — a confident,
   graphic fade to rich near-black ink at the very bottom so the wave (cut in the paper colour)
   lands on a deliberate dark base rather than blending softly into raw photo. */
.hero-scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(0deg, rgba(5,2,12,.98) 0%, rgba(5,2,12,.92) 10%, rgba(6,2,14,.62) 20%, rgba(8,3,18,.5) 30%, rgba(8,3,18,.3) 40%, rgba(8,3,18,0) 54%, rgba(8,3,18,0) 84%, rgba(8,3,18,.3) 100%); }
.hero-scrim::after{ content:''; position:absolute; inset:0; background:linear-gradient(90deg, rgba(8,3,18,.4) 0%, rgba(8,3,18,.16) 30%, rgba(8,3,18,0) 50%); }

.hero-rail{ position:absolute; left:clamp(.75rem,1.5vw,1.25rem); top:50%; transform:translateY(-50%); z-index:3; display:flex; flex-direction:column; align-items:center; gap:.5rem; }
.rail-dot{ width:30px; height:30px; border-radius:50%; border:1.5px solid rgba(255,255,255,.55); background:rgba(10,4,20,.4); color:rgba(255,255,255,.85); font-size:.62rem; font-weight:700; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .3s var(--ease); flex:none; }
.rail-dot.active{ background:var(--orange); border-color:var(--orange); color:var(--navy); transform:scale(1.15); }
.rail-line{ width:1.5px; height:34px; background:rgba(255,255,255,.35); }

/* sits clear of the dissolve band so the controls never land on the lightening edge */
.hero-content{ position:relative; z-index:3; padding:0 clamp(1.25rem,4vw,3.5rem) clamp(3.5rem,9vh,6.5rem); max-width:1240px; margin:0 auto; width:100%; }
.hero-slide-title{ font-size:clamp(2.6rem,8vw,6.4rem); line-height:.96; letter-spacing:-.02em; text-transform:uppercase; text-shadow:0 4px 24px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.6); }
.hero-slide-desc{ font-size:clamp(1rem,1.5vw,1.2rem); max-width:46ch; margin-top:1rem; line-height:1.55; color:rgba(255,255,255,.92); text-shadow:0 2px 12px rgba(0,0,0,.55), 0 1px 2px rgba(0,0,0,.5); }
.hero-actions{ display:flex; align-items:center; gap:1.4rem; margin-top:1.7rem; flex-wrap:wrap; }
.hero-note{ font-size:.85rem; color:rgba(255,255,255,.85); text-shadow:0 1px 6px rgba(0,0,0,.55); }

.hero-gallery{ position:absolute; right:clamp(1rem,3vw,3rem); bottom:clamp(7.5rem,14vw,10rem); z-index:3; display:flex; gap:.9rem; }
.gallery-card{ width:104px; border:none; background:none; cursor:pointer; padding:0; text-align:left; color:#fff; }
.scene-thumb{ display:block; width:104px; height:130px; border-radius:14px; background-size:cover; background-position:center; border:2px solid rgba(255,255,255,.5); transition:transform .3s var(--ease), border-color .3s; box-shadow:0 12px 30px rgba(18,8,35,.35); position:relative; }
.scene-thumb::after{ content:''; position:absolute; inset:0; border-radius:12px; background:linear-gradient(180deg, rgba(10,4,20,0) 55%, rgba(10,4,20,.65) 100%); }
.gallery-card:hover .scene-thumb{ transform:translateY(-6px); border-color:var(--orange); }
.gallery-label{ display:block; font-size:.72rem; font-weight:700; margin-top:.55rem; line-height:1.25; text-shadow:0 1px 6px rgba(0,0,0,.55); }

.hero-controls{ display:flex; align-items:center; gap:1rem; margin-top:2.4rem; }
.hero-arrow{ width:42px; height:42px; border-radius:50%; border:1.5px solid rgba(255,255,255,.55); background:rgba(10,4,20,.4); color:#fff; font-size:1.2rem; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .25s var(--ease); flex:none; }
.hero-arrow:hover{ background:var(--orange); border-color:var(--orange); color:var(--navy); }
.hero-progress{ display:flex; align-items:center; gap:.6rem; font-size:.78rem; font-weight:700; letter-spacing:.05em; color:rgba(255,255,255,.9); text-shadow:0 1px 6px rgba(0,0,0,.55); }
.hero-progress i{ display:block; width:38px; height:1px; background:rgba(255,255,255,.4); font-style:normal; }

/* taller and more graphic now that it cuts against solid ink rather than raw photo — reads as a
   deliberate curve, not a crop line */
.hero-wave{ position:absolute; left:0; right:0; bottom:-1px; width:100%; height:clamp(46px,5vw,86px); z-index:2; }
.hero-wave path{ fill:var(--paper); }

/* ============ KINETIC SENTENCE (words rise, video pills wipe open, in reading order) ============ */
.chip-line{ padding:clamp(5rem,16vh,9.5rem) 0 clamp(5.5rem,17vh,10.5rem); }
.chip-sentence{ font-size:clamp(2rem,6vw,4.6rem); font-weight:700; line-height:1.22; max-width:26ch; letter-spacing:-.03em; text-wrap:balance; }
.k-word{ display:inline-block; overflow:hidden; padding-bottom:.16em; margin-bottom:-.16em; }
.k-word-in{ display:inline-block; will-change:transform; }
.chip{ display:inline-block; width:2.6em; height:1em; border-radius:100px; background-size:cover; background-position:center; object-fit:cover; vertical-align:middle; margin:0 .16em; transform-origin:left center; box-shadow:0 12px 34px rgba(22,12,44,.22); }

/* ================= DESTINATIONS ================= */
.destinations{ padding:var(--s-6) 0 var(--s-7); }
.dest-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:1.5rem; flex-wrap:wrap; }
.dest-head h2{ font-size:clamp(2rem,4.4vw,3.1rem); max-width:16ch; }
.dest-count{ font-size:.9rem; color:var(--ink-soft); font-weight:600; }
.dest-count b{ color:var(--ink); font-variant-numeric:tabular-nums; }

.search-bar{ display:flex; align-items:center; gap:.7rem; margin-top:var(--s-4); background:var(--paper-dim); border:1.5px solid transparent; border-radius:100px; padding:.35rem .35rem .35rem 1.3rem; transition:border-color .25s; }
.search-bar:focus-within{ border-color:var(--violet); background:var(--paper); }
.search-bar svg{ width:19px; height:19px; color:var(--ink-soft); flex:none; }
.search-bar input{ flex:1; border:none; background:none; font-family:var(--font); font-weight:500; font-size:1rem; padding:.75rem 0; color:var(--ink); min-width:0; }
.search-bar input:focus{ outline:none; }
.search-bar input::placeholder{ color:var(--ink-soft); }
.search-clear{ background:var(--ink); color:var(--paper); border:none; width:30px; height:30px; border-radius:50%; flex:none; display:none; align-items:center; justify-content:center; cursor:pointer; font-size:.9rem; }
.search-clear.show{ display:flex; }

.region-pills{ display:flex; gap:.6rem; margin-top:1.1rem; flex-wrap:wrap; }
.pill{ font-size:.82rem; font-weight:700; padding:.55rem 1.1rem; border-radius:100px; border:1.5px solid var(--line); background:transparent; color:var(--ink-soft); cursor:pointer; transition:all .2s var(--ease); white-space:nowrap; }
.pill:hover{ border-color:var(--ink); color:var(--ink); }
.pill.active{ background:var(--ink); border-color:var(--ink); color:var(--paper); }

.dest-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:1rem; margin-top:var(--s-4); }
.dest-card{
  position:relative; overflow:hidden; background-size:cover; background-position:center;
  border:none; border-radius:18px; padding:0; cursor:pointer;
  display:block; aspect-ratio:1/1.22;
  transition:transform .3s var(--ease);
}
.dest-card:hover{ transform:translateY(-5px); }
.dest-card.hidden{ display:none; }
.dest-card:focus-visible{ outline:2px solid var(--orange); outline-offset:2px; }
/* deep, deliberate fade so the name reads cleanly over any photo even before hover */
.dest-scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(8,3,16,.10) 0%, rgba(8,3,16,.04) 22%, rgba(8,3,16,.28) 48%, rgba(8,3,16,.62) 66%, rgba(8,3,16,.88) 84%, rgba(6,2,12,.97) 100%); }
/* flag: pinned top-left, exactly 20px in */
.dest-badge{ position:absolute; top:20px; left:20px; z-index:3; width:36px; height:36px; border-radius:50%; overflow:hidden; background:rgba(10,4,20,.45); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; font-size:1.1rem; line-height:1; box-shadow:0 4px 14px rgba(0,0,0,.3); border:1.5px solid rgba(255,255,255,.55); }
/* visa type tag: value only, no label */
.dest-tag{ position:absolute; top:20px; right:20px; z-index:3; font-size:.6rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#fff; background:rgba(10,4,20,.42); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); border:1px solid rgba(255,255,255,.34); padding:.42em .7em; border-radius:100px; white-space:nowrap; }
/* name pinned to the very bottom of the card */
.dest-bottom{ position:absolute; left:20px; right:20px; bottom:20px; z-index:3; }
.dest-name{ font-family:'Fraunces','Kumbh Sans',var(--font); font-size:1.28rem; font-weight:600; line-height:1.14; letter-spacing:-.01em; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.6), 0 4px 18px rgba(0,0,0,.55); }
/* hover overlay: CTA sits in the middle of the card */
.dest-hover{ position:absolute; inset:0; z-index:4; display:flex; align-items:center; justify-content:center; background:rgba(8,3,16,.58); backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); opacity:0; transition:opacity .28s var(--ease); }
.dest-cta{ display:inline-flex; align-items:center; gap:.4rem; background:var(--orange); color:var(--navy); font-size:.78rem; font-weight:800; letter-spacing:-.01em; padding:.72em 1.15em; border-radius:100px; white-space:nowrap; transform:translateY(8px) scale(.96); transition:transform .28s var(--ease); box-shadow:0 8px 24px rgba(0,0,0,.3); }
.dest-cta svg{ width:13px; height:13px; flex:none; }
.dest-card:hover .dest-hover, .dest-card:focus-visible .dest-hover, .dest-card:focus-within .dest-hover{ opacity:1; }
.dest-card:hover .dest-cta, .dest-card:focus-visible .dest-cta, .dest-card:focus-within .dest-cta{ transform:translateY(0) scale(1); }

.dest-empty{ display:none; padding:var(--s-5) 0; text-align:center; color:var(--ink-soft); font-size:1rem; }
.dest-empty.show{ display:block; }

/* ================= ABOUT / STATS ================= */
.stats{ background:var(--navy); color:var(--paper); padding:var(--s-7) 0; overflow:hidden; }
.stats-inner{ display:grid; grid-template-columns:1fr 1fr; gap:var(--s-5); align-items:end; }
.stats-head h2{ color:var(--paper); font-size:clamp(2rem,4.4vw,3.1rem); max-width:14ch; }
.stats-head p{ color:rgba(255,255,255,.68); margin-top:1.2rem; max-width:38ch; font-size:1rem; line-height:1.6; }
.stats-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.8rem 2rem; }
.stat{ border-top:1px solid var(--line-on-dark); padding-top:1rem; }
.stat b{ display:block; font-size:clamp(2rem,4.6vw,3rem); font-weight:800; font-variant-numeric:tabular-nums; color:var(--orange); }
.stat span{ font-size:.85rem; color:rgba(255,255,255,.68); }

/* ================= PROCESS ================= */
.process{ padding:var(--s-7) 0; position:relative; overflow:hidden; }
.process-bg{ position:absolute; top:0; right:0; bottom:0; width:min(50vw,680px); z-index:0; pointer-events:none; background-image:url("assets/process-bg.jpg"); background-size:cover; background-position:center; opacity:.22; -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 38%, #000 100%); mask-image:linear-gradient(90deg, transparent 0%, #000 38%, #000 100%); }
.process .wrap{ position:relative; z-index:1; }
.process-head{ max-width:36ch; }
.process-head h2{ font-size:clamp(2rem,4.4vw,3.1rem); margin-top:.6rem; }
.process-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; margin-top:var(--s-5); border-top:1px solid var(--line); }
.p-step{ padding-top:1.6rem; }
.p-num{ font-size:.85rem; font-weight:800; color:var(--orange); }
.p-step h3{ font-size:1.2rem; margin-top:.9rem; }
.p-step p{ font-size:.9rem; color:var(--ink-soft); margin-top:.6rem; line-height:1.55; }

/* ================= REVIEWS ================= */
.reviews{ padding:var(--s-7) 0; }
.reviews-head{ display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:1rem; }
.reviews-head h2{ font-size:clamp(2rem,4.4vw,3.1rem); max-width:16ch; }
.review-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:var(--s-4); }
.review-card{ border-top:1px solid var(--line); padding-top:1.4rem; }
.review-stars{ color:var(--orange); font-size:.9rem; letter-spacing:.1em; }
.review-quote{ font-size:1.05rem; line-height:1.5; margin-top:.9rem; font-weight:500; }
.review-foot{ margin-top:1.3rem; font-size:.85rem; color:var(--ink-soft); }
.review-foot b{ color:var(--ink); display:block; font-size:.9rem; }

/* ================= FAQ ================= */
.faq{ padding:var(--s-7) 0; }
.faq-inner{ display:grid; grid-template-columns:.8fr 1.2fr; gap:var(--s-5); }
.faq-head h2{ font-size:clamp(2rem,4.4vw,3.1rem); max-width:14ch; }
.faq-head p{ color:var(--ink-soft); margin-top:1.2rem; max-width:32ch; font-size:.95rem; line-height:1.6; }
.faq-list{ border-top:1px solid var(--line); }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-q{ width:100%; background:none; border:none; text-align:left; padding:1.4rem 0; display:flex; align-items:center; justify-content:space-between; gap:1rem; cursor:pointer; color:var(--ink); }
.faq-q-text{ font-size:clamp(1.02rem,1.8vw,1.2rem); font-weight:700; }
.faq-icon{ width:22px; height:22px; flex:none; position:relative; }
.faq-icon::before, .faq-icon::after{ content:''; position:absolute; background:var(--ink); top:50%; left:50%; transform:translate(-50%,-50%); transition:transform .3s var(--ease); }
.faq-icon::before{ width:13px; height:2px; }
.faq-icon::after{ width:2px; height:13px; }
.faq-item.open .faq-icon::after{ transform:translate(-50%,-50%) rotate(90deg) scale(0); }
.faq-a-wrap{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s var(--ease); }
.faq-item.open .faq-a-wrap{ grid-template-rows:1fr; }
.faq-a-inner{ overflow:hidden; }
.faq-a{ padding:0 0 1.5rem; color:var(--ink-soft); font-size:.95rem; line-height:1.65; max-width:56ch; }

/* ================= FOOTER / CTA ================= */
.cta{ background:var(--navy); color:var(--paper); padding:var(--s-7) 0 var(--s-4); position:relative; overflow:hidden; }
.cta-bg{ position:absolute; inset:0; z-index:0; pointer-events:none; background-image:url("assets/cta-bg.jpg"); background-size:cover; background-position:50% 22%; opacity:.16; filter:grayscale(.4) brightness(.75); -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 30%, #000 72%, transparent 100%); mask-image:linear-gradient(180deg, transparent 0%, #000 30%, #000 72%, transparent 100%); }
.cta .wrap{ position:relative; z-index:1; }
.cta h2{ color:var(--paper); font-size:clamp(2.4rem,6vw,4.6rem); max-width:16ch; }
.cta h2 em{ font-style:italic; color:var(--orange); }
.cta-row{ display:flex; align-items:center; gap:1.6rem; margin-top:var(--s-4); flex-wrap:wrap; }

.foot-grid{ margin-top:var(--s-7); display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:2.5rem; border-top:1px solid var(--line-on-dark); padding-top:var(--s-4); }
.foot-brand{ display:flex; align-items:center; gap:.65rem; }
.foot-logo-img{ height:32px; width:auto; display:block; }
.foot-tag{ color:rgba(255,255,255,.68); font-size:.85rem; margin-top:1rem; max-width:26ch; line-height:1.5; }
.foot-col h4{ font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--orange); margin-bottom:1rem; font-weight:800; }
.foot-col ul{ display:flex; flex-direction:column; gap:.65rem; }
.foot-col a{ font-size:.9rem; color:rgba(255,255,255,.78); }
.foot-col a:hover{ color:var(--paper); }
.foot-bottom{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; margin-top:var(--s-5); font-size:.78rem; color:rgba(255,255,255,.5); }

@media (max-width:900px){
  .nav-links{ display:none; }
  .menu-toggle{ display:flex; }
  .hero-gallery{ display:none; }
  .hero-content{ padding-left:clamp(1.25rem,4vw,3.5rem); }
  .hero-rail{ display:none; }
  .stats-inner{ grid-template-columns:1fr; gap:var(--s-4); }
  .process-row{ grid-template-columns:1fr 1fr; }
  .review-grid{ grid-template-columns:1fr; }
  .faq-inner{ grid-template-columns:1fr; }
  .foot-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .hero{ min-height:82vh; }
  .dest-grid{ grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); }
  .process-row{ grid-template-columns:1fr; }
  .foot-grid{ grid-template-columns:1fr 1fr; }
}