/* ============================================================================
   BEITOUHOTSPRINGS.COM — DESIGN MANIFEST
   ----------------------------------------------------------------------------
   CONCEPT: «THE THERMAL SURVEY» (湯 · 実測 — "measured readings")

   Beitou is a volcano's plumbing turned into a village. This site is the
   survey of it: an independent field instrument that reports temperatures,
   tariffs and travel times the way a gauge reports pressure — precisely,
   without persuasion. The visual world is a night-green thermal basin
   (deep sulfur-dark greens), read through a lit instrument panel
   (mono readouts, gauge bars) and framed by the arch of the 1913
   Japanese bathhouse that made this place famous.

   PRINCIPLES
   1. Measured, not marketed. Every claim is a reading: a number, a unit,
      a date. Gauges and mono type carry authority the prose then earns.
   2. The arch and the valley. One curve (the bathhouse arch) and one
      descent (the rail line down the valley) are the only two shapes the
      site repeats. Everything else is a rectangle that stays out of the way.
   3. Steam belongs at the seams. Vapour only lives where a dark section
      meets a pale one — never over text, never as decoration for its own sake.
   4. Full-bleed bands, held measure. Section backgrounds run edge to edge on
      any monitor; content stops at a 1320px measure via a gutter token, so the
      dark/pale banding reads as geology, never as a boxed template.
   5. Verdicts in the open. Where we are paid, we print the gauge: WORTH IT,
      ONLY IF, WAIT. The DIY row sits in the same table as the tours.

   TYPE
   - Display: Newsreader (variable). Weight 500 for headings, 300 italic for
     the accent phrase inside them — that italic IS the brand voice.
     H1 clamp 38→68px at .98 leading; numerals of record set at 26–52px.
   - UI/text: Outfit (variable) 400–700. Body 15–16.5px / 1.6–1.68.
   - Data: IBM Plex Mono 400 — instrument readouts and unit labels only.
   All self-hosted woff2 (latin), preloaded. No webfont requests off-domain.

   PALETTE — roles are fixed, do not remix
   --basin   #071b16  night-green basin (hero, deepest surfaces)
   --ink     #16211c  wet basalt — dark sections, primary text
   --jade    #0e8f72  thermal jade — DECORATIVE rules, borders, large display
   --jade-tx #0e8f72  jade as the designer set it — links and body accents
   --gold    #ffc93d  sulfur — ATTENTION on dark: eyebrows, stats, badges
   --gold-tx #b8860f  sulfur as the designer set it — ratings and pills on pale
   --money   #e8502b  bathhouse-gate vermilion — BOOKING CTAs ONLY. One sanctioned
               exception: the 9px "–" con-marker in verdict cards, which is a
               negative glyph, never a target. Audit with a grep for --money.
   --rail    #e04a71 / #f3a4bb  the pink MRT branch — the rail device ONLY
   --paper   #eef2ec  washed paper   --sage #dfe8df   --card #fbfdf9
   Palette is the designer's, unmodified. Owner decision 14.08.2026: keep the
   concept colours; four small-text pairs sit at AA-large (3.0–4.1:1) rather
   than AA. Do not re-tune without the owner asking.

   SIGNATURE ELEMENTS (invented here)
   1. .bt-arch     — hero image capped by the 1913 bathhouse arch, with a
                     concentric ghost arch escaping the frame.
   2. .bt-readings — the LIVE READINGS · 実測 instrument panel: mono labels,
                     values in sulfur, gauge bars filled jade→sulfur.
   3. .bt-gauge    — the same gauge shrunk into tables as a VALUE bar with a
                     one-word verdict beneath it. Our honesty, drawn.
   4. .bt-rail     — the branch line: pink rail for MRT, jade rail on foot,
                     minutes floating above each dot.
   5. .bt-vert     — vertical 北投温泉 outline glyphs down section edges.
   6. Steam seams  — layered radial vapour, transform-only, reduced-motion off.

   FORBIDDEN: centered kicker+H2+grid stacks; identical white card grids;
   money colour on anything that is not a booking button; fade-up everything.
   Every rule is prefixed .bt- and this is the only stylesheet.
   ========================================================================== */

/* ---------- fonts (self-hosted, latin) ---------- */
@font-face{font-family:'Newsreader';font-style:normal;font-weight:200 800;font-display:swap;src:url(/assets/fonts/newsreader-latin-wght-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:200 800;font-display:swap;src:url(/assets/fonts/newsreader-latin-wght-italic.woff2) format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/outfit-latin-wght-normal.woff2) format('woff2')}
@font-face{font-family:'Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2')}

/* ---------- tokens ---------- */
:root{
  --basin:#071b16;--basin-2:#0b3227;--ink:#16211c;--ink-2:#22312c;
  --body:#3c4a42;--muted:#5b6a61;--faint:#8a958c;
  --jade:#0e8f72;--jade-tx:#0e8f72;--jade-dp:#0b3a2e;--jade-lt:#9fd6c2;--jade-mid:#7fb8a4;--jade-tint:#e9f3ec;
  --gold:#ffc93d;--gold-tx:#b8860f;--gold-tint:#fff3d1;--gold-soft:#fff7dd;
  --money:#e8502b;--money-dp:#e8502b;--money-tx:#fff6ee;
  --rail:#e04a71;--rail-2:#f3a4bb;--rail-tx:#f38fae;
  --paper:#eef2ec;--sage:#dfe8df;--card:#fbfdf9;
  --line:#d8ded4;--line-2:#e4e9e0;--line-dark:rgba(159,214,194,.2);
  --mist:#bcd8cc;--mist-2:#cde5da;
  --r-s:14px;--r-m:18px;--r-l:22px;--r-pill:999px;
  --sh-1:0 10px 24px rgba(22,33,28,.10);
  --sh-2:0 18px 40px rgba(22,33,28,.14);
  --sh-money:0 10px 28px rgba(232,80,43,.35);
  --ease:cubic-bezier(.16,1,.3,1);
  --measure:1320px;--pad:40px;
  --gut:max(var(--pad),calc((100% - 1320px) / 2));
  --f-d:'Newsreader',Georgia,serif;
  --f-t:'Outfit',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-m:'Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --sticky-h:0px;
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background:var(--basin)}
body{margin:0;font-family:var(--f-t);font-size:16px;line-height:1.62;color:var(--ink);background:var(--paper)}
img{max-width:100%;display:block}
a{color:var(--jade-tx);text-decoration:none}
a:hover{color:#0a6a55}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--jade);outline-offset:3px;border-radius:6px}
table{border-collapse:collapse}
button{font-family:inherit}
h1,h2,h3,h4{text-wrap:pretty}
.bt-skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:12px 20px;z-index:200;border-radius:0 0 10px 0}
.bt-skip:focus{left:0}

/* ---------- type ---------- */
.bt-d1{font-family:var(--f-d);font-weight:500;font-size:clamp(38px,5.4vw,68px);line-height:.99;letter-spacing:-.015em;margin:0 0 22px}
.bt-d2{font-family:var(--f-d);font-weight:500;font-size:clamp(29px,3.4vw,42px);line-height:1.04;letter-spacing:-.01em;margin:0 0 14px}
.bt-d3{font-family:var(--f-d);font-weight:500;font-size:clamp(21px,2vw,26px);line-height:1.18;margin:0 0 10px}
.bt-d1 em,.bt-d2 em,.bt-d3 em{font-weight:300;font-style:italic;color:var(--jade-tx)}
.bt-dark .bt-d1 em,.bt-dark .bt-d2 em,.bt-dark .bt-d3 em{color:var(--gold)}
.bt-hero .bt-d1 em{color:var(--gold)}
.bt-lede{font-size:clamp(15.5px,1.3vw,16.5px);line-height:1.62;color:var(--body);max-width:68ch;margin:0 0 30px}
.bt-dark .bt-lede{color:var(--mist)}
.bt-num{font-family:var(--f-d);font-weight:500;font-size:clamp(38px,4.4vw,52px);line-height:1;color:var(--jade-tx)}
.bt-dark .bt-num{color:var(--gold)}
.bt-fine{font-size:13px;line-height:1.6;color:var(--muted);margin:14px 0 0}
.bt-dark .bt-fine{color:var(--jade-mid)}

/* section eyebrow */
.bt-eyebrow{display:flex;align-items:center;gap:12px;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--jade-tx);font-weight:600;margin:0 0 16px}
.bt-eyebrow::before{content:"";width:26px;height:2px;border-radius:2px;background:currentColor;flex:none}
.bt-dark .bt-eyebrow{color:var(--gold)}

/* ---------- layout ---------- */
.bt-sec{padding:76px var(--gut);background:var(--paper)}
.bt-sec--sage{background:var(--sage)}
.bt-sec--ink{background:var(--ink);color:#eaf2ec}
.bt-sec--basin{background:linear-gradient(170deg,var(--basin),var(--basin-2) 90%);color:#eaf2ec}
.bt-sec--jade{background:linear-gradient(160deg,#0a6a55,var(--jade-dp) 85%);color:#eaf2ec}
.bt-dark a:not(.bt-btn){color:var(--jade-lt)}
.bt-dark a:not(.bt-btn):hover{color:#c6e9dc}
.bt-split{display:grid;grid-template-columns:300px minmax(0,1fr);gap:52px;align-items:start}
.bt-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.bt-two--wide{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:56px;margin-top:20px}
/* the rail column is usually far shorter than the prose beside it — let it ride
   down with the reader instead of leaving a half-screen hole on the right */
@media(min-width:901px){
  .bt-two--wide>:last-child{position:sticky;top:calc(var(--navh,64px) + var(--onthish,0px) + 24px)}
  .bt-two--wide>:last-child.bt-nosticky{position:static}
}
.bt-g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.bt-g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}

/* ---------- buttons ---------- */
.bt-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;min-height:46px;padding:14px 28px;border-radius:var(--r-pill);font-weight:600;font-size:15px;line-height:1.1;border:0;cursor:pointer;text-align:center;transition:transform .25s var(--ease),background .25s,border-color .25s,box-shadow .25s}
.bt-btn--book,.bt-table .bt-btn--book,.bt-dark .bt-btn--book{background:var(--money);color:var(--money-tx);text-decoration:none;box-shadow:var(--sh-money)}
.bt-btn--book:hover,.bt-table .bt-btn--book:hover{color:var(--money-tx);text-decoration:none;transform:translateY(-2px)}
.bt-btn--ghost{color:var(--ink);border:1px solid rgba(22,33,28,.35);background:transparent}
.bt-btn--ghost:hover{color:var(--ink);border-color:var(--ink);transform:translateY(-2px)}
.bt-dark .bt-btn--ghost{color:#eaf2ec;border-color:rgba(159,214,194,.45)}
.bt-dark .bt-btn--ghost:hover{color:#fff;border-color:var(--jade-lt)}
.bt-btn--sm{min-height:40px;padding:10px 20px;font-size:13px}
.bt-twrap .bt-btn--ghost,.bt-dark .bt-twrap .bt-btn--ghost{color:var(--ink);border:1.5px solid var(--ink);background:transparent;text-decoration:none}
/* content links must read as links — jade + soft underline, never plain ink */
.bt-table a:not(.bt-btn),.bt-faq a,.bt-prose a,.bt-correction a,.bt-lede a,.bt-answer a,.bt-alert a,.bt-venue p a,.bt-season p a{
  color:var(--jade);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px;text-decoration-color:rgba(14,143,114,.42);transition:color .2s,text-decoration-color .2s}
.bt-table a:not(.bt-btn):hover,.bt-faq a:hover,.bt-prose a:hover,.bt-correction a:hover,.bt-lede a:hover,.bt-answer a:hover,.bt-alert a:hover{color:#0a6a55;text-decoration-color:currentColor}
.bt-dark .bt-twrap a:not(.bt-btn){color:var(--jade)}
.bt-dark .bt-twrap a:not(.bt-btn):hover{color:#0a6a55}
.bt-dark .bt-prose a,.bt-dark .bt-lede a,.bt-dark .bt-answer a,.bt-dark .bt-alert a{color:var(--jade-lt);text-decoration-color:rgba(159,214,194,.5)}
.bt-dark .bt-prose a:hover,.bt-dark .bt-lede a:hover,.bt-dark .bt-answer a:hover{color:#c6e9dc;text-decoration-color:currentColor}
/* card titles: ink at rest inside a hoverable card, underline on hover */
.bt-card__title a:hover{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.bt-twrap .bt-btn--ghost:hover,.bt-dark .bt-twrap .bt-btn--ghost:hover{background:var(--ink);color:#fff}

/* ---------- nav ---------- */
.bt-nav{position:sticky;top:0;z-index:60;background:rgba(7,27,22,.93);backdrop-filter:blur(10px);color:#eaf2ec;border-bottom:1px solid rgba(158,214,194,.15)}
.bt-nav__in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px var(--gut)}
.bt-logo{display:flex;align-items:center;gap:11px;color:#eaf2ec}
.bt-logo__m{flex:none;width:34px;height:34px}
.bt-logo__t{display:flex;align-items:baseline;gap:9px;min-width:0}
.bt-logo:hover{color:#fff}
.bt-logo b{font-family:var(--f-d);font-weight:500;font-size:22px}
.bt-logo i{font-family:var(--f-d);font-style:italic;font-size:14px;color:var(--gold)}
.bt-nav__links{display:flex;align-items:center;gap:6px;list-style:none;margin:0;padding:0}
.bt-nav__links>li{position:relative}
.bt-top{display:block;padding:10px 14px;font-size:14px;font-weight:500;color:var(--jade-lt);border-radius:10px}
.bt-top:hover{color:#fff;background:rgba(159,214,194,.12)}
.bt-top[aria-expanded]::after{content:" ▾";font-size:11px;opacity:.7}
.bt-drop{position:absolute;top:100%;left:0;min-width:310px;background:#0b2b22;border:1px solid rgba(159,214,194,.22);border-radius:var(--r-m);box-shadow:0 24px 50px rgba(0,0,0,.5);padding:10px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.24s var(--ease)}
.bt-nav__links li:hover>.bt-drop,.bt-nav__links li:focus-within>.bt-drop{opacity:1;visibility:visible;transform:none}
.bt-drop a{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:9px 13px;border-radius:9px;color:#dcece4;font-size:14px;font-weight:500}
.bt-drop a:hover{background:rgba(159,214,194,.13);color:#fff}
.bt-drop small{color:var(--jade-mid);font-family:var(--f-m);font-size:11px;white-space:nowrap}
.bt-nav .bt-btn--book{min-height:40px;padding:11px 20px;font-size:13.5px;box-shadow:none}
.bt-burger{display:none;background:none;border:1px solid rgba(159,214,194,.4);color:#eaf2ec;width:44px;height:44px;border-radius:10px;font-size:18px;cursor:pointer;line-height:1;align-items:center;justify-content:center}
.bt-burger__x{display:none}
.bt-nav.is-open .bt-burger__m{display:none}
.bt-nav.is-open .bt-burger__x{display:block}

/* ---------- on this page (section rail) ----------
   Reads as the bottom edge of the hero, not a stripe between two pale bands:
   same basin tone as the hero's foot, hairline above, and .bt-seam under it
   doing the one and only dark→paper transition on the page. */
.bt-onthis{position:sticky;top:var(--navh,64px);z-index:50;background:var(--basin-2);
  border-top:1px solid rgba(159,214,194,.13)}
/* the single transition band: dark at the rail, paper by the time content starts */
.bt-seam{position:relative;height:78px;margin-bottom:-1px;overflow:hidden;pointer-events:none;
  background-color:var(--paper);
  /* the dark eased out over paper — no invented mid-tones, so it cannot band */
  background-image:linear-gradient(180deg,rgba(11,50,39,1) 0%,rgba(11,50,39,.96) 14%,rgba(11,50,39,.86) 28%,rgba(11,50,39,.68) 42%,rgba(11,50,39,.46) 56%,rgba(11,50,39,.26) 70%,rgba(11,50,39,.11) 84%,rgba(11,50,39,0) 100%)}
.bt-seam .bt-steam,.bt-seam .bt-steam2{bottom:14px}
/* the seam already supplies the breathing room — the section under it must not
   add a second 76px of air on top, or the join reads as a gap */
.bt-seam + .bt-sec{padding-top:34px}
@media(max-width:680px){.bt-seam{height:58px}.bt-seam + .bt-sec{padding-top:24px}}
.bt-onthis__in{display:flex;align-items:center;gap:16px;padding:0 var(--gut)}
/* ---------- reading the table at a glance ----------
   One scale: jade = strong/easy, sulfur = notable/conditional, drained = weak.
   Only designer tokens; nothing new invented. */
.bt-table .bt-r::first-letter{color:var(--faint)}          /* the ★ carries the band */
.bt-table .bt-r.is-strong::first-letter{color:var(--jade-tx)}
.bt-table .bt-r.is-mid::first-letter{color:var(--gold-tx)}
.bt-table .bt-r.is-weak::first-letter{color:var(--faint)}
.bt-table .bt-r.is-weak{color:var(--muted)}
.bt-table .bt-r.is-none{color:var(--muted);font-style:italic;font-weight:500}

.bt-vg.is-go b{background:var(--jade)}
.bt-vg.is-maybe b{background:var(--gold-tx)}
.bt-vg.is-no b{background:var(--faint)}
.bt-vgl.is-go{color:var(--jade-tx);font-weight:600}
.bt-vgl.is-maybe{color:var(--gold-tx);font-weight:600}
.bt-vgl.is-no{color:var(--muted)}

/* 19px display figures — large text, so 3:1 applies and the palette clears it */
.bt-table .bt-p.is-free,.bt-table .bt-p.is-low{color:var(--jade-tx);font-weight:700}
.bt-table .bt-p.is-high{color:var(--gold-tx);font-weight:700}
.bt-table .bt-p small{color:var(--muted);font-weight:400}

/* a product with no page of its own still reads as a heading, not as body text */
.bt-nm{display:block;font-size:15px;line-height:1.28;margin-bottom:2px}
.bt-nm a{font-weight:inherit}

/* ---------- service pages: compact head + one loud email ---------- */
.bt-shero{position:relative;overflow:hidden;background:linear-gradient(172deg,var(--basin),var(--basin-2) 92%);color:#eef4ee;padding:30px var(--gut) 40px}
.bt-shero>*{position:relative;z-index:2}
.bt-shero .bt-vert{z-index:1;font-size:clamp(52px,5vw,74px);letter-spacing:.16em}
.bt-shero .bt-d1{font-size:clamp(30px,3.6vw,44px);max-width:20ch;margin-bottom:12px}
.bt-shero p{color:var(--mist);max-width:60ch;margin:0;font-size:15.5px;line-height:1.6}
.bt-sec--svc{padding:44px var(--gut) 52px}
.bt-sec--svc .bt-prose h2{font-family:var(--f-d);font-weight:500;font-size:clamp(21px,2vw,25px);margin:30px 0 8px}
.bt-sec--svc .bt-prose h2:first-child{margin-top:0}
.bt-sec--svc .bt-prose p,.bt-sec--svc .bt-prose li{font-size:15.5px;line-height:1.62}
.bt-sec--svc .bt-prose ul{margin:6px 0 16px}
.bt-sec--svc .bt-prose ul li{padding-top:3px;padding-bottom:3px}
.bt-sec--svc .bt-prose>*:last-child{margin-bottom:0}

.bt-mail{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin:30px 0 0;max-width:760px;
  background:var(--basin);color:#eef4ee;border-radius:var(--r-l);padding:26px 30px;border-left:5px solid var(--gold)}
.bt-mail__k{font-family:var(--f-m);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--jade-lt);flex:1 1 100%;margin:0}
.bt-mail a{font-family:var(--f-d);font-weight:500;font-size:clamp(21px,2.7vw,30px);color:var(--gold);
  text-decoration:none;border-bottom:2px solid rgba(255,201,61,.4);word-break:break-word;line-height:1.15}
.bt-mail a:hover{color:#fff;border-bottom-color:#fff}
.bt-mail__n{font-size:13.5px;color:var(--mist);flex:1 1 220px;margin:0;line-height:1.5}
@media(max-width:680px){.bt-mail{padding:22px 20px}}
.bt-svcnav{display:flex;flex-wrap:wrap;gap:8px 18px;padding:22px var(--gut) 30px;background:var(--sage);
  font-size:13.5px;border-top:1px solid var(--line)}
.bt-svcnav span{font-family:var(--f-m);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}

/* ---------- sortable table headers ---------- */
.bt-table th:has(.bt-sortb){padding:0}
.bt-sortb{display:flex;align-items:center;gap:6px;width:100%;background:none;border:0;cursor:pointer;
  padding:12px 14px;font:inherit;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);text-align:left;transition:color .18s var(--ease)}
.bt-sortb:hover{color:var(--jade-tx)}
.bt-sortb i{width:9px;height:9px;flex:none;opacity:.4;
  background:currentColor;transition:opacity .18s var(--ease),transform .18s var(--ease);
  -webkit-mask:no-repeat center/9px 9px;mask:no-repeat center/9px 9px;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0 8.5 4h-7zM5 10 1.5 6h7z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 0 8.5 4h-7zM5 10 1.5 6h7z'/%3E%3C/svg%3E")}
.bt-sortb:hover i{opacity:.75}
[aria-sort="ascending"] .bt-sortb,[aria-sort="descending"] .bt-sortb{color:var(--jade-tx)}
[aria-sort="ascending"] .bt-sortb i,[aria-sort="descending"] .bt-sortb i{opacity:1;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 1 9 6H1z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M5 1 9 6H1z'/%3E%3C/svg%3E")}
[aria-sort="descending"] .bt-sortb i{transform:rotate(180deg)}
.bt-sorthint{font-size:12.5px;color:var(--muted);margin:9px 0 0}
.bt-dark .bt-sorthint{color:var(--jade-mid)}
/* NO .bt-dark override here on purpose: .bt-table thead th carries its own light
   background (#e4ebe3) even inside a dark section, so recolouring by context puts
   pale-on-pale text in the header. Same trap as .bt-related--img and .bt-venue--img. */
.bt-onthis__lb{flex:none;font-family:var(--f-m);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--jade-mid)}
.bt-onthis__sc{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;scroll-snap-type:x proximity}
.bt-onthis__sc::-webkit-scrollbar{display:none}
.bt-onthis__sc a{flex:none;scroll-snap-align:start;padding:13px 13px 11px;font-size:13.5px;font-weight:500;color:var(--jade-lt);white-space:nowrap;border-bottom:2px solid transparent;transition:color .18s var(--ease),border-color .18s var(--ease)}
.bt-onthis__sc a:hover{color:#fff}
.bt-onthis__sc a.is-here{color:var(--gold);border-bottom-color:var(--gold)}
/* only when the chips actually overflow — a soft edge saying "there is more" */
.bt-onthis__sc.is-scrollable{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 34px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 34px),transparent)}
.bt-onthis__sc.is-scrollable.at-end{-webkit-mask-image:none;mask-image:none}
@media(max-width:760px){
  .bt-onthis__lb{display:none}
  .bt-onthis__in{padding:0 12px}
  .bt-onthis__sc a{padding:12px 11px 10px;font-size:13px}
}

/* ---------- hero ---------- */
.bt-hero{position:relative;background:linear-gradient(175deg,var(--basin) 0%,var(--basin-2) 58%,#0e5c47 130%);color:#eef4ee;overflow:hidden}
.bt-hero__in{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:48px;align-items:center;padding:64px max(88px,calc((100% - 1320px) / 2 + 48px)) 74px var(--gut)}
.bt-hero .bt-d1{max-width:15ch}
.bt-hero .bt-lede{color:var(--mist);max-width:52ch;margin-bottom:32px}
.bt-stamp{display:inline-flex;align-items:center;gap:10px;border:1px solid rgba(159,214,194,.3);border-radius:var(--r-pill);padding:7px 16px;font-family:var(--f-m);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--jade-lt);margin:0 0 26px}
.bt-stamp::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--gold);flex:none}
.bt-hero__cta{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-bottom:46px}
.bt-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:20px 0}
.bt-stats div{padding-right:20px;border-right:1px solid rgba(159,214,194,.2)}
.bt-stats div:last-child{border-right:0;padding-right:0}
.bt-stats b{display:block;font-family:var(--f-d);font-weight:500;font-size:clamp(24px,2.1vw,31px);line-height:1;color:#eef4ee}
.bt-stats span{display:block;font-family:var(--f-m);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--jade-mid);margin-top:7px}

/* signature 1 — the arch */
.bt-archwrap{position:relative;justify-self:center;width:440px;max-width:100%}
.bt-archwrap::before{content:"";position:absolute;inset:-22px -60px -22px auto;width:200px;border:1px solid rgba(159,214,194,.25);border-radius:var(--r-pill) var(--r-pill) 0 0;opacity:.7;pointer-events:none}
.bt-arch{position:relative;border-radius:var(--r-pill) var(--r-pill) 26px 26px;overflow:hidden;border:1px solid rgba(159,214,194,.35);box-shadow:0 30px 80px rgba(0,0,0,.45)}
.bt-arch img{width:100%;height:auto;aspect-ratio:44/52;object-fit:cover}
.bt-arch::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,27,22,.15),transparent 40%,rgba(7,27,22,.5) 92%)}

/* signature 2 — the readings panel */
.bt-readings{position:absolute;left:-46px;bottom:24px;width:250px;background:rgba(6,22,18,.92);backdrop-filter:blur(6px);border:1px solid rgba(159,214,194,.28);border-radius:var(--r-s);padding:16px 18px;font-family:var(--f-m);z-index:3}
.bt-readings>p{font-size:11px;letter-spacing:.2em;color:var(--jade-mid);margin:0 0 12px}
.bt-readings div{margin-bottom:10px}
.bt-readings div:last-child{margin-bottom:0}
.bt-readings dl{display:flex;justify-content:space-between;font-size:11px;color:var(--mist);margin:0 0 4px}
.bt-readings dt,.bt-readings dd{margin:0}
.bt-readings dd{color:var(--gold)}
.bt-readings i{display:block;height:4px;border-radius:2px;background:#123c30;overflow:hidden}
.bt-readings i b{display:block;height:100%;border-radius:2px;background:linear-gradient(90deg,#14b58c,var(--gold))}

/* signature 5 — vertical glyphs */
.bt-vert{position:absolute;top:0;bottom:0;right:18px;writing-mode:vertical-rl;text-orientation:upright;font-family:'Hiragino Sans','Noto Sans CJK TC','Noto Sans CJK JP','Microsoft JhengHei','PingFang TC',var(--f-d);font-size:clamp(64px,7vw,104px);line-height:1.15;color:transparent;-webkit-text-stroke:1px rgba(159,214,194,.16);letter-spacing:.3em;user-select:none;pointer-events:none;z-index:1}
@supports not (-webkit-text-stroke:1px black){.bt-vert{color:rgba(159,214,194,.1)}}

/* steam seams */
.bt-steam,.bt-steam2{position:absolute;left:-10%;right:-10%;pointer-events:none;z-index:1}
.bt-steam{bottom:30px;height:200px;background:radial-gradient(46% 100px at 22% 100%,rgba(238,242,236,.16),transparent 70%),radial-gradient(52% 130px at 58% 100%,rgba(238,242,236,.12),transparent 74%),radial-gradient(40% 90px at 86% 100%,rgba(238,242,236,.14),transparent 70%)}
.bt-steam2{bottom:26px;height:140px;background:radial-gradient(38% 90px at 40% 100%,rgba(238,242,236,.1),transparent 72%),radial-gradient(44% 110px at 78% 100%,rgba(238,242,236,.09),transparent 70%)}
.bt-hem{position:absolute;left:0;right:0;bottom:0;height:110px;pointer-events:none;z-index:2;background:linear-gradient(180deg,transparent,rgba(238,242,236,.45) 70%,var(--paper))}
@media (prefers-reduced-motion:no-preference){
  @keyframes bt-steam-a{from{transform:translate(-4%,2%) scale(1)}to{transform:translate(4%,-6%) scale(1.08)}}
  @keyframes bt-steam-b{from{transform:translate(3%,0) scale(1.05)}to{transform:translate(-3%,-4%) scale(1)}}
  .bt-steam{animation:bt-steam-a 8s ease-in-out infinite alternate}
  .bt-steam2{animation:bt-steam-b 11s ease-in-out infinite alternate}
}

/* ---------- tables ---------- */
.bt-twrap{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;overflow-x:auto;-webkit-overflow-scrolling:touch}
.bt-sec--basin .bt-twrap,.bt-sec--ink .bt-twrap{border-color:transparent}
.bt-table{width:100%;font-size:14.5px;background:var(--card)}
.bt-table--wide{min-width:920px;font-size:14px}
.bt-table caption{text-align:left;padding:18px 20px 10px;caption-side:top;background:var(--card)}
.bt-table caption b{font-family:var(--f-d);font-style:italic;font-weight:500;font-size:21px;color:var(--jade-tx)}
.bt-table caption span{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-left:10px}
.bt-table thead th{font-family:var(--f-m);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:left;background:#e4ebe3;padding:13px 16px;font-weight:400;white-space:nowrap}
.bt-table td{padding:15px 18px;border-top:1px solid var(--line-2);line-height:1.55;color:var(--body);vertical-align:top}
.bt-table tbody tr:hover{background:var(--jade-tint)}
.bt-table .bt-k{font-family:var(--f-d);font-style:italic;font-weight:500;font-size:17px;color:var(--jade-tx);white-space:nowrap;width:170px}
.bt-table .bt-p{font-family:var(--f-d);font-weight:500;font-size:19px;white-space:nowrap;color:var(--ink)}
.bt-table .bt-r{font-size:12.5px;font-weight:600;color:var(--ink);white-space:nowrap}
.bt-table small{display:block;font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.45}
.bt-table a:not(.bt-btn){font-weight:600}
.bt-row-diy{background:var(--gold-soft)}
.bt-row-diy:hover{background:#fff2c9}
.bt-tot td{background:var(--gold-soft);font-weight:700;color:var(--ink)}
.bt-tot .bt-p{color:var(--ink)}
.bt-usd{font-size:12px;font-style:italic;color:var(--faint);white-space:nowrap;text-align:right}
.bt-pill{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-tx);background:var(--gold-tint);border-radius:var(--r-pill);padding:4px 10px;white-space:nowrap}

/* signature 3 — value gauge */
.bt-vg{display:block;width:84px;height:7px;border-radius:4px;background:#dde4da;overflow:hidden}
.bt-vg b{display:block;height:100%;border-radius:4px;background:var(--jade)}
.bt-vgl{display:block;font-family:var(--f-m);font-size:11px;letter-spacing:.06em;color:var(--muted);margin-top:5px;white-space:nowrap}

/* signature 4 — the rail */
.bt-railbox{background:var(--card);border:1px solid var(--line);border-radius:var(--r-l);padding:34px 30px 28px}
.bt-dark .bt-railbox{background:rgba(255,255,255,.04);border-color:var(--line-dark)}
.bt-raillabel{font-family:var(--f-m);font-size:11px;letter-spacing:.18em;color:var(--ink);margin:0 0 28px}
.bt-dark .bt-raillabel{color:var(--rail-tx)}
.bt-raillabel--walk{color:var(--jade);margin-top:34px}
.bt-dark .bt-raillabel--walk{color:var(--jade-lt)}
.bt-rail{display:flex;list-style:none;margin:0;padding:0;min-width:320px}
.bt-rail li{flex:1;position:relative;padding-top:26px}
.bt-rail li::before{content:"";position:absolute;top:8px;left:0;right:0;height:5px;border-radius:3px;background:linear-gradient(90deg,var(--rail),var(--rail-2))}
.bt-rail li:last-child::before{right:auto;width:15px;border-radius:3px}
.bt-rail li::after{content:"";position:absolute;top:2px;left:0;width:15px;height:15px;border-radius:50%;background:var(--card);border:4px solid var(--rail)}
.bt-dark .bt-rail li::after{background:var(--ink)}
.bt-rail em{position:absolute;top:-17px;left:0;font-style:normal;font-family:var(--f-m);font-size:11px;font-weight:500;color:var(--muted);white-space:nowrap}
.bt-dark .bt-rail em{color:var(--rail-tx)}
.bt-rail b{display:block;font-weight:600;font-size:14px;color:var(--ink)}
.bt-dark .bt-rail b{color:#eaf2ec}
.bt-rail span{display:block;font-size:12px;color:var(--muted)}
.bt-dark .bt-rail span{color:var(--jade-mid)}
.bt-rail--walk li::before{background:linear-gradient(90deg,#14b58c,#0a6a55)}
.bt-rail--walk li::after{border-color:#14b58c}
.bt-rail--walk em{color:var(--jade-tx)}
.bt-dark .bt-rail--walk em{color:var(--jade-lt)}
.bt-railscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ---------- cards ---------- */
.bt-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.bt-card:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.bt-card__img{position:relative;aspect-ratio:3/2}
.bt-card__img img{width:100%;height:100%;object-fit:cover}
.bt-badge{position:absolute;top:12px;left:12px;background:var(--gold);color:var(--ink);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:var(--r-pill)}
.bt-card__body{display:flex;flex-direction:column;gap:9px;padding:18px 20px 20px;flex:1}
.bt-card__title{font-family:var(--f-d);font-weight:500;font-size:19.5px;line-height:1.22;margin:0}
.bt-card__title a{color:var(--ink)}
.bt-card__title a:hover{color:var(--jade-tx)}
.bt-card__facts{font-size:12.5px;color:var(--muted);line-height:1.6;margin:0}
.bt-card__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-top:auto;padding-top:12px;border-top:1px dashed var(--line)}
.bt-card__price small{display:block;font-family:var(--f-m);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.bt-card__price b{font-family:var(--f-d);font-weight:500;font-size:26px;line-height:1.1}
.bt-card__rate{font-size:12.5px;font-weight:700;color:var(--gold-tx);text-align:right}
.bt-card .bt-btn{margin-top:4px;width:100%;font-size:13.5px;padding:13px}

/* verdict cards */
.bt-verdict{display:flex;flex-direction:column;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);padding:26px 24px;position:relative;color:var(--ink)}
.bt-verdict:hover{transform:translateY(-4px);box-shadow:var(--sh-2);color:var(--ink)}
.bt-verdict{transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.bt-verdict::before{content:"";position:absolute;top:0;left:24px;width:44px;height:5px;border-radius:0 0 4px 4px;background:var(--tab,var(--jade))}
.bt-verdict h3{font-family:var(--f-d);font-weight:500;font-size:24px;margin:8px 0 0}
.bt-verdict .bt-vp{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.bt-verdict .bt-vp b{font-family:var(--f-d);font-weight:600;font-size:21px}
.bt-verdict .bt-vp span{font-size:12px;font-style:italic;color:var(--faint)}
.bt-verdict ul{display:grid;gap:9px;font-size:13.5px;line-height:1.5;color:var(--body);list-style:none;margin:0;padding:0}
.bt-verdict li{display:flex;gap:9px}
.bt-verdict li::before{font-weight:700;flex:none;width:9px}
.bt-verdict li.ok::before{content:"+";color:var(--jade-tx)}
.bt-verdict li.no::before{content:"–";color:var(--money)}
.bt-verdict .bt-go{margin-top:auto;font-weight:600;font-size:14px;color:var(--jade-tx)}

/* venue (klook) cards */
.bt-venue.bt-venue--img{padding:0;overflow:hidden}
.bt-venue.bt-venue--img .bt-venue__pic{position:relative;aspect-ratio:16/9;margin:0}
.bt-venue.bt-venue--img .bt-venue__pic img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.bt-venue.bt-venue--img:hover .bt-venue__pic img{transform:scale(1.04)}
.bt-venue.bt-venue--img .bt-venue__in{display:flex;flex-direction:column;gap:9px;padding:20px 24px 22px;flex:1}

.bt-venue{display:flex;flex-direction:column;gap:9px;background:var(--card);border:1px solid #cfd8ce;border-radius:var(--r-m);padding:24px 26px;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.bt-venue:hover{transform:translateY(-3px);box-shadow:var(--sh-1)}
.bt-venue__top{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.bt-venue__lab{font-family:var(--f-m);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--jade-tx)}
.bt-venue__rate{font-size:12px;font-weight:700;color:var(--gold-tx);text-align:right}
.bt-venue h3{font-family:var(--f-d);font-weight:500;font-size:23px;margin:0}
.bt-venue p{font-size:13.5px;line-height:1.55;color:var(--body);margin:0}
.bt-venue__foot{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:8px}
.bt-venue__foot small{display:block;font-family:var(--f-m);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.bt-venue__foot b{font-family:var(--f-d);font-weight:500;font-size:24px}

/* free-village columns */
.bt-col{border-top:1px solid var(--line-dark);padding-top:22px}
.bt-col h3{font-family:var(--f-d);font-weight:500;font-size:24px;margin:14px 0 10px}
.bt-col p{font-size:14px;line-height:1.62;color:var(--mist);margin:0 0 12px}
.bt-col a{font-weight:600;font-size:13.5px;border-bottom:1px solid rgba(159,214,194,.4);padding-bottom:2px}

/* alerts — attention panels (gold), or jade for a softer aside */
.bt-alert{display:flex;gap:14px;background:var(--gold-soft);border:1px solid #efe0b4;border-left:5px solid var(--gold);border-radius:var(--r-s);padding:16px 20px;font-size:14.5px;line-height:1.6;color:var(--body)}
.bt-alert b{color:var(--ink)}
.bt-alert--jade{background:var(--jade-tint);border-color:#c4ded7;border-left-color:var(--jade)}
.bt-dark .bt-alert{background:rgba(255,255,255,.05);border-color:var(--line-dark);border-left-color:var(--gold);color:var(--mist)}
.bt-dark .bt-alert b{color:#eaf2ec}
.bt-dark .bt-alert--jade{border-left-color:var(--jade-lt)}

/* correction block */
.bt-correction{max-width:900px;margin:0 auto;background:var(--card);border:1px solid var(--line);border-radius:var(--r-l);padding:34px 38px;position:relative}
.bt-correction::before{content:"";position:absolute;top:0;left:38px;width:52px;height:6px;border-radius:0 0 5px 5px;background:var(--gold)}
.bt-correction .bt-eyebrow{color:var(--gold-tx);margin-top:6px}
.bt-correction h2{font-family:var(--f-d);font-weight:500;font-size:clamp(24px,2.6vw,30px);line-height:1.12;margin:0 0 14px}
.bt-correction p{font-size:15px;line-height:1.65;color:var(--body);margin:0 0 12px}
.bt-correction p:last-child{margin-bottom:0}
.bt-correction strong{color:var(--ink)}

/* rules */
.bt-rule{display:flex;gap:16px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-s);padding:20px 22px;font-size:13.5px;line-height:1.6;color:var(--muted);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.bt-rule:hover{transform:translateY(-2px);box-shadow:var(--sh-1)}
.bt-rule i{font-family:var(--f-d);font-style:normal;font-size:19px;color:var(--gold-tx);flex:none;width:40px;height:40px;border-radius:50%;background:var(--gold-tint);display:grid;place-items:center}
.bt-rule b{display:block;font-family:var(--f-d);font-weight:600;font-size:17.5px;color:var(--ink);margin-bottom:4px;line-height:1.25}

/* seasons */
.bt-season{background:var(--card);border:1px solid #cfd8ce;border-radius:var(--r-m);padding:24px 22px}
.bt-season h3{font-family:var(--f-d);font-weight:500;font-size:21px;margin:14px 0 10px}
.bt-season p{font-size:13.5px;line-height:1.58;color:var(--body);margin:0}

/* plans */
.bt-plan{border-top:1px solid rgba(255,201,61,.35);padding-top:20px}
.bt-plan h3{font-family:var(--f-d);font-weight:500;font-size:26px;margin:0 0 6px}
.bt-plan h3 em{font-weight:300;font-style:italic;color:var(--gold)}
.bt-plan .bt-meta{font-family:var(--f-m);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin:0 0 12px}
.bt-plan p{font-size:14px;line-height:1.68;color:var(--mist-2);margin:0}

/* ---------- FAQ ---------- */
.bt-faq{max-width:880px;margin:0 auto}
.bt-faqtools{display:flex;gap:10px;margin:0 0 16px}
.bt-faqtools button{background:none;border:1px solid var(--line);border-radius:var(--r-pill);padding:8px 16px;font-family:var(--f-m);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);cursor:pointer;transition:.2s}
.bt-faqtools button:hover{border-color:var(--jade);color:var(--jade-tx)}
.bt-faq details{background:var(--card);border:1px solid var(--line);border-radius:var(--r-s);padding:0 22px;margin-bottom:10px}
.bt-faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:var(--f-d);font-weight:500;font-size:18.5px;padding:17px 0;cursor:pointer;color:var(--ink);list-style:none}
.bt-faq summary::-webkit-details-marker{display:none}
.bt-faq summary::after{content:"+";font-family:var(--f-d);font-size:24px;color:var(--jade-tx);flex:none;transition:transform .3s var(--ease)}
.bt-faq details[open] summary::after{transform:rotate(45deg)}
.bt-faq details>div{padding:0 0 18px;font-size:14.5px;line-height:1.65;color:var(--body)}
.bt-faq details>div p{margin:0}

/* ---------- sticky bar + to top ---------- */
.bt-sticky{position:fixed;left:0;right:0;bottom:0;z-index:55;background:rgba(7,27,22,.97);backdrop-filter:blur(8px);color:#eaf2ec;transform:translateY(110%);transition:transform .35s var(--ease)}
.bt-sticky.is-on{transform:none}
.bt-sticky__in{display:flex;align-items:center;gap:16px;padding:10px var(--gut)}
.bt-sticky__t{flex:1;min-width:0}
.bt-sticky__t b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13.5px;line-height:1.3}
.bt-sticky__t span{font-family:var(--f-m);font-size:11px;color:var(--jade-mid)}
.bt-sticky__p{font-family:var(--f-d);font-size:22px;white-space:nowrap}
.bt-sticky .bt-btn{min-height:40px;padding:10px 22px;font-size:13.5px;box-shadow:none}
.bt-totop{position:fixed;right:18px;bottom:calc(var(--sticky-h) + 18px);z-index:54;width:46px;height:46px;border-radius:50%;background:var(--card);border:1px solid var(--line);box-shadow:var(--sh-1);cursor:pointer;font-size:18px;color:var(--ink);opacity:0;visibility:hidden;transition:.3s}
.bt-totop.is-on{opacity:1;visibility:visible}

/* ---------- footer ---------- */
.bt-foot{background:var(--basin);color:#9db5aa;padding:60px var(--gut) 30px;font-size:13.5px}
.bt-foot a{color:var(--jade-lt)}
.bt-foot a:hover{color:var(--gold)}
.bt-foot__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid rgba(159,214,194,.15)}
.bt-foot__grid p{margin:14px 0 0;line-height:1.7}
.bt-foot h4{color:#eaf2ec;font-family:var(--f-m);font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin:0 0 14px;font-weight:400}
.bt-foot ul{display:grid;gap:8px;list-style:none;margin:0;padding:0}
.bt-foot__map{padding:28px 0;border-bottom:1px solid rgba(159,214,194,.15)}
.bt-qmap{display:flex;flex-wrap:wrap;gap:8px}
.bt-qmap a{display:inline-block;padding:6px 13px;border:1px solid rgba(159,214,194,.18);border-radius:var(--r-pill);background:rgba(159,214,194,.045);font-size:12.5px;line-height:1.35;color:#a8c4b8;transition:background .2s,border-color .2s,color .2s}
.bt-qmap a:hover{border-color:var(--jade-lt);background:rgba(159,214,194,.11);color:#eaf2ec}
.bt-foot__legal{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center;padding-top:22px;font-size:12.5px}
.bt-foot__legal a{cursor:pointer}


/* ---------- page hero (subpages) ---------- */
.bt-phero{position:relative;background:linear-gradient(172deg,var(--basin),var(--basin-2) 92%);color:#eef4ee;overflow:hidden}
.bt-phero__in{position:relative;z-index:2;padding:34px var(--gut) 96px;max-width:none}
.bt-phero .bt-d1{font-size:clamp(32px,4.4vw,56px);max-width:17ch}
.bt-phero .bt-lede{color:var(--mist);max-width:62ch}
.bt-crumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-family:var(--f-m);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--jade-mid);margin:0 0 22px;padding:0;list-style:none}
.bt-crumb li{display:flex;gap:8px;align-items:center}
.bt-crumb li+li::before{content:"/";color:rgba(159,214,194,.4)}
.bt-crumb a{color:var(--jade-lt)}
.bt-crumb [aria-current]{color:#eef4ee}
/* subpage hero photo — full-bleed behind the copy, steam seam at the base */
.bt-phero__bg{position:absolute;inset:0;z-index:0}
.bt-phero__bg img{width:100%;height:100%;object-fit:cover;opacity:.82}
/* left scrim holds the text, right side lets the photo read; bottom fade meets the next section */
.bt-phero__bg::after{content:"";position:absolute;inset:0;background:
  linear-gradient(to bottom,rgba(7,27,22,0) 52%,rgba(11,50,39,.72) 100%),
  linear-gradient(100deg,rgba(7,27,22,.95) 0%,rgba(7,27,22,.88) 38%,rgba(7,27,22,.5) 72%,rgba(7,27,22,.34) 100%)}
@media(max-width:860px){
  .bt-phero__bg img{opacity:.55}
  .bt-phero__bg::after{background:
    linear-gradient(to bottom,rgba(7,27,22,.92) 0%,rgba(7,27,22,.82) 55%,rgba(11,50,39,.9) 100%)}
}
.bt-phero--img .bt-phero__in{padding-top:40px;padding-bottom:58px}

/* related strip — with a thumbnail */
.bt-related.bt-related--img{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.bt-related.bt-related--img a{padding:0;overflow:hidden;display:flex;flex-direction:column;border-color:transparent}
.bt-related.bt-related--img a figure{position:relative;margin:0;aspect-ratio:16/9;overflow:hidden;background:var(--sage)}
.bt-related.bt-related--img a figure img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
/* a soft foot on the photo so the card reads as one object, not a pasted rectangle */
.bt-related.bt-related--img a figure::after{content:"";position:absolute;inset:auto 0 0 0;height:38%;
  background:linear-gradient(to top,rgba(7,27,22,.34),transparent);pointer-events:none}
.bt-related.bt-related--img a:hover figure img{transform:scale(1.045)}
.bt-related.bt-related--img a>div{position:relative;padding:15px 44px 17px 18px}
.bt-related.bt-related--img a>div::after{content:"→";position:absolute;right:16px;top:16px;
  font-family:var(--f-m);font-size:15px;color:var(--jade-tx);opacity:.5;
  transition:transform .24s var(--ease),opacity .24s var(--ease)}
.bt-related.bt-related--img a:hover>div::after{opacity:1;transform:translateX(3px)}
.bt-related.bt-related--img b{font-size:17.5px;line-height:1.2;margin-bottom:5px}
.bt-related.bt-related--img span{display:block;font-size:12.5px;line-height:1.45}
@media(max-width:900px){.bt-related.bt-related--img{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.bt-related.bt-related--img{grid-template-columns:minmax(0,1fr)}}

/* inline content figure */
.bt-figure{margin:0 0 20px;border-radius:var(--r-m);overflow:hidden;border:1px solid var(--line);background:var(--card)}
.bt-figure img{width:100%;height:auto;display:block}
.bt-figure figcaption{font-size:12.5px;line-height:1.5;color:var(--muted);padding:10px 16px 12px}
.bt-dark .bt-figure{border-color:var(--line-dark);background:rgba(255,255,255,.04)}
.bt-dark .bt-figure figcaption{color:var(--jade-mid)}
.bt-figure--w{max-width:820px;margin-left:auto;margin-right:auto;margin-top:26px}

/* answer box — the answer-first device on every subpage */
.bt-answer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:26px;align-items:center;background:rgba(255,255,255,.05);border:1px solid var(--line-dark);border-left:4px solid var(--gold);border-radius:var(--r-m);padding:24px 28px;margin-top:30px}
.bt-answer p{margin:0;font-size:16.5px;line-height:1.6;color:#e4efe9}
.bt-answer p strong{color:#fff}
.bt-answer .bt-answer__k{font-family:var(--f-m);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin:0 0 8px}
.bt-answer__n{text-align:right}
.bt-answer__n b{display:block;font-family:var(--f-d);font-weight:500;font-size:clamp(30px,3.4vw,44px);line-height:1;color:var(--gold)}
.bt-answer__n span{display:block;font-family:var(--f-m);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--jade-mid);margin-top:8px}
@media (max-width:680px){.bt-answer{grid-template-columns:minmax(0,1fr);gap:16px;padding:20px 18px}.bt-answer__n{text-align:left}}
/* prose block for guide bodies */
.bt-prose{max-width:70ch;font-size:16px;line-height:1.7;color:var(--body)}
.bt-prose p{margin:0 0 16px}
.bt-prose h3{font-family:var(--f-d);font-weight:500;font-size:23px;line-height:1.22;margin:28px 0 10px;color:var(--ink)}
.bt-dark .bt-prose{color:var(--mist)}
.bt-dark .bt-prose h3{color:#eaf2ec}
.bt-prose ul{margin:0 0 16px;padding:0;list-style:none}
.bt-prose ul li{position:relative;padding:5px 0 5px 22px}
.bt-prose ul li::before{content:"";position:absolute;left:2px;top:14px;width:7px;height:7px;border-radius:50%;background:var(--jade)}
/* related strip */
.bt-related{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-top:8px}
.bt-related a{display:block;background:var(--card);border:1px solid var(--line);border-radius:var(--r-s);padding:16px 18px;color:var(--ink);transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.bt-related a:hover{transform:translateY(-3px);box-shadow:var(--sh-1);color:var(--ink)}
.bt-dark .bt-related a,.bt-dark .bt-related a:hover{color:var(--ink);text-decoration:none}
.bt-dark .bt-related b{color:var(--ink)}
.bt-dark .bt-related span{color:var(--muted)}
.bt-related b{display:block;font-family:var(--f-d);font-weight:500;font-size:18px;margin-bottom:3px}
.bt-related span{font-size:13px;color:var(--muted)}


/* ---------- field notes / review quotes ---------- */
.bt-quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:8px}
.bt-quote{background:var(--card);border:1px solid var(--line);border-radius:var(--r-m);padding:20px 22px;position:relative}
.bt-quote::before{content:"\201C";position:absolute;top:2px;right:16px;font-family:var(--f-d);font-size:58px;line-height:1;color:var(--line);pointer-events:none}
.bt-quote p{margin:0 0 12px;font-family:var(--f-d);font-size:17px;line-height:1.45;color:var(--ink);position:relative}
.bt-quote footer{font-family:var(--f-m);font-size:11px;letter-spacing:.06em;color:var(--muted)}
.bt-dark .bt-quote{background:rgba(255,255,255,.05);border-color:var(--line-dark)}
.bt-dark .bt-quote p{color:#eaf2ec}
.bt-dark .bt-quote footer{color:var(--jade-mid)}
.bt-dark .bt-quote::before{color:rgba(159,214,194,.18)}
/* ---------- itinerary stop list ---------- */
.bt-stops{list-style:none;margin:0;padding:0;counter-reset:s}
.bt-stops li{position:relative;display:flex;justify-content:space-between;gap:16px;padding:12px 0 12px 40px;border-top:1px solid var(--line)}
.bt-stops li:first-child{border-top:0}
.bt-stops li::before{counter-increment:s;content:counter(s);position:absolute;left:0;top:11px;width:26px;height:26px;border-radius:50%;background:var(--jade-tint);color:var(--jade);font-family:var(--f-m);font-size:11px;display:grid;place-items:center}
.bt-stops b{font-weight:600}
.bt-stops span{font-family:var(--f-m);font-size:12px;color:var(--muted);white-space:nowrap}
.bt-dark .bt-stops li{border-color:var(--line-dark)}
.bt-dark .bt-stops li::before{background:rgba(159,214,194,.12);color:var(--jade-lt)}
.bt-dark .bt-twrap .bt-stops li::before{background:var(--jade-tint);color:var(--jade)}
.bt-dark .bt-twrap .bt-stops b{color:var(--ink)}
.bt-dark .bt-twrap .bt-stops span,.bt-dark .bt-twrap .bt-stops li{color:var(--muted)}
.bt-dark .bt-twrap .bt-stops li{border-color:var(--line)}
.bt-dark .bt-twrap .bt-eyebrow{color:var(--jade-tx)}
.bt-dark .bt-stops b{color:#eaf2ec}
.bt-dark .bt-stops span{color:var(--jade-mid)}
/* ---------- two-column pros/cons ---------- */
.bt-pc{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.bt-pc ul{list-style:none;margin:0;padding:0;font-size:14.5px;line-height:1.55}
.bt-pc li{display:flex;gap:10px;padding:6px 0}
.bt-pc li::before{font-weight:700;flex:none}
.bt-pc .ok li::before{content:"+";color:var(--jade)}
.bt-pc .no li::before{content:"–";color:var(--money)}
.bt-pc h4{font-family:var(--f-d);font-weight:500;font-size:19px;margin:0 0 8px}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  :root{--pad:28px}
  .bt-hero__in{grid-template-columns:minmax(0,1fr);gap:44px;padding:52px var(--gut) 66px}
  .bt-hero .bt-d1{max-width:18ch}
  .bt-archwrap{justify-self:start;width:100%;max-width:440px}
  .bt-vert{font-size:88px;opacity:.7}
  .bt-g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bt-split{grid-template-columns:minmax(0,1fr);gap:26px}
}
@media (max-width:900px){
  /* ---- mobile drawer: full-height panel, groups always open, own scroll ----
     backdrop-filter on .bt-nav would make it the containing block for the fixed
     drawer inside it, clamping the panel to the header's 68px. Solid bar instead. */
  /* no blur here, so no translucency either — otherwise the heading underneath ghosts through */
  .bt-nav{backdrop-filter:none;background:#071b16}
  .bt-onthis{backdrop-filter:none;background:#0b2b22}
  .bt-burger{display:flex}
  /* keep the toggle clickable on top of the open panel — it is the close button */
  .bt-nav.is-open .bt-burger{position:relative;z-index:71;border-color:rgba(159,214,194,.55)}
  .bt-nav__scrim{position:fixed;inset:0;z-index:69;background:rgba(4,16,13,.62);opacity:0;visibility:hidden;transition:opacity .26s var(--ease),visibility .26s var(--ease)}
  .bt-nav.is-open .bt-nav__scrim{opacity:1;visibility:visible}
  .bt-nav__links{position:fixed;top:0;right:0;bottom:0;z-index:70;width:min(360px,88vw);
    display:flex;flex-direction:column;align-items:stretch;gap:0;
    background:#0b2b22;border-left:1px solid rgba(159,214,194,.2);
    padding:calc(var(--navh,64px) + 8px) 20px calc(28px + env(safe-area-inset-bottom));
    overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
    box-shadow:-24px 0 60px rgba(0,0,0,.5);
    transform:translateX(102%);transition:transform .3s var(--ease);visibility:hidden}
  .bt-nav.is-open .bt-nav__links{transform:none;visibility:visible}
  .bt-nav__links>li{border-bottom:1px solid rgba(159,214,194,.13)}
  .bt-nav__links>li:last-child{border-bottom:0}
  .bt-top{padding:15px 4px;font-size:16px;color:#eaf2ec;border-radius:0}
  .bt-top:hover{background:none;color:#fff}
  .bt-top[aria-expanded]::after{content:none}
  .bt-drop{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;
    background:none;padding:0 0 12px;min-width:0;display:flex;flex-direction:column;gap:1px}
  .bt-drop a{padding:11px 12px;font-size:14.5px;background:rgba(159,214,194,.06);border-radius:8px}
  .bt-nav__links>li:last-child{padding:18px 0 4px}
  .bt-nav .bt-btn--book{width:100%;min-height:50px;font-size:15px}
  body.is-locked{overflow:hidden}
  .bt-g3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bt-two,.bt-two--wide{grid-template-columns:minmax(0,1fr)}
  .bt-foot__grid{grid-template-columns:1fr 1fr}
  .bt-readings{position:static;width:auto;margin-top:16px;backdrop-filter:none}
  .bt-archwrap::before{display:none}
}
@media (max-width:680px){
  :root{--pad:18px}
  .bt-sec{padding:52px var(--gut)}
  .bt-hero__in{padding:38px var(--gut) 54px}
  .bt-g3,.bt-g4{grid-template-columns:minmax(0,1fr)}
  .bt-foot__grid{grid-template-columns:1fr}
  .bt-vert{display:none}
  .bt-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 0}
  .bt-stats b{font-size:26px}
  .bt-hero__cta{gap:10px;margin-bottom:34px}
  .bt-hero__cta .bt-btn{flex:1 1 100%}
  .bt-correction{padding:26px 22px}
  .bt-correction::before{left:22px}
  .bt-sticky__t{display:none}
  .bt-sticky__in{gap:10px}
  .bt-sticky .bt-btn{flex:1}
  .bt-arch{border-radius:200px 200px 20px 20px}
  .bt-logo i{display:none}
  .bt-logo b{font-size:19px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
@media print{.bt-nav,.bt-sticky,.bt-totop,.bt-steam,.bt-steam2{display:none}}

/* ---------- 404 ---------- */
.bt-404{padding-bottom:46px}
.bt-404grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:18px 0 0}
.bt-404grid a{display:block;text-decoration:none;background:var(--card);border:1px solid var(--line);
  border-left:3px solid var(--jade);border-radius:var(--r-m);padding:16px 18px;transition:border-color .18s,transform .18s}
.bt-404grid a:hover{border-color:var(--jade);transform:translateY(-2px)}
.bt-404grid b{display:block;font-family:var(--f-d);font-weight:500;font-size:18px;color:var(--ink);line-height:1.25}
.bt-404grid span{display:block;margin-top:4px;font-size:13.5px;color:var(--muted);line-height:1.45}