/* ============================================================
   EX-CORE — EastXperience master design system
   Shared primitives for all product pages.
   Per-page palette is overridden in <style data-theme>
   ============================================================ */

:root {
  /* ─── BRAND CONSTANTS (do not override per page) ─── */
  --brand-red: #CC1F1F;
  --brand-blue: #1E4ED8;
  --wa-green: #25D366;

  /* ─── THEME TOKENS (override per page) ─── */
  --bg:         #F6F1E7;   /* page background */
  --surface:    #FFFFFF;
  --ink:        #0B1F17;   /* primary text / deep brand */
  --muted:      #6B7280;
  --accent:     #C98E5B;   /* CTA accent / highlight */
  --accent-2:   #C9A24B;
  --line:       rgba(11,31,23,.08);
  --overlay-hero:
    linear-gradient(to right,
      rgba(11,31,23,.78) 0%,
      rgba(11,31,23,.62) 38%,
      rgba(11,31,23,.28) 70%,
      rgba(11,31,23,.12) 100%),
    linear-gradient(to top,
      rgba(11,31,23,.55) 0%,
      transparent 34%);

  /* ─── SHAPE / MOTION ─── */
  --r-sm: 12px;
  --r-md: 20px;
  --r-lg: 28px;
  --r-pill: 9999px;
  --t-fast: 180ms ease;
  --t: 240ms ease;
  --shadow-soft: 0 10px 32px -12px rgba(11,31,23,.25);
  --shadow-lux:  0 30px 80px -28px rgba(11,31,23,.45);
}

* , *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  background: var(--bg);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }

/* ─── TYPOGRAPHY ─── */
h1, h2, h3, .serif {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 300;
  letter-spacing: -.025em;
  line-height: 1.08;
}
h1 em, h2 em { font-style: italic; color: var(--accent); }
.eyebrow {
  font-size: 10.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .18em;
  color: var(--accent);
}

/* ─── LAYOUT ─── */
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 22px; }
.sec  { padding: clamp(56px, 9vw, 110px) 0; }
.sec-head { margin-bottom: clamp(32px, 5vw, 56px); }
.sec-head h2 { font-size: clamp(30px, 4.8vw, 56px); margin: 10px 0 12px; }
.sec-head p  { color: var(--muted); font-size: 16px; max-width: 560px; line-height: 1.65; }
.sec-head.center { text-align: center; }
.sec-head.center p { margin: 0 auto; }

/* ─── BUTTONS (reusable, palette follows vars) ─── */
.btn {
  display: inline-flex; align-items: center; gap: .55rem;
  padding: 16px 28px; border-radius: var(--r-pill);
  font-family: 'Fraunces', serif; font-weight: 600; font-size: 15.5px;
  text-decoration: none; letter-spacing: -.01em;
  transition: transform var(--t), box-shadow var(--t), background var(--t), color var(--t);
  min-height: 48px; cursor: pointer; border: none;
}
.btn-primary { background: var(--ink); color: #fff; }
.btn-primary:hover { transform: translateY(-2px); box-shadow: var(--shadow-lux); }
.btn-light { background: #fff; color: var(--ink); }
.btn-light:hover { transform: translateY(-2px); box-shadow: 0 16px 44px rgba(255,255,255,.25); }
.btn-ghost {
  background: rgba(255,255,255,.08); color: #fff;
  border: 1.5px solid rgba(255,255,255,.22); backdrop-filter: blur(8px);
}
.btn-ghost:hover { background: rgba(255,255,255,.15); }
.btn-wa { background: var(--wa-green); color: #0B1F17; }
.btn-wa:hover { background: #1fb957; transform: translateY(-2px); }
.btn-outline {
  background: transparent; color: var(--ink);
  border: 1.5px solid var(--line);
}
.btn-outline:hover { border-color: var(--accent); color: var(--accent); }

/* ─── HEADER ─── */
.site-header {
  position: sticky; top: 0; z-index: 80;
  background: rgba(246,241,231,.92);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid var(--line);
}
.hdr {
  max-width: 1180px; margin: 0 auto; padding: 0 20px; height: 60px;
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.hdr-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); }
.hdr-brand img { width: 34px; height: 34px; }
.hdr-brand span { font-family: 'Fraunces', serif; font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.hdr-back { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; color: rgba(11,31,23,.5); text-decoration: none; transition: color var(--t); }
.hdr-back:hover { color: var(--ink); }
.hdr-right { display: flex; align-items: center; gap: 10px; }
.hdr-wa {
  display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px;
  border-radius: var(--r-pill); background: var(--ink); color: #fff;
  font-size: 12.5px; font-weight: 600; text-decoration: none; transition: all var(--t);
}
.hdr-wa:hover { transform: translateY(-1px); box-shadow: var(--shadow-soft); }
.lang-btn {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 6px 12px; border-radius: var(--r-pill);
  border: 1.5px solid var(--line); background: transparent;
  font-size: 12px; font-weight: 600; color: var(--muted); cursor: pointer;
  font-family: 'Inter', sans-serif;
}
.lang-btn:hover { border-color: var(--accent); color: var(--accent); }

/* ─── STAT STRIP ─── */
.stat-bar { background: var(--ink); }
.stats { max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: repeat(4,1fr); }
.stat { padding: 22px 18px; text-align: center; border-right: 1px solid rgba(255,255,255,.06); }
.stat:last-child { border-right: none; }
.stat-n { font-family: 'Fraunces', serif; font-size: clamp(22px, 3.4vw, 34px); color: var(--accent); line-height: 1; }
.stat-l { margin-top: 4px; font-size: 11px; text-transform: uppercase; letter-spacing: .11em; color: rgba(255,255,255,.46); }

/* ─── TRUST STRIP ─── */
.trust-strip { background: var(--ink); padding: 16px 0; }
.trust-inner { max-width: 1180px; margin: 0 auto; padding: 0 22px; display: flex; flex-wrap: wrap; justify-content: center; }
.trust-item { display: flex; align-items: center; gap: 8px; padding: 6px 20px; border-right: 1px solid rgba(255,255,255,.08); }
.trust-item:last-child { border-right: none; }
.trust-item-text { font-size: 12px; font-weight: 500; color: rgba(255,255,255,.74); white-space: nowrap; }

/* ─── HERO SHELL ─── */
.hero {
  position: relative; min-height: 100svh; overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 0 0 clamp(60px, 10vw, 110px);
}
.hero-bg { position: absolute; inset: 0; z-index: 0; }
.hero-img {
  position: absolute; inset: 0; background-size: cover; background-position: center;
  opacity: .88; animation: heroZoom 12s ease-out forwards;
}
@keyframes heroZoom { from { transform: scale(1); } to { transform: scale(1.08); } }
.hero-bg::before { content: ""; position: absolute; inset: 0; background: var(--overlay-hero); z-index: 1; }
.hero-grain {
  position: absolute; inset: 0; z-index: 2; opacity: .04; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 220px;
}
.hero-inner { position: relative; z-index: 4; max-width: 1180px; margin: 0 auto; padding: 0 22px; width: 100%; color: #fff; }
.hero-badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.hbadge {
  padding: 6px 13px; border-radius: var(--r-pill);
  font-size: 11.5px; font-weight: 600; letter-spacing: .04em;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.86); backdrop-filter: blur(6px);
}
.hbadge.live { border-color: rgba(120,220,120,.3); background: rgba(60,140,60,.15); color: rgba(180,240,190,.92); }
.hbadge.live::before { content: "● "; font-size: 7px; animation: blink 2s ease infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:.3} }
.hero h1 { font-size: clamp(42px, 7.4vw, 86px); max-width: 820px; margin-bottom: 20px; color: #fff; }
.hero-sub { font-size: clamp(15px, 2.2vw, 19px); color: rgba(255,255,255,.78); max-width: 580px; line-height: 1.65; margin-bottom: 30px; }
.hero-ctas { display: flex; flex-wrap: wrap; gap: 12px; }

/* ─── PRICE BLOCK ─── */
.price-block {
  display: inline-flex; flex-direction: column; gap: 2px;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(8px); border-radius: 16px; padding: 14px 20px;
}
.price-from { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; color: rgba(255,255,255,.5); }
.price-main { font-family: 'Fraunces', serif; font-size: 28px; color: #fff; line-height: 1; }
.price-usd  { font-size: 12px; color: rgba(255,255,255,.5); }

/* ─── PHOTO GRID ─── */
.pg {
  display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 260px 260px;
  gap: 10px; border-radius: var(--r-lg); overflow: hidden;
}
.pg-item { position: relative; overflow: hidden; background: var(--ink); }
.pg-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.22,.61,.36,1); }
.pg-item:hover img { transform: scale(1.06); }
.pg-item::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(11,31,23,.48) 0%, rgba(11,31,23,.08) 45%, transparent 70%); }
.pg-cap { position: absolute; bottom: 14px; left: 16px; z-index: 2; font-family: 'Fraunces', serif; font-style: italic; font-size: 13.5px; color: rgba(255,255,255,.78); }
.pg-1 { grid-row: 1 / 3; }
.pg-4 { grid-column: 2 / 4; }

/* ─── ITINERARY CARD ─── */
.itin-card { background: #fff; border: 1.5px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }
.itin-head { background: var(--ink); padding: 22px 24px; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.itin-eyebrow { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .12em; color: rgba(255,255,255,.45); margin-bottom: 4px; }
.itin-title { font-family: 'Fraunces', serif; font-size: 20px; color: #fff; font-style: italic; }
.itin-sub   { margin-top: 4px; font-family: 'Fraunces', serif; font-style: italic; font-size: 12.5px; color: var(--accent); letter-spacing: .02em; }
.itin-tag   { padding: 5px 13px; background: rgba(201,142,91,.16); border: 1px solid rgba(201,142,91,.32); border-radius: var(--r-pill); font-size: 11px; font-weight: 600; color: var(--accent); text-transform: uppercase; letter-spacing: .07em; flex-shrink: 0; }
.itin-body  { padding: 18px 24px; }
.ev { display: flex; gap: 14px; padding: 11px 0; border-bottom: 1px solid rgba(11,31,23,.06); }
.ev:last-child { border-bottom: none; padding-bottom: 0; }
.ev-time { font-size: 11px; font-weight: 700; color: var(--accent); min-width: 56px; padding-top: 2px; text-transform: uppercase; letter-spacing: .04em; }
.ev-title { font-size: 14px; font-weight: 600; color: var(--ink); margin-bottom: 2px; }
.ev-desc  { font-size: 12.5px; color: var(--muted); line-height: 1.55; }

/* ─── COMPARISON TABLE ─── */
.comp-wrap { overflow: auto; border-radius: var(--r-lg); box-shadow: var(--shadow-lux); }
.comp-wrap table { width: 100%; border-collapse: collapse; background: #fff; min-width: 480px; }
.comp-wrap thead tr { background: var(--ink); }
.comp-wrap thead th { padding: 16px 20px; text-align: left; font-family: 'Fraunces', serif; font-size: 15px; font-weight: 400; color: #fff; }
.comp-wrap thead th:first-child { font-size: 12.5px; color: rgba(255,255,255,.38); }
.comp-wrap tbody tr { border-bottom: 1px solid var(--line); }
.comp-wrap tbody tr:last-child { border-bottom: none; }
.comp-wrap td { padding: 14px 20px; font-size: 14px; }
.comp-wrap td:first-child { font-size: 13px; color: var(--muted); }
.comp-wrap td.yes { color: var(--ink); font-weight: 600; }
.comp-wrap td.no  { color: rgba(11,31,23,.26); }

/* ─── FAQ ─── */
.faq { background: #fff; border: 1.5px solid var(--line); border-radius: var(--r-md); margin-bottom: 10px; overflow: hidden; }
.faq summary { padding: 18px 22px; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 12px; font-weight: 600; font-size: 15px; list-style: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-family: 'Fraunces', serif; font-size: 22px; color: var(--accent); transition: transform var(--t); }
.faq[open] summary::after { transform: rotate(45deg); }
.faq-body { padding: 0 22px 20px; color: var(--muted); font-size: 14.5px; line-height: 1.7; }

/* ─── FINAL CTA ─── */
.cta-fin { background: var(--ink); padding: clamp(72px, 10vw, 120px) 0; text-align: center; position: relative; overflow: hidden; }
.cta-fin::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 70% 60% at 50% 50%, rgba(201,142,91,.08) 0%, transparent 70%); }
.cta-fin .wrap { position: relative; z-index: 1; }
.cta-fin h2 { font-size: clamp(32px, 5vw, 60px); color: #fff; font-style: italic; margin-bottom: 14px; }
.cta-fin p  { max-width: 540px; margin: 0 auto 36px; color: rgba(255,255,255,.62); font-size: 17px; line-height: 1.65; }

/* ─── FOOTER ─── */
.site-footer { padding: 44px 22px; text-align: center; color: var(--muted); font-size: 13px; border-top: 1px solid var(--line); background: var(--bg); }
.site-footer a { color: var(--accent); text-decoration: none; font-weight: 500; }
.site-footer a:hover { text-decoration: underline; }

/* ─── STICKY MOBILE BAR ─── */
.sticky-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 90;
  background: rgba(246,241,231,.97); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-top: 1px solid var(--line); padding: 10px 16px;
  padding-bottom: calc(10px + env(safe-area-inset-bottom));
  display: flex; gap: 10px; align-items: center;
}
.sticky-bar .btn { flex: 1; padding: 14px 18px; font-size: 14.5px; min-height: 46px; }
.sticky-bar .btn-outline { flex: 0 0 auto; background: #fff; }

/* ─── REVEAL ON SCROLL ─── */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity .8s ease, transform .8s ease; }
.reveal.in { opacity: 1; transform: none; }

/* ─── MOBILE ─── */
@media (max-width: 860px) {
  .pg { grid-template-columns: 1fr 1fr; grid-template-rows: 200px 200px 200px; }
  .pg-1 { grid-row: 1 / 2; grid-column: 1 / 3; }
  .pg-4 { grid-column: 1 / 3; }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .stat:nth-child(2) { border-right: none; }
  .stat:nth-child(1), .stat:nth-child(2) { border-bottom: 1px solid rgba(255,255,255,.06); }
}

/* ============================================================
   BOOKING ENGINE — shared primitives (used by all book-*.html)
   ============================================================ */
.book-shell { display: grid; grid-template-columns: 1fr 380px; gap: 36px; max-width: 1180px; margin: 0 auto; padding: 36px 22px clamp(120px, 14vw, 180px); }
@media (max-width: 980px) { .book-shell { grid-template-columns: 1fr; gap: 20px; padding: 24px 18px 180px; } }

.book-hero {
  position: relative; border-radius: var(--r-lg); overflow: hidden;
  min-height: 200px; display: flex; flex-direction: column; justify-content: flex-end;
  padding: 28px 30px; color: #fff; margin-bottom: 28px;
}
.book-hero::before { content: ""; position: absolute; inset: 0; background-size: cover; background-position: center; z-index: 0; }
.book-hero::after  { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(11,31,23,.85) 0%, rgba(11,31,23,.45) 55%, rgba(11,31,23,.2) 100%); z-index: 1; }
.book-hero > * { position: relative; z-index: 2; }
.book-hero .eyebrow { color: rgba(255,255,255,.72); }
.book-hero h1 { font-size: clamp(24px, 3.6vw, 36px); color: #fff; margin: 6px 0 4px; }
.book-hero p  { font-size: 14px; color: rgba(255,255,255,.76); max-width: 560px; line-height: 1.55; }
@media (max-width: 680px) { .book-hero { min-height: 170px; padding: 22px 22px; margin-bottom: 20px; } }

.book-steps { display: flex; gap: 8px; align-items: center; margin-bottom: 24px; flex-wrap: wrap; }
.book-step { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); }
.book-step .s-n {
  width: 22px; height: 22px; border-radius: 50%;
  background: rgba(11,31,23,.06); color: var(--muted);
  display: grid; place-items: center;
  font-family: 'Fraunces', serif; font-size: 12px; font-weight: 600;
}
.book-step.active .s-n { background: var(--accent); color: #fff; }
.book-step.active { color: var(--ink); font-weight: 600; }
.book-step-divider { width: 22px; height: 1px; background: var(--line); }

.book-card {
  background: #fff; border: 1.5px solid var(--line); border-radius: var(--r-lg);
  padding: 28px 28px 24px; margin-bottom: 18px;
}
@media (max-width: 680px) { .book-card { padding: 22px 20px 18px; } }
.book-card h2 {
  font-family: 'Fraunces', serif; font-size: 22px; font-weight: 400;
  letter-spacing: -.015em; margin-bottom: 4px;
}
.book-card .sub { font-size: 13.5px; color: var(--muted); margin-bottom: 22px; line-height: 1.55; }

.field { margin-bottom: 18px; }
.field label, .field .lbl {
  display: block; font-size: 12px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-bottom: 8px;
}
.field input, .field select, .field textarea {
  width: 100%; padding: 14px 16px; font-family: 'Inter', sans-serif; font-size: 15px;
  color: var(--ink); background: var(--bg); border: 1.5px solid var(--line);
  border-radius: 12px; transition: border-color var(--t), background var(--t), box-shadow var(--t);
  -webkit-appearance: none; appearance: none; min-height: 48px;
}
.field textarea { min-height: 100px; resize: vertical; line-height: 1.55; }
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none; border-color: var(--accent); background: #fff;
  box-shadow: 0 0 0 3px rgba(201,142,91,.12);
}
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 520px) { .field-row { grid-template-columns: 1fr; gap: 0; } }
.field .hint { font-size: 12px; color: var(--muted); margin-top: 6px; line-height: 1.5; font-style: italic; font-family: 'Fraunces', serif; }
.field select {
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236B7280' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 18px center;
  padding-right: 42px;
}

/* Option tiles (radio group) */
.opt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 520px) { .opt-grid { grid-template-columns: 1fr; } }
.opt {
  position: relative; cursor: pointer; user-select: none;
  padding: 18px 18px; background: var(--bg); border: 1.5px solid var(--line);
  border-radius: 14px; transition: border-color var(--t), background var(--t), box-shadow var(--t);
  min-height: 48px;
}
.opt input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.opt:hover { border-color: rgba(201,142,91,.5); }
.opt-title { font-family: 'Fraunces', serif; font-size: 17px; font-weight: 500; margin-bottom: 4px; letter-spacing: -.01em; }
.opt-sub   { font-size: 12.5px; color: var(--muted); line-height: 1.45; }
.opt-price { margin-top: 8px; font-family: 'Fraunces', serif; font-size: 14.5px; color: var(--accent); }
/* Checked state — uses both :has() (modern) AND .is-checked (JS fallback for older Safari) */
.opt.is-checked,
.opt:has(input:checked) {
  border-color: var(--accent); background: #fff;
  box-shadow: 0 10px 28px -14px rgba(201,142,91,.5);
}
.opt.is-checked::after,
.opt:has(input:checked)::after {
  content: ""; position: absolute; top: 14px; right: 14px;
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--accent) url("data:image/svg+xml,%3Csvg width='9' height='7' viewBox='0 0 9 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 3.5L3.5 6L8 1' stroke='white' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;
}
.chip.is-checked,
.chip:has(input:checked) { background: var(--accent); border-color: var(--accent); color: #fff; }

/* Pax stepper */
.pax-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; background: var(--bg);
  border: 1.5px solid var(--line); border-radius: 12px;
}
.pax-lbl { display: flex; flex-direction: column; }
.pax-lbl .t { font-family: 'Fraunces', serif; font-size: 16px; font-weight: 500; }
.pax-lbl .s { font-size: 12px; color: var(--muted); font-family: 'Fraunces', serif; font-style: italic; }
.pax-ctrl { display: flex; align-items: center; gap: 14px; }
.pax-btn {
  width: 44px; height: 44px; border-radius: 50%;
  background: #fff; border: 1.5px solid var(--line);
  font-size: 22px; color: var(--ink); cursor: pointer;
  transition: border-color var(--t), color var(--t), transform var(--t-fast);
  display: grid; place-items: center;
}
.pax-btn:active { transform: scale(.92); }
.pax-btn:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.pax-btn:disabled { opacity: .35; cursor: not-allowed; }
.pax-n { font-family: 'Fraunces', serif; font-size: 19px; min-width: 22px; text-align: center; }

/* Chip toggle group (dietary etc) */
.chip-row { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  position: relative; cursor: pointer; user-select: none;
  padding: 9px 16px; background: var(--bg); border: 1.5px solid var(--line);
  border-radius: var(--r-pill); font-size: 13px; font-weight: 500;
  transition: border-color var(--t), background var(--t), color var(--t); color: var(--ink);
}
.chip input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.chip:hover { border-color: rgba(201,142,91,.45); }
/* Checked state defined above with .is-checked JS fallback for older Safari */

/* Summary sidebar */
.book-summary {
  position: sticky; top: 82px; align-self: start;
  background: #fff; border: 1.5px solid var(--line); border-radius: var(--r-lg);
  padding: 26px 26px 22px; box-shadow: var(--shadow-soft);
}
@media (max-width: 980px) { .book-summary { position: static; } }
.summ-eyebrow { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; color: var(--accent); }
.summ-title { font-family: 'Fraunces', serif; font-size: 20px; font-weight: 400; margin: 4px 0 16px; letter-spacing: -.015em; }
.summ-line { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 10px 0; font-size: 13.5px; color: var(--muted); border-top: 1px solid var(--line); }
.summ-line:first-of-type { border-top: none; padding-top: 4px; }
.summ-line .v { color: var(--ink); font-weight: 600; text-align: right; }
.summ-total { display: flex; justify-content: space-between; align-items: baseline; padding: 16px 0 6px; margin-top: 8px; border-top: 1.5px dashed var(--line); }
.summ-total .l { font-family: 'Fraunces', serif; font-size: 14px; color: var(--muted); font-style: italic; }
.summ-total .n { font-family: 'Fraunces', serif; font-size: 30px; color: var(--ink); line-height: 1; letter-spacing: -.01em; }
.summ-note { font-size: 11.5px; color: var(--muted); margin-top: 4px; font-style: italic; font-family: 'Fraunces', serif; }
.summ-trust { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line); display: flex; flex-direction: column; gap: 7px; }
.summ-trust .t { display: flex; gap: 8px; align-items: center; font-size: 12.5px; color: var(--muted); }
.summ-trust .t::before {
  content: ""; flex-shrink: 0; width: 16px; height: 16px; border-radius: 50%;
  background: rgba(201,142,91,.14) url("data:image/svg+xml,%3Csvg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 3L3 5L7 1' stroke='%23C98E5B' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;
}

.book-submit {
  display: flex; flex-direction: column; gap: 12px; margin-top: 6px; padding: 22px 24px;
  background: #fff; border: 1.5px solid var(--line); border-radius: var(--r-lg);
}
.book-submit .btn { width: 100%; justify-content: center; font-size: 16px; padding: 18px 28px; min-height: 54px; }
.book-submit .legal { font-size: 11.5px; color: var(--muted); line-height: 1.55; text-align: center; }

/* Mobile sticky price bar (booking) */
.book-sticky {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 80;
  background: rgba(255,255,255,.97); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-top: 1px solid var(--line);
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
  display: none; align-items: center; gap: 12px;
}
@media (max-width: 980px) { .book-sticky { display: flex; } }
.book-sticky-left { flex: 1; line-height: 1.1; }
.book-sticky-left .p-label { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .09em; }
.book-sticky-left .p-num { font-family: 'Fraunces', serif; font-size: 20px; color: var(--ink); margin-top: 2px; }
.book-sticky .btn { flex: 0 0 auto; padding: 14px 22px; font-size: 14.5px; min-height: 48px; }

/* Thank-you overlay */
.book-thankyou {
  position: fixed; inset: 0; z-index: 100; background: rgba(11,31,23,.72); backdrop-filter: blur(8px);
  display: none; align-items: center; justify-content: center; padding: 22px;
}
.book-thankyou.on { display: flex; }
.book-thankyou-card {
  background: #fff; border-radius: var(--r-lg); max-width: 480px; width: 100%;
  padding: 44px 36px; text-align: center; box-shadow: var(--shadow-lux);
}
.book-thankyou-card .icon {
  width: 62px; height: 62px; border-radius: 50%; margin: 0 auto 18px;
  background: rgba(201,142,91,.14);
  display: grid; place-items: center;
}
.book-thankyou-card h3 { font-family: 'Fraunces', serif; font-size: 28px; font-weight: 400; margin-bottom: 10px; }
.book-thankyou-card p  { font-size: 14.5px; color: var(--muted); line-height: 1.65; margin-bottom: 24px; }
.book-thankyou-card .btn { width: 100%; justify-content: center; }