/*
Theme Name: Beast of Africa — Remaster Preview
Author: Beast of Africa
Version: 5.0 — Cinematic Platform Remaster
Description: Environmental immersive platform. Rainforest greens, volcanic earth, glacier blues.
*/

/* ══ 1. ENVIRONMENTAL COLOR SYSTEM ══ */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&family=Jost:wght@200;300;400;500;600&display=swap");

:root {
  /* ── Environmental Palette ── */
  --forest:      #17352c;
  --deep-forest: #10241d;
  --earth:       #4b3a2f;
  --sand:        #c8b28a;
  --mist:        #dce6e3;
  --ice:         #d8f1ff;
  --sky:         #7cb7d6;
  --volcanic:    #1d1c1a;
  --surface:     #0d1615;
  --surface-2:   #142321;

  /* ── Text ── */
  --text:        #eef5f2;
  --text-bright: #ffffff;
  --muted:       rgba(238,245,242,.65);
  --faint:       rgba(238,245,242,.35);

  /* ── Accent system ── */
  --gold:        #c8b28a;
  --gold2:       #d4c09e;
  --gold-dim:    rgba(200,178,138,.12);
  --gold-border: rgba(200,178,138,.18);
  --green-glow:  rgba(23,53,44,.6);
  --sky-glow:    rgba(124,183,214,.15);

  /* ── Surfaces ── */
  --glass:       rgba(13,22,21,.78);
  --glass-2:     rgba(20,35,33,.85);
  --border:      rgba(238,245,242,.08);
  --border-gold: rgba(200,178,138,.15);

  /* ── Shadows ── */
  --shadow-sm:   0 8px 28px  rgba(0,0,0,.35);
  --shadow-md:   0 20px 56px rgba(0,0,0,.45);
  --shadow-lg:   0 36px 90px rgba(0,0,0,.55);

  /* ── Easing ── */
  --ease:        cubic-bezier(.16,1,.3,1);
  --ease-out:    cubic-bezier(.25,.46,.45,.94);
  --ease-elastic:cubic-bezier(.34,1.56,.64,1);

  /* ── Typography ── */
  --font-serif:  "Cormorant Garamond", Georgia, serif;
  --font-body:   "Jost", "Helvetica Neue", sans-serif;

  /* ── Spacing ── */
  --sp-xs:  clamp(.5rem, 1vw,   .75rem);
  --sp-sm:  clamp(1rem,  2vw,   1.5rem);
  --sp-md:  clamp(2rem,  4vw,   3rem);
  --sp-lg:  clamp(3.5rem,7vw,   6rem);
  --sp-xl:  clamp(5rem,  10vw,  9rem);

  /* ── Layout ── */
  --contain:   1380px;
  --gutter:    clamp(1.25rem, 5%, 4rem);
  --headerH:   68px; /* legacy compat — use --hdr-main for header height */

  /* ── Compat aliases ── */
  --bg:         var(--surface);
  --bg-alt:     var(--surface-2);
  --bg-card:    var(--glass);
  --ink:        var(--text);
  --accent:     var(--gold);
}

/* ══ 2. RESET + BASE ══ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px;-webkit-text-size-adjust:100%}
body{
  font-family:var(--font-body);
  color:var(--text);
  background-color:var(--surface);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  min-height:100vh;
}
a{text-decoration:none;color:inherit}
ul{list-style:none;padding:0}
img,video{display:block;max-width:100%}
main{display:block;padding-top:var(--hdr-total,var(--headerH,100px))}
body.is-homepage main,body.is-enquire main{padding-top:0}

/* ══ 3. TYPOGRAPHY ══ */
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-serif);
  color:var(--text);
  line-height:1.05;
  font-weight:300;
}
p{color:var(--muted);line-height:1.85}

/* ══ 4. SCROLLBAR ══ */
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:var(--surface)}
::-webkit-scrollbar-thumb{background:rgba(200,178,138,.45);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--gold)}

/* ══ 5. FILM GRAIN ══ */
body::after{
  content:"";
  position:fixed;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size:128px;
  opacity:.024;
  pointer-events:none;
  z-index:9999;
  animation:grain .12s steps(1) infinite;
  will-change:background-position;
}
@keyframes grain{
  0%  {background-position:0 0}     20%{background-position:-5% -10%}
  40% {background-position:-15% 5%} 60%{background-position:7% -25%}
  80% {background-position:-5% 25%} 100%{background-position:15% 0}
}

/* ══ 6. SCROLL PROGRESS ══ */
.scroll-progress{
  position:fixed;top:0;left:0;z-index:9998;
  height:2px;width:0%;
  background:linear-gradient(90deg,var(--gold),rgba(124,183,214,.8));
  transition:width .1s linear;
  will-change:width;
}

/* ══ 7. REVEAL ══ */
.animate{
  opacity:0;
  transform:translate3d(0,28px,0);
  transition:opacity .85s var(--ease),transform .85s var(--ease);
  will-change:opacity,transform;
}
.animate.visible{opacity:1;transform:translate3d(0,0,0)}

/* ══ 8. GLASS COMPONENT ══ */
.glass{
  background:var(--glass);
  backdrop-filter:blur(24px) saturate(1.6);
  -webkit-backdrop-filter:blur(24px) saturate(1.6);
  border:1px solid var(--border-gold);
  border-radius:16px;
}

/* ═══════════════════════════════════════
   9. HEADER — CINEMATIC FLOATING
═══════════════════════════════════════ */

/* ════════════════════════════════════════════════════════
   HEADER v7.0 — CINEMATIC EDITORIAL
   Two layers: topbar + glass main band
   Perfect at all widths. Best header ever.
════════════════════════════════════════════════════════ */

/* ── Variables ── */
:root {
  --hdr-topbar: 32px;
  --hdr-main:   68px;
  --hdr-total:  100px;
  --hdr-ease:   cubic-bezier(.22,1,.36,1);
  --hdr-scrolled-main: 60px;
}

/* ── Outer shell ── */
.boa-header {
  position: fixed; inset-inline: 0; top: 0; z-index: 1000;
  display: flex; flex-direction: column;
}

/* ════════════════
   TOP BAR
════════════════ */
.boa-topbar {
  height: var(--hdr-topbar);
  background: rgba(8,14,12,.98);
  border-bottom: 1px solid rgba(200,178,138,.07);
  overflow: hidden;
  transition: height .45s var(--hdr-ease), opacity .35s;
  will-change: height, opacity;
}
.boa-header.scrolled .boa-topbar {
  height: 0; opacity: 0; pointer-events: none;
}
.boa-topbar__inner {
  display: flex; align-items: center; justify-content: space-between;
  height: 100%;
  max-width: var(--contain); margin: 0 auto; padding: 0 var(--gutter);
}
.boa-topbar__left {
  display: flex; align-items: center; gap: .6rem;
}
.boa-topbar__pulse {
  width: 5px; height: 5px; border-radius: 50%;
  background: rgba(55,200,120,.9);
  animation: tpulse 2.5s ease-in-out infinite;
  flex-shrink: 0;
}
@keyframes tpulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.15;transform:scale(.45)} }
.boa-topbar__tagline {
  font-family: var(--font-body); font-size: .58rem;
  letter-spacing: .22em; text-transform: uppercase;
  color: rgba(238,245,242,.32);
}
.boa-topbar__right {
  display: flex; align-items: center; gap: .75rem;
}
.boa-topbar__link {
  display: inline-flex; align-items: center; gap: .35rem;
  font-family: var(--font-body); font-size: .62rem;
  color: rgba(238,245,242,.38); text-decoration: none;
  letter-spacing: .04em;
  transition: color .3s;
}
.boa-topbar__link:hover { color: rgba(200,178,138,.75); }
.boa-topbar__sep {
  width: 1px; height: 10px;
  background: rgba(200,178,138,.15);
}
.boa-topbar__wa {
  display: inline-flex; align-items: center; gap: .35rem;
  font-family: var(--font-body); font-size: .62rem;
  color: rgba(55,180,120,.65); text-decoration: none;
  letter-spacing: .04em; transition: color .3s;
}
.boa-topbar__wa:hover { color: rgba(55,200,120,.9); }

/* ════════════════
   MAIN BAND
════════════════ */
.boa-header__main {
  height: var(--hdr-main);
  position: relative;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition:
    background .5s var(--hdr-ease),
    height .45s var(--hdr-ease),
    border-color .5s,
    box-shadow .5s;
}

/* Gradient overlay (only on transparent state — hero pages) */
.boa-header__main::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(13,22,21,.55) 0%, transparent 100%);
  pointer-events: none;
  transition: opacity .45s var(--hdr-ease);
}
.boa-header.scrolled .boa-header__main::before { opacity: 0; }

/* Scrolled state */
.boa-header.scrolled .boa-header__main {
  height: var(--hdr-scrolled-main);
  background: rgba(8,14,12,.94);
  backdrop-filter: blur(28px) saturate(1.8);
  -webkit-backdrop-filter: blur(28px) saturate(1.8);
  border-bottom-color: rgba(200,178,138,.1);
  box-shadow: 0 1px 0 rgba(200,178,138,.06), 0 12px 40px rgba(0,0,0,.4);
}

/* Inner flex row */
.boa-header__inner {
  display: flex; align-items: center;
  height: 100%;
  max-width: var(--contain); margin: 0 auto; padding: 0 var(--gutter);
  gap: 0;
}

/* ════════════════
   BRAND
════════════════ */
.boa-brand {
  display: flex; align-items: center; gap: .85rem;
  text-decoration: none; flex-shrink: 0;
  margin-right: auto; /* pushes nav + actions to right */
}
.boa-brand__mark {
  position: relative; flex-shrink: 0;
}
.boa-brand__mark img {
  width: 44px; height: 44px; border-radius: 50%;
  object-fit: cover; display: block; position: relative; z-index: 1;
  box-shadow: 0 0 0 1.5px rgba(200,178,138,.22), 0 4px 16px rgba(0,0,0,.45);
  transition: transform .5s var(--hdr-ease), box-shadow .5s;
}
.boa-brand:hover .boa-brand__mark img {
  transform: scale(1.07);
  box-shadow: 0 0 0 2px rgba(200,178,138,.4), 0 6px 22px rgba(0,0,0,.5);
}
.boa-header.scrolled .boa-brand__mark img { width: 36px; height: 36px; }
.boa-brand__ring {
  position: absolute; inset: -3px; border-radius: 50%;
  background: conic-gradient(from 0deg,transparent 0deg,rgba(23,53,44,.9) 100deg,rgba(200,178,138,.35) 180deg,transparent 250deg);
  opacity: 0; animation: ringRot 4s linear infinite paused;
  transition: opacity .5s;
}
.boa-brand:hover .boa-brand__ring { opacity: 1; animation-play-state: running; }
@keyframes ringRot { to { transform: rotate(360deg); } }

.boa-brand__copy { display: flex; flex-direction: column; gap: .05rem; }
.boa-brand__name {
  font-family: var(--font-serif); font-size: 1.32rem; font-weight: 300;
  color: var(--text); line-height: 1.05; letter-spacing: .01em;
  transition: font-size .45s var(--hdr-ease);
}
.boa-brand__name em {
  font-style: italic;
  background: linear-gradient(90deg,var(--gold),var(--gold2) 35%,rgba(238,245,242,.9) 55%,var(--gold));
  background-size: 200% auto;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  animation: nameShimmer 5s linear infinite;
}
@keyframes nameShimmer { to { background-position: 200% center; } }
.boa-brand__sub {
  font-family: var(--font-body); font-size: .54rem;
  letter-spacing: .22em; text-transform: uppercase;
  color: rgba(238,245,242,.28);
  transition: opacity .4s, font-size .45s;
}
.boa-header.scrolled .boa-brand__sub { opacity: 0; }
.boa-header.scrolled .boa-brand__name { font-size: 1.12rem; }

/* ════════════════
   DESKTOP NAV
════════════════ */
.boa-nav {
  display: flex; align-items: center;
  margin: 0 clamp(.75rem,2vw,2.5rem);
}
.boa-nav__list {
  display: flex; align-items: center; gap: 0;
  list-style: none; margin: 0; padding: 0;
}
.boa-nav__item { position: relative; }
.boa-nav__link {
  position: relative; display: flex; align-items: center;
  padding: .52rem .78rem;
  font-family: var(--font-body); font-size: .76rem; font-weight: 400;
  color: rgba(238,245,242,.52); letter-spacing: .06em;
  text-decoration: none; border-radius: 7px; white-space: nowrap;
  transition: color .3s var(--hdr-ease), background .3s;
}
.boa-nav__link:hover {
  color: rgba(238,245,242,.9);
  background: rgba(23,53,44,.45);
}
.boa-nav__link.is-active { color: var(--gold); }

/* Animated underline */
.boa-nav__underline {
  position: absolute; bottom: 3px; left: 50%; transform: translateX(-50%);
  height: 1px; width: 0;
  background: linear-gradient(90deg,transparent,var(--gold),transparent);
  transition: width .38s var(--hdr-ease);
  pointer-events: none;
}
.boa-nav__link:hover .boa-nav__underline,
.boa-nav__link.is-active .boa-nav__underline {
  width: calc(100% - 1.25rem);
}
.boa-nav__link.is-active .boa-nav__underline {
  background: var(--gold);
}

/* ════════════════
   ACTIONS (right cluster)
════════════════ */
.boa-actions {
  display: flex; align-items: center; gap: .55rem; flex-shrink: 0;
}

/* WhatsApp pill */
.boa-act-wa {
  display: inline-flex; align-items: center; gap: .42rem;
  padding: .44rem .88rem;
  border: 1px solid rgba(55,180,120,.22); border-radius: 999px;
  font-family: var(--font-body); font-size: .7rem; font-weight: 500;
  color: rgba(55,180,120,.75); text-decoration: none; letter-spacing: .05em;
  transition: all .3s var(--hdr-ease);
}
.boa-act-wa:hover {
  color: #2bdb6e; border-color: rgba(55,180,120,.55);
  background: rgba(55,180,120,.06);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(55,180,120,.12);
}
.boa-act-wa__label { font-weight: 500; }

/* Plan Safari CTA */
.boa-act-cta {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .58rem 1.35rem;
  background: linear-gradient(135deg,var(--forest) 0%,rgba(23,53,44,.92) 100%);
  color: var(--gold); border: 1px solid rgba(200,178,138,.28);
  border-radius: 9px;
  font-family: var(--font-body); font-size: .76rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
  position: relative; overflow: hidden;
  transition: all .38s var(--hdr-ease);
}
.boa-act-cta__text { position: relative; z-index: 1; }
.boa-act-cta__arrow {
  position: relative; z-index: 1;
  transition: transform .35s var(--hdr-ease);
  display: flex; align-items: center;
}
.boa-act-cta:hover .boa-act-cta__arrow { transform: translateX(4px); }
.boa-act-cta__shimmer {
  position: absolute; inset: 0;
  background: linear-gradient(105deg,transparent 30%,rgba(200,178,138,.18) 50%,transparent 70%);
  transform: translateX(-120%) skewX(-8deg);
  animation: ctaShine 3.2s ease-in-out infinite;
}
@keyframes ctaShine { 0%,55%{transform:translateX(-120%) skewX(-8deg)} 100%{transform:translateX(220%) skewX(-8deg)} }
.boa-act-cta:hover {
  border-color: rgba(200,178,138,.55);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(23,53,44,.5), 0 2px 8px rgba(200,178,138,.12);
  color: var(--gold2);
}

/* Hamburger — hidden on desktop */
.boa-hamburger {
  display: none;
  flex-direction: column; justify-content: center; align-items: center; gap: 5px;
  width: 38px; height: 38px; padding: 9px;
  background: rgba(23,53,44,.35); border: 1px solid rgba(200,178,138,.16);
  border-radius: 9px; cursor: pointer; flex-shrink: 0;
  transition: background .3s, border-color .3s;
}
.boa-hamburger:hover {
  background: rgba(23,53,44,.65); border-color: rgba(200,178,138,.35);
}
.boa-hamburger__line {
  display: block; width: 100%; height: 1.5px;
  background: rgba(238,245,242,.78); border-radius: 1px;
  transform-origin: center;
  transition: transform .38s var(--hdr-ease), opacity .25s, width .38s;
}
/* Hamburger → X animation */
.boa-header.menu-open .boa-hamburger__line--1 { transform: translateY(6.5px) rotate(45deg); }
.boa-header.menu-open .boa-hamburger__line--2 { opacity: 0; width: 0; }
.boa-header.menu-open .boa-hamburger__line--3 { transform: translateY(-6.5px) rotate(-45deg); }

/* ════════════════
   DRAWER
════════════════ */
.boa-drawer {
  position: fixed; inset: 0; z-index: 1999;
  pointer-events: none; visibility: hidden;
}
.boa-drawer.is-open {
  pointer-events: all; visibility: visible;
}

/* Backdrop */
.boa-drawer__bd {
  position: absolute; inset: 0;
  background: rgba(5,10,8,.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  opacity: 0; transition: opacity .45s var(--hdr-ease);
}
.boa-drawer.is-open .boa-drawer__bd { opacity: 1; }

/* Slide panel */
.boa-drawer__panel {
  position: absolute; top: 0; right: 0; bottom: 0;
  width: min(380px, 92vw);
  display: flex; flex-direction: column;
  padding: 1.75rem 1.75rem 2.5rem;
  background: linear-gradient(155deg, rgba(12,22,18,.99) 0%, rgba(8,14,12,1) 100%);
  border-left: 1px solid rgba(200,178,138,.1);
  box-shadow: -32px 0 80px rgba(0,0,0,.65);
  transform: translateX(105%);
  transition: transform .5s var(--hdr-ease);
  overflow-y: auto; overflow-x: hidden;
}
.boa-drawer.is-open .boa-drawer__panel { transform: translateX(0); }

/* Ambient glow */
.boa-drawer__panel::before {
  content: '';
  position: absolute; top: -60px; right: -40px;
  width: 260px; height: 260px; border-radius: 50%;
  background: radial-gradient(circle, rgba(23,53,44,.12) 0%, transparent 70%);
  pointer-events: none;
}

/* Head row */
.boa-drawer__head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 2.5rem; flex-shrink: 0; position: relative; z-index: 1;
}
.boa-drawer__brand {
  display: flex; align-items: center; gap: .7rem; text-decoration: none;
}
.boa-drawer__brand img {
  width: 34px; height: 34px; border-radius: 50%; object-fit: cover;
  box-shadow: 0 0 0 1px rgba(200,178,138,.2), 0 3px 12px rgba(0,0,0,.4);
}
.boa-drawer__brand span {
  font-family: var(--font-serif); font-size: 1rem; font-weight: 300;
  color: rgba(238,245,242,.85); letter-spacing: .02em;
}
.boa-drawer__brand em { font-style: italic; color: var(--gold); }
.boa-drawer__x {
  display: flex; align-items: center; justify-content: center;
  width: 34px; height: 34px;
  background: rgba(238,245,242,.04); border: 1px solid rgba(200,178,138,.14);
  border-radius: 8px; cursor: pointer; color: rgba(238,245,242,.5);
  transition: all .3s;
}
.boa-drawer__x:hover {
  background: rgba(200,178,138,.08); border-color: rgba(200,178,138,.4);
  color: var(--gold); transform: rotate(90deg);
}

/* Nav list */
.boa-drawer__nav { flex: 1; position: relative; z-index: 1; }
.boa-drawer__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .18rem; }
.boa-drawer__item {
  opacity: 0; transform: translateX(20px);
  transition:
    opacity .4s var(--hdr-ease) calc(var(--i,0) * 0.048s),
    transform .4s var(--hdr-ease) calc(var(--i,0) * 0.048s);
}
.boa-drawer.is-open .boa-drawer__item { opacity: 1; transform: translateX(0); }
.boa-drawer__link {
  display: flex; align-items: center; gap: 1rem; padding: .85rem 1rem;
  font-family: var(--font-body); font-size: .95rem; font-weight: 400;
  color: rgba(238,245,242,.48); border-radius: 11px; text-decoration: none;
  border: 1px solid transparent; transition: all .28s; position: relative;
}
.boa-drawer__link:hover {
  color: rgba(238,245,242,.9); background: rgba(23,53,44,.45);
  border-color: rgba(200,178,138,.12);
}
.boa-drawer__link.is-active { color: var(--gold); background: rgba(23,53,44,.3); border-color: rgba(200,178,138,.18); }
.boa-drawer__num {
  font-family: var(--font-serif); font-size: .62rem; font-weight: 300;
  color: rgba(200,178,138,.35); letter-spacing: .1em; min-width: 24px; flex-shrink: 0;
  transition: color .28s;
}
.boa-drawer__link:hover .boa-drawer__num,
.boa-drawer__link.is-active .boa-drawer__num { color: var(--gold); }

/* CTAs */
.boa-drawer__ctas {
  display: flex; flex-direction: column; gap: .65rem;
  padding-top: 1.4rem; margin-top: 1.2rem;
  border-top: 1px solid rgba(200,178,138,.08);
  flex-shrink: 0; position: relative; z-index: 1;
}
.boa-drawer__wa {
  display: flex; align-items: center; gap: .65rem; padding: .85rem 1.1rem;
  background: rgba(55,180,120,.06); border: 1px solid rgba(55,180,120,.18);
  border-radius: 11px; color: rgba(55,180,120,.8);
  font-family: var(--font-body); font-size: .84rem; font-weight: 500;
  text-decoration: none; transition: all .28s;
}
.boa-drawer__wa:hover { background: rgba(55,180,120,.1); border-color: rgba(55,180,120,.38); color: #2bdb6e; }
.boa-drawer__plan {
  display: flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .9rem 1.1rem;
  background: linear-gradient(135deg,var(--forest),rgba(23,53,44,.9));
  color: var(--gold); border: 1px solid rgba(200,178,138,.26);
  border-radius: 11px; font-family: var(--font-body); font-size: .84rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
  transition: all .35s var(--hdr-ease); position: relative; overflow: hidden;
}
.boa-drawer__plan:hover {
  border-color: rgba(200,178,138,.5); transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(23,53,44,.45);
}

/* Footer */
.boa-drawer__foot {
  padding-top: 1.1rem; margin-top: .85rem;
  border-top: 1px solid rgba(200,178,138,.06);
  flex-shrink: 0; position: relative; z-index: 1;
}
.boa-drawer__foot p {
  font-family: var(--font-body); font-size: .58rem;
  color: rgba(238,245,242,.2); letter-spacing: .2em; text-transform: uppercase;
  margin-bottom: .35rem;
}
.boa-drawer__foot a {
  font-family: var(--font-body); font-size: .66rem;
  color: rgba(200,178,138,.45); text-decoration: none; letter-spacing: .06em;
}

/* ════════════════
   PAGE OFFSET — so content starts below header
════════════════ */
main#site-main { padding-top: var(--hdr-total); }

/* ════════════════
   RESPONSIVE
════════════════ */

/* ≤1200px — hide WhatsApp label */
@media (max-width:1200px) {
  .boa-act-wa__label { display: none; }
  .boa-act-wa { padding: .44rem .72rem; }
  .boa-nav__link { padding: .52rem .62rem; font-size: .72rem; }
}

/* ≤1024px — compact nav font */
@media (max-width:1024px) {
  .boa-nav__link { padding: .48rem .52rem; font-size: .69rem; letter-spacing: .04em; }
}

/* ≤900px — hide nav + whatsapp, show hamburger */
@media (max-width:900px) {
  .boa-nav { display: none; }
  .boa-act-wa { display: none; }
  .boa-hamburger { display: flex; }
  .boa-brand__sub { display: none; }
}

/* ≤600px — leaner brand, tighter header */
@media (max-width:600px) {
  :root { --hdr-topbar: 0px; --hdr-total: 60px; --hdr-main: 60px; }
  .boa-topbar { display: none; }
  .boa-brand__mark img { width: 36px; height: 36px; }
  .boa-brand__name { font-size: 1.1rem; }
  .boa-act-cta { padding: .52rem 1.05rem; font-size: .7rem; letter-spacing: .07em; }
  .boa-header__inner { gap: 0; }
}

/* Reduced motion */
@media (prefers-reduced-motion:reduce) {
  .boa-brand__name em { animation: none; }
  .boa-act-cta__shimmer { animation: none; }
  .boa-topbar__pulse { animation: none; }
}

/* ═══════════════════════════════════════
   11. HERO — CINEMATIC EXPEDITION
═══════════════════════════════════════ */
.hero{
  position:relative;height:100vh;min-height:700px;
  display:flex;align-items:center;overflow:hidden;
  background:var(--surface);
}
.hero video{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;
  transform:scale(1.04) translate3d(0,0,0);
  will-change:transform;filter:brightness(.55) saturate(1.15);
}
.hero-overlay{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(13,22,21,.92) 0%,rgba(13,22,21,.55) 50%,rgba(13,22,21,.18) 100%),
    linear-gradient(180deg,rgba(13,22,21,.28) 0%,transparent 35%,rgba(13,22,21,.78) 100%);
}
/* Environmental mist at base */
.hero::after{
  content:"";position:absolute;bottom:0;left:0;right:0;height:30%;
  background:linear-gradient(180deg,transparent 0%,rgba(13,22,21,.9) 100%);
  pointer-events:none;z-index:2;
}

.hero-content{
  position:relative;z-index:3;
  max-width:820px;
  padding:0 var(--gutter) 0 clamp(1.5rem,8vw,6rem);
  animation:heroIn 1.1s var(--ease) both;
  will-change:opacity,transform;
}
@keyframes heroIn{from{opacity:0;transform:translateY(32px)}}

.hero-badge{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.5rem 1.1rem;
  background:rgba(23,53,44,.65);
  border:1px solid rgba(200,178,138,.2);
  backdrop-filter:blur(12px);
  border-radius:999px;font-family:var(--font-body);font-size:.65rem;
  letter-spacing:.18em;text-transform:uppercase;color:rgba(200,178,138,.85);
  margin-bottom:1.75rem;
}
.hero-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:rgba(55,200,120,.9);animation:tPulse 1.8s ease-in-out infinite}

.hero-content h1{
  font-family:var(--font-serif);
  font-size:clamp(3rem,7.5vw,6rem);
  font-weight:300;line-height:.95;letter-spacing:-.025em;
  background:linear-gradient(160deg,#fff 0%,var(--mist) 45%,var(--sand) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  margin-bottom:1.25rem;
}
.hero-content h2{
  font-family:var(--font-body);font-size:clamp(.92rem,1.8vw,1.12rem);
  font-weight:300;color:rgba(220,230,227,.72);letter-spacing:.03em;
  margin-bottom:1.5rem;font-style:normal;
  background:none;-webkit-text-fill-color:rgba(220,230,227,.72);
}
.hero-content p{
  font-size:1rem;color:rgba(238,245,242,.65);line-height:1.85;
  margin-bottom:2.25rem;max-width:540px;
}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:2.75rem}
.hero-trust{
  display:flex;align-items:center;gap:.85rem;flex-wrap:wrap;
  font-size:.73rem;color:rgba(238,245,242,.45);
}
.hero-trust span:nth-child(odd){color:rgba(200,178,138,.7)}

/* ═══════════════════════════════════════
   12. BUTTONS — ENVIRONMENTAL SYSTEM
═══════════════════════════════════════ */
.btn{
  display:inline-flex;align-items:center;gap:.55rem;
  background:linear-gradient(135deg,var(--forest) 0%,rgba(23,53,44,.85) 100%);
  color:var(--gold);
  border:1px solid rgba(200,178,138,.28);
  padding:.82rem 1.85rem;border-radius:9px;
  font-family:var(--font-body);font-size:.81rem;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;text-decoration:none;
  transition:all .38s var(--ease);position:relative;overflow:hidden;cursor:pointer;
}
.btn::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(105deg,transparent 30%,rgba(200,178,138,.12) 50%,transparent 70%);
  transform:translateX(-100%) skewX(-6deg);transition:none;
}
.btn:hover{
  background:linear-gradient(135deg,rgba(30,65,50,.95) 0%,rgba(40,80,60,.95) 100%);
  border-color:rgba(200,178,138,.5);transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(23,53,44,.45),0 2px 8px rgba(200,178,138,.12);
  color:var(--gold2);
}
.btn:hover::before{animation:btnShimmer .6s ease both}
@keyframes btnShimmer{to{transform:translateX(220%) skewX(-6deg)}}

.btn.ghost{
  background:transparent;
  border:1px solid rgba(200,178,138,.25);color:rgba(200,178,138,.72);
}
.btn.ghost:hover{background:rgba(23,53,44,.4);border-color:rgba(200,178,138,.5);color:var(--gold)}

.btn-enquire{
  display:inline-block;font-size:.72rem;font-weight:600;
  color:var(--gold);letter-spacing:.1em;text-transform:uppercase;
  border-bottom:1px solid rgba(200,178,138,.3);padding-bottom:2px;transition:all .3s;
}
.btn-enquire:hover{color:var(--gold2);border-bottom-color:var(--gold2)}

/* ═══════════════════════════════════════
   13. MAG DIVIDER
═══════════════════════════════════════ */
.mag-divider{overflow:hidden;background:var(--surface-2);border-top:1px solid var(--border-gold);border-bottom:1px solid var(--border-gold)}
.mag-slider{overflow:hidden;height:240px}
.mag-track{display:flex;gap:.75rem;height:100%;animation:slideLeft 30s linear infinite;width:max-content}
@keyframes slideLeft{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mag-track img{height:240px;width:340px;object-fit:cover;border-radius:8px;flex-shrink:0;filter:brightness(.75) saturate(.9)}
.mag-divider-inner{padding:3.5rem var(--gutter);text-align:center;max-width:700px;margin:0 auto}
.mag-tag{font-size:.6rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);opacity:.7}
.mag-divider-inner h2{font-family:var(--font-serif);font-size:clamp(1.6rem,3.5vw,2.6rem);color:var(--text);margin:.85rem 0 .65rem;font-weight:300}
.mag-divider-inner p{font-size:.92rem;color:var(--muted)}

/* ═══════════════════════════════════════
   14. MAG BREAK
═══════════════════════════════════════ */
.mag-break{background:var(--surface);border-top:1px solid var(--border)}
.mag-break-inner{display:grid;grid-template-columns:1fr 1fr;max-width:var(--contain);margin:0 auto}
.mag-break-image{min-height:420px;background-size:cover;background-position:center;filter:brightness(.75) saturate(.9)}
.mag-break-content{
  padding:clamp(3rem,6vw,5rem);display:flex;flex-direction:column;justify-content:center;gap:1.5rem;
  background:var(--surface-2);
}
.mag-kicker{font-size:.62rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);opacity:.75}
.mag-break-content h2{font-family:var(--font-serif);font-size:clamp(1.8rem,3.5vw,2.8rem);color:var(--text);font-weight:300}
.mag-break-content p{font-size:.94rem;color:var(--muted);line-height:1.85}
.mag-stats{display:flex;gap:2.5rem;margin-top:.5rem}
.mag-stat strong{display:block;font-family:var(--font-serif);font-size:2.2rem;color:var(--gold);font-weight:300}
.mag-stat span{font-size:.7rem;color:var(--faint);text-transform:uppercase;letter-spacing:.1em}

/* ═══════════════════════════════════════
   15. MAGAZINE SECTION
═══════════════════════════════════════ */
.magazine-section{padding:var(--sp-lg) var(--gutter);background:var(--surface)}
.magazine-header{text-align:center;max-width:580px;margin:0 auto 3rem}
.magazine-header h2{font-family:var(--font-serif);font-size:clamp(2rem,4vw,3.2rem);color:var(--text);font-weight:300}
.magazine-header p{color:var(--muted);margin-top:.65rem;font-size:.92rem}
.magazine-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem;max-width:var(--contain);margin:0 auto}
.mag-card{
  background:var(--glass);border:1px solid var(--border-gold);border-radius:16px;overflow:hidden;
  backdrop-filter:blur(16px);transition:all .45s var(--ease);
}
.mag-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-md);border-color:rgba(200,178,138,.28)}
.mag-img{height:240px;background-size:cover;background-position:center;filter:brightness(.8) saturate(.9);transition:filter .5s,transform .7s var(--ease)}
.mag-card:hover .mag-img{filter:brightness(.9) saturate(1.05);transform:scale(1.04)}
.mag-content{padding:1.5rem}
.mag-content h3{font-family:var(--font-serif);font-size:1.28rem;color:var(--text);margin-bottom:.6rem;font-weight:400}
.mag-content p{font-size:.88rem;color:var(--muted);line-height:1.75}

/* ═══════════════════════════════════════
   16. ARUSHA GUIDE SECTION
═══════════════════════════════════════ */
.arusha-guide-section{position:relative;overflow:hidden;background:var(--surface-2)}
.arusha-guide-bg{position:absolute;inset:0}
.arusha-guide-bg video{width:100%;height:100%;object-fit:cover;filter:brightness(.35) saturate(.9)}
.arusha-guide-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,22,21,.6) 0%,rgba(13,22,21,.85) 100%)}
.arusha-guide-container{position:relative;z-index:2;max-width:var(--contain);margin:0 auto;padding:var(--sp-lg) var(--gutter)}
.arusha-guide-grid{display:grid;grid-template-columns:1fr auto;gap:4rem;align-items:center;margin-bottom:4rem}
.arusha-guide-content{max-width:600px}
.arusha-kicker{display:block;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;opacity:.8}
.arusha-title{font-family:var(--font-serif);font-size:clamp(2rem,4.5vw,3.5rem);color:var(--text);font-weight:300;margin-bottom:1.25rem}
.arusha-text{font-size:.95rem;color:var(--muted);line-height:1.85;margin-bottom:1rem}
.arusha-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.75rem}
.arusha-guide-image img{width:200px;height:200px;border-radius:50%;object-fit:cover;border:2px solid rgba(200,178,138,.25);box-shadow:0 0 40px rgba(23,53,44,.4)}

/* Arusha cards */
.arusha-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.25rem}
.arusha-card{
  background:var(--glass);border:1px solid var(--border-gold);border-radius:16px;overflow:hidden;
  backdrop-filter:blur(16px);transition:all .45s var(--ease);
}
.arusha-card:hover{transform:translateY(-6px);border-color:rgba(200,178,138,.28);box-shadow:var(--shadow-md)}
.arusha-card-img{height:180px;background-size:cover;background-position:center;filter:brightness(.75) saturate(.9);transition:filter .5s,transform .7s var(--ease)}
.arusha-card:hover .arusha-card-img{filter:brightness(.88) saturate(1.05);transform:scale(1.05)}
.arusha-card-body{padding:1.35rem}
.arusha-card-body h3{font-family:var(--font-serif);font-size:1.1rem;color:var(--text);margin-bottom:.5rem;font-weight:400}
.arusha-card-body p{font-size:.83rem;color:var(--muted);margin-bottom:.75rem}
.arusha-card-body ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:.3rem}
.arusha-card-body ul li{font-size:.8rem;color:rgba(200,178,138,.7)}
.arusha-price{display:inline-block;margin-top:.75rem;font-size:.78rem;color:var(--gold);font-weight:600}

/* ═══════════════════════════════════════
   17. STORY STRIP
═══════════════════════════════════════ */
.story-strip{display:grid;grid-template-columns:1fr 1fr;min-height:480px}
.story-image{background-size:cover;background-position:center;min-height:360px;filter:brightness(.75) saturate(.9)}
.story-content{
  background:var(--surface-2);display:flex;flex-direction:column;justify-content:center;gap:1.5rem;
  padding:clamp(3rem,6vw,5rem);
}
.story-content h2{font-family:var(--font-serif);font-size:clamp(1.8rem,3.5vw,2.8rem);color:var(--text);font-weight:300}
.story-content p{font-size:.95rem;color:var(--muted)}

/* ═══════════════════════════════════════
   18. HOME SCROLL
═══════════════════════════════════════ */
.home-scroll{position:relative;overflow:hidden;background:var(--surface);border-top:1px solid var(--border-gold)}
.home-scroll-bg{position:absolute;inset:0;z-index:0}
.home-scroll-bg video{width:100%;height:100%;object-fit:cover;filter:brightness(.28) saturate(.8)}
.home-scroll-overlay{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(90deg,rgba(13,22,21,.82) 0%,rgba(13,22,21,.58) 50%,rgba(13,22,21,.82) 100%);
}
.home-scroll-panels{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1fr 1fr;max-width:var(--contain);margin:0 auto;min-height:80vh;
}
.home-panel{display:flex;flex-direction:column}
.home-panel-inner{padding:var(--sp-lg) var(--sp-md)}
.guide-kicker{font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);opacity:.75}
.home-guides-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-bottom:2.5rem}
.guide-card{
  background:rgba(13,22,21,.65);border:1px solid var(--border-gold);border-radius:14px;padding:1.75rem;
  backdrop-filter:blur(16px);transition:all .4s var(--ease);
}
.guide-card:hover{border-color:rgba(200,178,138,.3);transform:translateY(-4px)}
.guide-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}
.guide-title{font-family:var(--font-serif);font-size:2rem;color:var(--text);margin-bottom:.5rem}
.guide-copy{font-size:.88rem;color:var(--muted);line-height:1.7}
.guide-btn{
  font-size:.7rem;color:var(--gold);letter-spacing:.1em;text-transform:uppercase;
  border:1px solid rgba(200,178,138,.25);border-radius:20px;padding:.32rem .8rem;
  white-space:nowrap;transition:all .3s;text-decoration:none;
}
.guide-btn:hover{background:rgba(23,53,44,.5);border-color:rgba(200,178,138,.45);color:var(--gold2)}
.home-panel-hint{font-size:.72rem;color:var(--faint);display:flex;align-items:center;gap:.5rem;margin-top:1.5rem}
.hint-arrow{animation:bounce .85s ease-in-out infinite}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}

/* ═══════════════════════════════════════
   19. ITINERARY CARDS
═══════════════════════════════════════ */
.home-itineraries{display:flex;flex-direction:column;gap:1.1rem;margin:2rem 0}
.itinerary-card{
  background:rgba(13,22,21,.7);border:1px solid var(--border-gold);border-radius:14px;
  overflow:hidden;backdrop-filter:blur(16px);transition:all .45s var(--ease);
  display:grid;grid-template-columns:110px 1fr;position:relative;
}
.itinerary-card:hover{border-color:rgba(200,178,138,.28);transform:translateX(4px);box-shadow:var(--shadow-md)}
.itinerary-card.featured{border-color:rgba(200,178,138,.25)}
.itinerary-badge{
  position:absolute;top:.85rem;left:.85rem;background:var(--forest);color:var(--gold);
  padding:.28rem .65rem;border-radius:6px;font-size:.62rem;font-weight:700;letter-spacing:.08em;z-index:2;
  border:1px solid rgba(200,178,138,.2);
}
.itinerary-ribbon{
  position:absolute;top:.85rem;right:.85rem;
  background:rgba(23,53,44,.6);border:1px solid rgba(200,178,138,.22);
  color:var(--gold);padding:.28rem .65rem;border-radius:6px;font-size:.62rem;font-weight:600;
}
.itinerary-img{background-size:cover;background-position:center;min-height:110px;filter:brightness(.75) saturate(.85)}
.itinerary-body{padding:1.1rem 1.25rem}
.itinerary-body h3{font-family:var(--font-serif);font-size:1.05rem;color:var(--text);margin-bottom:.35rem}
.itinerary-body p{font-size:.82rem;color:var(--muted);margin-bottom:.75rem}
.itinerary-pricing{display:flex;gap:.75rem;flex-wrap:wrap;margin-bottom:.85rem}
.itinerary-pricing span{font-size:.7rem;color:var(--faint);background:rgba(23,53,44,.45);padding:.25rem .65rem;border-radius:20px}

/* ═══════════════════════════════════════
   20. LODGE CARDS
═══════════════════════════════════════ */
.home-lodges{margin-top:3rem}
.home-lodges-head{margin-bottom:1.5rem}
.home-lodges-actions{display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}
.home-lodges-mini{margin-top:1.25rem}
.lodges-grid{display:flex;flex-direction:column;gap:1rem}
.lodge-card{
  background:rgba(13,22,21,.7);border:1px solid var(--border-gold);border-radius:14px;overflow:hidden;
  backdrop-filter:blur(16px);display:grid;grid-template-columns:110px 1fr;transition:all .4s var(--ease);
}
.lodge-card:hover{border-color:rgba(200,178,138,.28);transform:translateX(4px)}
.lodge-img{background-size:cover;background-position:center;min-height:100px;filter:brightness(.72) saturate(.85)}
.lodge-body{padding:1rem 1.25rem}
.lodge-meta{font-size:.6rem;color:var(--gold);text-transform:uppercase;letter-spacing:.14em;margin-bottom:.35rem;opacity:.8}
.lodge-body h3{font-family:var(--font-serif);font-size:1rem;color:var(--text);margin-bottom:.35rem}
.lodge-body p{font-size:.8rem;color:var(--muted)}

/* ═══════════════════════════════════════
   21. PLANNER PANEL
═══════════════════════════════════════ */
.home-panel-planner{border-left:1px solid var(--border-gold)}
.planner-head{margin-bottom:2rem}
.planner-title{font-family:var(--font-serif);font-size:clamp(1.6rem,3vw,2.4rem);color:var(--text);font-weight:300}
.planner-copy{font-size:.9rem;color:var(--muted);margin-top:.65rem}
.planner-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:2.5rem}

/* ═══════════════════════════════════════
   22. SOUVENIRS
═══════════════════════════════════════ */
.home-photo-break.souvenirs-section{position:relative;overflow:hidden;padding:var(--sp-lg) var(--gutter)}
.home-photo-break-overlay{position:absolute;inset:0;background:rgba(13,22,21,.88)}
.home-photo-break-inner{position:relative;z-index:2;max-width:var(--contain);margin:0 auto;text-align:center}
.photo-break-title{font-family:var(--font-serif);font-size:clamp(2rem,4vw,3.5rem);color:var(--text);font-weight:300;margin-bottom:.75rem;display:block}
.souvenirs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.25rem;margin-top:2.5rem}
.souvenir-card{
  background:var(--glass);border:1px solid var(--border-gold);border-radius:14px;overflow:hidden;
  text-align:center;backdrop-filter:blur(12px);transition:all .4s var(--ease);
}
.souvenir-card:hover{transform:translateY(-6px);border-color:rgba(200,178,138,.28)}
.souvenir-img{height:180px;background-size:cover;background-position:center;filter:brightness(.75) saturate(.85)}
.souvenir-card h3{font-family:var(--font-serif);font-size:1rem;padding:.85rem .75rem .25rem;color:var(--text);font-weight:400}
.souvenir-card span{font-size:.78rem;color:var(--gold);display:block;padding-bottom:1rem}

/* ═══════════════════════════════════════
   23. ELITE TRUST
═══════════════════════════════════════ */
.elite-trust{
  display:grid;grid-template-columns:1fr auto 1fr;gap:2rem;
  padding:var(--sp-lg) var(--gutter);background:var(--surface-2);overflow:hidden;
  border-top:1px solid var(--border-gold);
}
.elite-marquee{overflow:hidden}
.elite-track{display:flex;flex-direction:column;gap:1.25rem;animation:marqueeUp 22s linear infinite}
.elite-track.reverse{animation-direction:reverse}
@keyframes marqueeUp{from{transform:translateY(0)}to{transform:translateY(-50%)}}
.elite-card{
  background:var(--glass);border:1px solid var(--border-gold);border-radius:14px;padding:1.25rem;
  backdrop-filter:blur(12px);display:flex;gap:1rem;align-items:flex-start;min-width:280px;
}
.elite-card img{width:44px;height:44px;border-radius:50%;object-fit:cover;flex-shrink:0}
.elite-head{display:flex;flex-direction:column;margin-bottom:.35rem}
.elite-head strong{font-size:.85rem;color:var(--text)}
.elite-head span{font-size:.7rem;color:var(--faint)}
.elite-stars{color:var(--gold);font-size:.85rem;margin-bottom:.35rem;letter-spacing:.05em}
.elite-stars.large{font-size:1.1rem}
.elite-card p{font-size:.82rem;color:var(--muted);line-height:1.65}
.elite-center{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.5rem;justify-content:center;min-width:280px}
.elite-center h2{font-family:var(--font-serif);font-size:clamp(1.8rem,3.5vw,2.8rem);color:var(--text);font-weight:300}
.elite-sub{font-size:.9rem;color:var(--muted)}
.elite-rating{display:flex;align-items:center;gap:1rem}
.rating-score{font-family:var(--font-serif);font-size:3.5rem;color:var(--gold);font-weight:300;line-height:1}
.elite-rating span{font-size:.72rem;color:var(--faint)}
.elite-badges{display:flex;flex-direction:column;gap:.75rem;width:100%}
.elite-badge{display:flex;align-items:center;gap:.75rem;background:var(--glass);border:1px solid var(--border-gold);border-radius:10px;padding:.65rem 1rem;backdrop-filter:blur(8px)}
.elite-badge img{height:22px;width:auto;object-fit:contain}
.elite-badge span{font-size:.75rem;color:var(--muted)}
.elite-payments{display:flex;flex-direction:column;align-items:center;gap:.5rem}
.elite-payments span{font-size:.7rem;color:var(--faint)}
.elite-pay-grid{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}
.elite-pay-grid img{height:22px;width:auto;object-fit:contain;filter:brightness(0) invert(.55)}

/* ═══════════════════════════════════════
   24. SPLIT
═══════════════════════════════════════ */
.split{display:grid;grid-template-columns:1fr 1fr;min-height:500px}
.split-img{background-size:cover;background-position:center;filter:brightness(.75) saturate(.9)}
.split-content{
  background:var(--surface-2);display:flex;flex-direction:column;justify-content:center;
  align-items:flex-start;padding:clamp(3rem,6vw,6rem);gap:1.75rem;
}
.split-content h2{font-family:var(--font-serif);font-size:clamp(2rem,4vw,3.5rem);color:var(--text);font-weight:300}

/* ═══════════════════════════════════════
   25. PAGE SHELL
═══════════════════════════════════════ */
.page-hero{
  height:clamp(380px,55vh,680px);position:relative;overflow:hidden;
  background:var(--surface);display:flex;align-items:center;justify-content:center;
}
.page-hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.45) saturate(1.05)}
.page-hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 40%,rgba(13,22,21,.88) 100%);pointer-events:none;
}
.page-hero--enquire{height:clamp(480px,70vh,780px);align-items:center}

.page-shell{max-width:960px;margin:0 auto;padding:clamp(3rem,6vw,5rem) var(--gutter)}
.page-card{
  background:var(--glass);border:1px solid var(--border-gold);border-radius:20px;
  padding:clamp(2rem,5vw,3.5rem);backdrop-filter:blur(22px);
}
.page-title{font-family:var(--font-serif);font-size:clamp(2.2rem,5vw,3.8rem);color:var(--text);margin-bottom:1rem;font-weight:300}
.lead{font-size:1.1rem;color:var(--muted);line-height:1.85;margin-bottom:2rem}
.kicker{display:inline-block;font-size:.62rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;opacity:.8}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:3rem;margin-top:2.5rem}
.two-col h3{font-family:var(--font-serif);font-size:1.4rem;color:var(--text);font-weight:300;margin-bottom:.75rem}
.two-col p{font-size:.92rem;color:var(--muted);line-height:1.8;margin-bottom:.75rem}
.bullets{list-style:none;padding:0;display:flex;flex-direction:column;gap:.5rem;margin-top:.75rem}
.bullets li{font-size:.88rem;color:var(--muted);display:flex;align-items:flex-start;gap:.65rem}
.bullets li::before{content:"✦";color:var(--gold);font-size:.65rem;flex-shrink:0;margin-top:.2rem}
.quote{font-family:var(--font-serif);font-size:clamp(1.1rem,2.2vw,1.5rem);font-style:italic;color:rgba(200,178,138,.82);border-left:2px solid rgba(200,178,138,.3);padding-left:1.5rem;margin:2.5rem 0;line-height:1.55}
.cta-row{display:flex;gap:1rem;flex-wrap:wrap;margin-top:2rem}
.map-embed iframe{width:100%;height:280px;border:1px solid var(--border-gold);border-radius:14px;margin-top:1.25rem;filter:brightness(.8) saturate(.75)}
.enquiry-form{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}
.enquiry-form input,.enquiry-form textarea{
  width:100%;padding:.8rem 1rem;background:rgba(23,53,44,.2);
  border:1px solid var(--border-gold);border-radius:9px;
  color:var(--text);font-family:var(--font-body);font-size:.9rem;
  transition:border-color .3s,box-shadow .3s;
}
.enquiry-form input:focus,.enquiry-form textarea:focus{outline:none;border-color:rgba(200,178,138,.45);box-shadow:0 0 0 3px rgba(200,178,138,.06)}
.enquiry-form input::placeholder,.enquiry-form textarea::placeholder{color:rgba(238,245,242,.28)}
.enquiry-form textarea{resize:none;min-height:120px}

/* ═══════════════════════════════════════
   26. HERO EDITORIAL + ENQUIRE
═══════════════════════════════════════ */
.hero-editorial{position:relative;z-index:3;text-align:center;max-width:760px;padding:0 var(--gutter)}
.hero-eyebrow{display:flex;align-items:center;gap:1rem;justify-content:center;margin-bottom:1.25rem}
.hero-eyebrow__line{flex:1;max-width:60px;height:1px;background:rgba(200,178,138,.35)}
.hero-eyebrow__label{font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);opacity:.8}
.hero-headline{font-family:var(--font-serif);font-size:clamp(2.5rem,6vw,4.5rem);color:var(--text);font-weight:300;margin-bottom:1rem}
.hero-headline em{display:block;font-style:italic;color:var(--gold)}
.hero-subheadline{font-size:1rem;color:var(--muted);line-height:1.8;margin-bottom:1.75rem}
.hero-overlay--vignette{position:absolute;inset:0;background:radial-gradient(ellipse 110% 90% at 50% 50%,transparent 30%,rgba(13,22,21,.65) 100%)}
.hero-overlay--gradient{position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,22,21,.4) 0%,transparent 40%,rgba(13,22,21,.75) 100%)}
.hero-trust-strip{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap}
.trust-item{display:flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--muted)}
.trust-item svg{color:var(--gold)}
.trust-divider{width:1px;height:16px;background:rgba(200,178,138,.2)}
.hero-scroll-cue{position:absolute;bottom:2.5rem;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.5rem;z-index:4}
.scroll-cue__label{font-size:.6rem;color:var(--faint);letter-spacing:.18em;text-transform:uppercase}
.scroll-cue__track{width:1px;height:50px;background:rgba(200,178,138,.18);position:relative;overflow:hidden}
.scroll-cue__dot{position:absolute;top:-8px;left:-2px;width:5px;height:5px;border-radius:50%;background:var(--gold);animation:scDot 1.6s ease-in-out infinite}
@keyframes scDot{0%{top:-8px;opacity:1}100%{top:52px;opacity:0}}

/* ═══════════════════════════════════════
   27. WIZARD / ENQUIRE
═══════════════════════════════════════ */
.enquiry-wizard{background:var(--surface);padding:clamp(3rem,6vw,5rem) var(--gutter);position:relative}
.enquiry-wizard--page{min-height:60vh}
.wizard-ambient{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.ambient-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.1}
.ambient-orb--1{width:600px;height:600px;background:var(--forest);top:-200px;left:-100px}
.ambient-orb--2{width:500px;height:500px;background:var(--sky-glow);bottom:-150px;right:-100px}

.wizard#enquireWizard{
  max-width:760px;margin:0 auto;
  background:var(--glass);border:1px solid var(--border-gold);
  border-radius:22px;padding:clamp(2rem,5vw,3.5rem);
  backdrop-filter:blur(28px);position:relative;z-index:2;
}
.progress-architecture{margin-bottom:3rem}
.progress-wrap{height:3px;background:rgba(238,245,242,.07);border-radius:2px;margin-bottom:1rem}
.progress-bar{height:100%;background:linear-gradient(90deg,var(--forest),var(--sky));border-radius:2px;width:0%;transition:width .65s var(--ease)}
.step{display:none}
.step.active{display:block}
.step-header{margin-bottom:2rem}
.step-eyebrow{font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);opacity:.8;display:block;margin-bottom:.65rem}
.step-headline{font-family:var(--font-serif);font-size:clamp(1.4rem,3.5vw,2.2rem);font-weight:300;color:var(--text);line-height:1.1;margin-bottom:.5rem}
.step-hint{font-size:.86rem;color:var(--muted);line-height:1.7}

.option-card{
  display:flex;align-items:center;gap:1rem;padding:1.15rem 1.25rem;
  background:rgba(23,53,44,.15);border:1.5px solid var(--border-gold);border-radius:14px;
  cursor:pointer;text-align:left;transition:all .35s var(--ease);font-family:var(--font-body);
}
.option-card:hover{border-color:rgba(200,178,138,.28);background:rgba(23,53,44,.25)}
.option-card.is-active,.option-card.selected{border-color:rgba(200,178,138,.5);background:rgba(23,53,44,.4);box-shadow:0 0 0 1px rgba(200,178,138,.18)}
.option-card__title{display:block;font-size:.92rem;font-weight:500;color:var(--text)}
.option-card__sub{display:block;font-size:.76rem;color:var(--muted);margin-top:.2rem}
.option-card__flag,.option-card__icon{font-size:1.5rem;flex-shrink:0}
.option-card__days{font-family:var(--font-serif);font-size:1.8rem;color:var(--gold);font-weight:300;flex-shrink:0;line-height:1;min-width:54px}
.option-card__check{flex-shrink:0;width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(238,245,242,.15);display:flex;align-items:center;justify-content:center;transition:all .3s}
.option-card.is-active .option-card__check{background:rgba(200,178,138,.8);border-color:rgba(200,178,138,.8);color:var(--surface)}
.option-card__check svg{width:14px;height:14px;opacity:0;transition:opacity .2s}
.option-card.is-active .option-card__check svg{opacity:1}
.options{display:flex;flex-direction:column;gap:.75rem;margin-bottom:2rem}
.options--destination,.options--theme{display:grid;grid-template-columns:1fr 1fr}
.options--duration{display:grid;grid-template-columns:1fr 1fr}
.options--travel-mode{display:grid;grid-template-columns:repeat(3,1fr)}
.multi{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2rem}
.multi button,.months button,.travel-type button{
  padding:.55rem 1.2rem;border:1px solid var(--border-gold);border-radius:24px;
  background:transparent;color:var(--muted);font-family:var(--font-body);font-size:.82rem;cursor:pointer;transition:all .3s;
}
.multi button:hover,.months button:hover{border-color:rgba(200,178,138,.3);color:var(--text)}
.multi button.active,.months button.active{border-color:rgba(200,178,138,.5);color:var(--gold);background:rgba(23,53,44,.35)}
.luxury-text-input,.luxury-date-input{
  width:100%;padding:.88rem 1rem .88rem 3rem;background:rgba(23,53,44,.2);
  border:1px solid var(--border-gold);border-radius:10px;color:var(--text);
  font-family:var(--font-body);font-size:.95rem;transition:border-color .3s,box-shadow .3s;
}
.luxury-text-input:focus,.luxury-date-input:focus{outline:none;border-color:rgba(200,178,138,.48);box-shadow:0 0 0 3px rgba(200,178,138,.07)}
.luxury-textarea{width:100%;min-height:120px;padding:1rem;resize:none;background:rgba(23,53,44,.2);border:1px solid var(--border-gold);border-radius:10px;color:var(--text);font-family:var(--font-body);font-size:.9rem;line-height:1.7;transition:border-color .3s}
.luxury-textarea:focus{outline:none;border-color:rgba(200,178,138,.48)}
.counter-btn{width:36px;height:36px;border-radius:50%;border:1.5px solid var(--border-gold);background:transparent;color:var(--gold);font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s;line-height:1}
.counter-btn:hover{border-color:rgba(200,178,138,.45);background:rgba(23,53,44,.4)}
.wizard-actions{display:flex;justify-content:space-between;align-items:center;padding-top:1.75rem;border-top:1px solid var(--border-gold);margin-top:1.5rem;gap:1rem}
.back{background:transparent;border:1px solid var(--border-gold);color:var(--muted);padding:.7rem 1.5rem;border-radius:8px;font-family:var(--font-body);font-size:.8rem;cursor:pointer;transition:all .3s}
.back:hover{border-color:rgba(200,178,138,.4);color:var(--gold)}
.next{background:linear-gradient(135deg,var(--forest) 0%,rgba(30,65,50,.95) 100%);color:var(--gold);border:1px solid rgba(200,178,138,.3);padding:.82rem 2rem;border-radius:9px;font-family:var(--font-body);font-size:.85rem;font-weight:600;letter-spacing:.08em;cursor:pointer;transition:all .35s var(--ease)}
.next:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(23,53,44,.5);border-color:rgba(200,178,138,.5);color:var(--gold2)}
.next[disabled]{opacity:.38;cursor:not-allowed;transform:none;box-shadow:none}
.btn--primary{display:inline-flex;align-items:center;gap:.6rem;background:linear-gradient(135deg,var(--forest) 0%,rgba(30,65,50,.95) 100%);color:var(--gold);border:1px solid rgba(200,178,138,.3);padding:.82rem 2rem;border-radius:9px;font-family:var(--font-body);font-size:.84rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;transition:all .35s var(--ease);cursor:pointer}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 10px 30px rgba(23,53,44,.5);border-color:rgba(200,178,138,.5)}
.btn--primary[disabled]{opacity:.38;cursor:not-allowed;transform:none;box-shadow:none}
.btn--ghost{display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--border-gold);color:var(--muted);padding:.78rem 1.5rem;border-radius:9px;font-family:var(--font-body);font-size:.82rem;font-weight:500;background:transparent;cursor:pointer;transition:all .3s;text-decoration:none}
.btn--ghost:hover{border-color:rgba(200,178,138,.4);color:var(--gold)}
.btn--submit{display:inline-flex;align-items:center;gap:.6rem;background:linear-gradient(135deg,var(--forest) 0%,var(--deep-forest) 100%);color:var(--gold);border:1px solid rgba(200,178,138,.3);padding:.9rem 2.25rem;border-radius:9px;font-family:var(--font-body);font-size:.88rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:all .35s var(--ease)}
.btn--submit:hover{transform:translateY(-3px);box-shadow:0 14px 40px rgba(23,53,44,.5);border-color:rgba(200,178,138,.5)}
.wizard-success{text-align:center;padding:3rem 2rem}
.wizard-success__icon{width:64px;height:64px;margin:0 auto 1.75rem;color:var(--gold);animation:wsCheck .6s var(--ease) both}
@keyframes wsCheck{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}
.wizard-success__title{font-family:var(--font-serif);font-size:2rem;font-weight:300;color:var(--text);margin-bottom:1rem}
.wizard-success__body{font-size:.9rem;color:var(--muted);line-height:1.8;max-width:500px;margin:0 auto 2rem}
.submit-trust{display:flex;gap:2rem;flex-wrap:wrap;margin-bottom:1.5rem;padding:1.25rem;background:rgba(23,53,44,.2);border:1px solid var(--border-gold);border-radius:12px}
.submit-trust__item{display:flex;align-items:center;gap:.6rem;font-size:.8rem;color:var(--muted)}
.submit-trust__item svg{width:18px;height:18px;color:var(--gold);flex-shrink:0}

/* ═══════════════════════════════════════
   28. TOUR MODAL
═══════════════════════════════════════ */
.tour-modal-overlay{
  position:fixed;inset:0;z-index:5000;
  background:rgba(5,12,10,.9);backdrop-filter:blur(14px);
  display:flex;align-items:center;justify-content:center;
  padding:2rem;opacity:0;pointer-events:none;transition:opacity .4s var(--ease);
}
.tour-modal-overlay.open{opacity:1;pointer-events:all}
.tour-modal{
  background:var(--surface-2);border:1px solid var(--border-gold);border-radius:20px;
  max-width:700px;width:100%;max-height:90vh;overflow-y:auto;
  transform:translateY(24px);transition:transform .4s var(--ease);
}
.tour-modal-overlay.open .tour-modal{transform:translateY(0)}
.tour-modal-img{height:280px;background-size:cover;background-position:center;border-radius:18px 18px 0 0;filter:brightness(.75) saturate(.9)}
.tour-modal-body{padding:2.25rem}
.tour-modal-body h2{font-family:var(--font-serif);font-size:2rem;color:var(--text);margin-bottom:.75rem;font-weight:300}
.tour-modal-price{color:var(--gold);font-size:.9rem;font-weight:600;margin-bottom:1.25rem}
.tour-modal-close{position:absolute;top:1.25rem;right:1.25rem;background:rgba(23,53,44,.5);border:1px solid var(--border-gold);border-radius:8px;padding:.45rem .6rem;cursor:pointer;color:var(--text);font-size:1.1rem;transition:all .3s}
.tour-modal-close:hover{border-color:rgba(200,178,138,.4);color:var(--gold)}

/* ═══════════════════════════════════════
   29. ACCORDION + FILTERS
═══════════════════════════════════════ */
.accordion{display:flex;flex-direction:column;gap:.6rem}
details{background:var(--glass);border:1px solid var(--border-gold);border-radius:12px;overflow:hidden;backdrop-filter:blur(12px)}
summary{padding:1.1rem 1.35rem;cursor:pointer;font-size:.95rem;color:var(--text);font-weight:500;list-style:none;display:flex;justify-content:space-between;align-items:center}
summary::after{content:"+";color:var(--gold);font-size:1.2rem;flex-shrink:0}
details[open] summary::after{content:"−"}
details>div{padding:0 1.35rem 1.25rem;border-top:1px solid var(--border-gold);padding-top:1rem;font-size:.9rem;color:var(--muted);line-height:1.8}

.filters{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:2.5rem}
.filters button,.tz-filters button{padding:.5rem 1.2rem;border:1px solid var(--border-gold);border-radius:24px;background:transparent;color:var(--muted);font-family:var(--font-body);font-size:.78rem;font-weight:500;cursor:pointer;transition:all .3s;white-space:nowrap}
.filters button:hover,.tz-filters button:hover{border-color:rgba(200,178,138,.3);color:var(--text)}
.filters button.active,.filters button.is-active,.tz-filters button.is-active{background:rgba(23,53,44,.5);border-color:rgba(200,178,138,.4);color:var(--gold)}

/* ═══════════════════════════════════════
   30. FOOTER
═══════════════════════════════════════ */
#site-footer{background:rgba(8,14,12,.98);border-top:1px solid var(--border-gold)}
.footer-inner{max-width:var(--contain);margin:0 auto;padding:clamp(3rem,6vw,5rem) var(--gutter) 2.5rem;display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:3rem}
.footer-brand{font-family:var(--font-serif);font-size:1.4rem;color:var(--gold);margin-bottom:.75rem;font-weight:300}
.footer-note{font-size:.85rem;color:var(--muted);line-height:1.75;margin-bottom:1rem}
.footer-mini{font-size:.72rem;color:var(--faint)}
.footer-col h4{font-family:var(--font-body);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1.25rem;font-weight:600;opacity:.8}
.footer-col ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:.6rem}
.footer-col ul li a{font-size:.88rem;color:var(--muted);transition:color .3s}
.footer-col ul li a:hover{color:var(--gold)}
.footer-form{display:flex;gap:.5rem;margin-bottom:1.25rem}
.footer-form input{flex:1;padding:.65rem .9rem;background:rgba(23,53,44,.2);border:1px solid var(--border-gold);border-radius:8px;color:var(--text);font-family:var(--font-body);font-size:.85rem}
.footer-form input::placeholder{color:var(--faint)}
.footer-form button{background:linear-gradient(135deg,var(--forest) 0%,rgba(30,65,50,.9) 100%);color:var(--gold);border:1px solid rgba(200,178,138,.25);border-radius:8px;padding:.65rem 1.1rem;font-family:var(--font-body);font-size:.8rem;font-weight:600;cursor:pointer;transition:all .3s}
.footer-form button:hover{border-color:rgba(200,178,138,.5);color:var(--gold2)}
.footer-social{display:flex;gap:.85rem}
.footer-social a{font-size:.78rem;color:var(--muted);transition:color .3s}
.footer-social a:hover{color:var(--gold)}
.footer-bottom{max-width:var(--contain);margin:0 auto;padding:1.5rem var(--gutter);border-top:1px solid var(--border-gold);display:flex;justify-content:space-between;align-items:center;font-size:.75rem;color:var(--faint)}
.footer-small{display:flex;gap:.75rem;align-items:center}
.footer-small a{color:var(--faint);transition:color .3s}
.footer-small a:hover{color:var(--gold)}
.dot{opacity:.4}

/* ═══════════════════════════════════════
   31. ANIMATE
═══════════════════════════════════════ */
.animate{opacity:0;transform:translate3d(0,28px,0);transition:opacity .85s var(--ease),transform .85s var(--ease);will-change:opacity,transform}
.animate.visible{opacity:1;transform:translate3d(0,0,0)}

/* ═══════════════════════════════════════
   32. RESPONSIVE
═══════════════════════════════════════ */
@media(max-width:992px){
  .boa-nav,.boa-actions__whatsapp{display:none}
  .boa-actions__cta{padding:.52rem 1rem;font-size:.72rem}
  .boa-toggle{display:flex}
  .home-scroll-panels{grid-template-columns:1fr}
  .home-panel-planner{border-left:none;border-top:1px solid var(--border-gold)}
  .mag-break-inner{grid-template-columns:1fr}
  .story-strip{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .split-img{min-height:300px}
  .elite-trust{grid-template-columns:1fr}
  .elite-marquee{display:none}
  .footer-inner{grid-template-columns:1fr 1fr}
  .home-guides-grid{grid-template-columns:1fr}
  .arusha-guide-grid{grid-template-columns:1fr}
  .arusha-guide-image{display:none}
}
@media(max-width:640px){
  .itinerary-card{grid-template-columns:1fr}
  .itinerary-img{height:140px}
  .lodge-card{grid-template-columns:1fr}
  .lodge-img{height:140px}
  .footer-inner{grid-template-columns:1fr;gap:2rem}
  .hero-content h1{font-size:clamp(2.2rem,9vw,3.5rem)}
  .two-col{grid-template-columns:1fr}
  .boa-header__topbar{height:0;overflow:hidden}
  .boa-actions__cta{display:none}
}
@media(max-width:480px){
  .arusha-cards{grid-template-columns:1fr}
  .souvenirs-grid{grid-template-columns:1fr 1fr}
  .magazine-grid{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important;transition:none !important}
}


/* ═══════════════════════════════════════════════════════════
   FRONT-PAGE CINEMATIC SYSTEM — fp-* namespace
   Environmental: Forest → Earth → Sky → Volcanic
   ═══════════════════════════════════════════════════════════ */

/* ── Shared fp tokens ── */
.fp-eyebrow {
  display: inline-block;
  font-family: var(--font-body);
  font-size: .6rem;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--sand);
  opacity: .8;
  margin-bottom: .85rem;
}
.fp-section-title {
  font-family: var(--font-serif);
  font-size: clamp(2rem, 4.5vw, 3.5rem);
  font-weight: 300;
  color: var(--text);
  line-height: 1.07;
  letter-spacing: -.02em;
  margin-bottom: 1.25rem;
}
.fp-section-title em {
  font-style: italic;
  color: var(--sand);
}
.fp-section-title--light { color: var(--mist); }
.fp-section-title--light em { color: var(--sand); }

/* fp buttons */
.fp-btn {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .82rem 1.85rem; border-radius: 9px;
  font-family: var(--font-body); font-size: .8rem; font-weight: 600;
  letter-spacing: .09em; text-transform: uppercase; text-decoration: none;
  transition: all .38s var(--ease); cursor: pointer; border: none;
  position: relative; overflow: hidden;
}
.fp-btn--primary {
  background: linear-gradient(135deg, var(--forest) 0%, var(--deep-forest) 100%);
  color: var(--sand);
  border: 1px solid rgba(200,178,138,.28);
}
.fp-btn--primary:hover {
  background: linear-gradient(135deg, rgba(30,65,50,.95) 0%, rgba(40,80,60,.95) 100%);
  border-color: rgba(200,178,138,.55);
  transform: translateY(-2px);
  box-shadow: 0 10px 30px rgba(23,53,44,.5), 0 2px 8px rgba(200,178,138,.12);
  color: var(--mist);
}
.fp-btn--ghost {
  background: transparent;
  border: 1px solid rgba(200,178,138,.28);
  color: rgba(200,178,138,.78);
}
.fp-btn--ghost:hover {
  background: rgba(23,53,44,.4);
  border-color: rgba(200,178,138,.5);
  color: var(--sand);
}
.fp-btn--large { padding: 1rem 2.5rem; font-size: .86rem; }
.fp-btn--wa {
  background: rgba(37,211,102,.1);
  border: 1px solid rgba(37,211,102,.28);
  color: rgba(37,211,102,.88);
}
.fp-btn--wa:hover {
  background: rgba(37,211,102,.18);
  border-color: rgba(37,211,102,.55);
  color: #2ecc71;
}

.fp-link-cta {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--font-body); font-size: .78rem;
  font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
  color: var(--sand); text-decoration: none;
  border-bottom: 1px solid rgba(200,178,138,.3); padding-bottom: 2px;
  transition: all .3s;
}
.fp-link-cta:hover { color: var(--mist); border-bottom-color: var(--sand); }
.fp-link-cta--light { color: var(--mist); }

/* ══ SCENE 1: HERO ══ */
.fp-hero {
  position: relative; height: 100vh; min-height: 680px;
  display: flex; align-items: center; overflow: hidden;
  background: var(--surface);
}

.fp-hero__media { position: absolute; inset: 0; }

.fp-hero__video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover;
  transform: scale(1.04) translate3d(0,0,0);
  will-change: transform;
  filter: brightness(.5) saturate(1.1);
}

/* atmospheric layering */
.fp-hero__veil {
  position: absolute; inset: 0;
  background: linear-gradient(
    90deg,
    rgba(13,22,21,.92) 0%,
    rgba(13,22,21,.6)  45%,
    rgba(13,22,21,.18) 100%
  );
}
.fp-hero__fog {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 120% 80% at 20% 110%, rgba(23,53,44,.45) 0%, transparent 65%);
  pointer-events: none;
}
.fp-hero__gradient {
  position: absolute; bottom: 0; left: 0; right: 0; height: 40%;
  background: linear-gradient(180deg, transparent 0%, rgba(13,22,21,.92) 100%);
  pointer-events: none;
}
.fp-hero__particles {
  position: absolute; inset: 0; width: 100%; height: 100%;
  pointer-events: none;
}

/* Content */
.fp-hero__content {
  position: relative; z-index: 4;
  padding: 0 var(--gutter) 0 clamp(1.5rem, 8vw, 6rem);
  max-width: 860px;
  will-change: opacity, transform;
}

/* Status badge */
.fp-hero__badge {
  display: inline-flex; align-items: center; gap: .6rem;
  padding: .5rem 1.1rem;
  background: rgba(23,53,44,.6);
  border: 1px solid rgba(200,178,138,.2);
  backdrop-filter: blur(12px);
  border-radius: 999px;
  font-family: var(--font-body); font-size: .65rem;
  letter-spacing: .18em; text-transform: uppercase;
  color: rgba(200,178,138,.82);
  margin-bottom: 1.75rem;
}
.fp-hero__badge-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(55,200,120,.9);
  animation: fpPulse 1.9s ease-in-out infinite;
  flex-shrink: 0;
}
@keyframes fpPulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.2;transform:scale(.5)} }

/* Cinematic headline */
.fp-hero__headline {
  display: flex; flex-direction: column;
  font-family: var(--font-serif);
  font-weight: 300; line-height: .92;
  letter-spacing: -.03em;
  margin-bottom: 1.5rem;
  background: none; -webkit-text-fill-color: initial;
}
.fp-hero__hl-line {
  display: block;
  font-size: clamp(3.2rem, 7.5vw, 6.2rem);
  color: var(--mist);
}
.fp-hero__hl-line--2 em {
  font-style: italic;
  background: linear-gradient(135deg, var(--sand) 0%, var(--mist) 50%, var(--ice) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.fp-hero__sub {
  font-size: clamp(.9rem, 1.8vw, 1.1rem);
  color: rgba(220,230,227,.65);
  line-height: 1.8;
  margin-bottom: 2.25rem;
  max-width: 540px;
  font-weight: 300;
}

.fp-hero__actions { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: 2.75rem; }

.fp-hero__trust {
  display: flex; align-items: center; gap: .85rem; flex-wrap: wrap;
}
.fp-trust__item {
  display: flex; align-items: center; gap: .4rem;
  font-size: .72rem; color: rgba(220,230,227,.5);
}
.fp-trust__item svg { color: var(--sand); flex-shrink: 0; }
.fp-trust__divider { width: 1px; height: 14px; background: rgba(200,178,138,.2); }

/* Scroll cue */
.fp-hero__scroll-cue {
  position: absolute; bottom: 2.5rem; left: 50%; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: .5rem; z-index: 5;
}
.fp-hero__scroll-track {
  width: 1px; height: 52px;
  background: rgba(200,178,138,.15);
  position: relative; overflow: hidden;
}
.fp-hero__scroll-dot {
  position: absolute; top: -8px; left: -2px;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--sand);
  animation: fpScroll 1.6s ease-in-out infinite;
}
@keyframes fpScroll { 0%{top:-8px;opacity:1} 100%{top:54px;opacity:0} }
.fp-hero__scroll-cue span {
  font-size: .58rem; color: rgba(200,178,138,.45);
  letter-spacing: .18em; text-transform: uppercase;
}

/* ══ TICKER ══ */
.fp-ticker {
  background: var(--surface-2);
  border-bottom: 1px solid rgba(200,178,138,.1);
  overflow: hidden;
  height: 36px;
}
.fp-ticker__inner {
  display: flex; align-items: center;
  height: 100%; gap: 1.5rem; overflow: hidden;
}
.fp-ticker__label {
  font-family: var(--font-body); font-size: .58rem;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--sand); opacity: .65; flex-shrink: 0;
  padding-left: var(--gutter);
  border-right: 1px solid rgba(200,178,138,.15);
  padding-right: 1.25rem; height: 100%;
  display: flex; align-items: center;
}
.fp-ticker__track {
  display: flex; align-items: center; gap: 1.5rem;
  animation: fpTick 28s linear infinite;
  white-space: nowrap;
  font-size: .72rem; color: rgba(238,245,242,.4);
  font-family: var(--font-body);
}
@keyframes fpTick { from{transform:translateX(0)} to{transform:translateX(-50%)} }
.fp-ticker__dot { color: rgba(200,178,138,.3); }

/* ══ SCENE 3: INTRO ══ */
.fp-intro {
  background: var(--surface);
  border-top: 1px solid rgba(200,178,138,.08);
  padding: clamp(5rem, 10vw, 8rem) var(--gutter);
}
.fp-intro__inner {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: clamp(3rem, 7vw, 7rem);
  max-width: var(--contain); margin: 0 auto;
  align-items: center;
}

.fp-intro__img-wrap {
  position: relative;
  padding-bottom: 3rem; padding-right: 3rem;
}
.fp-intro__img-primary {
  width: 100%; padding-bottom: 75%;
  background-size: cover; background-position: center;
  border-radius: 16px;
  filter: brightness(.8) saturate(.9);
  box-shadow: var(--shadow-lg);
}
.fp-intro__img-float {
  position: absolute; bottom: 0; right: 0;
  width: 55%; border-radius: 12px; overflow: hidden;
  border: 3px solid var(--surface);
  box-shadow: var(--shadow-md);
}
.fp-intro__img-secondary {
  width: 100%; padding-bottom: 75%;
  background-size: cover; background-position: center;
  filter: brightness(.8) saturate(.9);
}
.fp-intro__stat-card {
  position: absolute; top: 1.5rem; left: -1.5rem;
  background: rgba(23,53,44,.85);
  backdrop-filter: blur(20px);
  border: 1px solid rgba(200,178,138,.2);
  border-radius: 12px;
  padding: 1.1rem 1.4rem; text-align: center;
}
.fp-intro__stat-card strong {
  display: block;
  font-family: var(--font-serif); font-size: 2.2rem;
  color: var(--sand); font-weight: 300; line-height: 1;
}
.fp-intro__stat-card span {
  font-size: .68rem; color: rgba(200,178,138,.6);
  text-transform: uppercase; letter-spacing: .12em;
}

.fp-intro__right { display: flex; flex-direction: column; gap: 1.25rem; }
.fp-intro__eyebrow { font-family: var(--font-body); font-size: .62rem; letter-spacing: .26em; text-transform: uppercase; color: var(--sand); opacity: .75; }
.fp-intro__heading {
  font-family: var(--font-serif);
  font-size: clamp(1.9rem, 3.8vw, 3rem);
  font-weight: 300; color: var(--text); line-height: 1.1;
}
.fp-intro__heading em { font-style: italic; color: var(--sand); }
.fp-intro__body { font-size: .95rem; color: var(--muted); line-height: 1.88; }

.fp-intro__stats { display: flex; gap: 2.5rem; margin: .75rem 0; }
.fp-intro__stat { text-align: center; }
.fp-intro__stat strong {
  display: block; font-family: var(--font-serif); font-size: 2rem;
  color: var(--sand); font-weight: 300;
}
.fp-intro__stat span { font-size: .68rem; color: var(--faint); text-transform: uppercase; letter-spacing: .12em; }

/* ══ SCENE 4: IMAGE RAIL ══ */
.fp-rail {
  overflow: hidden; height: 200px;
  background: var(--surface-2);
  border-top: 1px solid rgba(200,178,138,.08);
  border-bottom: 1px solid rgba(200,178,138,.08);
}
.fp-rail__track {
  display: flex; gap: .75rem; height: 100%;
  animation: slideLeft 32s linear infinite;
  width: max-content;
}
.fp-rail__track img {
  height: 200px; width: 300px; object-fit: cover;
  border-radius: 8px; flex-shrink: 0;
  filter: brightness(.7) saturate(.85);
}

/* ══ SCENE 5: WORLDS ══ */
.fp-worlds {
  background: var(--surface-2);
  padding: clamp(5rem, 9vw, 8rem) var(--gutter);
}
.fp-worlds__inner { max-width: var(--contain); margin: 0 auto; }
.fp-worlds__header { text-align: center; max-width: 680px; margin: 0 auto 3.5rem; }

.fp-worlds__grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 1.25rem;
}
.fp-worlds__grid .fp-world-card:nth-child(3) {
  grid-row: span 2;
}

.fp-world-card {
  position: relative; border-radius: 18px; overflow: hidden;
  min-height: 280px; cursor: pointer;
  transition: transform .5s var(--ease), box-shadow .5s var(--ease);
  border: 1px solid rgba(200,178,138,.1);
}
.fp-world-card--tall { min-height: 580px; }
.fp-world-card:hover { transform: translateY(-6px); box-shadow: 0 28px 70px rgba(0,0,0,.5); border-color: rgba(200,178,138,.22); }

.fp-world-card__img {
  position: absolute; inset: 0;
  background: var(--bg, linear-gradient(135deg,var(--surface) 0%,var(--surface-2) 100%)) center/cover;
  filter: brightness(.55) saturate(.85);
  transition: filter .6s var(--ease), transform .7s var(--ease);
}
.fp-world-card:hover .fp-world-card__img {
  filter: brightness(.65) saturate(1);
  transform: scale(1.04);
}

.fp-world-card__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 30%, rgba(13,22,21,.92) 100%);
}

.fp-world-card__body {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 1.75rem;
  display: flex; flex-direction: column; gap: .5rem;
}
.fp-world-card__eyebrow { font-size: .6rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(200,178,138,.7); }
.fp-world-card__title {
  font-family: var(--font-serif); font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 300; color: var(--mist); line-height: 1.05;
}
.fp-world-card__copy { font-size: .82rem; color: rgba(220,230,227,.62); max-width: 260px; line-height: 1.6; }
.fp-world-card__link {
  display: inline-flex; align-items: center; gap: .45rem;
  font-size: .72rem; color: var(--sand); font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase; text-decoration: none;
  margin-top: .35rem; transition: gap .3s, color .3s;
}
.fp-world-card__link:hover { gap: .75rem; color: var(--mist); }

/* ══ SCENE 6: ITINERARIES ══ */
.fp-itineraries {
  position: relative; overflow: hidden;
  padding: clamp(5rem, 9vw, 8rem) var(--gutter);
}
.fp-itineraries__bg {
  position: absolute; inset: 0; z-index: 0;
}
.fp-itineraries__bg video {
  width: 100%; height: 100%; object-fit: cover;
  filter: brightness(.28) saturate(.75);
}
.fp-itineraries__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(13,22,21,.85) 0%, rgba(13,22,21,.65) 50%, rgba(13,22,21,.85) 100%);
}
.fp-itineraries__inner {
  position: relative; z-index: 2;
  max-width: var(--contain); margin: 0 auto;
}
.fp-itineraries__header { text-align: center; max-width: 600px; margin: 0 auto 3.5rem; }

/* Itinerary grid */
.fp-itin-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
  margin-bottom: 3rem;
}

.fp-itin-card {
  position: relative; border-radius: 18px; overflow: hidden;
  min-height: 360px; cursor: pointer;
  background: var(--glass);
  border: 1px solid rgba(200,178,138,.12);
  backdrop-filter: blur(18px);
  transition: all .5s var(--ease);
  display: flex; flex-direction: column;
}
.fp-itin-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 28px 70px rgba(0,0,0,.55);
  border-color: rgba(200,178,138,.28);
}

.fp-itin-card__img {
  height: 200px; flex-shrink: 0;
  background-size: cover; background-position: center;
  filter: brightness(.72) saturate(.85);
  transition: filter .6s, transform .7s var(--ease);
}
.fp-itin-card:hover .fp-itin-card__img {
  filter: brightness(.82) saturate(1);
  transform: scale(1.04);
}

.fp-itin-card__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(13,22,21,.88) 100%);
  pointer-events: none;
}

.fp-itin-card__badge {
  position: absolute; top: 1rem; left: 1rem; z-index: 3;
  background: rgba(23,53,44,.85); backdrop-filter: blur(8px);
  border: 1px solid rgba(200,178,138,.22);
  color: var(--sand); padding: .3rem .75rem;
  border-radius: 6px; font-size: .65rem; font-weight: 700; letter-spacing: .08em;
}
.fp-itin-card__ribbon {
  position: absolute; top: 1rem; right: 1rem; z-index: 3;
  background: rgba(200,178,138,.85); color: var(--surface);
  padding: .3rem .75rem; border-radius: 6px;
  font-size: .62rem; font-weight: 700; letter-spacing: .07em;
}

.fp-itin-card__body {
  padding: 1.5rem; flex-grow: 1; display: flex; flex-direction: column; gap: .6rem;
  position: relative; z-index: 2;
}
.fp-itin-card__body h3 {
  font-family: var(--font-serif); font-size: 1.2rem;
  color: var(--mist); font-weight: 400; margin: 0;
}
.fp-itin-card__body p { font-size: .83rem; color: var(--muted); margin: 0; }
.fp-itin-card__prices {
  display: flex; gap: .5rem; flex-wrap: wrap; margin-top: auto;
}
.fp-itin-card__prices span {
  font-size: .68rem; color: rgba(220,230,227,.55);
  background: rgba(23,53,44,.5); padding: .25rem .65rem; border-radius: 20px;
}
.fp-itin-card__cta {
  display: inline-flex; align-items: center;
  font-size: .75rem; color: var(--sand); font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase;
  background: transparent; border: none; cursor: pointer;
  padding: 0; margin-top: .35rem; font-family: var(--font-body);
  transition: letter-spacing .3s, color .3s;
}
.fp-itin-card__cta:hover { letter-spacing: .14em; color: var(--mist); }

/* Custom CTA card */
.fp-itin-card--cta {
  background: linear-gradient(135deg, rgba(23,53,44,.65) 0%, rgba(16,36,29,.75) 100%);
  border-color: rgba(200,178,138,.18);
  min-height: 360px;
  display: flex; align-items: center; justify-content: center;
}
.fp-itin-cta__body {
  padding: 2rem; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 1rem;
}
.fp-itin-cta__body h3 {
  font-family: var(--font-serif); font-size: 1.8rem;
  color: var(--mist); font-weight: 300;
}
.fp-itin-cta__body p { font-size: .88rem; color: var(--muted); }

.fp-itineraries__footer { text-align: center; padding-top: 1.5rem; }

/* ══ SCENE 7: ARUSHA HUB ══ */
.fp-arusha {
  position: relative; overflow: hidden;
  padding: clamp(5rem, 9vw, 8rem) var(--gutter);
  background: var(--surface);
}
.fp-arusha__bg { position: absolute; inset: 0; }
.fp-arusha__bg video {
  width: 100%; height: 100%; object-fit: cover;
  filter: brightness(.32) saturate(.85);
}
.fp-arusha__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(13,22,21,.6) 0%, rgba(13,22,21,.88) 100%);
}
.fp-arusha__inner {
  position: relative; z-index: 2;
  max-width: var(--contain); margin: 0 auto;
}
.fp-arusha__header {
  max-width: 700px; margin-bottom: 3.5rem;
}
.fp-arusha__title {
  font-family: var(--font-serif);
  font-size: clamp(2.2rem, 5vw, 4rem);
  font-weight: 300; color: var(--text); line-height: 1.05;
  margin-bottom: 1rem;
}
.fp-arusha__title em { font-style: italic; color: var(--sand); }
.fp-arusha__sub { font-size: .95rem; color: var(--muted); line-height: 1.85; margin-bottom: 1.75rem; }
.fp-arusha__actions { display: flex; gap: 1rem; flex-wrap: wrap; }

.fp-arusha__cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1.25rem;
}

/* ══ SCENE 8: LODGES ══ */
.fp-lodges {
  background: var(--surface-2);
  padding: clamp(5rem, 9vw, 8rem) var(--gutter);
  border-top: 1px solid rgba(200,178,138,.08);
}
.fp-lodges__inner { max-width: var(--contain); margin: 0 auto; }
.fp-lodges__header {
  text-align: center; max-width: 600px; margin: 0 auto 3.5rem;
  display: flex; flex-direction: column; align-items: center; gap: .75rem;
}
.fp-lodges__header p { font-size: .92rem; color: var(--muted); }

.fp-lodges__grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem;
}

.fp-lodge-card {
  background: var(--glass); border: 1px solid rgba(200,178,138,.12);
  border-radius: 16px; overflow: hidden;
  backdrop-filter: blur(16px);
  transition: all .45s var(--ease);
}
.fp-lodge-card:hover {
  transform: translateY(-7px);
  border-color: rgba(200,178,138,.28);
  box-shadow: var(--shadow-md);
}
.fp-lodge-card__img {
  height: 220px; background-size: cover; background-position: center;
  filter: brightness(.72) saturate(.85);
  transition: filter .6s, transform .7s var(--ease);
}
.fp-lodge-card:hover .fp-lodge-card__img { filter: brightness(.82) saturate(1); transform: scale(1.04); }
.fp-lodge-card__body { padding: 1.5rem; }
.fp-lodge-card__meta { font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; color: var(--sand); opacity: .7; display: block; margin-bottom: .5rem; }
.fp-lodge-card__body h3 { font-family: var(--font-serif); font-size: 1.15rem; color: var(--text); font-weight: 400; margin-bottom: .5rem; }
.fp-lodge-card__body p { font-size: .84rem; color: var(--muted); margin-bottom: 1rem; }
.fp-lodge-card__link {
  font-size: .75rem; color: var(--sand); font-weight: 600;
  letter-spacing: .08em; text-transform: uppercase; text-decoration: none;
  border-bottom: 1px solid rgba(200,178,138,.28); padding-bottom: 2px;
  transition: all .3s;
}
.fp-lodge-card__link:hover { color: var(--mist); border-bottom-color: var(--sand); }

.fp-lodges__cta { text-align: center; margin-top: 2.5rem; }

/* ══ SCENE 11: FINAL CTA ══ */
.fp-final-cta {
  position: relative; overflow: hidden;
  padding: clamp(6rem, 12vw, 10rem) var(--gutter);
  text-align: center;
}
.fp-final-cta__bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  filter: brightness(.28) saturate(.75);
}
.fp-final-cta__overlay {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 100% 80% at 50% 100%, rgba(23,53,44,.5) 0%, transparent 65%),
    rgba(13,22,21,.7);
}
.fp-final-cta__particles {
  position: absolute; inset: 0; pointer-events: none;
}
.fp-final-cta__inner {
  position: relative; z-index: 2;
  max-width: 720px; margin: 0 auto;
  display: flex; flex-direction: column; align-items: center; gap: 1.25rem;
}
.fp-final-cta__title {
  font-family: var(--font-serif);
  font-size: clamp(2.5rem, 6vw, 4.5rem);
  font-weight: 300; color: var(--mist); line-height: 1.05; margin: 0;
}
.fp-final-cta__title em { font-style: italic; color: var(--sand); }
.fp-final-cta__sub { font-size: .95rem; color: var(--muted); }
.fp-final-cta__actions { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: center; }

/* ══ FRONT-PAGE RESPONSIVE ══ */
@media (max-width: 1100px) {
  .fp-worlds__grid { grid-template-columns: 1fr 1fr; }
  .fp-worlds__grid .fp-world-card:nth-child(3) { grid-row: span 1; }
  .fp-world-card--tall { min-height: 280px; }
  .fp-itin-grid { grid-template-columns: 1fr 1fr; }
  .fp-lodges__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .fp-intro__inner { grid-template-columns: 1fr; }
  .fp-intro__left { display: none; }
  .fp-worlds__grid { grid-template-columns: 1fr 1fr; gap: 1rem; }
  .fp-world-card { min-height: 240px; }
  .fp-itin-grid { grid-template-columns: 1fr; }
  .fp-itin-card { min-height: auto; }
  .fp-itin-card__img { height: 180px; }
  .fp-lodges__grid { grid-template-columns: 1fr; }
  .fp-arusha__cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
  .fp-worlds__grid { grid-template-columns: 1fr; }
  .fp-arusha__cards { grid-template-columns: 1fr; }
  .fp-hero__hl-line { font-size: clamp(2.8rem, 12vw, 4rem); }
}
/* =========================================================
   BEAST OF AFRICA — HEADER v10
   Luxury Safari UI
========================================================= */

:root{
    --boa-bg:#070707;
    --boa-panel:#0f1114;
    --boa-panel-2:#16191d;
    --boa-text:#f5f1e8;
    --boa-muted:#b7b1a6;
    --boa-line:rgba(255,255,255,.08);
    --boa-gold:#d7b06a;
    --boa-gold-2:#f1d29b;
    --boa-green:#25D366;

    --boa-radius:24px;
    --boa-shadow:
        0 10px 40px rgba(0,0,0,.35),
        0 2px 10px rgba(0,0,0,.2);

    --boa-trans:cubic-bezier(.22,.61,.36,1);
}

/* =========================================================
   RESET
========================================================= */

.boa-header *,
.boa-header *::before,
.boa-header *::after{
    box-sizing:border-box;
}

.boa-header a{
    text-decoration:none;
}

/* =========================================================
   HEADER WRAP
========================================================= */

.boa-header{
    position:sticky;
    top:0;
    z-index:9999;
    width:100%;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
}

/* =========================================================
   TOPBAR
========================================================= */

.boa-topbar{
    background:
        linear-gradient(
            90deg,
            rgba(215,176,106,.12),
            rgba(255,255,255,.03)
        ),
        #090909;

    border-bottom:1px solid var(--boa-line);
}

.boa-topbar__inner{
    max-width:1440px;
    margin:auto;
    padding:10px 34px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
}

.boa-topbar__left,
.boa-topbar__right{
    display:flex;
    align-items:center;
    gap:14px;
}

.boa-topbar__pulse{
    width:8px;
    height:8px;
    border-radius:999px;
    background:var(--boa-gold);
    box-shadow:0 0 18px var(--boa-gold);
    animation:boaPulse 2s infinite;
}

@keyframes boaPulse{
    0%{transform:scale(1);opacity:1;}
    50%{transform:scale(1.8);opacity:.4;}
    100%{transform:scale(1);opacity:1;}
}

.boa-topbar__tagline{
    color:var(--boa-muted);
    font-size:.78rem;
    letter-spacing:.18em;
    text-transform:uppercase;
    font-weight:500;
}

.boa-topbar__link,
.boa-topbar__wa{
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#ddd;
    font-size:.8rem;
    transition:.35s var(--boa-trans);
}

.boa-topbar__link:hover,
.boa-topbar__wa:hover{
    color:var(--boa-gold);
}

.boa-topbar__sep{
    width:1px;
    height:14px;
    background:rgba(255,255,255,.12);
}

/* =========================================================
   MAIN HEADER
========================================================= */

.boa-header__main{
    background:rgba(7,7,7,.72);
    border-bottom:1px solid rgba(255,255,255,.05);
}

.boa-header__inner{
    max-width:1440px;
    margin:auto;
    padding:18px 34px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:26px;
}

/* =========================================================
   BRAND
========================================================= */

.boa-brand{
    display:flex;
    align-items:center;
    gap:16px;
    flex-shrink:0;
}

.boa-brand__mark{
    position:relative;
    width:58px;
    height:58px;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:
        radial-gradient(circle at top, rgba(215,176,106,.28), transparent 70%),
        rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.06);
}

.boa-brand__mark img{
    width:42px;
    height:42px;
    object-fit:contain;
    position:relative;
    z-index:2;
}

.boa-brand__ring{
    position:absolute;
    inset:-6px;
    border-radius:50%;
    border:1px solid rgba(215,176,106,.28);
    animation:boaSpin 18s linear infinite;
}

@keyframes boaSpin{
    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}
}

.boa-brand__copy{
    display:flex;
    flex-direction:column;
}

.boa-brand__name{
    color:var(--boa-text);
    font-size:1.35rem;
    font-weight:600;
    line-height:1;
    letter-spacing:.02em;
}

.boa-brand__name em{
    color:var(--boa-gold);
    font-style:italic;
    font-weight:400;
}

.boa-brand__sub{
    margin-top:6px;
    color:var(--boa-muted);
    font-size:.72rem;
    text-transform:uppercase;
    letter-spacing:.16em;
}

/* =========================================================
   NAVIGATION
========================================================= */

.boa-nav{
    flex:1;
    display:flex;
    justify-content:center;
}

.boa-nav__list{
    display:flex;
    align-items:center;
    gap:6px;
    list-style:none;
    margin:0;
    padding:10px;
    border-radius:999px;
    background:rgba(255,255,255,.03);
    border:1px solid rgba(255,255,255,.06);
    backdrop-filter:blur(10px);
}

.boa-nav__list li{
    position:relative;
    margin:0;
    padding:0;
    list-style:none;
}

.boa-nav__list > li > a{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:14px 18px;
    border-radius:999px;
    color:#e7e1d7;
    font-size:.9rem;
    font-weight:500;
    transition:.35s var(--boa-trans);
    overflow:hidden;
}

.boa-nav__list > li > a::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            135deg,
            rgba(215,176,106,.18),
            transparent
        );
    opacity:0;
    transition:.35s ease;
}

.boa-nav__list > li > a:hover::before{
    opacity:1;
}

.boa-nav__list > li > a:hover{
    color:#fff;
    transform:translateY(-1px);
}

.boa-nav__list .current-menu-item > a,
.boa-nav__list .current-menu-parent > a,
.boa-nav__list .current-menu-ancestor > a{
    background:rgba(215,176,106,.14);
    color:var(--boa-gold-2);
}

/* =========================================================
   DROPDOWN
========================================================= */

.boa-nav__list .sub-menu{
    position:absolute;
    top:calc(100% + 16px);
    left:0;
    min-width:260px;
    padding:12px;
    margin:0;
    list-style:none;

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.04),
            rgba(255,255,255,.02)
        ),
        rgba(10,10,10,.96);

    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;

    opacity:0;
    visibility:hidden;
    transform:translateY(12px);

    transition:.35s var(--boa-trans);

    box-shadow:var(--boa-shadow);
}

.boa-nav__list li:hover > .sub-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.boa-nav__list .sub-menu li{
    width:100%;
}

.boa-nav__list .sub-menu a{
    display:flex;
    width:100%;
    padding:14px 16px;
    border-radius:16px;
    color:#e9e3d8;
    transition:.3s ease;
}

.boa-nav__list .sub-menu a:hover{
    background:rgba(215,176,106,.12);
    color:#fff;
}

/* =========================================================
   ACTIONS
========================================================= */

.boa-actions{
    display:flex;
    align-items:center;
    gap:12px;
    flex-shrink:0;
}

.boa-act-wa{
    display:flex;
    align-items:center;
    gap:8px;
    padding:13px 18px;
    border-radius:999px;
    background:rgba(37,211,102,.12);
    border:1px solid rgba(37,211,102,.18);
    color:#dfffe9;
    transition:.35s var(--boa-trans);
}

.boa-act-wa:hover{
    transform:translateY(-2px);
    background:rgba(37,211,102,.2);
}

.boa-act-cta{
    position:relative;
    overflow:hidden;

    display:flex;
    align-items:center;
    gap:10px;

    padding:14px 22px;

    border-radius:999px;

    background:
        linear-gradient(
            135deg,
            #d7b06a,
            #f0d099
        );

    color:#111;
    font-weight:700;

    transition:.4s var(--boa-trans);

    box-shadow:
        0 8px 24px rgba(215,176,106,.28);
}

.boa-act-cta:hover{
    transform:translateY(-2px) scale(1.02);
}

.boa-act-cta__shimmer{
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            120deg,
            transparent 0%,
            rgba(255,255,255,.4) 50%,
            transparent 100%
        );

    transform:translateX(-120%);
    animation:boaShimmer 4s infinite;
}

@keyframes boaShimmer{
    to{
        transform:translateX(120%);
    }
}

/* =========================================================
   HAMBURGER
========================================================= */

.boa-hamburger{
    width:54px;
    height:54px;
    border:none;
    border-radius:18px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.06);

    display:none;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;

    cursor:pointer;
}

.boa-hamburger__line{
    width:22px;
    height:2px;
    background:#fff;
    border-radius:999px;
}

/* =========================================================
   MOBILE DRAWER
========================================================= */

.boa-drawer{
    position:fixed;
    inset:0;
    z-index:10000;
    pointer-events:none;
}

.boa-drawer.is-open{
    pointer-events:auto;
}

.boa-drawer__bd{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.72);
    backdrop-filter:blur(12px);

    opacity:0;
    transition:.4s ease;
}

.boa-drawer.is-open .boa-drawer__bd{
    opacity:1;
}

.boa-drawer__panel{
    position:absolute;
    top:0;
    right:0;

    width:min(92vw,420px);
    height:100vh;

    padding:30px;

    background:#0a0a0a;

    border-left:1px solid rgba(255,255,255,.08);

    transform:translateX(100%);
    transition:.45s var(--boa-trans);

    overflow-y:auto;
}

.boa-drawer.is-open .boa-drawer__panel{
    transform:translateX(0);
}

.boa-drawer__head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:34px;
}

.boa-drawer__brand{
    display:flex;
    align-items:center;
    gap:12px;
    color:#fff;
    font-weight:600;
}

.boa-drawer__x{
    width:48px;
    height:48px;
    border:none;
    border-radius:16px;
    background:rgba(255,255,255,.06);
    color:#fff;
    cursor:pointer;
}

.boa-drawer__list{
    list-style:none;
    margin:0;
    padding:0;
}

.boa-drawer__list li{
    margin-bottom:10px;
}

.boa-drawer__list a{
    display:flex;
    align-items:center;
    gap:16px;

    padding:18px 18px;

    border-radius:18px;

    background:rgba(255,255,255,.03);

    color:#fff;

    transition:.35s ease;
}

.boa-drawer__list a:hover{
    background:rgba(215,176,106,.14);
}

.boa-drawer__num{
    color:var(--boa-gold);
    font-size:.78rem;
    letter-spacing:.12em;
}

.boa-drawer__ctas{
    display:flex;
    flex-direction:column;
    gap:14px;
    margin-top:34px;
}

.boa-drawer__wa,
.boa-drawer__plan{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;

    padding:18px;

    border-radius:18px;

    font-weight:600;
}

.boa-drawer__wa{
    background:rgba(37,211,102,.12);
    color:#fff;
}

.boa-drawer__plan{
    background:linear-gradient(135deg,#d7b06a,#f0d099);
    color:#111;
}

.boa-drawer__foot{
    margin-top:40px;
    padding-top:24px;
    border-top:1px solid rgba(255,255,255,.08);
}

.boa-drawer__foot p{
    color:#999;
    margin:0 0 8px;
}

.boa-drawer__foot a{
    color:#fff;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:1200px){

    .boa-nav{
        display:none;
    }

    .boa-hamburger{
        display:flex;
    }
}

@media(max-width:820px){

    .boa-topbar{
        display:none;
    }

    .boa-header__inner{
        padding:16px 18px;
    }

    .boa-brand__sub{
        display:none;
    }

    .boa-act-wa{
        display:none;
    }

    .boa-brand__name{
        font-size:1.05rem;
    }

    .boa-brand__mark{
        width:52px;
        height:52px;
    }

    .boa-act-cta{
        padding:13px 16px;
        font-size:.86rem;
    }
}

@media(max-width:560px){

    .boa-header__inner{
        gap:14px;
    }

    .boa-brand{
        gap:10px;
    }

    .boa-brand__copy{
        max-width:120px;
    }

    .boa-act-cta__text{
        display:none;
    }

    .boa-act-cta{
        width:52px;
        height:52px;
        padding:0;
        justify-content:center;
    }

    .boa-drawer__panel{
        width:100%;
    }
}
/* ── Hero video fix v8 ── */
#heroVideoWrap {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
#heroVideoWrap video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 1.4s ease;
}
#heroVideoWrap video.ready {
  opacity: 1;
}
/* ═══════════════════════════════════════════════════
   GLOBAL VIDEO BG — override global img/video reset
   ROOT CAUSE: "img,video { max-width:100% }" at line 91
   caps the video width on desktop to the container
   width instead of the viewport, making it render as
   a block element pushing content down instead of
   sitting fixed behind everything.
═══════════════════════════════════════════════════ */

#boaVideoBg {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  max-width: none !important;
  max-height: none !important;
  z-index: -1 !important;
  pointer-events: none !important;
  transform: none !important;
  will-change: auto !important;
  overflow: hidden !important;
}

#boaVideoBg video,
#boaGlobalVideo {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center 40% !important;
  display: block !important;
  filter: brightness(.38) saturate(1.08) contrast(1.04) !important;
  transform: translate3d(0,0,0) !important;
  will-change: filter !important;
}