/* Plume & Frost Travel: shared site styles (home page and Explore pages). */
:root{
  --navy:#16283D; --navy-2:#1E3550; --gold:#C6A46B; --gold-deep:#A8874F; --gold-bright:#E6C384; --lift:0 1px 2px rgba(10,20,32,.7),0 2px 16px rgba(10,20,32,.55);
  --sand:#F1E9DD; --ivory:#F7F2E7; --bronze:#7A6A3F; --ink:#16283D;
  --bronze-ink:#665834;   /* Muted Bronze, deepened for small text so it passes contrast on sand and ivory */
  --line:rgba(22,40,61,.14); --muted:#5B6573;
  --serif:"Cormorant Garamond",Georgia,serif; --sans:"Jost",system-ui,sans-serif;
  --wrap:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:75px}   /* keeps anything scrolled to, or focused, clear of the pinned header (WCAG 2.4.11) */
body{margin:0;background:var(--ivory);color:var(--ink);font-family:var(--sans);font-weight:300;font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.eyebrow{font-family:var(--sans);font-weight:500;font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--bronze-ink);margin:0 0 14px}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.1;margin:0}
h2{font-size:clamp(34px,4.4vw,52px)}
.rule{width:56px;height:1px;background:var(--gold);border:0;margin:22px 0 26px}
.btn{display:inline-block;font-family:var(--sans);font-weight:500;font-size:13px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;padding:16px 28px;border:1px solid var(--gold);color:var(--navy);background:var(--gold);cursor:pointer;transition:background .2s,color .2s}
.btn:hover{background:var(--navy);color:var(--gold-bright);border-color:var(--navy)}
/* On navy grounds a navy fill would vanish, so the hover there is a gold outline instead. */
.hero .btn:not(.ghost):hover,.contact-card .btn:hover,.why .btn:hover{background:transparent;color:var(--gold-bright);border-color:var(--gold)}
@media (hover:hover){.mobile-bar a:hover{background:transparent;color:var(--gold-bright);border-color:var(--gold)}}   /* hover only where there is a mouse: on phones a tapped button kept the hover look */
.text-link{display:inline-block;font-family:var(--sans);font-weight:500;font-size:13px;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:var(--navy);border-bottom:1px solid var(--gold);padding:14px 0 6px;transition:color .2s}
.text-link:hover{color:var(--bronze-ink)}
.text-link.light{color:var(--ivory);text-shadow:var(--lift)}
.text-link.light:hover{color:var(--gold-bright)}
.btn.ghost{background:transparent;color:var(--ivory);border-color:rgba(247,242,231,.4)}
.btn.ghost:hover{border-color:var(--gold);color:var(--gold)}
.btn.outline{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn.outline:hover{background:var(--navy);color:var(--ivory)}
/* Focus ring: navy on the light grounds, bright gold on navy, so it always stands out (WCAG 1.4.11, 2.4.7) */
:focus-visible{outline:2px solid var(--navy);outline-offset:3px}
header.site :focus-visible,.hero :focus-visible,.protect-strip :focus-visible,.why :focus-visible,.contact-card :focus-visible,footer :focus-visible,.enq-head :focus-visible,.site-menu :focus-visible,.x-hero :focus-visible,.x-detail-hero :focus-visible,.vid-toggle:focus-visible{outline-color:var(--gold-bright)}
.mobile-bar a:focus-visible{outline:2px solid var(--gold-bright);outline-offset:-5px}
.mobile-bar a:last-child:focus-visible{outline-color:var(--navy)}
main:focus{outline:none}

/* Header */
header.site{position:sticky;top:0;z-index:20;background:rgba(22,40,61,.96);backdrop-filter:blur(6px);color:var(--ivory);border-bottom:1px solid rgba(198,164,107,.25)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;height:74px;gap:16px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none}
.brand img{width:44px;height:44px}
.brand .name{font-family:var(--serif);font-size:21px;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
nav.primary{display:flex;gap:30px;align-items:center}
nav.primary a{white-space:nowrap;text-decoration:none;font-size:12px;font-weight:400;letter-spacing:.22em;text-transform:uppercase;color:rgba(247,242,231,.82)}
nav.primary a:hover{color:var(--gold)}
nav.primary a.cta{color:var(--gold);border:1px solid rgba(198,164,107,.6);padding:10px 16px}
@media (max-width:1240px) and (min-width:981px){nav.primary{gap:18px}nav.primary a{font-size:11px;letter-spacing:.16em}nav.primary a.cta{padding:9px 12px}}

/* Hero */
.hero{background:var(--navy);color:var(--ivory);position:relative;overflow:hidden}
.hero .wrap{padding-top:110px;padding-bottom:120px;position:relative;z-index:1}
.hero .eyebrow{color:var(--gold-bright);text-shadow:var(--lift)}
.hero h1{font-size:clamp(46px,7.4vw,92px);max-width:13ch;letter-spacing:-.005em}
.hero h1 em{font-style:italic;color:var(--gold-bright)}
.hero p.lede{font-size:19px;max-width:520px;color:rgba(247,242,231,.92);text-shadow:var(--lift);margin:28px 0 40px}
.hero .actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 32px}
/* The words sit on the page's left edge over a tint that fades out to the right, so the photo
   or video keeps its own light across the rest of the hero. */
.hero-main{display:flex;align-items:center;min-height:clamp(560px,82vh,860px)}
.hero-main>.wrap{flex:1 1 auto;width:100%}
  .protect-strip{border-top:1px solid rgba(198,164,107,.22);color:rgba(247,242,231,.65);font-size:12px;letter-spacing:.2em;text-transform:uppercase}
.protect-strip .wrap{display:flex;flex-wrap:wrap;gap:10px 36px;padding-top:18px;padding-bottom:18px}
.protect-strip span::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--gold);margin-right:12px;vertical-align:middle}
.protect-strip .wrap{align-items:center}
.protect-strip span{display:inline-flex;align-items:center}
.protect-strip span img{height:52px;width:auto;margin-left:16px}
.accred{display:flex;align-items:center;gap:18px;margin-left:auto}
.accred img{height:52px;width:auto}
footer .accred{align-self:center}
footer .accred img{height:64px}

section{padding:110px 0}
.intro{background:var(--sand)}
/* Desktop: About P&F fills the screen under the menu, so a menu jump to it shows nothing of Journeys below */
@media (min-width:981px){.intro{min-height:calc(100vh - 75px);min-height:calc(100svh - 75px);display:flex;align-items:center}.intro > .wrap{width:100%}}
.split{display:grid;grid-template-columns:1fr 1.15fr;gap:72px;align-items:start}
.split p{margin:0 0 18px;color:#2D3B4C}
.pull{font-family:var(--serif);font-style:italic;font-size:clamp(26px,3vw,34px);line-height:1.3;color:var(--navy);border-left:1px solid var(--gold);padding-left:28px;margin:0}
/* About: Neil's signature under his story */
.split p.signature{font-family:var(--serif);font-style:italic;font-size:44px;line-height:1;color:var(--navy);margin:30px 0 0}
.signature small{display:block;font:500 11px/1.4 var(--sans);font-style:normal;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze-ink);margin-top:12px}

/* From the Collection: three live holidays, put in by the Worker */
.featured{background:var(--sand)}
.featured[hidden]{display:none}
.featured-top{display:flex;justify-content:space-between;align-items:flex-end;gap:16px 32px;flex-wrap:wrap;margin-bottom:44px}
.featured-top .more-link{margin:0}
.featured .x-grid{margin-top:0}
/* Phones: the cards stack, so "See the full Collection" moves below them, where the scroll ends (22 Oct 2026, at the owner's request) */
@media (max-width:620px){.featured .wrap{display:flex;flex-direction:column}.featured-top{display:contents}.featured-top>div{order:1;margin-bottom:32px}.featured .x-grid{order:2}.featured-top .more-link{order:3;margin:32px 0 0;text-align:left}}

/* Why plan with me */
.why{background:var(--navy);color:var(--ivory)}
/* Desktop: tighter spacing so a jump to Why Choose Us shows the whole band, including the two panels */
@media (min-width:981px){section.why{padding:52px 0 64px}.why .points{margin-top:32px}.why .points li{padding-top:22px}.why .hours{margin-top:34px}.why .hours div{padding:24px 32px}}
.why .eyebrow{color:var(--gold)}
.why h2{max-width:20ch}
/* Laptop fit (14 Oct 2026, owner request): on desktop the heading and How it works sit side by side, so a jump to Why Choose Us shows the two panels too */
@media (min-width:981px){.why .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:56px}.why .eyebrow,.why h2{grid-column:1}.why .how{grid-column:2;grid-row:1/span 2;align-self:end;margin:0}.why .points,.why .hours{grid-column:1/-1}}
/* Desktop: the navy band fills the screen below the menu (like the intro), and its text and spacing scale with the window height so every box shows (14 Oct 2026, owner request) */
@media (min-width:981px){section.why{min-height:calc(100vh - 75px);min-height:calc(100svh - 75px);display:flex;align-items:center;padding:clamp(24px,4.5vh,64px) 0}.why > .wrap{width:100%}.why .eyebrow{margin-bottom:clamp(8px,1.4vh,16px)}.why h2{font-size:clamp(36px,6.2vh,60px)}.why .how{font-size:clamp(15px,2.1vh,18.5px)}.why .points{margin-top:clamp(16px,3.4vh,44px)}.why .points li{padding-top:clamp(12px,2.6vh,32px)}.why .points h3{font-size:clamp(21px,3.1vh,28px);margin-bottom:clamp(6px,1.1vh,12px)}.why .points p{font-size:clamp(14px,2vh,17px)}.why .hours{margin-top:clamp(16px,3.4vh,44px)}.why .hours div{padding:clamp(12px,2.6vh,32px) clamp(24px,2.4vw,40px)}.why .hours h3{font-size:clamp(22px,3.3vh,30px);margin-bottom:clamp(6px,1.1vh,12px)}.why .hours p{font-size:clamp(14px,2.1vh,17.5px)}}
.why p,.why h3{text-wrap:pretty}.why .nw{white-space:nowrap}
.points{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(198,164,107,.4)}
.points li{padding:28px 26px 0 0}
.points li+li{padding-left:26px;border-left:1px solid rgba(198,164,107,.22)}
.points h3{font-size:25px;line-height:1.2;color:var(--gold-bright);margin-bottom:10px}
.points p{margin:0;font-size:15.5px;color:rgba(247,242,231,.8)}

/* Services */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:56px}
.svc{background:var(--ivory);padding:44px 36px 48px}
.svc .num{font-family:var(--serif);font-size:15px;color:var(--bronze-ink);letter-spacing:.1em}
.svc h3{font-size:31px;margin:14px 0 14px}
.svc p{margin:0;color:var(--muted);font-size:16px}
.svc svg{width:46px;height:46px;margin-bottom:26px;stroke:var(--gold-deep);fill:none;stroke-width:1.3}
/* Journeys sits higher so the bottom of the three boxes shows on a laptop screen (13 Oct 2026, owner request) */
#services{padding-top:64px}
#services .services-grid{margin-top:40px}
.more-link{margin:36px 0 0;text-align:right}
.more-link a{display:inline-block;font-size:12px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;color:var(--navy);border-bottom:1px solid var(--gold);padding:14px 0 6px}
.more-link a:hover{color:var(--bronze-ink)}

/* Process */
.steps{list-style:none;padding:0;margin:40px 0 0;display:grid;grid-template-columns:repeat(5,1fr);gap:28px;counter-reset:s}
.steps li{counter-increment:s;border-top:1px solid var(--gold);padding-top:22px}
.steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--serif);font-size:15px;color:var(--bronze-ink);letter-spacing:.1em}
.steps h3{font-size:25px;margin:8px 0 10px}
.steps p{margin:0;font-size:15px;color:var(--muted)}
/* Hours and reply time: two panels under the four points in the navy Why band */
.hours{margin-top:56px;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(198,164,107,.3);border:1px solid rgba(198,164,107,.3)}
.hours div{background:var(--navy-2);padding:30px 36px}
.hours h3{font-size:27px;line-height:1.2;color:var(--gold-bright);margin-bottom:10px}
.hours p{margin:0;color:rgba(247,242,231,.8);font-size:16px}
.hours strong{font-weight:500;color:var(--ivory)}

/* Enquiry */
.enquire{background:var(--sand)}
form.enq{display:grid;grid-template-columns:1fr 1fr;gap:22px 24px;margin-top:8px}
.field{display:flex;flex-direction:column;gap:8px}
.field.full{grid-column:1/-1}
label{font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze-ink)}
input,select,textarea{font:inherit;font-size:16px;color:var(--navy);background:var(--ivory);border:1px solid rgba(22,40,61,.2);border-radius:0;padding:13px 14px;width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--navy);outline-offset:0;border-color:var(--navy)}
textarea{min-height:130px;resize:vertical}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{font-size:13px;letter-spacing:.06em;text-transform:none;font-weight:400;color:var(--navy);border:1px solid rgba(22,40,61,.2);padding:9px 14px;cursor:pointer;background:var(--ivory);display:flex;gap:8px;align-items:center}
.chips input{width:auto;accent-color:var(--navy)}
.form-intro{grid-column:1/-1;margin:0 0 6px;font-family:var(--serif);font-style:italic;font-size:21px;line-height:1.45;color:var(--navy)}
.form-note{grid-column:1/-1;font-size:14px;color:var(--muted);margin:0}
.enq-actions{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}
.enq-actions .or{font-family:var(--serif);font-style:italic;font-size:20px;color:var(--bronze-ink)}
.form-status{grid-column:1/-1;margin:0;font-size:15px;color:var(--navy);min-height:1em}
.contact-card{background:var(--navy);color:var(--ivory);padding:44px 40px}
.contact-card img{width:70px;margin-bottom:22px}
.contact-card h3{font-size:34px;margin-bottom:22px}
.contact-card a{display:block;text-decoration:none;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:rgba(247,242,231,.85);margin-bottom:10px}
.contact-card a:hover{color:var(--gold)}
.contact-card a.cc-call{display:inline-block;margin:18px 0 0;color:var(--navy);letter-spacing:.2em;font-size:13px}
.contact-card a.cc-call:hover{color:var(--gold-bright)}
.contact-card .sla{border-top:1px solid rgba(198,164,107,.3);margin-top:26px;padding-top:22px;font-size:15px;color:rgba(247,242,231,.7)}

footer{background:var(--navy);color:rgba(247,242,231,.6);font-size:14px;border-top:1px solid rgba(198,164,107,.22)}
footer .wrap{padding-top:48px;padding-bottom:48px;display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;align-items:flex-start}
footer .brand .name{color:var(--ivory);font-size:18px}
footer .tag{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-top:10px}
footer p{margin:0;max-width:520px;flex:1 1 360px}
footer .wrap.legal{display:block;padding-top:0;padding-bottom:40px}
footer .legal p{max-width:none;padding-top:22px;border-top:1px solid rgba(198,164,107,.16);font-size:12px;line-height:1.65;color:rgba(247,242,231,.55)}
footer .legal strong{font-weight:500;color:rgba(247,242,231,.7)}
footer .legal a{color:inherit;text-decoration:underline;text-decoration-color:rgba(198,164,107,.5);text-underline-offset:2px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

@media (max-width:980px){
  .split{grid-template-columns:1fr;gap:40px}
  .services-grid{grid-template-columns:1fr}
  /* Five steps: three on the first row, two wider ones on the second, so none sits alone. */
  .steps{grid-template-columns:repeat(6,1fr)}
  .steps li{grid-column:span 2}
  .steps li:nth-child(n+4){grid-column:span 3}
  .hours{grid-template-columns:1fr}
  .points{grid-template-columns:1fr 1fr}
  .points li:nth-child(3){padding-left:0;border-left:0}
  .points li:nth-child(n+3){padding-top:32px}
  nav.primary a:not(.cta){display:none}
  /* Phones and tablets: the words sit at the foot of the picture, which shows above them. */
  .hero-main{align-items:flex-end;min-height:min(88svh,760px)}
  .hero-main>.wrap{padding-top:160px}
}
@media (max-width:620px){
  body{font-size:16px}
  .wrap{padding:0 16px}
  section{padding:76px 0}
  .brand .name{font-size:15px;letter-spacing:.1em}
  .brand img{width:36px;height:36px}
  .hero .wrap{padding-bottom:56px}
  .steps{grid-template-columns:1fr}
  .steps li,.steps li:nth-child(n+4){grid-column:auto}
  .points{grid-template-columns:1fr}
  .points li,.points li+li{padding:26px 0 0;border-left:0}
  .split p.signature{font-size:38px}
  form.enq{grid-template-columns:1fr}
  .enq-actions{flex-direction:column;align-items:stretch;text-align:center}
  .contact-card{padding:34px 24px}
  .svc{padding:34px 24px 38px}
}

/* "My enquiry": header icon and side panel (public/assets/enquiry-list.js) */
.enq-bag{display:inline-flex;align-items:center;gap:8px;background:none;border:0;padding:6px 2px;cursor:pointer;color:rgba(247,242,231,.9);font:400 12px var(--sans);letter-spacing:.22em;text-transform:uppercase}
.enq-bag[hidden]{display:none}
.enq-bag:hover{color:var(--gold)}
.enq-bag svg{flex:none;width:20px;height:20px;max-width:none;fill:none;stroke:currentColor;stroke-width:1.4}
.enq-bag-count{min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--gold);color:var(--navy);font:500 11px/20px var(--sans);letter-spacing:0;text-align:center}
.enq-bag.bump .enq-bag-count{animation:enqBump .45s ease}
@keyframes enqBump{40%{transform:scale(1.35)}}
.enq-lock,.enq-lock body{overflow:hidden}
.enq-shade{position:fixed;inset:0;z-index:40;background:rgba(22,40,61,.55);opacity:0;transition:opacity .25s}
.enq-shade.on{opacity:1}
.enq-panel{position:fixed;top:0;right:0;bottom:0;z-index:41;width:min(460px,100vw);display:flex;flex-direction:column;background:var(--ivory);color:var(--navy);transform:translateX(100%);transition:transform .25s ease,box-shadow .25s ease}
/* Shadow only while open: when the panel is parked off-screen it would bleed onto the page edge. */
.enq-panel.on{transform:none;box-shadow:-20px 0 60px rgba(22,40,61,.35)}
.enq-head{display:flex;justify-content:space-between;align-items:flex-start;padding:26px 28px 22px;background:var(--navy);color:var(--ivory)}
.enq-head .eyebrow{color:var(--gold);margin-bottom:6px}
.enq-head h2{font-size:32px}
.enq-close{background:none;border:0;color:var(--ivory);font-size:30px;line-height:1;cursor:pointer;padding:0 4px}
.enq-close:hover{color:var(--gold)}
.enq-scroll{flex:1;overflow-y:auto;padding:8px 28px 32px}
.enq-items{list-style:none;margin:0;padding:0}
.enq-item{display:grid;grid-template-columns:76px 1fr auto;gap:14px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.enq-thumb{display:block;width:76px;aspect-ratio:4/3;background:var(--navy-2);overflow:hidden}
.enq-thumb img{width:100%;height:100%;object-fit:cover}
.enq-item-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.enq-item-text a{font-family:var(--serif);font-size:19px;line-height:1.2;letter-spacing:.04em;text-transform:uppercase;text-decoration:none}
.enq-item-text a:hover{color:var(--bronze-ink)}
.enq-item-text span{font-size:14px;color:var(--muted)}
.enq-item-text .enq-item-price{color:var(--navy);font-family:var(--serif);font-size:16px}
.enq-item-price strong{font-weight:500}
.enq-remove{background:none;border:1px solid var(--line);width:44px;height:44px;border-radius:50%;cursor:pointer;color:var(--muted);font-size:20px;line-height:1}
.enq-remove:hover{border-color:var(--navy);color:var(--navy)}
.enq-empty,.enq-done{text-align:center;padding:40px 0}
.enq-empty p,.enq-done p{color:var(--muted);margin:0 0 22px}
.enq-done h3{font-size:30px;margin-bottom:10px}
.enq-empty[hidden],.enq-done[hidden],.enq-form[hidden]{display:none}
.enq-form{display:flex;flex-direction:column;gap:16px;padding-top:24px}
.enq-intro{margin:0;font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.45}
.enq-field{display:flex;flex-direction:column;gap:6px}
.enq-field label span{text-transform:none;letter-spacing:0;font-weight:300}
.enq-field input,.enq-field textarea{min-height:0}
.enq-actions-panel{display:flex;flex-direction:column;align-items:stretch;text-align:center;gap:10px;margin-top:6px}
.enq-actions-panel .or{font-family:var(--serif);font-style:italic;font-size:19px;color:var(--bronze-ink)}
.enq-status{margin:0;font-size:14px;color:var(--navy);min-height:1em}
.enq-form-holidays{grid-column:1/-1;margin:0;padding:14px 16px;background:var(--ivory);border-left:2px solid var(--gold);font-size:15px}
.enq-form-holidays[hidden]{display:none}
.link-btn{background:none;border:0;padding:12px 0;font:inherit;color:var(--navy);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px;cursor:pointer}
@media (max-width:1240px){.enq-bag-label{display:none}}
@media (max-width:620px){.enq-head,.enq-scroll{padding-left:18px;padding-right:18px}nav.primary{gap:14px}nav.primary a.cta{padding:9px 12px;letter-spacing:.16em}}
@media (prefers-reduced-motion:reduce){.enq-panel,.enq-shade{transition:none}}

/* Small logo marks on navy (header, footer, contact card, Explore flags): lift their colours. The hero art is left as is.
   A filter, not a recoloured file, so the master stays untouched (see CLAUDE.md). */
.brand img,.contact-card img,.x-flag img{filter:saturate(1.7) brightness(1.15)}

/* Phone and tablet menu (public/assets/site-menu.js): button left of the logo, drop-down under the header */
.menu-btn{display:none;flex:none;align-items:center;justify-content:center;width:44px;height:44px;margin-left:-10px;background:none;border:0;padding:0;cursor:pointer;color:var(--gold)}
.menu-icon{position:relative;width:22px;height:14px}
.menu-icon i{position:absolute;left:0;width:100%;height:1.5px;background:currentColor;transition:transform .2s,opacity .2s}
.menu-icon i:nth-child(1){top:0}.menu-icon i:nth-child(2){top:6px}.menu-icon i:nth-child(3){top:12px}
.menu-btn[aria-expanded="true"] .menu-icon i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-btn[aria-expanded="true"] .menu-icon i:nth-child(2){opacity:0}
.menu-btn[aria-expanded="true"] .menu-icon i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.site-menu{position:fixed;top:74px;left:0;right:0;z-index:19;max-height:calc(100vh - 74px);max-height:calc(100dvh - 74px);overflow-y:auto;overscroll-behavior:contain;background:var(--navy);color:var(--ivory);border-bottom:1px solid rgba(198,164,107,.3);box-shadow:0 24px 50px rgba(0,0,0,.35);animation:menuDrop .22s ease}
.site-menu[hidden],.site-menu-shade[hidden]{display:none}
@keyframes menuDrop{from{opacity:0;transform:translateY(-8px)}}
.site-menu-inner{max-width:var(--wrap);margin:0 auto;padding:10px 24px 26px}
.site-menu ul{list-style:none;margin:0;padding:0}
.site-menu li a{display:block;padding:12px 0;border-bottom:1px solid rgba(247,242,231,.1);text-decoration:none;color:var(--ivory);font-family:var(--serif);font-size:22px;line-height:1.2}
.site-menu li:last-child a{border-bottom:0}
.site-menu li a:hover,.site-menu li a:focus-visible{color:var(--gold)}
.sm-contact{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:12px;padding-top:14px;border-top:1px solid rgba(198,164,107,.3)}
.sm-contact a{color:var(--gold);text-decoration:none;font-size:14px;letter-spacing:.06em}
.site-menu-shade{position:fixed;inset:74px 0 0;z-index:18;background:rgba(22,40,61,.5)}
.menu-open,.menu-open body{overflow:hidden}
/* Whole sections start exactly under the pinned header (74px + 1px border), so none of the section above shows */
/* (75px of this now comes from scroll-padding-top on html) */
#about,#services,#featured,#why,#faq,#enquire{scroll-margin-top:0}
#cruises,#holidays,#multi-centre,#hours{scroll-margin-top:21px}
#top{scroll-margin-top:25px}   /* logo link: scroll right to the top, not to the content under the pinned header */
@media (max-width:980px){
  .menu-btn{display:inline-flex}
  header.site .wrap{justify-content:flex-start;gap:10px}
  nav.primary{margin-left:auto}
}
@media (max-width:620px){.site-menu-inner{padding:0 16px 22px}.menu-btn{margin-left:-8px}}
@media (max-width:370px){.brand .name{font-size:13px;letter-spacing:.06em}.brand{gap:8px}}
@media (prefers-reduced-motion:reduce){.site-menu{animation:none}.menu-icon i{transition:none}}

/* Enquiry form steps (index.html). Without the script every step shows at once, so steps are
   only hidden, and the progress line and step buttons only shown, once the form is .stepped. */
.enq-progress{display:none}
form.enq.stepped .enq-progress{grid-column:1/-1;display:flex;gap:6px;list-style:none;margin:0 0 4px;padding:0}
.enq-progress li{flex:1;min-width:0;font-size:10.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:#59606A;white-space:nowrap;transition:color .3s}
.enq-progress li span{display:block;position:relative;height:2px;margin-bottom:9px;background:rgba(22,40,61,.14);overflow:hidden}
.enq-progress li span::after{content:"";position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .45s ease}
.enq-progress li.on span::after{transform:none}
.enq-progress li.on{color:var(--bronze-ink)}
.enq-progress li.now{color:var(--navy)}
form.enq.done .enq-progress{display:none}
form.enq{scroll-margin-top:21px}
.step{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:22px 24px}
.step[hidden],.other-field[hidden],.enq-thanks[hidden]{display:none}
form.enq:not(.stepped) .step+.step{padding-top:28px;border-top:1px solid rgba(22,40,61,.12)}
form.enq.stepped .step:not([hidden]){animation:stepIn .45s ease both}
@keyframes stepIn{from{opacity:0;transform:translateY(12px)}}
.step-head{grid-column:1/-1}
.step-head h3{margin:0 0 8px;font-family:var(--serif);font-weight:400;font-size:clamp(28px,3vw,36px);line-height:1.15;color:var(--navy);outline:none}
.step-head p{margin:0;font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.45;color:#4A3F24}
.opt{text-transform:none;letter-spacing:0}
.chips label:has(input:checked){border-color:var(--navy);background:var(--sand)}
.step-nav{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:4px}
.step-nav-last{margin-top:-4px}
.step-skip{flex:1;text-align:center;font-size:13px;color:var(--muted)}
.step-call{grid-column:1/-1;margin:0;font-size:14px;color:var(--muted)}
.step-call a{color:var(--navy);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
form.enq:not(.stepped) .step-nav,form.enq:not(.stepped) .step-call{display:none}
.enq-thanks{grid-column:1/-1;padding:8px 0 4px;outline:none;animation:stepIn .5s ease both}
.enq-thanks h3{margin:0 0 12px;font-family:var(--serif);font-weight:400;font-size:clamp(32px,3.4vw,42px);line-height:1.15;color:var(--navy)}
.enq-thanks p{margin:0 0 18px;font-family:var(--serif);font-style:italic;font-size:20px;line-height:1.5;color:var(--navy)}
@media (max-width:620px){
  .step{grid-template-columns:1fr}
  .step-nav{flex-wrap:wrap}
  .step-skip{order:3;flex-basis:100%;text-align:left}
  .enq-progress li{font-size:0;letter-spacing:0}
  .enq-progress li.now{font-size:10px;letter-spacing:.16em;overflow:visible}
}
@media (prefers-reduced-motion:reduce){form.enq.stepped .step:not([hidden]),.enq-thanks{animation:none}.enq-progress li span::after{transition:none}}

/* Hero video (index.html): a slow fjord loop behind the hero text and logo, under a navy tint that
   keeps the text readable. The still frame is the background until the video plays, and stays
   for reduced motion and data saver (the script only loads the video otherwise). */
.hero-main{position:relative}
.hero-main>.wrap,.hero-art-box{position:relative;z-index:1}
.hero-video{position:absolute;inset:0;z-index:0;overflow:hidden;background:var(--navy) url(/assets/hero/noronha-poster.jpg) center/cover no-repeat}
.hero-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.6s ease}
.hero-video video.on{opacity:1}
/* Tint only where the words are (left), fading out so the rest of the picture keeps its light (lightened 11 Oct 2026 at the owner's request);
   a soft shade along the bottom joins it to the navy protection strip. */
/* Navy tint over the hero videos, at about 80% of its original strength (Neil, 11 Oct 2026), so the words read without dulling the footage */
.hero-video::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(22,40,61,.44) 0%,rgba(22,40,61,0) 26%),linear-gradient(90deg,rgba(22,40,61,.78) 0%,rgba(22,40,61,.66) 34%,rgba(22,40,61,.3) 58%,rgba(22,40,61,0) 80%)}
@media (max-width:980px){.hero-video::after{background:linear-gradient(180deg,rgba(22,40,61,.2) 0%,rgba(22,40,61,.24) 10%,rgba(22,40,61,.74) 25%,rgba(22,40,61,.7) 55%,rgba(22,40,61,.76) 100%)}}
.hero h1{text-shadow:0 1px 3px rgba(0,0,0,.55),0 4px 28px rgba(0,0,0,.45)}
.hero .eyebrow,.hero p.lede,.hero .text-link.light{text-shadow:0 1px 2px rgba(0,0,0,.7),0 2px 18px rgba(0,0,0,.55)}

/* "Other" text boxes that open beside their choice on the enquiry form */
.chips .other-inline,.with-other .other-inline{flex:1 1 200px;min-width:180px;width:auto;padding:9px 14px;font-size:15px}
.other-inline[hidden]{display:none}
.with-other{display:flex;flex-wrap:wrap;gap:8px}
.with-other select{flex:0 1 240px;width:auto}

/* Privacy Notice and Cookies Policy (public/privacy.html, public/cookies.html) */
.legal-page{background:var(--ivory);padding:72px 0 96px}
.legal-page .wrap{max-width:780px}
.legal-page h1{font-size:clamp(40px,6vw,60px);margin:6px 0 6px}
.legal-page h2{font-size:30px;margin:48px 0 12px}
.legal-page h3{font:500 13px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--bronze-ink);margin:26px 0 8px}
.legal-page p,.legal-page li{color:#2D3B4C;font-size:17px;line-height:1.7}
.legal-page ul{padding-left:22px;margin:0 0 16px}
.legal-page li{margin-bottom:6px}
.legal-page a{color:var(--navy);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
.lp-updated{font-size:14px!important;color:var(--muted)!important;margin:0 0 28px}
.lp-lead{font-family:var(--serif);font-style:italic;font-size:22px!important;line-height:1.5!important;color:var(--navy)!important}
.lp-toc{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin:28px 0 8px}
.lp-toc ol{margin:0;padding-left:22px;columns:2;column-gap:32px}
.lp-toc li{font-size:15px;margin-bottom:4px;break-inside:avoid}
.lp-toc li a{display:inline-block;padding:2px 0}   /* at least 24px tall to tap (WCAG 2.5.8) */
.lp-table-wrap{overflow-x:auto;margin:8px 0 16px}
.lp-table{width:100%;border-collapse:collapse;font-size:15px;background:#fff}
.lp-table th{font:500 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--bronze-ink);text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);background:var(--sand)}
.lp-table td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top;color:#2D3B4C;line-height:1.55}
.lp-table code{font-size:13px;background:var(--sand);padding:1px 5px}
.lp-note{font-size:12px;color:var(--muted)}
.lp-todo{background:#FFF0C2;padding:1px 6px;font-weight:500}
.form-privacy{grid-column:1/-1;margin:0;font-size:14px;color:#3A4553}
.form-privacy a{color:var(--navy);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
footer p a[href="/privacy"],footer p a[href="/cookies"],footer p a[href="/accessibility"]{display:inline-block;margin-top:6px}
footer .wrap > p a{display:inline-block;padding:3px 0}   /* each footer link at least 24px tall to tap (WCAG 2.5.8) */
@media (max-width:620px){.legal-page{padding:48px 0 72px}.lp-toc ol{columns:1}.legal-page h2{font-size:26px}}
.legal-page section{padding:0}
.legal-page section:first-of-type h2{margin-top:36px}
@media (max-width:620px){
  .lp-table,.lp-table tbody,.lp-table tr,.lp-table td{display:block;width:100%}
  .lp-table thead{display:none}
  .lp-table tr{border-bottom:1px solid var(--line);padding:6px 0}
  .lp-table td{border:0;padding:6px 14px}
  .lp-table td::before{content:attr(data-label);display:block;font:500 10px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--bronze-ink);margin-bottom:2px}
}

/* Marketing email opt-in on the enquiry form (unticked by default) */
.consent{grid-column:1/-1;display:flex;gap:12px;align-items:flex-start;font-size:15px;letter-spacing:0;text-transform:none;font-weight:300;color:var(--navy);line-height:1.5;cursor:pointer}
.consent input{width:20px;height:20px;flex:none;margin-top:2px;accent-color:var(--navy)}
.consent a{color:var(--navy);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}

/* Button at the bottom of each home page service card, to its landing page */
.svc{display:flex;flex-direction:column}
.svc p{margin-bottom:28px}
.svc-link{margin-top:auto;align-self:flex-start;font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:var(--navy);border-bottom:1px solid var(--gold);padding:14px 0 6px}
.svc-link:hover{color:var(--bronze-ink)}

/* Phones: a slim Call / Enquire bar along the bottom of the screen (hidden over the enquiry form by site-menu.js) */
.mobile-bar{display:none}
@media (max-width:620px){
  .mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:15;display:grid;grid-template-columns:1fr 1fr 1fr;background:var(--navy);border-top:1px solid rgba(198,164,107,.4);padding-bottom:env(safe-area-inset-bottom,0px);transition:transform .25s ease}
  .mobile-bar a{display:flex;align-items:center;justify-content:center;min-height:52px;font:500 12px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;color:var(--ivory);border:1px solid transparent}
  .mobile-bar a+a{border-left-color:rgba(198,164,107,.3)}
  .mobile-bar a:last-child{background:var(--gold);color:var(--navy)}
  .mobile-bar.away{transform:translateY(110%)}
  body:has(.mobile-bar){padding-bottom:calc(52px + env(safe-area-inset-bottom,0px))}
}
@media (prefers-reduced-motion:reduce){.mobile-bar{transition:none}}

/* Enquiry form: who's travelling (adults, children and their ages) */
.field-label{font-size:11px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze-ink)}
.party{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:flex-start}
.party-counts{display:flex;gap:14px}
.party-ages[hidden]{display:none}
.party-ages{flex:1 1 260px;display:flex;flex-direction:column;gap:8px;padding-left:24px;border-left:1px solid rgba(198,164,107,.5)}
.party-age-list{display:flex;flex-wrap:wrap;gap:10px 14px}
label.mini{display:flex;flex-direction:column;gap:6px;font-size:12px;letter-spacing:.06em;text-transform:none;font-weight:500;color:var(--navy)}
label.mini select{width:auto;min-width:96px;padding:11px 12px}
label.mini.age select{min-width:110px}
.mini-head{font-size:12px;font-weight:500;color:var(--muted)}
/* Preferred departure point suggestions */
.combo{position:relative}
.combo-list{position:absolute;z-index:5;left:0;right:0;top:calc(100% + 4px);margin:0;padding:6px 0;list-style:none;background:#fff;border:1px solid rgba(22,40,61,.18);box-shadow:0 14px 34px -14px rgba(22,40,61,.4);max-height:320px;overflow-y:auto}
.combo-list[hidden]{display:none}
.combo-list li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 14px;cursor:pointer;font-size:15px;color:var(--navy)}
.combo-list li small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--bronze-ink);white-space:nowrap}
.combo-list li:hover,.combo-list li[aria-selected="true"]{background:var(--sand)}
@media (max-width:620px){.party-ages{padding-left:0;border-left:0;padding-top:4px}}
.hero-video.ready video{transition:none}   /* swaps between rotation videos happen on navy, so no fade needed */

/* Phones: slightly larger reading text (owner found it hard to read). Kept last so it wins. */
@media (max-width:620px){
  body{font-size:17.5px}
  .eyebrow{font-size:12.5px}
  label,.field-label{font-size:12px}
  .svc p,.hours p{font-size:17px}
  .steps p{font-size:16.5px}
  .chips label{font-size:14px}
  .consent,.combo-list li,.form-status,.enq-form-holidays{font-size:16px}
  .form-note,.form-privacy,.step-call,.enq-status,.enq-item-text span,.contact-card a,.sm-contact a{font-size:15px}
  .contact-card .sla{font-size:16px}
  footer{font-size:15px}
  footer .legal p{font-size:13px}
  .legal-page p,.legal-page li{font-size:17.5px}
  .lp-toc li,.lp-table{font-size:16px}
}

/* Why choose us: the one-line "how it works" under the heading */
.how{margin:22px 0 0;max-width:62ch;font-size:17px;color:rgba(247,242,231,.85)}
.how strong{font-weight:500;color:var(--gold-bright)}
.how a{color:var(--ivory);white-space:nowrap;text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
.how a:hover{color:var(--gold-bright)}

/* Questions (FAQ) */
.faq{background:var(--ivory)}
.faq-list{margin-top:36px;max-width:820px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:44px;padding:20px 0;font-family:var(--serif);font-size:23px;line-height:1.3;color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font:300 28px/1 var(--sans);color:var(--gold-deep);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq summary:hover{color:var(--bronze-ink)}
.faq details p{margin:0 0 22px;max-width:68ch;color:#2D3B4C}
.faq details a{color:var(--navy);text-decoration-color:var(--gold);text-underline-offset:3px}
@media (prefers-reduced-motion:reduce){.faq summary::after{transition:none}}

/* Enquiry form: the holiday they came from, step count on phones, thank-you next steps */
.enq-journey{grid-column:1/-1;margin:0;padding:14px 16px;background:var(--ivory);border-left:2px solid var(--gold);font-size:15px;color:var(--navy)}
.enq-journey[hidden],#f-contact-field[hidden]{display:none}
.enq-count{display:none}
.thanks-next{margin:0 0 20px;padding-left:22px;color:#2D3B4C}
.thanks-next li{margin-bottom:8px;padding-left:4px}
.enq-thanks p.thanks-inbox,.enq-thanks p.thanks-contact{font-family:var(--sans);font-style:normal;font-size:15.5px;color:var(--muted)}
.enq-thanks p.thanks-inbox{padding:12px 14px;background:var(--ivory);border-left:2px solid var(--gold);color:var(--navy)}
.enq-thanks p.thanks-inbox[hidden]{display:none}
.enq-thanks .thanks-links .btn{font-style:normal}
.enq-thanks .thanks-contact a{color:var(--navy);text-decoration-color:var(--gold);text-underline-offset:3px}

/* "My enquiry" panel extras */
.enq-privacy{font-size:13px;color:var(--muted);margin:14px 0 0}
.enq-privacy a{color:inherit}
.enq-done-call{font-size:15px}
.enq-done-call[hidden]{display:none}

/* Footer: travel inspiration sign-up */
footer .wrap.news-wrap{display:block;padding-top:26px;padding-bottom:0}
.news{display:flex;flex-wrap:wrap;gap:14px 40px;align-items:center;justify-content:space-between;padding-bottom:40px;border-bottom:1px solid rgba(198,164,107,.16)}
.news-text{flex:1 1 320px}
.news-label{display:block;font-family:var(--serif);font-weight:400;font-size:26px;line-height:1.2;text-transform:none;letter-spacing:.01em;color:var(--ivory);margin-bottom:6px}
.news .news-text p{margin:0;max-width:52ch}
.news-side{flex:1 1 360px;max-width:480px}
.news-row{display:flex;gap:10px}
/* Consent wording under the sign-up box (16 Oct 2026, Neil) */
.news-consent{margin:12px 0 0;font-size:13px;line-height:1.55;color:rgba(247,242,231,.66)}
footer .news-consent a[href]{display:inline;margin:0;padding:0;color:var(--ivory);text-decoration:underline;text-decoration-color:var(--gold);text-underline-offset:3px}
.news-consent a:hover{color:var(--gold-bright)}
.news-row input{flex:1;min-width:0;min-height:48px;font:inherit;font-size:16px;color:var(--navy);background:var(--ivory);border:1px solid transparent;border-radius:0;padding:12px 14px}
.news-row input:focus{outline:2px solid var(--gold-bright);outline-offset:2px;border-color:transparent}
.news-row .btn:hover{background:transparent;color:var(--gold-bright);border-color:var(--gold)}
.news .news-status{flex-basis:100%;margin:0;max-width:none;color:var(--gold-bright)}
.news .news-status:empty{display:none}

/* Tap targets at least 44px on touch screens */
nav.primary a.cta{min-height:44px;display:inline-flex;align-items:center}
.chips label{min-height:44px}
.enq-close{min-width:44px;min-height:44px}

@media (max-width:620px){
  .enq-count{display:block;grid-column:1/-1;margin:-6px 0 0;font:500 11px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--bronze-ink)}
  form.enq.done .enq-count{display:none}
  .faq summary{font-size:21px}
  .news-side{flex-basis:100%;max-width:none}
  .news-row .btn{padding:14px 18px}
}

/* Enquiry form: field labels a shade darker than elsewhere, so they stand out on the sand */
form.enq .field > label,form.enq .field-label{color:#4A3F24}

/* Accessibility additions (Oct 2026, WCAG 2.2 AA review) */
.enq-panel[hidden],.enq-shade[hidden]{display:none}   /* a closed My enquiry panel is gone, not just slid off screen */
.skip-link{position:absolute;left:16px;top:-80px;z-index:60;padding:12px 18px;background:var(--navy);color:var(--ivory);font:500 13px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;outline:2px solid var(--gold-bright);outline-offset:0}
.skip-link:focus{top:12px}
.field-error{margin:2px 0 0;font-size:14px;font-weight:400;color:#9B2C1F}
input[aria-invalid="true"]{border-color:#9B2C1F}
.news .field-error{color:#F2B8A8;flex-basis:100%}
/* Pause / play for videos that start by themselves (WCAG 2.2.2). One press pauses every video and is remembered. */
.vid-toggle{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:10px 16px;border:1px solid rgba(247,242,231,.55);border-radius:999px;background:rgba(22,40,61,.62);color:var(--ivory);font:500 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;backdrop-filter:blur(4px);transition:background .2s,border-color .2s}
.vid-toggle:hover{background:rgba(22,40,61,.85);border-color:var(--gold)}
.vid-toggle svg{width:16px;height:16px;fill:currentColor}
.vid-toggle .vt-play{display:none}.vid-toggle.is-paused .vt-play{display:block}.vid-toggle.is-paused .vt-pause{display:none}
.vid-toggle--hero{right:24px;bottom:24px}
.hero-main .vid-toggle--hero{right:max(24px,calc((100vw - var(--wrap))/2 + 24px))}
.vid-toggle--card{top:12px;right:12px;min-height:40px;width:40px;padding:0;justify-content:center}
.vid-toggle--card .vt-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.x-detail-hero .vid-toggle--hero{top:24px;bottom:auto}
@media (max-width:620px){.vid-toggle--hero{right:14px;bottom:14px;padding:8px 12px}.x-detail-hero .vid-toggle--hero{top:14px}.hero-main .vid-toggle--hero{top:14px;bottom:auto}}
@media (max-width:620px){html{scroll-padding-bottom:64px}}   /* keeps focus clear of the Call / Enquire bar */
/* Hero strapline and heading: ivory/gold with a tight dark halo keeps them readable over bright frames of any video (WCAG 1.4.3) */
.hero-main .eyebrow{color:var(--ivory);text-shadow:0 0 2px rgba(10,20,32,.95),0 0 6px rgba(10,20,32,.85),0 1px 2px rgba(0,0,0,.7)!important}   /* ivory, like the rest of the hero text (Neil, 14 Oct 2026) */
.hero-main h1{text-shadow:0 0 3px rgba(10,20,32,.6),0 2px 18px rgba(10,20,32,.55)}
/* Phones: a calmer opening screen (Neil, 15 Oct 2026). Enquire is in the bottom bar, so the header copy goes
   where that bar shows; the hero Pause videos button is a small round icon (its label stays for screen readers);
   "Book a discovery call" lines up with the words inside the Shape your journey button. */
@media (max-width:620px){
  body:has(.mobile-bar) nav.primary a.cta{display:none}
  .hero-main .vid-toggle--hero{width:40px;min-height:40px;padding:0;justify-content:center}
  .hero-main .vid-toggle--hero .vt-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .hero .actions .text-link{margin-left:29px}   /* button padding 28px + 1px border */
}
/* Social links under the brand in every footer (16 Oct 2026) */
footer .social{display:flex;gap:10px;list-style:none;margin:20px 0 0;padding:0}
footer .social a{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid rgba(198,164,107,.5);border-radius:50%;color:var(--gold-bright);transition:background .2s,color .2s,border-color .2s}
footer .social a:hover{background:var(--gold);border-color:var(--gold);color:var(--navy)}
footer .social svg{width:19px;height:19px}

/* Turnstile bot check (public/assets/turnstile.js): empty unless Cloudflare asks the visitor to tick a box. */
.ts-box:not(:empty){margin-top:12px}
