/* =========================================================
   NISH TRAVEL CONCIERGE — DESIGN TOKENS  (v2: premium pass)
   Navy #041B30 · Gold #CDA561 · Turquoise #31969B · Sand #F4EFE6
   Display: Fraunces · Body: Inter · Utility: Jost
========================================================= */
:root{
  --navy: #041B30;
  --navy-deep: #020E1A;
  --navy-mid: #0D2743;
  --gold: #CDA561;
  --gold-soft: #DEBE86;
  --gold-pale: #F0E1C4;
  --turquoise: #31969B;
  --turquoise-soft: #6FC0C3;
  --sand: #F6F2EA;
  --sand-deep: #EEE6D6;
  --white: #FFFFFF;
  --ink: #101B2D;
  --muted: #5B6779;
  --muted-2: #8B94A3;
  --line: rgba(4,27,48,0.10);

  --font-display: 'Fraunces', serif;
  --font-body: 'Inter', sans-serif;
  --font-utility: 'Jost', sans-serif;

  --radius-sm: 10px;
  --radius: 20px;
  --radius-lg: 28px;
  --shadow-soft: 0 24px 60px -24px rgba(2,14,26,0.28);
  --shadow-lift: 0 30px 70px -20px rgba(2,14,26,0.38);
  --shadow-card: 0 2px 4px rgba(2,14,26,0.04), 0 16px 40px -22px rgba(2,14,26,0.22);
  --ease: cubic-bezier(.16,.75,.24,1);
  --transition: 0.5s var(--ease);

  --gutter: clamp(24px, 5vw, 64px);
  --section-pad: clamp(88px, 11vw, 172px);

  --bg: var(--white);
  --bg-alt: var(--sand);
  --text: var(--ink);
}

[data-theme="dark"]{
  --bg: #071223;
  --bg-alt: #0C1D34;
  --text: #EDF1F7;
  --line: rgba(255,255,255,0.10);
  --muted: #A6B3C6;
  --muted-2: #7C8AA0;
  --white: #0C1D34;
}

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-body);
  font-size: 16.5px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  transition: background var(--transition), color var(--transition);
  overflow-x: hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family:inherit; cursor:pointer; }
.container{ max-width:1280px; margin:0 auto; padding:0 var(--gutter); }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}
:focus-visible{ outline: 2px solid var(--turquoise); outline-offset: 3px; border-radius:4px; }
::selection{ background: var(--gold-pale); color: var(--navy-deep); }

/* ---------- TYPOGRAPHY ---------- */
.eyebrow{
  font-family: var(--font-utility);
  text-transform: uppercase;
  letter-spacing: 0.26em;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--turquoise);
  margin: 0 0 16px;
  display:flex; align-items:center; gap:12px;
}
.eyebrow::before{ content:''; width:26px; height:1px; background: currentColor; opacity:0.6; }
.eyebrow.center{ justify-content:center; }
.eyebrow.center::before{ display:none; }
.eyebrow-light{ color: var(--gold-soft); }

.section-title{
  font-family: var(--font-display); font-weight: 500; font-optical-sizing: auto;
  font-size: clamp(2.2rem, 4.1vw, 3.4rem);
  line-height: 1.12; letter-spacing: -0.01em;
  margin: 0 0 22px; color: var(--navy);
}
[data-theme="dark"] .section-title{ color: var(--white); }
.section-title.light{ color: var(--white); }
.section-title.center{ text-align:center; max-width:700px; margin-left:auto; margin-right:auto; }
.lead{ font-size:1.14rem; color: var(--muted); max-width: 48ch; line-height:1.8; font-weight:300; }
.eyebrow{ margin: 0 0 20px; }

/* ---------- BOARDING STRIP ---------- */
.boarding-strip{ position:fixed; top:0; left:0; width:100%; height:3px; background: transparent; z-index:1000; }
.boarding-strip-fill{ height:100%; width:0%; background: linear-gradient(90deg, var(--turquoise), var(--gold)); transition: width 0.1s linear; }

/* ---------- HEADER / NAV ---------- */
.site-header{
  position: fixed; top:3px; left:0; width:100%; z-index:900;
  background: transparent;
  transition: background var(--transition), box-shadow var(--transition), padding var(--transition), border-color var(--transition);
  border-bottom: 1px solid transparent;
}
.site-header.scrolled{
  background: rgba(4,27,48,0.42);
  backdrop-filter: blur(22px) saturate(160%);
  -webkit-backdrop-filter: blur(22px) saturate(160%);
  border-bottom: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 12px 40px -20px rgba(2,14,26,0.5);
}
.nav-wrap{
  max-width:1280px; margin:0 auto; padding: 22px var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  transition: padding var(--transition);
}
.site-header.scrolled .nav-wrap{ padding-top:15px; padding-bottom:15px; }
.brand{ display:flex; align-items:center; gap:12px; font-family: var(--font-display); }
.brand-mark-img{ height:42px; width:auto; display:block; }
.brand-name{ color:#fff; font-size:1.08rem; letter-spacing:0.01em; }
.brand-name em{ font-style:normal; color: var(--gold-soft); display:block; font-size:0.6rem; letter-spacing:0.24em; text-transform:uppercase; font-family: var(--font-utility); margin-top:2px; }

.main-nav{ display:flex; gap:38px; }
.main-nav a{
  color:rgba(255,255,255,0.92); font-size:0.88rem; font-weight:500; letter-spacing:0.01em; position:relative; padding:6px 0;
}
.main-nav a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:1px; background: var(--gold-soft);
  transition: width var(--transition);
}
.main-nav a:hover{ color:#fff; }
.main-nav a:hover::after{ width:100%; }
.main-nav a.active{ color: var(--gold-soft); }
.main-nav a.active::after{ width:100%; background: var(--gold-soft); }

.nav-actions{ display:flex; align-items:center; gap:18px; }
.theme-toggle{
  width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,0.22);
  background:transparent; color:#fff; display:flex; align-items:center; justify-content:center;
  transition: background var(--transition), border-color var(--transition);
}
.theme-toggle:hover{ background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.4); }
.icon-moon{ display:none; }
[data-theme="dark"] .icon-sun{ display:none; }
[data-theme="dark"] .icon-moon{ display:block; }

.hamburger{ display:none; background:none; border:none; flex-direction:column; gap:5px; padding:6px; }
.hamburger span{ width:24px; height:1.5px; background:#fff; display:block; }

/* ---------- BUTTONS ---------- */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding: 16px 34px; border-radius: 999px; font-weight:600; font-size:0.88rem; letter-spacing:0.01em;
  border:1px solid transparent; transition: transform var(--transition), box-shadow var(--transition), background var(--transition), color var(--transition), border-color var(--transition);
  cursor:pointer; overflow:hidden;
}
.btn-gold{ background: linear-gradient(135deg, var(--gold-soft), var(--gold)); color: var(--navy-deep); box-shadow: 0 16px 34px -14px rgba(205,165,97,0.65); }
.btn-gold:hover{ transform: translateY(-3px); box-shadow: 0 22px 42px -14px rgba(205,165,97,0.8); }
.btn-outline-light{ border-color: rgba(255,255,255,0.4); color:#fff; }
.btn-outline-light:hover{ background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.7); transform: translateY(-3px); }
.btn-small{ padding:11px 22px; font-size:0.8rem; }
.btn-full{ width:100%; }
.btn-whatsapp{ background:#25D366; color:#fff; margin-bottom:28px; box-shadow: 0 16px 34px -16px rgba(37,211,102,0.6); }
.btn-whatsapp:hover{ transform: translateY(-3px); }
.btn-ghost-dark{ border:1px solid var(--line); color: var(--navy); }
.btn-ghost-dark:hover{ border-color: var(--turquoise); color: var(--turquoise); }

/* ---------- HERO ---------- */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:center;
  overflow:hidden; color:#fff;
}
.hero-media{ position:absolute; inset:0; z-index:0; }
.hero-slideshow{
  position:absolute; inset:-6%;
  animation: driftBg 40s ease-in-out infinite alternate;
}
@keyframes driftBg{ from{ transform: scale(1.02) translate(0,0);} to{ transform: scale(1.1) translate(-1.4%, -1%);} }
.hero-slide{
  position:absolute; inset:0; background-size:cover; background-position:center 38%;
  opacity:0; animation: heroFade 32s ease-in-out infinite;
}
.hero-slide:nth-child(1){ animation-delay: 0s; }
.hero-slide:nth-child(2){ animation-delay: 8s; }
.hero-slide:nth-child(3){ animation-delay: 16s; }
.hero-slide:nth-child(4){ animation-delay: 24s; }
@keyframes heroFade{
  0%{ opacity:0; }
  4%{ opacity:1; }
  22%{ opacity:1; }
  29%{ opacity:0; }
  100%{ opacity:0; }
}
.hero-scrim{ position:absolute; inset:0; background: linear-gradient(180deg, rgba(2,14,26,0.35) 0%, rgba(2,14,26,0.42) 40%, rgba(2,14,26,0.88) 100%); }

.flight-path{ position:absolute; inset:0; opacity:0.4; }
.flight-path svg{ width:100%; height:100%; }
#flightLine{ stroke-dashoffset:0; animation: dashMove 11s linear infinite; }
@keyframes dashMove{ to{ stroke-dashoffset: -140; } }
.plane-icon{
  position:absolute; top:38%; left:0; font-size:1.2rem; color: var(--gold-soft);
  transform: rotate(20deg); filter: drop-shadow(0 4px 10px rgba(0,0,0,0.4));
  animation: flyAcross 26s linear infinite;
}
@keyframes flyAcross{
  0%{ left:-5%; top:75%; transform:rotate(15deg) scale(0.9);}
  50%{ left:52%; top:18%; transform:rotate(-8deg) scale(1.1);}
  100%{ left:105%; top:45%; transform:rotate(10deg) scale(0.9);}
}

.hero-content{ position:relative; z-index:2; max-width:1280px; margin:0 auto; padding: 150px var(--gutter) 90px; width:100%; }
.eyebrow-light{ }
.hero-title{
  font-family: var(--font-display); font-weight:500; font-size: clamp(3.1rem, 7.4vw, 6.1rem);
  line-height:1.03; letter-spacing:-0.015em; margin: 0 0 26px; max-width:15ch;
  animation: riseIn 1.1s var(--ease) both;
  text-wrap: balance;
  text-shadow: 0 14px 50px rgba(0,0,0,0.4);
}
.hero-title span{ color: var(--gold-soft); font-style: italic; font-weight: 500; }
.hero-sub{ font-size:1.18rem; max-width:42ch; color: rgba(255,255,255,0.85); margin-bottom:44px; font-weight:300; animation: riseIn 1.1s 0.15s var(--ease) both; }
.hero-actions{ display:flex; gap:18px; flex-wrap:wrap; animation: riseIn 1.1s 0.3s var(--ease) both; }
@keyframes riseIn{ from{ opacity:0; transform: translateY(30px);} to{ opacity:1; transform:translateY(0);} }

.hero-actions .btn{ animation: floatBtn 4.5s ease-in-out infinite; }
.hero-actions .btn:nth-child(2){ animation-delay: -2.2s; }
.hero-actions .btn:hover{ animation-play-state: paused; }
@keyframes floatBtn{ 0%,100%{ transform: translateY(0); } 50%{ transform: translateY(-7px); } }

.hero-tag{
  margin-top: 64px; max-width: 300px; background: rgba(255,255,255,0.07);
  border:1px solid rgba(255,255,255,0.22); border-radius:16px; padding:20px 22px;
  backdrop-filter: blur(14px); position:relative; animation: riseIn 1.1s 0.45s var(--ease) both;
  box-shadow: var(--shadow-soft);
}
.tag-hole{ position:absolute; top:-8px; left:50%; transform:translateX(-50%); width:16px; height:16px; border-radius:50%; background: var(--navy-deep); border:1px solid rgba(255,255,255,0.3); }
.tag-row{ display:flex; justify-content:space-between; font-family:var(--font-utility); font-size:0.85rem; letter-spacing:0.06em; }
.tag-row span{ color: rgba(255,255,255,0.5); }
.tag-row strong{ color: var(--gold-soft); font-weight:600; }
.tag-dash{ text-align:center; font-size:0.7rem; color: rgba(255,255,255,0.35); margin: 8px 0; letter-spacing:0.1em; }

.scroll-cue{ position:absolute; bottom:34px; left:50%; transform:translateX(-50%); z-index:2; }
.scroll-cue span{ display:block; width:24px; height:38px; border:1.5px solid rgba(255,255,255,0.5); border-radius:14px; position:relative; }
.scroll-cue span::before{ content:''; position:absolute; top:7px; left:50%; width:4px; height:8px; background:#fff; border-radius:2px; transform:translateX(-50%); animation: scrollDot 1.8s ease-in-out infinite; }
@keyframes scrollDot{ 0%{ opacity:1; top:7px;} 100%{ opacity:0; top:20px;} }

/* ---------- WAVE DIVIDER ---------- */
.wave-divider{ position:relative; margin-top:-2px; line-height:0; z-index:2; }
.wave-divider svg{ width:100%; height:80px; display:block; }
.wave{ fill: var(--bg); }
.wave1{ opacity:0.55; animation: waveShift 10s ease-in-out infinite; }
.wave2{ animation: waveShift 13s ease-in-out infinite reverse; }
@keyframes waveShift{ 0%,100%{ transform: translateX(0);} 50%{ transform: translateX(-30px);} }

/* ---------- SECTION SPACING ---------- */
.section{ padding: var(--section-pad) 0; }
.section.about, .section.services{ background: var(--bg); }
.section.destinations, .section.downloads{ background: var(--bg-alt); }
.section.how{ background: var(--bg-alt); }
.lead.center{ text-align:center; margin:0 auto; }
.lead.light{ color: rgba(255,255,255,0.72); }

/* ---------- HOW IT WORKS ---------- */
.how-track{
  position:relative; margin-top:64px;
  display:grid; grid-template-columns: repeat(4,1fr); gap:32px;
}
.how-line{
  position:absolute; top:19px; left:calc(12.5% - 2px); right:calc(12.5% - 2px);
  height:1px; background-image: linear-gradient(90deg, var(--gold) 0, var(--gold) 6px, transparent 6px, transparent 14px);
  background-size: 14px 1px; background-repeat: repeat-x; opacity:0.55;
}
.how-step{ position:relative; text-align:left; }
.how-num{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%;
  background: var(--white); border:1px solid var(--gold);
  color: var(--gold); font-family: var(--font-display); font-size:0.95rem; font-weight:600;
  position:relative; z-index:1; margin-bottom:22px;
  box-shadow: var(--shadow-card);
}
.how-step h3{
  font-family: var(--font-display); font-weight:500; font-size:1.18rem;
  color: var(--navy); margin:0 0 10px; letter-spacing:-0.01em;
}
[data-theme="dark"] .how-step h3{ color: var(--white); }
.how-step p{ color: var(--muted); font-size:0.95rem; line-height:1.65; max-width:30ch; }

@media (max-width: 860px){
  .how-track{ grid-template-columns:1fr; gap:36px; }
  .how-line{ top:0; bottom:0; left:19px; right:auto; width:1px; height:auto;
    background-image: linear-gradient(180deg, var(--gold) 0, var(--gold) 6px, transparent 6px, transparent 14px);
    background-size: 1px 14px; background-repeat: repeat-y; }
  .how-step{ padding-left:60px; }
  .how-num{ position:absolute; left:0; top:0; margin-bottom:0; }
  .how-step p{ max-width:none; }
}

/* ---------- ABOUT ---------- */
.about-grid{ display:grid; grid-template-columns: 1.05fr 0.95fr; gap:96px; align-items:start; }
.about-specialties{ display:flex; flex-wrap:wrap; gap:11px; margin-top:32px; }
.about-specialties span{
  font-family: var(--font-utility); font-size:0.76rem; letter-spacing:0.04em;
  padding: 10px 18px; border-radius:999px; border:1px solid var(--line); color: var(--muted);
  transition: border-color var(--transition), color var(--transition);
}
.about-specialties span:hover{ border-color: var(--turquoise); color: var(--turquoise); }
.about-cards{ display:flex; flex-direction:column; gap:16px; }
.mvv-card{
  background: var(--bg-alt); border-radius: var(--radius); padding:30px 32px;
  border-left: 2px solid var(--turquoise); position:relative;
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}
.mvv-card:hover{ transform: translateX(8px); box-shadow: var(--shadow-card); border-color: var(--gold); }
.mvv-tag{ font-family: var(--font-utility); text-transform:uppercase; letter-spacing:0.16em; font-size:0.7rem; color: var(--gold); font-weight:600; }
.mvv-card p{ margin: 12px 0 0; color: var(--muted); font-size:0.96rem; line-height:1.7; }

/* ---------- SERVICES ---------- */
.services-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap:1px; margin-top:56px; background: var(--line); border:1px solid var(--line); border-radius: var(--radius); overflow:hidden; }
.service-card{
  background: var(--bg); padding: 38px 30px; transition: transform var(--transition), box-shadow var(--transition), background var(--transition); position:relative; z-index:1;
}
.service-card:hover{ transform: scale(1.02); box-shadow: var(--shadow-lift); z-index:2; background: var(--bg); }
.service-icon{ font-size:1.8rem; display:inline-flex; align-items:center; justify-content:center; width:52px; height:52px; margin-bottom:20px; border-radius:50%; background: var(--bg-alt); }
.service-card h3{ font-family: var(--font-display); font-weight:500; font-size:1.14rem; margin:0 0 10px; letter-spacing:-0.01em; }
.service-card p{ color: var(--muted); font-size:0.9rem; margin:0; line-height:1.6; }

/* ---------- DESTINATION CARDS (luggage-tag signature) ---------- */
.destination-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(300px,1fr)); gap:40px; margin-top:64px; }
.destination-card{
  position:relative; border-radius: var(--radius-lg); overflow:hidden; height:420px;
  display:flex; flex-direction:column; justify-content:flex-end; padding:32px;
  color:#fff; isolation:isolate; cursor:pointer;
  box-shadow: var(--shadow-card);
  transition: transform 0.9s cubic-bezier(.16,.75,.24,1), box-shadow 0.9s cubic-bezier(.16,.75,.24,1);
}
.destination-card:hover{ transform: translateY(-10px); box-shadow: var(--shadow-lift); }
.destination-card::after{
  content:''; position:absolute; inset:0; z-index:-1;
  background: linear-gradient(180deg, rgba(2,14,26,0.08) 12%, rgba(2,14,26,0.42) 55%, rgba(2,14,26,0.95) 100%);
  transition: background 0.9s ease;
}
.destination-card:hover::after{ background: linear-gradient(180deg, rgba(2,14,26,0.15) 12%, rgba(2,14,26,0.55) 55%, rgba(2,14,26,0.97) 100%); }
.destination-card h3{ text-shadow: 0 4px 20px rgba(0,0,0,0.35); }
.destination-tag-hole{ position:absolute; top:22px; right:22px; width:24px; height:24px; border-radius:50%; border:1.5px solid rgba(255,255,255,0.55); background: rgba(255,255,255,0.12); backdrop-filter: blur(4px); }
.destination-card h3{ font-family: var(--font-display); font-size:1.55rem; font-weight:500; margin:0 0 8px; letter-spacing:-0.01em; }
.destination-card p{ font-size:0.9rem; color: rgba(255,255,255,0.82); margin:0 0 18px; max-width:32ch; line-height:1.55; }
.destination-meta{ display:flex; align-items:center; justify-content:space-between; padding-top:16px; border-top:1px solid rgba(255,255,255,0.18); }
.destination-price{ font-family: var(--font-utility); font-size:0.76rem; color: rgba(255,255,255,0.6); letter-spacing:0.02em; }
.destination-price strong{ display:block; font-size:1.1rem; color: var(--gold-soft); font-family: var(--font-display); margin-top:2px; }
.explore-btn{
  font-family: var(--font-utility); font-size:0.74rem; letter-spacing:0.08em; text-transform:uppercase;
  color:#fff; border-bottom:1px solid var(--turquoise-soft); padding-bottom:3px; transition: color var(--transition), border-color var(--transition);
}
.explore-btn:hover{ color: var(--turquoise-soft); }

/* ---------- PACKAGES (premium booking-card signature) ---------- */
.packages-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(340px,1fr)); gap:40px; margin-top:64px; }
.package-card{
  background: var(--bg); border-radius: var(--radius-lg); box-shadow: var(--shadow-card);
  overflow:hidden; transition: transform 0.8s cubic-bezier(.16,.75,.24,1), box-shadow 0.8s cubic-bezier(.16,.75,.24,1);
  border:1px solid var(--line); display:flex; flex-direction:column;
}
.package-card:hover{ transform: translateY(-10px); box-shadow: var(--shadow-lift); }
.package-image{ position:relative; height:220px; overflow:hidden; }
.package-image img{ width:100%; height:100%; object-fit:cover; transition: transform 0.8s var(--ease); }
.package-card:hover .package-image img{ transform: scale(1.07); }
.package-badge{
  position:absolute; top:16px; left:16px; background: rgba(2,14,26,0.72); backdrop-filter: blur(6px);
  color:#fff; font-family: var(--font-utility); font-size:0.68rem; letter-spacing:0.08em; text-transform:uppercase;
  padding: 7px 14px; border-radius:999px; border:1px solid rgba(255,255,255,0.2);
}
.package-body{ padding:28px 28px 26px; flex:1; display:flex; flex-direction:column; }
.package-route{ display:flex; align-items:center; gap:10px; font-family: var(--font-utility); color: var(--muted-2); font-size:0.72rem; letter-spacing:0.08em; margin-bottom:14px; text-transform:uppercase; }
.package-route .code{ color: var(--navy); font-weight:600; }
[data-theme="dark"] .package-route .code{ color: var(--white); }
.package-route .plane{ color: var(--turquoise); }
.package-body h3{ font-family: var(--font-display); font-size:1.3rem; font-weight:500; margin:0 0 14px; letter-spacing:-0.01em; }
.package-features{ margin: 0 0 22px; padding:0; list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:8px 12px; }
.package-features li{ font-size:0.83rem; color: var(--muted); padding-left:16px; position:relative; }
.package-features li::before{ content:''; position:absolute; left:0; top:8px; width:5px; height:5px; border-radius:50%; background: var(--turquoise); }
.package-footer{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; padding-top:20px; border-top:1px dashed var(--line); }
.package-price{ font-family: var(--font-display); font-size:1.5rem; color: var(--navy); }
[data-theme="dark"] .package-price{ color: var(--white); }
.package-price small{ display:block; font-family: var(--font-utility); font-size:0.62rem; color: var(--muted-2); letter-spacing:0.06em; text-transform:uppercase; margin-top:2px; }

/* ---------- WHY CHOOSE US ---------- */
.section.why{ position:relative; background: var(--navy-deep); overflow:hidden; }
.section.why::before{
  content:''; position:absolute; inset:0; opacity:0.5;
  background-image: linear-gradient(180deg, rgba(2,14,26,0.85), rgba(2,14,26,0.94)), url('https://images.unsplash.com/photo-1488646953014-85cb44e25828?w=1800&q=70');
  background-size:cover; background-position:center;
}
.section.why::after{ content:''; position:absolute; inset:0; background: radial-gradient(circle at 85% 15%, rgba(49,150,155,0.22), transparent 45%); }
.section.why .container{ position:relative; z-index:1; }
.why-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(230px,1fr)); gap:22px; margin-top:60px; }
.why-item{
  display:flex; align-items:center; gap:16px; color:#fff; font-weight:500; font-size:0.98rem;
  background: rgba(255,255,255,0.045); border:1px solid rgba(255,255,255,0.12); border-radius:16px; padding:20px 22px;
  transition: background var(--transition), transform var(--transition), border-color var(--transition);
}
.why-item:hover{ background: rgba(255,255,255,0.09); transform: translateY(-6px); border-color: rgba(228,200,120,0.4); }
.why-item:hover span{ background: var(--gold-soft); color: var(--navy-deep); }
.why-item span{
  display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%;
  color: var(--navy-deep); background: var(--turquoise-soft); flex-shrink:0;
  transition: background var(--transition), color var(--transition);
}
.why-item span svg{ width:18px; height:18px; }

/* ---------- TRUST BADGES ---------- */
.section.trust-badges{ padding: 90px 0; background: var(--bg-alt); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.trust-badges-grid{ display:grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap:36px; }
.trust-badge{ text-align:center; padding:0 16px; }
.trust-icon{
  display:inline-flex; align-items:center; justify-content:center;
  width:48px; height:48px; border-radius:50%; margin-bottom:18px;
  background: var(--bg); border:1px solid var(--gold); color: var(--gold);
  font-size:1.2rem;
}
[data-theme="dark"] .trust-icon{ background: var(--navy-mid); }
.trust-badge h3{ font-family: var(--font-display); font-weight:500; font-size:1.05rem; margin:0 0 8px; color: var(--navy); letter-spacing:-0.01em; }
[data-theme="dark"] .trust-badge h3{ color: var(--white); }
.trust-badge p{ color: var(--muted); font-size:0.88rem; line-height:1.6; margin:0; }

/* ---------- FOUNDER'S NOTE ---------- */
.section.founder-note{ background: var(--bg); }
.founder-note-inner{ max-width:760px; margin:0 auto; text-align:center; }
.founder-quote{
  font-family: var(--font-display); font-style:italic; font-weight:400;
  font-size: clamp(1.15rem, 2vw, 1.4rem); line-height:1.7; color: var(--text);
  margin: 40px 0 32px;
}
.founder-sign{ font-family: var(--font-utility); font-weight:600; font-size:0.95rem; color: var(--navy); }
[data-theme="dark"] .founder-sign{ color: var(--white); }
.founder-sign span{ display:block; font-weight:500; font-size:0.76rem; letter-spacing:0.08em; text-transform:uppercase; color: var(--gold); margin-top:6px; }

/* ---------- STATS (legacy, unused) ---------- */
.section.stats{ padding: 90px 0; background: var(--bg-alt); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }

/* ---------- FINAL CTA BAND ---------- */
.cta-band{
  position:relative; overflow:hidden; padding: 140px 0;
  background-size:cover; background-position:center; background-attachment: fixed;
}
.cta-band::before{
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(2,14,26,0.72) 0%, rgba(2,14,26,0.6) 45%, rgba(2,14,26,0.85) 100%);
}
.cta-band::after{
  content:''; position:absolute; inset:0;
  background: radial-gradient(circle at 15% 20%, rgba(205,165,97,0.16), transparent 45%),
              radial-gradient(circle at 85% 80%, rgba(49,150,155,0.18), transparent 45%);
}
.cta-band-inner{ position:relative; z-index:1; text-align:center; }
.cta-band-inner h2{
  font-family: var(--font-display); font-weight:500; color: var(--white);
  font-size: clamp(2.4rem, 4.6vw, 3.6rem); margin:0 0 18px; letter-spacing:-0.015em; line-height:1.08;
  text-shadow: 0 10px 40px rgba(0,0,0,0.4);
}
.cta-band-inner p{ color: rgba(255,255,255,0.75); margin:0 0 36px; font-size:1.1rem; }
@media (max-width: 800px){ .cta-band{ background-attachment: scroll; padding:110px 0; } }
.stats-grid{ display:grid; grid-template-columns: repeat(auto-fit,minmax(190px,1fr)); gap:30px; text-align:center; }
.stat{ padding: 0 20px; position:relative; }
.stat:not(:last-child)::after{ content:''; position:absolute; right:0; top:10%; height:80%; width:1px; background: var(--line); }
.stat-num{ font-family: var(--font-display); font-size: clamp(2.2rem,4vw,3.2rem); color: var(--navy); font-weight:600; letter-spacing:-0.02em; }
[data-theme="dark"] .stat-num{ color: var(--gold-soft); }
.stat p{ font-family: var(--font-utility); letter-spacing:0.08em; color: var(--muted); margin:8px 0 0; font-size:0.78rem; text-transform:uppercase; }

/* ---------- DOWNLOADS ---------- */
.downloads-grid{ display:grid; grid-template-columns: repeat(auto-fit,minmax(270px,1fr)); gap:26px; margin-top:64px; }
.download-card{
  display:flex; align-items:flex-start; gap:18px; background: var(--bg); border-radius: var(--radius); padding:28px;
  border:1px solid var(--line); transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}
.download-card:hover{ transform: translateY(-6px); box-shadow: var(--shadow-card); border-color: var(--gold); }
.download-card span{ font-size:1.5rem; flex-shrink:0; width:52px; height:52px; border-radius:50%; background: var(--bg-alt); display:flex; align-items:center; justify-content:center; }
.download-card h3{ font-family: var(--font-display); font-weight:500; font-size:1.05rem; margin:0 0 6px; letter-spacing:-0.01em; }
.download-card p{ color: var(--muted); font-size:0.87rem; margin:0; line-height:1.55; }

/* ---------- TESTIMONIALS ---------- */
.testimonials{ position:relative; background: var(--navy-deep); overflow:hidden; }
.testimonials::before{
  content:''; position:absolute; inset:0;
  background: radial-gradient(circle at 12% 12%, rgba(205,165,97,0.18), transparent 42%),
              radial-gradient(circle at 88% 85%, rgba(49,150,155,0.22), transparent 42%);
}
.testimonials .container{ position:relative; z-index:1; }
.testimonial-slider{ position:relative; max-width:800px; margin: 60px auto 0; overflow:hidden; }
.testimonial-track{ display:flex; transition: transform 0.8s var(--ease); }
.testimonial-card{
  flex: 0 0 100%; background: rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.16);
  backdrop-filter: blur(20px) saturate(140%); -webkit-backdrop-filter: blur(20px) saturate(140%);
  border-radius: var(--radius-lg); padding: 60px 48px; text-align:center; position:relative;
  box-shadow: var(--shadow-soft);
}
.testimonial-card::before{
  content:'“'; position:absolute; top:18px; left:50%; transform:translateX(-50%); font-family: var(--font-display);
  font-size:5rem; color: rgba(228,200,120,0.35); line-height:1; z-index:0;
}
.testimonial-avatar{
  width:68px; height:68px; border-radius:50%; margin:0 auto 18px; background: var(--navy);
  display:flex; align-items:center; justify-content:center; color:#fff; font-family:var(--font-display); font-size:1.3rem;
  position:relative; z-index:1; overflow:hidden; border:2px solid rgba(228,200,120,0.5);
}
.testimonial-avatar img{ width:100%; height:100%; object-fit:cover; }
.testimonial-stars{ color: var(--gold-soft); letter-spacing:3px; margin-bottom:16px; position:relative; z-index:1; }
.testimonial-quote{ font-family: var(--font-display); font-weight:400; font-size:1.32rem; font-style:italic; color:#fff; margin:0 0 20px; line-height:1.55; position:relative; z-index:1; }
.testimonial-name{ font-family: var(--font-utility); font-weight:600; font-size:0.86rem; letter-spacing:0.02em; color:#fff; }
.testimonial-loc{ color: rgba(255,255,255,0.55); font-size:0.8rem; }
.testimonial-dots{ display:flex; justify-content:center; gap:9px; margin-top:30px; }
.testimonial-dots button{ width:8px; height:8px; border-radius:50%; border:none; background: rgba(255,255,255,0.25); transition: background var(--transition), transform var(--transition); }
.testimonial-dots button.active{ background: var(--gold-soft); transform: scale(1.3); }

/* ---------- CONTACT ---------- */
.section.contact{ position:relative; background: var(--navy-deep); overflow:hidden; }
.section.contact::before{ content:''; position:absolute; inset:0; background: radial-gradient(circle at 10% 90%, rgba(205,165,97,0.14), transparent 40%); }
.section.contact .container{ position:relative; z-index:1; }
.contact-grid{ display:grid; grid-template-columns: 0.85fr 1.15fr; gap:70px; align-items:start; }
.contact-list{ margin: 28px 0 32px; }
.contact-list li{ display:flex; gap:18px; padding:16px 0; border-bottom:1px solid rgba(255,255,255,0.08); color:#fff; }
.contact-list li span{ width:72px; flex-shrink:0; color: var(--gold-soft); font-family:var(--font-utility); font-size:0.76rem; letter-spacing:0.08em; text-transform:uppercase; padding-top:2px; }
.contact-list li a{ font-size:0.98rem; transition: color var(--transition); }
.contact-list li a[href]:hover{ color: var(--turquoise-soft); }
.map-placeholder{
  height:190px; border-radius: var(--radius); border:1px dashed rgba(255,255,255,0.22);
  display:flex; align-items:center; justify-content:center; color: rgba(255,255,255,0.45); font-size:0.85rem;
  background: repeating-linear-gradient(45deg, rgba(255,255,255,0.02), rgba(255,255,255,0.02) 10px, transparent 10px, transparent 20px);
}
.contact-form{ background: rgba(255,255,255,0.045); border:1px solid rgba(255,255,255,0.12); border-radius: var(--radius-lg); padding:40px; backdrop-filter: blur(8px); box-shadow: var(--shadow-soft); }
.honeypot-field{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.contact-form label{ display:block; color: rgba(255,255,255,0.7); font-size:0.78rem; margin-bottom:18px; font-family: var(--font-utility); letter-spacing:0.04em; text-transform:uppercase; }
.contact-form input, .contact-form select, .contact-form textarea{
  width:100%; margin-top:9px; padding:13px 15px; border-radius:10px; border:1px solid rgba(255,255,255,0.16);
  background: rgba(255,255,255,0.05); color:#fff; font-family: var(--font-body); font-size:0.94rem; resize:vertical;
  transition: border-color var(--transition), background var(--transition);
}
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus{ outline:none; border-color: var(--turquoise); background: rgba(255,255,255,0.08); }
.contact-form select option{ background-color: var(--navy-mid); color:#fff; }
.form-note{ color: var(--turquoise-soft); font-size:0.85rem; min-height:1.2em; margin: 14px 0 0; }

/* ---------- FOOTER ---------- */
.site-footer{ background: var(--navy-deep); color: rgba(255,255,255,0.72); padding: 92px 0 0; }
.footer-grid{ display:grid; grid-template-columns: 1.2fr 1fr 1fr 1.2fr; gap:48px; padding-bottom:58px; }
.footer-divider{ max-width:1280px; margin:0 auto; height:1px; background: linear-gradient(90deg, transparent, rgba(205,165,97,0.6) 50%, transparent); }
.footer-logo-img{ height:96px; width:auto; display:block; }
.footer-brand .tagline{ color: var(--gold-soft); font-family: var(--font-utility); font-size:0.74rem; letter-spacing:0.18em; text-transform:uppercase; margin-top:14px; }
.footer-col h4{ font-family: var(--font-utility); font-size:0.78rem; text-transform:uppercase; letter-spacing:0.12em; color:#fff; margin:0 0 20px; }
.footer-col a{ display:block; margin-bottom:11px; font-size:0.88rem; transition: color var(--transition), transform var(--transition); }
.footer-col a:hover{ color: var(--turquoise-soft); }
.newsletter-form{ display:flex; gap:8px; margin-bottom:18px; }
.newsletter-form input{ flex:1; padding:11px 13px; border-radius:8px; border:1px solid rgba(255,255,255,0.18); background: rgba(255,255,255,0.05); color:#fff; }
.newsletter-form button{ background: var(--gold); border:none; border-radius:8px; padding:0 18px; font-weight:600; color: var(--navy-deep); transition: background var(--transition); }
.newsletter-form button:hover{ background: var(--gold-soft); }
.social-row{ display:flex; gap:10px; }
.social-row a{ width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; color:rgba(255,255,255,0.75); transition: border-color var(--transition), color var(--transition), transform var(--transition); }
.social-row a svg{ width:16px; height:16px; }
.social-row a:hover{ border-color: var(--gold-soft); color: var(--gold-soft); transform: translateY(-3px); }
.footer-bottom{ text-align:center; padding:26px 0; font-size:0.8rem; color: rgba(255,255,255,0.42); }

/* ---------- FLOATING BUTTONS ---------- */
.float-btn{
  position:fixed; right:26px; width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; box-shadow: 0 14px 30px -12px rgba(0,0,0,0.42); z-index:850; border:none; transition: transform var(--transition), opacity var(--transition);
}
.float-whatsapp{ bottom:26px; background:#25D366; color:#fff; animation: pulse 4s ease-in-out infinite; }
.float-top{ bottom:92px; background: var(--navy); color:#fff; opacity:0; pointer-events:none; }
.float-top.visible{ opacity:1; pointer-events:auto; }
.float-btn:hover{ transform: translateY(-4px) scale(1.06); }
@keyframes pulse{ 0%,100%{ box-shadow: 0 0 0 0 rgba(37,211,102,0.3);} 50%{ box-shadow: 0 0 0 8px rgba(37,211,102,0);} }

/* ---------- CHATBOT ---------- */
.chatbot{ position:fixed; left:26px; bottom:26px; z-index:850; }
.chatbot-toggle{
  width:58px; height:58px; border-radius:50%; border:none; background: linear-gradient(135deg, var(--turquoise), var(--navy));
  color:#fff; font-size:1.4rem; box-shadow: var(--shadow-soft);
}
.chatbot-toggle-icon{ display:inline-block; animation: spinSlow 7s linear infinite; }
@keyframes spinSlow{ to{ transform: rotate(360deg);} }
.chatbot-window{
  position:absolute; bottom:74px; left:0; width:330px; max-width:85vw; background: var(--bg);
  border-radius: 20px; box-shadow: var(--shadow-lift); border:1px solid var(--line);
  display:none; flex-direction:column; overflow:hidden;
}
.chatbot-window.open{ display:flex; animation: riseIn 0.4s var(--ease) both; }
.chatbot-header{ background: var(--navy); color:#fff; padding:18px 20px; display:flex; justify-content:space-between; align-items:center; }
.chatbot-header small{ display:block; color: rgba(255,255,255,0.55); font-size:0.72rem; margin-top:2px; }
.chatbot-header button{ background:none; border:none; color:#fff; font-size:1.3rem; }
.chatbot-body{ padding:20px; max-height:360px; overflow-y:auto; }
.chat-bubble{ background: var(--bg-alt); padding:13px 15px; border-radius:14px; font-size:0.88rem; margin-bottom:14px; line-height:1.5; }
.chat-options{ display:flex; flex-direction:column; gap:9px; }
.chat-options button{
  text-align:left; background:none; border:1px solid var(--line); border-radius:10px; padding:11px 13px;
  font-size:0.84rem; color: var(--text); transition: border-color var(--transition), background var(--transition), transform var(--transition);
}
.chat-options button:hover{ border-color: var(--turquoise); background: var(--bg-alt); transform: translateX(3px); }

/* ---------- SCROLL REVEAL ---------- */
.reveal{ opacity:0; transform: translateY(36px); transition: opacity 1.1s var(--ease), transform 1.1s var(--ease); }
.reveal.in-view{ opacity:1; transform:translateY(0); }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 980px){
  .about-grid, .contact-grid{ grid-template-columns:1fr; gap:50px; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .stat:nth-child(2)::after{ display:none; }
}
@media (max-width: 800px){
  .main-nav, .nav-actions .btn-small{ display:none; }
  .hamburger{ display:flex; }
  .main-nav.open{
    display:flex; flex-direction:column; position:absolute; top:100%; left:0; width:100%;
    background: var(--navy-deep); padding:26px var(--gutter); gap:20px; border-top:1px solid rgba(255,255,255,0.08);
  }
  .form-row{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; }
  .stat::after{ display:none; }
  .package-features{ grid-template-columns:1fr; }
}
@media (max-width: 480px){
  .hero-content{ padding-top:130px; }
  .contact-form{ padding:28px; }
  .testimonial-card{ padding:44px 26px; }
  .cta-band{ padding:88px 0; }
}