/* Shared, dependency-free layout for the hotel and policy pages. */
:root { --teal:#086e70; --teal-dark:#174445; --cream:#faf8f4; --sand:#eee9df; --ink:#263d3b; --muted:#566561; --line:#d6ded8; --serif:'Playfair Display',Georgia,serif; --sans:'Montserrat',Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:6rem; }
body { margin:0; color:var(--ink); background:var(--cream); font:400 1rem/1.65 var(--sans); }
body.modal-open { overflow:hidden; }
img { display:block; max-width:100%; height:auto; }
a { color:var(--teal); text-underline-offset:4px; }
button,input,select,textarea { font:inherit; }
button,select,summary { cursor:pointer; }
button,a,input,select,textarea,summary { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #bb690a; outline-offset:5px; }
[hidden] { display:none !important; }
h1,h2,h3,p { margin:0; }
h1,h2,h3 { font-family:var(--serif); font-weight:600; line-height:1.16; }
h2 { font-size:clamp(2rem,3.5vw,3rem); }
h3 { font-size:1.45rem; }
em { color:var(--teal); font-weight:400; }
.wrap { width:min(1200px,calc(100% - 4rem)); margin-inline:auto; }
.section { padding-block:5.5rem; }
.eyebrow { display:block; color:var(--teal); font-size:.73rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; margin-bottom:1rem; }
.section-intro { color:var(--muted); max-width:620px; margin-top:1.1rem; }
.section-heading { display:flex; justify-content:space-between; gap:2rem; align-items:end; margin-bottom:2.5rem; }
.btn { display:inline-flex; justify-content:center; align-items:center; gap:.6rem; min-height:48px; padding:.8rem 1.4rem; border:1px solid var(--teal); border-radius:3px; background:var(--teal); color:white; text-decoration:none; font-size:.85rem; font-weight:600; line-height:1.5; transition:background .18s,box-shadow .18s; }
.btn:hover { background:var(--teal-dark); color:white; box-shadow:0 4px 12px #17444515; }
.btn-outline { background:transparent; color:var(--teal); }
.text-link { font-size:.9rem; font-weight:600; }
.skip-link { position:fixed; top:1rem; left:1rem; z-index:500; padding:.8rem 1.2rem; color:white; background:var(--teal-dark); transform:translateY(-200%); }
.skip-link:focus { transform:translateY(0); }
.site-header { position:sticky; top:0; z-index:50; background:rgba(250,248,244,.98); border-bottom:1px solid var(--line); }
.navbar { min-height:86px; display:flex; justify-content:space-between; align-items:center; gap:1.5rem; }
.brand { display:flex; flex-direction:column; color:var(--teal-dark); text-decoration:none; line-height:1; }
.brand strong { font:600 1.8rem var(--serif); letter-spacing:.12em; }
.brand span { font-size:.6rem; font-weight:600; letter-spacing:.27em; margin-top:.25rem; }
.nav-links { display:flex; gap:1.7rem; align-items:center; }
.nav-links a { text-decoration:none; color:var(--ink); font-size:.82rem; font-weight:500; }
.nav-links a:hover { color:var(--teal); text-decoration:underline; }
.menu-toggle { display:none; }
.menu-panel { padding:1.5rem; }
.menu-panel nav { display:flex; flex-direction:column; gap:.5rem; margin-block:1.5rem; }
.menu-panel nav a { padding:.7rem; color:var(--ink); font:1.5rem var(--serif); text-decoration:none; }
.dialog-heading { display:flex; justify-content:space-between; align-items:start; gap:1rem; margin-bottom:1.5rem; }
dialog .dialog-heading { position:sticky; top:-2rem; z-index:1; background:var(--cream); padding-block:.6rem; }
.close-button { flex:none; border:1px solid var(--line); background:transparent; color:var(--ink); border-radius:3px; min-height:44px; min-width:64px; padding:.45rem .75rem; font-size:.85rem; }
.hero { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; padding-block:3.5rem; }
.hero h1 { font-size:clamp(2.75rem,4.8vw,4.55rem); letter-spacing:-.035em; }
.hero h1 em { display:block; }
.hero-copy > p { color:var(--muted); max-width:460px; margin-block:1.5rem; }
.hero-actions { display:flex; gap:.8rem; flex-wrap:wrap; margin-block:1.7rem; }
.hero-rate { color:var(--muted); font-size:.85rem; }
.hero-rate strong { color:var(--teal-dark); font-size:1.1rem; }
.hero-media { position:relative; margin:0; }
.hero-media img { width:100%; height:530px; object-fit:cover; border-radius:90px 3px 3px 3px; }
.hero-media figcaption { position:absolute; bottom:1.3rem; left:1.3rem; right:1.3rem; padding:.9rem 1.1rem; background:rgba(250,248,244,.96); color:var(--ink); font-size:.78rem; }
.hero-media figcaption strong { display:block; font-size:.88rem; }
.comfort-strip { border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.comfort-strip .wrap { display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; padding-block:1.2rem; font-size:.82rem; font-weight:500; }
.comfort-strip span { display:flex; gap:.7rem; align-items:center; }
.comfort-strip i { color:var(--teal); }
#rooms { background:#f1eee7; }
.room-controls { display:flex; gap:1.5rem; align-items:end; flex-wrap:wrap; margin-bottom:1.2rem; }
label { display:block; font-size:.82rem; font-weight:600; }
select,input,textarea { display:block; width:100%; border:1px solid #9faea6; border-radius:3px; background:#fff; color:var(--ink); min-height:46px; padding:.65rem .8rem; margin-top:.4rem; }
.room-controls select { min-width:180px; }
.filter-status { color:var(--muted); font-size:.82rem; margin-bottom:1.3rem; }
.rooms-grid,.tour-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.5rem; }
.room-card { display:flex; flex-direction:column; min-width:0; border:1px solid var(--line); border-radius:4px; overflow:hidden; background:var(--cream); }
.room-img { position:relative; overflow:hidden; }
.room-img-link { display:block; }
.room-img img { width:100%; aspect-ratio:1.55; object-fit:cover; transition:transform .25s; }
.room-img-link:hover img { transform:scale(1.025); }
.gallery-badge { position:absolute; bottom:12px; right:12px; padding:.35rem .65rem; background:#173d3be6; color:white; border-radius:3px; font-size:.72rem; pointer-events:none; }
.room-body { padding:1.5rem; flex:1; display:flex; flex-direction:column; }
.room-desc { font-size:.86rem; color:var(--muted); margin:.7rem 0 1rem; }
.room-guests { font-size:.8rem; font-weight:600; }
.room-extra { font-size:.77rem; color:var(--muted); margin-top:.3rem; }
.room-features { display:flex; flex-wrap:wrap; gap:.4rem .8rem; color:var(--muted); font-size:.73rem; margin:1rem 0; padding:0; list-style:none; }
.room-features li { border-bottom:1px solid var(--line); padding-bottom:.2rem; }
.room-rates { display:flex; flex-wrap:wrap; gap:.7rem 1.5rem; border-top:1px solid var(--line); padding-top:1rem; margin-top:auto; }
.room-rate strong { display:block; font:600 1.6rem var(--serif); color:var(--teal); }
.room-rate small { color:var(--muted); font-size:.75rem; }
.room-link { margin:0 1.5rem 1.5rem; }
.rates-note { font-size:.83rem; line-height:1.8; color:var(--muted); margin-top:1.8rem; max-width:860px; }
.amenities-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:2rem; }
.amenity { border-top:1px solid var(--line); padding-top:1.4rem; }
.amenity > i { font-size:1.3rem; color:var(--teal); margin-bottom:1.3rem; }
.amenity h3 { font-size:1.2rem; }
.amenity p { color:var(--muted); font-size:.85rem; margin-top:.7rem; }
.amenity a { display:inline-block; margin-top:.7rem; font-size:.8rem; }
.tour-section { background:var(--sand); }
.tour-card { margin:0; min-width:0; }
.tour-card .room-img { border-radius:4px; }
.tour-card h3 { margin-top:1.1rem; font-size:1.35rem; }
.tour-card p { margin-top:.5rem; color:var(--muted); font-size:.85rem; }
.about { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
.about img { width:100%; aspect-ratio:1.2; object-fit:cover; border-radius:4px; }
.about p { color:var(--muted); margin-top:1.2rem; }
.booking-steps { background:var(--teal-dark); color:var(--cream); }
.booking-steps .eyebrow { color:#b2dcd1; }
.steps-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3rem; margin-top:2.8rem; padding:0; list-style:none; counter-reset:step; }
.steps-grid li::before { counter-increment:step; content:'0' counter(step); display:block; color:#b2dcd1; font-size:.8rem; margin-bottom:1rem; }
.steps-grid h3 { font-size:1.3rem; }
.steps-grid p { color:#d4e3dd; font-size:.86rem; margin-top:.8rem; }
.booking-steps .btn { background:var(--cream); color:var(--teal-dark); border-color:var(--cream); margin-top:1.7rem; }
.contact-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:4rem; align-items:start; }
.contact-details { margin:2rem 0; }
.contact-details div { padding:.75rem 0; border-bottom:1px solid var(--line); }
.contact-details dt { color:var(--muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.07em; }
.contact-details dd { margin:.25rem 0 0; font-size:.9rem; overflow-wrap:anywhere; }
.contact-map { width:100%; height:420px; border:1px solid var(--line); border-radius:4px; }
.map-links { display:flex; gap:1rem; flex-wrap:wrap; margin-top:1rem; font-size:.85rem; }
.faq { background:#f1eee7; }
.faq-grid { display:grid; grid-template-columns:.75fr 1.25fr; gap:4rem; }
details { border-bottom:1px solid #c6d0c8; padding:1.2rem 0; }
summary { font-weight:600; font-size:.95rem; padding-right:1rem; }
details p { color:var(--muted); margin-top:1rem; font-size:.9rem; }
footer { background:var(--teal-dark); color:white; padding-block:3.5rem 2rem; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:3rem; }
footer .brand { color:var(--cream); }
footer p { color:#d4e3dd; font-size:.85rem; max-width:340px; margin-top:1.2rem; }
footer h2 { font:600 .9rem var(--sans); margin-bottom:1rem; }
footer a { color:#e3eee9; }
.footer-links { display:flex; flex-direction:column; align-items:start; gap:.6rem; font-size:.85rem; }
.footer-bottom { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; font-size:.75rem; color:#c7d9d2; margin-top:2.5rem; padding-top:1.5rem; border-top:1px solid #53716b; }
.mobile-actions { display:none; }
dialog { margin:auto; padding:2rem; width:min(600px,calc(100% - 2rem)); max-height:calc(100dvh - 2rem); overflow:auto; background:var(--cream); color:var(--ink); border:1px solid var(--line); border-radius:6px; box-shadow:0 24px 100px #0004; }
dialog::backdrop { background:#122c2bc9; }
dialog h2 { font-size:1.8rem; }
.dialog-intro { font-size:.9rem; color:var(--muted); margin-bottom:1.5rem; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-bottom:1.3rem; }
.form-grid .full { grid-column:1/-1; }
textarea { font-size:.85rem; line-height:1.6; resize:vertical; }
.dialog-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1rem; }
.status { min-height:1.8em; color:var(--teal-dark); font-size:.82rem; margin-top:.7rem; }
.inquiry-note { color:var(--muted); font-size:.78rem; margin-top:1rem; }
.gallery-dialog { width:min(1100px,calc(100% - 2rem)); }
.gallery-dialog img { width:100%; height:min(65dvh,680px); object-fit:contain; background:#e9e7e0; }
.gallery-controls { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1rem; }
.gallery-controls button { min-height:44px; border:1px solid var(--line); padding:.5rem 1rem; border-radius:3px; background:white; color:var(--teal); }
.gallery-controls button:disabled { opacity:.5; cursor:default; }
.gallery-controls p { font-size:.85rem; text-align:center; }
.policy-page main { max-width:800px; margin:0 auto; padding:3rem 1.5rem; }
.policy-page main h1 { font-size:2.5rem; margin-bottom:1rem; }
.policy-page main h2 { font-size:1.45rem; margin-top:2rem; }
.policy-page main p,.policy-page main ul { margin-top:1rem; }
.policy-page .updated { color:var(--muted); font-size:.85rem; }
@media (max-width:1050px) {
  .nav-links { gap:1rem; }
  .navbar > .btn { display:none; }
  .hero { gap:2rem; }
  .hero-media img { height:490px; }
  .rooms-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .amenities-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .about,.contact-grid,.faq-grid { gap:2.5rem; }
}
@media (max-width:760px) {
  html { scroll-padding-top:5rem; }
  .wrap { width:calc(100% - 2.5rem); }
  .section { padding-block:3.5rem; }
  .navbar { min-height:74px; }
  .brand strong { font-size:1.5rem; }
  .nav-links { gap:1rem; flex-wrap:wrap; justify-content:end; }
  .nav-links a { font-size:.75rem; }
  .js-ready .nav-links { display:none; }
  .js-ready .menu-toggle { display:inline-flex; min-height:44px; align-items:center; border:1px solid var(--line); background:transparent; color:var(--ink); padding:.5rem 1rem; border-radius:3px; }
  .hero { grid-template-columns:1fr; padding-block:2.5rem; gap:2rem; }
  .hero h1 { font-size:clamp(2.7rem,8vw,4rem); }
  .hero-copy > p { margin-block:1rem; }
  .hero-media img { height:320px; border-top-left-radius:60px; }
  .hero-actions { margin-block:1.3rem; }
  .comfort-strip .wrap { display:grid; grid-template-columns:1fr 1fr; gap:.9rem; font-size:.75rem; }
  .section-heading { display:block; margin-bottom:2rem; }
  .section-heading > a { display:inline-block; margin-top:1rem; }
  .tour-grid { gap:1rem; }
  .tour-card h3 { font-size:1.1rem; }
  .tour-card .room-img img { aspect-ratio:1; }
  .tour-card p { font-size:.78rem; }
  .about,.contact-grid,.faq-grid { grid-template-columns:1fr; }
  .about img { max-height:340px; }
  .steps-grid { grid-template-columns:1fr; gap:1.8rem; }
  .steps-grid li::before { margin-bottom:.5rem; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:2rem; }
  .footer-grid > :first-child { grid-column:1/-1; }
  .mobile-actions { display:flex; gap:.6rem; position:fixed; bottom:0; left:0; right:0; padding:.65rem 1rem calc(.65rem + env(safe-area-inset-bottom)); z-index:40; background:var(--cream); border-top:1px solid var(--line); }
  .mobile-actions .btn { flex:1; font-size:.8rem; min-height:44px; padding:.6rem; }
  body:not(.policy-page) { padding-bottom:calc(80px + env(safe-area-inset-bottom)); }
  dialog { padding:1.3rem; }
  dialog .dialog-heading { top:-1.3rem; }
  .gallery-dialog img { height:55dvh; }
}
@media (max-width:540px) {
  .rooms-grid { grid-template-columns:1fr; }
  .room-controls { gap:1rem; }
  .room-controls label { flex:1; min-width:0; }
  .room-controls select { min-width:0; font-size:.85rem; }
  .tour-grid { grid-template-columns:1fr; gap:2rem; }
  .tour-card .room-img img { aspect-ratio:1.6; }
  .hero-actions .btn { flex:1; padding:.8rem .7rem; }
  .hero-media img { height:275px; }
  .amenities-grid { gap:1.5rem; }
  .amenity h3 { font-size:1.1rem; }
  .amenity p { font-size:.8rem; }
  .contact-map { height:300px; }
  .form-grid { grid-template-columns:1fr; }
  .dialog-actions .btn { width:100%; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none !important; transition:none !important; }
}