:root{
  --ink:#15303c;
  --ink-soft:#4a6572;
  --sea:#0e7490;
  --sea-deep:#155e75;
  --sand:#f7f3ec;
  --sand-deep:#efe7d9;
  --coral:#e0653a;
  --coral-deep:#c8532b;
  --white:#ffffff;
  --radius:14px;
  --shadow:0 10px 30px rgba(21,48,60,.12);
  --font-display:"Bricolage Grotesque",-apple-system,BlinkMacSystemFont,sans-serif;
  --font-body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);color:var(--ink);background:var(--white);line-height:1.6}
img{max-width:100%;display:block;height:auto}
h1,h2,h3{font-family:var(--font-display);font-weight:700;line-height:1.05;letter-spacing:-.025em;font-optical-sizing:auto}
h1{font-size:clamp(2.4rem,6vw,4.2rem);font-weight:750;letter-spacing:-.03em}
h1 em{font-style:normal;color:#fcd9a8}
h2{font-size:clamp(1.7rem,3.5vw,2.5rem);margin-bottom:.75rem}
a{color:var(--sea-deep)}

/* nav */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;background:rgba(21,48,60,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.nav-inner{max-width:1120px;margin:0 auto;padding:.8rem 1.25rem;display:flex;align-items:center;justify-content:space-between}
.brand{display:inline-flex;align-items:center;text-decoration:none}
.brand-logo{height:54px;width:auto;display:block}
@media(max-width:720px){.brand-logo{height:44px}}
.nav nav{display:flex;gap:1.4rem;align-items:center}
/* min-height keeps nav links above the 24px WCAG 2.2 target floor */
.nav nav a{display:inline-flex;align-items:center;min-height:32px;color:#fff;text-decoration:none;font-size:.92rem;opacity:.9}
.nav nav a:hover{opacity:1}
.nav-actions{display:flex;align-items:center;gap:.6rem}
.nav-cta{background:var(--coral);color:#fff;border:0;padding:.6rem 1.15rem;min-height:40px;border-radius:999px;opacity:1!important;font-weight:600;font-family:inherit;font-size:.92rem;cursor:pointer}
.nav-cta:hover{background:var(--coral-deep)}
.nav-cta:focus-visible,.nav-toggle:focus-visible{outline:2px solid #fff;outline-offset:2px}
.nav-toggle{display:none;width:42px;height:42px;place-items:center;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:10px;cursor:pointer}
.nav-toggle-bars,.nav-toggle-bars::before,.nav-toggle-bars::after{display:block;width:18px;height:2px;background:#fff;border-radius:2px;content:""}
.nav-toggle-bars{position:relative}
.nav-toggle-bars::before{position:absolute;top:-6px}
.nav-toggle-bars::after{position:absolute;top:6px}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@media(max-width:720px){
  .nav-toggle{display:grid}
  /* collapsed into a panel rather than removed, so the links stay reachable */
  /* solid, not rgba: the parent .nav's backdrop-filter creates a stacking
     context that lets a translucent panel read the hero through it */
  .nav nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:.4rem .9rem .8rem;background:var(--ink);box-shadow:0 12px 24px rgba(10,32,42,.35);display:none}
  .nav nav.is-open{display:flex}
  .nav nav a{min-height:48px;padding:0 .3rem;border-bottom:1px solid rgba(255,255,255,.1);font-size:1rem}
  .nav nav a:last-child{border-bottom:0}
}

/* hero */
.hero{position:relative;min-height:92vh;display:flex;align-items:center;justify-content:center;text-align:center;overflow:hidden}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(21,48,60,.45),rgba(21,48,60,.25) 45%,rgba(21,48,60,.65))}
.hero-content{position:relative;color:#fff;max-width:820px;padding:6.5rem 1.25rem 3.5rem;width:100%}
.hero-kicker{text-transform:uppercase;letter-spacing:.22em;font-size:.8rem;margin-bottom:1rem;color:#fcd9a8}
.hero-sub{margin:1.2rem auto 0;max-width:620px;font-size:1.05rem;opacity:.95}

/* buttons */
.btn{display:inline-block;padding:.85rem 1.7rem;border-radius:999px;text-decoration:none;text-align:center;font-weight:650;font-size:1rem;border:none;cursor:pointer;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--coral);color:#fff}
.btn-primary:hover{background:var(--coral-deep)}
.btn-ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.7)}
.btn-secondary{background:var(--sea);color:#fff}
.btn-block{width:100%}
.btn[disabled]{opacity:.6;cursor:default;transform:none}

/* strip */
.strip{background:var(--ink);color:#fff}
.strip-inner{max-width:1120px;margin:0 auto;padding:1.1rem 1.25rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;text-align:center}
.strip strong{display:block;font-size:.95rem}
.strip span{font-size:.8rem;opacity:.75}

/* sections */
.section{padding:5rem 0}
.section-alt{background:var(--sand)}
.section-inner{max-width:1120px;margin:0 auto;padding:0 1.25rem}
.section-inner.narrow{max-width:760px}
.kicker{text-transform:uppercase;letter-spacing:.2em;font-size:.78rem;color:var(--coral);font-weight:700;margin-bottom:.6rem}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}
@media(max-width:820px){.two-col{grid-template-columns:1fr}}
.two-col figure img{border-radius:var(--radius);box-shadow:var(--shadow)}
.two-col figcaption{font-size:.82rem;color:var(--ink-soft);margin-top:.5rem;text-align:center}
.two-col p{margin-bottom:1rem;color:var(--ink-soft)}

/* gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:.75rem;margin-top:2rem}
.gallery-grid figure{border-radius:10px;overflow:hidden;cursor:zoom-in;aspect-ratio:4/3}
.gallery-grid figure.wide{grid-column:span 2;aspect-ratio:8/3.05}
@media(max-width:560px){.gallery-grid figure.wide{grid-column:span 1;aspect-ratio:4/3}}
.gallery-grid img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.gallery-grid figure:hover img{transform:scale(1.04)}

/* amenities */
.amenity-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1.5rem;margin-top:2rem}
.amenity-grid h3{font-size:1.05rem;margin-bottom:.35rem;font-family:var(--font-body);font-weight:700}
.amenity-grid p{font-size:.92rem;color:var(--ink-soft)}

/* gallery CTA + /gallery/ page */
.gallery-cta{margin-top:2rem;text-align:center}
.gal-page{padding-top:calc(70px + 3rem)}
.gal-title{font-size:clamp(1.9rem,4vw,2.6rem);margin:.3rem 0 .5rem}
.gal-lede{color:var(--ink-soft);max-width:62ch;margin-bottom:2.25rem}
.gal-group{font-family:var(--font-display);font-size:1.15rem;margin:2.5rem 0 .9rem;
  padding-bottom:.5rem;border-bottom:1px solid var(--sand-deep)}
.gal-group:first-of-type{margin-top:.5rem}
/* thumbnails are a fixed 3:2 so the page height is stable while they lazy-load */
.gal-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));margin-top:0}
.gal-grid figure{aspect-ratio:3/2}

/* location */
.loc-list{list-style:none;margin:1rem 0 1.6rem;display:grid;gap:.5rem;color:var(--ink-soft)}
.loc-list li::before{content:"›";color:var(--coral);font-weight:700;margin-right:.5rem}

/* maps — Google embeds (Leaflet removed 2026-07-27; the homepage and
   /planyouradventure/ both use a keyless google.com/maps?…&output=embed
   iframe, so there is no map library, no API key, and no pin styling). */
.loc-map-wrap{margin-top:2.6rem}
.loc-gmap{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);line-height:0}
.loc-gmap iframe{width:100%;height:440px;border:0;display:block}
@media(max-width:560px){.loc-gmap iframe{height:340px}}
.itin-map-block{margin:2rem 0}
.itin-map-block h3{font-size:1.35rem;margin-bottom:.3rem}
.pop-day{color:var(--coral);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.7rem}
.pop-when{color:var(--ink-soft);font-size:.78rem}

/* booking — glass panel in the hero */
.booking-copy-p{color:var(--ink-soft);margin-bottom:1rem}
.booking-card{margin:2.2rem auto 0;max-width:410px;text-align:left;background:rgba(21,48,60,.32);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border:1px solid rgba(255,255,255,.28);border-radius:20px;box-shadow:0 18px 48px rgba(12,25,31,.35);padding:1.35rem 1.35rem 1.1rem;display:grid;gap:.8rem;color:#fff}
.rate-line{display:flex;align-items:baseline;gap:.35rem}
.rate-from{color:rgba(255,255,255,.75);font-size:.9rem}
.rate{font-size:1.7rem;font-weight:700;font-family:var(--font-display);letter-spacing:-.02em}
.rate-unit{color:rgba(255,255,255,.75)}
.min-chip{margin-left:auto;font-size:.72rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:.2rem .65rem;color:rgba(255,255,255,.85)}
.book-direct-tag{color:#4cc98a;font-size:.8rem;font-weight:750;text-transform:uppercase;letter-spacing:.14em;margin-bottom:-.5rem}
.panel-rating{color:#fcd9a8;text-decoration:none;font-size:.85rem;font-weight:650;margin-top:-.3rem}
.panel-rating:hover{text-decoration:underline}

/* local weather */
.weather{background:linear-gradient(155deg,var(--sea-deep),var(--ink) 70%);color:#fff}
.weather h2{color:#fff}
.weather .kicker{color:#fcd9a8}
.wx-fallback{color:rgba(255,255,255,.8);max-width:620px}
.wx-live{display:grid;gap:1.6rem;margin-top:1.6rem}
.wx-now{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap}
.wx-icon{font-size:3.4rem;line-height:1}
.wx-reading{display:grid}
.wx-temp{font-family:var(--font-display);font-weight:750;font-size:3rem;line-height:1;letter-spacing:-.03em}
.wx-label{font-weight:650;margin-top:.2rem}
.wx-feels{font-size:.85rem;color:rgba(255,255,255,.7)}
.wx-meta{display:flex;gap:1.8rem;margin-left:auto;flex-wrap:wrap}
.wx-meta div{display:grid;text-align:center}
.wx-meta span{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,.65)}
.wx-meta strong{font-size:1.15rem;font-variant-numeric:tabular-nums}
@media(max-width:700px){.wx-meta{margin-left:0}}
.wx-days{display:grid;grid-template-columns:repeat(7,1fr);gap:.6rem}
@media(max-width:700px){.wx-days{grid-template-columns:repeat(4,1fr)}.wx-day:nth-child(n+5){display:none}}
.wx-day{display:grid;justify-items:center;gap:.15rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:.8rem .4rem}
.wx-day-name{font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.75)}
.wx-day-icon{font-size:1.5rem}
.wx-day-hi{font-weight:750;font-variant-numeric:tabular-nums}
.wx-day-lo{font-size:.82rem;color:rgba(255,255,255,.6);font-variant-numeric:tabular-nums}
.wx-day-rain{font-size:.7rem;color:#9adcf0;min-height:1em}
.weather .fineprint{color:rgba(255,255,255,.55)}

/* guest review scores */
.score-big{color:var(--coral)}
.score-grid{display:grid;gap:.9rem;align-self:center}
.score-row{display:grid;grid-template-columns:120px 1fr 44px;align-items:center;gap:.9rem;font-size:.92rem;color:var(--ink-soft)}
.score-row strong{text-align:right;color:var(--ink);font-variant-numeric:tabular-nums}
.score-track{height:8px;border-radius:999px;background:var(--sand-deep);overflow:hidden}
.score-track i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--sea),var(--sea-deep))}
.form-msg{font-size:.85rem;padding:.55rem .75rem;border-radius:9px;background:rgba(224,101,58,.25);border:1px solid rgba(224,101,58,.5);color:#ffd9c7}
.form-msg.ok{background:rgba(46,160,103,.25);border-color:rgba(46,160,103,.5);color:#c9f0da}
.booking-card .fineprint{color:rgba(255,255,255,.65)}

.fineprint{font-size:.76rem;color:var(--ink-soft);opacity:.85}
.fineprint.center{text-align:center}

/* faq */
#faq details{border-bottom:1px solid var(--sand-deep);padding:1rem 0}
#faq summary{cursor:pointer;font-weight:650;font-size:1.02rem;list-style:none;display:flex;justify-content:space-between;align-items:center}
#faq summary::after{content:"+";color:var(--coral);font-size:1.3rem;font-weight:400}
#faq details[open] summary::after{content:"–"}
#faq details p{margin-top:.6rem;color:var(--ink-soft);font-size:.95rem}

/* final cta */
.final-cta{background:linear-gradient(160deg,var(--sea-deep),var(--ink));color:#fff;padding:5rem 0;text-align:center}
.final-cta p{opacity:.85;max-width:520px;margin:0 auto 1.8rem}
.center{text-align:center}

/* footer */
.footer{background:var(--ink);color:#c8d6dc;padding:2.5rem 0;text-align:center;font-size:.9rem}
.footer a{color:#fcd9a8}
.footer p{margin-bottom:.4rem}
/* prominent, tap-to-call phone line in the footer */
.footer-phone{margin:.5rem 0 .35rem!important}
.footer-phone a{display:inline-block;font-family:var(--font-display);font-size:1.5rem;font-weight:700;letter-spacing:-.01em;line-height:1.2;color:#fff!important;text-decoration:none;min-height:44px}
.footer-phone a:hover{color:#fcd9a8!important}

/* lightbox */
.lightbox{position:fixed;inset:0;z-index:100;background:rgba(12,25,31,.94);display:flex;align-items:center;justify-content:center;padding:2rem}
.lightbox img{max-width:min(1100px,100%);max-height:82vh;border-radius:8px}
.lb-close{position:absolute;top:1rem;right:1.4rem;background:none;border:none;color:#fff;font-size:2.4rem;cursor:pointer;line-height:1}
/* paging controls — 44px targets, kept clear of the image on phones */
.lb-prev,.lb-next{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;border:none;border-radius:50%;
  background:rgba(255,255,255,.12);color:#fff;font-size:2rem;line-height:1;cursor:pointer;
  transition:background .15s}
.lb-prev:hover,.lb-next:hover{background:rgba(255,255,255,.24)}
.lb-prev{left:1rem}
.lb-next{right:1rem}
.lb-caption{position:absolute;left:50%;transform:translateX(-50%);bottom:3.1rem;margin:0;
  max-width:min(880px,88vw);text-align:center;color:rgba(255,255,255,.85);font-size:.88rem;line-height:1.4}
.lb-count{position:absolute;left:50%;transform:translateX(-50%);bottom:1.2rem;margin:0;
  color:rgba(255,255,255,.6);font-size:.8rem;letter-spacing:.06em}
@media(max-width:560px){
  .lightbox{padding:1rem}
  .lb-prev,.lb-next{width:44px;height:44px;background:rgba(255,255,255,.16)}
  .lb-prev{left:.4rem} .lb-next{right:.4rem}
  .lb-caption{font-size:.8rem;bottom:2.9rem}
}
.lightbox figure,#galleryGrid figure,.zoomable{outline-offset:3px}

/* shared lede (itinerary deals section) */
.compare-lede{color:var(--ink-soft);max-width:680px;margin-bottom:2rem}
.cta-row{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap}

/* itinerary page */
.page-head{background:linear-gradient(160deg,var(--sea-deep),var(--ink));color:#fff;padding:8.5rem 0 3.5rem;text-align:center}
.page-head .kicker{color:#fcd9a8}
.page-head p{max-width:640px;margin:1rem auto 0;opacity:.9}
.itin-controls{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin:2.2rem auto 0;max-width:720px}
.itin-controls label{display:grid;gap:.35rem;font-size:.8rem;font-weight:650;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.85);text-align:left}
.itin-controls select{padding:.65rem .9rem;border-radius:10px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.12);color:#fff;font-family:inherit;font-size:.95rem;min-width:180px}
.itin-controls select option{color:var(--ink)}
.itin-controls .btn{align-self:end}
.itin-days{display:grid;gap:1.2rem;margin-top:2.2rem}
.itin-day{background:var(--white);border:1px solid var(--sand-deep);border-radius:var(--radius);padding:1.4rem 1.6rem;box-shadow:0 4px 16px rgba(21,48,60,.06)}
.itin-day h3{font-size:1.2rem;margin-bottom:.9rem;display:flex;align-items:baseline;gap:.7rem}
.itin-day h3 .day-num{color:var(--coral);font-size:.8rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.itin-slot{display:grid;grid-template-columns:92px 1fr;gap:1rem;padding:.65rem 0;border-top:1px dashed var(--sand-deep)}
.itin-slot:first-of-type{border-top:none}
.itin-slot em{font-style:normal;font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--sea);padding-top:.15rem}
.itin-slot strong{display:block;font-size:.98rem}
.itin-slot p{font-size:.9rem;color:var(--ink-soft);margin-top:.15rem}
.deal-chip{display:inline-flex;align-items:center;gap:.4rem;margin-top:.5rem;background:rgba(224,101,58,.09);border:1px dashed var(--coral);color:var(--coral-deep);font-size:.8rem;font-weight:650;border-radius:9px;padding:.35rem .7rem}
.deal-chip .lim{background:var(--coral);color:#fff;font-size:.64rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:.12rem .5rem}
.perk-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-top:1.8rem}
.perk-card{background:var(--white);border:1px solid var(--sand-deep);border-radius:12px;padding:1.1rem 1.2rem}
.perk-card h3{font-size:1rem;font-family:var(--font-body);font-weight:700;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.perk-card p{font-size:.88rem;color:var(--ink-soft);margin-top:.35rem}
.perk-card .lim{background:var(--coral);color:#fff;font-size:.64rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:.15rem .55rem}
.itin-actions{display:flex;gap:.9rem;flex-wrap:wrap;margin-top:2rem;justify-content:center}
.itin-email{margin-top:2.5rem;background:var(--white);border:1px solid var(--sand-deep);border-radius:var(--radius);padding:1.6rem;text-align:center}
.itin-email h3{margin-bottom:.4rem}
.itin-email p{color:var(--ink-soft);font-size:.92rem;margin-bottom:1rem}
.itin-email form{display:flex;gap:.7rem;justify-content:center;flex-wrap:wrap}
.itin-email input{padding:.7rem 1rem;border:1px solid var(--sand-deep);border-radius:10px;font-family:inherit;font-size:.95rem;min-width:220px}
@media print{
  .nav,.page-head .itin-controls,.itin-actions,.itin-email,.final-cta,.footer{display:none!important}
  .page-head{padding:1rem 0;background:none;color:var(--ink)}
  .itin-day{box-shadow:none;break-inside:avoid}
}


/* guest review quotes */
.quote-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem;margin-top:3rem}
.guest-quote{background:var(--white);border:1px solid var(--sand-deep);border-radius:var(--radius);padding:1.3rem 1.4rem;box-shadow:0 4px 16px rgba(21,48,60,.05)}
.guest-quote blockquote{font-size:.95rem;line-height:1.55}
.guest-quote blockquote::before{content:"\201C";display:block;font-family:var(--font-display);font-size:2.2rem;color:var(--coral);line-height:.5;margin-bottom:.5rem}
.guest-quote figcaption{margin-top:.8rem;font-size:.8rem;font-weight:650;color:var(--ink-soft)}

/* contact / inquiry form */
/* Netlify honeypot: must stay hidden — if a real guest sees & fills it,
   Netlify flags their submission as spam. */
.hp-field{display:none!important}
.inquiry-form{display:grid;gap:.7rem;max-width:440px;margin:1.4rem auto 0;text-align:left}
.inquiry-form input,.inquiry-form textarea{width:100%;padding:.7rem 1rem;border:1px solid var(--sand-deep);border-radius:10px;font-family:inherit;font-size:.95rem}
.inquiry-form textarea{resize:vertical;min-height:110px}
.inquiry-msg{margin:1rem auto 0;max-width:440px;font-size:.9rem;padding:.55rem .75rem;border-radius:9px;background:rgba(46,160,103,.12);border:1px solid rgba(46,160,103,.4);color:#1d6b45}

/* savings — "book direct & save" price comparison (savings.js): two OTA
   cards (Vrbo/Airbnb, red-struck) + a green direct card. Lives inside the
   dark glass hero booking card, so it's styled for dark. */
.savings-band{margin:.2rem 0 0}
.sv-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;align-items:stretch}
.sv-tile{display:grid;gap:.1rem;justify-items:center;text-align:center;padding:.7rem .4rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:10px}
.sv-label{font-size:.62rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.72);line-height:1.3}
.sv-label i{font-style:normal;color:#7fe3ad}
.sv-amt{font-family:var(--font-display);font-size:1.22rem;font-weight:700;letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums;line-height:1.1}
.sv-unit{font-size:.6rem;color:rgba(255,255,255,.6);letter-spacing:.02em}
.sv-struck{text-decoration:line-through;text-decoration-color:#ff5a5a;text-decoration-thickness:2.5px;color:rgba(255,255,255,.55)}
.sv-direct{background:rgba(46,160,103,.22);border-color:rgba(127,227,173,.55)}
.sv-direct .sv-amt{color:#7fe3ad}
.sv-save{margin-top:.15rem;font-size:.6rem;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:#7fe3ad;line-height:1.2}
.sv-note{margin:.75rem 0 0;font-size:.74rem;line-height:1.5;color:rgba(255,255,255,.72)}
/* mid-page conversion points (gallery, reviews) — cheap now the widget is lazy */
.inline-cta{margin:1.6rem 0 0;text-align:center}

/* sticky booking bar — phones only (booking-modal.js toggles [hidden]) */
.sticky-book{display:none}
@media(max-width:720px){
  .sticky-book{position:fixed;left:0;right:0;bottom:0;z-index:45;display:flex;align-items:center;justify-content:space-between;gap:.6rem;
    padding:.7rem .8rem calc(.7rem + env(safe-area-inset-bottom));background:rgba(21,48,60,.97);
    border-top:1px solid rgba(255,255,255,.14);box-shadow:0 -6px 20px rgba(10,32,42,.28)}
  .sticky-book[hidden]{display:none}
  .sb-rate{color:#fff;font-size:.92rem;line-height:1.2;white-space:nowrap}
  .sb-rate b{font-family:var(--font-display);font-size:1.25rem;font-weight:700;letter-spacing:-.02em}
  .sb-from,.sb-unit{color:rgba(255,255,255,.7);font-size:.8rem}
  .sb-btn{flex:none;min-height:44px;padding:.6rem 1.15rem}
  .sb-actions{display:flex;align-items:center;gap:.5rem;flex:none}
  .sb-call{display:inline-flex;align-items:center;gap:.35rem;min-height:44px;padding:.6rem .8rem;
    border:1.5px solid rgba(255,255,255,.55);border-radius:10px;color:#fff;text-decoration:none;
    font-weight:700;font-size:.9rem;line-height:1}
  .sb-call svg{flex:none}
  .sb-call:active{background:rgba(255,255,255,.12)}
  /* keep the last section clear of the bar */
  .final-cta{padding-bottom:5.5rem}
}
/* tap targets: keep inline links at/above the 24px WCAG 2.2 floor */
.panel-rating{display:inline-flex;align-items:center;min-height:32px}
.footer a,.loc-list a,.two-col p a,details p a,.booking-copy-p a{display:inline-block;min-height:24px;line-height:24px}
@media(max-width:560px){.sv-cols{gap:.4rem}.sv-tile{padding:.6rem .25rem}.sv-amt{font-size:1.05rem}}
/* Hospitable's widget renders a fixed ~320px column, so the container is
   capped and centred rather than spanning the full 760px section. */
.booking-widget{margin:1.8rem auto 0;max-width:460px}

/* booking modal — Hospitable widget in a <dialog> (booking-modal.js) */
/* margin:auto is what centres a <dialog>; the global * reset above strips the
   UA default, so it has to be restored explicitly here. */
/* width tracks Hospitable's ~320px calendar column plus breathing room, so the
   card hugs the widget instead of framing it with dead space */
.booking-modal{width:min(94vw,400px);max-width:400px;max-height:92dvh;margin:auto;padding:0;border:0;border-radius:var(--radius);background:var(--white);box-shadow:0 24px 60px rgba(21,48,60,.3);overflow:hidden}
.booking-modal::backdrop{background:rgba(10,32,42,.62);backdrop-filter:blur(3px)}
.bm-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1.1rem;border-bottom:1px solid var(--sand-deep);background:var(--sand)}
.bm-title{font-family:var(--font-display);font-weight:700;font-size:.98rem;letter-spacing:-.01em;color:var(--ink)}
.bm-close{flex:none;width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--sand-deep);background:var(--white);color:var(--ink);border-radius:50%;font-size:1.35rem;line-height:1;cursor:pointer}
.bm-close:hover{background:var(--sand-deep)}
.bm-close:focus-visible{outline:2px solid var(--sea);outline-offset:2px}
/* The widget's own height is fixed at 900px by Hospitable, so the body — not
   the iframe — is what scrolls once the viewport is shorter than that. */
.bm-body{position:relative;overflow-y:auto;-webkit-overflow-scrolling:touch;max-height:calc(92dvh - 56px)}
/* Constrain the frame to Hospitable's calendar-column width and centre it.
   We can't centre content inside their cross-origin iframe, but sizing the
   frame to the column and centring the frame achieves the same look when the
   gutter is inside the iframe. 320px matches their column so no gutter remains
   inside the frame; it is also their documented minimum, so don't go lower. */
.bm-body iframe{display:block;width:100%;max-width:320px;margin:0 auto;height:900px;border:0}
.bm-loading{position:absolute;inset:0;display:grid;place-items:center;margin:0;font-size:.9rem;color:var(--ink-soft);pointer-events:none}
@media(max-width:560px){.booking-modal{width:100vw;max-width:none;max-height:100dvh;border-radius:0}.bm-body{max-height:calc(100dvh - 56px)}}

/* ============================================================
   Standalone document pages — /rental-agreement, /faqs,
   /cancellation-policy, /guest-book. Share the site nav + footer;
   this block styles the readable document body.
   ============================================================ */
.nav--solid{background:var(--ink);backdrop-filter:none;-webkit-backdrop-filter:none}
.doc{background:var(--sand);min-height:100vh;padding:calc(70px + 2.5rem) 0 4rem}
@media(max-width:720px){.doc{padding:calc(60px + 1.5rem) 0 3rem}}
.doc-inner{max-width:820px;margin:0 auto;padding:2.75rem 2.5rem 3rem;background:var(--white);border-radius:var(--radius);box-shadow:var(--shadow)}
@media(max-width:720px){.doc-inner{padding:1.75rem 1.25rem;border-radius:0;box-shadow:none}}
.doc-kicker{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.22em;font-size:.72rem;font-weight:700;color:var(--coral);margin-bottom:.5rem}
.doc-title{font-size:2.5rem;color:var(--ink);line-height:1.03;margin-bottom:.45rem}
@media(max-width:720px){.doc-title{font-size:1.9rem}}
.doc-meta{color:var(--ink-soft);font-size:.92rem;margin:0 0 1.6rem;padding-bottom:1.5rem;border-bottom:2px solid var(--sand-deep)}
.doc-body{color:var(--ink);font-size:1.02rem}
.doc-body>p:first-of-type{font-size:1.1rem;color:var(--sea-deep)}
.doc-body h2{font-family:var(--font-display);font-size:1.35rem;color:var(--ink);margin:2rem 0 .55rem;letter-spacing:-.02em}
.doc-body h2 .n{color:var(--coral);margin-right:.4em}
.doc-body h3{font-family:var(--font-display);font-size:1.06rem;color:var(--sea-deep);margin:1.25rem 0 .3rem}
.doc-body p{margin:0 0 1rem}
.doc-body ul{margin:0 0 1rem;padding-left:1.2rem}
.doc-body li{margin:.32rem 0}
.doc-body a{color:var(--sea);font-weight:600;text-decoration:none;border-bottom:1px solid rgba(14,116,144,.35)}
.doc-body a:hover{color:var(--sea-deep)}
.doc-body strong{color:var(--ink)}
/* info / important callout */
.doc-note{background:var(--sand);border-left:4px solid var(--coral);border-radius:10px;padding:.9rem 1.1rem;margin:1.1rem 0}
.doc-note .lab{display:block;font-family:var(--font-display);font-weight:700;text-transform:uppercase;letter-spacing:.06em;font-size:.72rem;color:var(--coral);margin-bottom:.2rem}
/* refund / schedule table */
.doc-table{width:100%;border-collapse:collapse;margin:.4rem 0 1.3rem;font-size:.98rem}
.doc-table th{background:var(--ink);color:#fff;text-align:left;padding:.7rem .9rem;font-family:var(--font-display);font-weight:600;font-size:.9rem}
.doc-table td{padding:.7rem .9rem;border-bottom:1px solid var(--sand-deep)}
.doc-table tr:last-child td{border-bottom:0}
.doc-table td:last-child{font-weight:700;color:var(--sea-deep);white-space:nowrap}
/* key/value reference tables (guest book): label + wrapping value, no nowrap */
.doc-table--kv td{vertical-align:top}
.doc-table--kv td:first-child{width:9rem;white-space:nowrap}
.doc-table--kv td:last-child{font-weight:400;color:var(--ink);white-space:normal;word-break:break-word}
.doc-table--kv td:last-child a{word-break:break-word}
/* on phones, stack label above value so long values never clip */
@media(max-width:640px){
  .doc-table--kv,.doc-table--kv tbody,.doc-table--kv tr,.doc-table--kv td{display:block;width:auto}
  .doc-table--kv tr{padding:.6rem 0;border-bottom:1px solid var(--sand-deep)}
  .doc-table--kv tr:last-child{border-bottom:0}
  .doc-table--kv td{padding:0;border-bottom:0}
  .doc-table--kv td:first-child{width:auto;margin-bottom:.15rem}
}
/* FAQ question blocks */
.faq-item{border-top:1px solid var(--sand-deep);padding:1.15rem 0}
.faq-item:last-child{border-bottom:1px solid var(--sand-deep)}
.faq-q{display:flex;gap:.6rem;font-family:var(--font-display);font-size:1.15rem;color:var(--ink);margin-bottom:.45rem;letter-spacing:-.01em}
.faq-q .n{color:var(--coral);font-weight:700}
.faq-a{color:var(--ink-soft)}
.faq-a a{color:var(--sea)}
/* signature grid (rental agreement) */
.sig-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem 2rem;margin:1rem 0 .5rem}
@media(max-width:600px){.sig-grid{grid-template-columns:1fr}}
.sig-field{border-bottom:1.5px solid var(--ink);padding-bottom:.3rem;min-height:2.2rem;display:flex;align-items:flex-end}
.sig-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);margin-bottom:.15rem}
/* small cross-links between the doc pages */
.doc-links{max-width:820px;margin:1.5rem auto 0;padding:0 2.5rem;display:flex;flex-wrap:wrap;gap:.25rem .6rem;justify-content:center}
/* Links are padded rather than bare text so the tap target clears the ~44px
   minimum on phones — as plain inline text these were ~23px tall. */
.doc-links a{color:var(--sea-deep);font-size:.9rem;text-decoration:none;font-weight:600;display:inline-flex;align-items:center;min-height:44px;padding:0 .6rem;border-radius:8px}
.doc-links a:hover{text-decoration:underline;background:var(--sand)}
@media(max-width:720px){.doc-links{padding:0 1rem}}
.doc-updated{margin-top:2rem;padding-top:1.2rem;border-top:2px solid var(--sand-deep);color:var(--ink-soft);font-size:.85rem}

/* homepage 'Plan Your Adventure' teaser band */
#plan .plan-lede{max-width:56ch;margin:.5rem auto 1.5rem;color:var(--ink-soft)}

/* Plan Your Adventure — fixed itinerary copy + embedded Google map */
.itin-lead{font-size:1.05rem;color:var(--sea-deep);margin:0 0 1.3rem;max-width:64ch}
.itin-standing-note{margin:1.4rem 0 0;font-size:.85rem;line-height:1.6;color:var(--ink-soft);background:var(--sand);border-radius:10px;padding:.85rem 1.1rem}
.itin-gmap{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);line-height:0}
.itin-gmap iframe{width:100%;height:420px;border:0;display:block}
@media(max-width:600px){.itin-gmap iframe{height:320px}}
