/* ==========================================================================
   V GO CEYLON — Core stylesheet
   Palette: deep teal + ceylon gold + warm cream (tropical-luxury)
   No frameworks. Mobile-first.
   ========================================================================== */

/* ---------- 1. Tokens ---------------------------------------------------- */
:root{
  /* Brand */
  --teal-900:#04262B;
  --teal-800:#073B42;
  --teal-700:#0A5058;
  --teal-600:#0E6A72;
  --teal-500:#12868C;
  --teal-050:#E6F2F1;

  --gold-600:#B57A17;
  --gold-500:#D69A28;
  --gold-400:#E8B54B;
  --gold-300:#F3D08A;
  --gold-050:#FCF3E0;

  --blush-300:#E8B8AE;
  --blush-050:#FBF0EC;

  /* Vibrant accents (neumorphic buttons) */
  --amber-500:#FF9A2E;
  --amber-600:#F5760F;
  --amber-700:#D95E05;
  --coral-500:#FF6B5B;
  --coral-600:#F04A38;

  --cream:#F4EFE2;
  --sand:#EEE3CC;
  --ink:#0E2226;
  --body:#3E5257;
  --muted:#6B8085;
  --line:#E3D9C8;
  --white:#FFFFFF;

  /* Type */
  --font-display:"Fraunces","Playfair Display",Georgia,"Times New Roman",serif;
  --font-body:"Share Tech","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  /* Rhythm */
  --wrap:1200px;
  --wrap-narrow:920px;
  --gutter:clamp(1.1rem,4vw,2rem);
  --sec-y:clamp(3.6rem,8vw,6.5rem);
  /* Rectangular, boxy corners — not pills/blobs */
  --r-sm:6px;
  --r-md:8px;
  --r-lg:10px;
  --r-xl:14px;

  /* Elevation */
  --sh-1:0 1px 2px rgba(4,38,43,.06),0 2px 8px rgba(4,38,43,.05);
  --sh-2:0 4px 10px rgba(4,38,43,.07),0 12px 28px rgba(4,38,43,.08);
  --sh-3:0 10px 20px rgba(4,38,43,.09),0 26px 60px rgba(4,38,43,.14);
  --sh-gold:0 10px 26px rgba(214,154,40,.32);

  /* ---- Neumorphism: soft-UI dual shadows on the cream surface ---- */
  --neu-surface:#F4EFE2;
  --neu-light:#FFFFFF;
  --neu-shadow:#D3C8AE;
  --neu-raised:6px 6px 14px var(--neu-shadow),-6px -6px 14px var(--neu-light);
  --neu-raised-sm:3px 3px 7px var(--neu-shadow),-3px -3px 7px var(--neu-light);
  --neu-raised-lg:10px 10px 22px var(--neu-shadow),-10px -10px 22px var(--neu-light);
  --neu-inset:inset 3px 3px 7px var(--neu-shadow),inset -3px -3px 7px var(--neu-light);
  --neu-inset-lg:inset 5px 5px 12px var(--neu-shadow),inset -5px -5px 12px var(--neu-light);

  /* Neumorphism on the dark teal surface (header pill, teal sections) */
  --neu-d-surface:#0A5058;
  --neu-d-light:rgba(255,255,255,.09);
  --neu-d-shadow:rgba(0,0,0,.48);
  --neu-d-raised:5px 5px 12px var(--neu-d-shadow),-5px -5px 12px var(--neu-d-light);
  --neu-d-inset:inset 3px 3px 7px var(--neu-d-shadow),inset -3px -3px 6px var(--neu-d-light);

  --ease:cubic-bezier(.22,.7,.32,1);
}

/* ---------- 2. Reset ----------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:104px}
body{
  margin:0;
  font-family:var(--font-body);
  font-size:clamp(.92rem,.89rem + .16vw,.98rem);
  line-height:1.65;
  color:var(--body);
  background:var(--cream);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--teal-600);text-decoration:none}
a:hover{color:var(--gold-600)}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--ink);
  line-height:1.14;
  margin:0 0 .6em;
  font-weight:600;
  letter-spacing:-.015em;
}
h1{font-size:clamp(2.2rem,1.4rem + 3.6vw,4rem)}
h2{font-size:clamp(1.75rem,1.25rem + 2.1vw,2.85rem)}
h3{font-size:clamp(1.18rem,1.05rem + .6vw,1.5rem)}
h4{font-size:1.05rem;font-family:var(--font-body);font-weight:700}
p{margin:0 0 1.05em;text-align:justify;text-align-last:left}
ul,ol{margin:0 0 1.1em;padding-left:1.15em}
li{margin-bottom:.45em}
:focus-visible{outline:3px solid var(--gold-500);outline-offset:3px;border-radius:6px}
::selection{background:var(--gold-300);color:var(--ink)}

/* ---------- 3. Layout helpers -------------------------------------------- */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.wrap-narrow{max-width:var(--wrap-narrow)}
.section{padding-block:var(--sec-y);position:relative;overflow:hidden}
.section--cream{background:var(--cream)}
.section--sand{background:linear-gradient(180deg,var(--cream) 0%,var(--sand) 55%,var(--cream) 100%)}
.section--teal{background:var(--teal-900);color:#CFE2E2}
.section--teal h2,.section--teal h3{color:#fff}
.center{text-align:center;text-align-last:center}

/* ---------- Floating wireframe landscape motifs — islands, mountains, coastlines ----------
   Fine line-art (stroke, not fill) so they read as scenic sketches, not flat watermark blobs.
   Two depths: a fixed far layer (slow parallax drift) + per-section near layer (scrolls, own drift). */
:root{
  --wire-island:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20150'%3E%3Cpath%20d='M52%202C40%202%2030%206%2026%2014C24%2018%2024%2022%2022%2024L10%2019L18%2032C10%2042%206%2056%2010%2070C5%2082%207%2096%2015%20108C20%20118%2026%20128%2034%20137C42%20146%2050%20149%2056%20145C64%20140%2070%20130%2075%20118C82%20108%2090%2096%2088%2082C93%2068%2090%2052%2082%2038C77%2026%2068%2012%2052%202Z'%20fill='none'%20stroke='%23000'%20stroke-width='1.6'%20stroke-linejoin='round'/%3E%3Cpath%20d='M34%2044C40%2058%2037%2074%2042%2090C46%20102%2051%20114%2047%20126'%20fill='none'%20stroke='%23000'%20stroke-width='.9'%20opacity='.65'/%3E%3Cpath%20d='M62%2050C58%2064%2063%2078%2059%2094C55%20108%2059%20120%2053%20132'%20fill='none'%20stroke='%23000'%20stroke-width='.9'%20opacity='.65'/%3E%3C/svg%3E");
  --wire-mountain:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20200%20100'%3E%3Cpath%20d='M0%2C90%20L24%2C44%20L46%2C66%20L70%2C24%20L94%2C60%20L118%2C36%20L142%2C64%20L166%2C40%20L190%2C62%20L200%2C54'%20fill='none'%20stroke='%23000'%20stroke-width='1.6'%20stroke-linejoin='round'/%3E%3Cpath%20d='M0%2C97%20L24%2C76%20L46%2C84%20L70%2C66%20L94%2C82%20L118%2C72%20L142%2C86%20L166%2C74%20L190%2C84%20L200%2C80'%20fill='none'%20stroke='%23000'%20stroke-width='.9'%20opacity='.55'/%3E%3Cpath%20d='M8%2C107.2%20L4.5%2C107.2%20L8%2C98.1%20L5.2%2C100.2%20L8%2C94.6%20L5.55%2C96.35%20L8%2C91.1%20L10.45%2C96.35%20L8%2C94.6%20L10.8%2C100.2%20L8%2C98.1%20L11.5%2C107.2%20ZM34%2C107.2%20L30.5%2C107.2%20L34%2C98.1%20L31.2%2C100.2%20L34%2C94.6%20L31.55%2C96.35%20L34%2C91.1%20L36.45%2C96.35%20L34%2C94.6%20L36.8%2C100.2%20L34%2C98.1%20L37.5%2C107.2%20ZM58%2C107.2%20L54.5%2C107.2%20L58%2C98.1%20L55.2%2C100.2%20L58%2C94.6%20L55.55%2C96.35%20L58%2C91.1%20L60.45%2C96.35%20L58%2C94.6%20L60.8%2C100.2%20L58%2C98.1%20L61.5%2C107.2%20ZM84%2C107.2%20L80.5%2C107.2%20L84%2C98.1%20L81.2%2C100.2%20L84%2C94.6%20L81.55%2C96.35%20L84%2C91.1%20L86.45%2C96.35%20L84%2C94.6%20L86.8%2C100.2%20L84%2C98.1%20L87.5%2C107.2%20ZM108%2C107.2%20L104.5%2C107.2%20L108%2C98.1%20L105.2%2C100.2%20L108%2C94.6%20L105.55%2C96.35%20L108%2C91.1%20L110.45%2C96.35%20L108%2C94.6%20L110.8%2C100.2%20L108%2C98.1%20L111.5%2C107.2%20ZM132%2C107.2%20L128.5%2C107.2%20L132%2C98.1%20L129.2%2C100.2%20L132%2C94.6%20L129.55%2C96.35%20L132%2C91.1%20L134.45%2C96.35%20L132%2C94.6%20L134.8%2C100.2%20L132%2C98.1%20L135.5%2C107.2%20ZM156%2C107.2%20L152.5%2C107.2%20L156%2C98.1%20L153.2%2C100.2%20L156%2C94.6%20L153.55%2C96.35%20L156%2C91.1%20L158.45%2C96.35%20L156%2C94.6%20L158.8%2C100.2%20L156%2C98.1%20L159.5%2C107.2%20ZM180%2C107.2%20L176.5%2C107.2%20L180%2C98.1%20L177.2%2C100.2%20L180%2C94.6%20L177.55%2C96.35%20L180%2C91.1%20L182.45%2C96.35%20L180%2C94.6%20L182.8%2C100.2%20L180%2C98.1%20L183.5%2C107.2%20Z'%20fill='%23000'%20opacity='.8'/%3E%3C/svg%3E");
  --wire-sigiriya:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%20100%20100%27%3E%3Cpath%20d%3D%27M6%2C96%20L18%2C60%20L26%2C68%20L34%2C50%20L42%2C66%20L50%2C44%20L58%2C64%20L66%2C52%20L74%2C66%20L84%2C60%20L94%2C96%20Z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.6%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M28%2C44%20L66%2C44%20L62%2C32%20L32%2C32%20Z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.3%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M40%2C32%20L52%2C32%20L50%2C20%20L42%2C20%20Z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271%27%20opacity%3D%27.8%27/%3E%3Cpath%20d%3D%27M44%2C20%20L48%2C20%20L47%2C12%20L45%2C12%20Z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271%27%20opacity%3D%27.8%27/%3E%3C/svg%3E");
  --wire-dagoba:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20100%20100'%3E%3Cpath%20d='M14%2C92%20L86%2C92%20L72%2C80%20L28%2C80%20Z'%20fill='none'%20stroke='%23000'%20stroke-width='1.5'%20stroke-linejoin='round'/%3E%3Cpath%20d='M28%2C80%20L72%2C80%20L62%2C70%20L38%2C70%20Z'%20fill='none'%20stroke='%23000'%20stroke-width='1.3'%20stroke-linejoin='round'/%3E%3Cpath%20d='M38%2C70C38%2C50%2044%2C34%2050%2C34C56%2C34%2062%2C50%2062%2C70Z'%20fill='none'%20stroke='%23000'%20stroke-width='1.6'/%3E%3Cpath%20d='M42%2C58L58%2C58'%20stroke='%23000'%20stroke-width='.8'%20opacity='.6'/%3E%3Cpath%20d='M44%2C48L56%2C48'%20stroke='%23000'%20stroke-width='.8'%20opacity='.6'/%3E%3Cpath%20d='M50%2C34L50%2C10%20M46%2C16L54%2C16'%20stroke='%23000'%20stroke-width='1.4'%20stroke-linecap='round'/%3E%3C/svg%3E");
  --wire-airport:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%20300%20160%27%3E%3Cpath%20d%3D%27M20%2C140%20L20%2C60%20Q90%2C20%20160%2C60%20L160%2C140%20Z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.6%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M45%2C70%20L45%2C130M65%2C70%20L65%2C130M85%2C70%20L85%2C130M105%2C70%20L105%2C130M125%2C70%20L125%2C130M145%2C70%20L145%2C130%27%20stroke%3D%27%23000%27%20stroke-width%3D%271%27%20opacity%3D%27.55%27/%3E%3Cpath%20d%3D%27M85%2C110%20L85%2C140%20M95%2C110%20L95%2C140%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.2%27%20opacity%3D%27.7%27/%3E%3Cpath%20d%3D%27M190%2C138%20L230%2C138%20M195%2C138%20L195%2C150%20M225%2C138%20L225%2C150%20M190%2C128%20L230%2C128%20M190%2C128%20L190%2C138%20M230%2C128%20L230%2C138%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.3%27%20stroke-linecap%3D%27round%27/%3E%3Cpath%20d%3D%27M250%2C150%20L262%2C150%20L260%2C138%20L252%2C138%20Z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.3%27/%3E%3Cpath%20d%3D%27M256%2C138%20C250%2C128%20246%2C120%20256%2C108%20C266%2C120%20262%2C128%20256%2C138Z%20M256%2C130%20C252%2C122%20254%2C116%20256%2C112%20C258%2C116%20260%2C122%20256%2C130Z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271%27/%3E%3Cpath%20d%3D%27M20%2C45%20C80%2C5%20200%2C5%20270%2C40%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271.3%27%20stroke-dasharray%3D%275%205%27%20opacity%3D%27.75%27/%3E%3Cpath%20d%3D%27M265%2C32%20L280%2C36%20L270%2C40%20L273%2C46%20L266%2C44%20L262%2C50%20L260%2C42%20L253%2C40%20Z%27%20fill%3D%27%23000%27%20opacity%3D%27.85%27/%3E%3Cpath%20d%3D%27M40%2C30%20a6%2C6%200%201%2C0%200.1%2C0%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271%27%20opacity%3D%27.5%27/%3E%3Cpath%20d%3D%27M110%2C15%20a4%2C4%200%201%2C0%200.1%2C0%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%271%27%20opacity%3D%27.5%27/%3E%3C/svg%3E");
}
@keyframes wire-drift-a{
  0%,100%{transform:translate(0,0) rotate(var(--wr,0deg))}
  50%{transform:translate(1.4vw,-1.6vh) rotate(calc(var(--wr,0deg) + 2deg))}
}
@keyframes wire-drift-b{
  0%,100%{transform:translate(0,0) rotate(var(--wr,0deg))}
  50%{transform:translate(-1.2vw,1.4vh) rotate(calc(var(--wr,0deg) - 2deg))}
}
@keyframes wire-fade{
  0%,100%{opacity:var(--wo,.3)}
  50%{opacity:calc(var(--wo,.3) * .55)}
}
body{position:relative}
/* far layer — large, fixed, ultra-slow, sits behind everything */
body::before,body::after{
  content:'';position:fixed;z-index:1;pointer-events:none;top:0;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center;
  background:var(--teal-800);
}
body::before{
  -webkit-mask-image:var(--wire-island);mask-image:var(--wire-island);
  width:min(15vw,170px);aspect-ratio:100/150;right:1vw;top:-2vh;
  opacity:.16;animation:wire-drift-a 46s ease-in-out infinite;
}
body::after{
  -webkit-mask-image:var(--wire-mountain);mask-image:var(--wire-mountain);
  width:min(20vw,240px);aspect-ratio:200/100;left:-3vw;bottom:2vh;top:auto;
  opacity:.14;animation:wire-drift-b 58s ease-in-out infinite;
}
@media(max-width:1000px){body::before,body::after{display:none}}
/* near layer — per-section, scrolls with content, one motif per section */
.section::before,.site-footer::before{
  content:'';position:absolute;z-index:0;pointer-events:none;
  width:min(18vw,220px);aspect-ratio:100/150;top:10%;right:-4%;
  -webkit-mask-image:var(--wire-island);mask-image:var(--wire-island);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center;
  background:currentColor;--wo:.28;--wr:-8deg;opacity:var(--wo);
  animation:wire-drift-a 34s ease-in-out infinite,wire-fade 12s ease-in-out infinite;
}
.section>*{position:relative;z-index:1}
.section:nth-of-type(even)::before{
  left:-4%;right:auto;top:auto;bottom:8%;--wr:11deg;
  animation-name:wire-drift-b,wire-fade;
}
.section--teal::before{--wo:.32}
#services::before{width:min(30vw,340px);aspect-ratio:200/100;-webkit-mask-image:var(--wire-mountain);mask-image:var(--wire-mountain);top:-2%;right:2%;--wr:4deg;--wo:.22}
#packages::before{width:min(15vw,170px);aspect-ratio:1/1;-webkit-mask-image:var(--wire-sigiriya);mask-image:var(--wire-sigiriya);left:-4%;right:auto;bottom:-2%;top:auto;--wr:0deg;--wo:.3}
#how-it-works::before{width:min(28vw,320px);aspect-ratio:200/100;-webkit-mask-image:var(--wire-mountain);mask-image:var(--wire-mountain);top:8%;right:-6%;--wr:0deg;--wo:.24}
#destinations::before{width:min(15vw,170px);aspect-ratio:1/1;-webkit-mask-image:var(--wire-dagoba);mask-image:var(--wire-dagoba);left:-4%;right:auto;bottom:2%;top:auto;--wr:0deg;--wo:.3}
#places::before{width:min(26vw,300px);aspect-ratio:200/100;-webkit-mask-image:var(--wire-mountain);mask-image:var(--wire-mountain);top:4%;right:0;--wr:2deg;--wo:.22}
#weddings::before{width:min(15vw,180px);aspect-ratio:1/1;-webkit-mask-image:var(--wire-dagoba);mask-image:var(--wire-dagoba);left:-4%;right:auto;top:12%;--wr:0deg;--wo:.34}
#faq::before{width:min(15vw,170px);aspect-ratio:1/1;-webkit-mask-image:var(--wire-sigiriya);mask-image:var(--wire-sigiriya);right:-3%;bottom:6%;top:auto;--wr:0deg;--wo:.28}
#enquiry::before{width:min(17vw,200px);left:-4%;right:auto;top:8%;--wr:-8deg;--wo:.3}
.site-footer::before{width:min(20vw,230px);right:-3%;bottom:8%;top:auto;--wr:-6deg;--wo:.26;color:#3E7079}
@media(max-width:720px){
  .section::before,.site-footer::before{width:34vw;--wo:.22}
  #services::before,#how-it-works::before,#places::before{width:52vw}
  body::before{width:38vw}
  body::after{width:46vw}
}
@media(prefers-reduced-motion:reduce){
  body::before,body::after,.section::before,.site-footer::before{animation:none}
}
.skip-link{
  position:absolute;left:-999px;top:0;z-index:999;background:var(--gold-500);
  color:var(--teal-900);padding:.7rem 1.2rem;font-weight:700;border-radius:0 0 8px 0;
}
.skip-link:focus{left:0}

/* Eyebrow + section heads */
.eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.74rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold-600);margin-bottom:.85rem;
}
.eyebrow::before{content:"";width:26px;height:2px;background:linear-gradient(90deg,var(--gold-400),transparent);border-radius:2px}
.section--teal .eyebrow{color:var(--gold-400)}
.sec-head{max-width:44rem;margin-bottom:clamp(2rem,4vw,3.2rem)}
.sec-head.center{margin-inline:auto}
.sec-head p{font-size:1.06rem;color:var(--muted);margin-bottom:0}
.sec-head.center p,.cta-band p,.card--window .card__body p,.mcap__body p{text-align:center;text-align-last:center}
.section--teal .sec-head p{color:#A9C6C6}

/* ---------- 4. Buttons — neumorphic, vibrant, rectangular ----------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  padding:.92rem 1.75rem;border-radius:0;border:0;
  font-weight:700;font-size:.97rem;letter-spacing:.01em;cursor:pointer;
  transition:transform .22s var(--ease),box-shadow .22s var(--ease),background .25s,color .25s,filter .22s;
  text-align:center;line-height:1.2;
}
.btn svg{width:18px;height:18px;flex:none}
.btn--gold{
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700));
  color:#2B1500;
  box-shadow:4px 4px 10px rgba(180,80,5,.38),-4px -4px 10px rgba(255,205,140,.55),var(--sh-gold);
}
.btn--gold:hover{transform:translateY(-3px);color:#2B1500;box-shadow:4px 4px 10px rgba(180,80,5,.4),-4px -4px 10px rgba(255,205,140,.4),0 8px 16px rgba(217,94,5,.28)}
.btn--gold:active{transform:translateY(0);box-shadow:var(--neu-inset),0 4px 10px rgba(217,94,5,.3)}
.btn--teal{
  background:linear-gradient(135deg,var(--teal-600),var(--teal-900));color:#fff;
  box-shadow:4px 4px 10px rgba(3,20,23,.4),-4px -4px 10px rgba(30,140,150,.28);
}
.btn--teal:hover{transform:translateY(-3px);color:#fff;box-shadow:4px 4px 10px rgba(3,20,23,.45),-4px -4px 10px rgba(30,140,150,.24),0 8px 14px rgba(3,20,23,.28)}
.btn--teal:active{transform:translateY(0);box-shadow:inset 3px 3px 7px rgba(0,0,0,.4),inset -3px -3px 7px rgba(255,255,255,.08)}
.btn--ghost{color:#fff;background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.4);backdrop-filter:blur(6px)}
.btn--ghost:hover{color:#fff;background:rgba(255,255,255,.22);border-color:#fff;transform:translateY(-3px)}
.btn--outline{
  color:var(--teal-800);background:var(--neu-surface);
  box-shadow:var(--neu-raised-sm);
}
.btn--outline:hover{color:var(--amber-700);transform:translateY(-3px);box-shadow:var(--neu-raised)}
.btn--outline:active{transform:translateY(0);box-shadow:var(--neu-inset);color:var(--amber-700)}
.btn--wa{
  background:linear-gradient(135deg,#3adf7a,#1DA851);color:#04321A;
  box-shadow:4px 4px 10px rgba(9,90,40,.38),-4px -4px 10px rgba(150,255,190,.5);
}
.btn--wa:hover{transform:translateY(-3px);color:#04321A;box-shadow:4px 4px 10px rgba(9,90,40,.4),-4px -4px 10px rgba(150,255,190,.4),0 8px 16px rgba(9,90,40,.26)}
.btn--wa:active{transform:translateY(0);box-shadow:var(--neu-inset)}
.btn--sm{padding:.66rem 1.2rem;font-size:.87rem;border-radius:0}
.btn--block{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:.85rem}
.btn-row.center{justify-content:center}

/* ---------- 5. Animated background layer --------------------------------- */
.sky{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.sky span{position:absolute;display:block;will-change:transform,opacity}

/* drifting clouds */
.cloud{
  border-radius:100px;background:rgba(255,255,255,.55);filter:blur(2px);
  animation:drift linear infinite;
}
.cloud::before,.cloud::after{
  content:"";position:absolute;background:inherit;border-radius:100px;
}
.cloud::before{width:56%;height:170%;left:12%;top:-70%}
.cloud::after{width:40%;height:150%;right:14%;top:-52%}
@keyframes drift{
  0%{transform:translateX(-25vw)}
  100%{transform:translateX(125vw)}
}

/* floating particles / bokeh */
.dot{
  border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.95),rgba(232,181,75,.35));
  animation:float-up linear infinite;opacity:0;
}
@keyframes float-up{
  0%{transform:translateY(20px) scale(.6);opacity:0}
  12%{opacity:.85}
  85%{opacity:.5}
  100%{transform:translateY(-92vh) scale(1.15);opacity:0}
}

/* travel icons — passport, suitcase, camera etc. — floating/drifting diagonally across the section */
.glide{
  animation:glide-path linear infinite;
  pointer-events:auto;cursor:default;
}
.glide svg{
  width:100%;height:100%;fill:none;stroke:rgba(255,255,255,.85);stroke-width:1.4;
  filter:drop-shadow(0 2px 5px rgba(4,38,43,.35));
  transition:transform .3s var(--ease),filter .3s var(--ease),stroke .3s var(--ease);
}
.glide:hover svg{
  transform:scale(1.3);
  stroke:var(--gold-400,#F3D08A);
  filter:drop-shadow(0 4px 10px rgba(4,38,43,.4)) drop-shadow(0 0 10px rgba(243,208,138,.65));
}
@keyframes glide-path{
  0%{transform:translateX(-8vw) translateY(var(--y0,0)) rotate(var(--r0,-4deg))}
  50%{transform:translateX(50vw) translateY(var(--y1,-26px)) rotate(var(--r1,3deg))}
  100%{transform:translateX(108vw) translateY(var(--y0,0)) rotate(var(--r0,-4deg))}
}
.glide--rev{animation-direction:reverse}

/* gentle bob for decorative badges */
.bob{animation:bob 6s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}

/* palm-leaf silhouettes on light sections */
.leaf-bg{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;opacity:.5}
.leaf-bg span{position:absolute;color:var(--teal-500);opacity:.14;animation:sway 9s ease-in-out infinite}
.leaf-bg svg{width:100%;height:100%}
@keyframes sway{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(5deg) translateY(-14px)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
}

/* ---------- 6. Top bar + header ------------------------------------------ */
.topbar{
  background:var(--teal-900);color:#B9D3D3;font-size:.82rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.topbar__in{display:flex;flex-wrap:wrap;gap:.4rem 1.5rem;align-items:center;justify-content:center;padding-block:.55rem}
.topbar a{color:#DCEBEA;display:inline-flex;align-items:center;gap:.42rem}
.topbar a:hover{color:var(--gold-400)}
.topbar svg{width:14px;height:14px;stroke:var(--gold-400);fill:none;stroke-width:1.8}
.topbar__sep{display:none;width:1px;height:14px;background:rgba(255,255,255,.2)}
.topbar__group{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.3rem .9rem}
/* keep the bar to a single readable line on phones */
.topbar__group + .topbar__group{display:none}
@media(min-width:880px){
  .topbar__in{justify-content:space-between}
  .topbar__sep{display:block}
  .topbar__group{gap:1.1rem;flex-wrap:nowrap}
  .topbar__group + .topbar__group{display:flex}
}

.site-header{
  position:sticky;top:0;z-index:90;background:transparent;
  border-bottom:1px solid transparent;
  transition:box-shadow .3s var(--ease),border-color .3s,background .3s;
}
.site-header.is-stuck{
  background:rgba(244,239,226,.97);backdrop-filter:blur(6px);
  box-shadow:rgba(0,0,0,.4) 0px 2px 4px,rgba(0,0,0,.3) 0px 7px 13px -3px,rgba(0,0,0,.2) 0px -3px 0px inset;
  border-color:var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:.9rem;padding-block:1.1rem}

/* ---------- Lower-third navbar — rounded outer container, sharp diagonal accents inside ---------- */
.navbar{
  position:relative;flex:1;display:flex;align-items:stretch;min-width:0;
  border-radius:20px;overflow:hidden;isolation:isolate;
  background:linear-gradient(100deg,#0b0b0b 0%,#123339 46%,#04262B 100%);
  box-shadow:0 20px 40px rgba(4,38,43,.4),0 2px 0 rgba(255,255,255,.06) inset;
}
.navbar::before,.navbar::after{
  content:'';position:absolute;top:0;bottom:0;width:16px;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,var(--amber-500),var(--amber-700));transform:skewX(-16deg);
}
.navbar::before{left:104px}
.navbar::after{right:22%;opacity:.5}
@media(max-width:1199px){.navbar::before,.navbar::after{display:none}}

.navbar__logo{
  flex:none;display:flex;align-items:center;justify-content:center;
  width:104px;padding:.5rem;position:relative;z-index:2;
  background:linear-gradient(160deg,#050505,#161616);
}
.navbar__logo img{height:52px;width:auto;display:block;filter:drop-shadow(0 3px 6px rgba(0,0,0,.55))}

.navbar__menu{flex:1;display:none;align-items:stretch;justify-content:center;position:relative;z-index:2;min-width:0;padding-left:1.75rem}
.navbar__menu ul{list-style:none;margin:0;padding:0 1.2rem;display:flex;align-items:stretch;height:100%}
.navbar__menu li{display:flex}
.navbar__menu a{
  display:flex;align-items:center;padding:0 1.05rem;font-weight:800;font-size:.78rem;
  letter-spacing:.03em;text-transform:uppercase;color:rgba(255,255,255,.75);
  position:relative;white-space:nowrap;transition:color .22s;
}
/* Scoped to the top-level "> ul > li > a" chain only, so these hover/underline/
   active-page rules never leak into the dropdown/mega submenu links nested
   further inside the same .navbar__menu (those get their own styling below). */
.navbar__menu>ul>li>a:hover{color:#fff}
.navbar__menu>ul>li>a::after{
  content:'';position:absolute;left:8%;right:8%;bottom:22%;height:2px;
  background:linear-gradient(90deg,var(--amber-500),var(--amber-700));
  transform:scaleX(0);transition:transform .25s var(--ease);
}
.navbar__menu>ul>li>a:hover::after{transform:scaleX(1)}
.navbar__menu>ul>li>a[aria-current="page"]{
  color:#2B1500;background:linear-gradient(180deg,var(--amber-500),var(--amber-600));
  border-radius:999px;margin:1.125rem .1rem .55rem;padding:0 1.2rem;
  box-shadow:0 4px 10px rgba(0,0,0,.25);
}
.navbar__menu>ul>li>a[aria-current="page"]::after{display:none}

.navbar__aside{
  flex:none;display:none;align-items:center;gap:.55rem;position:relative;z-index:2;
  padding:0 1.3rem;color:#fff;
}
.navbar__aside svg{width:17px;height:17px;stroke:#F5C089;fill:none;stroke-width:2;flex:none}
.navbar__aside span{font-weight:700;font-size:.78rem;white-space:nowrap;color:#F1E2D0}

/* ---------- Nav dropdown / mega menu ------------------------------------- */
.navbar__menu li.has-dropdown,.navbar__menu li.has-mega{position:relative}
.navbar__menu a.has-caret::after{content:none}
.navbar__menu a .caret{width:9px;height:9px;margin-left:.35rem;stroke:currentColor;stroke-width:2.4;fill:none;flex:none;transition:transform .2s}
.navbar__menu li.is-open .caret{transform:rotate(180deg)}

/* position:fixed so the panel escapes .navbar's overflow:hidden (used for its
   diagonal accent stripes) — top/left/width and the .is-open toggle are set
   by JS (see main.js), not by CSS :hover, since fixed positioning has no
   implicit relationship to the trigger and a pure-CSS :hover chain breaks
   across the gap between the trigger and a fixed-position panel. */
.dropdown,.mega{
  position:fixed;background:#fff;border-radius:var(--r-lg);
  box-shadow:0 24px 50px rgba(4,38,43,.32);
  opacity:0;visibility:hidden;transform:translateY(-6px);pointer-events:none;
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s;
  z-index:200;
}
.dropdown.is-open,.mega.is-open{
  opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto;
}

.dropdown{min-width:280px;padding:.7rem}
.dropdown a{
  display:flex;flex-direction:column;gap:.1rem;padding:.65rem .8rem;border-radius:var(--r-md);
  color:var(--ink);text-transform:none;letter-spacing:normal;font-weight:400;height:auto;
  position:relative;
}
.dropdown a:hover{background:var(--cream);color:var(--ink)}
.dropdown a:not(.dropdown__all)::after{
  content:'';position:absolute;left:.8rem;bottom:2px;width:28px;height:2px;
  background:linear-gradient(90deg,var(--amber-500),var(--amber-700));
  transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease);
}
.dropdown a:not(.dropdown__all):hover::after{transform:scaleX(1)}
.dropdown a strong{font-family:var(--font-display);font-size:.98rem;font-weight:700;color:var(--teal-800)}
.dropdown a span{font-size:.82rem;color:var(--muted)}
.dropdown a.dropdown__all{
  margin-top:.3rem;padding-top:.75rem;border-top:1px solid var(--line);
  font-size:.8rem;font-weight:700;color:var(--gold-600);text-transform:uppercase;letter-spacing:.03em;
}
.dropdown a.dropdown__all:hover{color:var(--amber-700);background:none}

.mega{
  border-radius:0 0 20px 20px;
  padding:clamp(1.6rem,3vw,2.4rem) clamp(1.6rem,4vw,3rem);
  display:grid;grid-template-columns:1.3fr 1fr .9fr;gap:2.2rem;
}
.mega h4{font-family:var(--font-display);font-size:1rem;color:var(--teal-800);margin-bottom:.9rem}
.mega__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.2rem .8rem}
.mega__grid a,.mega__list a{
  display:block;padding:.5rem .1rem;color:var(--body);text-transform:none;letter-spacing:normal;
  font-weight:400;font-size:.92rem;height:auto;border-bottom:1px solid var(--line);
  position:relative;text-align:left;
}
.mega__list a{padding:.5rem .1rem}
.mega__grid a:hover,.mega__list a:hover{color:var(--teal-700)}
.mega__grid a::after,.mega__list a::after{
  content:'';position:absolute;left:.1rem;bottom:0;width:28px;height:2px;
  background:linear-gradient(90deg,var(--amber-500),var(--amber-700));
  transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease);
}
.mega__grid a:hover::after,.mega__list a:hover::after{transform:scaleX(1)}
.mega a.mega__all{
  display:inline-block;margin-top:.9rem;color:var(--gold-600);font-weight:700;font-size:.82rem;
  text-transform:uppercase;letter-spacing:.03em;height:auto;padding:0;
}
.mega a.mega__all:hover{color:var(--amber-700)}
.mega__promo{border-left:1px solid var(--line);padding-left:2.2rem;text-align:center}
.mega__promo img{width:auto;height:auto;max-width:100%;border-radius:var(--r-lg);margin:0 auto .9rem;display:block;box-shadow:var(--sh-2)}
.mega__promo p{font-size:.86rem;color:var(--muted);line-height:1.5;text-align:center;text-align-last:center;margin-bottom:.3rem}
.mega__promo .btn{margin:.5rem auto .6rem;height:auto;padding:.9rem 1.05rem}

@media(min-width:1200px){
  .navbar__menu,.navbar__aside{display:flex}
}
@media(max-width:1199px){
  .navbar{flex:none;border-radius:16px}
  .navbar__logo{width:auto;padding:.45rem .8rem}
  .navbar__logo img{height:38px}
}

.nav__cta{
  flex:none;display:none;border-radius:999px!important;
  background:linear-gradient(135deg,#1a1a1a,#000)!important;color:#fff!important;
  box-shadow:0 10px 22px rgba(4,38,43,.3);transition:background .25s,color .25s,transform .25s var(--ease);
}
.nav__cta svg{stroke:#fff}
.nav__cta:hover{
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700))!important;color:#2B1500!important;
  transform:translateY(-3px);
}
.nav__cta:hover svg{stroke:#2B1500}
@media(min-width:1200px){.nav__cta{display:inline-flex}}

.nav__toggle{
  display:inline-flex;flex-direction:column;justify-content:center;gap:5px;
  width:48px;height:48px;flex:none;padding:0 13px;border:0;border-radius:var(--r-lg);
  background:var(--neu-surface);box-shadow:var(--neu-raised-sm);cursor:pointer;
}
.nav__toggle span{display:block;height:2px;background:var(--teal-800);border-radius:2px;transition:transform .3s var(--ease),opacity .2s}
.nav__toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav__toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav__toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(min-width:1200px){.nav__toggle{display:none}}

.mobile-menu{
  display:none;border-top:1px solid var(--line);background:var(--cream);
  padding:1rem var(--gutter) 1.6rem;
}
.mobile-menu.is-open{display:block;animation:slide-down .3s var(--ease)}
@keyframes slide-down{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.mobile-menu ul{list-style:none;margin:0 0 1rem;padding:0}
.mobile-menu li{margin:0;border-bottom:1px solid var(--line)}
.mobile-menu a{display:block;padding:.85rem .2rem;font-weight:600;color:var(--teal-800)}
/* Scoped to the nav-list links only (.mobile-menu ul a) — unscoped, this
   beat the .btn--gold/.btn--outline hover-color rules by specificity
   (class+class+element beats class+class), turning the "Plan My Trip" /
   "Call Now" button text amber-on-amber and effectively invisible on hover. */
.mobile-menu ul a:hover{color:var(--amber-600)}

/* ---------- 7. Hero ------------------------------------------------------ */
.hero{
  position:relative;isolation:isolate;overflow:hidden;color:#fff;
  background:linear-gradient(135deg,#0B6A78 0%,#12868C 30%,#1E9BA0 55%,#0A5058 100%);
  margin-top:calc(-1 * var(--header-h,96px));
  padding-block:calc(var(--header-h,96px) + clamp(3.4rem,8vw,6rem)) clamp(6rem,12vw,8.5rem);
}
.hero__slides{position:absolute;inset:0;z-index:-2}
.hero__photo{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:92% center;
  animation:ken 30s ease-in-out infinite alternate;
  opacity:0;transition:opacity 1.8s ease;
}
.hero__photo.is-active{opacity:1;z-index:1}
@keyframes ken{from{transform:scale(1.28)}to{transform:scale(1.42)}}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.hero__scrim{
  position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(100deg,rgba(4,38,43,1) 0%,rgba(4,38,43,.97) 46%,rgba(4,38,43,.52) 70%,rgba(4,38,43,.24) 100%),
    linear-gradient(0deg,rgba(4,38,43,.62),transparent 45%);
}
.hero__grid{position:relative;z-index:3;display:grid;gap:clamp(2rem,5vw,3.4rem);align-items:center}
@media(min-width:1000px){.hero__grid{grid-template-columns:1.15fr .85fr}}
.hero h1{color:#fff;text-shadow:0 3px 30px rgba(0,0,0,.3)}
.hero h1 em{font-style:italic;color:var(--gold-300);display:inline-block}
.hero__lead{font-size:clamp(1.03rem,.99rem + .32vw,1.2rem);color:#DCEDEC;max-width:36rem;margin-bottom:1.6rem}
.hero__badge{
  display:inline-flex;align-items:center;gap:.55rem;padding:.42rem 1rem .42rem .5rem;
  border-radius:var(--r-md);background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.25);
  backdrop-filter:blur(8px);font-size:.8rem;font-weight:600;color:#EAF6F5;margin-bottom:1.35rem;
}
.hero__badge b{
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700));color:#2B1500;border-radius:var(--r-sm);padding:.2rem .6rem;font-size:.7rem;
  letter-spacing:.08em;text-transform:uppercase;
}
.hero__chips{display:grid;grid-template-columns:1fr;gap:.5rem;margin-top:1.9rem;list-style:none;padding:0}
@media(min-width:420px){.hero__chips{grid-template-columns:repeat(2,auto);gap:.5rem .6rem}}
.hero__chips li{
  display:inline-flex;align-items:center;gap:.42rem;font-size:.83rem;font-weight:600;color:#EAF6F5;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);
  padding:.42rem .85rem;border-radius:var(--r-md);backdrop-filter:blur(6px);
}
.hero__chips svg{width:15px;height:15px;stroke:var(--gold-400);fill:none;stroke-width:2}

/* quick enquiry card */
.quick-card{
  background:var(--neu-surface);border-radius:var(--r-xl);padding:clamp(1.4rem,3vw,2rem);
  box-shadow:10px 10px 24px rgba(0,0,0,.3),-8px -8px 20px rgba(255,255,255,.08);position:relative;
}
.quick-card::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(140deg,rgba(255,154,46,.1),transparent 42%);
}
.quick-card h2{font-size:1.4rem;margin-bottom:.3rem}
.quick-card p{font-size:.9rem;color:var(--muted);margin-bottom:1.1rem}
.quick-card .form-row{margin-bottom:.8rem}
.quick-card__note{font-size:.76rem;color:var(--muted);margin:.85rem 0 0;text-align:center;line-height:1.5}

/* ---------- 8. Assurance strip — floating rectangle bridge over the hero -- */
.assure{position:relative;margin-top:clamp(-4.6rem,-7vw,-3.4rem);z-index:5}
.assure__panel{
  background:linear-gradient(155deg,#0E4B52,#052227);border-radius:var(--r-xl);
  box-shadow:14px 14px 30px rgba(0,0,0,.34),-8px -8px 22px rgba(30,140,150,.14),0 1px 0 rgba(255,255,255,.06) inset;
  padding:clamp(1.6rem,3.5vw,2.4rem) clamp(1.3rem,3vw,2.2rem);
}
.assure__grid{display:grid;gap:1.6rem 1.4rem;grid-template-columns:repeat(2,1fr);position:relative;z-index:2}
@media(min-width:900px){.assure__grid{grid-template-columns:repeat(4,1fr)}}
.assure__item{display:flex;gap:.9rem;align-items:flex-start}
.assure__ico{
  width:46px;height:46px;flex:none;border-radius:var(--r-md);display:grid;place-items:center;
  background:rgba(255,255,255,.05);box-shadow:var(--neu-d-raised);
}
.assure__ico svg{width:21px;height:21px;stroke:var(--amber-500);fill:none;stroke-width:1.8}
.assure__item h3{font-family:var(--font-body);font-size:.95rem;font-weight:700;color:#fff;margin:0 0 .18rem}
.assure__item p{font-size:.82rem;margin:0;color:#9FBCBC;line-height:1.55}

/* ---------- 9. Cards ----------------------------------------------------- */
.grid{display:grid;gap:clamp(1.1rem,2.4vw,1.7rem)}
.grid--2{grid-template-columns:1fr}
.grid--3{grid-template-columns:1fr}
.grid--4{grid-template-columns:repeat(2,1fr)}
@media(min-width:700px){
  .grid--2{grid-template-columns:repeat(2,1fr)}
  .grid--3{grid-template-columns:repeat(2,1fr)}
}
@media(min-width:1000px){
  .grid--3{grid-template-columns:repeat(3,1fr)}
  .grid--4{grid-template-columns:repeat(4,1fr)}
}

.card{
  background:var(--neu-surface);border-radius:var(--r-lg);
  overflow:hidden;position:relative;display:flex;flex-direction:column;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
  box-shadow:5px 5px 12px rgba(4,38,43,.16),-2px -2px 8px rgba(255,255,255,.35);
}
.card:hover{transform:translateY(-6px);box-shadow:8px 8px 18px rgba(4,38,43,.2),-3px -3px 10px rgba(255,255,255,.4)}
.card__body{padding:clamp(1.2rem,2.4vw,1.6rem);display:flex;flex-direction:column;flex:1}
.card__body p{color:var(--muted);font-size:.94rem}
.card__body p:last-of-type{margin-bottom:1rem}
.card h3{margin-bottom:.5rem}
.card__link{
  margin-top:auto;font-weight:700;font-size:.9rem;color:var(--amber-700);
  display:inline-flex;align-items:center;gap:.4rem;
}
.card__link svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .28s var(--ease)}
.card:hover .card__link svg{transform:translateX(5px)}

/* rectangular neumorphic icon cards */
.icard{text-align:center;padding:clamp(1.6rem,3vw,2.2rem) 1.4rem}
.icard__ico{
  width:64px;height:64px;margin:0 auto 1.15rem;border-radius:var(--r-md);display:grid;place-items:center;
  background:var(--neu-surface);box-shadow:var(--neu-raised);position:relative;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s;
}
.icard:hover .icard__ico{
  transform:translateY(-4px);
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700));
  box-shadow:4px 4px 10px rgba(180,80,5,.36),-4px -4px 10px rgba(255,205,140,.5);
}
.icard:hover .icard__ico svg{stroke:#2B1500}
.icard__ico svg{width:28px;height:28px;stroke:var(--teal-700);fill:none;stroke-width:1.7;transition:stroke .3s}

/* "What we do" — soft 3D neumorphic cards, pinned like physical objects on a wall */
.mosaic{display:grid;gap:1.6rem .9rem;grid-template-columns:repeat(2,1fr);max-width:1040px;margin-inline:auto;padding-top:1rem}
@media(min-width:620px){.mosaic{gap:2.2rem 1.3rem}}
@media(min-width:1040px){.mosaic{grid-template-columns:repeat(4,1fr)}}
.mcap{
  position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:1.6rem .9rem 1.3rem;border-radius:3px;background:var(--neu-surface);color:var(--teal-900);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
  box-shadow:0 4px 10px rgba(4,38,43,.08),0 26px 40px -14px rgba(4,38,43,.28),inset 0 1px 0 rgba(255,255,255,.7);
}
@media(min-width:620px){.mcap{padding:2.5rem 1.5rem 1.9rem}}
.mcap::before{
  content:'';position:absolute;left:50%;top:-13px;transform:translateX(-50%);
  width:9px;height:9px;border-radius:50%;background:var(--teal-900);
  box-shadow:0 0 0 4px var(--neu-surface),0 8px 10px rgba(4,38,43,.3);
}
.mcap:hover{transform:translateY(-8px);box-shadow:0 6px 14px rgba(4,38,43,.1),0 34px 50px -14px rgba(4,38,43,.34),inset 0 1px 0 rgba(255,255,255,.7)}
.mcap__ico{
  flex:none;width:52px;height:52px;border-radius:16px;display:grid;place-items:center;
  margin-bottom:.9rem;position:relative;
  box-shadow:6px 6px 14px rgba(4,38,43,.22),-5px -5px 12px rgba(255,255,255,.75),inset 0 1px 0 rgba(255,255,255,.25);
  transition:transform .3s var(--ease);
}
@media(min-width:620px){.mcap__ico{width:68px;height:68px;border-radius:20px;margin-bottom:1.25rem}}
.mcap:hover .mcap__ico{transform:translateY(-3px) rotate(-2deg)}
.mcap__ico svg{width:29px;height:29px;fill:none;stroke-width:1.8}
.mcap__body{display:flex;flex-direction:column;gap:.5rem;align-items:center}
.mcap__body strong{font-family:var(--font-display);font-size:1rem;color:var(--teal-900)}
.mcap__body span{font-size:.87rem;line-height:1.6;color:var(--muted);max-width:24ch;text-align:justify;text-align-last:center}

.mcap--1 .mcap__ico{background:linear-gradient(160deg,var(--teal-500),var(--teal-700))}
.mcap--1 .mcap__ico svg{stroke:#fff}
.mcap--2 .mcap__ico{background:linear-gradient(160deg,#2a2a2a,#050505)}
.mcap--2 .mcap__ico svg{stroke:var(--amber-400,#F5B15C)}
.mcap--3 .mcap__ico{background:linear-gradient(160deg,#8FD3CC,#5FB8B0)}
.mcap--3 .mcap__ico svg{stroke:#04262B}
.mcap--4 .mcap__ico{background:linear-gradient(160deg,var(--amber-500),var(--amber-700))}
.mcap--4 .mcap__ico svg{stroke:#2B1500}

/* media cards with image */
.mcard__media{
  position:relative;aspect-ratio:var(--ratio,1200/630);overflow:hidden;background:linear-gradient(135deg,var(--teal-700),var(--teal-500));
  clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,26px 100%,0 calc(100% - 26px));
}
.mcard__media img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.card:hover .mcard__media img{transform:scale(1.07)}
/* supplied artwork carries its own typography — no scrim over it */
.mcard__tag{
  position:absolute;top:.85rem;left:.85rem;z-index:2;
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700));
  color:#2B1500;font-size:.72rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  padding:.34rem .75rem;border-radius:var(--r-sm);box-shadow:2px 2px 6px rgba(0,0,0,.25);
}
.mcard__cap{position:absolute;left:1rem;right:1rem;bottom:.85rem;z-index:2;color:#fff;font-weight:700;font-size:1.05rem;font-family:var(--font-display)}

/* modern package cards — full-bleed photo, clean rounded card, caption overlay (Airbnb/Booking-style) */
.pcard{border-radius:20px}
.split__media,.mcard__media--window{
  background:#fff;
  padding:8px;
  border-radius:18px;
  box-shadow:var(--sh-3);
}
.pcard__media{position:relative;aspect-ratio:1/1;overflow:hidden}
.pcard__media img{width:100%;height:100%;object-fit:cover;object-position:96% 42%;transition:transform .6s var(--ease)}
.pcard:hover .pcard__media img{transform:scale(1.06)}
.pcard__media::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(0deg,rgba(4,38,43,.8) 0%,rgba(4,38,43,.15) 40%,transparent 62%);
}
.pcard__badge{
  position:absolute;top:.9rem;right:.9rem;z-index:2;
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700));
  color:#2B1500;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  padding:.4rem .85rem;border-radius:999px;box-shadow:0 4px 10px rgba(0,0,0,.28);
}
.pcard__caption{
  position:absolute;left:1.1rem;right:1.1rem;bottom:.9rem;z-index:2;color:#fff;
  font-family:var(--font-display);font-weight:700;font-size:1.2rem;text-shadow:0 2px 12px rgba(0,0,0,.5);
}
.pcard .card__link{
  margin-top:.9rem;display:inline-flex;align-items:center;gap:.5rem;
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700));
  color:#2B1500;font-weight:700;font-size:.88rem;padding:.7rem 1.2rem;border-radius:999px;
  box-shadow:0 6px 14px rgba(180,80,5,.28);transition:transform .25s var(--ease),box-shadow .25s var(--ease);
}
.pcard .card__link:hover{transform:translateY(-2px);color:#2B1500;box-shadow:0 8px 14px rgba(180,80,5,.3)}

/* "arch window" offering cards — wide arched photo frame, no card chrome */
.card--window{background:transparent;box-shadow:none;text-align:center;align-items:center}
.card--window:hover{transform:translateY(-6px);box-shadow:none}
.mcard__media--window{
  aspect-ratio:1/1;width:min(400px,100%);margin:0 auto;clip-path:none;
  box-shadow:var(--sh-2),inset 0 0 0 1px rgba(4,38,43,.06);
}
.mcard__media--window img{
  width:100%;height:100%;object-fit:contain;object-position:center;display:block;
  border-radius:12px;
}
.card--window .card__body{padding:1.1rem 1rem .3rem;align-items:center}
.card--window .card__body h3{font-size:1.05rem}
.card--window .card__body p{text-align:center;font-size:.9rem}

/* package cards */
.pcard__meta{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:.85rem;list-style:none;padding:0}
.pcard__meta li{
  font-size:.76rem;font-weight:700;color:var(--teal-700);background:var(--teal-050);
  padding:.28rem .68rem;border-radius:var(--r-sm);
}
.pcard__route{font-size:.87rem;color:var(--muted);margin-bottom:.9rem;line-height:1.6}
.pcard__price{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem .5rem;padding-top:.9rem;margin-top:auto;
  border-top:1px dashed var(--line);
}
.pcard__price strong{font-family:var(--font-display);font-size:1.12rem;color:var(--teal-900);white-space:nowrap}
.pcard__price span{font-size:.8rem;color:var(--muted)}

/* ---------- 9b. Geometric section divider — diagonal band with a hexagon accent ---- */
.geo-divider{height:clamp(46px,7vw,84px);position:relative;overflow:hidden;background:var(--sand)}
.geo-divider::before{
  content:"";position:absolute;inset:0;background:var(--teal-900);
  clip-path:polygon(0 100%,0 68%,100% 22%,100% 100%);
}
.geo-divider::after{
  content:"";position:absolute;left:12%;bottom:14%;width:34px;height:34px;
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700));
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);
  box-shadow:0 6px 14px rgba(4,38,43,.3);
}

/* ---------- 10. Steps with broken-line connectors ------------------------ */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:2.6rem;position:relative}
@media(min-width:900px){
  .steps{grid-template-columns:repeat(4,1fr);gap:1.4rem}
}
.step{text-align:center;position:relative;padding-inline:.5rem}
/* horizontal dashed connector (desktop) */
@media(min-width:900px){
  .step:not(:last-child)::before{
    content:"";position:absolute;top:44px;left:calc(50% + 52px);right:calc(-50% + 52px);height:2px;
    background-image:linear-gradient(90deg,var(--gold-400) 0 10px,transparent 10px 20px);
    background-size:20px 2px;background-repeat:repeat-x;opacity:.75;
    animation:march 1.6s linear infinite;
  }
}
/* vertical dashed connector (mobile) */
@media(max-width:899px){
  .step:not(:last-child)::before{
    content:"";position:absolute;left:50%;top:96px;bottom:-2.6rem;width:2px;transform:translateX(-50%);
    background-image:linear-gradient(180deg,var(--gold-400) 0 10px,transparent 10px 20px);
    background-size:2px 20px;background-repeat:repeat-y;opacity:.75;
  }
}
@keyframes march{to{background-position:20px 0}}
.step__ring{
  width:76px;height:76px;margin:0 auto 1.15rem;border-radius:var(--r-lg);position:relative;
  display:grid;place-items:center;background:var(--neu-surface);
  box-shadow:var(--neu-raised);transition:transform .3s var(--ease),box-shadow .3s var(--ease);z-index:2;
}
.step:hover .step__ring{transform:translateY(-6px);box-shadow:var(--neu-raised-lg)}
.step__ring svg{width:30px;height:30px;stroke:var(--teal-700);fill:none;stroke-width:1.7}
.step__num{
  position:absolute;top:-9px;right:-9px;width:28px;height:28px;border-radius:var(--r-sm);
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700));color:#2B1500;
  display:grid;place-items:center;font-size:.8rem;font-weight:800;
  box-shadow:2px 2px 6px rgba(0,0,0,.3),-1px -1px 4px rgba(255,205,140,.5);
}
.step h3{font-size:1.08rem;margin-bottom:.4rem}
.step p{font-size:.9rem;color:var(--muted);margin:0}
.section--teal .step__ring{background:linear-gradient(155deg,#0F565E,#082F34);box-shadow:var(--neu-d-raised)}
.section--teal .step__ring svg{stroke:var(--gold-300)}
.section--teal .step p{color:#A9C6C6}

/* ---------- 11. Split feature blocks ------------------------------------- */
.split{display:grid;gap:clamp(1.8rem,4vw,3.4rem);align-items:center}
@media(min-width:900px){.split{grid-template-columns:1fr 1fr}}
.split--flip .split__media{order:-1}
@media(min-width:900px){.split--flip .split__media{order:2}}
.split__media{position:relative}
.split__media img{border-radius:12px;width:100%;height:auto;display:block}
.split__media .ph{aspect-ratio:4/3;border-radius:var(--r-lg);box-shadow:var(--sh-3)}
.split__stamp{
  position:absolute;bottom:-22px;right:-14px;background:var(--white);border-radius:var(--r-md);
  padding:.9rem 1.2rem;box-shadow:var(--sh-3);border:1px solid var(--line);max-width:220px;
}
.split__stamp strong{display:block;font-family:var(--font-display);font-size:1.4rem;color:var(--teal-800);line-height:1}
.split__stamp span{font-size:.78rem;color:var(--muted)}

/* ---------- Places to Visit — alternating photo/content rows ------------ */
.place-row{display:grid;gap:1.8rem;align-items:center;margin-bottom:clamp(2.6rem,6vw,4.2rem)}
@media(min-width:820px){.place-row{grid-template-columns:1fr 1fr;gap:clamp(2.2rem,5vw,3.8rem)}}
.place-row--flip .place-row__media{order:-1}
@media(min-width:820px){.place-row--flip .place-row__media{order:2}}
.place-row__media img{
  width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--r-lg);
  box-shadow:var(--sh-3);display:block;
}
.place-row__tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.9rem}
.place-row__tags span{
  display:inline-flex;align-items:center;gap:.35rem;font-size:.76rem;font-weight:700;color:var(--teal-700);
  background:var(--teal-050);padding:.3rem .7rem;border-radius:var(--r-sm);
}
.place-row__tags svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
.place-row__body h3{margin-bottom:.6rem;font-size:clamp(1.3rem,2.2vw,1.6rem)}
.place-row__body h3 a{color:inherit;text-decoration:none}
.place-row__body h3 a:hover{color:var(--teal-700)}
.place-row__body p{color:var(--muted);margin-bottom:1.1rem}

.tick{list-style:none;padding:0;margin:0 0 1.6rem}
.tick li{position:relative;padding-left:2rem;margin-bottom:.75rem;font-size:.97rem}
.tick li::before{
  content:"";position:absolute;left:0;top:.3em;width:19px;height:19px;border-radius:5px;
  background:var(--neu-surface);box-shadow:var(--neu-raised-sm);
}
.tick li::after{
  content:"";position:absolute;left:6px;top:.58em;width:7px;height:4px;
  border-left:2px solid var(--amber-600);border-bottom:2px solid var(--amber-600);
  transform:rotate(-45deg);
}
.section--teal .tick li{color:#CFE2E2}

.cross{list-style:none;padding:0;margin:0}
.cross li{position:relative;padding-left:2rem;margin-bottom:.75rem;font-size:.97rem;color:var(--muted)}
.cross li::before{
  content:"";position:absolute;left:0;top:.3em;width:19px;height:19px;border-radius:5px;
  background:var(--neu-surface);box-shadow:var(--neu-raised-sm);
}
.cross li::after{
  content:"";position:absolute;left:6.5px;top:.5em;width:9px;height:9px;
  background:
    linear-gradient(45deg,transparent 42%,var(--coral-600) 42%,var(--coral-600) 58%,transparent 58%),
    linear-gradient(-45deg,transparent 42%,var(--coral-600) 42%,var(--coral-600) 58%,transparent 58%);
}

/* ---------- Tour package: mini TOC ---------------------------------------- */
.toc{
  display:flex;flex-wrap:wrap;gap:.6rem;list-style:none;padding:0;margin:0 0 2.2rem;
  position:sticky;top:96px;z-index:5;background:var(--cream);padding-block:.7rem;
}
.toc a{
  display:inline-flex;align-items:center;font-weight:700;font-size:.84rem;color:var(--teal-800);
  background:var(--neu-surface);box-shadow:var(--neu-raised-sm);padding:.55rem 1.05rem;border-radius:999px;
  transition:box-shadow .2s,color .2s;white-space:nowrap;
}
.toc a:hover{color:var(--amber-700);box-shadow:var(--neu-raised)}
@media(max-width:640px){.toc{position:static;overflow-x:auto;flex-wrap:nowrap;padding-bottom:.3rem}}

/* ---------- FAQs page: sidebar category nav + content -------------------- */
.faqs-layout{display:block}
/* align-items left at its default (stretch) so .faqs-nav's box spans the
   full height of the (much taller) .faqs-content column — a sticky child
   can only stay pinned while scrolling through its own box's height, so a
   short start-aligned nav column would scroll away well before the FAQ
   list underneath it finishes. */
@media(min-width:900px){.faqs-layout{display:grid;grid-template-columns:260px 1fr;gap:clamp(2rem,4vw,3.4rem)}}
.faqs-nav__select{
  display:block;width:100%;margin-bottom:1.8rem;padding:.9rem 2.6rem .9rem 1.1rem;
  border-radius:var(--r-md);border:1px solid var(--line);background:var(--white);
  font-weight:700;font-size:.94rem;color:var(--teal-800);appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23073B42' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;background-size:16px;
}
@media(min-width:900px){.faqs-nav__select{display:none}}
.faqs-nav__list{display:none;list-style:none;padding:0;margin:0}
@media(min-width:900px){
  .faqs-nav__list{display:block;position:sticky;top:calc(var(--header-h,96px) + 24px)}
}
.faqs-nav__list li+li{margin-top:.15rem}
.faqs-nav__list a{
  display:block;padding:.7rem .95rem;border-radius:var(--r-md);font-weight:700;font-size:.9rem;
  color:var(--body);border-left:3px solid transparent;transition:background .2s,color .2s,border-color .2s;
}
.faqs-nav__list a:hover{background:var(--cream);color:var(--teal-700)}
.faqs-nav__list a.is-active{background:var(--teal-050);color:var(--teal-800);border-left-color:var(--gold-500)}
.faqs-cat{margin-bottom:clamp(2.6rem,5vw,3.6rem);scroll-margin-top:calc(var(--header-h,96px) + 20px)}
.faqs-cat:last-child{margin-bottom:0}
.faqs-cat .sec-head{margin-bottom:1.6rem}

/* ---------- Tour package: day-by-day itinerary ---------------------------- */
.itin{list-style:none;padding:0;margin:0;counter-reset:day}
.itin__day{
  position:relative;padding:0 0 2.2rem 3.2rem;border-left:2px solid var(--line);
}
.itin__day:last-child{border-left-color:transparent;padding-bottom:0}
.itin__day::before{
  counter-increment:day;content:"Day " counter(day);
  position:absolute;left:-.1rem;top:0;transform:translateX(-50%);
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700));color:#2B1500;
  font-weight:800;font-size:.7rem;letter-spacing:.03em;text-transform:uppercase;
  padding:.35rem .7rem;border-radius:999px;box-shadow:0 4px 10px rgba(0,0,0,.18);white-space:nowrap;
}
.itin__day h3{font-size:1.08rem;margin:0 0 .5rem}
.itin__day p{margin:0 0 .7rem;color:var(--muted);font-size:.95rem}
.itin__day p:last-of-type{margin-bottom:0}
.itin__meal{
  display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:700;
  color:var(--teal-700);background:var(--teal-050);padding:.3rem .7rem;border-radius:6px;
}

/* ---------- Tour package: overview + tariff tables ------------------------ */
.tbl-wrap{overflow-x:auto;margin-bottom:1.8rem;border-radius:var(--r-md);box-shadow:var(--sh-2)}
.tbl{width:100%;border-collapse:collapse;background:#fff;font-size:.92rem;min-width:480px}
.tbl caption{display:none}
.tbl th,.tbl td{padding:.85rem 1.1rem;text-align:left;border-bottom:1px solid var(--line)}
.tbl thead th{
  background:var(--teal-900);color:#fff;font-weight:700;font-size:.76rem;
  letter-spacing:.05em;text-transform:uppercase;
}
.tbl tbody tr:last-child td{border-bottom:0}
.tbl tbody tr:nth-child(even){background:var(--teal-050)}

/* ---------- Tour package: cancellation tiers ------------------------------ */
.tiers{display:grid;gap:1.2rem;grid-template-columns:1fr}
@media(min-width:820px){.tiers{grid-template-columns:repeat(3,1fr)}}
.tier{background:var(--neu-surface);box-shadow:var(--neu-raised-sm);border-radius:var(--r-md);padding:1.4rem 1.3rem}
.tier h3{font-size:1rem;margin:0 0 .8rem;color:var(--teal-900)}
.tier ul{list-style:none;padding:0;margin:0}
.tier li{font-size:.87rem;color:var(--muted);padding:.4rem 0;border-top:1px dashed var(--line)}
.tier li:first-child{border-top:0}
.tier li b{color:var(--teal-800)}

/* ---------- 12. Stat band ------------------------------------------------ */
.stats{display:grid;gap:1.4rem;grid-template-columns:repeat(2,1fr);text-align:center}
@media(min-width:900px){.stats{grid-template-columns:repeat(4,1fr)}}
.stat{
  padding:1.5rem 1rem;border-radius:var(--r-lg);background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.13);transition:transform .32s var(--ease),background .32s;
}
.stat:hover{transform:translateY(-6px);background:rgba(255,255,255,.11)}
.stat strong{display:block;font-family:var(--font-display);font-size:clamp(1.9rem,1.4rem + 1.6vw,2.7rem);color:var(--gold-400);line-height:1}
.stat span{display:block;margin-top:.45rem;font-size:.85rem;color:#A9C6C6;letter-spacing:.03em}

/* ---------- 13. Destination tiles — circular ring-framed photo badges ---------------------------------------- */
.tiles{
  display:grid;gap:2rem 1.2rem;grid-template-columns:repeat(2,1fr);
  justify-items:center;padding-top:.5rem;
}
@media(min-width:620px){.tiles{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1040px){.tiles{grid-template-columns:repeat(8,1fr);gap:1rem .9rem}}
.tile{
  display:flex;flex-direction:column;align-items:center;gap:.7rem;width:100%;max-width:150px;
  text-align:center;transition:transform .35s var(--ease);
}
.tile:hover{transform:translateY(-6px)}
.tile__ring{
  position:relative;display:block;width:100%;aspect-ratio:1;border-radius:50%;
  padding:6px;background:linear-gradient(150deg,var(--amber-500),var(--coral-600));
  box-shadow:var(--sh-2);transition:box-shadow .35s var(--ease);
}
.tile:hover .tile__ring{box-shadow:var(--sh-3)}
.tile__ring::before{
  content:'';position:absolute;inset:0;border-radius:50%;
  box-shadow:0 0 0 4px var(--cream);pointer-events:none;z-index:2;
}
.tile__ring img{
  display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;
  object-fit:cover;object-position:90% center;transition:transform .7s var(--ease);
}
.tile:hover .tile__ring img{transform:scale(1.1)}
@media(min-width:1040px){
  .tile--lg{max-width:172px;transform:translateY(-14px)}
  .tile--lg:hover{transform:translateY(-20px)}
}
.tile__label{font-family:var(--font-display);font-weight:700;font-size:.95rem;color:var(--teal-900)}

/* square-ish variant — rounded square instead of a circle, used where the
   circular tile pattern (homepage/destination hubs) would feel repetitive */
.tile--square .tile__ring{border-radius:var(--r-lg)}
.tile--square .tile__ring::before{border-radius:var(--r-lg);box-shadow:0 0 0 4px var(--cream)}
.tile--square .tile__ring img{border-radius:var(--r-md)}

/* ---------- 14. FAQ ------------------------------------------------------ */
.faq{max-width:840px;margin-inline:auto}
.faq__item{
  background:var(--neu-surface);border-radius:var(--r-lg);
  margin-bottom:.85rem;overflow:hidden;box-shadow:var(--neu-raised-sm);
  transition:box-shadow .3s var(--ease);
}
.faq__item:hover{box-shadow:var(--neu-raised)}
.faq__q{
  width:100%;background:none;border:0;text-align:left;cursor:pointer;
  padding:1.15rem 3.2rem 1.15rem 1.3rem;font-weight:700;font-size:1rem;color:var(--teal-900);
  position:relative;line-height:1.5;font-family:var(--font-body);
}
.faq__q::after,.faq__q::before{
  content:"";position:absolute;right:1.35rem;top:50%;background:var(--gold-600);
  border-radius:2px;transition:transform .3s var(--ease),opacity .3s;
}
.faq__q::before{width:14px;height:2px;transform:translateY(-50%)}
.faq__q::after{width:2px;height:14px;transform:translate(6px,-50%)}
.faq__q[aria-expanded="true"]::after{transform:translate(6px,-50%) rotate(90deg);opacity:0}
.faq__a{max-height:0;overflow:hidden;transition:max-height .38s var(--ease)}
.faq__a > div{padding:0 1.3rem 1.25rem;color:var(--muted);font-size:.95rem}
.faq__a p:last-child{margin-bottom:0}

/* ---------- 15. Forms ---------------------------------------------------- */
.form-row{display:flex;flex-direction:column;gap:.35rem}
.form-grid{display:grid;gap:.85rem}
@media(min-width:640px){.form-grid--2{grid-template-columns:1fr 1fr}}
label{font-size:.83rem;font-weight:700;color:var(--teal-800);letter-spacing:.01em}
label .req{color:#C0392B}
input,select,textarea{
  width:100%;padding:.82rem .95rem;border:0;border-radius:var(--r-md);
  background:var(--neu-surface);color:var(--ink);font-size:.95rem;
  box-shadow:var(--neu-inset);
  transition:box-shadow .22s;
}
input:focus,select:focus,textarea:focus{
  outline:none;box-shadow:var(--neu-inset),0 0 0 3px rgba(255,154,46,.3);
}
input::placeholder,textarea::placeholder{color:#9FAFB2}
textarea{min-height:118px;resize:vertical}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%230A5058' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.5rem;cursor:pointer}
.form-hint{font-size:.78rem;color:var(--muted)}
.form-error{color:#C0392B;font-size:.78rem;display:none}
.is-invalid input,.is-invalid select,.is-invalid textarea{border-color:#C0392B}
.is-invalid .form-error{display:block}
.form-consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.82rem;color:var(--muted);line-height:1.5}
.form-consent input{width:18px;height:18px;flex:none;margin-top:.15rem;accent-color:var(--amber-600)}

/* ---------- 16. Contact ------------------------------------------------- */
.contact-cards{display:grid;gap:1.1rem;grid-template-columns:1fr}
@media(min-width:640px){.contact-cards{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.contact-cards{grid-template-columns:repeat(4,1fr)}}
.ccard{
  background:var(--neu-surface);border-radius:var(--r-lg);
  padding:1.6rem 1.3rem;text-align:center;box-shadow:var(--neu-raised);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.ccard:hover{transform:translateY(-6px);box-shadow:var(--neu-raised-lg)}
.ccard__ico{
  width:56px;height:56px;margin:0 auto 1rem;border-radius:var(--r-md);display:grid;place-items:center;
  background:linear-gradient(135deg,var(--amber-500),var(--amber-700));
  box-shadow:3px 3px 8px rgba(180,80,5,.32),-3px -3px 8px rgba(255,205,140,.45);
}
.ccard__ico svg{width:24px;height:24px;stroke:#2B1500;fill:none;stroke-width:1.7}
.ccard h3{font-size:1rem;font-family:var(--font-body);font-weight:700;margin-bottom:.3rem}
.ccard p,.ccard a{font-size:.92rem;color:var(--muted);margin:0;line-height:1.6;text-align:center;text-align-last:center}
.ccard a{font-weight:700;color:var(--teal-700)}
.ccard a:hover{color:var(--gold-600)}

.map-frame{
  border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-3);border:1px solid var(--line);
  line-height:0;background:var(--teal-050);
}
.map-frame iframe{width:100%;height:420px;border:0;display:block}

.hours{list-style:none;margin:0;padding:0}
.hours li{
  display:flex;justify-content:space-between;gap:1rem;padding:.62rem 0;
  border-bottom:1px dashed var(--line);font-size:.92rem;
}
.hours li:last-child{border-bottom:0}
.hours strong{color:var(--teal-900);font-weight:700}

/* ---------- 17. Page hero (inner pages) ---------------------------------- */
.phero{
  position:relative;isolation:isolate;overflow:hidden;color:#fff;
  margin-top:calc(-1 * var(--header-h,96px));
  padding-block:calc(var(--header-h,96px) + clamp(3rem,7vw,5rem)) clamp(4.6rem,9vw,6rem);
  background:linear-gradient(135deg,#0A5058,#12868C 60%,#0A5058);
}
.phero__photo{
  position:absolute;inset:0;z-index:-2;width:100%;height:100%;
  object-fit:cover;object-position:92% center;transform:scale(1.32);
}
.phero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(100deg,rgba(4,38,43,1) 0%,rgba(4,38,43,.97) 46%,rgba(4,38,43,.5) 70%,rgba(4,38,43,.22) 100%),
    linear-gradient(0deg,rgba(4,38,43,.6),transparent 45%);
}
.phero .wrap{position:relative;z-index:3}
.phero h1{color:#fff;margin-bottom:.5rem}
.phero p{color:#CFE6E5;max-width:44rem;font-size:1.05rem;margin-bottom:0}
.crumbs{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;padding:0;margin:0 0 1.1rem;font-size:.82rem}
.crumbs li{color:#9FC2C1}
.crumbs li+li::before{content:"/";margin-right:.4rem;color:rgba(255,255,255,.4)}
.crumbs a{color:#DCEFEE}
.crumbs a:hover{color:var(--gold-400)}

/* ---------- 18. CTA band ------------------------------------------------- */
.cta-band{
  position:relative;overflow:hidden;color:#fff;text-align:center;
  background:linear-gradient(180deg,var(--teal-900),var(--teal-700) 55%,var(--teal-800));
  padding-block:clamp(1.8rem,3.2vw,2.6rem);
}
.cta-band::before{
  content:"";position:absolute;width:420px;height:420px;border-radius:50%;
  background:radial-gradient(circle,rgba(232,181,75,.16),transparent 68%);
  top:-160px;right:-100px;animation:bob 9s ease-in-out infinite;
}
.cta-band::after{
  content:"";position:absolute;width:340px;height:340px;border-radius:50%;
  bottom:-150px;left:-90px;animation:bob 11s ease-in-out infinite reverse;
}
.cta-band .wrap{position:relative;z-index:2}
.cta-band__doodle{
  position:absolute;z-index:1;pointer-events:none;
  width:min(30vw,360px);aspect-ratio:300/160;right:1vw;bottom:6%;
  -webkit-mask-image:var(--wire-airport);mask-image:var(--wire-airport);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center;
  background:rgba(255,255,255,.16);
}
@media(max-width:900px){.cta-band__doodle{display:none}}
.cta-band h2{color:#fff;max-width:24ch;margin-inline:auto}
.cta-band p{color:#CFE6E5;max-width:52ch;margin-inline:auto;margin-bottom:1.3rem}

/* ---------- 19. Footer --------------------------------------------------- */
.site-footer{
  position:relative;background:linear-gradient(180deg,var(--teal-800) 0%,#073B42 30%,#04262B 100%);
  color:#9FBCBC;font-size:.92rem;padding-top:clamp(5.4rem,10vw,7.4rem);
}
/* decorative line-art characters — fill quiet white space with a bit of travel personality */
.decor-char{position:absolute;z-index:1;pointer-events:none;bottom:0;height:auto;animation:bob 8s ease-in-out infinite}
.footer__char-row{display:flex;justify-content:flex-end;margin-top:.3rem;position:relative;z-index:2}
.footer__char{position:static;width:clamp(60px,5vw,80px);height:auto;opacity:.94;animation:bob 8s ease-in-out infinite}
.about__char{width:clamp(110px,10vw,150px);left:clamp(.5rem,3vw,3rem);bottom:0;opacity:.92}
.contact__char{width:clamp(110px,10vw,150px);right:clamp(.5rem,3vw,3rem);bottom:4.5rem;opacity:.92}
@media(max-width:900px){.footer__char-row,.about__char,.contact__char{display:none}}
/* botanical grass/leaf silhouette along the footer's top edge — colour-matched to the
   band above so there's no seam line where the two sections meet */
.footer__foliage{
  position:absolute;top:0;left:0;right:0;height:clamp(40px,6vw,68px);
  line-height:0;overflow:hidden;pointer-events:none;
}
.footer__foliage svg{display:block;width:100%;height:100%}
.footer__grid{display:grid;gap:2.2rem;position:relative;z-index:2}
@media(min-width:720px){
  .footer__grid{grid-template-columns:1.4fr 1fr 1fr}
  .footer__grid>div{position:relative;padding-left:2.2rem}
  .footer__grid>div:first-child{padding-left:0}
  .footer__grid>div:not(:first-child)::before{
    content:'';position:absolute;left:0;top:.2rem;bottom:.2rem;width:1px;
    background:linear-gradient(180deg,transparent,rgba(255,255,255,.16) 20%,rgba(255,255,255,.16) 80%,transparent);
  }
}
@media(min-width:1040px){.footer__grid{grid-template-columns:1.6fr 1fr 1fr 1.2fr}}
.site-footer h3{
  color:#fff;font-family:var(--font-body);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;
  padding-bottom:.75rem;margin-bottom:1.1rem;border-bottom:1px solid rgba(255,255,255,.14);
}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:.65rem}
.footer__links li{display:flex;align-items:center;gap:.55rem}
.footer__links li svg{width:13px;height:13px;flex:none;stroke:var(--amber-500);fill:none;stroke-width:2.4}
.site-footer a{color:#9FBCBC;transition:color .2s,transform .2s;display:inline-block}
.site-footer a:hover{color:var(--amber-400,#F5B15C);transform:translateX(3px)}
.site-footer .btn--gold,.site-footer .btn--gold:hover{color:#2B1500}
.site-footer .btn--teal,.site-footer .btn--teal:hover{color:#fff}
.site-footer .btn--outline,.site-footer .btn--outline:hover{color:var(--teal-800)}
.site-footer .btn:hover{transform:translateY(-3px)}
.footer__brand .brand__name{color:#fff}
/* real gold-on-black logo: screen blend drops the black on the dark footer */
.footer__logo{display:block;width:min(96px,34%);margin-bottom:.65rem}
.footer__brand p{margin:1rem 0 1.2rem;max-width:34ch;font-size:.9rem;line-height:1.7}
.footer__nap{list-style:none;padding:0;margin:0}
.footer__nap li{display:flex;gap:.65rem;align-items:flex-start;margin-bottom:.75rem;line-height:1.55}
.footer__nap svg{width:16px;height:16px;flex:none;margin-top:.25rem;stroke:var(--gold-400);fill:none;stroke-width:1.8}
.footer__bottom{
  border-top:1px solid rgba(255,255,255,.1);
  padding-block:1.4rem;display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;
  justify-content:space-between;align-items:center;font-size:.82rem;
}
.footer__bottom ul{display:flex;flex-wrap:wrap;gap:.4rem 1.1rem}
.footer__bottom li{margin:0}

/* ---------- 20. Floating actions ----------------------------------------- */
.float-actions{
  position:fixed;right:1rem;bottom:1rem;z-index:80;display:flex;flex-direction:column;gap:.6rem;
}
.float-actions--left{right:auto;left:1rem}
.fab{
  width:54px;height:54px;border-radius:var(--r-lg);display:grid;place-items:center;
  box-shadow:5px 5px 12px rgba(4,38,43,.32),-3px -3px 10px rgba(255,255,255,.4);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),opacity .3s var(--ease);position:relative;
}
.fab:hover{transform:scale(1.07) translateY(-2px);box-shadow:7px 7px 16px rgba(4,38,43,.36),-4px -4px 12px rgba(255,255,255,.45)}
.fab svg{width:26px;height:26px}
.fab--wa{background:linear-gradient(135deg,#3adf7a,#1DA851)}
.fab--call{background:linear-gradient(135deg,var(--amber-500),var(--amber-700))}
.fab--wa::after{
  content:"";position:absolute;inset:0;border-radius:var(--r-lg);border:2px solid #25D366;
  animation:pulse-ring 2.4s ease-out infinite;
}
@keyframes pulse-ring{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.6);opacity:0}}
@media(min-width:1000px){
  .float-actions{right:1.6rem;bottom:1.6rem}
  .float-actions--left{right:auto;left:1.6rem}
}

/* Scroll-to-top */
.fab--top{
  background:linear-gradient(155deg,#0E5A63,#04262B);
  opacity:0;pointer-events:none;transform:translateY(14px) scale(.85);
  transition:opacity .32s var(--ease),transform .32s var(--ease),box-shadow .3s;
  border:0;cursor:pointer;
}
.fab--top.is-visible{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}
.fab--top svg{stroke:var(--amber-400,#F5B15C);fill:none;stroke-width:2.4;width:22px;height:22px;
  animation:bob-arrow 1.8s ease-in-out infinite;}
@keyframes bob-arrow{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}

/* mobile sticky enquiry bar */
.mobile-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:79;display:flex;
  background:var(--white);border-top:1px solid var(--line);box-shadow:0 -6px 22px rgba(4,38,43,.14);
  transform:translateY(110%);transition:transform .35s var(--ease);
}
.mobile-bar.is-visible{transform:none}
.mobile-bar a{
  flex:1;padding:.9rem .5rem;text-align:center;font-weight:700;font-size:.88rem;
  display:flex;align-items:center;justify-content:center;gap:.4rem;color:var(--teal-800);
}
.mobile-bar a+a{border-left:1px solid var(--line)}
.mobile-bar a.is-primary{background:linear-gradient(135deg,var(--gold-400),var(--gold-600));color:#2B1B00}
.mobile-bar svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2}
@media(min-width:1000px){.mobile-bar{display:none}}
@media(max-width:999px){
  .float-actions{bottom:4.6rem}
  /* Reserve space for the fixed Call/Plan My Trip bar so it doesn't sit on
     top of (and hide) the footer's last row — the legal links (Privacy
     Policy, Terms & Conditions, Disclaimer, Tariff & Booking Policy). */
  body{padding-bottom:64px}
}

/* ---------- 21. Image placeholder (graceful fallback) -------------------- */
.ph{
  background:
    linear-gradient(135deg,rgba(4,38,43,.16),rgba(18,134,140,.16)),
    linear-gradient(140deg,var(--teal-500),var(--teal-800));
  display:grid;place-items:center;position:relative;overflow:hidden;
}
.ph::after{
  content:attr(data-label);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  color:rgba(255,255,255,.72);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  font-weight:700;text-align:center;padding:0 1rem;
}
img.is-missing{opacity:0}

/* ---------- 22. Reveal on scroll ---------------------------------------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
.reveal[data-delay="1"]{transition-delay:.09s}
.reveal[data-delay="2"]{transition-delay:.18s}
.reveal[data-delay="3"]{transition-delay:.27s}
.reveal[data-delay="4"]{transition-delay:.36s}

/* ---------- 23. Misc ----------------------------------------------------- */
.prose h2{margin-top:2.2rem}
.prose h3{margin-top:1.6rem}
.note{
  background:var(--neu-surface);border-left:4px solid var(--amber-500);border-radius:0 var(--r-md) var(--r-md) 0;
  padding:1.1rem 1.3rem;font-size:.94rem;color:var(--body);
  box-shadow:var(--neu-raised-sm);
}
.note p:last-child{margin-bottom:0}
.pill-list{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:0}
.pill-list li{
  background:var(--neu-surface);border-radius:var(--r-md);
  padding:.42rem .95rem;font-size:.85rem;font-weight:600;color:var(--teal-800);
  box-shadow:var(--neu-raised-sm);
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),color .25s;
}
.pill-list li:hover{transform:translateY(-3px);box-shadow:var(--neu-raised);color:var(--amber-700)}
.section--teal .pill-list li{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.16);color:#DCEFEE}
.divider-wave{display:block;width:100%;height:auto;color:var(--cream)}
