:root{
  --cream:#FDF4F0; --ink:#14211F; --deep:#013430; --deeper:#002420;
  /* #FF3811 is the brand orange and stays on every graphic — icons, dots, the progress
     bar. Text and filled buttons need 4.5:1, which it misses on both the cream and the
     sage, so each of those gets the nearest shade that clears it:
       --orange-ink  small orange text on a light band   (5.8:1 cream, 4.5:1 sage)
       --orange-lit  orange text on one of the dark bands (4.8:1 on #013430)
       --orange-btn  filled buttons carrying a cream label (4.6:1) */
  --orange:#FF3811; --orange-ink:#BC2103; --orange-lit:#FF6A45; --orange-btn:#D82A05;
  --legacy-orange:#B8280B;
  --line:#E3ECEB; --line2:#E9F0EF; --muted:#5A6A66; --sage:#CFDFDC; --sage-2:#D7E5E3;
  /* v5 lifts the footer off the charcoal onto a mint band, so its text tokens run
     dark-on-light: --foot is the body copy, --foot-muted the licence and copyright
     lines, --foot-band the band itself. */
  --foot:#20423D; --foot-muted:#3D5C57; --foot-band:#DCE8E5;
  --pad:clamp(18px,4vw,48px); --wrap:1240px;
  /* the services band picks up the same sage as the header scrim over the hero */
  --mint:#CFDFDC;
  /* the destinations band is a half-step warmer than the page cream it used to share */
  --dest-band:#FEF8F5;
  /* How far the stats card rides up over the hero, and the run of extra hero padding
     that pays for it. v5 sinks 70% of the card into the hero, so the card has to be
     measured before either is known — these are the pre-measurement fallbacks, and the
     script overwrites both on load and on resize. Kept positive so the hero dots can be
     placed off them; .stats negates the overlap for its own top margin. */
  --stats-overlap:131px; --hero-extra:105px;
  /* white tick, drawn on top of the accent-coloured disc behind it */
  --check:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 12.4l3.6 3.6 7.4-8.2'/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
:target,#top,#services,#destinations,#consular,#contact{scroll-margin-top:104px}
body{margin:0;font-family:'Inter',system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--cream);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
a{color:var(--orange-ink);text-decoration:none;transition:color .25s ease}
a:hover{color:var(--deep)}
img{display:block;max-width:100%}
::selection{background:var(--orange-btn);color:var(--cream)}
h1,h2,h3{font-family:'Poppins',sans-serif;margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.line{display:block}
.eyebrow{margin:0 0 12px;font-family:'Poppins',sans-serif;font-weight:600;letter-spacing:3px;text-transform:uppercase;font-size:12px;color:var(--orange-ink)}
.h2{font-weight:700;font-size:clamp(29px,4.4vw,43px);line-height:1.08;letter-spacing:-.6px;color:var(--deep)}
.pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-family:'Poppins',sans-serif;font-weight:600;white-space:nowrap;transition:transform .2s ease,background .2s ease,filter .2s ease}
.pill:hover{transform:translateY(-2px)}
.pill-orange{background:var(--orange-btn);color:var(--cream)}
.pill-orange:hover{color:var(--cream);filter:brightness(1.06)}
.pill-glass{background:rgba(253,244,240,.14);color:var(--cream);border:1.5px solid rgba(253,244,240,.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.pill-glass:hover{color:var(--cream);background:rgba(253,244,240,.24)}

/* ---------- keyboard affordances ---------- */
.skip{position:absolute;left:12px;top:-64px;z-index:200;padding:12px 18px;border-radius:0 0 12px 12px;
  background:var(--deep);color:var(--cream);font-family:'Poppins',sans-serif;font-weight:600;font-size:15px;
  transition:top .2s ease}
.skip:focus{top:0;color:var(--cream)}
/* one visible ring everywhere, in whichever of the two brand darks reads on the band behind it */
:focus-visible{outline:3px solid var(--deep);outline-offset:3px;border-radius:4px}
.sec-consular :focus-visible,.sec-contact :focus-visible,.cruise-copy :focus-visible,
.menu :focus-visible,.dest:focus-visible{outline-color:#FFFFFF}

@keyframes heroZoom{0%{transform:scale(1)}100%{transform:scale(1.04)}}
/* the hero word is swapped with the slide behind it */
@keyframes wordSwap{0%{opacity:0;transform:translateY(14px);filter:blur(6px)}60%{filter:blur(0)}100%{opacity:1;transform:none;filter:blur(0)}}

/* ---------- header ---------- */
/* The header now sticks. --navp is the 0..1 ramp the scroll handler writes as the bar
   leaves the hero; everything below reads it, so a scroll frame costs one property set
   instead of eight. No transitions on the ramped properties — the smoothstep in JS is
   the easing, and a transition on a per-frame value only adds lag. */
.hdr{--navp:0;position:fixed;top:0;left:0;right:0;z-index:60;
  padding:calc(clamp(12px,1.8vw,18px) - 6px * var(--navp)) 0;
  box-shadow:0 calc(18px * var(--navp)) calc(40px * var(--navp)) -28px rgba(0,36,32,calc(.55 * var(--navp)))}
.hdr-scrim,.hdr-solid,.hdr-bar{position:absolute;pointer-events:none}
.hdr-scrim,.hdr-solid{inset:0}
/* over the hero: a sage wash that fades out to the right, so the photo keeps its light */
.hdr-scrim{opacity:calc(1 - var(--navp));
  background:linear-gradient(90deg,#CFDFDC 0%,rgba(207,223,220,.94) 30%,rgba(207,223,220,.62) 52%,rgba(207,223,220,.24) 72%,rgba(207,223,220,0) 88%)}
/* past the hero: the same wash over frosted cream, so text on the band stays legible */
.hdr-solid{opacity:var(--navp);
  background:linear-gradient(180deg,rgba(253,244,240,.95) 0%,rgba(253,244,240,.82) 60%,rgba(253,244,240,.62) 100%),
    linear-gradient(90deg,#CFDFDC 0%,rgba(207,223,220,.9) 34%,rgba(207,223,220,.5) 60%,rgba(207,223,220,.16) 82%,rgba(207,223,220,0) 100%);
  backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%)}
.hdr-bar{left:0;bottom:0;height:2px;width:100%;background:var(--orange);opacity:var(--navp);
  transform:scaleX(var(--scrolled,0));transform-origin:0 50%}
.hdr-in{position:relative;max-width:var(--wrap);margin:0 auto;padding:0 var(--pad);
  display:flex;align-items:center;gap:clamp(14px,2vw,28px)}
.plate{display:inline-flex;align-items:center}
.plate img{height:clamp(42px,4.6vw,54px);width:auto;transform-origin:left center;
  transform:scale(calc(1 - .14 * var(--navp)))}
.nav{flex:1;display:flex;align-items:center;justify-content:center}
.nav-pill{display:flex;align-items:center;height:44px;gap:clamp(18px,2.2vw,34px);padding:0 28px;border-radius:999px;
  background:rgba(255,255,255,calc(.42 + .38 * var(--navp)));border:1px solid rgba(255,255,255,.6);
  box-shadow:0 8px 30px -20px rgba(0,36,32,calc(.45 * var(--navp)));
  backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);
  transition:box-shadow .35s ease}
.nav a{color:var(--deep);font-weight:700;font-size:14.5px;letter-spacing:.1px;transition:color .35s ease}
.nav a:hover{color:var(--orange-ink)}
.hdr-cta{margin-left:auto;display:flex;align-items:center;gap:9px}
.btn-contact{height:44px;padding:0 15px;gap:7px;font-size:14px;color:var(--cream);
  background:var(--orange-btn);border:1px solid var(--orange-btn)}
.btn-contact:hover{color:var(--cream);filter:brightness(1.06)}
.burger{width:44px;height:44px;display:none;place-items:center;background:#FFFFFF;border:1px solid #E9E0DA;border-radius:999px;cursor:pointer;padding:0}
.burger span{display:block;width:18px;height:2px;background:var(--deep);border-radius:2px;box-shadow:0 6px 0 var(--deep),0 -6px 0 var(--deep)}

/* ---------- mobile menu ---------- */
.menu{position:fixed;inset:0;z-index:80;background:var(--deep);display:flex;flex-direction:column;padding:22px clamp(18px,5vw,40px);
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .3s ease,transform .3s ease,visibility 0s linear .3s}
.menu.open{opacity:1;visibility:visible;transform:none;
  transition:opacity .3s ease,transform .3s ease,visibility 0s}
.menu-top{display:flex;align-items:center;justify-content:space-between}
.menu-top img{height:28px;filter:brightness(0) invert(1)}
.menu-close{background:none;border:none;color:var(--cream);font-size:34px;line-height:1;cursor:pointer;padding:0}
.menu nav{display:flex;flex-direction:column;gap:2px;margin-top:36px}
.menu nav a{color:var(--cream);font-family:'Poppins',sans-serif;font-weight:600;font-size:23px;padding:13px 0;border-bottom:1px solid rgba(253,244,240,.12)}
.menu-book{margin-top:auto;text-align:center;background:var(--orange-btn);color:var(--cream);font-family:'Poppins',sans-serif;font-weight:600;font-size:17px;padding:16px;border-radius:12px}

@media (max-width:979px){
  .nav,.btn-contact .long{display:none}
  .burger{display:grid}
}

/* ---------- hero ---------- */
/* content-sized: the band is exactly as tall as the copy plus the action panel */
.hero{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;
  padding:clamp(90px,10vh,112px) 0 calc(clamp(46px,5vh,62px) + var(--hero-extra));
  background:var(--deeper);contain:layout paint;
  /* the taller hero now ends below where the services band starts, so it has to sit
     above it — .sec-services takes the matching z-index:1 */
  z-index:10}
.hero-bg{position:absolute;inset:-3% 0 0 0;z-index:1;overflow:hidden;will-change:transform;transform:translateZ(0)}
/* the slides stack and cross-fade; each keeps its subject framed via object-position */
.hero-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
  animation:heroZoom 40s ease-in-out infinite alternate;transition:opacity 1.2s ease;
  will-change:transform,opacity;backface-visibility:hidden}
.hero-bg img.on{opacity:1}
.s-cruise{object-position:85% 54%}
.s-safari{object-position:68% 60%}
.s-taj{object-position:68% 0%}
@media (max-width:899px){
  .s-cruise{object-position:90% 58%}
  .s-safari{object-position:72% 62%}
  .s-taj{object-position:70% 0%}
}
/* Logged into WordPress, the admin bar is fixed across the top of the viewport and the
   header — also fixed — would sit behind it, clipping the logo. Stepping the header down
   by the bar's own height clears it. Inert for visitors: WordPress only puts .admin-bar
   on the body when the bar is actually showing, and the static page never has it at all.
   (Below 601px WordPress unfixes its own bar, so a scrolled admin view on a phone floats
   the header by that offset — admin-only, and not worth scripting around.) */
body.admin-bar .hdr{top:32px}
@media screen and (max-width:782px){body.admin-bar .hdr{top:46px}}
/* The design parks the dots inside the parallax layer, high enough that the action
   panel (which outranks them) covers them completely and the scroll transform carries
   whatever is left down into the services band. Anchoring them to the hero and to the
   two measured lengths instead keeps them where they were meant to read: centred in the
   strip the hero leaves between the foot of the action panel and the top edge of the
   stats card, wherever that card settles. */
.hero-dots{position:absolute;left:50%;z-index:25;display:flex;gap:8px;transform:translateX(-50%);
  bottom:calc(var(--stats-overlap) + (clamp(46px,5vh,62px) + var(--hero-extra) - var(--stats-overlap) - 8px) / 2)}
.hero-dots button{position:relative;width:8px;height:8px;padding:0;border:none;border-radius:50%;cursor:pointer;
  background:rgba(1,52,48,.35);transition:background .3s ease,transform .3s ease}
/* an 8px dot is under any sane target-size floor, so each one carries a 24px hit area */
.hero-dots button::after{content:"";position:absolute;left:50%;top:50%;width:24px;height:24px;transform:translate(-50%,-50%)}
.hero-dots button.on{background:var(--deep);transform:scale(1.3)}
.hero-dots button:focus-visible{outline-offset:5px}
.hero-in{position:relative;z-index:30;width:100%}
/* the pill sits under the Contact button in the header, centred on it — the shift is
   half the width difference between the two, measured at runtime */
.hero-trust{display:flex;justify-content:flex-end;margin-bottom:clamp(12px,1.6vw,18px)}
.hero-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 12px 6px 9px;border-radius:999px;
  background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.85);
  backdrop-filter:blur(12px) saturate(140%);-webkit-backdrop-filter:blur(12px) saturate(140%);
  margin-right:var(--trust-shift,0px);white-space:nowrap;
  font-family:'Poppins',sans-serif;font-weight:700;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--deep)}
.hero-badge i{flex:none;display:grid;place-items:center;width:17px;height:17px;border-radius:50%;background:var(--orange);color:#fff}
.hero h1{margin:0 0 14px;font-weight:700;font-size:clamp(29px,4.4vw,42px);line-height:1.1;letter-spacing:-1.2px;
  color:var(--deep);text-shadow:0 2px 24px rgba(255,255,255,.35)}
.hero h1 em{display:inline-block;color:var(--orange);font-weight:800;font-style:normal}
.hero h1 em.swap{animation:wordSwap .7s cubic-bezier(.22,.61,.36,1) both}
.hero-sub{margin:0;max-width:50ch;font-size:clamp(13.5px,1.4vw,15.5px);line-height:1.5;color:var(--deep);font-weight:600}
/* trust chips */
.trust{margin-top:clamp(14px,1.8vw,20px);display:flex;flex-wrap:wrap;gap:8px}
.trust span{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;
  background:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.95);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  font-family:'Poppins',sans-serif;font-size:13.5px;font-weight:700;letter-spacing:-.1px;color:var(--deep)}
.trust svg{flex:none;color:var(--accent)}
.t-price{--accent:#0E9F6E}
.t-advice{--accent:#2F6FED}
.t-support{--accent:#FF3811}
.t-secure{--accent:#7B4FE0}

/* ---------- hero quick actions ---------- */
.hero-panel{margin-top:clamp(24px,3vw,34px);padding:clamp(12px,1.4vw,16px);border-radius:24px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.34);
  backdrop-filter:blur(14px) saturate(140%);-webkit-backdrop-filter:blur(14px) saturate(140%);
  box-shadow:0 24px 60px -42px rgba(1,52,48,.5)}
.qa-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.2vw,14px)}
.qa{display:flex;flex-direction:column;gap:11px;padding:15px 16px;border-radius:16px;
  background:rgba(255,255,255,.32);border:1px solid rgba(255,255,255,.5);
  backdrop-filter:blur(26px) saturate(170%);-webkit-backdrop-filter:blur(26px) saturate(170%);
  box-shadow:0 18px 40px -32px rgba(1,52,48,.55);
  transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s ease,border-color .28s ease,background .28s ease}
.qa:hover{transform:translateY(-6px);box-shadow:0 26px 50px -30px rgba(1,52,48,.6);
  background:rgba(255,255,255,.5);border-color:rgba(255,255,255,.85)}
.qa-ico{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:#fff;
  background:linear-gradient(140deg,var(--g1) 0%,var(--g2) 100%);box-shadow:0 12px 24px -14px var(--g2)}
/* the three brand icons are painted as masks so they take the tile's white */
.qa-ico.mask::before{content:"";display:block;width:var(--isize);height:var(--isize);background:#fff;
  -webkit-mask:var(--icon) center/contain no-repeat;mask:var(--icon) center/contain no-repeat}
.qa-txt{display:flex;flex-direction:column;gap:4px;line-height:1.2}
.qa-label{display:inline-flex;align-items:center;gap:7px;font-family:'Poppins',sans-serif;font-weight:600;font-size:16px;letter-spacing:-.3px;color:var(--deep)}
.qa-label svg{color:var(--accent)}
.qa-sub{font-size:12.5px;line-height:1.4;color:#33504b;font-weight:500}
.qa-flight{--accent:#FF3811;--g1:#FF3811;--g2:#FF3811;--icon:url(../img/icon-flight.svg);--isize:25px}
.qa-cruise{--accent:#2F6FED;--g1:#5B9BFF;--g2:#2F6FED;--icon:url(../img/icon-cruise.svg);--isize:26px}
.qa-holiday{--accent:#0E9F6E;--g1:#34D399;--g2:#0E9F6E;--icon:url(../img/icon-holiday.svg);--isize:26px}
.qa-visa{--accent:#7B4FE0;--g1:#A78BFA;--g2:#7B4FE0}
@media (max-width:979px){.qa-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:619px){.qa-grid{grid-template-columns:1fr}}

/* ---------- stats ---------- */
/* solid card that bridges the two bands: 70% of it rides up over the hero and the
   negative bottom margin pulls the mint services band up underneath it, so the card
   reads as floating on the seam. The services band pays for the overlap in its top
   padding. */
.stats{position:relative;z-index:20;max-width:var(--wrap);
  margin:calc(-1 * var(--stats-overlap)) auto clamp(-100px,-8vw,-70px);padding:0 var(--pad)}
/* The hero stops at the card's 70% line but the services band starts lower still, so
   the strip either side of the card's last third would otherwise fall through to the
   page cream. Paint it mint, edge to edge, from exactly where the hero ends. */
.stats::before{content:"";position:absolute;left:0;right:0;top:var(--stats-overlap);bottom:0;
  z-index:-1;background:var(--mint);box-shadow:0 0 0 100vmax var(--mint);clip-path:inset(0 -100vmax)}
.stats-card{background:#FFFFFF;border:1px solid #E4EDEA;
  border-radius:20px;box-shadow:0 26px 60px -34px rgba(1,52,48,.34);
  padding:clamp(18px,2.2vw,25px) clamp(20px,3vw,34px);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:clamp(12px,1.3vw,18px)}
.stat{display:flex;gap:10px;align-items:center}
.stat i{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--cream);color:var(--deep)}
.stat b{display:block;font-family:'Poppins',sans-serif;font-weight:700;font-size:clamp(20px,2.4vw,24px);line-height:1;color:var(--deep)}
.stat small{display:block;margin-top:4px;font-size:12.5px;color:var(--muted);line-height:1.4}
/* Five stats divide evenly into one column or five, and into nothing in between —
   left to auto-fit the narrow widths land on 2, 3 and 4 columns and strand the last
   stat in the first cell with the rest of the row empty beside it. Hold the range
   below the one-row layout at two columns so the odd one out can span the full width
   and sit centred under the other four. */
@media (max-width:899px){
  .stats-card{grid-template-columns:repeat(2,1fr)}
  .stat:last-child:nth-child(odd){grid-column:1/-1;justify-content:center}
}
/* Under ~375px two columns no longer clear the 140px track, so the card stacks and
   the last stat is no longer the odd one out — it lines up with the rest again. */
@media (max-width:374px){
  .stats-card{grid-template-columns:1fr}
  .stat:last-child:nth-child(odd){justify-content:flex-start}
}

/* ---------- services ---------- */
/* The mint band runs edge to edge, but the section is also the .wrap that centres the
   grid — so instead of a second wrapper element the background is painted by a spread
   box-shadow and clip-path trims it back to the viewport (no horizontal scrollbar).
   Top padding absorbs the stats card that now overlaps into this band. */
.sec-services{position:relative;z-index:1;
  padding-top:clamp(100px,10vw,130px);padding-bottom:clamp(40px,5vw,60px);
  background:var(--mint);box-shadow:0 0 0 100vmax var(--mint);clip-path:inset(0 -100vmax)}
.sec-head{max-width:640px;margin-bottom:clamp(28px,4vw,42px)}
.sec-head p:last-child{margin:0;font-size:clamp(15px,2vw,18px);line-height:1.65;color:var(--muted)}
/* --muted is tuned for white cards; on the sage band it needs another step down */
.sec-services .sec-head p:last-child,.sec-services .more small{color:#4E5D59}
.sec-head .h2{margin-bottom:14px;text-wrap:balance}
/* the one place the legacy orange survives — everything else is #FF3811 */
.sec-services .eyebrow{color:var(--legacy-orange)}
.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.5vw,18px)}
.svc{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line2);border-radius:18px;overflow:hidden;
  box-shadow:0 10px 30px -26px rgba(1,52,48,.5);
  transition:transform .32s cubic-bezier(.2,.7,.2,1),box-shadow .32s ease,border-color .32s ease}
.svc:hover{transform:translateY(-6px);box-shadow:0 26px 50px -30px rgba(1,52,48,.55);border-color:var(--sage-2)}
.svc-body{padding:clamp(18px,1.8vw,24px);display:flex;flex-direction:column;gap:16px}
.svc-head{display:flex;gap:14px;align-items:center;min-height:52px}
.svc-head i{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--tint);
  transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.svc:hover .svc-head i{transform:translateY(-3px)}
.svc-head i::before{content:"";display:block;width:var(--isize);height:var(--isize);background:var(--accent);
  -webkit-mask:var(--icon) center/contain no-repeat;mask:var(--icon) center/contain no-repeat}
.svc-head b{font-family:'Poppins',sans-serif;font-weight:700;font-size:20px;letter-spacing:-.4px;color:var(--deep)}
.svc-bul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.svc-bul li{display:flex;align-items:center;gap:9px;font-size:13.5px;line-height:1.35;color:#0F332F;font-weight:600}
.svc-bul li::before{content:"";flex:none;width:16px;height:16px;border-radius:50%;
  background:var(--accent) var(--check) center/11px 11px no-repeat}
.svc-photo{position:relative;margin-top:auto;overflow:hidden}
.svc-photo img{width:100%;height:178px;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
.svc:hover .svc-photo img{transform:scale(1.07)}
.svc-go{position:absolute;right:14px;bottom:14px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;
  background:#fff;color:var(--accent);box-shadow:0 8px 20px -10px rgba(1,52,48,.55)}
.svc-flights{--accent:#F04E23;--tint:#FDEBE5;--icon:url(../img/icon-flight.svg);--isize:25px}
.svc-cruises{--accent:#2F6FED;--tint:#E7EFFE;--icon:url(../img/icon-cruise.svg);--isize:26px}
.svc-holidays{--accent:#0E9F6E;--tint:#E4F5EE;--icon:url(../img/icon-holiday.svg);--isize:26px}
.svc-safari{--accent:#F5A623;--tint:#FDF3E0;--icon:url(../img/icon-safari.png);--isize:27px}
/* secondary services */
.more-grid{margin-top:clamp(14px,1.8vw,18px);display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.2vw,14px)}
.more{display:flex;align-items:center;gap:12px;padding:15px 18px;background:#fff;border:1px solid var(--line2);border-radius:14px;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.more:hover{transform:translateY(-6px);box-shadow:0 26px 50px -30px rgba(1,52,48,.55);border-color:var(--sage-2)}
.more i{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--tint);color:var(--orange);
  transition:transform .3s ease}
.more:hover i{transform:translateY(-3px)}
.more b{display:block;font-family:'Poppins',sans-serif;font-weight:600;font-size:15px;letter-spacing:-.2px;color:var(--deep)}
.more small{display:block;margin-top:3px;font-size:12.5px;line-height:1.4;color:var(--muted)}
.tint-violet{--tint:#F0EAFD}
.tint-green{--tint:#E4F5EE}
.tint-blue{--tint:#E7EFFE}
@media (max-width:979px){.card-grid,.more-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:619px){.card-grid,.more-grid{grid-template-columns:1fr}}

/* ---------- destinations ---------- */
.sec-dest{padding-top:clamp(24px,4vw,44px);padding-bottom:clamp(64px,8vw,108px);
  background:var(--dest-band);box-shadow:0 0 0 100vmax var(--dest-band);clip-path:inset(0 -100vmax)}
.dest-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:clamp(24px,3vw,34px)}
.btn-outline{height:48px;padding:0 22px;border:1.5px solid var(--sage);color:var(--deep);font-size:14.5px;gap:8px}
.btn-outline:hover{color:var(--cream);background:var(--deep);border-color:var(--deep)}
.dest-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:clamp(8px,1.4vw,14px)}
.dest{position:relative;display:block;aspect-ratio:3/4;border-radius:14px;overflow:hidden;background:var(--deeper)}
.dest img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .25s linear;will-change:transform}
.d-mideast{object-position:50% 18%}
.d-wellness{object-position:80% 52%}
.d-ireland{object-position:38% 50%}
.dest .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,20,18,.05) 34%,rgba(0,20,18,.85) 100%)}
.dest .meta{position:absolute;left:0;right:0;bottom:0;padding:clamp(10px,3vw,16px);color:var(--cream)}
.dest .meta b{display:block;font-family:'Poppins',sans-serif;font-weight:700;font-size:clamp(15px,4vw,22px);letter-spacing:-.5px}
.dest .meta span{display:block;margin-top:4px;font-size:clamp(10.5px,2.6vw,12.5px);color:rgba(253,244,240,.82)}
.dest .meta em{display:block;margin-top:6px;font-size:clamp(10px,2.4vw,11.5px);font-weight:700;letter-spacing:.5px;color:var(--orange-lit);font-style:normal}
/* below the 980px breakpoint the design pins the grid to 2 columns
   rather than letting auto-fit collapse it to 1 */
@media (max-width:979px){
  .dest-grid{grid-template-columns:repeat(2,1fr)}
}
.picks{margin-top:clamp(30px,4vw,44px);padding-top:clamp(26px,3vw,34px);border-top:1px solid var(--line)}
.picks h3{margin:0 0 18px;font-weight:600;font-size:clamp(19px,2.4vw,24px);letter-spacing:-.3px;color:var(--deep)}
.pick-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(10px,1.4vw,14px)}
.pick{display:flex;gap:14px;align-items:center;padding:10px;background:#fff;border:1px solid var(--line);border-radius:14px;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}
.pick:hover{transform:translateY(-6px);box-shadow:0 24px 50px -28px rgba(0,36,32,.5);border-color:var(--sage)}
.pick .thumb{flex:none;width:96px;height:96px;border-radius:10px;overflow:hidden;background:var(--cream)}
.pick .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.pick:hover .thumb img{transform:scale(1.08)}
.pick small{display:block;font-size:10.5px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--deep)}
.pick b{display:block;margin-top:5px;font-family:'Poppins',sans-serif;font-weight:600;font-size:16.5px;line-height:1.2;letter-spacing:-.3px;color:var(--ink)}
.pick span.sub{display:block;margin-top:5px;font-size:13px;color:var(--muted)}

/* ---------- consular (split dark band) ---------- */
.sec-consular{background:var(--deep);color:var(--cream)}
.sec-consular .eyebrow,.cruise-copy .eyebrow{color:var(--orange-lit)}
.sec-consular .wrap{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(56px,7vw,96px);
  display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(28px,4vw,56px);align-items:center}
.sec-consular h2{margin:0 0 16px;font-weight:700;font-size:clamp(29px,4.2vw,43px);line-height:1.08;letter-spacing:-.6px;color:var(--cream)}
.sec-consular p.lead{margin:0;font-size:clamp(15px,2vw,18px);line-height:1.65;color:rgba(253,244,240,.85)}
.clist{margin-top:26px;border-top:1px solid rgba(253,244,240,.18)}
.clist div{display:flex;gap:14px;align-items:baseline;padding:12px 0;border-bottom:1px solid rgba(253,244,240,.18);font-size:15.5px}
.clist i{flex:none;color:var(--orange-lit);font-size:11px;font-weight:800;letter-spacing:1.5px;min-width:26px;font-style:normal}
.btns{margin-top:26px;display:flex;flex-wrap:wrap;gap:11px}
.btns .pill{height:52px;padding:0 26px;font-size:15px}
.fineprint{margin:18px 0 0;font-size:13px;color:rgba(253,244,240,.62)}
.consular-media{position:relative;border-radius:24px;overflow:hidden;width:100%;aspect-ratio:4/5;background:var(--deeper)}
.consular-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.consular-media .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,52,48,0) 40%,rgba(1,52,48,.55) 100%)}
@media (max-width:979px){
  .sec-consular .wrap{grid-template-columns:1fr}
  .consular-media{aspect-ratio:auto;height:340px}
}

/* ---------- cruise feature card ---------- */
.sec-cruise{background:var(--cream)}
.sec-cruise .wrap{padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(56px,7vw,96px)}
.cruise-card{position:relative;border-radius:28px;overflow:hidden;min-height:clamp(520px,62vh,660px);display:flex;align-items:flex-end}
.cruise-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:34% 58%}
.cruise-card .scrim{position:absolute;inset:0;
  background:linear-gradient(15deg,rgba(0,52,48,.9) 0%,rgba(0,52,48,.62) 38%,rgba(0,52,48,.14) 72%,rgba(0,52,48,.04) 100%)}
.cruise-copy{position:relative;width:100%;padding:clamp(28px,4vw,52px)}
.cruise-copy>div{max-width:600px;color:var(--cream)}
.cruise-copy h2{margin:0 0 14px;font-weight:700;font-size:clamp(29px,4.4vw,43px);line-height:1.08;letter-spacing:-.6px;color:var(--cream)}
.cruise-copy p.lead{margin:0;font-size:clamp(15px,2vw,18px);line-height:1.65;color:rgba(253,244,240,.9)}
.cruise-lines{margin:18px 0 0;display:flex;flex-direction:column;gap:7px}
.cruise-lines p{margin:0;font-size:13.5px;color:rgba(253,244,240,.7)}
.cruise-lines .packages{font-family:'Poppins',sans-serif;font-weight:600;letter-spacing:-.1px;color:var(--cream)}
.cruise-lines .included{color:rgba(253,244,240,.8)}
.cruise-copy .btns{margin-top:24px}
@media (max-width:699px){
  .cruise-card{min-height:460px}
  .cruise-card>img{object-position:16% 62%}
}

/* ---------- reviews ---------- */
.sec-reviews{background:linear-gradient(180deg,#FDF4F0 0%,#EFF4F2 100%)}
.sec-reviews .wrap{padding-top:clamp(64px,8vw,108px);padding-bottom:clamp(64px,8vw,108px)}
.sec-reviews .h2{margin-bottom:clamp(28px,4vw,40px);font-size:clamp(23px,4.4vw,43px);line-height:1.12}
.rev-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(12px,1.6vw,18px)}
.rev{background:#fff;border:1px solid var(--line);border-radius:16px;padding:clamp(24px,2.4vw,32px);display:flex;flex-direction:column;gap:16px}
.rev .stars{color:var(--orange);font-size:16px;letter-spacing:2px}
.rev p{margin:0;font-size:clamp(18px,2.2vw,22px);line-height:1.35;color:var(--ink);flex:1}
.rev .who{display:flex;align-items:center;gap:12px}
.rev .av{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:var(--deep);color:var(--cream);font-family:'Poppins',sans-serif;font-weight:600;font-size:15px;flex:none}
.rev .who b{display:block;font-family:'Poppins',sans-serif;font-weight:600;font-size:14.5px;color:var(--deep)}
.rev .who small{display:block;font-size:12px;color:#657873;letter-spacing:.3px}
.rev-foot{margin:22px 0 0;font-size:14px;color:var(--muted)}

/* ---------- closing CTA ---------- */
.sec-contact{position:relative;overflow:hidden;background:var(--deeper);color:var(--cream);text-align:center}
.sec-contact>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.sec-contact .scrim{position:absolute;inset:0;z-index:2;background:rgba(0,52,48,.8)}
.sec-contact .wrap{position:relative;z-index:3;max-width:760px;padding-top:clamp(66px,10vw,132px);padding-bottom:clamp(66px,10vw,132px)}
.sec-contact h2{margin:0 auto;max-width:22ch;font-weight:700;font-size:clamp(30px,5vw,58px);line-height:1.06;letter-spacing:-.8px;color:var(--cream);text-wrap:balance}
.sec-contact p{margin:16px auto 30px;max-width:44ch;font-size:clamp(15px,2vw,19px);line-height:1.6;color:rgba(253,244,240,.85)}
.sec-contact .btns{margin-top:0;display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.sec-contact .btns .pill{height:54px;padding:0 30px;font-size:16px}

/* ---------- footer ---------- */
.ftr{background:var(--foot-band);color:var(--foot)}
.ftr-top{max-width:var(--wrap);margin:0 auto;padding:clamp(46px,6vw,72px) var(--pad) 32px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(28px,4vw,48px)}
.ftr-about{max-width:340px}
/* the logo sits on a light band here, so it keeps its own colours — no invert */
.ftr-about>img{height:42px;margin-bottom:18px}
.ftr-about p{margin:0;font-size:16px;line-height:1.65;color:var(--foot)}
.socials{display:flex;gap:10px;margin-top:20px}
.socials a{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:var(--orange);color:#FFFFFF;
  transition:background .25s ease,transform .25s ease}
.socials a:hover{background:var(--deep);transform:translateY(-2px);color:#FFFFFF}
.socials svg{display:block}
.licence{margin-top:22px;display:flex;align-items:center;gap:12px}
.licence img{height:44px;background:#fff;padding:5px 7px;border-radius:3px}
.licence p{margin:0;font-size:13px;line-height:1.5;color:var(--foot-muted)}
/* v5 puts these headings in the brand orange; on a light band that has to be the
   --orange-ink shade to clear 4.5:1, same rule the rest of the page follows */
.ftr-col b{display:block;font-family:'Poppins',sans-serif;font-weight:700;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--orange-ink);margin-bottom:16px}
.ftr-col div{display:flex;flex-direction:column}
.ftr-col a{padding:7px 0;font-size:16.5px;font-weight:500;color:var(--deep);transition:color .2s ease}
.ftr-col a:hover{color:var(--orange-ink)}
.ftr-bot{max-width:var(--wrap);margin:0 auto;padding:20px var(--pad) 0;border-top:1px solid rgba(1,52,48,.16)}
.ftr-bot p{margin:16px 0 0;font-size:14px;line-height:1.7}
.ftr-bot p+p{margin-top:6px;color:var(--foot-muted)}
.ftr-bot a{color:var(--deep);font-weight:500}
.ftr-bot a:hover{color:var(--orange-ink)}
.ftr-pad{padding-bottom:28px}

/* ---------- reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(34px);
  transition:opacity .85s cubic-bezier(.2,.7,.2,1),transform .85s cubic-bezier(.2,.7,.2,1);will-change:opacity,transform}
[data-reveal].in{opacity:1;transform:none}

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