:root {
  box-sizing: border-box;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  --bg:#FFFFFF; --paper:#FFFFFF; --ink:#0E1B2A; --muted:#566272; --line:#E5E9EE; --accent:#1E6FA5; --reef:#12808F;
  --coral:#E8553A; --card:#F3F6F9; --pill:#0E1B2A; --pill-ink:#FFFFFF;
  --serif:"Instrument Serif","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --gutter:clamp(1.25rem,5vw,4.5rem);
}
*,*::before,*::after { box-sizing: inherit; }
html { scroll-padding-top: calc(5.5rem + env(safe-area-inset-top, 0px)); scroll-behavior: smooth; height: 100%; }
body { margin: 0; min-height: 100%; background: var(--bg); color: var(--ink); font: 400 1.0625rem/1.65 var(--sans); -webkit-font-smoothing: antialiased; }
h1,h2,h3,h4 { font-family: var(--serif); font-weight: 400; margin: 0; letter-spacing: -.012em; line-height: 1.02; }
p { margin: 0; }
a { color: inherit; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--coral); outline-offset: 3px; border-radius: 6px; }
.wrap { width: min(1280px, 100% - 2*var(--gutter)); margin-inline: auto; }
.eyebrow { display: flex; align-items: center; gap: .9rem; font: 500 .78rem/1 var(--sans); letter-spacing: .24em; text-transform: uppercase; color: var(--accent); }
.eyebrow::before { content: ""; width: 2.6rem; height: 1px; background: currentColor; flex: none; }
.pill { display: inline-flex; align-items: center; gap: .6rem; font: 500 1rem var(--sans); padding: .95rem 1.7rem; border-radius: 999px; border: 1.5px solid transparent; text-decoration: none; cursor: pointer; background: var(--pill); color: var(--pill-ink); }
.pill:hover { filter: brightness(1.12); }
.pill.line { background: transparent; color: var(--ink); border-color: color-mix(in srgb, var(--ink) 28%, transparent); }
.pill.soft { background: color-mix(in srgb, var(--accent) 10%, var(--bg)); color: var(--accent); border-color: color-mix(in srgb, var(--accent) 22%, transparent); }
.pill.coral { background: var(--coral); color: #1a0a05; }

/* NAV */
.nav { position: fixed; z-index: 50; left: 0; right: 0; top: 0; padding-top: env(safe-area-inset-top, 0px); color: #fff; transition: background .25s, color .25s; }
.nav.solid { color: var(--ink); background: var(--bg); border-bottom: 1px solid var(--line); }
@supports (background: color-mix(in srgb, red 50%, blue)) { .nav.solid { background: color-mix(in srgb, var(--bg) 90%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); } }
.nav-in { width: min(1400px, 100% - 2*var(--gutter)); margin-inline: auto; height: 5.4rem; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }
.logo { display: block; flex: none; }
.logo svg { height: 74px; width: auto; display: block; }
@media (max-width: 980px) { .logo svg { height: 58px; } }
.logo-c { display: none; }
.nav.solid .logo-c { display: block; } .nav.solid .logo-w { display: none; }
.nav-links { display: flex; gap: clamp(1rem, 2.6vw, 2.6rem); align-items: center; }
.nav-links a { text-decoration: none; font-size: .98rem; padding: .4rem 0; position: relative; opacity: .92; }
.nav-links a:hover { opacity: 1; }
.nav-links a.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -.15rem; height: 2px; background: currentColor; }
.nav .book { background: #fff; color: #0E1B2A; padding: .8rem 1.5rem; font-weight: 500; }
.nav.solid .book { background: var(--pill); color: var(--pill-ink); }
.burger { display: none; width: 2.9rem; height: 2.9rem; border-radius: 50%; border: 1.5px solid currentColor; background: transparent; cursor: pointer; place-items: center; }
.burger svg { width: 22px; height: 22px; }
@media (max-width: 1290px) {
  .burger { display: grid; }
  .nav .book { display: none; }
  .nav-links { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; align-items: flex-start; gap: .2rem; background: #0B2233; color: #fff; padding: 1rem var(--gutter) 1.6rem; }
  .nav.open .nav-links { display: flex; }
  .nav-links a { font-size: 1.15rem; padding: .7rem 0; width: 100%; border-bottom: 1px solid rgba(255,255,255,.12); }
  .nav-links .book-m { display: inline-flex; margin-top: 1rem; width: auto; border: 0; background: #fff; color: #0E1B2A; padding: .85rem 1.6rem; border-radius: 999px; }
}
@media (min-width: 1291px) { .book-m { display: none !important; } }

/* PAGES */
.page { display: none; }
.page.on { display: block; }
.page-head { padding: clamp(8rem, 16vw, 11rem) 0 clamp(2rem, 5vw, 3.5rem); }
.page-head h1 { font-size: clamp(2.8rem, 7vw, 5.6rem); margin: 1.2rem 0 1rem; max-width: 16ch; }
.page-head p.lede { color: var(--muted); max-width: 40rem; font-size: 1.15rem; }
section.sec { padding: clamp(3.5rem, 8vw, 7rem) 0; }
.sec-top { display: flex; justify-content: space-between; align-items: flex-end; gap: 2rem; flex-wrap: wrap; margin-bottom: clamp(2rem, 5vw, 3.5rem); }
.sec-top h2 { font-size: clamp(2.3rem, 5vw, 4rem); margin-top: 1.1rem; max-width: 15ch; }
.sec-top p { color: var(--muted); max-width: 26rem; margin-top: 1rem; }

/* HERO */
.hero { position: relative; color: #fff; overflow: hidden; min-height: 100vh; min-height: 100svh; --a:#04223a; --b:#0a4b73; --c:#0f6d94; }
.hero[data-pal="blue"] { --a:#06335a; --b:#0d5f9a; --c:#1887bd; }
.hero[data-pal="teal"] { --a:#064a5c; --b:#0a7f91; --c:#1fb0b8; }
.hero-bg { position: absolute; inset: 0; background: linear-gradient(180deg, var(--a) 0%, var(--b) 58%, var(--c) 100%); }
.hero-bg svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3,22,38,.55) 0%, rgba(3,22,38,.1) 60%, transparent 100%); }
.hero-in { position: relative; z-index: 2; width: min(1400px, 100% - 2*var(--gutter)); margin-inline: auto; min-height: 100vh; min-height: 100svh; padding: 8.5rem 0 3rem; display: flex; flex-direction: column; justify-content: center; }
.hero .eyebrow { color: #9fd3f5; }
.hero h1 { font-size: clamp(2.9rem, 8.4vw, 7.6rem); line-height: .92; text-transform: uppercase; margin: 1.6rem 0 1.5rem; max-width: 58%; letter-spacing: -.005em; }
.hero-sub { max-width: 30rem; font-size: 1.15rem; color: rgba(255,255,255,.82); margin-bottom: 2rem; }
.hero .pill.line { color: #fff; border-color: rgba(255,255,255,.5); background: rgba(255,255,255,.08); backdrop-filter: blur(6px); align-self: flex-start; }
.slider { position: absolute; z-index: 3; left: 62%; right: var(--gutter); bottom: 2.6rem; }
.track-wrap { overflow: hidden; padding: .8rem 0 1rem; }
.track { display: flex; gap: 1.4rem; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.hcard { flex: none; width: clamp(150px, 15.5vw, 230px); aspect-ratio: 3/4; border-radius: 18px; overflow: hidden; position: relative; cursor: pointer; border: 0; padding: 0; text-align: left; opacity: .7; transform: scale(.94); transform-origin: left bottom; transition: opacity .4s, transform .4s; color: #fff; }
.hcard.on { opacity: 1; transform: none; }
.hshade { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 38%, rgba(4,20,34,.82) 100%); }
.hcap { position: absolute; left: 1rem; right: 1rem; bottom: 1rem; }
.hcap span { display: block; font: 500 .62rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; opacity: .85; margin-bottom: .45rem; }
.hcap b { font: 400 clamp(1.1rem, 1.7vw, 1.55rem)/1.05 var(--serif); display: block; }
.ctrl { display: flex; align-items: center; gap: 1rem; }
.arrow { width: 2.9rem; height: 2.9rem; border-radius: 50%; border: 0; background: rgba(255,255,255,.14); color: #fff; cursor: pointer; display: grid; place-items: center; backdrop-filter: blur(6px); }
.arrow:hover { background: rgba(255,255,255,.26); }
.segs { flex: 1; display: flex; gap: .45rem; padding: 0 .6rem; }
.segs i { flex: 1; height: 2px; background: rgba(255,255,255,.28); }
.segs i.on { background: #fff; }
.count { font: 400 2.2rem/1 var(--serif); }
@media (max-width: 860px) {
  .hero { min-height: 0; }
  .hero h1 { max-width: 100%; font-size: clamp(3.2rem, 14vw, 5.2rem); }
  .hero-in { min-height: 0; padding-bottom: 2rem; justify-content: flex-start; padding-top: 7.5rem; }
  .slider { position: relative; left: auto; right: auto; bottom: auto; width: min(1400px, 100% - 2*var(--gutter)); margin: 0 auto; padding-bottom: 2rem; }
  .hcard { width: 150px; }
}

/* CARDS */
.grid { display: grid; gap: clamp(1.2rem, 2.5vw, 2.4rem); grid-template-columns: 1fr; }
@media (min-width: 640px) { .grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 980px) { .grid { grid-template-columns: repeat(3, 1fr); } .grid.stagger > .card:nth-child(3n+2) { margin-top: 3.5rem; } }
.card-art { position: relative; display: block; width: 100%; aspect-ratio: 4/5; border-radius: 18px; overflow: hidden; border: 0; padding: 0; cursor: pointer; background: var(--card); }
.art { position: absolute; inset: 0; display: flex; flex-direction: column; }
.art-part { flex: 1; min-height: 0; }
.art-part svg { display: block; width: 100%; height: 100%; }
.card-thumbs { position: absolute; left: .8rem; bottom: .8rem; display: flex; }
.card-thumbs span { width: 2.9rem; height: 2.9rem; border-radius: 50%; overflow: hidden; border: 2.5px solid #fff; margin-left: -.6rem; flex: none; }
.card-thumbs span:first-child { margin-left: 0; }
.card-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card-top { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-top: 1.1rem; }
.card h3 { font-size: clamp(1.5rem, 2.2vw, 1.95rem); cursor: pointer; }
.card h3:hover { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
.num { font: 400 1.05rem var(--serif); color: var(--muted); flex: none; }
.card-meta { color: var(--muted); font-size: .98rem; margin-top: .5rem; }
.card-price { font: 400 1.7rem/1.1 var(--serif); margin-top: .9rem; }
.card-price small { font: 400 .88rem var(--sans); color: var(--muted); margin-left: .35rem; }
.card-actions { display: flex; gap: .4rem 1.4rem; margin-top: .9rem; flex-wrap: wrap; }
.link { background: none; border: 0; padding: 0; cursor: pointer; color: var(--accent); font-weight: 500; font-size: .98rem; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.sizer { display: flex; align-items: center; gap: .7rem 1.2rem; flex-wrap: wrap; margin: 0 0 2.4rem; }
.sizer b { font-weight: 500; }
.sizer-btns { display: flex; gap: .5rem; flex-wrap: wrap; }
.sizer-btns button { width: 2.8rem; height: 2.8rem; border-radius: 50%; border: 1.5px solid color-mix(in srgb, var(--ink) 30%, transparent); background: transparent; color: var(--ink); font: 400 1.25rem var(--serif); cursor: pointer; }
.sizer-btns button[aria-pressed="true"] { background: var(--pill); color: var(--pill-ink); border-color: var(--pill); }
.group-title { font-size: clamp(1.8rem, 3.4vw, 2.6rem); margin: 3.2rem 0 1.6rem; }
.note { color: var(--muted); font-size: .95rem; margin-top: 2.4rem; max-width: 44rem; }

/* SPLIT */
.split { display: grid; gap: clamp(2rem, 5vw, 5rem); grid-template-columns: 1fr; align-items: center; }
@media (min-width: 900px) { .split { grid-template-columns: 1.1fr 1fr; } .split.flip > :first-child { order: 2; } }
.split-art { position: relative; border-radius: 6px; aspect-ratio: 4/5; background: var(--card); }
.split-art .ph { position: absolute; inset: 0; border-radius: 6px; overflow: hidden; }
.split-art svg.scene { display: block; width: 100%; height: 100%; }
.cap { position: absolute; left: 38%; right: -1.2rem; bottom: -2rem; background: var(--bg); border-left: 2px solid var(--accent); padding: 1.3rem 1.6rem; box-shadow: 0 10px 40px rgba(8,30,50,.1); }
.cap small { display: block; font: 500 .72rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-bottom: .6rem; }
.cap p { color: var(--muted); font-size: .98rem; line-height: 1.5; }
@media (max-width: 899px) { .cap { left: 1rem; right: 1rem; bottom: -1.5rem; } }
.split h2 { font-size: clamp(2.3rem, 4.6vw, 4rem); margin: 1.2rem 0 1.4rem; max-width: 13ch; }
.split .lede { color: var(--muted); font-size: 1.12rem; max-width: 34rem; }
.ticks { list-style: none; margin: 1.8rem 0 2rem; padding: 1.6rem 0 0; border-top: 1px solid var(--line); display: grid; gap: .8rem; }
.ticks li { display: flex; gap: .8rem; color: var(--muted); }
.ticks li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--accent); margin-top: .78rem; flex: none; }

/* INCLUDED */
.inc-band { background: var(--card); }
.inc-grid { display: grid; gap: 1.2rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 860px) { .inc-grid { grid-template-columns: repeat(4, 1fr); } }
.inc { display: flex; flex-direction: column; gap: .9rem; padding: 1.5rem 0; border-top: 1px solid var(--line); }
.inc b { font: 400 1.5rem var(--serif); }
.ic { flex: none; width: 3rem; height: 3rem; border-radius: 50%; background: var(--pill); color: var(--pill-ink); display: grid; place-items: center; }
.extra { margin-top: 1.6rem; display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.4rem; border: 1.5px dashed color-mix(in srgb, var(--accent) 55%, transparent); border-radius: 14px; flex-wrap: wrap; }
.extra .t { flex: 1; min-width: 12rem; }
.extra b { font: 400 1.5rem var(--serif); white-space: nowrap; }

/* STAY */
.stay-grid { display: grid; gap: 1.4rem; grid-template-columns: 1fr; }
@media (min-width: 760px) { .stay-grid { grid-template-columns: 1fr 1fr; } }
.stay-card { padding: 2rem; border: 1px solid var(--line); border-radius: 6px; background: var(--paper); display: flex; flex-direction: column; gap: .8rem; }
.stay-card h3 { font-size: 2rem; }
.stay-card p { color: var(--muted); }
.facts { list-style: none; padding: 0; margin: .6rem 0 1rem; display: grid; gap: .5rem; }
.facts li { display: flex; justify-content: space-between; gap: 1rem; padding-bottom: .5rem; border-bottom: 1px solid var(--line); }
.facts li span:last-child { font-weight: 500; text-align: right; }

/* CONTACT */
.contact-grid { display: grid; gap: clamp(2rem, 5vw, 5rem); grid-template-columns: 1fr; }
@media (min-width: 900px) { .contact-grid { grid-template-columns: 1fr 1.1fr; } }
.dl { display: grid; gap: 1.4rem; margin: 0; }
.dl dt { font: 500 .78rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-bottom: .45rem; }
.dl dd { margin: 0; font: 400 1.6rem/1.2 var(--serif); overflow-wrap: anywhere; }
.dl a { text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.panel { background: var(--paper); border: 1px solid var(--line); border-radius: 8px; padding: clamp(1.4rem, 3vw, 2.2rem); }
.panel h3 { font-size: 2rem; margin-bottom: 1.2rem; }
label.lb, .lb { display: block; font-weight: 500; font-size: .92rem; margin: 0 0 .35rem; }
.field { margin-bottom: 1rem; }
input[type=text], input[type=date], input[type=number], select { width: 100%; font: 400 1rem var(--sans); color: var(--ink); background: var(--bg); border: 1.5px solid var(--line); border-radius: 10px; padding: .75rem .85rem; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 480px) { .row2 { grid-template-columns: 1fr; } }

/* BUILDER */
.b-block { margin-bottom: 2rem; }
.b-label { display: block; font-weight: 500; margin-bottom: .7rem; }
#budget { width: 100%; accent-color: var(--accent); }
.b-budget { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .3rem 1rem; margin-top: .4rem; }
.b-budget b { font: 400 2rem var(--serif); }
.b-budget span { color: var(--muted); align-self: center; }
.chips { display: flex; flex-wrap: wrap; gap: .55rem; }
.chip { position: relative; }
.chip input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; margin: 0; cursor: pointer; }
.chip span { display: inline-block; padding: .55rem 1.1rem; border: 1.5px solid color-mix(in srgb, var(--ink) 28%, transparent); border-radius: 999px; font-size: .98rem; }
.chip input:checked + span { background: var(--pill); color: var(--pill-ink); border-color: var(--pill); }
.chip input:focus-visible + span { outline: 3px solid var(--coral); outline-offset: 3px; }
.b-title { font-size: 2.2rem; margin: 2.4rem 0 .6rem; }

/* FOOTER */
footer { background: #07131E; color: #cfdde7; padding: clamp(3rem, 7vw, 5rem) 0 2.5rem; }
.foot { display: grid; gap: 2.5rem; grid-template-columns: 1fr; }
@media (min-width: 860px) { .foot { grid-template-columns: 1.4fr 1fr 1fr; } }
footer .logo svg { height: 250px; }
@media (max-width: 980px) { footer .logo svg { height: 230px; } }
footer h4 { font: 500 .75rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: #8fb9d6; margin-bottom: 1.1rem; }
footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
footer a { text-decoration: none; } footer a:hover { text-decoration: underline; }
.copy { margin-top: 3rem; padding-top: 1.4rem; border-top: 1px solid rgba(255,255,255,.12); font-size: .9rem; color: #7f98aa; }
.float-wa { position: fixed; right: 1rem; bottom: calc(1rem + env(safe-area-inset-bottom, 0px)); z-index: 40; box-shadow: 0 6px 22px rgba(0,0,0,.3); }
@media (min-width: 981px) { .float-wa { display: none; } }

/* DETAILS DIALOG */
dialog#detail { padding: 0; border: 0; border-radius: 20px; width: min(680px, 94vw); max-height: 90vh; background: var(--bg); color: var(--ink); overflow: auto; }
dialog#detail::backdrop { background: rgba(5,22,36,.7); }
.dlg { padding: clamp(1.3rem, 4vw, 2.2rem); }
.dlg-head { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; }
.dlg-head h3 { font-size: clamp(1.9rem, 5vw, 2.8rem); }
#dl-close { flex: none; width: 2.7rem; height: 2.7rem; border-radius: 50%; border: 1.5px solid var(--line); background: var(--bg); color: var(--ink); font: 400 1.6rem/1 var(--sans); cursor: pointer; }
.dl-start { display: flex; align-items: center; gap: .5rem; margin-top: .7rem; color: var(--accent); font-weight: 500; }
.dl-gal { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: .5rem; margin: 1.2rem 0; }
.dl-gal img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 12px; display: block; }
.dlg h4 { font: 400 1.5rem var(--serif); margin: 1.5rem 0 .6rem; }
.dl-prices { display: grid; grid-template-columns: repeat(6, 1fr); gap: .4rem; text-align: center; }
.dl-prices div { background: var(--card); border: 1.5px solid var(--line); border-radius: 10px; padding: .5rem .2rem; font: 400 1.35rem var(--serif); }
.dl-prices div[data-on="1"] { border-color: var(--accent); }
.dl-prices small { display: block; font: 400 .72rem var(--sans); color: var(--muted); }
@media (max-width: 480px) { .dl-prices { grid-template-columns: repeat(3, 1fr); } }
.dl-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: .8rem; }
.dl-list li { display: flex; align-items: center; gap: .7rem; font-weight: 500; }
.dl-act { padding: .75rem 0; border-top: 1px solid var(--line); }
.dl-act b { font: 400 1.25rem var(--serif); display: block; }
.dl-act span { color: var(--muted); }
.dl-note { color: var(--muted); font-size: .93rem; margin: 1.2rem 0; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .track, .hcard, .nav { transition: none; } }

/* SERVICES + DROPDOWN */
.has-sub { position: relative; }
.has-sub > a svg { margin-left: .2rem; vertical-align: -1px; }
.sub { display: none; position: absolute; top: 100%; left: -1rem; min-width: 14rem; padding: .7rem 0 0; }
.sub::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: .7rem; }
.has-sub:hover .sub, .has-sub:focus-within .sub { display: block; }
.sub a { display: block; padding: .8rem 1.1rem; border-radius: 0; color: #0E1B2A; background: #fff; opacity: 1; font-size: .96rem; border-bottom: 1px solid #EEF1F4; }
.sub a:nth-child(1) { border-radius: 14px 14px 0 0; }
.sub a:last-child { border-radius: 0 0 14px 14px; border-bottom: 0; }
.sub a:hover { background: #F3F6F9; }
.sub { filter: drop-shadow(0 12px 28px rgba(8,30,50,.18)); }
@media (max-width: 1290px) {
  .has-sub { width: 100%; }
  .sub { display: block; position: static; padding: 0 0 .4rem 1rem; filter: none; min-width: 0; }
  .sub::before { display: none; }
  .sub a { background: transparent; color: #cfe3f0; padding: .55rem 0; border-radius: 0; font-size: 1rem; border-bottom: 0; }
  .sub a:hover { background: transparent; }
  .has-sub > a svg { display: none; }
}
.svc-row { display: grid; gap: 1.2rem; grid-template-columns: 1fr; }
@media (min-width: 760px) { .svc-row { grid-template-columns: repeat(3, 1fr); } }
.svc { display: flex; flex-direction: column; gap: .8rem; padding: 1.8rem; border: 1px solid var(--line); border-radius: 6px; background: var(--paper); text-decoration: none; transition: border-color .2s; }
.svc:hover { border-color: var(--accent); }
.svc h3 { font-size: 1.9rem; }
.svc p { color: var(--muted); flex: 1; }
.svc .ic { width: 3.2rem; height: 3.2rem; }
.svc-photo-art{position:relative;overflow:hidden;padding:0}.svc-photo-art .art{position:absolute;inset:0;width:100%;height:100%}
#p-services.show-map>.wrap.page-head,#p-services.show-map #svc-hotel,#p-services.show-map #svc-photo,#p-services.show-map #svc-transfer{display:none}#p-services.show-map>.wrap:not(.page-head){padding-top:clamp(6.5rem,12vw,9rem)}#p-services.show-map #svc-transfer,#p-services.show-map #svc-map{margin-top:0}
.split-art.rent-gal{aspect-ratio:auto}.rent-gal .ph{position:relative;inset:auto;display:grid;grid-template-columns:1fr 1fr;gap:.6rem;padding:.7rem;place-items:stretch}.rent-gal figure{margin:0}.rent-gal figure:last-child{grid-column:1/3}.rent-gal svg{width:100%!important;height:auto!important;display:block;border-radius:8px}.rent-gal figcaption{color:#fff;font:600 .95rem Inter,system-ui,sans-serif;padding:.4rem .2rem 0}
#p-services.rent-only>.wrap.page-head,#p-services.rent-only #svc-photo,#p-services.rent-only #svc-transfer,#p-services.rent-only #svc-map{display:none}#p-services.rent-only>.wrap:not(.page-head){padding-top:clamp(6.5rem,12vw,9rem)}#p-services.rent-only #svc-hotel{margin-top:0}
#svc-map{display:none}#p-services.show-map #svc-map{display:block}#p-services.photo-only #svc-map{display:none}#svc-photo-view{display:none}#p-services.photo-only #svc-photo-view{display:block}#p-services.photo-only .svc-block,#p-services.photo-only>.wrap.page-head{display:none}
.pgrid{display:grid;gap:1.4rem;grid-template-columns:1fr}@media(min-width:820px){.pgrid{grid-template-columns:repeat(3,1fr)}}
.pcard{border:1px solid var(--line,#ddd);border-radius:6px;background:var(--paper,#fff);padding:1rem 1rem 1.4rem;display:flex;flex-direction:column;gap:.7rem}
.pcard-art{position:relative;aspect-ratio:4/5;border-radius:6px;overflow:hidden;background:linear-gradient(160deg,#0B3C5D,#12808F)}
.pcard-art .art{position:absolute;inset:0;width:100%;height:100%}
.pcard-ring{position:absolute;inset:0;display:grid;place-items:center;color:#fff}.pcard-ring svg{width:38%}
.pcard h3{font-size:1.6rem;margin:.3rem 0 0}.pcard p{color:var(--muted,#555);flex:1;margin:0}.pcard .pill{align-self:flex-start}
.tmap{max-width:880px}.tmap-head h2,.tmap-head h1{margin:.2rem 0 .3rem;font-size:clamp(1.6rem,3vw,2.2rem)}.tm-info{max-width:46rem;margin:.8rem 0 0}.tm-info p{margin:0 0 .55rem;line-height:1.6;opacity:.88}.tmap-ctl{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0}.tmap-ctl .field{margin:0}
.tmap-box{border-radius:8px;overflow:hidden;border:1px solid var(--line,#ddd)}#tm-svg{display:block;width:100%;height:auto}
.tm-isle{cursor:pointer}.tm-isle text{font:600 15px Inter,system-ui,sans-serif;fill:#fff;paint-order:stroke;stroke:#0B3C5D;stroke-width:3px;stroke-linejoin:round}
.tm-isle .tm-pin{pointer-events:all}.tm-isle ellipse,.tm-isle rect{transition:transform .25s}.tm-isle:hover ellipse,.tm-isle:hover rect{transform:scale(1.08)}
.tm-isle.on text{fill:#ffd166}.tm-isle.on ellipse:first-child,.tm-isle.on rect{filter:drop-shadow(0 0 8px #ffd166)}
.tm-waves{animation:tmw 5s ease-in-out infinite alternate}@keyframes tmw{to{transform:translateX(14px)}}
.tm-isle .tm-lab text{font:600 19px Georgia,"Times New Roman",serif;fill:#fff;stroke:none;paint-order:normal}.tm-isle .tm-lab rect{transition:fill .25s}.tm-isle.on .tm-lab rect{fill:#b11f2e}.tm-isle.on text{fill:#fff}.tm-isle.on ellipse:first-child{filter:none}.tm-isle:hover .tm-lab rect{fill:#12427a}
.tm-land{font:600 14px Georgia,serif;fill:#fff;stroke:#0a2748;stroke-width:3px;paint-order:stroke;stroke-linejoin:round}.tm-brand{font:700 26px Georgia,serif;fill:#fff;letter-spacing:.14em}.tm-brand2{font:500 13px Georgia,serif;fill:#ffd166;letter-spacing:.42em}.tm-nsew{font:600 11px Georgia,serif;fill:#fff}
#tm-path{animation:tmdash 1.2s linear infinite}@keyframes tmdash{to{stroke-dashoffset:-46}}@media(prefers-reduced-motion:reduce){#tm-path{animation:none}}
.tm-isle .tm-lab text{font:600 38px Georgia,"Times New Roman",serif}.tm-land{font:600 34px Georgia,serif;fill:#fff;stroke:#0a2748;stroke-width:6px;paint-order:stroke;stroke-linejoin:round}
.tm-brand{font:700 52px Georgia,serif;fill:#fff;letter-spacing:.14em}.tm-brand2{font:500 25px Georgia,serif;fill:#ffd166;letter-spacing:.42em}
.tm-ring{stroke:#fff;stroke-width:5;opacity:0;transition:opacity .25s}.tm-isle.on .tm-ring{opacity:1}
.tmap-box{overflow-x:auto}
.tmap-foot{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;margin-top:1rem}.tmap-route{font-family:var(--serif,Georgia,serif);font-size:1.5rem}
@media(prefers-reduced-motion:reduce){.tm-waves{animation:none}}
.svc-block { margin-top: clamp(3rem, 7vw, 6rem); }
.svc-block:first-child { margin-top: 0; }
.svc-art { display: grid; place-items: center; }
.svc-art.a1 { background: linear-gradient(160deg, #0B3C5D, #12808F); }
.svc-art.a2 { background: linear-gradient(160deg, #12808F, #4FC3C9); }
.svc-art.a3 { background: linear-gradient(160deg, #0B3C5D, #1E6FA5); }
.svc-art svg { width: 38%; height: auto; color: #fff; }
.btn-row { display: flex; flex-wrap: wrap; gap: .8rem; }

.nav.open { background: #0B2233; color: #fff; border-bottom: 0; backdrop-filter: none; -webkit-backdrop-filter: none; }
.nav.open .logo-c { display: none !important; }
.nav.open .logo-w { display: block !important; }
@media (max-width: 1290px) { .nav-links a.active::after { display: none; } .nav-links a.active { font-weight: 500; } }

.chk { display: flex; align-items: center; gap: .7rem; margin: .2rem 0 1rem; cursor: pointer; }
.chk input { width: 1.2rem; height: 1.2rem; accent-color: var(--accent); }
.quote { background: var(--card); border-radius: 10px; padding: .9rem 1rem; margin-bottom: 1.2rem; font-weight: 500; }
.quote:empty { display: none; }
.quote small { display: block; font-weight: 400; color: var(--muted); margin-top: .2rem; }
#dlsizer { margin-bottom: .4rem; }
.quote .tot { display: block; margin-top: .5rem; padding-top: .5rem; border-top: 1px solid var(--line); font: 400 1.7rem/1.1 var(--serif); }

/* CALENDAR + FINS */
.datefield { position: relative; }
.datebtn { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: .6rem; font: 400 1rem var(--sans); color: var(--ink); background: var(--bg); border: 1.5px solid var(--line); border-radius: 10px; padding: .75rem .85rem; cursor: pointer; text-align: left; }
.datebtn span.has { color: var(--ink); }
.datebtn span:not(.has) { color: var(--muted); }
.cal { position: absolute; z-index: 20; left: 0; top: calc(100% + .4rem); width: min(21rem, calc(100vw - 2.5rem)); background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 1rem; box-shadow: 0 18px 50px rgba(8,30,50,.18); }
.cal[hidden] { display: none; }
.cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .6rem; }
.cal-head b { font: 400 1.4rem var(--serif); }
.cal-nav { width: 2.4rem; height: 2.4rem; border-radius: 50%; border: 1.5px solid var(--line); background: var(--bg); cursor: pointer; display: grid; place-items: center; }
.cal-nav:disabled { opacity: .3; cursor: default; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: .15rem; text-align: center; }
.cal-grid .dow { font-size: .75rem; color: var(--muted); padding: .3rem 0; }
.cal-grid button { aspect-ratio: 1; border: 0; border-radius: 50%; background: transparent; color: var(--ink); font: 400 .95rem var(--sans); cursor: pointer; }
.cal-grid button:hover:not(:disabled) { background: var(--card); }
.cal-grid button:disabled { color: var(--muted); opacity: .38; cursor: default; }
.cal-grid button.today { box-shadow: inset 0 0 0 1.5px var(--accent); }
.cal-grid button.sel { background: var(--pill); color: var(--pill-ink); }
.hint { color: var(--muted); font-size: .88rem; margin-top: .5rem; }
.fin-row { display: grid; grid-template-columns: 6.5rem 1fr; gap: .6rem; align-items: center; margin-bottom: .55rem; }
.fin-row span { font-size: .95rem; color: var(--muted); }
.dl { align-content: start; }

.kidnote { display: inline-block; background: var(--card); border-radius: 12px; padding: .75rem 1rem; margin: -1rem 0 2rem; color: var(--muted); font-size: .98rem; max-width: 46rem; }
.kidnote b { color: var(--ink); font-weight: 500; }
.fin-row { grid-template-columns: 8.5rem 1fr; }

#wadlg { padding: 0; border: 0; border-radius: 20px; width: min(600px, 94vw); max-height: 90vh; background: var(--bg); color: var(--ink); overflow: auto; }
#wadlg::backdrop { background: rgba(5,22,36,.7); }
#wa-close { flex: none; width: 2.7rem; height: 2.7rem; border-radius: 50%; border: 1.5px solid var(--line); background: var(--bg); color: var(--ink); font: 400 1.6rem/1 var(--sans); cursor: pointer; }
#wa-title { font-size: clamp(1.7rem, 4.5vw, 2.4rem); }
.wa-lede { color: var(--muted); margin: .8rem 0 1rem; }
.wa-lede b { color: var(--ink); font-weight: 500; }
#wa-msg { width: 100%; font: 400 .98rem/1.5 var(--sans); color: var(--ink); background: var(--card); border: 1.5px solid var(--line); border-radius: 12px; padding: .9rem 1rem; resize: vertical; }

/* REAL PHOTOS */
.art-photo { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 52%; }
.hero-photo { position: absolute; inset: 0; background-size: cover; background-position: 50% 50%; opacity: 0; transition: opacity .8s ease; }
.hero.photo .hero-photo { opacity: 1; }
.hero.photo .hero-bg svg { opacity: .25; }
.hero.photo .hero-bg::after { background: linear-gradient(90deg, rgba(3,22,38,.62) 0%, rgba(3,22,38,.26) 52%, rgba(3,22,38,.04) 100%); }
.hero-bg::after { z-index: 1; } .hero-bg svg { z-index: 1; }
.dl-photo { width: 100%; height: clamp(220px, 42vw, 320px); object-fit: cover; object-position: 50% 52%; border-radius: 14px; margin-top: 1.2rem; }
@media (prefers-reduced-motion: reduce) { .hero-photo { transition: none; } }

.art-clip { object-position: 50% 62%; }
.dl-photo.portrait { width: auto; max-width: 100%; height: auto; max-height: min(460px, 62vh); margin: 1.2rem auto 0; display: block; }
.clip-manta { object-position: 50% 42%; }

/* clip sequences (video, then next video) */
.clip-seq { position: absolute; inset: 0; background: var(--card); }
.clip-seq .slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .4s ease; }
.clip-seq .slide.on { opacity: 1; }
.clip-shark { object-position: 50% 82%; }
.dl-clip { position: relative; width: min(100%, 380px); aspect-ratio: 4/5; margin: 1.2rem auto 0; border-radius: 14px; overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .clip-seq .slide { transition: none; } }
.clip-sandbank { object-position: 50% 50%; }
.clip-coral { object-position: 50% 50%; }

/* SINGLE TRIPS */
.big-title { font-size: clamp(2.3rem, 5vw, 3.8rem); margin: 4.5rem 0 1rem; }
.cat-head { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem 1rem; margin: 3rem 0 1.4rem; padding-top: 1.4rem; border-top: 1px solid var(--line); }
.cat-head h3 { font-size: clamp(1.7rem, 3.2vw, 2.4rem); }
.tag { font: 600 .72rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; background: var(--coral); color: #1a0a05; padding: .45rem .7rem; border-radius: 999px; }
.svc-row.four { grid-template-columns: 1fr; }
@media (min-width: 640px) { .svc-row.four { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .svc-row.four { grid-template-columns: repeat(4, 1fr); } }
.svc small { color: var(--accent); font-weight: 500; font-size: .95rem; }

/* TRIP DETAILS (from the trip flyers) */
.checks { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.checks.two { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.checks li { display: flex; gap: .75rem; align-items: flex-start; }
.checks li::before { content: "\2713"; flex: none; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--accent); color: #fff; font-size: .82rem; font-weight: 700; display: grid; place-items: center; margin-top: .12rem; }
.dl-info { background: var(--card); border-radius: 14px; padding: 1.1rem 1.2rem; display: grid; gap: .8rem; color: var(--muted); }
.dl-info p { margin: 0; }

/* gentle zoom when the mouse is over a trip (computers only) */
@media (hover: hover) and (pointer: fine) {
  .card { transition: transform .4s cubic-bezier(.2,.7,.2,1); }
  .card:hover { transform: scale(1.035); position: relative; z-index: 3; }
  .card .card-art .art, .card .card-art .clip-seq { transition: transform .7s cubic-bezier(.2,.7,.2,1); }
  .card:hover .card-art .art, .card:hover .card-art .clip-seq { transform: scale(1.05); }
  .hcard:hover { transform: scale(1.035); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .card, .card .card-art .art, .card .card-art .clip-seq { transition: none; } .card:hover, .card:hover .card-art .art, .card:hover .card-art .clip-seq, .hcard:hover { transform: none; } }

/* animated jump buttons: a manta ray swims across the button */
.pill.jump { position: relative; overflow: hidden; gap: .55rem; isolation: isolate; transition: color .3s, border-color .3s, transform .25s cubic-bezier(.2,.7,.2,1), box-shadow .3s; }
.pill.jump::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: rgba(18,128,143,.16); z-index: -1; }
.pill.jump .manta { position: absolute; left: -54px; top: 50%; width: 40px; height: 45px; margin-top: -22px; opacity: 0; color: var(--lagoon); z-index: 2; pointer-events: none; }
.pill.jump .manta svg { display: block; width: 100%; height: 100%; }
.pill.jump:active { transform: scale(.96); }
@media (hover: hover) and (pointer: fine) {
  .pill.jump:hover { color: var(--reef); border-color: var(--reef); transform: translateY(-2px); box-shadow: 0 10px 24px rgba(18,128,143,.2); filter: none; }
}
.pill.jump.go, .pill.jump.go:hover { color: var(--reef); border-color: var(--reef); }
@media (hover: hover) and (pointer: fine) {
  .pill.jump:hover::before { animation: trail 1.6s ease-in-out forwards; }
  .pill.jump:hover .manta { animation: glide 1.6s ease-in-out forwards; }
  .pill.jump:hover .manta svg { animation: flap .55s ease-in-out infinite; }
}
.pill.jump.go::before { animation: trail 1.6s ease-in-out forwards; }
.pill.jump.go .manta { animation: glide 1.6s ease-in-out forwards; }
.pill.jump.go .manta svg { animation: flap .55s ease-in-out infinite; }
@keyframes glide { 0% { left: -54px; opacity: 0; margin-top: -19px; } 12% { opacity: 1; } 50% { margin-top: -26px; } 88% { opacity: 1; } 100% { left: calc(100% + 14px); opacity: 0; margin-top: -21px; } }
@keyframes trail { from { width: 0; } to { width: 100%; } }
@keyframes flap { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(.7); } }
@keyframes rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
#p-excursions.on .pill.jump { animation: rise .6s cubic-bezier(.2,.7,.2,1) backwards; }
#p-excursions.on .pill.jump + .pill.jump { animation-delay: .12s; }
@media (prefers-reduced-motion: reduce) { #p-excursions.on .pill.jump, .pill.jump::before, .pill.jump .manta, .pill.jump .manta svg { animation: none !important; } .pill.jump { transition: none; } }

/* LANGUAGE BUTTON */
.lang { position: relative; flex: none; margin-left: auto; }
.nav-in > .lang { margin-left: 0; }
.langbtn { display: inline-flex; align-items: center; gap: .45rem; height: 2.7rem; padding: 0 .85rem; border-radius: 999px; border: 1.5px solid currentColor; background: transparent; color: inherit; font: 500 .85rem var(--sans); cursor: pointer; opacity: .96; transition: background .25s, opacity .25s; }
.langbtn:hover { opacity: 1; background: rgba(255,255,255,.14); }
.nav.solid .langbtn:hover { background: rgba(14,27,42,.07); }
.langmenu { position: absolute; right: 0; top: calc(100% + .6rem); min-width: 12rem; margin: 0; padding: .4rem; list-style: none; background: #fff; color: #0E1B2A; border-radius: 14px; box-shadow: 0 18px 44px rgba(8,30,50,.25); z-index: 60; }
.langmenu[hidden] { display: none; }
.langmenu button { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .65rem .85rem; border: 0; background: transparent; border-radius: 10px; font: 500 .98rem var(--sans); color: inherit; cursor: pointer; text-align: left; }
.langmenu button:hover { background: #F3F6F9; }
.langmenu button[aria-current="true"] { background: #E6F6F5; }
.langmenu .code { font-size: .75rem; color: #566272; letter-spacing: .08em; }
@media (max-width: 1290px) { .nav-in { gap: .8rem; } .lang { margin-left: auto; } }
/* other writing systems */
html:lang(zh-CN) { --sans: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif; --serif: "Songti SC", "Noto Serif SC", "Source Han Serif SC", "SimSun", serif; }
html:lang(zh-CN) .eyebrow, html:lang(zh-CN) .hero h1 { letter-spacing: 0; }
.hero h1, .page-head h1, .sec-top h2, .split h2, .card h3 { overflow-wrap: anywhere; hyphens: auto; }

/* longer words in other languages: keep the menu on one line */
.nav-links a, .nav .pill.book, .langbtn { white-space: nowrap; }
html:not([lang="en"]) .nav-links { gap: 1.05rem; }
html:not([lang="en"]) .nav-links a, html:not([lang="en"]) .nav .pill.book { font-size: .9rem; }
html:not([lang="en"]) .nav .pill.book { padding-left: 1.2rem; padding-right: 1.2rem; }

/* fin size + mask size on one row */
.fin-row { grid-template-columns: 8rem 1fr 1fr; align-items: end; margin-bottom: .8rem; }
.fin-row > span { padding-bottom: .9rem; }
.fin-sel { display: grid; gap: .25rem; margin: 0; }
.fin-sel small { font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
@media (max-width: 640px) {
  .fin-row { grid-template-columns: 1fr 1fr; align-items: start; }
  .fin-row > span { grid-column: 1 / -1; padding-bottom: 0; color: var(--ink); font-weight: 500; }
}

#p-excursions.on .pill.jump + .pill.jump + .pill.jump { animation-delay: .24s; }

.benefits { margin: .2rem 0 2.2rem; max-width: 42rem; }
.benefits li { font-size: 1.05rem; }

.chip-hint { margin: -.2rem 0 .9rem; color: var(--muted); font-size: .96rem; }
.chip-hint.full { color: var(--coral); font-weight: 500; }
.chip.locked span { opacity: .38; }
.chip.locked input { cursor: not-allowed; }

/* pictures of the chosen activities */
.pv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 1rem; max-width: 820px; margin: 0 0 2.4rem; }
.pv { margin: 0; }
.pv-art { position: relative; aspect-ratio: 4 / 5; border-radius: 16px; overflow: hidden; background: var(--card); }
.pv-art > svg { width: 100%; height: 100%; display: block; }
.pv figcaption { margin-top: .6rem; font-size: 1rem; font-weight: 500; }

/* booking form on the Build your trip page */
#build-book-slot { margin-top: 3.2rem; }
#build-book-slot .panel { max-width: 680px; }
.split-art.has-grid{aspect-ratio:auto}.split-art.has-grid .ph{position:relative;inset:auto;aspect-ratio:4/5;overflow:visible}.split-art.has-grid .cap{position:static;margin-top:1rem;box-shadow:none;padding:1rem 1.2rem}
.ph-grid{display:grid!important;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:.5rem;background:#fff}.ph-grid figure{margin:0;position:relative;overflow:hidden;border-radius:6px;background:linear-gradient(160deg,#0B3C5D,#12808F)}.ph-grid img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}.ph-grid figcaption{position:absolute;left:.5rem;bottom:.5rem;background:rgba(0,0,0,.55);color:#fff;font-size:.78rem;padding:.2rem .55rem;border-radius:99px}


.st-age { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; align-items: center; margin-bottom: .7rem; }
#stay-panel .row2 { margin-bottom: 0; }
#stay-panel #st-send { margin-top: .6rem; }

/* from - to range in the calendar, and the + / - buttons */
.cal-grid button.range { background: color-mix(in srgb, var(--accent) 18%, transparent); border-radius: 0; }
.stepper { display: flex; align-items: center; justify-content: space-between; gap: .6rem; border: 1.5px solid var(--line); border-radius: 12px; background: var(--bg); padding: .35rem; }
.stepper button { width: 2.6rem; height: 2.6rem; border-radius: 50%; border: 1.5px solid var(--line); background: var(--paper); color: var(--ink); font: 400 1.4rem var(--sans); line-height: 1; cursor: pointer; }
.stepper button:hover:not(:disabled) { background: var(--card); }
.stepper button:disabled { opacity: .3; cursor: default; }
.stepper output { flex: 1; text-align: center; font: 400 1.5rem var(--serif); }
#st-datefield .datebtn { width: 100%; }


.rg-tabs{display:flex;gap:.5rem;margin:0 0 .6rem}.rg-tabs button{position:static;transform:none;width:auto;height:auto;border-radius:99px;border:1px solid var(--line,#ccc);background:transparent;color:inherit;font:inherit;font-size:.85rem;padding:.35rem .9rem;cursor:pointer}.rg-tabs button.on{background:var(--ink,#0d1b2a);color:#fff;border-color:transparent}
.rg-info{margin-top:.8rem}.rg-bed{margin:0 0 .6rem;font-size:.95rem}.rg-feat{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}.rg-feat li{font-size:.8rem;padding:.25rem .65rem;border:1px solid var(--line,#ddd);border-radius:99px;color:var(--muted,#555)}.rg-info[hidden]{display:none}
.rgal{margin:.2rem 0 .4rem}
.rgal-view{position:relative;aspect-ratio:4/3;border-radius:6px;overflow:hidden;background:#e9e4da}
.rgal-view img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .35s}
.rgal-view img.on{opacity:1}
.rgal-view button{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.88);color:#222;font-size:1.6rem;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0 0 3px}
.rgal .rg-prev{left:.6rem}.rgal .rg-next{right:.6rem}
.rgal-view button:hover{background:#fff}
.rg-tag{position:absolute;left:.7rem;bottom:.7rem;background:rgba(0,0,0,.55);color:#fff;font-size:.78rem;padding:.25rem .6rem;border-radius:99px}
.rg-dots{display:flex;gap:.45rem;justify-content:center;margin-top:.6rem}
.rg-dots i{width:8px;height:8px;border-radius:50%;background:#c9c3b6;cursor:pointer}
.rg-dots i.on{background:var(--ink,#222)}

.rent-sel{display:grid;gap:.6rem;margin:1.2rem 0 1.4rem}
.rs-row{border:1px solid #d9e2ea;border-radius:14px;padding:.7rem .9rem;background:#fff;transition:border-color .15s,box-shadow .15s}
.rs-row.on{border-color:#1f6f8b;box-shadow:0 0 0 2px rgba(31,111,139,.15)}
.rs-head{display:flex;align-items:center;gap:.7rem;cursor:pointer;font-weight:600;color:#14233a}
.rs-head input{width:20px;height:20px;accent-color:#1f6f8b;flex:none}
.rs-head .ri{color:#1f6f8b;flex:none}
.rs-ctl{display:none;flex-wrap:wrap;gap:.5rem .8rem;align-items:center;margin-top:.6rem;padding-left:2.2rem}
.rs-row.on .rs-ctl{display:flex}
.rs-ctl select{font:inherit;font-size:.95rem;padding:.4rem .6rem;border:1px solid #c5d2dc;border-radius:8px;background:#fff;color:#14233a;max-width:100%}
.rs-ctl label{font-size:.9rem;color:#4a5a6e;display:flex;align-items:center;gap:.4rem}
.rs-size[hidden]{display:none}
.rs-total{display:flex;justify-content:space-between;align-items:center;padding:.4rem .2rem;font-size:1.1rem;color:#14233a}
.rs-note{margin:0;font-size:.9rem;color:#5a6a7e}
.rent-sel + .btn-row .pill.wa[disabled]{opacity:.45;pointer-events:none}

.rent-sel .rs-ctl select{width:auto;display:inline-block}
.rent-sel .rs-ctl label{display:flex;margin:0;width:auto}
.rent-sel .rs-head{display:flex;margin:0}
.rent-sel svg.ri{width:30px;height:30px;display:block}
.rent-sel .rs-size{flex-wrap:wrap;gap:.4rem .6rem}.rent-sel .rs-n{font-size:.8rem;color:#5a6a7e}
.rent-sel .rs-total span,.rent-sel .rs-total b{display:inline}
.rent-sel .rs-total b{margin-left:auto}