:root{--teal:#26969b;--dark:#12464e;--deep:#0c3238;--mint:#c8e6e8;--cream:#f6fbfb}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Montserrat,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--dark);background:var(--cream);line-height:1.5;padding-bottom:calc(84px + env(safe-area-inset-bottom))}
body.noscroll{overflow:hidden}
a{color:var(--teal)}
h1,h2{font-weight:800;color:var(--dark);text-align:center}
.topbar{background:var(--deep);color:var(--mint);padding:calc(.9rem + env(safe-area-inset-top)) 1rem .9rem;text-align:center}
.topbar a{color:#fff;font-weight:800;letter-spacing:.06em;text-decoration:none}
.topbar .sub{font-size:.85rem;margin-top:.25rem}
.wrap{max-width:1000px;margin:0 auto;padding:1.5rem 1rem 2.5rem}
.btn-book{display:inline-block;border:0;cursor:pointer;font:inherit;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:linear-gradient(135deg,#2fb0b5,var(--teal));padding:1rem 2.2rem;border-radius:999px;font-size:1.05rem;box-shadow:0 8px 24px rgba(18,70,78,.35);text-decoration:none;text-align:center}
.btn-book:focus-visible,.opt:focus-visible,.back:focus-visible{outline:3px solid #ffd166;outline-offset:3px}
/* Center the grid as a whole so 1–2 cards sit centered under the heading */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;justify-content:center;justify-items:stretch;max-width:720px;margin-left:auto;margin-right:auto}
@media(min-width:700px){
  .grid{grid-template-columns:repeat(3,minmax(0,220px));gap:1rem;max-width:100%;justify-content:center}
}
/* Single / few cards: keep card width reasonable and centered via justify-content */
.grid .card{width:100%;max-width:280px;justify-self:center}
@media(min-width:700px){
  .grid .card{max-width:220px}
}
.card{display:block;background:#fff;border-radius:16px;overflow:hidden;border:2px solid #e2eeef;text-decoration:none;color:inherit;box-shadow:0 6px 18px rgba(18,70,78,.08)}
.card:hover{border-color:var(--teal)}
.card .thumb{aspect-ratio:1/1;background:var(--deep);display:flex;align-items:center;justify-content:center}
.card .thumb img{width:100%;height:100%;object-fit:contain;display:block}
.card .cap{padding:.7rem .8rem .9rem;font-size:.9rem;font-weight:600;text-align:center}
.empty{text-align:center;color:#4a6f74;padding:2rem 1rem}
.footer{background:var(--deep);color:var(--mint);text-align:center;padding:2rem 1rem}
.footer a{color:#fff;font-weight:700}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;padding:.7rem 1rem calc(.7rem + env(safe-area-inset-bottom));background:rgba(246,251,251,.96);box-shadow:0 -4px 18px rgba(0,0,0,.12);z-index:50}
.sticky-cta .btn-book{width:100%;max-width:440px;display:block;margin:0 auto}
@media(min-width:768px){
  body{padding-bottom:100px}
  .sticky-cta{padding:.85rem 1rem calc(.85rem + env(safe-area-inset-bottom))}
}
.modal{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-end;justify-content:center}
.modal[hidden]{display:none}
.backdrop{position:absolute;inset:0;background:rgba(8,30,34,.6)}
.sheet{position:relative;background:#fff;width:100%;max-width:440px;border-radius:22px 22px 0 0;padding:1.6rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom))}
@media(min-width:768px){.modal{align-items:center}.sheet{border-radius:22px;padding:2rem}}
.sheet h3{font-size:1.25rem;font-weight:800}
.sheet>p{font-size:.9rem;color:#4a6b70;margin:.2rem 0 1rem}
.close{position:absolute;top:.6rem;right:.8rem;border:0;background:none;font-size:2rem;line-height:1;color:var(--dark);cursor:pointer}
.opt{display:flex;align-items:center;justify-content:space-between;gap:.75rem;border:2px solid #e2eeef;border-radius:14px;padding:1rem 1.2rem;margin-bottom:.7rem;text-decoration:none;color:var(--dark);font-weight:700;font-size:1.05rem}
.opt:hover{border-color:var(--teal)}
.opt .opt-text{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem;min-width:0;flex:1}
.opt .opt-text strong{font-weight:700}
.opt small{display:block;font-weight:600;color:#4a6b70;font-size:.8rem;line-height:1.35;white-space:normal}
.opt>span:last-child{flex:none}
.opt img{height:30px;width:auto;max-width:170px;display:block}
.opt-label{display:flex;flex-direction:column;align-items:flex-start;gap:.15rem;min-width:0;flex:1}
.opt-direct small{font-size:.8rem;font-weight:600;color:#4a6b70}
.fine-note{font-size:.78rem;color:#6b8a8f;text-align:center;margin:.2rem 0 0;font-style:italic}
/* Detail viewer — fit viewport; no scroll; room for Back + CTA */
body.viewer{background:#000;color:#fff;padding:0;height:100dvh;max-height:100dvh;overflow:hidden;display:flex;flex-direction:column}
.viewer-bar{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:calc(.65rem + env(safe-area-inset-top,0px)) 1rem .65rem;background:linear-gradient(180deg,rgba(0,0,0,.75),rgba(0,0,0,0));pointer-events:none}
.viewer-bar .back{pointer-events:auto}
.back{color:#fff;text-decoration:none;font-weight:700;padding:.55rem .9rem;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25)}
.viewer-stage{flex:1;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;padding:calc(3.25rem + env(safe-area-inset-top,0px)) 1rem calc(5.25rem + env(safe-area-inset-bottom,0px));box-sizing:border-box}
.viewer-stage img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}
.viewer .sticky-cta{background:rgba(0,0,0,.72);box-shadow:none}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}