:root{--sea:#0e5f6b;--sea-d:#0a3f4a;--teal:#2a9d8f;--sand:#f6ecdc;--cream:#fffaf2;--coral:#e76f51;--coral-d:#c8553a;--sun:#f4a261;--ink:#1f2d33;--muted:#5b6b70;--r:14px;--shadow:0 6px 24px rgba(10,63,74,.10)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;font:17px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--cream);padding-bottom:84px}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{font-family:ui-serif,Georgia,"Times New Roman",serif;line-height:1.2;color:var(--sea-d);margin:0 0 .6em}
h1{font-size:clamp(1.9rem,5.5vw,3.2rem);color:#fff}
h2{font-size:clamp(1.6rem,4vw,2.3rem)}
h3{font-size:1.25rem;margin-top:.2em}
p{margin:0 0 1em}
a{color:var(--sea)}
.wrap{width:min(1120px,100% - 2.5rem);margin-inline:auto}
.narrow{width:min(760px,100% - 2.5rem)}
.center{text-align:center}
.skip{position:absolute;left:-999px;top:0;background:#fff;padding:.5rem 1rem;z-index:99}
.skip:focus{left:1rem}
.top{position:sticky;top:0;z-index:40;background:rgba(255,250,242,.94);backdrop-filter:blur(8px);border-bottom:1px solid rgba(10,63,74,.08)}
.top-in{display:flex;align-items:center;gap:1rem;min-height:60px}
.brand{display:flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--sea-d);font:700 1.1rem ui-serif,Georgia,serif}
.brand svg{width:30px;height:30px}
.brand em{font-style:normal;color:var(--coral)}
.nav{display:none;margin-left:auto;gap:1.3rem}
.nav a{text-decoration:none;color:var(--ink);font-size:.95rem}
.nav a:hover{color:var(--coral)}
.top .btn-sm{margin-left:auto;display:none}
.btn{display:inline-block;background:var(--coral);color:#fff;text-decoration:none;font-weight:700;padding:.85rem 1.3rem;border-radius:999px;box-shadow:0 4px 14px rgba(231,111,81,.35);transition:background .15s,transform .15s;text-align:center}
.btn:hover{background:var(--coral-d);transform:translateY(-1px)}
.btn:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--sun);outline-offset:2px}
.btn-sm{padding:.55rem 1rem;font-size:.92rem}
.btn-lg{padding:1rem 1.8rem;font-size:1.1rem}
.btn-ghost{background:rgba(255,255,255,.14);border:2px solid #fff;box-shadow:none}
.btn-ghost:hover{background:rgba(255,255,255,.28)}
.hero{position:relative;min-height:min(78vh,640px);display:flex;align-items:flex-end;color:#fff;overflow:hidden;background:var(--sea-d)}
.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,63,74,.05) 25%,rgba(10,63,74,.85) 100%)}
.hero-txt{position:relative;z-index:1;padding:5rem 0 2rem}
.eyebrow{display:inline-block;background:rgba(255,255,255,.18);border-radius:999px;padding:.25rem .8rem;font-size:.9rem;font-weight:600;margin-bottom:.8rem}
.lead{font-size:1.1rem;max-width:36rem}
.cta-row{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.2rem 0 .8rem}
.rating{font-size:.95rem;opacity:.95;margin:0}
.rating span{color:var(--sun)}
.facts{background:var(--sea);color:#fff}
.facts-in{list-style:none;margin:0 auto;padding:1rem 0;display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem .5rem;text-align:center}
.facts b{display:block;font:700 1.3rem ui-serif,Georgia,serif}
.facts span{font-size:.85rem;opacity:.9}
.sec{padding:3.2rem 0}
.sand{background:var(--sand)}
.sea{background:linear-gradient(180deg,#e7f3f1,#f4faf8)}
.two{display:grid;gap:1.6rem}
.card{background:#fff;border-radius:var(--r);padding:1.4rem;box-shadow:var(--shadow)}
.muted{color:var(--muted)}
.small{font-size:.9rem;color:var(--muted)}
.ticks{list-style:none;padding:0;margin:0 0 1em}
.ticks li{position:relative;padding-left:1.6rem;margin:.35rem 0}
.ticks li::before{content:"";position:absolute;left:0;top:.5em;width:.8rem;height:.45rem;border-left:3px solid var(--teal);border-bottom:3px solid var(--teal);transform:rotate(-45deg)}
.note{background:#fff5e8;border-left:4px solid var(--sun);padding:.8rem 1rem;border-radius:8px;font-size:.95rem}
.gallery{list-style:none;padding:0;margin:1rem 0 0;display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}
.gallery a{display:block;border-radius:10px;overflow:hidden;background:#ddd;aspect-ratio:4/3}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.gallery a:hover img{transform:scale(1.04)}
.reviews{display:grid;gap:1rem;margin:1.2rem 0}
.review{margin:0;background:#fff;border-radius:var(--r);padding:1.3rem;box-shadow:var(--shadow)}
.review blockquote{margin:0}
.r-head{font:600 1.1rem/1.4 ui-serif,Georgia,serif;color:var(--sea-d)}
.review figcaption{font-size:.9rem;color:var(--muted)}
.stars{color:var(--sun);letter-spacing:1px}
.reply{margin:.8rem 0 0;font-size:.9rem;background:var(--sand);padding:.6rem .8rem;border-radius:8px}
.link{font-weight:600}
.faq details{background:#fff;border-radius:10px;margin:.6rem 0;box-shadow:var(--shadow)}
.faq summary{cursor:pointer;padding:1rem 2.6rem 1rem 1.1rem;font-weight:600;list-style:none;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:1.1rem;top:.8rem;font-size:1.4rem;color:var(--coral)}
.faq details[open] summary::after{content:"\2013"}
.faq details p{padding:0 1.1rem 1rem;margin:0}
.cta-band{background:var(--sea-d);color:#fff}
.cta-band h2{color:#fff}
.foot{background:#08323b;color:#cfe3e1;padding:2rem 0 2.5rem;font-size:.95rem}
.foot a{color:#fff}
.foot .small{color:#a9c6c3}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:50;padding:.6rem 1rem calc(.6rem + env(safe-area-inset-bottom));background:rgba(255,250,242,.96);box-shadow:0 -4px 18px rgba(0,0,0,.12)}
.sticky-cta .btn{display:block;width:100%}
.lb{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh;margin:0}
.lb::backdrop{background:rgba(5,20,25,.92)}
.lb[open]{display:flex;align-items:center;justify-content:center}
.lb figure{margin:0;max-width:94vw;text-align:center}
.lb img{max-height:80vh;max-width:94vw;width:auto;margin:auto;border-radius:6px}
.lb figcaption{color:#eee;font-size:.95rem;margin-top:.6rem;padding:0 1rem}
.lb button{position:fixed;background:rgba(255,255,255,.15);color:#fff;border:0;border-radius:999px;width:48px;height:48px;font-size:2rem;line-height:1;cursor:pointer}
.lb button:hover{background:rgba(255,255,255,.3)}
.lb-close{top:14px;right:14px}
.lb-prev{left:10px;top:50%;transform:translateY(-50%)}
.lb-next{right:10px;top:50%;transform:translateY(-50%)}
@media (min-width:640px){.facts-in{grid-template-columns:repeat(4,1fr)}.gallery{grid-template-columns:repeat(3,1fr)}.gallery li:first-child{grid-column:span 2;grid-row:span 2}.gallery li:first-child a{aspect-ratio:auto;height:100%}}
@media (min-width:900px){.facts-in{grid-template-columns:repeat(8,1fr)}body{padding-bottom:0}.sticky-cta{display:none}.nav{display:flex}.top .btn-sm{display:inline-block;margin-left:0}.two{grid-template-columns:1.1fr .9fr;align-items:start}.gallery{grid-template-columns:repeat(4,1fr)}.gallery li:nth-child(2){grid-column:span 2;grid-row:span 2}.gallery li:nth-child(2) a{aspect-ratio:auto;height:100%}.reviews{grid-template-columns:repeat(2,1fr)}.hero-txt{padding-bottom:3rem}.sec{padding:4.5rem 0}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.hero-img{object-position:62% 60%}
/* Netlify injects a "Powered by Netlify" badge (iframe #nl-badge-frame, position:fixed; bottom:0; right:0; ~64px tall) into every
   page it serves, via /.netlify/scripts/hud. It is not in our HTML. Always keep the sticky book button clear of that bottom
   strip with fixed padding, whether or not the badge has loaded (no JS detection). The badge then sits on the bar's own
   background below the button. Desktop (>=900px) hides the bar and keeps 140px bottom padding so the footer can scroll clear of the badge. */
.sticky-cta{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
body{padding-bottom:calc(140px + env(safe-area-inset-bottom))}
@media (min-width:900px){body{padding-bottom:140px}}
.tip{background:#fff5e8;border:2px dashed var(--sun);border-radius:12px;padding:1rem 1.1rem;margin-top:1rem}
.tip p{margin:0}
.tip .tip-label{font:700 .8rem system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--coral-d);margin-bottom:.3rem}
.tip ul{margin:.5rem 0 0;padding-left:1.1rem}
.tip li{margin:.35rem 0}
.tip .handy{margin-top:.8rem;padding-top:.7rem;border-top:1px solid rgba(231,111,81,.3);font-size:.95rem}
