/*
Theme Name: Doniford Bay Caravan Hire
Theme URI: https://donifordbay.co.uk
Author: Infinite Lives
Author URI: https://infinitelives.co.uk
Description: A bespoke, sunny coastal booking theme for a privately owned 3 bedroom caravan at Haven Doniford Bay Holiday Park, Somerset. Online booking with availability calendar, seasonal pricing, vouchers, facility passes, booking fee and refundable cleaning deposit.
Version: 1.64.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: donifordbay
*/

/* ============================================================
   DESIGN TOKENS
   Coastal Somerset palette: deep sea navy, soft sand,
   sun-bleached coral accent. Editorial, warm, premium-feel.
   ============================================================ */
:root{
  --aqua:#6aece0;
  --aqua-light:#9af3ea;
  --teal:#26ccc2;
  --teal-deep:#149a92;
  --sun:#ffef7f;
  --sun-deep:#ffd84d;
  --orange:#ffb76b;
  --orange-deep:#ff9e3d;
  --coral:#ff6b3d;
  --coral-deep:#ec4f24;
  --sea-deep:#0c5f5a;
  --sea:#149a92;
  --sea-light:#26ccc2;
  --sky:#9af3ea;
  --sand:#fff3cf;
  --sand-deep:#ffe6a8;
  --shell:#fffdf6;
  --ink:#0d4f4a;
  --muted:#5c807c;
  --line:#f1e7cf;
  --gold:#ffb76b;
  --white:#ffffff;
  --shadow-sm:0 4px 16px rgba(12,95,90,.10);
  --shadow:0 14px 44px rgba(12,95,90,.16);
  --shadow-lg:0 30px 80px rgba(12,95,90,.24);
  --radius:18px;
  --radius-lg:30px;
  --maxw:1180px;
  --font-display:"Poppins","Segoe UI",sans-serif;
  --font-body:"Nunito Sans","Segoe UI",system-ui,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--shell);
  background-image:radial-gradient(ellipse 70% 45% at 85% -5%,rgba(255,239,127,.35),transparent 60%),radial-gradient(ellipse 60% 40% at -5% 8%,rgba(106,236,224,.32),transparent 58%);
  line-height:1.7;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:var(--sea);text-decoration:none;transition:.25s}
a:hover{color:var(--coral)}
h1,h2,h3,h4{font-family:var(--font-display);line-height:1.12;font-weight:700;color:var(--sea-deep);letter-spacing:-.015em}
h1{font-size:clamp(2.6rem,6vw,4.4rem);font-weight:800}
h2{font-size:clamp(2rem,4vw,3rem);font-weight:700}
h3{font-size:clamp(1.3rem,2.4vw,1.7rem)}
p{margin-bottom:1rem}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.eyebrow{
  font-family:var(--font-body);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:.76rem;
  font-weight:800;
  color:var(--coral-deep);
  margin-bottom:.8rem;
  display:inline-block;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--coral);color:#fff;
  padding:15px 32px;border-radius:50px;
  font-weight:700;font-size:.98rem;letter-spacing:.01em;
  border:none;cursor:pointer;transition:.3s;
  box-shadow:0 8px 24px rgba(226,103,74,.32);
}
.btn:hover{background:var(--coral-deep);color:#fff;transform:translateY(-2px);box-shadow:0 14px 34px rgba(196,78,51,.4)}
.btn-ghost{background:transparent;color:var(--sea-deep);border:2px solid var(--sea-deep);box-shadow:none}
.btn-ghost:hover{background:var(--sea-deep);color:#fff;transform:translateY(-2px)}
.btn-sea{background:var(--sea);box-shadow:0 8px 24px rgba(21,96,123,.32)}
.btn-sea:hover{background:var(--sea-deep)}

/* ---------- Header ---------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  padding:18px 0;transition:.35s;
  background:rgba(251,248,242,.96);backdrop-filter:blur(12px);box-shadow:var(--shadow-sm);
}
/* Over the homepage hero (before scrolling): transparent with a soft dark scrim
   so the white text stays readable against the bright sky. */
.site-header.over-hero:not(.scrolled){
  background:linear-gradient(180deg,rgba(12,95,90,.45),rgba(12,95,90,0));
  backdrop-filter:none;box-shadow:none;
}
.site-header.scrolled{background:rgba(251,248,242,.96);backdrop-filter:blur(12px);box-shadow:var(--shadow-sm);padding:12px 0}
.header-inner{display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-weight:600;font-size:1.4rem;color:var(--sea-deep)}
.brand .mark{
  width:42px;height:42px;border-radius:50%;
  background:linear-gradient(135deg,var(--teal),var(--sea-deep));
  display:grid;place-items:center;color:#fff;font-size:1.2rem;flex:none;
  box-shadow:var(--shadow-sm);
}
.nav a{color:var(--ink)}
.nav .btn{color:#fff}
/* White treatment ONLY at the top of the homepage hero */
.site-header.over-hero:not(.scrolled) .brand,
.site-header.over-hero:not(.scrolled) .nav a{color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.25)}
.site-header.over-hero:not(.scrolled) .brand .mark{background:rgba(255,255,255,.18);backdrop-filter:blur(4px)}
.site-header.over-hero:not(.scrolled) .nav .btn{color:#fff;text-shadow:none}
.nav{display:flex;align-items:center;gap:30px}
.nav li{list-style:none}
.nav .btn::after{display:none}
.nav a{font-weight:600;font-size:.96rem;position:relative}
.nav a::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--coral);transition:.3s}
.nav a:hover::after{width:100%}
.nav .btn{padding:11px 24px}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px;color:var(--ink)}
.site-header.over-hero:not(.scrolled) .burger{color:#fff}
.burger span{width:26px;height:2px;background:currentColor;transition:.3s}

/* ---------- Hero ---------- */
.hero{
  position:relative;min-height:100vh;display:flex;align-items:center;
  color:#fff;overflow:hidden;padding:130px 0 70px;
}
.hero-bg{position:absolute;inset:0;z-index:-2}
.hero-bg img{width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(160deg,rgba(255,239,127,.30) 0%,rgba(106,236,224,.22) 50%,rgba(12,95,90,.62) 100%)}
.hero::before{content:"";position:absolute;top:-12%;right:-6%;width:620px;height:620px;border-radius:50%;z-index:-1;
  background:radial-gradient(circle,rgba(255,239,127,.7),rgba(255,183,107,.32) 45%,transparent 70%);pointer-events:none}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:center;width:100%}
.hero-content{max-width:620px}
.hero h1{color:#fff;margin-bottom:1.2rem;text-shadow:0 2px 30px rgba(0,0,0,.3)}
.hero .lead{font-size:clamp(1.05rem,1.8vw,1.3rem);margin-bottom:2rem;max-width:560px;color:rgba(255,255,255,.95)}
.hero-cta{display:flex;gap:16px;flex-wrap:wrap}
.hero-badges{display:flex;gap:22px;margin-top:2.4rem;flex-wrap:wrap}
.hero-badge{display:flex;align-items:center;gap:10px;font-size:.92rem;font-weight:700}
.hero-badge .ic{width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.18);backdrop-filter:blur(6px);display:grid;place-items:center;font-size:1.1rem}
.hero-calcol{display:flex;justify-content:flex-end}
.scroll-hint{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;opacity:.85;animation:bob 2s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,8px)}}

/* ---------- Sections ---------- */
section{position:relative}
.sec{padding:100px 0}
.sec-head{max-width:680px;margin:0 auto 60px;text-align:center}
.sec-head p{color:var(--muted);font-size:1.1rem}
.sand-bg{background:var(--sand)}
.sea-bg{background:linear-gradient(160deg,var(--teal),var(--sea-deep));color:#fff}
.sea-bg h1,.sea-bg h2,.sea-bg h3{color:#fff}
.sea-bg .sec-head p{color:rgba(255,255,255,.82)}

/* ---------- Highlights grid ---------- */
.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:26px}
.feature{
  background:#fff;border-radius:var(--radius);padding:34px 28px;
  box-shadow:var(--shadow-sm);border:1px solid var(--line);transition:.35s;
}
.feature:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.feature .ic{
  width:56px;height:56px;border-radius:14px;display:grid;place-items:center;
  font-size:1.5rem;margin-bottom:18px;
  background:linear-gradient(135deg,var(--sand),var(--sand-deep));
}
.feature h3{font-size:1.25rem;margin-bottom:.5rem}
.feature p{color:var(--muted);font-size:.97rem;margin:0}

/* ---------- Split / about ---------- */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}
.split-media{position:relative}
.split-media img{border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;height:520px;object-fit:cover}
.split-media .tag{
  position:absolute;bottom:-22px;left:-22px;background:var(--coral);color:#fff;
  padding:18px 26px;border-radius:var(--radius);box-shadow:var(--shadow);
  font-family:var(--font-display);font-size:1.05rem;font-weight:600;
}
.split-body .check{list-style:none;margin:1.4rem 0}
.split-body .check li{padding:9px 0 9px 34px;position:relative;border-bottom:1px dashed var(--line)}
.split-body .check li::before{content:"\2713";position:absolute;left:0;top:9px;color:var(--coral);font-weight:800}

/* ---------- Gallery ---------- */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:200px;gap:14px}
.gallery a{overflow:hidden;border-radius:12px;display:block}
.gallery img{width:100%;height:100%;object-fit:cover;transition:.5s}
.gallery a:hover img{transform:scale(1.07)}
.gallery .big{grid-column:span 2;grid-row:span 2}
.gallery .wide{grid-column:span 2}

/* ---------- Rooms ---------- */
.rooms{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.room{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--line);transition:.35s}
.room:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.room img{height:200px;width:100%;object-fit:cover}
.room .room-body{padding:24px}
.room h3{font-size:1.25rem;margin-bottom:.4rem}
.room .beds{color:var(--coral-deep);font-weight:700;font-size:.9rem;text-transform:uppercase;letter-spacing:.08em}

/* ---------- Passes ---------- */
.pass-note{
  background:#fff;border-radius:var(--radius);padding:30px;margin-top:30px;
  border-left:5px solid var(--gold);box-shadow:var(--shadow-sm);
}
.pass-cols{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:10px}
.pass-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:var(--radius);padding:30px}
.sea-bg .pass-card{backdrop-filter:blur(4px)}
.pass-card h3{margin-bottom:14px}
.pass-card ul{list-style:none}
.pass-card li{padding:7px 0 7px 28px;position:relative;font-size:.97rem}
.pass-card.req li::before{content:"\1F3AB";position:absolute;left:0}
.pass-card.free li::before{content:"\2713";position:absolute;left:0;color:#7ddc9c;font-weight:800}

/* ---------- Local area ---------- */
.local{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
/* isolation:isolate forces this card to be its own stacking context, always.
   The image and the gradient used to sit at z-index -2 and -1, which only worked
   while .reveal still had a transform on the parent. The moment the reveal finished
   and the transform went to none, the stacking context vanished and the image
   painted itself BEHIND the section background - so the pictures disappeared on
   scroll, but only on sections that had a background colour. */
.local-card{position:relative;border-radius:var(--radius);overflow:hidden;min-height:280px;display:flex;align-items:flex-end;color:#fff;box-shadow:var(--shadow-sm);isolation:isolate}
.local-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.local-card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent,rgba(13,59,79,.85));z-index:1}
.local-card .lc-body{padding:24px;position:relative;z-index:2}
.local-card h3{color:#fff;font-size:1.3rem;margin-bottom:.3rem}
.local-card .dist{font-size:.82rem;text-transform:uppercase;letter-spacing:.1em;color:var(--gold);font-weight:700}
.local-card p{font-size:.92rem;color:rgba(255,255,255,.9);margin:0}
.local-card .lc-link{display:inline-block;margin-top:10px;font-weight:800;font-size:.84rem;color:var(--sun)}
a.local-card{cursor:pointer}
a.local-card:hover .lc-link{color:#fff}

/* ---------- Booking ---------- */
.booking-shell{display:grid;grid-template-columns:1fr 380px;gap:40px;align-items:start}
.booking-form{background:#fff;border-radius:var(--radius-lg);padding:40px;box-shadow:var(--shadow);border:1px solid var(--line)}
.field{margin-bottom:22px}
.field label{display:block;font-weight:700;margin-bottom:7px;font-size:.92rem;color:var(--sea-deep)}
.field input,.field select,.field textarea{
  width:100%;padding:13px 15px;border:1.5px solid var(--line);border-radius:10px;
  font-family:inherit;font-size:1rem;background:var(--shell);transition:.25s;
}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--sea-light);background:#fff;box-shadow:0 0 0 4px rgba(45,138,168,.12)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pass-opt{display:flex;align-items:center;gap:12px;padding:14px;border:1.5px solid var(--line);border-radius:10px;margin-bottom:10px;cursor:pointer;transition:.25s}
.pass-opt:hover{border-color:var(--sea-light);background:var(--shell)}
.pass-opt input{width:auto}
.pass-opt .po-label{flex:1;font-weight:600}
.pass-opt .po-price{color:var(--coral-deep);font-weight:700}
.summary{background:var(--sea-deep);color:#fff;border-radius:var(--radius-lg);padding:34px;position:sticky;top:100px;box-shadow:var(--shadow)}
.summary h3{color:#fff;margin-bottom:20px}
.summary-line{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.14);font-size:.96rem}
.summary-line.total{border-bottom:none;font-size:1.3rem;font-family:var(--font-display);padding-top:18px;font-weight:600}
.summary-line .muted{color:rgba(255,255,255,.6)}
.deposit-pill{background:var(--coral);border-radius:12px;padding:16px;text-align:center;margin:18px 0;font-weight:700}
.summary small{display:block;color:rgba(255,255,255,.6);margin-top:14px;font-size:.82rem;line-height:1.5}

/* ---------- Reviews ---------- */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.review{background:#fff;border-radius:var(--radius);padding:30px;box-shadow:var(--shadow-sm);border:1px solid var(--line)}
.review .stars{color:var(--gold);letter-spacing:2px;margin-bottom:12px}
.review p{font-style:italic;color:var(--ink)}
.review .who{font-weight:700;color:var(--sea-deep);font-style:normal;margin-top:14px}

/* ---------- FAQ ---------- */
.faq{max-width:780px;margin:0 auto}
.faq-item{background:#fff;border:1px solid var(--line);border-radius:12px;margin-bottom:14px;overflow:hidden}
.faq-q{padding:20px 24px;font-weight:700;cursor:pointer;display:flex;justify-content:space-between;align-items:center;color:var(--sea-deep)}
.faq-q .pm{font-size:1.5rem;color:var(--coral);transition:.3s}
.faq-item.open .pm{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:.35s;padding:0 24px}
.faq-item.open .faq-a{max-height:320px;padding:0 24px 22px}
.faq-a p{color:var(--muted);margin:0}

/* ---------- CTA band ---------- */
.cta-band{background:linear-gradient(135deg,var(--sea),var(--sea-deep));color:#fff;border-radius:var(--radius-lg);padding:60px;text-align:center;box-shadow:var(--shadow)}
.cta-band h2{color:#fff;margin-bottom:1rem}
.cta-band p{color:rgba(255,255,255,.9);max-width:520px;margin:0 auto 1.8rem}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:rgba(255,255,255,.78);padding:70px 0 30px}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:50px;margin-bottom:50px}
.site-footer h4{color:#fff;font-family:var(--font-body);font-weight:700;margin-bottom:18px;font-size:1rem;letter-spacing:.04em}
.site-footer a{color:rgba(255,255,255,.78);display:block;padding:4px 0;line-height:1.4}
.site-footer a:hover{color:var(--coral)}
.footer-brand .brand{color:#fff;margin-bottom:16px}
.footer-widget{margin:0}
.footer-widget p{margin-bottom:1rem}
.footer-widget strong{color:#fff}
/* stacked links are block-level already, so drop the <br> that follows them */
.footer-widget a + br{display:none}
.footer-note{display:block;padding:4px 0;color:rgba(255,255,255,.6);line-height:1.4}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:24px;text-align:center;font-size:.86rem;color:rgba(255,255,255,.5);line-height:1.7}
.footer-bottom .fb-line{display:block}
.footer-bottom .fb-credit{white-space:nowrap}
.footer-bottom .fb-credit a{display:inline;color:var(--coral);padding:0}
.footer-bottom .fb-disc{margin-top:4px;font-size:.8rem;opacity:.85}

/* ---------- Reveal animation ---------- */
.reveal{opacity:0;transform:translateY(30px);transition:.8s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- Availability calendar ---------- */
.cal-hero{
  background:#fff;border-radius:var(--radius-lg);
  padding:26px;box-shadow:var(--shadow-lg);width:100%;max-width:440px;margin-top:2.4rem;
  color:var(--ink);border:1px solid var(--line);
}
.cal-hero .cal-title{font-family:var(--font-display);font-weight:700;color:var(--sea-deep);font-size:1.15rem;margin-bottom:4px}
.cal-hero .cal-sub{font-size:.86rem;color:var(--muted);margin-bottom:16px}
.cal-hero select{width:100%;padding:13px 15px;border:1.5px solid var(--line);border-radius:12px;font-family:inherit;font-size:.95rem;background:var(--shell);font-weight:600;color:var(--ink);margin-bottom:16px;cursor:pointer}
.cal-wrap{background:var(--shell);border-radius:var(--radius);padding:18px}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.cal-head .cal-month{font-family:var(--font-display);font-weight:700;color:var(--sea-deep);font-size:1.1rem}
.cal-nav{background:#fff;border:1px solid var(--line);width:38px;height:38px;border-radius:11px;cursor:pointer;font-size:1.2rem;color:var(--sea-deep);transition:.2s;display:grid;place-items:center}
.cal-nav:hover:not(:disabled){background:var(--sun);color:#fff;border-color:var(--sun)}
.cal-nav:disabled{opacity:.3;cursor:not-allowed}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal-dow{text-align:center;font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);padding:2px 0 6px}
.cal-day{
  aspect-ratio:1;display:grid;place-items:center;border-radius:11px;font-size:.92rem;font-weight:700;
  background:#fff;color:var(--ink);cursor:default;position:relative;border:1.5px solid transparent;transition:.16s;
}
.cal-day.empty{background:transparent}
.cal-day.past{color:#cdd6d9;background:transparent;font-weight:500}
.cal-day.closed{background:repeating-linear-gradient(45deg,#eef1f2,#eef1f2 5px,#e3e8ea 5px,#e3e8ea 10px);color:#aeb8bb}
.cal-day.booked{background:#ffe0d6;color:#d18b7b;text-decoration:line-through}
.cal-day.avail{background:#e2f7ea;color:#16a05a;cursor:pointer;box-shadow:inset 0 0 0 1.5px #b9e9cb}
.cal-day.avail:hover{background:var(--sun);color:#fff;transform:translateY(-2px);box-shadow:0 6px 14px rgba(255,158,27,.4)}
.cal-day.selected{background:var(--coral);color:#fff;box-shadow:0 6px 16px rgba(255,107,61,.45)}
.cal-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;font-size:.76rem;color:var(--muted);font-weight:600}
.cal-legend span{display:flex;align-items:center;gap:6px}
.cal-legend i{width:14px;height:14px;border-radius:4px;display:inline-block}
.cal-legend .lg-avail{background:#e2f7ea;box-shadow:inset 0 0 0 1.5px #16a05a}
.cal-legend .lg-book{background:#ffe0d6}
.cal-legend .lg-close{background:repeating-linear-gradient(45deg,#eef1f2,#eef1f2 3px,#e3e8ea 3px,#e3e8ea 6px)}
.cal-pick-note{margin-top:14px;font-size:.9rem;font-weight:700;color:var(--coral-deep);min-height:1.2em;text-align:center}

/* ---------- Booking flow steps ---------- */
.chosen-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fff;border:2px solid var(--teal);border-radius:var(--radius);padding:18px 22px;margin-bottom:24px;box-shadow:var(--shadow-sm)}
.chosen-bar .chosen-eyebrow{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:var(--teal-deep)}
.chosen-bar .chosen-dates{font-family:var(--font-display);font-weight:700;color:var(--sea-deep);font-size:1.1rem;margin-top:3px}
.chosen-change{background:none;border:none;color:var(--coral-deep);font-weight:800;cursor:pointer;font-family:inherit;font-size:.92rem;text-decoration:underline;padding:6px}
.chosen-change:hover{color:var(--coral)}
.pay-step{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:34px;box-shadow:var(--shadow-sm)}
.pay-manual{background:var(--sand);border-radius:12px;padding:18px;color:var(--ink);font-weight:600}
.pay-done{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:48px 34px;box-shadow:var(--shadow);text-align:center}
.pay-done .pay-tick{width:72px;height:72px;border-radius:50%;background:var(--teal);color:#fff;font-size:2.2rem;display:grid;place-items:center;margin:0 auto 18px}
.pay-done h3{margin-bottom:8px}
.pay-done p{color:var(--muted)}
.occ-row{display:grid;grid-template-columns:1fr 150px 90px 36px;gap:10px;align-items:center;margin-bottom:10px}
.occ-row .occ-bracket{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--teal-deep);text-align:center}
.occ-row .occ-del{background:none;border:1.5px solid var(--line);border-radius:8px;width:36px;height:38px;cursor:pointer;color:var(--coral-deep);font-weight:800}
.occ-row .occ-del:hover{border-color:var(--coral);color:var(--coral)}
.occ-row.lead .occ-del{visibility:hidden}
/* Contact cards */
.contact-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px;max-width:900px;margin:0 auto}
.contact-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:34px;text-align:center;box-shadow:var(--shadow-sm);color:var(--ink);transition:.3s;display:flex;flex-direction:column;align-items:center;gap:6px}
.contact-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.contact-card .cc-icon{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:1.8rem;margin-bottom:6px;background:linear-gradient(135deg,var(--sun-deep),var(--orange));color:#fff}
.contact-card.wa .cc-icon{background:linear-gradient(135deg,#4ad164,#1faa4a)}
.contact-card.email .cc-icon{background:linear-gradient(135deg,var(--teal),var(--sea-deep))}
.contact-card h3{font-size:1.25rem}
.contact-card p{color:var(--muted);margin:0}
.contact-card .cc-action{margin-top:10px;font-weight:800;color:var(--coral-deep)}
.contact-card:hover .cc-action{color:var(--coral)}
.contact-form-wrap{max-width:680px;margin:48px auto 0;background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:36px;box-shadow:var(--shadow-sm)}
.contact-form-wrap h3{text-align:center}
@media(max-width:560px){.occ-row{grid-template-columns:1fr 1fr;}.occ-row .occ-bracket{grid-column:1/2}.occ-row .occ-del{grid-column:2/3;justify-self:end}}

/* ---------- Pass age bands ---------- */
.age-bands{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.age-band{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:14px;padding:18px;text-align:center}
.age-band .ab-age{font-family:var(--font-display);font-weight:800;font-size:1.5rem;color:var(--sun)}
.age-band .ab-label{font-weight:700;margin:4px 0}
.age-band .ab-note{font-size:.82rem;color:rgba(255,255,255,.8)}

/* ---------- No dogs note ---------- */
.nodogs{display:inline-flex;align-items:center;gap:8px;background:var(--sand);border:1px dashed var(--sun-deep);color:var(--ink);padding:10px 18px;border-radius:50px;font-weight:700;font-size:.9rem;margin-top:18px}

/* sunny feature icon tints */
.feature .ic{background:linear-gradient(135deg,var(--sun-deep),var(--orange));color:#7a4a00}
.cta-band{background:linear-gradient(135deg,var(--orange),var(--coral))}

/* ---------- Blog ---------- */
.blog-feature{display:grid;grid-template-columns:1.2fr 1fr;gap:0;background:#fff;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);margin-bottom:34px;color:var(--ink)}
.blog-feature .bf-media{min-height:340px}
.blog-feature .bf-media img{width:100%;height:100%;object-fit:cover}
.blog-feature .bf-body{padding:40px;display:flex;flex-direction:column;justify-content:center}
.blog-feature h3{font-size:clamp(1.5rem,3vw,2.1rem);margin:.4rem 0 .6rem}
.blog-feature p{color:var(--muted)}
.blog-date{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--coral-deep)}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.blog-card{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid var(--line);color:var(--ink);display:flex;flex-direction:column;transition:.3s}
.blog-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.blog-card .bc-media{height:190px}
.blog-card .bc-media img{width:100%;height:100%;object-fit:cover}
.blog-card .bc-body{padding:22px;display:flex;flex-direction:column;gap:6px}
.blog-card h4{font-size:1.15rem;line-height:1.25}
.blog-card p{color:var(--muted);font-size:.92rem;margin:0}
.blog-pager{display:flex;gap:8px;justify-content:center;margin-top:44px;flex-wrap:wrap}
.blog-pager .page-numbers{padding:9px 15px;border-radius:10px;background:#fff;border:1px solid var(--line);font-weight:700;color:var(--sea-deep)}
.blog-pager .page-numbers.current{background:var(--coral);color:#fff;border-color:var(--coral)}

/* ---------- Responsive ---------- */
@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:34px}
  .hero-calcol{justify-content:flex-start}
  .cal-hero{max-width:none}
  .blog-feature{grid-template-columns:1fr}
  .blog-feature .bf-media{min-height:240px}
  .blog-grid{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr;gap:40px}
  .split-media img{height:380px}
  .rooms,.reviews{grid-template-columns:1fr 1fr}
  .booking-shell{grid-template-columns:1fr}
  .summary{position:static}
  .pass-cols{grid-template-columns:1fr}
}
@media(max-width:720px){
  /* THE BUG, and it took a while to see:
     .nav is position:fixed, but it sits INSIDE .site-header, and the header gets
     backdrop-filter:blur() as soon as you scroll. backdrop-filter creates a
     CONTAINING BLOCK for fixed-position descendants (same as transform does).
     So the moment the header went .scrolled, the "fixed" panel stopped being fixed
     to the viewport and was trapped inside the 60px-tall header - which is why it
     was fine at the very top of the homepage (backdrop-filter:none there) and a mess
     everywhere else.
     The fix: kill backdrop-filter on the header while the menu is open, which hands
     the panel back to the viewport. */
  body.nav-open .site-header{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    background:rgba(251,248,242,.98);
  }
  body.nav-open{overflow:hidden}

  .nav{
    position:fixed;inset:0 0 0 auto;width:min(300px,82vw);
    background:var(--sea-deep);flex-direction:column;justify-content:center;
    padding:40px 34px;gap:22px;align-items:flex-start;
    transform:translateX(100%);transition:transform .35s cubic-bezier(.16,1,.3,1);
    z-index:1050;overflow-y:auto;
    box-shadow:-20px 0 60px rgba(0,0,0,.3);
  }
  .nav.open{transform:none}

  /* The dimmed backdrop. Fixed to the viewport, sits behind the panel. */
  .nav::before{
    content:"";position:fixed;inset:0;z-index:-1;
    background:rgba(8,36,48,.55);
    opacity:0;pointer-events:none;transition:opacity .35s;
  }
  .nav.open::before{opacity:1}

  /* slide-in panel is dark, so its links are always white */
  .nav a,.site-header .nav a,.site-header.over-hero:not(.scrolled) .nav a{color:#fff;text-shadow:none}
  .nav a{font-size:1.05rem}
  .nav .btn{margin-top:8px}

  .burger{display:flex;z-index:1100;color:var(--ink);position:relative}
  .site-header.over-hero:not(.scrolled) .burger{color:#fff}
  body.nav-open .burger{color:var(--ink)}
  .rooms,.reviews,.gallery{grid-template-columns:1fr 1fr}
  .gallery{grid-auto-rows:140px}
  .field-row{grid-template-columns:1fr}
  .cta-band{padding:40px 24px}
  .sec{padding:70px 0}
}
@media(max-width:480px){
  .rooms,.reviews,.blog-grid{grid-template-columns:1fr}
  .gallery .big{grid-column:span 2;grid-row:span 1}
}

/* ============================================================
   OFFERS PAGE + SALE FLAGS  (1.9.0)
   ============================================================ */
.offers-hero{
  background:linear-gradient(135deg,var(--sea-deep),var(--sea) 55%,var(--teal));
  color:#fff;padding:110px 0 70px;text-align:center;position:relative;overflow:hidden;
}
.offers-hero:after{
  content:"";position:absolute;inset:auto -10% -60px -10%;height:140px;
  background:var(--shell);border-radius:50% 50% 0 0;
}
.offers-hero .wrap{position:relative;z-index:2}
.offers-hero .eyebrow{color:var(--sun-deep)}
.offers-hero h1{color:#fff;font-size:clamp(2rem,5vw,3.2rem);margin:.3rem 0 1rem}
.offers-hero .lead{color:rgba(255,255,255,.9);max-width:680px;margin:0 auto;font-size:1.05rem}

.offers-stats{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:32px}
.ostat{
  background:rgba(255,255,255,.14);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.22);
  border-radius:var(--radius);padding:16px 26px;min-width:130px;
}
.ostat strong{display:block;font-family:var(--font-display);font-size:1.7rem;color:var(--sun)}
.ostat span{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;opacity:.85;font-weight:700}

.offers-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:10px}

.offer-card{
  position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow-sm);overflow:hidden;transition:.35s;display:flex;flex-direction:column;
}
.offer-card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.offer-card:before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:linear-gradient(90deg,var(--coral),var(--orange-deep),var(--sun-deep))}

.offer-save{
  position:absolute;top:18px;right:18px;z-index:2;
  background:var(--coral-deep);color:#fff;border-radius:50%;width:66px;height:66px;
  display:grid;place-items:center;align-content:center;line-height:1;
  font-family:var(--font-display);font-weight:800;font-size:1.25rem;
  box-shadow:0 8px 18px rgba(236,79,36,.4);
}
.offer-save small{display:block;font-size:.6rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;opacity:.9}

.offer-body{padding:30px 26px 26px;display:flex;flex-direction:column;flex:1}
.offer-type{color:var(--coral-deep);font-weight:800;font-size:.74rem;text-transform:uppercase;letter-spacing:.09em}
.offer-card h3{font-size:1.28rem;margin:.5rem 0 .3rem;padding-right:60px;line-height:1.3}
.offer-card h3 .arrow{color:var(--sea-light);margin:0 2px}
.offer-times{font-size:.85rem;color:var(--muted);margin-bottom:12px}

.offer-soon{
  display:inline-block;background:var(--sand);color:#96650a;border:1px solid var(--sand-deep);
  border-radius:999px;padding:4px 12px;font-size:.72rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.05em;margin-bottom:14px;
}

.offer-price{display:flex;align-items:baseline;gap:12px;margin-top:auto;padding-top:12px}
.offer-price .was{font-size:1.15rem;color:var(--muted);text-decoration:line-through;font-weight:600}
.offer-price .now{font-family:var(--font-display);font-size:2.2rem;font-weight:800;color:var(--sea-deep)}
.offer-saving{color:var(--coral-deep);font-weight:800;font-size:.9rem;margin:2px 0 18px}

.offer-btn{width:100%;text-align:center;justify-content:center}
.offer-note{font-size:.72rem;color:var(--muted);text-align:center;margin-top:12px}

.offers-foot{
  margin-top:44px;padding:28px;background:var(--shell);border:1px solid var(--line);
  border-radius:var(--radius);display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap;
}
.offers-foot p{margin:0;color:var(--muted);font-size:.92rem;max-width:640px}

.offers-empty{text-align:center;padding:60px 20px;max-width:620px;margin:0 auto}
.offers-empty .ic{font-size:3.4rem;margin-bottom:10px}
.offers-empty p{color:var(--muted);margin-bottom:24px}
.offers-empty-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* On-sale date in the booking calendar */
.cal-day.on-sale:after{
  content:"";position:absolute;top:5px;right:5px;width:7px;height:7px;border-radius:50%;
  background:var(--coral-deep);box-shadow:0 0 0 2px #fff;
}
.cal-day.on-sale{background:#fff0e6;color:var(--coral-deep);box-shadow:inset 0 0 0 1.5px #ffc7ad}
.cal-day.on-sale:hover{background:var(--coral);color:#fff}
.cal-day.selected.on-sale:after{display:none}

.sale-flag{
  display:inline-block;background:var(--coral-deep);color:#fff;border-radius:5px;
  padding:2px 7px;font-size:.64rem;font-weight:800;letter-spacing:.06em;vertical-align:middle;
}

@media(max-width:1000px){ .offers-grid{grid-template-columns:1fr 1fr} }
@media(max-width:700px){
  .offers-grid{grid-template-columns:1fr}
  .offers-hero{padding:90px 0 55px}
  .offers-foot{flex-direction:column;align-items:flex-start}
}
.occ-help{display:block;color:var(--muted);font-size:.82rem;line-height:1.5;margin:-4px 0 12px}

/* Fixed arrival/departure notice on the booking form */
.arrival-note{
  display:flex;gap:14px;align-items:flex-start;
  background:var(--sand);border:1px solid var(--sand-deep);
  border-radius:var(--radius);padding:16px 18px;margin-bottom:22px;
}
.arrival-note .ic{font-size:1.4rem;line-height:1.2;flex-shrink:0}
.arrival-note p{margin:0;font-size:.88rem;line-height:1.6;color:#7a5a12}
.arrival-note strong{color:#5c430b}
.gal-note{font-size:.85rem;color:var(--muted);font-style:italic;margin-top:8px}

/* ============================================================
   FEATURE BOXES: icon left, heading right (1.14.0)
   ============================================================ */
.feature-head{display:flex;align-items:center;gap:14px;margin-bottom:12px;min-height:56px}
.feature-head .ic{margin:0;flex:0 0 auto}
.feature-head h3{font-size:1.12rem;margin:0;line-height:1.25;text-wrap:balance}
.feature p{color:var(--muted);font-size:.95rem;margin:0;line-height:1.65}

/* Gallery: images no longer link anywhere */
.gallery .gal-item{overflow:hidden;border-radius:12px;display:block}
.gallery .gal-item img{width:100%;height:100%;object-fit:cover;transition:.5s}
.gallery .gal-item:hover img{transform:scale(1.05)}

/* Sleeping arrangements: centre the two headings in each card */
.room .room-body{text-align:center}
.room .beds{display:block;margin-bottom:.35rem}
.room .room-body h3{text-align:center}
.room .room-body p{text-align:left;margin-top:.6rem}

/* Homepage explore teaser */
.explore-cta{
  margin-top:34px;padding:28px 30px;background:var(--shell);border:1px solid var(--line);
  border-radius:var(--radius);display:flex;align-items:center;justify-content:space-between;
  gap:24px;flex-wrap:wrap;
}
.explore-cta p{margin:0;color:var(--muted);max-width:640px;font-size:.98rem}

/* ============================================================
   THINGS TO DO PAGE (1.14.0)
   ============================================================ */
.ttd-hero{
  background-size:cover;background-position:center;color:#fff;
  padding:130px 0 100px;text-align:center;
}
.ttd-hero .eyebrow{color:var(--sun)}
.ttd-hero h1{color:#fff;font-size:clamp(2rem,5.2vw,3.4rem);margin:.4rem 0 1rem;text-wrap:balance}
.ttd-hero .lead{color:rgba(255,255,255,.92);max-width:700px;margin:0 auto;font-size:1.06rem;line-height:1.7}

.ttd-split{
  display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;
  margin-bottom:64px;
}
.ttd-split.reverse .ttd-text{order:2}
.ttd-split.reverse .ttd-img{order:1}
.ttd-split .ttd-text h3{font-size:1.7rem;margin:.3rem 0 .8rem}
.ttd-split .ttd-text p{color:var(--muted);line-height:1.75;margin-bottom:1rem}
.ttd-split .ttd-text p:last-child{margin-bottom:0}
.ttd-note{font-size:.85rem;font-style:italic;opacity:.85}

.ttd-img img{width:100%;border-radius:var(--radius);box-shadow:var(--shadow-sm);display:block;aspect-ratio:4/3;object-fit:cover}
.ttd-img.two-up{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ttd-img.two-up img{aspect-ratio:1/1}

.free-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.free-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:30px 26px;text-align:center;box-shadow:var(--shadow-sm);transition:.3s;
}
.free-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.free-card .ic{font-size:2.2rem;margin-bottom:10px}
.free-card h3{font-size:1.2rem;margin-bottom:.4rem}
.free-card p{color:var(--muted);font-size:.92rem;margin:0;line-height:1.6}

/* Blue Anchor car boot */
.boot{
  display:grid;grid-template-columns:340px 1fr;gap:0;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow-sm);
}
.boot-img img{width:100%;height:100%;object-fit:cover;display:block;min-height:100%}
.boot-body{padding:38px 40px}
.boot-body h2{font-size:1.9rem;margin:.3rem 0 .8rem}
.boot-body > p{color:var(--muted);line-height:1.75}

.boot-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:24px 0 16px}
.boot-card{background:var(--shell);border:1px solid var(--line);border-radius:14px;padding:20px 22px}
.boot-card h4{font-size:1rem;margin:0 0 .2rem;color:var(--sea-deep)}
.boot-card .when{font-size:.82rem;color:var(--coral-deep);font-weight:700;margin:0 0 12px}
.boot-card ul{list-style:none;padding:0;margin:0}
.boot-card li{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;border-bottom:1px dashed var(--line);font-size:.9rem}
.boot-card li:last-child{border-bottom:none}
.boot-card li span{color:var(--muted)}
.boot-card li strong{font-weight:800;color:var(--sea-deep)}
.boot-card li strong.free{color:var(--coral-deep)}
.boot-note{font-size:.8rem;color:var(--muted);font-style:italic;margin:0}

@media(max-width:900px){
  .ttd-split{grid-template-columns:1fr;gap:26px;margin-bottom:48px}
  .ttd-split.reverse .ttd-text,.ttd-split.reverse .ttd-img{order:0}
  .free-grid{grid-template-columns:1fr}
  .boot{grid-template-columns:1fr}
  .boot-img img{aspect-ratio:16/9;min-height:0}
  .boot-body{padding:28px 24px}
  .boot-cards{grid-template-columns:1fr}
  .explore-cta{flex-direction:column;align-items:flex-start}
  .feature-head{min-height:0}
}

/* ============================================================
   BOOKING PAGE TABS (1.15.0)
   ============================================================ */
.btabs{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
  background:var(--shell);border:1px solid var(--line);border-radius:18px;
  padding:9px;max-width:860px;margin:0 auto 46px;
}
.btab{
  display:flex;flex-direction:column;align-items:center;gap:7px;
  padding:20px 12px;border:none;border-radius:11px;cursor:pointer;
  background:transparent;color:var(--muted);
  font-family:var(--font-display);font-weight:800;font-size:1.22rem;letter-spacing:-.01em;
  transition:.22s;position:relative;line-height:1.2;
}
.btab .ic{font-size:1.5rem;line-height:1}
.btab .tl{font-size:1.22rem}
.btab:hover{background:rgba(255,255,255,.7);color:var(--sea-deep)}
.btab.is-active{background:#fff;color:var(--sea-deep);box-shadow:var(--shadow-sm)}
.btab.is-active .tl{color:var(--sea-deep)}
.btab .tcount{
  font-size:.68rem;font-weight:800;letter-spacing:.04em;
  background:var(--sand-deep);color:#7a5a12;border-radius:999px;padding:2px 9px;margin-top:2px;
}
.btab .tcount.hot{background:var(--coral-deep);color:#fff}
.btab.has-offers::before{
  content:"";position:absolute;top:9px;right:9px;width:8px;height:8px;border-radius:50%;
  background:var(--coral-deep);box-shadow:0 0 0 3px rgba(236,79,36,.22);
}
.btab.is-active.has-offers::before{display:none}

.bpanel{display:none}
.bpanel.is-active{display:block;animation:panelIn .3s ease}
@keyframes panelIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.panel-empty{text-align:center;padding:60px 20px;max-width:600px;margin:0 auto}
.panel-empty .ic{font-size:3.2rem;margin-bottom:10px}
.panel-empty p{color:var(--muted);margin-bottom:22px}

/* ---------- Price list ---------- */
.pl-intro{
  background:var(--shell);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 26px;margin-bottom:34px;display:flex;justify-content:space-between;
  align-items:center;gap:22px;flex-wrap:wrap;
}
.pl-intro p{margin:0;color:var(--muted);font-size:.94rem;max-width:640px}
.pl-key{display:flex;gap:16px;flex-wrap:wrap;font-size:.8rem;font-weight:700;color:var(--muted)}
.pl-key span{display:flex;align-items:center;gap:6px}
.pl-key i{width:11px;height:11px;border-radius:3px;display:inline-block}
.pl-key .k-free{background:var(--teal)}
.pl-key .k-sale{background:var(--coral-deep)}
.pl-key .k-gone{background:#c9d2d7}

.pl-month{margin-bottom:34px}
.pl-month-head{
  border-bottom:2px solid var(--line);padding-bottom:8px;margin-bottom:6px;
}
.pl-month-head h3{margin:0;font-size:1.35rem;color:var(--sea-deep)}

.pl-table{width:100%;border-collapse:collapse}
.pl-table th{
  text-align:left;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;
  color:var(--muted);font-weight:800;padding:10px 12px;
}
.pl-table th.ta-r,.pl-table td.ta-r{text-align:right}
.pl-table td{padding:13px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
.pl-table tr:last-child td{border-bottom:none}
.pl-table tr.sale td{background:#fff6f1}
.pl-table tr.gone td{opacity:.5}
.pl-dates strong{color:var(--sea-deep)}
.pl-dates .arrow{color:var(--sea-light);margin:0 4px}
.pl-break{font-size:.9rem;color:var(--muted)}
.pl-break small{display:block;font-size:.75rem;opacity:.8}
.pl-price s{color:var(--muted);opacity:.7;margin-right:6px;font-size:.88rem}
.pl-price strong{font-size:1.08rem;color:var(--sea-deep)}
.pl-table tr.sale .pl-price strong{color:var(--coral-deep)}

.pill{
  display:inline-block;border:none;border-radius:999px;padding:7px 16px;
  font-size:.78rem;font-weight:800;letter-spacing:.02em;font-family:inherit;
}
.pill.free{background:var(--teal);color:#fff;cursor:pointer;transition:.22s}
.pill.free:hover{background:var(--sea-deep);transform:translateY(-1px)}
.pl-table tr.sale .pill.free{background:var(--coral-deep)}
.pl-table tr.sale .pill.free:hover{background:var(--coral)}
.pill.gone{background:#e6ebee;color:#8a979e}

/* ---------- Offers bar inside the tab ---------- */
.offers-bar{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  background:linear-gradient(135deg,var(--sea-deep),var(--teal));color:#fff;
  border-radius:var(--radius);padding:22px 26px;margin-bottom:34px;
}
.offers-bar p{margin:0;flex:1;min-width:240px;font-size:.9rem;color:rgba(255,255,255,.9)}
.offers-bar .ostat{
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);
  border-radius:12px;padding:12px 20px;text-align:center;min-width:110px;
}
.offers-bar .ostat strong{display:block;font-family:var(--font-display);font-size:1.5rem;color:var(--sun)}
.offers-bar .ostat span{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;font-weight:700;opacity:.85}

@media(max-width:760px){
  .btabs{grid-template-columns:1fr;max-width:none}
  .btab{flex-direction:row;justify-content:center;gap:10px;padding:16px 12px;font-size:1.1rem}
  .btab .tl{font-size:1.1rem}
  .pl-intro{flex-direction:column;align-items:flex-start}
  .pl-table th:nth-child(2),.pl-table td.pl-break{display:none}
  .pl-table td,.pl-table th{padding:11px 6px}
}

/* ============================================================
   HAVEN PLAY PASSES (1.17.0) - we do not sell these
   ============================================================ */
.pass-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:34px 0}
.pstep{
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);
  border-radius:14px;padding:20px 18px;position:relative;
}
.pstep .pn{
  display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:var(--sun);color:#5c430b;font-weight:800;font-size:.9rem;margin-bottom:10px;
}
.pstep p{margin:0;font-size:.9rem;line-height:1.6;color:rgba(255,255,255,.92)}
.pstep a{color:var(--sun);font-weight:700;text-decoration:underline}

/* --- The calculator (ours, not an embed) --- */
.pcalc{
  background:#fff;border-radius:var(--radius-lg);padding:32px 34px;
  margin:34px 0;box-shadow:var(--shadow);
}
.pcalc-head h3{font-size:1.35rem;margin:0 0 .3rem;color:var(--sea-deep)}
.pcalc-head p{color:var(--muted);font-size:.92rem;margin:0 0 22px}

.pcalc-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:24px}
.pc-field{display:flex;flex-direction:column;gap:6px}
.pc-field span{font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.pc-field input,.pc-field select{
  padding:11px 12px;border:1.5px solid var(--line);border-radius:10px;
  font-size:.95rem;font-family:inherit;background:#fff;color:var(--ink);
}
.pc-field input:focus,.pc-field select:focus{outline:none;border-color:var(--sea)}

.pcalc-out{background:var(--shell);border:1px solid var(--line);border-radius:14px;padding:22px 24px}
.pc-season{
  display:inline-block;font-size:.76rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.06em;padding:5px 12px;border-radius:999px;margin-bottom:14px;
  background:var(--teal);color:#fff;
}
.pc-season.peak{background:var(--coral-deep)}
.pc-rows{list-style:none;padding:0;margin:0 0 14px}
.pc-rows li{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed var(--line);font-size:.94rem}
.pc-rows li:last-child{border-bottom:none}
.pc-rows li span{color:var(--muted)}
.pc-rows li strong{color:var(--sea-deep);font-weight:800}
.pc-rows li strong.free{color:var(--teal)}
.pc-total{
  display:flex;justify-content:space-between;align-items:baseline;
  padding-top:14px;border-top:2px solid var(--line);
}
.pc-total span{font-weight:700;color:var(--sea-deep)}
.pc-total strong{font-family:var(--font-display);font-size:1.9rem;color:var(--coral-deep)}
.pc-note{font-size:.8rem;color:var(--muted);margin:12px 0 0}
.pc-note a{color:var(--sea);font-weight:700}
.pc-warn{margin:0;color:var(--muted);font-size:.92rem}

/* --- Estimate panel on the booking form --- */
.pass-info p{font-size:.9rem;line-height:1.65;color:var(--muted);margin:0 0 10px}
.pass-info a{color:var(--sea);font-weight:700}
.pass-small{font-size:.8rem !important;opacity:.85}

.pass-est{
  background:var(--shell);border:1px solid var(--line);border-left:4px solid var(--teal);
  border-radius:12px;padding:18px 20px;margin:14px 0;
}
.pe-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.pe-title{font-size:.86rem;font-weight:700;color:var(--sea-deep)}
.pe-total{font-family:var(--font-display);font-size:1.6rem;font-weight:800;color:var(--coral-deep)}
.pe-season{display:block;font-size:.76rem;color:var(--muted);margin-top:2px;font-weight:600}
.pe-rows{list-style:none;padding:0;margin:12px 0 0}
.pe-rows li{display:flex;justify-content:space-between;padding:5px 0;font-size:.86rem}
.pe-rows li span{color:var(--muted)}
.pe-rows li strong{color:var(--sea-deep)}
.pe-rows li strong.free{color:var(--teal)}
.pe-note{font-size:.78rem !important;margin:10px 0 0 !important;opacity:.9}
.summary-line.pass-line #sumPasses{font-size:.82rem}

/* Anchor links (#gallery, #passes) must clear the sticky header */
section[id]{scroll-margin-top:96px}

@media(max-width:900px){
  .pass-steps{grid-template-columns:1fr 1fr}
  .pcalc-grid{grid-template-columns:1fr 1fr}
  .pcalc{padding:26px 22px}
}
@media(max-width:560px){
  .pass-steps{grid-template-columns:1fr}
  .pcalc-grid{grid-template-columns:1fr}
}

/* ============================================================
   THINGS TO DO: on-site cards + car boot times (1.19.0)
   ============================================================ */
.onsite-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:10px}
.onsite{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow-sm);transition:.35s;
  display:flex;flex-direction:column;isolation:isolate;
}
.onsite:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.onsite img{width:100%;aspect-ratio:10/7;object-fit:cover;display:block}
.os-body{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1}
.os-tag{
  align-self:flex-start;font-size:.68rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.07em;padding:4px 11px;border-radius:999px;margin-bottom:10px;
  background:var(--teal);color:#fff;
}
.os-tag.alt{background:var(--coral-deep);color:#fff}
.os-tag.warm{background:var(--sand-deep);color:#7a5a12}
.onsite h3{font-size:1.2rem;margin:0 0 .45rem}
.onsite p{color:var(--muted);font-size:.92rem;line-height:1.65;margin:0}

.boot-times{display:flex;gap:12px;margin:18px 0 4px}
.bt{
  flex:1;background:var(--sea-deep);color:#fff;border-radius:12px;
  padding:14px 16px;text-align:center;
}
.bt-time{display:block;font-family:var(--font-display);font-size:1.6rem;font-weight:800;color:var(--sun)}
.bt-who{font-size:.76rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700;opacity:.9}

@media(max-width:1000px){ .onsite-grid{grid-template-columns:1fr 1fr} }
@media(max-width:640px){ .onsite-grid{grid-template-columns:1fr} }

/* ============================================================
   HAVEN PASS CALCULATOR PAGE (1.22.0)
   ============================================================ */
.wrap-narrow{max-width:920px}

.calc-hero{
  background:linear-gradient(135deg,var(--sea-deep),var(--teal));
  color:#fff;padding:130px 0 80px;text-align:center;
}
.calc-hero .eyebrow{color:var(--sun)}
.calc-hero h1{color:#fff;font-size:clamp(2rem,5vw,3.1rem);margin:.4rem 0 1rem}
.calc-hero .lead{color:rgba(255,255,255,.92);max-width:680px;margin:0 auto;font-size:1.04rem;line-height:1.75}

/* Homepage link box (replaces the calculator that used to live there) */
.pass-cta{
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  background:#fff;border-radius:var(--radius-lg);padding:30px 34px;margin:34px 0;box-shadow:var(--shadow);
}
.pass-cta h3{margin:0 0 .3rem;font-size:1.3rem;color:var(--sea-deep)}
.pass-cta p{margin:0;color:var(--muted);font-size:.94rem;max-width:520px}

/* Price cards */
.price-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.price-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:28px 30px;box-shadow:var(--shadow-sm);
}
.price-card.hot{border-color:var(--coral);box-shadow:0 10px 30px rgba(226,103,74,.16)}
.pc-label{
  display:inline-block;font-size:.72rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.08em;padding:5px 13px;border-radius:999px;color:#fff;
}
.pc-label.off{background:var(--teal)}
.pc-label.on{background:var(--coral-deep)}
.pc-when{color:var(--muted);font-size:.86rem;margin:10px 0 16px}
.price-card ul{list-style:none;padding:0;margin:0}
.price-card li{display:flex;justify-content:space-between;align-items:baseline;padding:11px 0;border-bottom:1px dashed var(--line)}
.price-card li:last-child{border-bottom:none}
.price-card li span{color:var(--muted);font-size:.94rem}
.price-card li strong{font-family:var(--font-display);font-size:1.5rem;color:var(--sea-deep)}
.price-card.hot li strong{color:var(--coral-deep)}
.price-card li strong.free{font-size:1rem;color:var(--teal)}

/* Peak periods */
.peak-list{
  margin-top:34px;background:var(--shell);border:1px solid var(--line);
  border-radius:var(--radius);padding:26px 30px;
}
.peak-list h3{font-size:1.2rem;margin:0 0 .4rem;color:var(--sea-deep)}
.peak-list > p{color:var(--muted);font-size:.92rem;margin:0 0 16px}
.peak-list ul{list-style:none;padding:0;margin:0}
.peak-list li{display:flex;justify-content:space-between;gap:14px;padding:10px 0;border-bottom:1px solid var(--line);font-size:.93rem;flex-wrap:wrap}
.peak-list li:last-child{border-bottom:none}
.peak-list li strong{color:var(--sea-deep)}
.peak-list li span{color:var(--coral-deep);font-weight:700}
.peak-note{font-size:.8rem;font-style:italic;color:var(--muted);margin:14px 0 0}

/* Steps + warnings */
.calc-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.cstep{background:var(--shell);border:1px solid var(--line);border-radius:14px;padding:20px 18px}
.cstep .pn{
  display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:var(--sea-deep);color:#fff;font-weight:800;font-size:.9rem;margin-bottom:10px;
}
.cstep p{margin:0;font-size:.9rem;line-height:1.6;color:var(--muted)}
.cstep a{color:var(--sea);font-weight:700}

.calc-warn{
  margin-top:40px;background:var(--sand);border:1px solid var(--sand-deep);
  border-radius:var(--radius);padding:26px 30px;
}
.calc-warn h3{font-size:1.15rem;margin:0 0 .8rem;color:#7a5a12}
.calc-warn ul{margin:0;padding-left:20px}
.calc-warn li{color:#7a5a12;font-size:.92rem;line-height:1.7;margin-bottom:8px}
.calc-warn li:last-child{margin-bottom:0}

@media(max-width:820px){
  .price-cards{grid-template-columns:1fr}
  .calc-steps{grid-template-columns:1fr 1fr}
  .pass-cta{flex-direction:column;align-items:flex-start}
}
@media(max-width:520px){ .calc-steps{grid-template-columns:1fr} }
.pass-card .pc-foot{margin:14px 0 0;font-size:.82rem;opacity:.8;font-style:italic}
.os-extra{
  margin-top:12px !important;padding-top:12px;border-top:1px dashed var(--line);
  color:var(--sea-deep) !important;font-size:.88rem !important;
}
.os-extra strong{color:var(--coral-deep)}
.pass-cta-prices{display:flex;gap:20px;flex-wrap:wrap;margin-top:12px !important}
.pass-cta-prices span{font-size:.84rem;color:var(--muted)}
.pass-cta-prices strong{font-family:var(--font-display);font-size:1.25rem;color:var(--sea-deep);margin-right:4px}

/* ============================================================
   GOCARDLESS PAY BY BANK (1.28.0)
   ============================================================ */
.pay-blurb{font-size:.82rem;color:var(--muted);margin:10px 0 0;line-height:1.55}
.pay-or{display:flex;align-items:center;gap:12px;margin:22px 0 16px;color:var(--muted)}
.pay-or:before,.pay-or:after{content:"";flex:1;height:1px;background:var(--line)}
.pay-or span{font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
/* Half-stars: unfilled star for anything under 5 */
.review .stars{letter-spacing:2px}

/* ============================================================
   BLOG (1.34.0)
   ============================================================ */

/* ---------- Listing ---------- */
.blog-tag{
  display:inline-block;font-size:.68rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.09em;padding:5px 12px;border-radius:999px;
  background:var(--sand-deep);color:#7a5a12;margin-bottom:12px;
}
.blog-tag.on-dark{background:var(--sun);color:#5c430b}
.blog-more{
  display:inline-block;margin-top:14px;font-weight:800;font-size:.85rem;
  color:var(--coral-deep);transition:.25s;
}
.blog-feature:hover .blog-more,.blog-card:hover .blog-more{transform:translateX(4px)}

.blog-feature{isolation:isolate}
.blog-feature .bf-media img{display:block}
.bf-noimg,.bc-noimg{
  width:100%;height:100%;min-height:190px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--sea-deep),var(--teal));color:rgba(255,255,255,.35);
}
.bf-noimg span,.bc-noimg span{font-size:3rem}
.blog-card .bc-body{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1}
.blog-card h4{font-size:1.15rem;margin:0 0 .4rem;line-height:1.35}
.blog-card p{color:var(--muted);font-size:.92rem;margin:0;line-height:1.6}

.blog-empty{text-align:center;padding:70px 20px;max-width:560px;margin:0 auto}
.blog-empty .ic{font-size:3rem;margin-bottom:12px}
.blog-empty p{color:var(--muted)}

.blog-pager{display:flex;justify-content:center;gap:8px;margin-top:44px;flex-wrap:wrap}
.blog-pager .page-numbers{
  display:grid;place-items:center;min-width:42px;height:42px;padding:0 12px;
  border-radius:11px;border:1px solid var(--line);background:#fff;color:var(--sea-deep);
  font-weight:700;font-size:.9rem;transition:.22s;
}
.blog-pager .page-numbers:hover{background:var(--shell);border-color:var(--sea-light)}
.blog-pager .page-numbers.current{background:var(--sea-deep);color:#fff;border-color:var(--sea-deep)}
.blog-pager .dots{border:none;background:none}

.blog-search{display:flex;gap:10px;max-width:520px;margin:20px auto 0}
.blog-search input{
  flex:1;padding:13px 16px;border:1.5px solid var(--line);border-radius:12px;
  font-family:inherit;font-size:.95rem;
}
.blog-search input:focus{outline:none;border-color:var(--sea)}

/* ---------- Single post: the hero ---------- */
.post-single{padding-bottom:70px}

.post-hero.has-img{
  position:relative;isolation:isolate;min-height:min(74vh,620px);
  display:flex;align-items:flex-end;overflow:hidden;
}
.post-hero.has-img .ph-img{position:absolute;inset:0;z-index:0}
.post-hero.has-img .ph-img img{width:100%;height:100%;object-fit:cover;display:block}
.post-hero.has-img::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(13,59,79,.15) 0%,rgba(13,59,79,.35) 45%,rgba(13,59,79,.88) 100%);
}
.post-hero.has-img .ph-inner{position:relative;z-index:2;width:100%;padding:0 0 60px}
.post-hero.has-img h1,.post-hero.has-img .ph-lead{color:#fff}
.post-hero.has-img .ph-lead{text-shadow:0 1px 20px rgba(0,0,0,.3)}

.post-hero.no-img{
  background:linear-gradient(135deg,var(--sea-deep),var(--teal));
  padding:150px 0 70px;text-align:center;
}
.post-hero.no-img h1,.post-hero.no-img .ph-lead{color:#fff}
.post-hero.no-img .ph-lead{margin-left:auto;margin-right:auto}

.post-hero h1{
  font-size:clamp(1.9rem,4.6vw,3.3rem);line-height:1.15;margin:.3rem 0 .8rem;
  text-wrap:balance;max-width:16ch;
}
.post-hero.no-img h1{max-width:20ch;margin-left:auto;margin-right:auto}
.post-hero .ph-lead{
  font-size:1.08rem;line-height:1.65;max-width:60ch;margin:0;
  color:rgba(255,255,255,.93);
}

/* ---------- Single post: the prose ---------- */
.post-content{
  max-width:720px;margin:0 auto;padding-top:56px;
  font-size:1.09rem;line-height:1.8;color:#2f4148;
}
.post-content > *{margin-bottom:1.5em}
.post-content > *:last-child{margin-bottom:0}

.post-content p{margin-bottom:1.5em}
.post-content > p:first-of-type{font-size:1.2rem;line-height:1.72;color:var(--ink)}

.post-content h2{
  font-size:1.85rem;margin:2.2em 0 .6em;line-height:1.25;color:var(--sea-deep);
  text-wrap:balance;
}
.post-content h3{font-size:1.4rem;margin:1.9em 0 .5em;color:var(--sea-deep);text-wrap:balance}
.post-content h4{font-size:1.15rem;margin:1.7em 0 .4em;color:var(--sea-deep)}

.post-content a{color:var(--sea);font-weight:700;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.post-content a:hover{color:var(--coral-deep)}
.post-content strong{color:var(--ink);font-weight:800}

.post-content ul,.post-content ol{padding-left:1.3em;margin-bottom:1.5em}
.post-content li{margin-bottom:.55em;padding-left:.2em}
.post-content ul li::marker{color:var(--coral)}
.post-content ol li::marker{color:var(--coral-deep);font-weight:800}

.post-content blockquote{
  margin:2em 0;padding:22px 28px;border:none;
  border-left:4px solid var(--coral);background:var(--sand);
  border-radius:0 14px 14px 0;
}
.post-content blockquote p{
  margin:0;font-family:var(--font-display);font-size:1.2rem;
  line-height:1.6;color:#7a5a12;font-weight:600;
}
.post-content blockquote cite{display:block;margin-top:10px;font-size:.85rem;font-style:normal;font-weight:700;opacity:.75}

.post-content img{max-width:100%;height:auto;border-radius:14px;display:block}
.post-content figure{margin:2em 0}
.post-content figcaption{
  margin-top:10px;font-size:.85rem;color:var(--muted);text-align:center;font-style:italic;
}

.post-content .alignwide{
  width:min(1040px,92vw);max-width:none;
  margin-left:50%;transform:translateX(-50%);
}
.post-content .alignfull{
  width:100vw;max-width:none;margin-left:50%;transform:translateX(-50%);border-radius:0;
}
.post-content .alignfull img{border-radius:0}
.post-content .alignleft{float:left;margin:.4em 2em 1.4em 0;max-width:45%}
.post-content .alignright{float:right;margin:.4em 0 1.4em 2em;max-width:45%}
.post-content .aligncenter{margin-left:auto;margin-right:auto}

.post-content hr,.post-content .wp-block-separator{
  border:none;height:1px;background:var(--line);margin:3em auto;width:60%;
}

.post-content table{width:100%;border-collapse:collapse;font-size:.95rem}
.post-content th{
  text-align:left;background:var(--shell);padding:12px 14px;
  font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);
}
.post-content td{padding:12px 14px;border-bottom:1px solid var(--line)}

.post-content code{
  background:var(--shell);padding:2px 7px;border-radius:6px;
  font-size:.9em;color:var(--coral-deep);
}
.post-content pre{
  background:var(--sea-deep);color:#e9f4f7;padding:22px;border-radius:14px;
  overflow-x:auto;font-size:.88rem;line-height:1.6;
}
.post-content pre code{background:none;color:inherit;padding:0}

/* ---------- THE GALLERY ---------- */
.post-content .wp-block-gallery,
.post-content .blocks-gallery-grid,
.post-content .gallery{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px;margin:2.4em 0;list-style:none;padding:0;
}
.post-content .wp-block-gallery.columns-2,.post-content .gallery-columns-2{grid-template-columns:repeat(2,1fr)}
.post-content .wp-block-gallery.columns-3,.post-content .gallery-columns-3{grid-template-columns:repeat(3,1fr)}
.post-content .wp-block-gallery.columns-4,.post-content .gallery-columns-4{grid-template-columns:repeat(4,1fr)}

.post-content .wp-block-image,
.post-content .blocks-gallery-item,
.post-content .gallery-item{
  margin:0 !important;position:relative;overflow:hidden;border-radius:14px;
  box-shadow:var(--shadow-sm);isolation:isolate;
}
.post-content .wp-block-gallery figure{margin:0;height:100%}
.post-content .wp-block-gallery img,
.post-content .gallery img{
  width:100%;height:100%;object-fit:cover;aspect-ratio:1/1;
  display:block;border-radius:14px;transition:transform .55s cubic-bezier(.16,1,.3,1);
  cursor:zoom-in;
}
.post-content .wp-block-gallery figure:hover img,
.post-content .gallery-item:hover img{transform:scale(1.06)}

/* Gallery captions sit over the image, not under it */
.post-content .wp-block-gallery figcaption,
.post-content .gallery-caption{
  position:absolute;left:0;right:0;bottom:0;margin:0;padding:24px 14px 12px;
  background:linear-gradient(transparent,rgba(13,59,79,.9));
  color:#fff;font-size:.8rem;text-align:left;font-style:normal;
  opacity:0;transition:.3s;pointer-events:none;
}
.post-content .wp-block-gallery figure:hover figcaption,
.post-content .gallery-item:hover .gallery-caption{opacity:1}

/* A gallery of exactly one image should not be a tiny square */
.post-content .wp-block-gallery.columns-1 img{aspect-ratio:auto;height:auto}

/* ---------- Lightbox ---------- */
.dbr-lb{
  position:fixed;inset:0;z-index:9999;display:none;
  background:rgba(8,36,48,.94);backdrop-filter:blur(6px);
  align-items:center;justify-content:center;padding:5vh 5vw;
}
.dbr-lb.open{display:flex;animation:lbIn .25s ease}
@keyframes lbIn{from{opacity:0}to{opacity:1}}
.dbr-lb img{max-width:100%;max-height:90vh;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.dbr-lb .lb-close,.dbr-lb .lb-prev,.dbr-lb .lb-next{
  position:absolute;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);
  color:#fff;width:48px;height:48px;border-radius:50%;cursor:pointer;
  font-size:1.3rem;display:grid;place-items:center;transition:.2s;
}
.dbr-lb .lb-close:hover,.dbr-lb .lb-prev:hover,.dbr-lb .lb-next:hover{background:rgba(255,255,255,.25)}
.dbr-lb .lb-close{top:24px;right:24px}
.dbr-lb .lb-prev{left:24px;top:50%;transform:translateY(-50%)}
.dbr-lb .lb-next{right:24px;top:50%;transform:translateY(-50%)}
.dbr-lb .lb-count{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.75);font-size:.85rem;font-weight:700}

/* ---------- Tags, CTA, prev/next ---------- */
.post-tags{max-width:720px;margin:44px auto 0;display:flex;gap:8px;flex-wrap:wrap}
.post-tags a{
  font-size:.8rem;font-weight:700;padding:6px 13px;border-radius:999px;
  background:var(--shell);border:1px solid var(--line);color:var(--muted);transition:.2s;
}
.post-tags a:hover{background:var(--sea-deep);color:#fff;border-color:var(--sea-deep)}

.post-cta{
  max-width:720px;margin:56px auto 0;padding:30px 34px;
  background:linear-gradient(135deg,var(--sea-deep),var(--teal));color:#fff;
  border-radius:var(--radius-lg);display:flex;align-items:center;
  justify-content:space-between;gap:24px;flex-wrap:wrap;box-shadow:var(--shadow);
}
.post-cta h3{color:#fff;margin:0 0 .25rem;font-size:1.35rem}
.post-cta p{margin:0;color:rgba(255,255,255,.88);font-size:.94rem}
.post-cta .btn{background:var(--sun);color:#5c430b}
.post-cta .btn:hover{background:#fff}

.post-nav{
  max-width:720px;margin:50px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:16px;
}
.pn-item{
  padding:20px 22px;border:1px solid var(--line);border-radius:var(--radius);
  background:#fff;transition:.25s;display:block;
}
.pn-item:hover{border-color:var(--sea-light);box-shadow:var(--shadow-sm);transform:translateY(-2px)}
.pn-item.next{text-align:right}
.pn-label{display:block;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--coral-deep);margin-bottom:5px}
.pn-title{display:block;font-weight:700;color:var(--sea-deep);line-height:1.35;font-size:.98rem}

@media(max-width:900px){
  .blog-feature{grid-template-columns:1fr}
  .blog-feature .bf-media{min-height:240px}
  .blog-feature .bf-body{padding:28px}
  .blog-grid{grid-template-columns:1fr 1fr}
  .post-content{font-size:1.03rem;padding-top:40px}
  .post-content .alignwide,.post-content .alignfull{width:100%;margin-left:0;transform:none}
  .post-content .alignleft,.post-content .alignright{float:none;margin:2em 0;max-width:100%}
  .post-nav{grid-template-columns:1fr}
  .pn-item.next{text-align:left}
  .post-cta{flex-direction:column;align-items:flex-start}
  .dbr-lb .lb-prev{left:8px}
  .dbr-lb .lb-next{right:8px}
}
@media(max-width:600px){
  .blog-grid{grid-template-columns:1fr}
  .post-content .wp-block-gallery,.post-content .gallery{grid-template-columns:1fr 1fr !important}
}

/* ============================================================
   EXCLUSIVE WHATSAPP GROUP BAR (1.38.0)
   One component, two skins: .dark in the footer, .light on the homepage.
   ============================================================ */
.wa-band{
  padding:0 0 10px;
  background:linear-gradient(180deg,#fff 0%,#fff 50%,var(--sand) 50%,var(--sand) 100%);
}
.wa-band .wa-bar{margin:0}

.wa-bar{
  display:flex;align-items:center;gap:22px;
  padding:24px 30px;border-radius:var(--radius-lg);
  position:relative;overflow:hidden;
}
.wa-bar::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 0% 50%,rgba(37,211,102,.16),transparent 55%);
}

/* --- Footer skin --- */
.wa-bar.dark{
  margin:44px 0 0;
  background:linear-gradient(135deg,rgba(37,211,102,.14),rgba(37,211,102,.05));
  border:1px solid rgba(37,211,102,.3);
}
.wa-bar.dark h3{color:#fff}
.wa-bar.dark p{color:rgba(255,255,255,.72)}

/* --- Homepage skin --- */
.wa-bar.light{
  background:#fff;
  border:1px solid rgba(37,211,102,.35);
  box-shadow:0 14px 40px rgba(37,211,102,.14);
}
.wa-bar.light h3{color:var(--sea-deep)}
.wa-bar.light p{color:var(--muted)}

.wa-icon{
  flex:0 0 auto;width:54px;height:54px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;line-height:0;
  background:#25D366;color:#fff;
  box-shadow:0 8px 22px rgba(37,211,102,.35);
  position:relative;z-index:1;
}
.wa-icon svg{width:48%;height:48%;display:block}
.wa-copy{flex:1;min-width:0;position:relative;z-index:1}
.wa-eyebrow{
  display:inline-block;font-size:.64rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.12em;color:#1fa751;margin-bottom:4px;
}
.wa-bar.dark .wa-eyebrow{color:#25D366}
.wa-bar h3{margin:0 0 4px;font-size:1.18rem;line-height:1.3}
.wa-bar p{margin:0;font-size:.9rem;line-height:1.55;max-width:62ch}

.wa-btn{
  flex:0 0 auto;position:relative;z-index:1;
  display:inline-flex;align-items:center;gap:6px;
  background:#25D366;color:#fff;font-weight:800;font-size:.95rem;
  padding:14px 26px;border-radius:999px;white-space:nowrap;
  box-shadow:0 8px 22px rgba(37,211,102,.3);
  transition:transform .22s cubic-bezier(.16,1,.3,1),box-shadow .22s,background .22s;
}
.wa-btn:hover{
  background:#1fb857;color:#fff;transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(37,211,102,.42);
}

@media(max-width:820px){
  .wa-bar{flex-direction:column;align-items:flex-start;gap:16px;padding:24px}
  .wa-bar p{max-width:none}
  .wa-btn{width:100%;justify-content:center}
}

/* Quiet pass-calculator link, replacing the old price-led CTA card (1.39.0) */
.pass-calc-link{
  text-align:center;margin:34px 0 0;font-size:.95rem;
  color:rgba(255,255,255,.72);
}
.pass-calc-link a{
  color:var(--sun);font-weight:800;text-decoration:underline;
  text-underline-offset:3px;text-decoration-thickness:1.5px;white-space:nowrap;
}
.pass-calc-link a:hover{color:#fff}

/* ============================================================
   FOOTER ON MOBILE (1.40.0)
   The footer grid had NO mobile rule at all, so a 400px phone still got
   1.6fr 1fr 1fr - three columns squeezed to about 90px each, which is why
   the text was wrapping one word per line.
   ============================================================ */
@media(max-width:900px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:36px}
}
@media(max-width:720px){
  /* One widget per row, each the full width of the screen. */
  .footer-grid{grid-template-columns:1fr;gap:34px;margin-bottom:36px}
  .footer-widget{max-width:none}
  .footer-widget h4{margin-bottom:10px}
  .footer-widget p,.footer-widget li{max-width:none}

  /* Widgets ticked "Hide on mobile" in Appearance > Widgets */
  .footer-widget.dbr-hide-mobile{display:none}

  /* The footer brand/logo column reads better centred once stacked */
  .footer-brand{text-align:left}
  .footer-bottom{flex-direction:column;gap:10px;text-align:center}
}

/* The "bits people get caught out by" note is small print, so set it as small print (1.42.0) */
.pass-note{
  font-size:.84rem;line-height:1.6;padding:16px 20px;
  border-radius:0 10px 10px 0;
}
.pass-note strong{font-weight:800}

/* ============================================================
   HOW TO FIND US (1.45.0)
   ============================================================ */
.find-essentials{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:26px;align-items:start;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:32px 34px;box-shadow:var(--shadow-sm);
}
.fe-label{
  display:block;font-size:.68rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.1em;color:var(--coral-deep);margin-bottom:8px;
}
.fe-value{margin:0;font-size:1.02rem;line-height:1.6;color:var(--ink);font-weight:600}
.fe-value.big{
  font-family:var(--font-display);font-size:1.7rem;letter-spacing:.02em;
  color:var(--sea-deep);font-weight:800;
}
.fe-value a{color:var(--sea);font-weight:800;text-decoration:underline;text-underline-offset:3px}
.fe-cta{display:flex;align-items:center}
.fe-cta .btn{width:100%;justify-content:center}

.find-warn{
  display:flex;gap:14px;align-items:flex-start;
  margin-top:20px;padding:18px 22px;
  background:var(--sand);border-left:4px solid var(--sun);
  border-radius:0 12px 12px 0;
}
.find-warn .fw-icon{font-size:1.3rem;line-height:1.4;flex:0 0 auto}
.find-warn p{margin:0;font-size:.9rem;line-height:1.65;color:#7a5a12}
.find-warn strong{color:#5c430b}

.find-routes{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}
.find-route{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:26px 28px;box-shadow:var(--shadow-sm);
}
.find-route h3{font-size:1.1rem;margin:0 0 .5rem;color:var(--sea-deep)}
.find-route p{margin:0;color:var(--muted);font-size:.94rem;line-height:1.7}

.find-transport{display:grid;gap:22px;align-items:start}

/* One card: do not let it run the full width of the page. */
.find-transport.count-1{grid-template-columns:1fr;max-width:720px;margin:0 auto}

/* Two cards: side by side. */
.find-transport.count-2{grid-template-columns:1fr 1fr}

/* Three: the long one takes a wide left column, the two short ones stack beside it.
   Balances the heights instead of stretching all three to match the tallest. */
.find-transport.count-3{grid-template-columns:1.4fr 1fr}
.find-transport.count-3 .find-tcard.is-lead{grid-row:span 2}

.find-tcard{
  background:var(--shell);border-radius:var(--radius);padding:26px 28px;
  border:1px solid var(--line);
}
.find-tcard.is-lead{
  background:#fff;box-shadow:var(--shadow-sm);
  border-color:var(--sea-light);
}
.find-tcard h3{font-size:1.05rem;margin:0 0 .45rem;color:var(--sea-deep)}
.find-tcard p{margin:0;color:var(--muted);font-size:.93rem;line-height:1.7}

.find-times{
  display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-bottom:34px;
}
.ft-item{
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);
  border-radius:14px;padding:16px 30px;text-align:center;min-width:190px;
}
.ft-label{
  display:block;font-size:.68rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.1em;color:var(--sun);margin-bottom:5px;
}
.ft-value{display:block;color:#fff;font-weight:700;font-size:1.02rem}

.find-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.find-step{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);
  border-radius:var(--radius);padding:24px 26px;
}
.fs-num{
  display:grid;place-items:center;width:34px;height:34px;border-radius:50%;
  background:var(--sun);color:#5c430b;font-weight:800;font-size:.95rem;margin-bottom:12px;
}
.find-step p{margin:0;color:rgba(255,255,255,.88);font-size:.94rem;line-height:1.7}

/* Hero with no image set: a proper branded gradient, NOT the placeholder image
   with its label baked in (which is what dbr_img() hands back, and which looks
   broken stretched across a full-width banner). */
.find-hero.no-img{
  background:
    radial-gradient(circle at 18% 22%,rgba(255,209,102,.16),transparent 46%),
    radial-gradient(circle at 84% 78%,rgba(94,201,203,.20),transparent 52%),
    linear-gradient(150deg,var(--teal) 0%,var(--sea-deep) 62%,#07293a 100%);
}
.find-hero.no-img::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse at 50% 40%,#000 20%,transparent 78%);
  -webkit-mask-image:radial-gradient(ellipse at 50% 40%,#000 20%,transparent 78%);
}
.find-hero{position:relative;isolation:isolate}
.find-hero .wrap{position:relative;z-index:1}

.find-top{padding-bottom:80px}
.find-map{
  border-radius:var(--radius-lg);overflow:hidden;
  box-shadow:var(--shadow);border:1px solid var(--line);line-height:0;
  position:relative;z-index:0;
}
.find-map iframe{display:block}

/* The essentials card lifts over the bottom of the map */
.find-essentials.overlap{
  position:relative;z-index:2;
  width:calc(100% - 64px);margin:-58px auto 0;
  box-shadow:0 22px 50px rgba(13,59,79,.16);
}

.find-extra{
  max-width:760px;margin:0 auto;text-align:center;
}
.find-extra h3{color:var(--sea-deep);margin:0 0 .6rem}
.find-extra p{margin:0;color:var(--muted);line-height:1.75}

@media(max-width:900px){
  .find-transport.count-2,
  .find-transport.count-3{grid-template-columns:1fr}
  .find-transport.count-3 .find-tcard.is-lead{grid-row:auto}
}
@media(max-width:720px){
  .find-essentials{padding:26px 24px;gap:22px}
  .find-essentials.overlap{width:100%;margin:-28px auto 0}
  .find-map iframe{height:320px}
  .fe-value.big{font-size:1.45rem}
  .find-times{flex-direction:column}
  .ft-item{min-width:0}
}

/* Route card sub-heading (1.47.0) */
.find-route h3{margin-bottom:.15rem}
.find-route .fr-sub{
  margin:0 0 .85rem;font-size:.78rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.07em;
  color:var(--coral-deep);line-height:1.45;
}

/* ============================================================
   HEADER STRAPLINE (1.49.0)
   currentColor + opacity, so it follows the brand colour in both header
   states (white over the hero, dark once scrolled) with no extra rules.
   ============================================================ */
.brand-text{
  display:flex;flex-direction:column;justify-content:center;
  line-height:1.15;min-width:0;
}
.brand-name{display:block}
.brand-tag{
  display:block;font-family:var(--font-body);
  font-size:.66rem;font-weight:700;letter-spacing:.055em;
  text-transform:uppercase;color:currentColor;opacity:.72;
  margin-top:3px;white-space:nowrap;
}
.site-header.over-hero:not(.scrolled) .brand-tag{opacity:.85}

@media(max-width:1100px){
  .brand-tag{white-space:normal}
}
/* No room for it next to a burger menu on a phone. */
@media(max-width:820px){
  .brand-tag{display:none}
}

/* Centred variant of the closing CTA panel (1.51.0).
   The base .post-cta is a text-left / button-right row, which is right for the
   blog posts. This variant stacks and centres everything, including the button. */
.post-cta.centred{
  flex-direction:column;align-items:center;text-align:center;
  gap:20px;max-width:780px;padding:38px 40px;
}
.post-cta.centred h3{font-size:1.5rem;margin-bottom:.5rem}
.post-cta.centred p{max-width:56ch;margin:0 auto;line-height:1.7;font-size:1rem}
.post-cta.centred .btn{min-width:220px;justify-content:center}

@media(max-width:600px){
  .post-cta.centred{padding:30px 24px}
  .post-cta.centred .btn{width:100%;min-width:0}
}

/* ============================================================
   SOCIAL LINKS (1.52.0)
   ============================================================ */
/* NOTE ON THE SELECTORS.
   These are written as `.social-row .soc` / `.social-dock .soc` rather than a bare
   `.soc` on purpose. The footer has:

       .site-footer a { display:block; padding:4px 0; color:rgba(255,255,255,.78) }

   which at (0,1,1) is MORE SPECIFIC than a bare `.soc` at (0,1,0). It was quietly
   turning the icon anchors back into blocks with padding, so the centring never
   applied and the glyph sat in the top-left corner. Two class names puts these at
   (0,2,0) and settles it, rather than relying on source order or !important. */
.social-row .soc,
.social-dock .soc{
  display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:50%;
  padding:0;line-height:0;
  transition:transform .22s cubic-bezier(.16,1,.3,1),background .22s,color .22s;
}
/* Sized as a proportion of the circle, so the glyph sits identically whether the
   circle is 38px, 44px or 54px. */
.social-row .soc svg,
.social-dock .soc svg{display:block;width:46%;height:46%}

/* Brand colours defined ONCE, so the dock, the footer row and the mobile menu row
   cannot drift apart. */
.social-row .soc-whatsapp,
.social-dock .soc-whatsapp{background:#25D366;color:#fff}
.social-row .soc-instagram,
.social-dock .soc-instagram{
  background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
  color:#fff;
}
.social-row .soc-tiktok,
.social-dock .soc-tiktok{background:#010101;color:#fff}

/* --- The floating dock: DESKTOP ONLY ---
   Cream pill, so the real brand colours can sit on it without fighting. The whole
   site palette is teal (--ink, --sea-deep and --teal are all greens), so putting
   WhatsApp green on a teal pill muddied both. --- */
.social-dock{
  position:fixed;left:22px;bottom:22px;z-index:900;
  display:flex;align-items:center;gap:11px;
  padding:8px 12px 8px 18px;border-radius:999px;
  /* Half-transparent, with a blur behind it so the label stays readable over a
     photo. Safe here: backdrop-filter creates a containing block for FIXED
     descendants, and the dock has none (the tooltips are absolute, and the dock
     itself is a direct child of body). */
  background:rgba(255,253,246,.5);
  backdrop-filter:blur(12px) saturate(1.35);
  -webkit-backdrop-filter:blur(12px) saturate(1.35);
  border:1px solid rgba(255,255,255,.35);
  box-shadow:0 14px 38px rgba(13,59,79,.22);
  transform:translateX(-140%);opacity:0;
  transition:transform .6s cubic-bezier(.16,1,.3,1),opacity .5s;
}
.social-dock.in{transform:none;opacity:1}
.social-dock.out{transform:translateX(-140%);opacity:0;pointer-events:none}

.sd-label{
  font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;
  color:var(--sea-deep);white-space:nowrap;
  text-shadow:0 1px 2px rgba(255,255,255,.6);
}
.sd-links{display:flex;align-items:center;gap:7px}

.social-dock .soc{
  width:38px;height:38px;position:relative;
  box-shadow:0 3px 10px rgba(0,0,0,.14);
}
.social-dock .soc:hover{transform:translateY(-3px)}

/* Tooltip above, since the dock is horizontal */
.sd-tip{
  position:absolute;bottom:48px;left:50%;transform:translateX(-50%) translateY(6px);
  background:var(--ink);color:#fff;font-size:.72rem;font-weight:700;
  padding:6px 11px;border-radius:8px;white-space:nowrap;
  opacity:0;pointer-events:none;transition:.22s;
}
.social-dock .soc:hover .sd-tip{opacity:1;transform:translateX(-50%)}

.sd-close{
  width:20px;height:20px;flex:0 0 auto;border-radius:50%;
  border:none;cursor:pointer;
  background:transparent;color:var(--muted);
  font-size:14px;line-height:1;display:grid;place-items:center;
  transition:background .2s,color .2s,transform .2s;
  font-family:inherit;padding:0;margin-left:1px;opacity:.65;
}
.sd-close:hover{background:rgba(13,79,74,.09);color:var(--ink);opacity:1;transform:rotate(90deg)}

/* THE DOCK NEVER APPEARS ON A PHONE. A fixed widget in the corner of a 380px
   screen sits on top of the content, and on the booking page that means sitting
   on top of the form. The icons live in the menu and the footer instead. */
@media(max-width:900px){
  .social-dock{display:none}
}

/* --- Inline rows --- */
.social-row{display:flex;gap:10px;align-items:center}

/* In the mobile menu panel: hidden on desktop, where the dock does the job */
.social-row.in-nav{display:none}
@media(max-width:900px){
  .social-row.in-nav{
    display:flex;margin-top:26px;padding-top:22px;
    border-top:1px solid rgba(255,255,255,.15);
  }
  .social-row.in-nav .soc:active{transform:scale(.94)}
}

/* In the footer: on every screen size */
.social-row.in-footer{
  justify-content:center;margin:34px 0 0;padding-top:26px;
  border-top:1px solid rgba(255,255,255,.12);
}
/* TikTok black on a dark green footer would read as a hole, so it keeps the
   brand black but gains a thin light ring to lift it off the background. */
.social-row.in-footer .soc-tiktok,
.social-row.in-nav .soc-tiktok{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.social-row.in-footer .soc:hover{transform:translateY(-3px);filter:brightness(1.1)}

@media(prefers-reduced-motion:reduce){
  .social-dock{transition:opacity .3s}
  .soc{transition:background .2s,color .2s}
}

/* ============================================================
   PARK MAP (1.57.0)
   ============================================================ */
.park-map{
  display:block;position:relative;isolation:isolate;
  border-radius:var(--radius-lg);overflow:hidden;
  background:#fff;border:1px solid var(--line);
  box-shadow:var(--shadow);line-height:0;
  transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s;
}
.park-map img{width:100%;height:auto;display:block}
a.park-map:hover{transform:translateY(-3px);box-shadow:0 22px 50px rgba(13,59,79,.22)}

/* Top-left hint, so the map reads as clickable before you reach the badge */
.pm-hint{
  position:absolute;left:16px;top:16px;z-index:2;
  display:inline-flex;align-items:center;gap:7px;
  background:rgba(255,255,255,.94);color:var(--sea-deep);
  font-size:.78rem;font-weight:800;line-height:1;
  padding:9px 14px;border-radius:999px;
  box-shadow:0 4px 14px rgba(13,59,79,.18);
  transition:background .25s,color .25s;
}
a.park-map:hover .pm-hint{background:var(--sea-deep);color:#fff}

.pm-note{
  margin:14px 0 0;text-align:center;
  font-size:.86rem;color:var(--muted);
}

.pm-badge{
  position:absolute;right:16px;bottom:16px;z-index:2;
  display:inline-flex;align-items:center;gap:8px;
  background:var(--sea-deep);color:#fff;
  font-size:.86rem;font-weight:800;line-height:1;
  padding:12px 18px;border-radius:999px;
  box-shadow:0 8px 24px rgba(13,59,79,.35);
  transition:background .25s,transform .25s;
}
a.park-map:hover .pm-badge{background:var(--coral);transform:scale(1.03)}
.pm-badge svg{flex:0 0 auto}

@media(max-width:720px){
  .pm-hint{left:10px;top:10px;font-size:.72rem;padding:8px 12px}
  .pm-badge{
    left:12px;right:12px;bottom:12px;justify-content:center;
    font-size:.8rem;padding:12px 14px;
  }
}

/* Stripe card button (1.62.0). Stripe's own indigo so it reads as a distinct
   payment route from the teal bank button, not a duplicate of it. */
.pay-option.card{text-align:center;margin-bottom:6px}
.btn.pay-card{
  width:100%;justify-content:center;background:#635bff;
  box-shadow:0 8px 24px rgba(99,91,255,.3);font-size:1.05rem;padding:17px 32px;
}
.btn.pay-card:hover{background:#5248f0}
.btn.pay-card:disabled{opacity:.6;cursor:wait}
.btn.pay-card .ic{font-size:1.15rem}

/* Bank transfer (1.64.0) */
.pay-option.bank{text-align:center;margin-bottom:6px}
.btn.pay-bank{
  width:100%;justify-content:center;background:var(--teal);
  box-shadow:0 8px 24px rgba(38,204,194,.28);font-size:1.05rem;padding:17px 32px;
}
.btn.pay-bank:hover{background:var(--sea)}
.btn.pay-bank .ic{font-size:1.15rem}

.bank-panel{
  margin-top:16px;padding:22px;text-align:left;
  background:var(--shell);border:1px solid var(--line);border-radius:var(--radius);
}
.bank-lead{margin:0 0 14px;font-weight:600;color:var(--ink)}
.bank-details{
  background:#fff;border:1px dashed var(--sea);border-radius:10px;
  padding:16px 18px;font-size:1rem;line-height:1.9;color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.bank-ref{margin:14px 0 18px;font-size:.92rem;color:var(--muted)}
.bank-ref strong{color:var(--sea-deep)}
.bank-amounts{display:flex;flex-direction:column;gap:10px}
.btn.bank-paid{
  width:100%;justify-content:center;background:var(--sea-deep);
  font-size:1rem;padding:15px 24px;
}
.btn.bank-paid:hover{background:var(--sea)}
.btn.bank-paid.alt{background:transparent;color:var(--sea-deep);box-shadow:inset 0 0 0 2px var(--sea-deep)}
.btn.bank-paid.alt:hover{background:var(--sea-deep);color:#fff}
.btn.bank-paid:disabled{opacity:.6;cursor:wait}

.bank-thanks{text-align:center;padding:20px 10px}
.bank-thanks h3{margin:.4rem 0 .8rem;color:var(--sea-deep)}
.bank-thanks p{margin:0 auto .8rem;max-width:44ch;line-height:1.7;color:var(--muted)}
.bank-thanks-rush{
  font-weight:600;color:var(--ink);
  background:var(--sand);border-radius:10px;padding:12px 16px;
}