/*
Theme Name: Intare
Theme URI: https://www.intaresafaris.com
Author: Intare
Author URI: https://www.intaresafaris.com
Description: Luxury tailor-made African safari theme. Converted from the safari-site-clone design study — fixed dual-bar header with four-column mega menus, voyage hero slider, Rwanda Atlas band, tour cards, split-why panel, torn-edge activity cards, pinned zoom CTA and a full four-column premium footer.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: intare
Tags: travel, tourism, safari, custom-menu, custom-logo, featured-images, translation-ready
*/

/* =====================================================================
   1. PORTED DESIGN CSS  (from safari-site-clone.html <style> block 1)
   ===================================================================== */
:root{
  --green:#21362C; --green-2:#2D4A3E; --gold:#BD955C; --gold-lt:#D4A76A; --gold-dk:#9E7B45;
  --cream:#FFFFF0; --stone:#F8F6F3; --body:#4a4a4a;
  --serif:"Lustria",Georgia,serif;
  --serif-d:"Lustria",Georgia,serif;
  --script:"Monsieur La Doulaise",cursive;
  --sans:"Inter","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
/* Nothing on the site actually overflows the document horizontally: the only
   boxes that reach past the viewport are the off-canvas .mobile-nav (fixed, so
   it never joins the scrollable area), the contact form honeypot parked off to
   the left, and hero decorations already clipped by their own sections. This
   rule is the guard rail against a future leak, not a fix for a current one.
   It has to be `clip` rather than `hidden`, because `hidden` on either element
   turns it into a scroll container and silently breaks every position:sticky
   descendant on the site. `hidden` is kept first as the fallback for Safari
   below 16, which does not know `clip` and will drop the second declaration. */
html,body{overflow-x:hidden;overflow-x:clip;max-width:100%}
body{margin:0;padding:0;color:#444;background:var(--cream);font-family:var(--sans);font-weight:300;font-size:16px;line-height:1.6}
h1,h2,h3,h4,h5,h6{margin-top:0;color:var(--green);font-weight:400;letter-spacing:0}
a{text-decoration:none}
img{max-width:100%}
.container{padding-left:20px;padding-right:20px}
.section-label{display:inline-block;background:rgba(189,149,92,.15);color:var(--gold-dk);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:3px;padding:8px 20px;border-radius:30px;margin-bottom:20px}
.section-heading{font-family:var(--serif);font-size:42px;color:var(--green);margin-bottom:15px}
.section-divider{width:60px;height:3px;background:var(--gold-dk);margin:0 auto 50px}
.luxury-content{max-width:700px;margin:0 auto;text-align:left;line-height:1.8}
.luxury-content p{margin-bottom:28px;font-size:17px;color:var(--body);font-weight:300}
.text-center-p{text-align:center}

/* ---------- HEADER ---------- */
.safari-header{position:fixed;top:0;left:0;right:0;z-index:9999;transition:all .3s ease}
/* The header is its own element, not an overlay on the hero.
   It sits in the flow above the hero and sticks to the top as you scroll, so
   the photograph is never underneath the menu. Nothing about the nav depends
   on what the current slide looks like, which is what made every overlay
   treatment a compromise.
   Scoped to the homepage: inner pages keep the fixed header their large
   .page-shell / .page-hero top padding is built around. */
/* Not pinned. The header sits in normal flow at the top of the page and
   scrolls away with everything else, so it never covers the photograph and
   never follows you down the page. No content offset is needed because it
   occupies its own space rather than floating above it. */
body.home .safari-header{position:relative;top:auto}
body.home.admin-bar .safari-header{top:auto}
body.home .header-top-bar{background:#D8C3A5}
body.home .main-nav{background:var(--green)}
body.home .safari-header.scrolled .main-nav{background:rgba(33,54,44,.97);backdrop-filter:none;-webkit-backdrop-filter:none}

/* The hero takes the viewport that is left once the header has its share, so
   header + hero still fill exactly one screen. */
:root{--intare-hdr:114px}
@media (max-width:991px){:root{--intare-hdr:107px}}
body.home .vhero{height:calc(100vh - var(--intare-hdr));min-height:520px}
body.home.admin-bar .vhero{height:calc(100vh - var(--intare-hdr) - 32px)}
@media screen and (max-width:782px){body.home.admin-bar .vhero{height:calc(100vh - var(--intare-hdr) - 46px)}}
/* Top bar: sand ground, deep green type. Dark green on #D8C3A5 measures about
   8.2:1, so the contact strip reads cleanly on every page state. */
.header-top-bar{background:#D8C3A5;padding:2px 0;border-bottom:1px solid rgba(24,49,40,.16);transition:all .3s ease}
.safari-header.scrolled .header-top-bar{background:#D8C3A5}
.top-bar-content{display:flex;justify-content:space-between;align-items:center}
.top-bar-left{display:flex;gap:22px;flex-wrap:wrap}
.top-contact{display:flex;align-items:center;gap:8px;color:#183128;font-size:13px;transition:color .3s}
.top-contact:hover{color:#0C1A14;text-decoration:underline;text-underline-offset:3px}
.top-contact i{color:#183128;font-size:12px}
.social-links{display:flex;gap:12px}
/* Gold on sand is far too close in value, so the social chips take the same
   deep green as the type, on a faint green wash. */
.social-links a{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(24,49,40,.10);color:#183128;font-size:12px;transition:all .3s}
.social-links a:hover{background:#183128;color:#D8C3A5;transform:translateY(-2px)}
.main-nav{background:transparent;padding:2px 0;transition:all .3s ease}
.main-nav.scrolled{background:rgba(33,54,44,.95);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);padding:8px 0;box-shadow:0 4px 20px rgba(0,0,0,.2)}
.nav-wrapper{display:flex;align-items:center;justify-content:space-between;position:relative}
.nav-links{display:flex;align-items:center;list-style:none;margin:0;padding:0;flex:1}
.nav-right{justify-content:flex-end}
.nav-link{display:flex;align-items:center;gap:6px;padding:10px 14px;color:#fff;font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:1.5px;transition:all .3s;white-space:nowrap}
.nav-link:hover,.nav-link:focus{color:var(--gold)}
.nav-link i{font-size:8px;transition:transform .3s}
.nav-logo{flex-shrink:0;display:block}
.nav-logo svg{height:100px;width:auto;transition:height .3s}
.main-nav.scrolled .nav-logo svg{height:80px}
.has-dropdown{position:static}
.mega-menu{position:absolute;top:100%;left:0;transform:translateY(10px);width:100%;background:var(--green);border-radius:12px;padding:30px;opacity:0;visibility:hidden;transition:all .3s;box-shadow:0 15px 50px rgba(0,0,0,.4);z-index:100}
.has-dropdown:hover .mega-menu,
.has-dropdown:focus-within>.mega-menu{opacity:1;visibility:visible;transform:translateY(0)}
.has-dropdown:hover>.nav-link i,
.has-dropdown:focus-within>.nav-link i{transform:rotate(180deg)}
.mega-menu-content{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.mega-menu.narrow{width:min(450px,calc(100vw - 40px))}
.mega-menu.narrow .mega-menu-content{grid-template-columns:repeat(2,1fr)}
.mega-menu-section h4{color:var(--gold);font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin:0 0 15px;padding-bottom:10px;border-bottom:1px solid rgba(189,149,92,.3)}
.mega-menu-section ul{list-style:none;padding:0;margin:0}
.mega-menu-section ul li a{display:flex;align-items:center;gap:8px;padding:8px 0;color:rgba(255,255,255,.8);font-size:14px;font-weight:300;transition:all .3s}
.mega-menu-section ul li a i{color:var(--gold);font-size:10px;transition:transform .3s}
.mega-menu-section ul li a:hover{color:var(--gold)}
.mega-menu-section ul li a:hover i{transform:translateX(3px)}
.mega-all{color:var(--gold)!important;font-weight:700!important}
.cta-button{background:linear-gradient(135deg,var(--gold),var(--gold-lt));color:var(--green)!important;padding:12px 26px;border-radius:9999px;font-weight:700;letter-spacing:.5px;box-shadow:0 10px 25px rgba(189,149,92,.25);transition:transform .2s,box-shadow .2s,background .2s}
.cta-button:hover{background:linear-gradient(135deg,var(--gold-lt),#E8C088);color:var(--green)!important;transform:translateY(-2px);box-shadow:0 14px 35px rgba(189,149,92,.32)}
.mobile-menu-btn{display:none;background:none;border:none;padding:8px}
.hamburger-line{display:block;width:24px;height:2px;background:#fff;margin:5px 0;transition:.3s}

/* mobile drawer */
.mobile-nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;visibility:hidden;transition:.3s;z-index:9998}
.mobile-nav-overlay.open{opacity:1;visibility:visible}
.mobile-nav{position:fixed;top:0;right:-320px;width:320px;max-width:85vw;height:100%;background:var(--green);z-index:9999;transition:right .35s ease;overflow-y:auto}
.mobile-nav.open{right:0}
.mobile-nav-header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid rgba(189,149,92,.25)}
.mobile-nav-header svg{height:64px}
.mobile-close-btn{background:none;border:none;color:var(--gold);font-size:22px}
.mobile-menu,.mobile-submenu{list-style:none;margin:0;padding:0}
.mobile-menu>li>a{display:flex;justify-content:space-between;align-items:center;padding:15px 22px;color:#fff;font-size:14px;text-transform:uppercase;letter-spacing:1.5px;border-bottom:1px solid rgba(255,255,255,.07)}
.mobile-submenu{max-height:0;overflow:hidden;transition:max-height .35s ease;background:rgba(0,0,0,.18)}
/* The cap only exists so max-height can be transitioned (auto cannot be).
   It must clear the tallest drawer sub-menu: Safari Packages runs to ~1130px
   with its four column captions, so 900px silently clipped its last links. */
.mobile-submenu.open{max-height:2000px}
.mobile-submenu li a{display:block;padding:11px 34px;color:rgba(255,255,255,.75);font-size:13px}


/* ================= VOYAGE HERO ================= */
/* A deeper base than the brand green. It shows while a slide is still loading
   and during the cross-fade between slides, so a darker value stops the pale
   flash that made the volcano frame look washed out on arrival. */
.vhero{position:relative;height:100vh;min-height:560px;overflow:hidden;background:#0E1A14}
.vh-bgs,.vh-bg{position:absolute;inset:0}
/* The slides are 4:3 (the gorilla is nearly square) inside a ~1.8:1 frame, so
   cover discards a quarter to a third of their height. At 50% that loss is
   split evenly and eats the sky, the volcano peaks and the gorilla's head —
   all of which sit in the upper half. Biasing to 30% keeps the subject and
   sheds the foreground instead. */
.vh-bg{background-size:cover;background-position:50% 30%;opacity:0;transition:opacity .4s ease;filter:saturate(1.12) contrast(1.06)}
.vh-bg.active{opacity:1}
.vh-expand{position:absolute;display:none;object-fit:cover;z-index:3;border-radius:6px;will-change:left,top,width,height}
/* The top vignette is gone: the masthead band above now carries the nav, and
   stacking both made the sky muddy. Back to the original two layers. */
/* Layer 1 is a flat, even wash across the whole frame. It deepens the images
   and evens out the four slides: the volcano dawn is much brighter than the
   gorilla, so without it the hero visibly changes weight on every rotation. */
.vh-shade{position:absolute;inset:0;z-index:4;background:linear-gradient(rgba(13,23,18,.28),rgba(13,23,18,.28)),linear-gradient(75deg,rgba(13,23,18,.72) 0%,rgba(13,23,18,.25) 45%,rgba(13,23,18,.05) 70%),linear-gradient(to top,rgba(13,23,18,.8) 0%,rgba(13,23,18,0) 40%);pointer-events:none}
.vh-mark{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);z-index:4;font-family:var(--sans);font-weight:700;font-size:clamp(90px,14vw,220px);letter-spacing:.08em;color:transparent;-webkit-text-stroke:1px rgba(255,255,240,.10);pointer-events:none;user-select:none}
/* The copy column is wide enough that the authored <br> in each title is the
   only break. At 640px the longest titles wrapped to four lines and climbed
   into the fixed header. */
.vh-copy{position:absolute;left:6%;right:6%;bottom:16%;z-index:6;max-width:min(820px,52vw)}
.vh-title{font-family:var(--serif);font-weight:400;font-size:clamp(40px,5.4vw,84px);line-height:1.04;color:#F7F3E7;margin:0 0 18px;text-shadow:0 4px 40px rgba(0,0,0,.45)}
.vh-loc{display:flex;align-items:center;gap:9px;font-size:13px;letter-spacing:1.5px;color:rgba(255,255,240,.75);margin-bottom:28px}
.vh-loc svg{width:16px;height:16px;color:var(--gold-lt,#D4A76A)}
.vh-cta{z-index:6}
/* rail */
.vh-rail{position:absolute;right:5%;bottom:9%;z-index:6;display:flex;flex-direction:column;align-items:flex-end;gap:22px}
.vh-thumbs{display:flex;gap:16px}
.vh-card{position:relative;width:150px;border:0;padding:0;background:transparent;cursor:pointer;transition:transform .35s cubic-bezier(.22,1,.36,1);outline:none;-webkit-appearance:none;appearance:none}
/* Gold double-ring medallion: gradient band via padding, hairline inside and out. */
.vh-card-ring{position:relative;display:block;width:150px;height:150px;padding:6px;border-radius:50%;background:linear-gradient(150deg,var(--gold-lt) 0%,var(--gold-dk) 52%,var(--gold-lt) 100%);box-shadow:0 0 0 1px rgba(212,167,106,.55),0 18px 40px rgba(0,0,0,.5)}
.vh-card-ring:after{content:"";position:absolute;inset:4px;border-radius:50%;border:1px solid rgba(247,243,231,.4);pointer-events:none;z-index:2}
.vh-card-photo{display:block;width:100%;height:100%;border-radius:50%;overflow:hidden;background:#0d1712}
.vh-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.vh-card:hover{transform:translateY(-6px)}
.vh-card:hover img{transform:scale(1.06)}
.vh-card:focus-visible .vh-card-ring{box-shadow:0 0 0 3px var(--gold),0 18px 40px rgba(0,0,0,.5)}
.vh-card.current{display:none}
.vh-card-cap{display:block;position:static;padding:0;margin-top:13px;background:none;text-align:center}
.vh-card-cap b{display:block;font-family:var(--serif);font-weight:400;font-size:13.5px;color:#F7F3E7;line-height:1.25}
.vh-card-cap i{display:block;font-style:normal;font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:rgba(255,255,240,.6);margin-top:3px}
.vh-meta{display:flex;align-items:center;gap:18px}
.vh-arrows{display:flex;gap:10px}
.vh-arrow{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,240,.35);background:transparent;color:#F7F3E7;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.3s}
.vh-arrow svg{width:17px;height:17px}
.vh-arrow:hover{border-color:var(--gold-lt);color:var(--gold-lt);transform:translateX(0) scale(1.05)}
/* The numeric slide counter was removed; the progress bar takes the space it
   left so the arrows are not stranded against the rail edge. */
.vh-prog{flex:1;min-width:110px;max-width:190px;height:2px;background:rgba(255,255,240,.2);border-radius:2px;overflow:hidden}
.vh-prog span{display:block;height:100%;width:0;background:var(--gold-lt,#D4A76A)}
.vh-prog span.run{animation:vhprog var(--vh-dur,6.5s) linear forwards}
@keyframes vhprog{from{width:0}to{width:100%}}
@media (max-width:991px){
  /* The hero lost the header's height, so the percentage positions sit closer
     together than they did at full viewport height. */
  .vh-copy{left:22px;right:22px;bottom:43%;max-width:none}
  .vh-title{font-size:clamp(38px,10vw,58px)}
  .vh-rail{left:22px;right:22px;bottom:5%;align-items:stretch}
  .vh-thumbs{overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
  .vh-thumbs::-webkit-scrollbar{display:none}
  .vh-card{width:108px;flex:0 0 auto;display:flex;flex-direction:column;align-items:center}
  .vh-card-ring{width:96px;height:96px;padding:4px}
  .vh-card-cap{margin-top:9px}
  /* Beat the display-scale overrides further down the sheet so the caption
     stays 2-3 short lines and the rail clears the hero copy. */
  .vh-thumbs .vh-card-cap b{font-size:12px}
  .vh-thumbs .vh-card-cap i{font-size:8.5px;letter-spacing:1px}
  .vh-meta{justify-content:space-between}
  .vh-mark{font-size:24vw;top:36%}
}
@media (prefers-reduced-motion: reduce){
  .vh-prog span.run{animation:none;width:100%}
}

/* ---------- HERO (legacy, unused) ---------- */
#home.home-area{position:relative;overflow:hidden;height:100vh;min-height:500px;background:var(--green)}
.hero-slides{position:absolute;inset:0;list-style:none;margin:0;padding:0;z-index:0}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center center;background-repeat:no-repeat;opacity:0;transition:opacity 1.6s ease}
.hero-slide.active{opacity:1}
.hero-video-overlay{position:absolute;inset:0;background:rgba(0,0,0,.38);z-index:1}
.hero-text-overlay{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-start;padding:0 5% 120px 6%;z-index:20}
.hero-text-block{text-align:left;max-width:700px}
.hero-headline-visual{display:block;font-family:var(--sans);font-size:39px;font-weight:700;color:#fff;line-height:1.2;margin:0 0 30px;text-shadow:0 2px 40px rgba(0,0,0,.5);letter-spacing:-.5px;text-transform:uppercase;white-space:nowrap}
.hero-tagline{font-size:16px;font-weight:300;color:rgba(255,255,255,.92);line-height:1.6;margin:0 0 35px;text-shadow:0 1px 20px rgba(0,0,0,.4)}
.hero-cta-btn{display:inline-block;padding:14px 28px;background:transparent;border:1px solid rgba(255,255,255,.6);color:#fff!important;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:2px;transition:all .3s}
.hero-cta-btn:hover{background:rgba(255,255,255,.12);border-color:#fff}
.scroll-down{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);z-index:25}
.scroll-down a{display:flex;align-items:center;justify-content:center;width:40px;height:40px;color:rgba(255,255,255,.75);font-size:18px;animation:hero-bounce 2s infinite}
.scroll-down a:hover{color:var(--gold)}
@keyframes hero-bounce{0%,100%{transform:translateY(0);opacity:.7}50%{transform:translateY(10px);opacity:1}}

/* ---------- DESTINATIONS ---------- */
.about_us{padding-top:60px;padding-bottom:60px}
.destinations-heading{font-family:var(--serif);font-size:42px;color:var(--green);margin-bottom:15px}
.image-container{padding-left:5%;padding-right:5%}
.dest-tile{position:relative;text-align:center;margin-bottom:24px}
.dest-tile a{display:block;position:relative;overflow:hidden}
.dest-tile img{width:100%;height:260px;object-fit:cover;transition:transform .6s ease}
.dest-tile a:hover img{transform:scale(1.05)}
.dest-tile a:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,0) 55%)}
.dest-tile-label{position:absolute;bottom:20px;left:0;width:100%;text-align:center;color:#fff;font-size:18px;letter-spacing:2px;z-index:2}

/* ---------- WHY US ---------- */
.why-travel-section{padding:100px 0;background:var(--cream)}
.video-feature{height:450px;margin-bottom:50px;box-shadow:0 20px 60px rgba(0,0,0,.2);border-radius:12px;position:relative;cursor:pointer;overflow:hidden}
.video-thumbnail{height:100%;border-radius:12px;background-size:cover;background-position:center;position:relative}
.video-thumbnail:after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.25);border-radius:12px}
.play-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:80px;height:80px;line-height:80px;text-align:center;font-size:30px;border-radius:50%;background:rgba(255,255,255,.9);color:var(--green);z-index:3;transition:.3s}
.video-feature:hover .play-button{background:var(--gold);color:#fff;transform:translate(-50%,-50%) scale(1.08)}
.video-caption{position:absolute;bottom:30px;left:0;width:100%;text-align:center;color:#fff;font-family:var(--serif);font-size:20px;letter-spacing:1px;z-index:3}
.why-col p{font-size:16px;line-height:1.9;color:var(--body);font-weight:300;margin-bottom:22px}
.why-col a{color:inherit;text-decoration:underline}
.dark-quote{background:var(--green);color:#fff;padding:40px;border-radius:10px;margin-top:10px}
.dark-quote i{color:var(--gold);font-size:26px;margin-bottom:14px;display:block}
.dark-quote p{font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.6;color:#fff;margin:0 0 14px}
.dark-quote span{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--gold)}
.why-img-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.why-img-grid > *{border-radius:8px;overflow:hidden;height:210px}
.why-img-grid > *:first-child{grid-column:span 2;height:280px}
.why-img-grid img{width:100%;height:100%;object-fit:cover;display:block}
.pillar-row{margin-top:60px}
.pillar{text-align:center;padding:0 15px;margin-bottom:30px}
.pillar i{width:70px;height:70px;line-height:70px;border-radius:50%;background:rgba(189,149,92,.15);color:var(--gold-dk);font-size:26px;margin-bottom:18px}
.pillar h4{font-family:var(--serif);font-size:20px;margin-bottom:10px}
.pillar p{font-size:14px;color:#666;font-weight:300;line-height:1.7}

/* ---------- REVIEWS ---------- */
.guest-reviews-section{padding:100px 0;background:var(--cream)}
.tripadvisor-mini{display:inline-flex;align-items:center;gap:12px;margin-bottom:40px;color:var(--green)}
.ta-rating{color:var(--gold);font-size:14px;letter-spacing:2px}
.ta-mark{font-family:var(--sans);font-weight:700;letter-spacing:1px;color:#21362C;font-size:15px}
.home-review-card{background:#fff;padding:40px;border-radius:8px;box-shadow:0 10px 40px rgba(0,0,0,.05);height:100%;border:1px solid rgba(0,0,0,.02);display:flex;flex-direction:column;justify-content:space-between;margin-bottom:30px}
.home-review-card .review-stars{color:var(--gold);margin-bottom:20px;font-size:14px;letter-spacing:2px}
.home-review-card h4{font-family:var(--serif);font-size:22px;color:var(--green);margin-bottom:20px;font-style:italic;line-height:1.4}
.home-review-card p{font-size:15px;line-height:1.8;color:#555;margin-bottom:30px;font-weight:300}
.home-review-card .reviewer{display:flex;align-items:center;gap:15px;margin-top:auto}
.reviewer-initials{width:46px;height:46px;border-radius:50%;background:var(--gold);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;letter-spacing:1px}
.reviewer-details strong{display:block;color:var(--green);font-size:15px}
.reviewer-details span{font-size:13px;color:#888}

/* ---------- NEWS ---------- */
.news-row{margin-top:10px}
.section-title h3{letter-spacing:2px;font-size:24px;margin-bottom:12px}
.section-title p{color:#666;font-weight:300;max-width:720px;margin:0 auto 40px}
.news-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e8e8e9;border-radius:6px;overflow:hidden;height:calc(100% - 30px);margin-bottom:30px}
.news-card-img-wrap{position:relative;flex-shrink:0}
.news-card-img-link img{width:100%;height:220px;object-fit:cover;transition:opacity .3s}
.news-card-img-link:hover img{opacity:.9}
.news-badge{position:absolute;top:14px;left:14px;background:var(--gold);color:#fff;font-size:10px;letter-spacing:1.5px;padding:6px 12px;border-radius:3px;font-weight:600}
.card-body{padding:18px;display:flex;flex-direction:column;flex:1}
.card-title{font-family:var(--serif);font-size:20px;margin:0 0 10px;line-height:1.35}
.news-card-title-link{color:inherit;transition:color .2s}
.news-card-title-link:hover{color:var(--gold)}
.news-card .card-body p{flex:1 1 auto;margin-bottom:15px;color:#555;font-size:14px;font-weight:300;line-height:1.7}
.read-more{display:inline-block;color:var(--gold-dk);font-size:12px;letter-spacing:1.5px;font-weight:600}
.read-more:hover{color:#000;text-decoration:underline}
.card-footer{border-top:1px solid #e0e0e0;padding:10px 18px;font-size:12px;color:#777;background:#fafafa}

/* ---------- FAQ ---------- */
.faq-section{padding:90px 0;background:#fff}
.faq-label{display:inline-block;background:rgba(189,149,92,.15);color:var(--gold-dk);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:2px;padding:8px 20px;border-radius:30px;margin-bottom:15px}
.faq-title{font-family:var(--serif);font-size:42px;color:var(--green);margin:0 0 15px}
.faq-subtitle{color:#666;font-weight:300;max-width:640px;margin:0 auto 45px}
.faq-accordion{display:flex;flex-direction:column;gap:14px}
.faq-item{background:var(--stone);border-radius:12px;overflow:hidden;transition:all .3s}
.faq-item:hover{background:#F3F0EB}
.faq-item.active{background:#fff;box-shadow:0 5px 30px rgba(0,0,0,.1)}
.faq-question{display:flex;align-items:center;justify-content:space-between;padding:22px 25px;cursor:pointer;gap:20px}
.faq-question span{font-size:16px;font-weight:500;color:var(--green);flex:1}
.faq-question i{width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:rgba(189,149,92,.15);border-radius:50%;color:var(--gold);font-size:12px;transition:all .3s;flex-shrink:0}
.faq-item.active .faq-question i{background:var(--gold);color:var(--green);transform:rotate(45deg)}
.faq-answer{max-height:0;overflow:hidden;padding:0 25px;transition:max-height .35s ease,padding .35s ease}
.faq-item.active .faq-answer{max-height:600px;padding:0 25px 25px}
.faq-answer p,.faq-answer li{color:#555;font-weight:300;font-size:15px;line-height:1.8}
.faq-answer ul{padding-left:20px}

/* ---------- CONTACT ---------- */
.contact-section{padding:80px 0;background:linear-gradient(180deg,var(--stone),#fff)}
.contact-label{display:inline-block;background:rgba(189,149,92,.15);color:var(--gold);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:2px;padding:8px 20px;border-radius:30px;margin-bottom:15px}
.contact-title{font-family:var(--serif);font-size:42px;color:var(--green);margin:0 0 15px}
.contact-subtitle{color:#666;font-weight:300;max-width:640px;margin:0 auto 45px}
.contact-wrapper{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.08)}
.contact-flex{display:flex;flex-wrap:wrap}
.contact-info-col{width:36%}
.contact-form-col{width:64%}
.contact-info-panel{background:var(--green);padding:45px 35px;height:100%;display:flex;flex-direction:column}
.info-header h3{font-size:22px;color:#fff;margin:0 0 8px;font-weight:600}
.info-header p{font-size:14px;color:rgba(255,255,255,.7);margin:0 0 30px;font-weight:300}
.info-item{display:flex;align-items:flex-start;gap:15px;margin-bottom:25px}
.info-icon{width:40px;height:40px;background:rgba(189,149,92,.2);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.info-icon i{color:var(--gold);font-size:16px}
.info-content{display:flex;flex-direction:column}
.info-label{font-size:12px;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}
.info-content a,.info-content span:not(.info-label){color:#fff;font-size:15px;transition:color .3s}
.info-content a:hover{color:var(--gold)}
.info-social{display:flex;gap:12px;margin-top:auto;padding-top:30px;border-top:1px solid rgba(255,255,255,.1)}
.info-social a{width:40px;height:40px;background:rgba(255,255,255,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;transition:all .3s}
.info-social a:hover{background:var(--gold);color:var(--green);transform:translateY(-3px)}
.contact-form-panel{padding:45px 40px}
.form-row{display:flex;gap:20px;flex-wrap:wrap}
.form-group{margin-bottom:20px}
.half-width{flex:1 1 calc(50% - 10px);min-width:220px}
.full-width{flex:1 1 100%;width:100%}
.safari-form label{display:block;font-size:13px;color:var(--green);font-weight:500;margin-bottom:7px}
.safari-form .form-control,.safari-form select,.safari-form textarea{width:100%;padding:12px 14px;border:1px solid #e2ded7;border-radius:8px;font-size:14px;font-family:var(--sans);font-weight:300;background:#fdfcfa;box-shadow:none;height:auto}
.safari-form .form-control:focus{border-color:var(--gold);outline:none;box-shadow:0 0 0 3px rgba(189,149,92,.12)}
.phone-input-group{display:flex;gap:8px}
.country-select{max-width:130px}
.btn-submit{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:16px 32px;background:linear-gradient(135deg,var(--gold),var(--gold-lt));border:none;border-radius:8px;color:var(--green);font-size:15px;font-weight:600;text-transform:uppercase;letter-spacing:1.5px;cursor:pointer;transition:all .3s}
.btn-submit:hover{background:linear-gradient(135deg,var(--gold-lt),#E8C088);transform:translateY(-2px);box-shadow:0 8px 25px rgba(189,149,92,.35)}
.trust-signals{display:flex;gap:24px;justify-content:center;margin-top:16px;flex-wrap:wrap}
.trust-item{font-size:12px;color:#888;letter-spacing:.5px}
.trust-item i{color:var(--gold);margin-right:6px}
.form-testimonial{margin-top:28px;padding-top:24px;border-top:1px solid #eee}
.ft-content i{color:var(--gold);font-size:18px}
.ft-content p{font-family:var(--serif);font-style:italic;font-size:16px;color:#555;margin:10px 0 12px}
.ft-author{display:flex;align-items:center;gap:10px;font-size:13px;color:#888}
.ft-avatar{width:30px;height:30px;border-radius:50%;background:var(--gold);color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600}

/* ---------- FOOTER ---------- */
.premium-footer{background:var(--green)}
.newsletter-section{background:linear-gradient(135deg,var(--green),var(--green-2));padding:60px 0;position:relative;overflow:hidden}
.newsletter-section:before{content:"";position:absolute;inset:0;background:var(--newsletter-img,none) center/cover no-repeat;opacity:.08}
.newsletter-wrapper{display:flex;align-items:center;justify-content:space-between;gap:40px;position:relative;z-index:1;flex-wrap:wrap}
.newsletter-content h3{color:#fff;font-family:var(--serif);font-size:30px;margin:0 0 8px}
.newsletter-content p{color:rgba(255,255,255,.75);font-weight:300;margin:0}
.newsletter-form-wrapper{display:flex;flex-direction:column;gap:12px;flex:1;max-width:500px}
.newsletter-form{display:flex;gap:12px}
.newsletter-form input{flex:1;padding:16px 24px;background:rgba(255,255,255,.1);border:1px solid rgba(189,149,92,.3);border-radius:50px;color:#fff;font-size:15px;outline:none;transition:all .3s}
.newsletter-form input::placeholder{color:rgba(255,255,255,.5)}
.newsletter-form input:focus{background:rgba(255,255,255,.15);border-color:var(--gold)}
.newsletter-form button{padding:16px 32px;background:linear-gradient(135deg,var(--gold),var(--gold-lt));border:none;border-radius:50px;color:var(--green);font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:all .3s;white-space:nowrap}
.newsletter-form button:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(189,149,92,.35)}
.newsletter-message{color:var(--gold);font-size:13px;margin:0;min-height:18px}
.stp-footer-cta{align-self:flex-start;background:transparent;border:1px solid rgba(189,149,92,.6);color:var(--gold);padding:10px 22px;border-radius:50px;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;transition:.3s}
.stp-footer-cta:hover{background:var(--gold);color:var(--green)}
.footer-main{padding:80px 0 60px;border-bottom:1px solid rgba(189,149,92,.15)}
.footer-brand svg{height:130px;max-width:260px;margin-bottom:20px}
.brand-tagline{color:var(--gold-lt,#D4A76A);font-family:var(--script);font-size:26px;margin-bottom:15px}
.brand-description{color:rgba(255,255,255,.65);font-size:14px;font-weight:300;line-height:1.8}
.trust-badges{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap}
.trust-badges .badge{background:rgba(189,149,92,.12);color:var(--gold);border:1px solid rgba(189,149,92,.3);padding:8px 14px;border-radius:30px;font-size:12px;font-weight:400;display:flex;align-items:center;gap:8px}
.footer-title{color:var(--gold);font-size:16px;font-weight:600;text-transform:uppercase;letter-spacing:1px;margin:0 0 25px;padding-bottom:15px;border-bottom:2px solid rgba(189,149,92,.3)}
.footer-links{list-style:none;padding:0;margin:0}
.footer-links li{margin-bottom:12px}
.footer-links li a{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.7);font-size:14px;font-weight:300;transition:all .3s}
.footer-links li a i{color:var(--gold);font-size:10px;transition:transform .3s}
.footer-links li a:hover{color:var(--gold)}
.footer-links li a:hover i{transform:translateX(3px)}
.footer-col .contact-item{display:flex;gap:15px;margin-bottom:18px}
.footer-col .contact-item>i{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:rgba(189,149,92,.1);border-radius:50%;color:var(--gold);font-size:16px;flex-shrink:0}
.footer-col .contact-item .label{display:block;color:rgba(255,255,255,.7);font-size:12px;text-transform:uppercase;letter-spacing:1px;margin-bottom:2px}
.footer-col .contact-item .value{color:#fff;font-size:14px}
.footer-col .contact-item a.value:hover{color:var(--gold)}
.footer-social{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}
.footer-social a{width:38px;height:38px;background:rgba(255,255,255,.08);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:15px;transition:.3s}
.footer-social a:hover{background:var(--gold);color:var(--green);transform:translateY(-3px)}
.footer-bottom{padding:25px 0}
.footer-bottom-content{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px}
.footer-bottom-meta{display:flex;flex-direction:column;gap:6px}
.copyright,.footer-credit{color:rgba(255,255,255,.55);font-size:13px;margin:0}
.footer-credit a{color:var(--gold)}
.footer-bottom-links{display:flex;gap:30px;list-style:none;padding:0;margin:0;flex-wrap:wrap}
.footer-bottom-links li a{color:rgba(255,255,255,.5);font-size:13px;transition:color .3s}
.footer-bottom-links li a:hover{color:var(--gold)}


/* ================= SCROLL ANIMATION LAYER ================= */
/* RULE: CSS never hides anything that only JavaScript can bring back.
   Every reveal in animations.js sets its own "from" state at runtime and
   clears it on completion, so a missing/blocked GSAP, a dead ScrollTrigger or
   JS switched off all degrade to a fully visible page.

   The only survivors below are the pinned #cta-zoom states, which are
   structural to that effect. They are scoped to the exact context that drives
   them — desktop widths with motion allowed — and reset everywhere else. */
.reveal-wrap{overflow:hidden;position:relative}
.reveal-wrap img{display:block;width:100%;will-change:transform}
.section-divider{transform-origin:center}
.dest-tile a{overflow:hidden}

/* growing vertical rule */
.v-rule{width:2px;height:110px;background:linear-gradient(to bottom,var(--gold),rgba(189,149,92,0));margin:10px auto 40px;transform-origin:top center}

/* door-panel reveal over the video feature */
.door{position:absolute;top:0;bottom:0;width:50.5%;background:var(--cream);z-index:6;pointer-events:none}
.door-l{left:0}.door-r{right:0}
.door{display:none}

/* pinned zoom CTA */
.cta-zoom{position:relative;background:var(--green);overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center;padding:110px 0}
.cta-zoom-media{position:absolute;inset:0;background-size:cover;background-position:center;z-index:1;will-change:clip-path,transform}
.cta-zoom-media:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(13,23,18,.55),rgba(13,23,18,.35) 45%,rgba(13,23,18,.72))}
.cta-zoom-ring{position:absolute;top:50%;left:50%;width:90px;height:90px;margin:-45px 0 0 -45px;will-change:transform;z-index:2;display:none}
.cta-zoom-text{position:relative;z-index:3;max-width:660px;padding:0 24px;margin:0 auto}
/* The pinned timeline only ever runs in this exact context (see the
   gsap.matchMedia('(min-width:1024px)') block in animations.js). Outside it the
   section is an ordinary padded band with visible copy. */
@media (min-width:1024px){
  html.has-anim .cta-zoom{height:100vh;padding:0}
  html.has-anim .cta-zoom-media{clip-path:circle(84px at 50% 50%)}
  html.has-anim .cta-zoom-ring{display:block}
  html.has-anim .cta-zoom-text{opacity:0;transform:scale(1.18)}
}
.cta-zoom-text .section-label{background:rgba(189,149,92,.2);color:var(--gold)}
.cta-zoom-text h2{font-family:var(--serif);font-size:46px;color:#fff;margin:0 0 18px}
.cta-zoom-text p{color:rgba(255,255,255,.75);font-weight:300;font-size:17px;line-height:1.8;margin:0 0 32px}
@media (max-width:991px){.cta-zoom-text h2{font-size:32px}}


/* ================= TOUR CARDS ================= */
.tours-section{padding:100px 0;background:var(--cream)}
.tours-row{margin-top:10px;display:flex;flex-wrap:wrap}
.tours-row [class*="col-"]{display:flex;float:none}
.tour-card{background:#fff;border-radius:26px;box-shadow:0 24px 60px rgba(33,54,44,.10);padding:10px 10px 6px;margin-bottom:30px;display:flex;flex-direction:column;height:calc(100% - 30px);transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s}
.tour-card:hover{transform:translateY(-6px);box-shadow:0 34px 80px rgba(33,54,44,.16)}
.tour-photo{position:relative;border-radius:20px;overflow:hidden;height:230px}
.tour-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s ease}
.tour-card:hover .tour-photo img{transform:scale(1.05)}
.tour-photo-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(13,23,18,.72) 0%,rgba(13,23,18,.08) 45%,rgba(13,23,18,0) 65%)}
.tour-photo-bar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px}
.tour-photo-name b{display:block;font-family:var(--sans);font-weight:600;font-size:15px;color:#fff;letter-spacing:.2px}
.tour-photo-name span{display:block;font-size:11px;color:rgba(255,255,240,.7);margin-top:2px}
.tour-start{flex-shrink:0;background:rgba(13,23,18,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,240,.18);color:#fff;font-size:12px;font-weight:600;letter-spacing:.6px;padding:11px 20px;border-radius:999px;transition:.3s;white-space:nowrap}
.tour-start:hover{background:var(--gold);color:var(--green);border-color:var(--gold)}
.tour-body{padding:18px 14px 6px;display:flex;flex-direction:column;flex:1}
.tour-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.tour-head h4{font-family:var(--sans);font-weight:600;font-size:15.5px;color:var(--green);margin:0 0 4px}
.tour-route{font-size:11px;color:#999;letter-spacing:.3px}
.tour-stars{flex-shrink:0;text-align:right;padding-top:2px}
.ts-row{display:flex;gap:3px;justify-content:flex-end}
.ts-row svg{width:15px;height:15px;fill:var(--gold)}
.ts-meta{display:block;font-size:10.5px;color:#9a9a90;margin-top:5px;letter-spacing:.4px}
.tour-div{height:1px;background:rgba(189,149,92,.25);margin:14px 0 16px;max-width:200px}
.tour-stats{display:flex;gap:28px;margin-bottom:16px}
.tour-stats b{display:block;font-family:var(--sans);font-weight:600;font-size:16px;color:#222;letter-spacing:.2px}
.tour-stats span{display:block;font-size:10px;color:#9a9a90;margin-top:2px;letter-spacing:.3px}
.tour-more{overflow:hidden;max-height:400px;opacity:1;transition:max-height .5s cubic-bezier(.22,1,.36,1),opacity .4s}
.tour-more p{font-size:13px;line-height:1.75;color:#666;font-weight:300;margin:0 0 12px}
.tour-card.closed .tour-more{max-height:0;opacity:0}
.tour-toggle{margin:auto auto 4px;background:none;border:0;padding:10px 18px;cursor:pointer;color:#444;transition:transform .4s cubic-bezier(.22,1,.36,1)}
.tour-toggle svg{width:20px;height:20px}
.tour-card.closed .tour-toggle{transform:rotate(180deg)}
@media (max-width:991px){.tours-section{padding:60px 0}.tour-photo{height:200px}}


/* ================= SPLIT WHY ================= */
.split-why{position:relative;min-height:86vh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:110px 20px 130px}
.sw-bg{position:absolute;inset:0;display:flex}
.sw-half{flex:1 1 50%;background-size:cover;background-position:center;filter:saturate(.8) brightness(.85);transform:scale(1.06);will-change:transform}
.sw-seam{position:absolute;top:0;bottom:0;left:50%;width:1px;background:rgba(255,255,240,.28)}
.sw-bg:after{content:"";position:absolute;inset:0;background:rgba(13,23,18,.28)}
.sw-card{position:relative;z-index:2;background:var(--cream);border:1px solid rgba(189,149,92,.35);border-radius:4px;box-shadow:0 44px 110px rgba(0,0,0,.45);max-width:680px;width:min(680px,92vw);text-align:center;padding:58px 48px 46px}
.sw-tab{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);background:var(--green);color:var(--gold-lt,#D4A76A);font-size:10px;font-weight:600;letter-spacing:3.5px;text-transform:uppercase;padding:11px 26px;border-radius:2px;white-space:nowrap;transition:.3s;box-shadow:0 12px 30px rgba(0,0,0,.35)}
.sw-tab:hover{background:#2D4A3E;color:#fff}
.sw-kick{display:block;font-size:10.5px;font-weight:600;letter-spacing:5px;text-transform:uppercase;color:#9E7B45;margin-bottom:16px}
.sw-word{font-family:var(--sans);font-weight:700;font-size:clamp(42px,6.6vw,92px);letter-spacing:.14em;color:#1F2B24;margin:0 0 18px;line-height:1}
.sw-sub{margin:0 auto;max-width:46ch;font-size:13.5px;line-height:1.95;color:#666;font-weight:300}
.sw-pillars{position:absolute;left:50%;bottom:44px;transform:translateX(-50%);z-index:2;display:flex;gap:14px;list-style:none;margin:0;padding:0;flex-wrap:wrap;justify-content:center;width:max-content;max-width:94vw}
.sw-pillars li{display:flex;align-items:center;gap:9px;background:rgba(13,23,18,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,240,.16);color:rgba(255,255,240,.85);font-size:10.5px;font-weight:500;letter-spacing:2.5px;text-transform:uppercase;padding:10px 18px;border-radius:999px}
.sw-pillars b{font-family:var(--serif);font-weight:400;color:var(--gold-lt,#D4A76A);font-size:11px;letter-spacing:1px}
@media (max-width:991px){
  .split-why{min-height:70vh;padding:80px 16px 110px}
  .sw-card{padding:46px 26px 38px}
  .sw-word{letter-spacing:.1em}
  .sw-pillars{bottom:26px;gap:8px;width:92%}
  .sw-pillars li{padding:8px 13px;font-size:9px;letter-spacing:1.5px}
}


/* ================= ACTIVITIES (torn-edge cards) ================= */
.acts-section{padding:100px 0;background:var(--cream)}
.acts-row{margin-top:10px}
.act-card{position:relative;background:#24382D;border-radius:16px;overflow:hidden;aspect-ratio:1/1.06;margin-bottom:30px;box-shadow:0 24px 60px rgba(33,54,44,.16);transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s}
.act-card:hover{transform:translateY(-6px);box-shadow:0 34px 80px rgba(33,54,44,.24)}
.act-blob{position:absolute;inset:0}
.act-blob img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.act-card:hover .act-blob img{transform:scale(1.05)}
.act-gold{position:absolute;inset:0;background:linear-gradient(160deg,var(--gold-lt,#D4A76A),var(--gold))}
.act-l .act-gold{clip-path:url(#blobLG)}
.act-l .act-blob img{clip-path:url(#blobL)}
.act-r .act-gold{clip-path:url(#blobRG)}
.act-r .act-blob img{clip-path:url(#blobR)}
.act-b .act-gold{clip-path:url(#blobBG)}
.act-b .act-blob img{clip-path:url(#blobB)}
.act-ridge{position:absolute;left:0;right:0;bottom:0;width:100%;height:56px;pointer-events:none}
.act-b .act-ridge{display:none}
.act-copy{position:absolute;z-index:2}
.act-l .act-copy{left:47%;right:22px;top:50%;transform:translateY(-50%);text-align:left}
.act-r .act-copy{left:22px;right:47%;top:50%;transform:translateY(-50%);text-align:left}
.act-b .act-copy{left:20px;right:20px;top:26px;text-align:center}
.act-copy h3{font-family:var(--sans);font-weight:700;font-size:21px;line-height:1.22;color:#F4EFE2;margin:0 0 7px;letter-spacing:.3px}
.act-sub{display:block;font-size:9.5px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold-lt,#D4A76A);margin-bottom:10px}
.act-copy p{font-size:11px;line-height:1.7;color:rgba(255,255,240,.55);font-weight:300;margin:0 0 12px}
.act-b .act-copy p{max-width:34ch;margin-left:auto;margin-right:auto}
.act-stars{display:flex;gap:6px}
.act-b .act-stars{justify-content:center}
.act-stars svg{width:10px;height:10px;fill:var(--gold-lt,#D4A76A);opacity:.9}
.dsun{width:34px;height:20px;color:rgba(212,167,106,.85);margin:0 auto 10px;display:block}
.act-doodles{position:absolute;inset:0;pointer-events:none;color:rgba(255,255,240,.28);z-index:1}
.dz{position:absolute;width:24px;height:9px}
.dx{position:absolute;width:9px;height:9px}
.act-l .dz{right:20px;top:20px}.act-l .dx{right:56px;top:24px}.act-l .dz2{right:26px;bottom:74px}.act-l .dx2{left:52%;bottom:60px}
.act-r .dz{left:20px;top:20px}.act-r .dx{left:56px;top:24px}.act-r .dz2{left:26px;bottom:74px}.act-r .dx2{right:52%;bottom:60px}
.act-b .dz{left:22px;top:24px}.act-b .dx{right:26px;top:22px}.act-b .dz2{right:22px;top:44px}.act-b .dx2{left:30px;top:48px}
@media (max-width:1199px){.act-copy h3{font-size:18px}.act-copy p{font-size:10.5px}}
@media (max-width:991px){
  .acts-section{padding:60px 0}
  .act-card{aspect-ratio:auto;min-height:340px;max-width:420px;margin-left:auto;margin-right:auto}
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1199px){
  .nav-link{padding:10px 10px;font-size:11px;letter-spacing:1px}
  .nav-logo svg{height:84px}
}
@media (max-width:991px){
  .mobile-menu-btn{display:block;order:3}
  .nav-links{display:none}
  .nav-wrapper{justify-content:space-between}
  .nav-logo svg{height:70px}
  .hero-headline-visual{font-size:26px;margin-bottom:25px;white-space:normal}
  .hero-tagline{font-size:15px;margin-bottom:30px}
  .hero-text-block{max-width:90%}
  .hero-text-overlay{padding:0 6% 100px}
  .section-heading,.destinations-heading,.faq-title,.contact-title{font-size:32px}
  .why-travel-section{padding:60px 0}
  .contact-info-col,.contact-form-col{width:100%}
  .video-feature{height:320px}
  .why-img-grid{margin-top:30px}
  .footer-brand{text-align:center;margin-bottom:30px}
  .footer-col{margin-bottom:34px}
  .newsletter-wrapper{flex-direction:column;text-align:center}
  .newsletter-form-wrapper{max-width:100%;width:100%}
  .stp-footer-cta{align-self:center}
}
@media (max-width:767px){
  .top-bar-left .top-contact:nth-child(n+2){display:none}
  .home-review-card{padding:30px}
  .newsletter-form{flex-direction:column}
  .newsletter-form button{width:100%}
  .footer-bottom-content{flex-direction:column;text-align:center}
  .contact-form-panel{padding:30px 22px}
  .dest-tile img{height:210px}
}


/* =====================================================================
   2. RWANDA ATLAS BAND  (from <style> block 2)
   ===================================================================== */
section.atlas-band{color-scheme:dark;background:#1A2B23;color:rgba(255,255,240,.62);font-weight:300;
  background-image:radial-gradient(1200px 700px at 70% 10%,rgba(189,149,92,.06),transparent 60%),radial-gradient(900px 600px at 10% 90%,rgba(45,74,62,.35),transparent 60%)}

.atlas{--goldlt:#D9B683;--mist:rgba(255,255,240,.62)}
.atlas{max-width:1460px;margin:0 auto;padding:100px 40px}
.atlas-grid{display:grid;grid-template-columns:auto 470px;justify-content:center;gap:140px;align-items:center}
.stage{position:relative}
svg.rwmap{display:block;width:100%;height:auto;overflow:visible}
.country{fill:url(#landfill);stroke:var(--gold);stroke-width:1.4;filter:url(#glow)}
.country-draw{fill:none;stroke:rgba(217,182,131,.9);stroke-width:1.4;pointer-events:none}
.contour{fill:none;stroke:rgba(189,149,92,.10);stroke-width:1}
.neighbor{font-family:var(--sans);font-size:11px;font-weight:400;letter-spacing:5px;fill:rgba(255,255,240,.22);text-transform:uppercase}
.lake-label{font-family:var(--script);font-size:22px;fill:rgba(255,255,240,.45)}
.credit{font-size:9px;fill:rgba(255,255,240,.22);font-family:var(--sans);letter-spacing:.5px}
.compass{fill:none;stroke:rgba(189,149,92,.5);stroke-width:1}
.compass text{fill:rgba(189,149,92,.8);font-family:var(--serif);font-size:13px;stroke:none}
/* ---- destination regions ---- */
.region{cursor:pointer;outline:none}
.rg-hit{fill:transparent;stroke:transparent;stroke-width:22;pointer-events:all}
.rg{fill:rgba(217,182,131,.10);stroke:rgba(189,149,92,.6);stroke-width:1;transition:fill .35s,stroke .35s,filter .35s}
.rg-label{font-family:var(--sans);font-size:17px;font-weight:600;letter-spacing:3px;fill:rgba(244,239,226,.8);text-transform:uppercase;paint-order:stroke;stroke:rgba(13,23,18,.85);stroke-width:5px;transition:.35s;pointer-events:none}
.rg-no{font-family:var(--serif);font-size:13px;fill:rgba(189,149,92,.7);letter-spacing:2.5px;paint-order:stroke;stroke:rgba(13,23,18,.85);stroke-width:4px;transition:.35s;pointer-events:none}
.rg-lead{stroke:rgba(217,182,131,.6);stroke-width:1;pointer-events:none}
.rg-lead-dot{fill:var(--goldlt);pointer-events:none}
.region:hover .rg,.region:focus-visible .rg,.region.active .rg{fill:rgba(217,182,131,.32);stroke:var(--goldlt);stroke-width:1.6;filter:drop-shadow(0 0 12px rgba(189,149,92,.5))}
.region:hover .rg-label,.region.active .rg-label,.region:focus-visible .rg-label{fill:var(--goldlt)}
.region.active .rg-no{fill:var(--goldlt)}
.regions.focus .region:not(.active):not(:hover){opacity:.4}
.regions .region{transition:opacity .35s}
/* ---- in-shape photo reveal ---- */
.pr{opacity:0;transition:opacity .8s ease}
.region.active .pr,.region:hover .pr{opacity:1}
.pr-img{transform-box:fill-box;transform-origin:center;transform:scale(1.14);transition:transform 2.4s cubic-bezier(.22,1,.36,1)}
.region.active .pr-img,.region:hover .pr-img{transform:scale(1)}
.pr-tint{fill:rgba(13,23,18,.16)}
.region.active .rg,.region:hover .rg{fill:transparent}
/* ---- pulsing destination dots ---- */
.rg-dot{fill:#D9B683;transition:opacity .4s}
.rg-pulse{fill:rgba(217,182,131,.45);transform-box:fill-box;transform-origin:center;animation:dotpulse 2.8s ease-out infinite;pointer-events:none}
#rg-gishwati .rg-pulse{animation-delay:.5s}
#rg-nyungwe .rg-pulse{animation-delay:1s}
#rg-akagera .rg-pulse{animation-delay:1.5s}
#rg-kigali .rg-pulse{animation-delay:2s}
@keyframes dotpulse{0%{transform:scale(.35);opacity:.6}70%{transform:scale(1.7);opacity:0}100%{transform:scale(1.7);opacity:0}}
.region.active .rg-dot,.region.active .rg-pulse,.region:hover .rg-dot,.region:hover .rg-pulse{opacity:0;animation-play-state:paused}
/* ---- detail panel: ivory card, medallion centered on its left edge ---- */
.dpanel{position:relative;min-height:640px}
.dcard{display:none;position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);background:var(--cream,#FFFFF0);border:1px solid rgba(189,149,92,.35);border-radius:4px;box-shadow:0 34px 90px rgba(0,0,0,.5);padding:38px 32px 32px 212px;min-height:400px;flex-direction:column;justify-content:center}
.dcard.show{display:flex;animation:dcardIn .55s cubic-bezier(.22,1,.36,1)}
@keyframes dcardIn{from{opacity:0;transform:translateY(calc(-50% + 16px))}to{opacity:1;transform:translateY(-50%)}}
.dc-flow{display:block}
.dc-circle{position:absolute;left:-112px;top:50%;transform:translateY(-50%);width:300px;height:300px;border-radius:50%;overflow:hidden;pointer-events:none;border:1px solid rgba(189,149,92,.9);box-shadow:0 0 0 8px rgba(13,23,18,.5),0 0 0 9px rgba(217,182,131,.4),0 30px 70px rgba(0,0,0,.45)}
.dc-circle:after{content:"";position:absolute;inset:7px;border:1px solid rgba(255,255,240,.35);border-radius:50%;pointer-events:none}
.dc-circle img{width:100%;height:100%;object-fit:cover}
.dcard.show .dc-circle img{animation:orbSettle 5s ease forwards}
@keyframes orbSettle{from{transform:scale(1.14)}to{transform:scale(1)}}
.dc-eyebrow{display:block;font-family:var(--sans);font-weight:600;font-size:10px;letter-spacing:3px;color:#9E7B45;margin:0 0 10px;text-transform:uppercase}
.dcard h3{font-family:var(--serif);font-weight:400;font-size:28px;color:var(--green,#21362C);margin:0 0 13px;line-height:1.14}
.dc-sum{margin:0 0 22px;font-size:13.5px;line-height:1.85;color:#555;font-weight:300}
.dc-cta{display:inline-flex;align-items:center;gap:14px;text-decoration:none;width:max-content}
.dc-arrow{width:40px;height:40px;border:1px solid rgba(158,123,69,.75);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#9E7B45;transition:background .3s,transform .3s}
.dc-arrow svg{width:17px;height:17px}
.dc-cta-label{font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--green,#21362C);transition:color .3s}
.dc-cta:hover .dc-arrow{background:rgba(189,149,92,.14);transform:translateX(3px)}
.dc-cta:hover .dc-cta-label{color:#9E7B45}
.dc-meta{display:flex;gap:12px;align-items:flex-start;color:#8a6f45;font-size:12.5px;line-height:1.75;font-weight:300;margin-top:26px;border-top:1px solid rgba(189,149,92,.25);padding-top:18px}
.dc-pin{width:17px;height:17px;flex-shrink:0;margin-top:3px}
.hint{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);background:var(--cream,#FFFFF0);border:1px solid rgba(189,149,92,.35);border-radius:4px;box-shadow:0 34px 90px rgba(0,0,0,.5);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:56px 40px;transition:opacity .4s}
.hint.hide{display:none}
.hint-ring{width:64px;height:64px;border:1px solid rgba(189,149,92,.5);border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:22px;animation:hbreathe 3.2s ease-in-out infinite}
@keyframes hbreathe{0%,100%{transform:scale(.85);opacity:.6}50%{transform:scale(1.05);opacity:1}}
.hint-ring span{width:6px;height:6px;background:var(--goldlt);border-radius:50%}
.hint p{margin:0;font-size:13px;line-height:2;color:#777;letter-spacing:.5px}
.hint p strong{display:block;font-family:var(--serif);font-weight:400;font-size:19px;letter-spacing:0;color:var(--green,#21362C);margin-bottom:8px}
@media (max-width:1200px){.atlas-grid{grid-template-columns:auto 420px;gap:104px}}
@media (max-width:1020px){
  .atlas{padding:64px 22px}
  .atlas-grid{display:block}
  .rg-label{font-size:27px;letter-spacing:3.5px}
  .rg-no{font-size:19px}
  .stage{margin-bottom:34px}
  .dpanel{min-height:0}
  .dcard{position:relative;inset:auto;top:auto;transform:none;padding:28px 22px;min-height:0}
  .dcard.show{display:block;animation:none;transform:none}
  .dc-circle{position:relative;left:auto;top:auto;transform:none;width:220px;height:220px;margin:0 auto 18px;pointer-events:auto}
  .dcard.show .dc-circle{transform:none}
  .dc-meta{margin-top:20px}
  .hint{position:relative;top:auto;transform:none;min-height:140px;padding:26px}
}
/* ---- entrance ----
   Gated on .atlas-anim, which animations.js adds to <html> only once it is
   actually running and about to observe the band. If that file never loads the
   class is absent, the pre-hide never applies and the map is simply visible. */
html.atlas-anim .atlas .region{opacity:0;transition:opacity .8s ease}
html.atlas-anim .atlas.in .region{opacity:1}
html.atlas-anim .atlas.in #rg-volcanoes{transition-delay:.8s}
html.atlas-anim .atlas.in #rg-gishwati{transition-delay:.95s}
html.atlas-anim .atlas.in #rg-nyungwe{transition-delay:1.1s}
html.atlas-anim .atlas.in #rg-akagera{transition-delay:1.25s}
html.atlas-anim .atlas.in #rg-kigali{transition-delay:1.4s}

@media (min-width:1021px){
  section.atlas-band{display:flex;align-items:center;min-height:100vh;padding-top:118px}
  .atlas{padding:26px 40px;width:100%}
  .atlas-grid{grid-template-columns:auto 470px;justify-content:center;gap:140px;align-items:center}
  .stage{display:flex;justify-content:center;align-items:center}
  svg.rwmap{height:min(70vh,620px);width:auto;max-width:100%}
  .rg-label{font-size:24px;letter-spacing:3.5px}
  .rg-no{font-size:17px}
  .rg-hit{stroke-width:30}
  .neighbor{font-size:15px;letter-spacing:6px}
  .lake-label{font-size:20px}
  .credit{font-size:12px}
  .compass{transform:translate(925px,118px) scale(1.3)}
  .rg-dot{r:4.4}
  .rg-pulse{r:15}
  .dpanel{min-height:0;height:min(70vh,620px)}
  .dcard{padding:32px 28px 28px 206px;min-height:352px}
  .dc-circle{width:288px;height:288px;left:-108px}
  .dc-eyebrow{font-size:10px;margin-bottom:8px}
  .dcard h3{font-size:23px;margin-bottom:10px}
  .dc-sum{font-size:12.5px;line-height:1.75;margin-bottom:16px}
  .dc-arrow{width:34px;height:34px}
  .dc-cta-label{font-size:10.5px;letter-spacing:2.5px}
  .dc-meta{font-size:11px;margin-top:20px;padding-top:14px}
  .hint{padding:22px}
  .hint-ring{width:46px;height:46px;margin-bottom:13px}
  .hint p{font-size:11px;line-height:1.8}
  .hint p strong{font-size:15px;margin-bottom:5px}
}
@media (min-width:1021px) and (max-width:1200px){
  .dcard{padding-left:172px;min-height:300px}
  .dc-circle{width:236px;height:236px;left:-90px}
  .dcard h3{font-size:21px}
}
@media (min-width:1021px) and (max-height:820px){
  .atlas{padding:24px 40px}
  .dpanel{height:min(72vh,620px)}
  svg.rwmap{height:min(72vh,620px)}
  .rg-dot{r:5}
  .rg-pulse{r:17}
  .dcard{padding:26px 24px 24px 184px;min-height:312px}
  .dc-circle{width:252px;height:252px;left:-96px}
  .dcard h3{font-size:20px;margin-bottom:8px}
  .dc-sum{font-size:11.5px;line-height:1.65;margin-bottom:13px}
  .dc-meta{font-size:10px;margin-top:16px;padding-top:12px}
}


/* =====================================================================
   3. TYPE SCALE PASS  (from <style id="type-scale">)
   ===================================================================== */
/* ============ TYPE SCALE (larger pass 2) ============ */
body{font-size:18.5px;line-height:1.7}
/* Nav spacing. 8px of side padding left only 16px between two uppercase
   labels, which read as one solid block. The three steps below track the
   container, which is 1360px wide from 1400px of viewport but shrinks with
   the window under that — so the room has to be given back in step. */
.nav-link{font-size:12.5px;letter-spacing:1.1px;padding:12px 16px;gap:5px}
.nav-link.cta-button{padding:12px 22px;letter-spacing:.9px}
.nav-left{justify-content:flex-end;padding-right:26px}
.nav-right{justify-content:flex-start;padding-left:32px}
/* The logo drove most of the header's height; trimming it lifts the whole bar
   without shrinking the nav type. */
.main-nav .nav-logo svg{height:68px;width:auto}
.main-nav.scrolled .nav-logo svg{height:58px;width:auto}
@media (max-width:1360px){
  .nav-link{font-size:11.5px;letter-spacing:.8px;padding:10px 11px;gap:4px}
  .nav-link.cta-button{padding:9px 17px;letter-spacing:.7px}
  .nav-left{padding-right:18px}
  .nav-right{padding-left:20px}
}
@media (max-width:1200px){
  .nav-link{font-size:10.8px;letter-spacing:.6px;padding:9px 8px}
  .nav-link.cta-button{padding:8px 13px;letter-spacing:.5px}
  .nav-left{padding-right:12px}
  .nav-right{padding-left:14px}
}
/* Last stop before the drawer takes over at 991px. */
@media (max-width:1080px){
  .nav-link{font-size:10px;letter-spacing:.4px;padding:8px 6px}
  .nav-link.cta-button{padding:7px 11px;letter-spacing:.4px}
  .nav-left{padding-right:10px}
  .nav-right{padding-left:10px}
}
.header-top-bar{font-size:14.5px}
.section-label{font-size:14px;padding:10px 24px}
.section-heading{font-family:var(--serif-d);font-weight:400;font-size:clamp(46px,5vw,64px);letter-spacing:.2px}
.section-sub{font-size:19px}
/* hero
   The display-scale title was clamped to 110px here, which overrode the base
   rule and pushed long titles to four lines under the fixed header. Capped so
   only the authored <br> breaks each line. */
.vh-title{font-family:var(--serif-d);font-weight:400;font-size:clamp(42px,5.6vw,86px)}
.vh-loc{font-size:17px}
.vh-cta{font-size:16px;padding:16px 32px}
.vh-card-cap b{font-size:16.5px}
.vh-card-cap i{font-size:12px}
/* atlas */
.rg-label{font-size:21px}
.rg-no{font-size:16px}
.dc-eyebrow{font-size:13px}
.dcard h3{font-family:var(--serif-d);font-weight:400;font-size:34px}
.dc-sum{font-size:17px;line-height:1.85}
.dc-cta-label{font-size:14.5px}
.dc-meta{font-size:15.5px}
.hint p{font-size:17px}
.hint p strong{font-family:var(--script);font-size:38px;color:var(--green);margin-bottom:10px}
.lake-label{font-size:28px}
/* tours */
.tour-photo-name b{font-size:18px}
.tour-photo-name span{font-size:14px}
.tour-start{font-size:15px;padding:13px 24px}
.tour-head h4{font-size:20.5px}
.tour-route{font-size:14px}
.tour-stats b{font-size:22px}
.tour-stats span{font-size:13px}
.tour-more p{font-size:16.5px;line-height:1.8}
.ts-meta{font-size:13.5px}
.ts-row svg{width:19px;height:19px}
/* split why */
.sw-tab{font-size:13px;padding:13px 30px}
.sw-kick{font-family:var(--script);font-size:34px;font-weight:400;letter-spacing:0;text-transform:none;color:#8a6a35;margin-bottom:10px}
.sw-word{font-size:clamp(50px,7.4vw,108px)}
.sw-sub{font-size:17.5px;line-height:1.9;max-width:52ch}
.sw-pillars li{font-size:13.5px;padding:13px 22px}
.sw-pillars b{font-size:14px}
/* activities */
.act-copy h3{font-size:27px}
.act-sub{font-size:12.5px}
.act-copy p{font-size:14.5px;line-height:1.62;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.act-stars svg{width:13.5px;height:13.5px}
.act-b .act-copy{top:20px}
.act-b .act-copy p{-webkit-line-clamp:2;margin-bottom:6px}
.act-b .act-copy h3{font-size:23px;line-height:1.16;margin-bottom:4px}
.act-b .act-sub{margin-bottom:5px}
.act-b .dsun{margin-bottom:6px}
/* pinned cta */
.cta-zoom-text .section-label{font-size:14px}
.cta-zoom-text h2{font-family:var(--script);font-size:clamp(62px,6.5vw,96px);font-weight:400;line-height:1.15;color:#F2E3C4}
.cta-zoom-text p{font-size:20.5px}
.hero-cta-btn{font-size:16px}
/* footer & newsletter */
.newsletter-content h3{font-family:var(--script);font-size:50px;color:#F2E3C4}
.newsletter-content p{font-size:17.5px}
.newsletter-form input{font-size:16.5px}
.stp-footer-cta,.newsletter-form button{font-size:16px}
.brand-tagline{font-size:36px}
.footer-about p{font-size:16.5px}
.footer-links a,.footer-links li{font-size:17px}
.footer-heading{font-size:18.5px}
.footer-contact-item{font-size:16.5px}
.footer-bottom, .footer-bottom a{font-size:15px}
/* compact atlas tiers keep one-screen fit */
@media (min-width:1021px){
  .rg-label{font-size:28px}
  .rg-no{font-size:20px}
  .dcard h3{font-size:29px}
  .dc-sum{font-size:15.5px;line-height:1.75}
  .dc-eyebrow{font-size:12px}
  .dc-cta-label{font-size:13px}
  .dc-meta{font-size:14px}
  .lake-label{font-size:26px}
}
@media (min-width:1021px) and (max-height:820px){
  .dcard h3{font-size:25px}
  .dc-sum{font-size:14px;line-height:1.65}
  .dc-meta{font-size:13px}
  .hint p strong{font-size:34px}
}
@media (max-width:991px){
  .cta-zoom-text h2{font-size:clamp(48px,11vw,68px)}
  .newsletter-content h3{font-size:40px}
  .sw-kick{font-size:28px}
}

/* =====================================================================
   4. WORDPRESS INTEGRATION LAYER
   ===================================================================== */

/* --- Base overrides safe for WP content areas --- */
img{display:block;max-width:100%;height:auto}
figure{margin:0}

/* --- Admin bar offset for the fixed header --- */
.admin-bar .safari-header{top:32px}
@media screen and (max-width:782px){.admin-bar .safari-header{top:46px}}

/* --- Accessibility --- */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important}
.screen-reader-text:focus{background:var(--cream);clip:auto!important;clip-path:none;color:var(--green);display:block;font-size:14px;height:auto;left:6px;line-height:normal;padding:14px 22px;text-decoration:none;top:6px;width:auto;z-index:100000;border-radius:6px;box-shadow:0 6px 24px rgba(0,0,0,.25)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.skip-link:focus{outline:none}

/* --- Fixed-header anchor offset --- */
:target{scroll-margin-top:150px}
@media (max-width:991px){:target{scroll-margin-top:110px}}

/* =====================================================================
   5. INNER PAGES  (single.php / page.php / archive / search / 404)
   The header is designed transparent over a dark hero. Inner pages have
   no hero, so the header must start in its solid "scrolled" state.
   ===================================================================== */
body:not(.home) .safari-header .header-top-bar,
.safari-header.solid .header-top-bar{background:#D8C3A5}
body:not(.home) .safari-header .main-nav,
.safari-header.solid .main-nav{background:rgba(33,54,44,.95);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);padding:8px 0;box-shadow:0 4px 20px rgba(0,0,0,.2)}
body:not(.home) .main-nav .nav-logo svg,
.safari-header.solid .main-nav .nav-logo svg{height:70px}

/* Page shell: pushes content clear of the fixed header */
.page-shell{padding-top:190px;padding-bottom:90px;background:var(--cream)}
@media (max-width:991px){.page-shell{padding-top:150px;padding-bottom:60px}}
@media (max-width:767px){.page-shell{padding-top:130px;padding-bottom:50px}}

/* Page hero strip */
.page-hero{background:var(--green);color:#fff;padding:190px 0 70px;position:relative;overflow:hidden}
.page-hero:before{content:"";position:absolute;inset:0;background:var(--page-hero-img,none) center/cover no-repeat;opacity:.22}
.page-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(13,23,18,.85),rgba(13,23,18,.35))}
.page-hero .container{position:relative;z-index:2}
.page-hero .section-label{background:rgba(189,149,92,.2);color:var(--gold-lt)}
.page-hero h1{font-family:var(--serif);font-size:clamp(30px,4.6vw,52px);color:#F7F3E7;margin:0 0 14px;line-height:1.12}
.page-hero .page-hero-meta{color:rgba(255,255,240,.7);font-size:13px;letter-spacing:1.6px;text-transform:uppercase;margin:0}
.page-hero .page-hero-meta a{color:var(--gold-lt)}
.page-hero + .page-shell{padding-top:70px}
@media (max-width:991px){.page-hero{padding:150px 0 55px}.page-hero + .page-shell{padding-top:50px}}

/* Article body */
.page-content{max-width:820px;margin:0 auto}
.page-content > *:first-child{margin-top:0}
.page-content p{font-size:17.5px;line-height:1.9;color:var(--body);font-weight:300;margin:0 0 28px}
.page-content h2{font-family:var(--serif);font-size:clamp(26px,3.2vw,34px);color:var(--green);margin:52px 0 18px}
.page-content h3{font-family:var(--serif);font-size:clamp(21px,2.4vw,25px);color:var(--green);margin:38px 0 14px}
.page-content h4{font-family:var(--sans);font-weight:600;font-size:18px;color:var(--green);margin:30px 0 12px}
.page-content ul,.page-content ol{margin:0 0 28px;padding-left:24px;color:var(--body);font-weight:300}
.page-content li{margin-bottom:10px;line-height:1.85;font-size:17px}
.page-content a{color:var(--gold-dk);text-decoration:underline;text-underline-offset:3px;transition:color .3s}
.page-content a:hover{color:var(--green)}
/* A quotation is a surface of its own, not a paragraph with a bar beside it:
   full stone ground, one hairline all the way round, even padding on all four
   sides so the text sits centred in its box rather than pushed off one edge. */
.page-content blockquote{background:var(--stone);border:1px solid rgba(189,149,92,.3);padding:30px 34px;margin:38px 0;border-radius:3px}
.page-content blockquote p{font-family:var(--serif);font-style:italic;font-size:20px;color:var(--green);margin:0}
.page-content img,.page-content .wp-block-image img{border-radius:12px;margin:34px 0;box-shadow:0 20px 60px rgba(33,54,44,.12)}
.page-content figcaption{font-size:13px;color:#8b8b82;text-align:center;margin-top:-22px;margin-bottom:34px;letter-spacing:.4px}
.page-content hr{border:0;height:1px;background:rgba(189,149,92,.35);margin:46px auto;max-width:200px}
.page-content table{width:100%;border-collapse:collapse;margin:0 0 32px;font-size:15px}
.page-content th{background:var(--green);color:#fff;text-align:left;padding:13px 16px;font-weight:600;font-size:13px;letter-spacing:1px;text-transform:uppercase}
.page-content td{padding:13px 16px;border-bottom:1px solid #eae6df;color:var(--body);font-weight:300}
.page-content tr:nth-child(even) td{background:#fbfaf7}
.page-content .wp-caption{max-width:100%}
.page-content code{background:var(--stone);padding:2px 7px;border-radius:4px;font-size:14px}
.page-content pre{background:var(--green);color:#F7F3E7;padding:22px;border-radius:10px;overflow-x:auto;margin:0 0 30px}
.page-content pre code{background:none;color:inherit;padding:0}
.entry-featured{border-radius:14px;overflow:hidden;margin:0 0 44px;box-shadow:0 24px 60px rgba(33,54,44,.14)}
.entry-featured img{width:100%;height:auto}

/* ---------- Imported article content blocks ----------
   The article HTML uses a small fixed vocabulary of block classes. Every card
   is exactly one <p> whose leading <strong> acts as its heading, so that
   <strong> is promoted to a block-level title rather than run-in bold. */
.page-content .activity-cards,
.page-content .season-cards,
.page-content .comparison-grid,
.page-content .pack-grid{display:grid;gap:20px;margin:0 0 34px}
.page-content .activity-cards,
.page-content .season-cards{grid-template-columns:repeat(auto-fit,minmax(248px,1fr))}
.page-content .comparison-grid,
.page-content .pack-grid{grid-template-columns:repeat(auto-fit,minmax(272px,1fr))}

.page-content .activity-card,
.page-content .season-card,
.page-content .comparison-card,
.page-content .pack-category{background:#fff;border:1px solid #eae6df;border-radius:12px;padding:24px 26px;box-shadow:0 8px 26px rgba(33,54,44,.05)}
.page-content .activity-card p,
.page-content .season-card p,
.page-content .comparison-card p,
.page-content .pack-category p{margin:0;font-size:15.5px;line-height:1.8}
.page-content .activity-card p > strong:first-child,
.page-content .season-card p > strong:first-child,
.page-content .comparison-card p > strong:first-child,
.page-content .pack-category p > strong:first-child{display:block;font-family:var(--serif);font-weight:400;font-size:18px;line-height:1.3;color:var(--green);margin-bottom:9px}

/* Season and comparison cards carry a gold rule so they read as a set. */
.page-content .season-card{border-top:3px solid var(--gold);background:var(--stone)}
.page-content .comparison-card{border-top:3px solid var(--green-2)}
.page-content .pack-category{background:var(--stone);border-style:dashed}

/* Base note style. inner.css takes this further (warm ground, hanging icon,
   hairline rules); what matters here is that the base carries no left rule and
   no one-sided radius, so the block is a finished surface even alone. */
.page-content .tip-box{background:var(--stone);border:1px solid rgba(189,149,92,.3);border-radius:12px;padding:26px 30px;margin:0 0 34px}
.page-content .tip-box p{margin:0;font-size:16.5px;line-height:1.85;color:var(--green)}

.page-content .pull-quote{margin:44px 0;padding:34px 0;border-top:1px solid rgba(189,149,92,.35);border-bottom:1px solid rgba(189,149,92,.35);text-align:center}
.page-content .pull-quote p{margin:0;font-family:var(--serif);font-size:clamp(20px,2.6vw,26px);line-height:1.55;color:var(--green)}

@media (max-width:575px){
  .page-content .activity-cards,
  .page-content .season-cards,
  .page-content .comparison-grid,
  .page-content .pack-grid{grid-template-columns:1fr;gap:16px}
  .page-content .tip-box{padding:20px 22px}
}

/* ---------- Safari package content ---------- */
.pkg-facts{display:flex;flex-wrap:wrap;gap:10px 26px;margin:0 0 38px;padding:20px 26px;background:var(--stone);border-radius:12px;border:1px solid #eae6df}
.pkg-fact{display:flex;flex-direction:column;gap:3px}
.pkg-fact b{font-size:10.5px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--gold-dk)}
.pkg-fact span{font-size:15px;color:var(--green);font-weight:400}
.page-content .where{font-family:var(--sans);font-weight:600;font-size:14px;color:var(--gold-dk);margin:0 0 6px}
.page-content .meta{font-family:var(--sans);font-size:14.5px;color:#7b7b72;margin:0 0 34px}
.page-content .price{background:var(--stone);border:1px solid rgba(189,149,92,.3);border-radius:12px;padding:26px 30px;font-size:16.5px}
.page-content .pkg-related{margin:48px 0 0;padding:28px 30px;background:var(--green);border-radius:14px}
.page-content .pkg-related h2{color:#F7F3E7;margin:0 0 16px;font-size:22px}
.page-content .pkg-related ul{margin:0;padding-left:20px}
.page-content .pkg-related li{color:rgba(255,255,240,.8)}
.page-content .pkg-related a{color:var(--gold-lt)}
.page-content .pkg-related a:hover{color:#fff}
.page-content .pkg-related li{margin-bottom:9px}
.page-content .pkg-related-days{color:rgba(255,255,240,.5);font-size:13px;margin-left:6px}

/* Injected internal links: pillar section links and cluster back-links.
 *
 * .cluster-link is one line of navigation — "Full guide: <title>" — dropped at
 * the foot of a section on the two pillar pages, seven times on one and
 * thirteen on the other. It used to be a gold rule down its left edge with the
 * text pushed 16px clear of it, which is what the bar-and-indent device always
 * looks like when it is repeated: a stack of ticks in the margin.
 *
 * A card would be worse. Thirteen boxes around thirteen single lines is more
 * furniture than the prose they interrupt. So the block loses its box entirely
 * and is set instead: the standing "Full guide:" text drops to a small
 * letterspaced sans label, the title rises to serif at reading size with a gold
 * underline, and a gold arrow leads the line in — carrying the wayfinding the
 * bar was there for without indenting anything. No padding on any side, so the
 * line starts on exactly the same left edge as the paragraph above it. */
.page-content .cluster-link{margin:-6px 0 34px;padding:0;border:0;font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:2.1px;text-transform:uppercase;line-height:1.7;color:var(--green)}
.page-content .cluster-link:before{content:"\f061";font-family:"Font Awesome 6 Free";font-weight:900;font-size:10px;letter-spacing:0;color:var(--gold-dk);margin-right:12px;vertical-align:1px}
.page-content .cluster-link a{font-family:var(--serif);font-size:18px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--green);text-decoration:none;border-bottom:1px solid rgba(189,149,92,.55);padding-bottom:2px;transition:color .3s,border-color .3s}
.page-content .cluster-link a:hover{color:var(--gold-dk);border-color:var(--gold-dk)}
.page-content .pillar-backlink{margin:26px 0 0;font-size:15.5px;color:#7b7b72}

/* In-body photographs. The source articles shipped with no images, so these
   are injected at section breaks and need to sit apart from the prose. */
.page-content .article-figure{margin:40px 0;padding:0}
/* width:100% so the width/height attributes can reserve space before decode,
   capped by a per-image inline max-width so small frames are never upscaled. */
.page-content .article-figure img{display:block;width:100%;height:auto;margin:0 auto;border-radius:12px;box-shadow:0 20px 60px rgba(33,54,44,.14)}
.page-content .article-figure figcaption{margin-top:12px;font-size:13.5px;line-height:1.6;color:#8b8b82;letter-spacing:.3px;text-align:center}
@media (max-width:575px){
  .page-content .article-figure{margin:28px 0}
  .page-content .article-figure img{border-radius:8px}
}

/* Package taxonomy chips on the single template */
.pkg-tax{margin:48px 0 0;padding-top:30px;border-top:1px solid rgba(189,149,92,.35)}
.pkg-tax-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 14px;margin-bottom:14px}
.pkg-tax-row b{flex:0 0 auto;min-width:130px;font-size:10.5px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--gold-dk)}
.pkg-tax-row ul{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.pkg-tax-row li{margin:0}
.pkg-tax-row a{display:inline-block;padding:6px 14px;border-radius:9999px;background:var(--stone);border:1px solid #eae6df;font-size:13px;color:var(--green);text-decoration:none}
.pkg-tax-row a:hover{background:var(--green);border-color:var(--green);color:#F7F3E7}

/* Package archive grid */
.pkg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px;margin-bottom:56px}
.pkg-card{display:flex;flex-direction:column;background:#fff;border:1px solid #eae6df;border-radius:14px;padding:28px 30px;box-shadow:0 10px 34px rgba(33,54,44,.06);transition:transform .3s,box-shadow .3s}
.pkg-card:hover{transform:translateY(-4px);box-shadow:0 20px 50px rgba(33,54,44,.12)}
.pkg-card-dest{align-self:flex-start;font-size:10.5px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--gold-dk);background:rgba(189,149,92,.14);padding:5px 13px;border-radius:9999px;margin-bottom:14px}
.pkg-card-title{font-family:var(--serif);font-size:22px;line-height:1.25;margin:0 0 6px}
.pkg-card-title a{color:var(--green);text-decoration:none}
.pkg-card-title a:hover{color:var(--gold-dk)}
.pkg-card-days{font-size:13px;letter-spacing:1.4px;text-transform:uppercase;color:#8b8b82;margin:0 0 14px}
.pkg-card-excerpt{font-size:15px;line-height:1.75;color:var(--body);font-weight:300;margin:0 0 16px}
.pkg-card-where{font-size:13px;line-height:1.6;color:#8b8b82;margin:0 0 20px}
.pkg-card-link{margin-top:auto;align-self:flex-start;font-size:13px;font-weight:600;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold-dk);text-decoration:none;border-bottom:1px solid rgba(189,149,92,.5);padding-bottom:3px}
.pkg-card-link:hover{color:var(--green);border-color:var(--green)}
@media (max-width:575px){
  .pkg-grid{grid-template-columns:1fr;gap:18px}
  .pkg-card{padding:22px 24px}
  .pkg-tax-row b{min-width:100%}
}

/* WP alignment + block utilities */
.alignwide{max-width:1100px;margin-left:auto;margin-right:auto}
.alignfull{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.alignleft{float:left;margin:6px 32px 22px 0}
.alignright{float:right;margin:6px 0 22px 32px}
.aligncenter{margin-left:auto;margin-right:auto;text-align:center}
.wp-block-button__link{display:inline-block;background:linear-gradient(135deg,var(--gold),var(--gold-lt));color:var(--green)!important;padding:14px 30px;border-radius:9999px;font-weight:600;text-decoration:none!important;letter-spacing:.5px}

/* Post navigation */
.post-nav{max-width:820px;margin:64px auto 0;padding-top:38px;border-top:1px solid rgba(189,149,92,.3);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.post-nav a{display:block;max-width:320px;color:var(--green);transition:color .3s}
.post-nav a:hover{color:var(--gold-dk)}
.post-nav .pn-label{display:block;font-size:11px;letter-spacing:2.4px;text-transform:uppercase;color:var(--gold-dk);margin-bottom:7px;font-weight:600}
.post-nav .pn-title{font-family:var(--serif);font-size:18px;line-height:1.35}
.post-nav .pn-next{text-align:right;margin-left:auto}

/* Archive / blog listing grid */
.archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
@media (max-width:991px){.archive-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.archive-grid{grid-template-columns:1fr}}
.archive-grid .news-card{height:100%;margin-bottom:0}

/* Pagination */
.intare-pagination{margin-top:54px;text-align:center}
.intare-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 12px;margin:0 4px;border-radius:50px;border:1px solid rgba(189,149,92,.35);color:var(--green);font-size:14px;transition:.3s}
.intare-pagination .page-numbers:hover,.intare-pagination .page-numbers.current{background:var(--gold);border-color:var(--gold);color:var(--green)}

/* Comments */
.comments-area{max-width:820px;margin:64px auto 0}
.comments-area .comment-reply-title,.comments-area .comments-title{font-family:var(--serif);font-size:26px;color:var(--green);margin:0 0 24px}
.comments-area ol.comment-list{list-style:none;padding:0;margin:0 0 40px}
.comments-area .comment-body{background:var(--stone);border-radius:12px;padding:22px 26px;margin-bottom:18px}
.comments-area input[type=text],.comments-area input[type=email],.comments-area input[type=url],.comments-area textarea{width:100%;padding:12px 14px;border:1px solid #e2ded7;border-radius:8px;font-family:var(--sans);font-weight:300;background:#fdfcfa;margin-bottom:14px}
.comments-area .submit{padding:14px 32px;background:linear-gradient(135deg,var(--gold),var(--gold-lt));border:none;border-radius:8px;color:var(--green);font-weight:600;text-transform:uppercase;letter-spacing:1.4px;cursor:pointer}

/* 404 / empty states */
.state-block{text-align:center;max-width:640px;margin:0 auto}
.state-block .big{font-family:var(--serif);font-size:clamp(64px,12vw,140px);color:rgba(189,149,92,.35);line-height:1;margin:0 0 10px}

/* Search form */
.intare-search{display:flex;gap:10px;max-width:520px;margin:0 auto}
.intare-search input[type=search]{flex:1;padding:14px 20px;border:1px solid #e2ded7;border-radius:50px;font-family:var(--sans);font-weight:300;background:#fff}
.intare-search button{padding:14px 28px;background:linear-gradient(135deg,var(--gold),var(--gold-lt));border:none;border-radius:50px;color:var(--green);font-weight:600;text-transform:uppercase;letter-spacing:1.2px;cursor:pointer}

/* Read-more link used by homepage sections */
.section-readmore{display:inline-flex;align-items:center;gap:8px;font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:2.4px;text-transform:uppercase;color:var(--gold-dk);margin-top:16px;transition:all .3s}
.section-readmore i{font-size:9px;transition:transform .3s}
.section-readmore:hover{color:var(--green)}
.section-readmore:hover i{transform:translateX(4px)}

/* --- Menu-driven mega menu: WP adds its own classes, map them --- */
.nav-links li.menu-item-has-children{position:static}
.nav-links > li.menu-item-has-children.has-dropdown{position:static}
.nav-links .mega-menu-section ul li a i{flex-shrink:0}
.nav-links > li.current-menu-item > .nav-link,
.nav-links > li.current-menu-ancestor > .nav-link{color:var(--gold)}
.nav-link.cta-button:hover{color:var(--green)!important}
.mobile-menu > li.current-menu-item > a{color:var(--gold)}

/* Widgets (footer / sidebar safety net) */
.widget{margin-bottom:34px}
.widget ul{list-style:none;padding:0;margin:0}
.widget ul li{margin-bottom:11px}

/* =====================================================================
   6. MOBILE DRAWER HARDENING
   The design drawer is a right-slide panel. Pin its height with dvh so
   long menus (Destinations has 8+ children) never collapse, keep the
   background fully opaque, and lock body scroll properly on iOS.
   ===================================================================== */
.mobile-nav{
  top:0;bottom:0;
  height:100vh;
  height:100dvh;
  max-height:100vh;
  max-height:100dvh;
  background:#21362C;               /* fully opaque — no page bleed-through */
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding-bottom:64px;              /* clears the iOS home indicator */
  box-shadow:-18px 0 60px rgba(0,0,0,.45);
}
.admin-bar .mobile-nav{top:46px;height:calc(100dvh - 46px);max-height:calc(100dvh - 46px)}
@media screen and (min-width:783px){.admin-bar .mobile-nav{top:32px;height:calc(100dvh - 32px);max-height:calc(100dvh - 32px)}}
.mobile-nav-header{position:sticky;top:0;z-index:2;background:#21362C}
.mobile-menu>li>a i{transition:transform .3s}
.mobile-menu .mobile-submenu li a{border-bottom:1px solid rgba(255,255,255,.05)}
.mobile-menu .mobile-submenu li:last-child a{border-bottom:0}
/* Sub-menus inside the drawer never rely on :hover — they are toggled by JS
   and, failing that, revealed by the no-JS fallback below. */
html.no-js .mobile-submenu{max-height:none}

/* Stronger scroll lock than overflow:hidden alone.
   height:100% used to be set on both elements, which collapses the scrollport
   to one viewport and throws the visitor back to the top of the page the
   instant the drawer opens. The position is parked on the body instead, and
   ui.js restores it on close. */
html.nav-open{overflow:hidden!important;touch-action:none}
body.nav-open{position:fixed;left:0;right:0;width:100%;overflow:hidden!important;touch-action:none}

@media (max-width:991px){
  .mobile-menu>li>a{padding:15px 22px}
}
@media (max-width:380px){
  .mobile-nav{width:290px}
  .mobile-nav-header svg{height:54px}
}

/* =====================================================================
   7. REDUCED MOTION
   ===================================================================== */
/* has-anim is never added under reduced motion, so these are belt-and-braces
   for a preference that flips mid-session (the class stays, the media query
   updates live). */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  html.has-anim .cta-zoom{height:auto!important;padding:110px 0!important}
  html.has-anim .cta-zoom-text{opacity:1!important;transform:none!important}
  html.has-anim .cta-zoom-media{clip-path:none!important}
  html.has-anim .cta-zoom-ring{display:none!important}
  html.atlas-anim .atlas .region{opacity:1!important}
}

/* =====================================================================
   8. MARKUP DIFFERENCES INTRODUCED BY WORDPRESS
   Small additions where the WP version of an element differs from the
   static design (anchors instead of buttons, menu-driven captions, etc.).
   ===================================================================== */

/* The footer "Plan My Safari" control is an <a> here, not a <button>. */
a.stp-footer-cta{display:inline-flex;align-items:center;gap:8px;text-decoration:none}
a.stp-footer-cta:hover{color:var(--green)}

/* Custom Logo images stand in for the inline SVG wordmark. */
.brand-logo{width:auto;object-fit:contain}
.brand-logo--nav{height:90px;transition:height .3s}
.main-nav.scrolled .brand-logo--nav{height:70px}
.brand-logo--mobile{height:64px}
.brand-logo--footer{height:110px;max-width:260px;margin-bottom:20px}
@media (max-width:1199px){.brand-logo--nav{height:84px}}
@media (max-width:991px){.brand-logo--nav{height:70px}}

.footer-brand > a{display:inline-block}
.mobile-nav-logo{display:inline-block;line-height:0}

/* Group captions inside the mobile drawer (level-2 menu headings). */
.mobile-subhead{padding:14px 34px 6px}
.mobile-subhead span{display:block;font-size:10px;font-weight:600;letter-spacing:2.6px;text-transform:uppercase;color:var(--gold)}
.mobile-subhead + li a{padding-top:9px}

/* The drawer's own CTA row, mirroring the header pill. */
.mobile-menu > li.mobile-cta > a{color:var(--gold);font-weight:600}

/* Mega-menu column headings become links when the menu item has a real URL. */
.mega-menu-section h4 a{color:inherit;transition:color .3s}
.mega-menu-section h4 a:hover{color:#fff}

/* A parent nav item rendered as role="button" must still look clickable. */
.nav-link[role="button"]{cursor:pointer}

/* =====================================================================
   NARROW / SIMPLE DROPDOWN ANCHORING
   Full-width mega panels resolve against .nav-wrapper, which is what makes
   them span the container. The narrow panel was doing the same and pinning
   itself to the container's right edge — right for "Plan Your Trip" only by
   coincidence, and 700px adrift for anything in the left nav. These panels
   now resolve against their own <li> instead: left-anchored in the left nav,
   right-anchored in the right nav so neither can run past the container.
   ===================================================================== */
/* The <li> has to span the bar's full height or `top:100%` would drop the
   panel level with the label rather than below the header. */
.nav-links{align-self:stretch}
.nav-links>li{display:flex;align-items:center;align-self:stretch}
.nav-links>li.menu-item-has-children.has-dropdown.dropdown-narrow{position:relative}
.nav-left .mega-menu.narrow,.nav-left .mega-menu.simple-menu{left:0;right:auto}
.nav-right .mega-menu.narrow,.nav-right .mega-menu.simple-menu{left:auto;right:0}

/* A handful of short links needs a list, not a grid of empty columns. */
.mega-menu.simple-menu{width:max-content;min-width:210px;max-width:calc(100vw - 40px);padding:14px 10px}
.simple-menu-list{list-style:none;margin:0;padding:0}
.simple-menu-list li a{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:8px;color:rgba(255,255,255,.85);font-size:14px;font-weight:300;white-space:nowrap;transition:color .3s,background .3s}
.simple-menu-list li a i{color:var(--gold);font-size:10px;flex-shrink:0;transition:transform .3s}
.simple-menu-list li a:hover,.simple-menu-list li a:focus{color:var(--gold);background:rgba(189,149,92,.12)}
.simple-menu-list li a:hover i,.simple-menu-list li a:focus i{transform:translateX(3px)}

/* Bootstrap 3 resets that fight the design. */
.container{width:auto;max-width:1400px}
@media (min-width:1200px){.container{max-width:1400px}}
.badge{display:inline-flex;font-weight:400;line-height:normal;background-color:transparent}
.trust-badges .badge{min-width:0}
a:focus,a:hover{text-decoration:none}

/* Typography guard: if Bootstrap ever stops loading, keep the design's
   inheritance rather than falling back to the browser's serif defaults.
   Headings carry no family of their own in the design — they inherit Inter
   from <body>, and only the classed headings opt into Lustria. */
h1,h2,h3,h4,h5,h6,button,input,optgroup,select,textarea{font-family:inherit}
.section-heading,.destinations-heading,.faq-title,.contact-title,
.vh-title,.card-title{font-family:var(--serif)}
.brand-tagline{font-family:var(--script)}   /* Monsieur La Doulaise */

/* =====================================================================
   9. BRAND MARK, ACCREDITATION, FORMS AND THE ABOUT PAGE
   Added alongside the About / Contact / Booking Terms pages.
   ===================================================================== */

/* ---------- The company logo on dark ----------
   The supplied mark is a transparent file whose "Intare" wordmark is dark
   green, and both the nav and the footer are dark green. Rather than recolour
   somebody's logo, it is set on a light plate so it keeps its own palette and
   stays legible in every state the header has. */
.brand-logo{background:#FFFFF0;padding:8px 14px;border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,.18)}
.brand-logo--nav{height:70px;padding:7px 13px}
.main-nav.scrolled .brand-logo--nav{height:58px}
.brand-logo--mobile{height:52px;padding:6px 11px}
.brand-logo--footer{height:82px;padding:9px 16px;margin-bottom:22px}
/* Each breakpoint restates the .scrolled selector as well. Without it the
   .main-nav.scrolled rule above out-specifies the media query and the logo
   stays at its desktop height on phones — media queries add no specificity. */
@media (max-width:1199px){
  .main-nav .brand-logo--nav,
  .main-nav.scrolled .brand-logo--nav{height:62px}
}
@media (max-width:991px){
  .main-nav .brand-logo--nav,
  .main-nav.scrolled .brand-logo--nav{height:54px;padding:6px 11px}
}
@media (max-width:575px){
  .main-nav .brand-logo--nav,
  .main-nav.scrolled .brand-logo--nav{height:46px}
  .brand-logo--footer{height:70px}
}

/* ---------- Accreditation strip ----------
   Every one of these marks was drawn for a white background, so each sits on
   its own plate. Grayscale at rest keeps the footer calm; full colour on hover
   confirms the badge is real and clickable. */
.footer-partners{margin-top:52px;padding-top:34px;border-top:1px solid rgba(189,149,92,.18)}
.footer-partners .partners-heading{margin:0 0 20px;font-size:11px;font-weight:600;letter-spacing:2.6px;text-transform:uppercase;color:var(--gold-lt);text-align:center}
.partner-list{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;margin:0;padding:0;list-style:none}
.partner-item{margin:0}
.partner-link{display:flex;align-items:center;justify-content:center;height:74px;width:150px;padding:12px 16px;background:#fff;border-radius:10px;transition:transform .3s,box-shadow .3s,filter .3s;filter:grayscale(1);opacity:.88}
.partner-link:hover,.partner-link:focus-visible{filter:none;opacity:1;transform:translateY(-3px);box-shadow:0 14px 34px rgba(0,0,0,.28)}
.partner-logo{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
@media (max-width:575px){
  .partner-list{gap:12px}
  .partner-link{height:62px;width:126px;padding:10px 12px}
  .footer-partners{margin-top:38px;padding-top:26px}
}

/* On the About page the same strip runs on cream, with a line of context
   under each mark, so it reads as evidence rather than decoration. */
.page-content .credential-strip{margin:0 0 40px}
.page-content .credential-strip .partners-heading{margin:0 0 22px;font-size:11px;font-weight:600;letter-spacing:2.6px;text-transform:uppercase;color:var(--gold-dk);text-align:center}
/* Grid rather than the footer's flex row: the content column is capped at
   820px, where four flex items with a 250px basis wrap 3 + 1. auto-fit keeps
   all four on one line here and drops cleanly to two on a phone. */
.page-content .credential-strip .partner-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));align-items:stretch;gap:20px}
.page-content .credential-strip .partner-item{display:flex;flex-direction:column;align-items:center}
.page-content .credential-strip .partner-link{filter:none;opacity:1;height:86px;width:100%;border:1px solid #eae6df;box-shadow:0 8px 26px rgba(33,54,44,.05)}
.page-content .credential-strip .partner-link:hover{box-shadow:0 16px 40px rgba(33,54,44,.14)}
.page-content .credential-strip .partner-role{margin:12px 0 0;font-size:13.5px;line-height:1.65;color:#7b7b72;text-align:center}

/* ---------- Team ---------- */
.page-content .team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px;margin:0 0 38px}
.page-content .team-card{background:#fff;border:1px solid #eae6df;border-top:3px solid var(--gold);border-radius:12px;padding:26px 28px;box-shadow:0 8px 26px rgba(33,54,44,.05)}
.page-content .team-card p{margin:0;font-size:15.5px;line-height:1.8}
.page-content .team-card p > strong:first-child{display:block;font-family:var(--serif);font-weight:400;font-size:19px;line-height:1.3;color:var(--green);margin-bottom:2px}
.page-content .team-card .role{display:block;font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--gold-dk);margin-bottom:12px}

/* ---------- Numbers ---------- */
.page-content .stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:2px;margin:0 0 38px;background:#eae6df;border:1px solid #eae6df;border-radius:12px;overflow:hidden}
.page-content .stat{background:var(--stone);padding:26px 20px;text-align:center}
.page-content .stat b{display:block;font-family:var(--serif);font-size:34px;line-height:1.1;color:var(--green);margin-bottom:6px}
.page-content .stat span{display:block;font-size:12px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:var(--gold-dk)}

/* ---------- Promise / guarantee list ---------- */
.page-content .promise-list{list-style:none;padding:0;margin:0 0 34px}
.page-content .promise-list li{position:relative;padding:0 0 0 34px;margin-bottom:16px;font-size:16.5px;line-height:1.8}
.page-content .promise-list li:before{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:0;top:2px;color:var(--gold-dk);font-size:14px}

/* ---------- Terms ---------- */
.page-content .terms-meta{margin:0 0 34px;padding:18px 24px;background:var(--stone);border:1px dashed #d9d2c6;border-radius:12px;color:#7b7b72}
.page-content .terms-meta p{margin:0 0 8px;font-size:14.5px;line-height:1.8}
.page-content .terms-meta p:last-child{margin:0}
.page-content .terms-toc{margin:0 0 44px;padding:26px 30px;background:var(--green);border-radius:12px}
.page-content .terms-toc h2{color:#F7F3E7;font-size:20px;margin:0 0 16px}
.page-content .terms-toc ol{margin:0;padding-left:20px;columns:2;column-gap:34px}
.page-content .terms-toc li{color:rgba(255,255,240,.75);font-size:14.5px;margin-bottom:8px;break-inside:avoid}
.page-content .terms-toc a{color:var(--gold-lt);text-decoration:none}
.page-content .terms-toc a:hover{color:#fff}
@media (max-width:575px){.page-content .terms-toc ol{columns:1}}

/* ---------- Contact cards ---------- */
.page-content .contact-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px;margin:0 0 40px}
.page-content .contact-card{background:#fff;border:1px solid #eae6df;border-radius:12px;padding:26px 28px;box-shadow:0 8px 26px rgba(33,54,44,.05)}
.page-content .contact-card > i{display:block;font-size:20px;color:var(--gold-dk);margin-bottom:14px}
.page-content .contact-card p{margin:0;font-size:15.5px;line-height:1.75}
.page-content .contact-card p > strong:first-child{display:block;font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--green);margin-bottom:7px;font-family:var(--sans)}
.page-content .contact-card a{font-size:17px;text-decoration:none;border-bottom:1px solid rgba(189,149,92,.5);padding-bottom:2px}

/* =====================================================================
   ENQUIRY FORM
   ===================================================================== */
.enquiry-block{margin:0 0 20px;scroll-margin-top:150px}
.enquiry-title{font-family:var(--serif);font-size:clamp(24px,3vw,32px);color:var(--green);margin:0 0 12px}
.enquiry-sub{font-size:16.5px;line-height:1.85;color:var(--body);font-weight:300;margin:0 0 32px}

.enquiry-form{background:#fff;border:1px solid #eae6df;border-radius:14px;padding:34px 36px;box-shadow:0 14px 44px rgba(33,54,44,.07)}
.enquiry-form .form-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px 22px}
.enquiry-form .form-field{grid-column:1/-1;margin:0}
.enquiry-form .form-field--half{grid-column:span 2}
.enquiry-form .form-field--quarter{grid-column:span 1}

.enquiry-form label{display:block;font-size:11.5px;font-weight:600;letter-spacing:1.6px;text-transform:uppercase;color:var(--green);margin-bottom:8px}
.enquiry-form label .req{color:var(--gold-dk)}

.enquiry-form input[type="text"],
.enquiry-form input[type="email"],
.enquiry-form input[type="tel"],
.enquiry-form input[type="number"],
.enquiry-form select,
.enquiry-form textarea{
  width:100%;padding:13px 16px;font-family:var(--sans);font-size:15.5px;font-weight:300;color:var(--body);
  background:var(--stone);border:1px solid #e4ded4;border-radius:9px;transition:border-color .25s,background .25s,box-shadow .25s;
  -webkit-appearance:none;appearance:none;box-shadow:none;height:auto;line-height:1.5;
}
.enquiry-form select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%239E7B45' stroke-width='1.6' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;background-size:12px;padding-right:42px}
.enquiry-form textarea{min-height:150px;resize:vertical;line-height:1.75}
.enquiry-form input:focus,
.enquiry-form select:focus,
.enquiry-form textarea:focus{outline:none;background:#fff;border-color:var(--gold);box-shadow:0 0 0 3px rgba(189,149,92,.16)}
.enquiry-form ::placeholder{color:#a9a49b;opacity:1}

/* The honeypot. Positioned off-screen rather than display:none, because some
   bots skip fields they can tell are hidden. */
.enquiry-trap{position:absolute !important;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

.enquiry-form .form-consent .checkbox-label{display:flex;align-items:flex-start;gap:12px;font-size:14.5px;font-weight:300;letter-spacing:0;text-transform:none;color:var(--body);line-height:1.7;margin:0;cursor:pointer}
.enquiry-form .form-consent input[type="checkbox"]{flex:0 0 auto;width:18px;height:18px;margin:2px 0 0;accent-color:#9E7B45}

.enquiry-form .form-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;margin-top:28px;padding-top:26px;border-top:1px solid #f0ebe3}
.enquiry-form .form-submit{background:var(--green);color:#F7F3E7;border:0;border-radius:9999px;padding:16px 42px;font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:2.4px;text-transform:uppercase;cursor:pointer;transition:background .3s,transform .3s,box-shadow .3s}
.enquiry-form .form-submit:hover{background:var(--gold-dk);transform:translateY(-2px);box-shadow:0 14px 34px rgba(158,123,69,.32)}
.enquiry-form .form-submit:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.enquiry-form .form-reassure{flex:1 1 240px;font-size:13.5px;line-height:1.65;color:#8b8b82}
.enquiry-form .form-reassure i{color:var(--gold-dk);margin-right:7px}

.form-notice{display:flex;gap:16px;align-items:flex-start;padding:22px 26px;border-radius:12px;margin:0 0 30px}
.form-notice i{font-size:20px;flex:0 0 auto;margin-top:2px}
.form-notice strong{display:block;font-family:var(--serif);font-weight:400;font-size:19px;margin-bottom:6px}
.form-notice p{margin:0;font-size:15.5px;line-height:1.75;font-weight:300}
.form-notice ul{margin:6px 0 0;padding-left:20px;font-size:15.5px;line-height:1.75;font-weight:300}
.form-notice li{margin-bottom:5px}
/* The status of a notice is already carried by its ground and its icon, so the
   accent runs all the way round as a hairline rather than standing as a bar on
   one edge — the box closes, and the text keeps the even padding above. */
.form-notice--ok{background:rgba(45,74,62,.08);border:1px solid rgba(45,74,62,.3);color:var(--green)}
.form-notice--ok i{color:var(--green-2)}
.form-notice--error{background:rgba(158,123,69,.1);border:1px solid rgba(158,123,69,.45);color:#7a4b18}
.form-notice--error i{color:#a8551d}

@media (max-width:767px){
  .enquiry-form{padding:26px 22px;border-radius:12px}
  .enquiry-form .form-grid{grid-template-columns:repeat(2,1fr);gap:18px}
  .enquiry-form .form-field--half{grid-column:1/-1}
  .enquiry-form .form-field--quarter{grid-column:span 1}
  .enquiry-form .form-submit{width:100%;text-align:center}
}