/* ============ TOKENS — Gisèle's official palette, used exclusively ============ */
/* White #FFFFFF · Deep Teal #0E3D40 · Aquamarine #7FFFD4 · Cyan #369694 · Olive Green #6A7F3C · Jaune Clair #FFF9C7
   One deliberate, fixed sunny palette — no separate dark-mode inversion, so the brand's own colors
   always read the same way. Every tint/shade below is one of these six colors blended with white,
   black, or itself (never a new hue) — black/white appear only as neutral shadow/overlay utility.

   COLOR ROLES
     --ink / --brand-ink   text & the fixed dark-teal "brand world" (hero, ribbon, footer)
     --paper / --surface   light backgrounds & card fills
     --aqua / --brand-mint accent on dark grounds (badges, hero eyebrow, CTA glow)
     --cyan                brand accent for icons, dots, focus rings, borders — NOT small body/label
                            text: #369694 on white/sun is 3.3–3.5:1, below WCAG AA's 4.5:1 for text
                            under ~18px. Small labels use --ink-soft instead; the colored dot/icon
                            next to them still carries the brand hue.
     --olive                secondary tag/label accent, used sparingly (surf-spot tags, partner names)
     --sun                  warm section backgrounds (Guide, Shop) — pairs with --ink at 11:1+

   TYPE SCALE (Newsreader=display, Hanken Grotesk=body, IBM Plex Mono=eyebrow/mono labels)
     12.5px mono uppercase   eyebrow/kicker labels
     14–16px Hanken Grotesk  body copy, buttons, form fields
     19–24px Newsreader      card/section sub-heads
     32–56px Newsreader      section H2 / hero H1 (clamp()'d fluid across breakpoints)

   SPACING & SHAPE
     8px grid via flex/grid `gap` (no ad-hoc margins between siblings)
     --radius-s/m/l = 10/18/28px, applied by component size (chip → card → hero panel)

   COMPONENTS reuse one shared vocabulary throughout: .btn (+ .btn-mint/.btn-dark/.btn-ghost/.btn-shine),
   .pill, .eyebrow, .bento/.bento-card, .wave-sep (section-transition divider), .addon-chip. New sections
   should compose these rather than introduce parallel one-off classes.

   ACCESSIBILITY: checked against WCAG AA (4.5:1 text / 3:1 large text & UI) for every color pairing
   actually used in this file. --ink on --paper/--sun/--aqua and --white on --ink all clear 9:1+.
   --cyan and --olive are kept off small body text for that reason; both remain fine for icons, borders,
   focus rings and large/bold headings (≥3:1 is enough there). :focus-visible uses a 2.5px --cyan outline
   with offset, so keyboard focus stays visible on every background in the page. */
:root{
  --white:#FFFFFF;
  --teal:#0E3D40;
  --aqua:#7FFFD4;
  --cyan:#369694;
  --olive:#6A7F3C;
  --sun:color-mix(in srgb, var(--cyan) 18%, white);

  --paper:#FFFFFF;
  --paper-raised:#FFFFFF;
  --surface:rgba(14,61,64,0.05);
  --surface-strong:rgba(14,61,64,0.10);
  --ink:#0E3D40;
  --ink-soft:rgba(14,61,64,0.72);
  --ink-faint:rgba(14,61,64,0.50);
  --line:rgba(14,61,64,0.16);
  --line-strong:rgba(14,61,64,0.30);

  --aqua-wash:rgba(127,255,212,0.32);
  --cyan-wash:rgba(54,150,148,0.14);
  --olive-wash:rgba(106,127,60,0.14);
  --sun-wash:color-mix(in srgb, var(--cyan) 30%, white);

  --shadow:0 1px 2px rgba(14,61,64,0.08), 0 12px 28px -14px rgba(14,61,64,0.30);
  --shadow-lg:0 24px 60px -24px rgba(14,61,64,0.45);
  --radius-s:10px;
  --radius-m:18px;
  --radius-l:28px;
  --font-display:'Newsreader', Georgia, serif;
  --font-body:'Hanken Grotesk', system-ui, -apple-system, sans-serif;
  --font-mono:'IBM Plex Mono', ui-monospace, 'SFMono-Regular', monospace;

  /* Fixed brand tokens for sections that always commit to the dark-teal
     brand world (hero, ribbon, footer) — identical to --teal; named
     separately so intent is clear at each call site. */
  --brand-ink:#0E3D40;
  --brand-ink-deep:#0E3D40;
  --brand-mint:#7FFFD4;
  --brand-cyan:#369694;
  --brand-olive:#6A7F3C;
}

/* ============ RESET / BASE ============ */
*,*::before,*::after{box-sizing:border-box;}
/* Component classes below set their own `display` (e.g. .btn{display:inline-flex}),
   which — being author CSS — wins over the browser's built-in [hidden] rule even
   though that rule is never overridden by specificity alone. This was letting the
   signed-out ".nav-join" pill stay visible next to the signed-in nav dropdown. */
[hidden]{display:none !important;}
/* No `scroll-behavior: smooth` here on purpose — Lenis (js/modules/site/smooth-scroll.js)
   owns scroll smoothing now, and the two fight each other over the scroll position. */
@media (prefers-reduced-motion: reduce){ *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;} }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;}
input,select{font:inherit;color:inherit;}
h1,h2,h3,h4,p{margin:0;}
h1,h2,h3,h4{font-family:var(--font-display);text-wrap:balance;}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
section{position:relative;}
::selection{background:var(--aqua);color:var(--teal);}
:focus-visible{outline:2.5px solid var(--cyan);outline-offset:3px;border-radius:4px;}

.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-body);font-weight:700;font-size:12.5px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--ink-soft); /* was --cyan: 3.3–3.5:1 on white/sun, fails AA at this size. The colored dot carries the brand accent instead. */
}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--aqua);flex:none;box-shadow:0 0 0 3px var(--aqua-wash);}
.pill{display:inline-flex;align-items:center;gap:6px;padding:6px 13px;border-radius:99px;font-size:12.5px;font-weight:700;letter-spacing:0.02em;border:1px solid var(--line-strong);}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:14px 26px;border-radius:99px;font-weight:700;font-size:15px;font-family:var(--font-body);
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
  white-space:nowrap;
}
.btn-primary{background:var(--ink);color:var(--paper-raised);box-shadow:0 10px 24px -10px rgba(14,61,64,0.55);}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 30px -10px rgba(14,61,64,0.65);}
.btn-mint{background:var(--brand-mint);color:var(--brand-ink-deep);box-shadow:0 10px 24px -10px rgba(127,255,212,0.55);}
.btn-mint:hover{transform:translateY(-2px);box-shadow:0 0 0 7px rgba(127,255,212,0.22), 0 16px 32px -10px rgba(127,255,212,0.65);}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line-strong);}
.btn-ghost:hover{border-color:var(--ink);transform:translateY(-2px);}
.btn-ghost-onink{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,0.4);}
.btn-ghost-onink:hover{border-color:#fff;transform:translateY(-2px);}
.btn-dark{background:var(--ink);color:var(--paper-raised);}
.btn-dark:hover{transform:translateY(-2px);}
.btn-sm{padding:10px 18px;font-size:13.5px;}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none !important;}

.section-head{max-width:640px;margin-bottom:52px;}
.section-head h2{font-size:clamp(30px,4.4vw,46px);font-weight:700;line-height:1.06;margin-top:14px;}
.pop{color:var(--cyan);}
.pop-logo-wrap{position:relative;display:inline-block;height:1.9em;aspect-ratio:700/293;vertical-align:-0.4em;margin-left:0.01em;}
.pop-logo{
  position:absolute;inset:0;
  background-color:var(--aqua);
  mask-size:contain;mask-repeat:no-repeat;mask-position:center;
  -webkit-mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;
  filter:drop-shadow(0 3px 9px rgba(14,61,64,0.45));
}
/* ---- scroll-triggered camera capture accent on the community-wall wordmark ---- */
.af2-bracket{position:absolute;width:15px;height:15px;border-color:rgba(14,61,64,0.85);border-style:solid;border-width:0;opacity:0;pointer-events:none;animation-duration:1.4s;animation-timing-function:cubic-bezier(.22,1,.36,1);animation-fill-mode:both;}
.af2-tl{top:-11px;left:-11px;border-top-width:2.5px;border-left-width:2.5px;border-radius:4px 0 0 0;}
.af2-tr{top:-11px;right:-11px;border-top-width:2.5px;border-right-width:2.5px;border-radius:0 4px 0 0;}
.af2-bl{bottom:-11px;left:-11px;border-bottom-width:2.5px;border-left-width:2.5px;border-radius:0 0 0 4px;}
.af2-br{bottom:-11px;right:-11px;border-bottom-width:2.5px;border-right-width:2.5px;border-radius:0 0 4px 0;}
.pop-logo-wrap.af2-play .af2-tl{animation-name:af2-snap-tl;}
.pop-logo-wrap.af2-play .af2-tr{animation-name:af2-snap-tr;}
.pop-logo-wrap.af2-play .af2-bl{animation-name:af2-snap-bl;}
.pop-logo-wrap.af2-play .af2-br{animation-name:af2-snap-br;}
@keyframes af2-snap-tl{0%{opacity:0;transform:translate(-12px,-12px) scale(1.25);}14%{opacity:1;}50%{opacity:1;transform:translate(0,0) scale(1);}76%{opacity:1;}100%{opacity:0;transform:translate(0,0) scale(1);}}
@keyframes af2-snap-tr{0%{opacity:0;transform:translate(12px,-12px) scale(1.25);}14%{opacity:1;}50%{opacity:1;transform:translate(0,0) scale(1);}76%{opacity:1;}100%{opacity:0;transform:translate(0,0) scale(1);}}
@keyframes af2-snap-bl{0%{opacity:0;transform:translate(-12px,12px) scale(1.25);}14%{opacity:1;}50%{opacity:1;transform:translate(0,0) scale(1);}76%{opacity:1;}100%{opacity:0;transform:translate(0,0) scale(1);}}
@keyframes af2-snap-br{0%{opacity:0;transform:translate(12px,12px) scale(1.25);}14%{opacity:1;}50%{opacity:1;transform:translate(0,0) scale(1);}76%{opacity:1;}100%{opacity:0;transform:translate(0,0) scale(1);}}
@media (prefers-reduced-motion: reduce){.af2-bracket{display:none;}}
#community .section-head h2{color:#000;}
#community .section-head{max-width:800px;}
.section-head p{margin-top:14px;color:var(--ink-soft);font-size:16.5px;max-width:52ch;}
.section-pad{padding:116px 0;}
@media (max-width:720px){.section-pad{padding:72px 0;}}

/* ============ WAVE DIVIDERS — the G's wave, carried through every section seam ============ */
.wave-sep{height:60px;line-height:0;background:var(--wsep-top);}
.wave-sep svg{display:block;width:100%;height:100%;}
.wave-sep svg path{fill:var(--wsep-bottom);}
@media (max-width:720px){.wave-sep{height:32px;}}

/* ============ BENTO (Why Gisèle) ============ */
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.bento-card{background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius-l);box-shadow:var(--shadow);padding:34px;display:flex;flex-direction:column;gap:14px;grid-column:span 2;transition:transform .2s ease, box-shadow .2s ease;}
.bento-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg), 0 0 34px -12px rgba(127,255,212,0.4);}
.bento-lg{grid-row:span 2;justify-content:flex-end;padding:40px;background:linear-gradient(155deg, var(--paper-raised) 55%, var(--sun-wash) 150%);position:relative;overflow:hidden;}
.bento-lg .bento-watermark{position:absolute;top:-10%;right:-14%;width:60%;opacity:0.24;fill:var(--cyan);pointer-events:none;}
.bento-lg h3{font-size:clamp(22px,2.4vw,27px);font-weight:700;line-height:1.15;}
.bento-lg p{color:var(--ink-soft);font-size:15.5px;max-width:38ch;}
.bento-card:not(.bento-lg) h4{font-size:18px;font-weight:700;}
.bento-card:not(.bento-lg) p{color:var(--ink-soft);font-size:14.5px;}
.bento-ico{width:42px;height:42px;border-radius:11px;background:var(--paper-raised);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex:none;box-shadow:var(--shadow);transition:transform .35s cubic-bezier(.34,1.56,.64,1);}
.bento-card:hover .bento-ico{transform:rotate(-8deg) scale(1.1);}
@media (prefers-reduced-motion: reduce){.bento-ico{transition:none;}.bento-card:hover .bento-ico{transform:none;}}

/* stamp badge removed — hero now features the full wordmark instead of the G sticker */
@media (max-width:980px){.bento{grid-template-columns:repeat(2,1fr);}.bento-lg{grid-row:span 1;}}
@media (max-width:640px){.bento{grid-template-columns:1fr;}.bento-card{grid-column:span 1 !important;}}

/* ============ NAV ============ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:18px 0;
  transition:background .3s ease, box-shadow .3s ease, padding .3s ease;
}
.nav.scrolled{background:color-mix(in srgb, var(--paper) 88%, transparent);backdrop-filter:blur(14px);padding:12px 0;box-shadow:none;}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;}
.brand{display:flex;align-items:center;gap:11px;}
.brand-logo{position:relative;display:block;height:30px;}
.brand-logo-img{display:block;height:30px;width:auto;transition:opacity .3s ease;}
.brand-logo-dark{position:absolute;top:0;left:0;opacity:0;}
.nav.scrolled .brand-logo-light{opacity:0;}
.nav.scrolled .brand-logo-dark{opacity:1;}
/* Nav floats over the hero, which is always dark-teal (brand-fixed) before
   the visitor scrolls — so nav content defaults to light-on-dark and only
   switches to theme-adaptive ink once .scrolled gives it a solid ground. */
.nav-links{display:flex;align-items:center;gap:30px;font-family:var(--font-body);font-size:12.5px;font-weight:600;text-transform:uppercase;letter-spacing:0.12em;}
.nav-links a{color:rgba(255,255,255,0.82);transition:color .18s ease;position:relative;}
.nav-links a:hover{color:#fff;}
.nav.scrolled .nav-links a{color:var(--ink-soft);}
.nav.scrolled .nav-links a:hover{color:var(--ink);}
.nav-cta{display:flex;align-items:center;gap:14px;}
.nav-join{color:#fff;border-color:rgba(255,255,255,0.45);}
.nav-join:hover{border-color:#fff;}
.nav.scrolled .nav-join{color:var(--ink);border-color:var(--line-strong);}
.nav.scrolled .nav-join:hover{border-color:var(--ink);}
.nav-toggle{display:none;width:40px;height:40px;align-items:center;justify-content:center;}
.burger{width:22px;height:16px;position:relative;}
.burger span{position:absolute;left:0;right:0;height:2px;background:#fff;border-radius:2px;transition:transform .25s ease, opacity .25s ease, background .3s ease;}
.nav.scrolled .burger span{background:var(--ink);}
.burger span:nth-child(1){top:0;}
.burger span:nth-child(2){top:7px;}
.burger span:nth-child(3){top:14px;}
.nav.open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav.open .burger span:nth-child(2){opacity:0;}
.nav.open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.mobile-panel{display:none;}
.subpage{background:var(--paper);}
.subpage .nav{background:color-mix(in srgb, var(--paper) 94%, transparent);backdrop-filter:blur(14px);padding:12px 0;}
.subpage .brand-logo-light{opacity:0;}
.subpage .brand-logo-dark{opacity:1;}
.subpage .nav-links a{color:var(--ink-soft);}
.subpage .nav-links a:hover,
.subpage .nav-links a[aria-current="page"]{color:var(--ink);}
.subpage .nav-join{color:var(--ink);border-color:var(--line-strong);}
.subpage .burger span{background:var(--ink);}
@media (max-width:860px){
  .nav-links{display:none;}
  .nav-cta .btn-ghost{display:none;}
  .nav-toggle{display:flex;}
  .nav.open .mobile-panel{display:flex;}
  .mobile-panel{
    position:fixed;inset:64px 0 0 0;background:var(--paper);z-index:99;
    flex-direction:column;padding:20px 24px 40px;gap:4px;overflow-y:auto;
  }
  .mobile-panel a{padding:16px 4px;border-bottom:1px solid var(--line);font-size:15px;font-weight:700;font-family:var(--font-body);text-transform:uppercase;letter-spacing:0.1em;}
  .mobile-panel .btn{margin-top:18px;width:100%;}
}

/* ============ HERO ============ */
.hero{padding:150px 0 0;position:relative;z-index:0;overflow:hidden;background:var(--brand-ink);color:#fff;}
/* ---- surfer loop background ---- */
.hero-video-wrap{position:absolute;inset:0;z-index:0;overflow:hidden;background:var(--brand-ink);}
.hero-video{width:100%;height:100%;object-fit:cover;object-position:center 42%;}
/* left-to-right scrim so the headline stays legible while the footage still reads on the right */
.hero-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(100deg, rgba(14,61,64,0.74) 0%, rgba(14,61,64,0.58) 26%, rgba(14,61,64,0.30) 46%, rgba(14,61,64,0.08) 66%, rgba(14,61,64,0) 82%);}
/* mobile stacks logo+text full-width and centered, so the left-heavy scrim above isn't enough — go uniform instead */
@media (max-width:900px){.hero-scrim{background:linear-gradient(180deg, rgba(14,61,64,0.70) 0%, rgba(14,61,64,0.55) 40%, rgba(14,61,64,0.72) 100%);}}
/* ---- animated sea — a slim, thick-wave foam line along the bottom edge, mixing teal + aquamarine ---- */
.hero-sea{position:absolute;inset:0;z-index:2;overflow:hidden;transform:scaleY(0.72);transform-origin:bottom;}
.sea-wash{position:absolute;inset:0;background:linear-gradient(to bottom, rgba(14,61,64,0) 52%, rgba(54,150,148,0.20) 76%, rgba(127,255,212,0.13) 100%);}
.sea-layer{position:absolute;left:0;bottom:0;width:200%;height:100%;}
.sea-layer svg{display:block;width:100%;height:100%;}
.sea-layer-back{animation:sea-drift 36s linear infinite;}
.sea-layer-mid{animation:sea-drift 24s linear infinite reverse;}
.sea-layer-front{animation:sea-drift 17s linear infinite;}
@keyframes sea-drift{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion: reduce){.sea-layer{animation:none;}}
.hero-inner{position:relative;z-index:3;display:grid;grid-template-columns:1fr auto;gap:56px;align-items:start;padding-bottom:70px;}
.hero-copy{text-align:left;}
@media (max-width:900px){.hero-inner{grid-template-columns:1fr;gap:26px;}.hero-wordmark{order:-1;justify-self:start;}}
.hero-wordmark{position:relative;flex:none;display:flex;align-items:center;justify-content:flex-end;justify-self:end;margin-top:-46px;}
.hero-wordmark-img{position:relative;z-index:1;height:124px;width:auto;filter:drop-shadow(0 8px 18px rgba(0,0,0,0.4));}
@media (max-width:900px){.hero-wordmark{margin-top:-14px;}.hero-wordmark-img{height:76px;}}

.hero-eyebrow-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:26px;}
.hero .eyebrow{color:var(--brand-mint);text-shadow:0 2px 10px rgba(0,0,0,0.45);}
.hero .pill{border-color:rgba(255,255,255,0.3);color:#fff;}
.hero h1{
  font-size:clamp(40px,7vw,88px);
  font-weight:700;line-height:1.02;letter-spacing:0.01em;
  color:#fff;text-transform:uppercase;
  text-shadow:0 4px 24px rgba(0,0,0,0.5);
}
.hero h1 em{font-style:normal;color:var(--brand-mint);}
.hero-sub{margin-top:24px;font-size:clamp(16px,1.7vw,19px);color:rgba(255,255,255,0.82);max-width:46ch;text-shadow:0 2px 12px rgba(0,0,0,0.4);}
.hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px;align-items:center;}
.hero-proof{margin-top:22px;font-family:var(--font-display);font-style:italic;font-weight:500;font-size:15px;letter-spacing:0.01em;color:rgba(255,255,255,0.6);display:flex;align-items:center;gap:10px;}
.hero-proof .avatars{display:flex;}
.hero-proof .avatars span{width:22px;height:22px;border-radius:50%;border:2px solid var(--brand-ink);margin-left:-8px;background:linear-gradient(135deg,var(--brand-mint),var(--brand-cyan));}
.hero-proof .avatars span:first-child{margin-left:0;}

.page-hero{
  min-height:420px;padding:136px 0 72px;display:flex;align-items:flex-end;
  background:var(--brand-ink);color:#fff;position:relative;overflow:hidden;
}
.page-hero::before{
  content:"";position:absolute;inset:0;background:url("../assets/hero-poster.jpg") center 42% / cover no-repeat;
  opacity:.54;transform:scale(1.02);
}
.page-hero::after{
  content:"";position:absolute;inset:0;background:linear-gradient(90deg, rgba(14,61,64,.86), rgba(14,61,64,.58) 46%, rgba(14,61,64,.22));
}
.page-hero .wrap{position:relative;z-index:1;width:100%;}
.page-hero-copy{max-width:720px;}
.page-hero h1{font-size:clamp(42px,7vw,78px);line-height:1.02;text-transform:uppercase;color:#fff;}
.page-hero h1 em{font-style:normal;color:var(--brand-mint);}
.page-hero p{margin-top:18px;color:rgba(255,255,255,.82);font-size:clamp(16px,1.8vw,19px);max-width:54ch;}
.page-hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px;}
@media (max-width:720px){
  .page-hero{min-height:360px;padding:112px 0 54px;}
  .page-hero::after{background:linear-gradient(180deg, rgba(14,61,64,.7), rgba(14,61,64,.82));}
}

.hero-sound-toggle{
  position:absolute;z-index:3;right:32px;bottom:132px;
  width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(14,61,64,0.45);border:1px solid rgba(255,255,255,0.35);
  color:#fff;cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  transition:transform .2s ease,background .2s ease,border-color .2s ease;
}
.hero-sound-toggle:hover{transform:scale(1.08);background:rgba(14,61,64,0.65);border-color:rgba(255,255,255,0.55);}
.hero-sound-toggle:focus-visible{outline:2px solid var(--brand-mint);outline-offset:2px;}
.hero-sound-toggle .icon-unmuted{display:none;}
.hero-sound-toggle.is-on .icon-muted{display:none;}
.hero-sound-toggle.is-on .icon-unmuted{display:block;}
@media (max-width:900px){.hero-sound-toggle{right:18px;bottom:96px;width:38px;height:38px;}}

/* marquee ribbon */
.ribbon{
  background:var(--brand-ink-deep);color:#fff;position:relative;z-index:4;
  overflow:hidden;white-space:nowrap;padding:13px 0;
  border-top:1px solid rgba(255,255,255,0.12);
}
.ribbon-track{display:inline-flex;animation:marquee 26s linear infinite;}
@media (prefers-reduced-motion: reduce){.ribbon-track{animation:none;}}
.ribbon-track span{
  font-family:var(--font-mono);font-size:13.5px;letter-spacing:0.06em;text-transform:uppercase;
  padding:0 26px;display:inline-flex;align-items:center;gap:26px;
}
.ribbon-track span::after{content:"◆";color:var(--brand-mint);font-size:9px;}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ============ WAITLIST ============ */
.waitlist{background:var(--sun);}
.waitlist-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:start;}
@media (max-width:920px){.waitlist-grid{grid-template-columns:1fr;gap:40px;}}
.waitlist-copy{position:relative;}
.waitlist-mark{position:absolute;top:-6px;right:2px;width:58px;height:58px;}
.waitlist-mark svg{width:100%;height:100%;fill:var(--cyan);filter:drop-shadow(0 8px 16px rgba(14,61,64,0.2));}
@media (max-width:920px){.waitlist-mark{display:none;}}
.perk-list{display:flex;flex-direction:column;gap:18px;margin-top:30px;}
.perk{display:flex;gap:14px;align-items:flex-start;}
.perk-ico{width:38px;height:38px;border-radius:11px;background:var(--paper-raised);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex:none;box-shadow:var(--shadow);}
.perk h4{font-size:15.5px;font-family:var(--font-body);font-weight:700;}
.perk p{color:var(--ink-soft);font-size:14.5px;margin-top:3px;}
.count-card{
  margin-top:34px;padding:20px 22px;border-radius:var(--radius-m);background:var(--paper-raised);
  border:1px solid var(--line);display:flex;align-items:center;gap:16px;box-shadow:var(--shadow);
}
.count-num{font-family:var(--font-display);font-size:38px;font-weight:700;color:var(--cyan);line-height:1;font-variant-numeric:tabular-nums;}
.count-label{font-size:13px;color:var(--ink-soft);max-width:22ch;}

.form-card{
  background:var(--paper-raised);border-radius:var(--radius-l);border:1px solid var(--line);
  padding:38px;box-shadow:var(--shadow-lg);
}
.form-card h3{font-size:23px;font-weight:700;}
.form-card>p{color:var(--ink-soft);font-size:14.5px;margin-top:8px;}
.field{margin-top:20px;}
.field label{display:block;font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-faint);margin-bottom:8px;}
.field input,.field select{
  width:100%;padding:14px 16px;border-radius:12px;border:1.5px solid var(--line-strong);
  background:var(--paper);color:var(--ink);font-size:15px;transition:border-color .18s ease, box-shadow .18s ease;
}
.field input:focus,.field select:focus{border-color:var(--cyan);outline:none;box-shadow:0 0 0 4px var(--cyan-wash);}
.form-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:26px;flex-wrap:wrap;}
.form-note{font-size:12.5px;color:var(--ink-faint);max-width:26ch;}
.form-msg{margin-top:16px;font-size:13.5px;border-radius:10px;padding:12px 14px;display:none;}
.form-msg.show{display:block;}
.form-msg.ok{background:var(--aqua-wash);color:var(--teal);}
.form-msg.err{background:var(--sun);color:var(--teal);}
.thankyou{display:none;text-align:center;padding:20px 0;}
.thankyou.show{display:block;}
.thankyou .check{width:56px;height:56px;border-radius:50%;background:var(--aqua-wash);display:flex;align-items:center;justify-content:center;margin:0 auto 18px;}
.form-body.hide{display:none;}

/* ============ ACCOUNT ============ */
.account-section{background:var(--paper);}
.account-shell{
  border:1px solid var(--line);border-radius:var(--radius-l);background:var(--paper-raised);
  box-shadow:var(--shadow-lg);overflow:hidden;
}
.account-auth{display:grid;grid-template-columns:1fr 1.05fr;gap:0;min-height:420px;}
.account-auth[hidden],
.account-dashboard[hidden],
.account-empty[hidden],
.account-block[hidden]{display:none;}
.account-auth-copy{
  padding:42px;background:linear-gradient(155deg, var(--brand-ink), var(--cyan));
  color:#fff;display:flex;flex-direction:column;justify-content:flex-end;
}
.account-auth-copy h3{font-size:clamp(28px,4vw,42px);line-height:1.05;}
.account-auth-copy p{margin-top:14px;color:rgba(255,255,255,.78);max-width:38ch;}
.auth-panel{padding:38px;display:flex;flex-direction:column;justify-content:center;}
.auth-tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;padding:5px;border:1px solid var(--line);border-radius:99px;background:var(--surface);margin-bottom:10px;}
.auth-tab{padding:10px 14px;border-radius:99px;font-weight:800;font-size:13px;color:var(--ink-soft);transition:background .18s ease,color .18s ease;}
.auth-tab.is-active{background:var(--paper-raised);color:var(--ink);box-shadow:var(--shadow);}
.auth-submit{width:100%;margin-top:22px;}
.auth-message{display:none;margin-top:16px;padding:12px 14px;border-radius:var(--radius-s);font-size:13.5px;}
.auth-message.show{display:block;}
.auth-message.ok{background:var(--aqua-wash);color:var(--ink);}
.auth-message.err{background:var(--sun);color:var(--ink);}
.password-field{position:relative;display:flex;align-items:center;flex:1;min-width:0;}
.password-field input{width:100%;padding-right:48px;}
.password-field.is-valid input{border-color:var(--olive);}
.password-field.is-invalid input{border-color:#B3492F;}
.password-toggle{
  position:absolute;right:8px;top:50%;transform:translateY(-50%);
  width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--ink-faint);transition:background .18s ease,color .18s ease;
}
.password-toggle:hover{background:var(--surface);color:var(--ink);}
.password-toggle svg{width:18px;height:18px;}
.password-toggle .icon-eye-off{display:none;}
.password-toggle.is-visible .icon-eye{display:none;}
.password-toggle.is-visible .icon-eye-off{display:block;}
.password-rules{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:12px 0 0;padding:0;}
.password-rules li{
  list-style:none;display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:var(--ink-faint);
}
.password-rules li::before{
  content:"";width:8px;height:8px;border-radius:50%;background:var(--line-strong);flex:none;
}
.password-rules li.is-valid{color:var(--olive);}
.password-rules li.is-valid::before{background:var(--olive);}
.password-rules li.is-invalid{color:#B3492F;}
.password-rules li.is-invalid::before{background:#B3492F;}
.password-rules-compact{grid-template-columns:1fr;margin-top:10px;}

.account-page .account-section{padding-top:128px;}
.account-dashboard{padding:30px;display:flex;flex-direction:column;gap:24px;background:linear-gradient(180deg, var(--paper-raised), var(--surface));}
.account-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:24px;border:1px solid var(--line);border-radius:var(--radius-m);background:var(--paper-raised);}
.account-head-profile{display:flex;align-items:center;gap:16px;}
.account-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
.account-avatar{
  width:62px;height:62px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--brand-ink);color:var(--brand-mint);font-family:var(--font-mono);font-weight:800;font-size:20px;
  box-shadow:var(--shadow);
}
.account-avatar-small{width:46px;height:46px;font-size:15px;}
.account-head h3{font-size:clamp(25px,3.6vw,38px);line-height:1.08;margin-top:10px;}
.account-head p{color:var(--ink-soft);font-weight:700;margin-top:5px;}
.account-dashboard-grid{display:grid;grid-template-columns:260px 1fr;gap:22px;align-items:start;}
.account-sidebar{position:sticky;top:92px;display:flex;flex-direction:column;gap:12px;}
.account-sidebar-card,.account-menu{
  border:1px solid var(--line);border-radius:var(--radius-m);background:var(--paper-raised);
  box-shadow:var(--shadow);padding:18px;
}
.account-sidebar-card{display:flex;flex-direction:column;gap:8px;}
.account-sidebar-card strong{font-size:15px;}
.account-sidebar-card span{font-size:12.5px;color:var(--ink-soft);overflow-wrap:anywhere;}
.account-menu{display:flex;flex-direction:column;gap:4px;padding:10px;}
.account-menu a{padding:11px 12px;border-radius:var(--radius-s);font-weight:800;font-size:13px;color:var(--ink-soft);transition:background .18s ease,color .18s ease;}
.account-menu a:hover{background:var(--surface);color:var(--ink);}
.account-dashboard-main{display:flex;flex-direction:column;gap:18px;min-width:0;}
.account-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.account-metrics div{border:1px solid var(--line);border-radius:var(--radius-m);background:var(--paper-raised);padding:18px;box-shadow:var(--shadow);}
.account-metrics span{display:block;font-family:var(--font-mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);}
.account-metrics strong{display:block;margin-top:8px;font-family:var(--font-display);font-size:28px;line-height:1;color:var(--ink);}
.account-badge,.account-status{
  display:inline-flex;align-items:center;width:fit-content;border-radius:99px;font-family:var(--font-mono);
  font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;
}
.account-badge{background:var(--aqua-wash);color:var(--ink);padding:7px 11px;}
.account-status{background:var(--surface);color:var(--ink-soft);padding:4px 9px;margin-bottom:8px;}
.account-payment-badge{
  display:inline-flex;align-items:center;width:fit-content;border-radius:99px;font-family:var(--font-mono);
  font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;font-weight:700;padding:4px 9px;margin:6px 0;
  background:var(--surface);color:var(--ink-soft);
}
.account-payment-paid{background:var(--aqua-wash);color:var(--ink);}
.account-payment-failed{background:rgba(180,70,50,0.12);color:#B3492F;}
.account-payment-pending{background:var(--sun-wash);color:var(--ink);}
.account-empty{padding:24px;border-radius:var(--radius-m);background:var(--sun);border:1px solid var(--line);}
.account-empty h4{font-size:22px;}
.account-empty p{color:var(--ink-soft);max-width:54ch;margin:8px 0 18px;}
.account-block{border:1px solid var(--line);border-radius:var(--radius-m);padding:22px;background:var(--paper-raised);}
.account-block-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px;}
.account-block-head h4{font-family:var(--font-body);font-size:16px;font-weight:800;}
.account-block-head span,.account-block-head a{font-family:var(--font-mono);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);}
.account-block-head a:hover{color:var(--ink);text-decoration:underline;}
.account-card-list,.account-history-list{display:flex;flex-direction:column;gap:12px;}
.account-reservation-card,.account-history-row{
  display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px;
  border-radius:var(--radius-s);background:var(--surface);border:1px solid var(--line);
}
.account-reservation-card h5,.account-history-row h5{font-family:var(--font-body);font-size:15px;font-weight:800;margin:0;}
.account-reservation-card p,.account-history-row p,.account-shop-placeholder p,.account-load{font-size:13.5px;color:var(--ink-soft);}
.account-card-action{display:flex;flex:none;}
.account-history-row .btn{flex:none;}
.account-shop-placeholder{background:var(--surface);}
.account-faq{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.account-faq details{border:1px solid var(--line);border-radius:var(--radius-s);padding:14px 16px;background:var(--surface);}
.account-faq summary{cursor:pointer;font-weight:800;font-size:13.5px;}
.account-faq p{margin-top:8px;color:var(--ink-soft);font-size:13px;}
.account-support-placeholder{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.account-support-placeholder div{border:1px dashed var(--line-strong);border-radius:var(--radius-s);padding:16px;background:var(--surface);}
.account-support-placeholder span{display:block;font-family:var(--font-mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);}
.account-support-placeholder strong{display:block;margin-top:6px;font-family:var(--font-body);font-size:15px;color:var(--ink);}
.account-settings-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.account-setting-form label{display:block;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);margin-bottom:8px;}
.account-setting-label-spaced{margin-top:14px;}
.account-setting-row{display:flex;gap:8px;}
.account-setting-row input{
  min-width:0;flex:1;padding:11px 13px;border-radius:var(--radius-s);border:1.5px solid var(--line-strong);
  background:var(--paper);font-size:14px;
}
.account-setting-row .password-field input{padding-right:48px;}
.account-setting-row input:focus{border-color:var(--cyan);outline:none;box-shadow:0 0 0 4px var(--cyan-wash);}
.account-setting-message{display:none;font-size:12.5px;margin-top:8px;color:var(--ink-soft);}
.account-setting-message.show{display:block;}
.account-setting-message.err{color:var(--ink);}
.account-logout{margin-top:18px;width:fit-content;}
.account-sidebar .account-logout{width:100%;margin-top:0;}
.account-auth-simple{grid-template-columns:1fr;min-height:0;}
.account-auth-simple .account-auth-copy{align-items:center;justify-content:center;text-align:center;padding:56px 40px;gap:18px;}
.account-auth-simple .account-auth-copy .btn{align-self:center;}
.account-support-grid.account-support-grid-3{grid-template-columns:repeat(3,1fr);}
@media (max-width:860px){
  .account-support-grid.account-support-grid-3{grid-template-columns:1fr;}
}
@media (max-width:880px){
  .account-auth{grid-template-columns:1fr;}
  .account-auth-copy{min-height:240px;}
  .account-settings-grid,.account-faq,.account-support-placeholder{grid-template-columns:1fr;}
  .account-dashboard-grid{grid-template-columns:1fr;}
  .account-sidebar{position:static;}
  .account-menu{flex-direction:row;overflow-x:auto;}
  .account-menu a{white-space:nowrap;}
}
@media (max-width:620px){
  .account-dashboard,.auth-panel,.account-auth-copy{padding:24px;}
  .account-head,.account-head-profile,.account-head-actions{align-items:flex-start;flex-direction:column;}
  .account-head-actions,.account-head-actions .btn{width:100%;}
  .account-metrics{grid-template-columns:1fr;}
  .account-reservation-card,.account-history-row{align-items:flex-start;flex-direction:column;}
  .account-card-action,.account-history-row .btn,.account-setting-row,.account-setting-row .btn{width:100%;}
  .account-setting-row{flex-direction:column;}
  .password-rules{grid-template-columns:1fr;}
}

/* ============ GEAR ============ */
.gear-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:36px;}
.gear-tab{padding:10px 18px;border-radius:99px;border:1.5px solid var(--line-strong);font-weight:700;font-size:13.5px;transition:all .18s ease;}
.gear-tab.active{background:var(--ink);color:var(--paper-raised);border-color:var(--ink);}
.gear-note{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-faint);margin:-16px 0 34px;font-family:var(--font-mono);}
.gear-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
@media (max-width:980px){.gear-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:660px){.gear-grid{grid-template-columns:1fr;}}
.gear-grid-status{grid-column:1 / -1;padding:18px 20px;border:1.5px dashed var(--line-strong);border-radius:var(--radius-m);background:var(--surface);color:var(--ink-faint);font-size:13px;}
.gear-card{background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius-l);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:transform .2s ease, box-shadow .2s ease;}
.gear-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg), 0 0 34px -12px rgba(127,255,212,0.4);}
.gear-card[data-cat]{display:none;}
.gear-card[data-cat].is-visible{display:flex;}

.spin-stage{
  position:relative;height:220px;background:radial-gradient(120% 100% at 50% 100%, var(--surface-strong), var(--surface) 60%);
  touch-action:none;cursor:grab;user-select:none;overflow:hidden;
}
.spin-stage:active{cursor:grabbing;}
.spin-badge{position:absolute;top:14px;left:14px;z-index:3;font-family:var(--font-mono);font-size:11px;background:var(--ink);color:var(--paper-raised);padding:5px 10px;border-radius:99px;display:flex;align-items:center;gap:6px;letter-spacing:0.04em;}
.spin-badge svg{width:11px;height:11px;}
.spin-hint{position:absolute;bottom:12px;left:0;right:0;text-align:center;font-size:11px;color:var(--ink-faint);font-family:var(--font-mono);letter-spacing:0.04em;z-index:3;opacity:.85;pointer-events:none;transition:opacity .3s ease;}
.spin-3d{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;perspective:900px;}
.spin-obj{width:150px;height:150px;transform-style:preserve-3d;will-change:transform;}
.spin-obj svg{position:absolute;inset:0;width:100%;height:100%;filter:drop-shadow(0 18px 14px rgba(0,0,0,0.18));}
.spin-shadow{position:absolute;bottom:26px;left:50%;width:120px;height:20px;background:radial-gradient(closest-side, rgba(0,0,0,0.28), transparent 75%);border-radius:50%;transform:translateX(-50%);z-index:0;transition:transform .1s linear;}

.gear-body{padding:22px 24px 26px;display:flex;flex-direction:column;gap:14px;flex:1;}
.gear-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;}
.gear-title-row h4{font-size:18px;font-weight:600;}
.gear-cat-tag{font-family:var(--font-mono);font-size:10.5px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:0.06em;}
.status{font-size:11px;font-weight:700;padding:5px 10px;border-radius:99px;white-space:nowrap;font-family:var(--font-mono);}
.status.avail{background:var(--aqua-wash);color:var(--teal);}
.status.booked{background:var(--sun);color:var(--teal);}
.status.soon{background:var(--surface-strong);color:var(--ink-faint);}
.gear-desc{font-size:13.5px;color:var(--ink-soft);line-height:1.55;}
.gear-specs{display:flex;flex-direction:column;gap:6px;}
.gear-specs li{list-style:none;display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--ink-soft);line-height:1.4;}
.gear-specs li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--cyan);margin-top:5.5px;flex:none;}
.gear-video{display:flex;align-items:center;gap:9px;padding:11px 14px;border-radius:var(--radius-s);background:var(--surface);border:1px dashed var(--line-strong);font-size:12px;color:var(--ink-faint);font-weight:600;}
.gear-video svg{width:16px;height:16px;flex:none;}
.gear-addons-label{font-family:var(--font-mono);font-size:10.5px;text-transform:uppercase;letter-spacing:0.06em;color:var(--ink-faint);margin-bottom:-4px;}
.gear-addons{display:flex;flex-wrap:wrap;gap:7px;}
.addon-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:99px;background:var(--surface);font-size:11.5px;font-weight:700;color:var(--ink-soft);cursor:default;}
.addon-chip svg{width:13px;height:13px;flex:none;color:var(--cyan);}
.condition{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--ink-faint);}
.condition-bar{flex:1;height:5px;border-radius:99px;background:var(--surface-strong);overflow:hidden;}
.condition-bar i{display:block;height:100%;background:var(--cyan);border-radius:99px;}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:4px;}
.price-cell{background:var(--surface);border-radius:10px;padding:9px 6px;text-align:center;}
.price-cell .dur{font-size:10px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:0.04em;}
.price-cell .amt{font-family:var(--font-mono);font-weight:700;font-size:14.5px;margin-top:3px;font-variant-numeric:tabular-nums;}
.gear-cta{margin-top:auto;padding-top:6px;}
.gear-cta .btn{width:100%;}

/* ============ BALI GUIDE ============ */
.guide{background:var(--sun);color:var(--ink);}
.guide .section-head p{color:var(--ink-soft);}
.guide .eyebrow{color:var(--ink-soft);}
.journal{margin-top:12px;}
.journal-stamp{
  font-family:'Permanent Marker',cursive;font-size:24px;font-weight:700;color:var(--cyan);
  transform:rotate(-1.5deg);display:inline-block;
}
.journal-lede{margin-top:10px;font-size:16px;line-height:1.6;color:var(--ink-soft);max-width:68ch;}

.journal-map-frame{
  margin-top:18px;border-radius:var(--radius-l);border:1px solid var(--line);box-shadow:var(--shadow);
  overflow:hidden;background:var(--paper-raised);padding:8px;
}
.journal-map{width:100%;height:440px;border-radius:calc(var(--radius-l) - 4px);background:var(--surface);z-index:0;}
.journal-map-hint{margin-top:10px;font-size:12px;color:var(--ink-faint);font-family:var(--font-mono);}
@media (max-width:720px){.journal-map{height:340px;}}

/* ---- chapter tabs: like the colour-coded index tabs on a real book's
   fore-edge, jumping straight to a chapter instead of filtering a list ---- */
.journal-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px;}
.journal-tab{
  display:inline-flex;align-items:center;gap:9px;padding:8px 18px 8px 8px;border-radius:99px;
  border:1.5px solid var(--line-strong);background:var(--paper-raised);
  font-family:var(--font-body);font-weight:700;font-size:13px;color:var(--ink-soft);
  transition:background .15s ease,color .15s ease,border-color .15s ease;
}
.journal-tab-num{
  display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;flex:none;
  font-family:var(--font-display);font-style:italic;font-size:12.5px;font-weight:700;
  background:var(--surface);color:var(--ink);transition:background .15s ease,color .15s ease;
}
.journal-tab:hover{border-color:var(--ink);color:var(--ink);}
.journal-tab.is-active{background:var(--ink);border-color:var(--ink);color:var(--paper-raised);}
.journal-tab.is-active .journal-tab-num{background:rgba(255,255,255,0.2);color:var(--paper-raised);}

/* ---- the journal itself: a real StPageFlip book (github.com/Nodlik/StPageFlip)
   — genuine bending pages with drag-to-turn, hard covers and a two-page
   spread, not a hand-rolled CSS rotateY card ---- */
.journal-flipbook-frame{
  margin-top:24px;display:flex;align-items:center;justify-content:center;gap:18px;
  padding:38px 18px 54px;
}
.journal-flipbook{
  width:100%;max-width:1040px;filter:drop-shadow(0 30px 50px rgba(14,61,64,0.28)) drop-shadow(0 4px 14px rgba(14,61,64,0.16));
}
.journal-book-nav{
  flex:none;width:48px;height:48px;border-radius:50%;border:1px solid var(--line-strong);background:var(--paper-raised);
  color:var(--ink);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);
  transition:background .15s ease,color .15s ease,transform .15s ease;
}
.journal-book-nav svg{width:20px;height:20px;}
.journal-book-nav:hover{background:var(--ink);color:var(--paper-raised);transform:scale(1.05);}
.journal-book-nav:disabled{opacity:.4;pointer-events:none;}
.journal-book-count{text-align:center;margin-top:8px;font-family:var(--font-mono);font-size:11.5px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.06em;}
.journal-book-count strong{color:var(--ink);}
.journal-book-hint{text-align:center;margin-top:4px;font-size:12px;color:var(--ink-faint);}
@media (max-width:720px){
  .journal-flipbook-frame{gap:6px;padding:24px 4px 40px;}
  .journal-book-nav{width:38px;height:38px;}
  .journal-book-nav svg{width:16px;height:16px;}
}

/* every physical page: StPageFlip adds position/display/transform-style —
   background, padding and content are ours to style freely */
.journal-flip-page{background:var(--paper-raised);box-shadow:inset 0 0 0 1px var(--line);}
.journal-flip-page[data-density="hard"]{box-shadow:none;}
.journal-page-inner{
  position:relative;width:100%;height:100%;box-sizing:border-box;padding:34px 36px;
  overflow-y:auto;display:flex;flex-direction:column;
}
.journal-folio{
  font-family:var(--font-mono);font-size:10px;font-weight:700;color:var(--ink-faint);
  text-transform:uppercase;letter-spacing:.08em;flex:none;
}
.journal-page-folio-num{
  margin-top:auto;padding-top:10px;font-family:var(--font-mono);font-size:11px;color:var(--ink-faint);flex:none;
}
@media (max-width:720px){.journal-page-inner{padding:26px 22px;}}

/* ---- front & back covers ---- */
.journal-cover,.journal-back-cover{
  height:100%;color:var(--paper-raised);display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;gap:16px;padding:20px;
  background:linear-gradient(165deg, var(--brand-ink) 0%, #071f21 100%);
}
.journal-cover-mark{
  width:64px;height:64px;border-radius:50%;border:1.5px solid rgba(255,255,255,0.35);
  display:flex;align-items:center;justify-content:center;
}
.journal-cover-mark svg{width:28px;height:28px;}
.journal-cover-kicker,.journal-back-kicker{
  font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--aqua);
}
.journal-cover-title{font-family:var(--font-display);font-size:clamp(30px,4vw,42px);line-height:1.08;}
.journal-cover-title em{font-style:italic;color:var(--aqua);}
.journal-cover-sub{font-size:14.5px;line-height:1.6;color:rgba(255,255,255,0.72);max-width:30ch;}
.journal-cover-foot,.journal-back-foot{font-family:var(--font-mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,0.5);}
.journal-back-slogan{font-family:var(--font-display);font-style:italic;font-size:22px;color:var(--aqua);}

/* ---- table of contents page ---- */
.journal-toc-title{font-family:var(--font-display);font-size:clamp(24px,2.6vw,30px);color:var(--ink);margin-top:4px;}
.journal-toc-list{margin-top:16px;display:flex;flex-direction:column;}
.journal-toc-item{
  display:flex;align-items:center;gap:16px;padding:16px 4px;border-bottom:1px dashed var(--line);
  text-align:left;background:none;border-radius:0;width:100%;
}
.journal-toc-item:last-child{border-bottom:none;}
.journal-toc-item:hover .journal-toc-num{background:var(--ink);color:var(--paper-raised);}
.journal-toc-num{
  flex:none;width:38px;height:38px;border-radius:50%;background:var(--surface);color:var(--ink);
  display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-style:italic;font-weight:700;font-size:15px;
  transition:background .15s ease,color .15s ease;
}
.journal-toc-copy{flex:1;display:flex;flex-direction:column;gap:3px;}
.journal-toc-copy strong{font-family:var(--font-display);font-size:18px;color:var(--ink);}
.journal-toc-copy span{font-size:12.5px;color:var(--ink-soft);}
.journal-toc-copy small{font-family:var(--font-mono);font-size:10.5px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.04em;}
.journal-toc-arrow{flex:none;color:var(--ink-faint);}

/* ---- chapter divider page (dense: intro + a quick-facts sidebar) ---- */
.journal-chapter-head{display:flex;align-items:baseline;gap:16px;}
.journal-chapter-numeral{font-family:var(--font-display);font-style:italic;font-weight:700;font-size:clamp(48px,6vw,68px);line-height:.85;color:var(--cyan);flex:none;}
.journal-chapter-title{font-family:var(--font-display);font-size:clamp(26px,3vw,34px);color:var(--ink);}
.journal-chapter-intro{margin-top:14px;font-size:15px;line-height:1.65;color:var(--ink-soft);max-width:60ch;}
.journal-chapter-intro::first-letter{
  font-family:var(--font-display);font-weight:700;font-size:2.5em;line-height:.72;float:left;
  padding:4px 7px 0 0;color:var(--ink);
}
.journal-chapter-facts{
  margin-top:20px;padding:16px 18px;border:1px solid var(--line);border-radius:var(--radius-m);background:var(--surface);
  max-width:52ch;
}
.journal-chapter-facts-head{font-family:var(--font-mono);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-faint);}
.journal-chapter-facts ul{margin-top:10px;display:flex;flex-direction:column;gap:8px;}
.journal-chapter-facts li{font-size:13px;line-height:1.5;color:var(--ink-soft);padding-left:16px;position:relative;}
.journal-chapter-facts li::before{content:"—";position:absolute;left:0;color:var(--ink-faint);}
.journal-chapter-meta{margin-top:18px;font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);}

/* ---- content page: several entries stacked on one page, field-guide style ---- */
.journal-entry{display:flex;gap:16px;padding:16px 0;border-bottom:1px dashed var(--line);}
.journal-entry:first-child{padding-top:6px;}
.journal-entry:last-child{border-bottom:none;}
.journal-entry-photo{
  position:relative;flex:none;width:104px;height:130px;background:var(--paper-raised);
  padding:6px 6px 20px;box-shadow:0 8px 18px -10px rgba(14,61,64,.4);transform:rotate(-2deg);align-self:flex-start;
}
.journal-entry:nth-child(even) .journal-entry-photo{transform:rotate(2deg);}
.journal-entry-photo-inner{
  position:relative;width:100%;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,0.7);background:linear-gradient(155deg, var(--brand-ink) 0%, var(--cyan) 130%);
}
.journal-entry-photo.is-beginner .journal-entry-photo-inner{background:linear-gradient(155deg, #2f6b4a 0%, #7fd9a4 140%);}
.journal-entry-photo.is-intermediate .journal-entry-photo-inner{background:linear-gradient(155deg, #9a6a12 0%, #f2b84f 140%);}
.journal-entry-photo.is-advanced .journal-entry-photo-inner{background:linear-gradient(155deg, #7a2c22 0%, #e2685a 140%);}
.journal-entry-photo.is-food .journal-entry-photo-inner{background:linear-gradient(155deg, #6a4a1f 0%, #e8b979 140%);}
.journal-entry-photo.is-view .journal-entry-photo-inner{background:linear-gradient(155deg, var(--brand-ink) 0%, var(--cyan) 140%);}
.journal-entry-photo.is-partner .journal-entry-photo-inner{background:repeating-linear-gradient(135deg, var(--surface), var(--surface) 8px, var(--paper-raised) 8px, var(--paper-raised) 16px);color:var(--ink-faint);}
.journal-entry-photo-inner svg{width:16px;height:16px;}
.journal-entry-stamp{
  position:absolute;top:10px;right:10px;padding:2px 6px;border:1.5px solid rgba(122,44,34,.55);border-radius:4px;
  transform:rotate(9deg);font-family:'Permanent Marker',cursive;font-weight:700;font-size:12px;color:rgba(122,44,34,.75);
  background:rgba(255,255,255,.55);
}
.journal-entry-sticker{
  position:absolute;left:-8px;bottom:10px;z-index:2;display:inline-flex;align-items:center;gap:2px;
  padding:3px 6px;border-radius:6px;background:var(--paper-raised);box-shadow:0 4px 10px -5px rgba(0,0,0,.4);
  transform:rotate(-4deg);
}
.journal-entry-sticker-skill{font-family:var(--font-mono);font-size:8px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--ink);}
.journal-entry-sticker .journal-star{width:9px;height:9px;color:var(--ink-faint);}
.journal-entry-sticker .journal-star.is-filled{color:#c9962f;}
.journal-entry-body{flex:1;min-width:0;}
.journal-entry-tag{
  font-family:'Permanent Marker',cursive;font-size:18px;font-weight:700;color:var(--cyan);transform:rotate(-1deg);display:inline-block;
}
.journal-entry-name{font-size:17px;font-weight:700;font-family:var(--font-display);line-height:1.2;margin-top:1px;}
.journal-entry-desc{margin-top:6px;font-size:13px;color:var(--ink-soft);line-height:1.55;}
.journal-entry-links{margin-top:8px;display:flex;flex-wrap:wrap;gap:14px;}
.journal-entry-link{font-family:var(--font-mono);font-size:10.5px;font-weight:700;color:var(--teal);text-transform:uppercase;letter-spacing:.04em;}
.journal-entry-link:hover{text-decoration:underline;text-underline-offset:3px;}
.journal-entry-pin{color:var(--ink-soft);}
.journal-entry-pin:hover{color:var(--ink);}

/* Small pill badge — used only inside map popups now (the book page uses
   the rotated .journal-sticker treatment instead). */
.journal-badge{display:inline-flex;align-items:center;gap:3px;padding:6px 11px;border-radius:99px;background:rgba(255,255,255,0.94);}
.journal-badge-skill{font-family:var(--font-mono);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--ink);}
.journal-badge-price{padding:6px 9px;}
.journal-badge-partner{font-family:var(--font-mono);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);background:rgba(255,255,255,0.85);}
.journal-star{width:13px;height:13px;color:var(--ink-faint);}
.journal-star.is-filled{color:#c9962f;}

/* Leaflet skin: warm the default OSM tiles slightly and match the site's rounded, soft look. */
.leaflet-tile-pane{filter:sepia(0.12) saturate(0.92) brightness(1.03);}
.leaflet-container{font-family:var(--font-body);}
.gisele-pin-icon{border-radius:50%;border:2px solid var(--paper-raised);box-shadow:0 6px 14px -4px rgba(14,61,64,0.5);background:var(--paper-raised);cursor:pointer;}
.leaflet-popup-content-wrapper{border-radius:var(--radius-m);box-shadow:var(--shadow-lg);}
.leaflet-popup-content{margin:14px 16px;}
.journal-popup{display:flex;flex-direction:column;gap:5px;min-width:200px;}
.journal-popup .journal-badge{position:static;align-self:flex-start;box-shadow:none;background:var(--surface);padding:4px 9px;margin-bottom:2px;}
.journal-popup strong{font-family:var(--font-display);font-size:16px;color:var(--ink);}
.journal-popup-tag{font-family:var(--font-mono);font-size:10px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.05em;}
.journal-popup p{font-size:12.5px;color:var(--ink-soft);line-height:1.5;margin:4px 0 0;}
.journal-popup a{font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--teal);text-transform:uppercase;letter-spacing:0.04em;margin-top:6px;}
.journal-popup a:hover{text-decoration:underline;}

/* ============ HOME LINKS ============ */
.link-section{background:var(--sun);}
.link-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
.link-card{
  min-height:260px;border-radius:var(--radius-l);border:1px solid var(--line);box-shadow:var(--shadow);
  padding:30px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;
  background:var(--paper-raised);transition:transform .2s ease, box-shadow .2s ease;
}
.link-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg), 0 0 32px -12px rgba(127,255,212,.38);}
.link-card::before{content:"";position:absolute;inset:0;background:linear-gradient(140deg, rgba(14,61,64,.02), rgba(54,150,148,.18));}
.link-card > *{position:relative;z-index:1;}
.link-card h3{font-size:clamp(24px,3vw,32px);line-height:1.08;margin-top:16px;}
.link-card p{color:var(--ink-soft);max-width:38ch;margin-top:12px;}
.link-card-action{margin-top:24px;font-weight:800;color:var(--ink);font-size:14px;}
.link-card-guide{background:linear-gradient(155deg, var(--paper-raised) 48%, var(--aqua-wash));}
.link-card-shop{background:linear-gradient(155deg, var(--paper-raised) 52%, var(--sun-wash));}
@media (max-width:760px){.link-grid{grid-template-columns:1fr;}.link-card{min-height:220px;}}

/* ============ COMMUNITY ============ */
.community-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
@media (max-width:900px){.community-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.community-grid{grid-template-columns:1fr 1fr;}}
.tile{aspect-ratio:4/5;border-radius:var(--radius-m);position:relative;overflow:hidden;box-shadow:var(--shadow);}
.tile .grad{position:absolute;inset:0;}
.tile .fade{position:absolute;inset:0;background:linear-gradient(to top, rgba(0,0,0,0.55), transparent 55%);}
.tile .cap{position:absolute;left:14px;bottom:12px;right:14px;color:#fff;font-size:12px;font-weight:700;}
.tile .cap small{display:block;font-weight:500;opacity:.8;font-size:10.5px;margin-top:2px;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:0.04em;}
.tile:nth-child(1) .grad{background:linear-gradient(135deg,#0E3D40,#369694);}
.tile:nth-child(2) .grad{background:linear-gradient(135deg,#369694,#0E3D40);}
.tile:nth-child(3) .grad{background:linear-gradient(135deg,#FFF9C7,#0E3D40);}
.tile:nth-child(4) .grad{background:linear-gradient(135deg,#7FFFD4,#369694);}
.tile:nth-child(5) .grad{background:linear-gradient(135deg,#0E3D40,#FFF9C7);}
.tile:nth-child(6) .grad{background:linear-gradient(135deg,#369694,#7FFFD4);}
.tile:nth-child(7) .grad{background:linear-gradient(135deg,#0E3D40,#FFF9C7);}
.tile:nth-child(8) .grad{background:linear-gradient(135deg,#FFF9C7,#369694);}
.community-cta{margin-top:36px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:24px 28px;border-radius:var(--radius-m);background:var(--surface);border:1px solid var(--line);}
.community-cta p{font-weight:700;font-size:15.5px;}
.community-cta span{color:var(--ink-soft);font-weight:500;font-size:13.5px;}

/* ============ MERCH ============ */
.merch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
@media (max-width:980px){.merch-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.merch-grid{grid-template-columns:1fr;}}
.merch-card{background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius-l);overflow:hidden;box-shadow:var(--shadow);transition:transform .2s ease, box-shadow .2s ease;}
.merch-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg), 0 0 30px -12px rgba(127,255,212,0.35);}
.merch-thumb{height:180px;background:var(--surface);display:flex;align-items:center;justify-content:center;position:relative;}
.merch-thumb svg{width:74px;height:74px;color:var(--cyan);}
.merch-thumb .soon{position:absolute;top:12px;right:12px;font-family:var(--font-mono);font-size:10px;background:var(--ink);color:var(--paper-raised);padding:4px 9px;border-radius:99px;letter-spacing:0.04em;}
.merch-info{padding:18px 20px 22px;}
.merch-info h4{font-size:15px;font-weight:700;font-family:var(--font-body);}
.merch-info .price{font-family:var(--font-mono);color:var(--ink-faint);font-size:13px;margin-top:4px;}
.merch-info .btn{margin-top:14px;width:100%;}
.shopify-note{font-size:13px;color:var(--ink-faint);display:flex;align-items:center;gap:8px;font-family:var(--font-mono);}
.shop-section{background:var(--sun);}
.shop-crosslink{margin-top:28px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}

/* ============ LOCATION ============ */
.location{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;border-radius:var(--radius-l);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-lg);}
@media (max-width:820px){.location{grid-template-columns:1fr;}}
.location-map{background:var(--sun);position:relative;min-height:280px;}
.location-info{background:var(--paper-raised);padding:44px;display:flex;flex-direction:column;justify-content:center;gap:16px;}
.location-info h3{font-size:26px;font-weight:700;}
.location-info p{color:var(--ink-soft);font-size:15px;}
.location-info .addr{font-family:var(--font-mono);font-size:13.5px;color:var(--ink-faint);}

/* ============ FOOTER ============ */
.footer{background:var(--brand-ink-deep);color:#fff;padding:0 0 30px;position:relative;overflow:hidden;}
.footer-hero{background:var(--brand-ink-deep);text-align:center;padding:56px 24px 42px;}
.footer-hero-word{height:44px;width:auto;margin:0 auto;display:block;}
.footer-hero-tag{font-family:var(--font-display);font-weight:700;font-size:19px;letter-spacing:0.09em;text-transform:uppercase;color:#fff;margin-top:12px;}
.footer-hero-links{margin-top:16px;display:flex;justify-content:center;align-items:center;gap:22px;flex-wrap:wrap;font-family:var(--font-body);font-weight:800;font-size:14px;letter-spacing:0.02em;}
.footer-hero-links span{color:rgba(255,255,255,0.88);text-transform:uppercase;}
.footer-hero-links a{color:var(--brand-mint);transition:color .18s ease;}
.footer-hero-links a:hover{color:#fff;text-decoration:underline;}
.footer-top{display:grid;grid-template-columns:1.3fr repeat(3,1fr);gap:40px;padding:56px 0;border-bottom:1px solid rgba(255,255,255,0.14);}
@media (max-width:820px){.footer-top{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer-top{grid-template-columns:1fr;}}
.footer-brand p{margin-top:16px;color:rgba(255,255,255,0.62);font-size:14px;max-width:32ch;}
.footer-slogan{font-family:var(--font-display);font-weight:700;font-size:16px;margin-top:20px;color:var(--brand-mint);letter-spacing:0.02em;}
.footer-col h5{font-family:var(--font-mono);font-size:11.5px;text-transform:uppercase;letter-spacing:0.06em;color:rgba(255,255,255,0.5);margin-bottom:16px;}
.footer-col a{display:block;color:rgba(255,255,255,0.8);font-size:14.5px;margin-bottom:11px;transition:color .18s ease;}
.footer-col a:hover{color:var(--aqua);}
.social-row{display:flex;gap:10px;}
.social-row a{
  width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,0.25);
  display:flex;align-items:center;justify-content:center;transition:background .18s ease, border-color .18s ease, transform .18s ease;
}
.social-row a:hover{background:var(--brand-mint);border-color:var(--brand-mint);color:var(--brand-ink-deep);transform:translateY(-2px);}
.social-row svg{width:18px;height:18px;}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:26px;gap:16px;flex-wrap:wrap;font-size:12.5px;color:rgba(255,255,255,0.45);}
.footer-bottom-right{display:inline-flex;align-items:center;gap:10px;}
.owner-link{width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:rgba(255,255,255,0.4);transition:color .18s ease, background .18s ease;}
.owner-link svg{width:13px;height:13px;}
.owner-link:hover{color:#fff;background:rgba(255,255,255,0.12);}

/* ============ OWNER DASHBOARD ============ */
.owner-overlay{position:fixed;inset:0;z-index:200;background:rgba(14,61,64,0.72);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:24px;}
.owner-overlay[hidden]{display:none;}
.owner-modal{position:relative;width:100%;max-width:720px;max-height:86vh;overflow-y:auto;background:var(--paper-raised);border-radius:var(--radius-l);box-shadow:var(--shadow-lg);padding:36px 32px;}
.owner-close{position:absolute;top:18px;right:18px;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--ink-faint);transition:background .18s ease,color .18s ease;}
.owner-close:hover{background:var(--surface);color:var(--ink);}
.owner-close svg{width:16px;height:16px;}
.owner-gate h3, .owner-dash h3{font-size:22px;font-weight:700;}
.owner-gate p{color:var(--ink-soft);font-size:13.5px;margin-top:8px;max-width:44ch;}
.owner-gate-row{display:flex;gap:10px;margin-top:18px;}
.owner-gate-row input{flex:1;padding:11px 14px;border-radius:var(--radius-s);border:1.5px solid var(--line-strong);background:var(--paper);font-family:var(--font-body);font-size:14px;}
.owner-gate-row input:focus-visible{outline:2.5px solid var(--cyan);outline-offset:2px;}
.owner-gate-err{color:#B3492F;font-size:12.5px;margin-top:10px;display:none;}
.owner-gate-err.show{display:block;}
.owner-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0;}
@media (max-width:560px){.owner-stats{grid-template-columns:1fr;}}
.owner-stat{background:var(--surface);border-radius:var(--radius-m);padding:16px 18px;}
.owner-stat .n{font-family:var(--font-mono);font-weight:700;font-size:24px;color:var(--teal);font-variant-numeric:tabular-nums;}
.owner-stat .l{font-size:12px;color:var(--ink-faint);margin-top:4px;}
.owner-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius-m);}
.owner-table{width:100%;border-collapse:collapse;font-size:13px;white-space:nowrap;}
.owner-table th{text-align:left;padding:10px 14px;background:var(--surface);font-family:var(--font-mono);font-size:10.5px;text-transform:uppercase;letter-spacing:0.05em;color:var(--ink-faint);}
.owner-table td{padding:10px 14px;border-top:1px solid var(--line);color:var(--ink-soft);}
.owner-table tr:empty, .owner-empty td{text-align:center;color:var(--ink-faint);padding:20px;}
.owner-export{margin-top:22px;}
.owner-export p{font-size:12.5px;color:var(--ink-faint);margin-bottom:10px;}
.owner-csv{width:100%;margin-top:10px;font-family:var(--font-mono);font-size:11.5px;padding:10px;border-radius:var(--radius-s);border:1px solid var(--line);background:var(--surface);resize:vertical;}
.owner-unanswered{margin-top:26px;padding-top:22px;border-top:1px solid var(--line);}
.owner-unanswered-hint{font-size:12.5px;color:var(--ink-faint);margin-top:6px;max-width:60ch;}
.owner-unanswered-hint code{font-family:var(--font-mono);background:var(--surface);padding:1px 5px;border-radius:4px;}
.owner-unanswered-list{margin-top:14px;display:flex;flex-direction:column;gap:8px;max-height:280px;overflow-y:auto;}
.owner-unanswered-list li{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 14px;background:var(--surface);border-radius:var(--radius-s);font-size:13px;color:var(--ink);}
.owner-unanswered-list li small{flex:none;font-family:var(--font-mono);font-size:11px;color:var(--ink-faint);}
.owner-unanswered-empty{color:var(--ink-faint);justify-content:center;}

/* ============ REVEAL ============ */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1;transform:translateY(0);}

@keyframes heroRise{from{opacity:0;transform:translateY(26px);}to{opacity:1;transform:translateY(0);}}
.hero-anim{opacity:0;animation:heroRise .85s cubic-bezier(.22,1,.36,1) forwards;}

/* ---- shine sweep on the primary CTA ---- */
.btn-shine{position:relative;overflow:hidden;}
.btn-shine::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(115deg, transparent, rgba(255,255,255,0.6), transparent);transform:skewX(-20deg);animation:btnShine 3.4s ease-in-out infinite;}
@keyframes btnShine{0%{left:-60%;}42%{left:130%;}100%{left:130%;}}
@media (prefers-reduced-motion: reduce){.btn-shine::after{display:none;}}

/* ---- sticky floating CTA — appears once the hero scrolls out of view ---- */
.sticky-cta{position:fixed;right:22px;bottom:22px;z-index:90;opacity:0;transform:translateY(16px) scale(.94);pointer-events:none;transition:opacity .3s ease, transform .3s ease;}
.sticky-cta.is-visible{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;}
.sticky-cta .btn{box-shadow:0 16px 32px -10px rgba(14,61,64,0.5);}
@media (max-width:720px){.sticky-cta{left:16px;right:16px;bottom:16px;}.sticky-cta .btn{width:100%;}}

/* skip link */
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:10px 16px;border-radius:8px;z-index:1000;}
.skip:focus{left:16px;top:16px;}


/* ========================================
   BOOKING MODAL
======================================== */

.booking-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;

  display: none;
  align-items: center;
  justify-content: center;

  padding: 24px;
}

.booking-modal.is-open {
  display: flex;
}

.booking-modal__backdrop {
  position: absolute;
  inset: 0;

  background: rgba(4, 24, 25, 0.78);
}

.booking-modal__content {
  position: relative;
  z-index: 1;

  width: min(1120px, 100%);
  max-height: 90vh;
  overflow-y: auto;

  background: #f8f8f5;
  border-radius: 6px;

  padding: 36px;
}

.booking-modal__main {
  display: grid;
  grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
  gap: 30px;
  align-items: start;
}

.booking-modal__flow {
  min-width: 0;
}

.booking-product {
  position: sticky;
  top: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px;
  border: 1px solid #d8dfdc;
  border-radius: 6px;
  background: #ffffff;
  color: #123f40;
}

.booking-product h3 {
  margin: 0;
  font-size: 25px;
  line-height: 1.05;
  color: #123f40;
}

.booking-product__tag {
  margin: -8px 0 0;
  color: #4f7171;
  font-size: 13px;
  font-weight: 700;
}

.booking-product__desc {
  margin: 0;
  color: #5f7474;
  font-size: 14px;
  line-height: 1.55;
}

.booking-product__specs {
  display: grid;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.booking-product__specs li {
  display: flex;
  gap: 9px;
  color: #123f40;
  font-size: 13px;
  line-height: 1.35;
}

.booking-product__specs li::before {
  content: "";
  width: 6px;
  height: 6px;
  margin-top: 6px;
  flex: none;
  border-radius: 50%;
  background: #369694;
}

.booking-product__condition {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: center;
  font-size: 12px;
  color: #5f7474;
}

.booking-product__condition[hidden] {
  display: none;
}

.booking-product__condition-bar {
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: #e6ebe8;
}

.booking-product__condition-bar i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #369694;
}

.booking-product__prices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.booking-product__price {
  padding: 10px 8px;
  border-radius: 3px;
  background: #eeeeeb;
  text-align: center;
}

.booking-product__price span {
  display: block;
  color: #6f8585;
  font-size: 11px;
}

.booking-product__price strong {
  display: block;
  margin-top: 3px;
  color: #123f40;
  font-size: 16px;
}

.booking-product__addons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.booking-product__addon {
  padding: 5px 9px;
  border-radius: 2px;
  border: 1px solid #d8dfdc;
  background: none;
  color: #315f5f;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.booking-modal__close {
  position: absolute;
  top: 18px;
  right: 22px;

  border: 0;
  background: none;

  font-size: 32px;
  cursor: pointer;

  color: #123f40;
}

.booking-modal__header {
  margin-bottom: 28px;
}

.booking-modal__eyebrow {
  font-size: 11px;
  letter-spacing: 0.16em;

  color: #6f8888;
}

.booking-modal__header h2 {
  margin: 5px 0 8px;

  font-size: 30px;
  color: #123f40;
}

.booking-modal__header p {
  color: #738888;
}

.booking-duration {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.booking-duration button {
  display: flex;
  min-height: 76px;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 14px 12px;
  border: 1px solid #d8dfdc;
  border-radius: 4px;
  background: #ffffff;
  color: #123f40;
  text-align: left;
}

.booking-duration button.is-active {
  border-color: #123f40;
  background: #123f40;
  color: #ffffff;
}

.booking-duration span {
  font-size: 12px;
  font-weight: 700;
}

.booking-duration strong {
  font-size: 18px;
}

.booking-halfday {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 12px;
}

.booking-halfday[hidden] {
  display: none;
}

.booking-halfday button {
  padding: 12px 14px;
  border: 1px solid #d8dfdc;
  border-radius: 4px;
  background: #ffffff;
  color: #4f7171;
  font-size: 13px;
  font-weight: 700;
}

.booking-halfday button.is-active {
  border-color: #369694;
  background: #eef7f2;
  color: #123f40;
}

/* CALENDAR */

#bookingCalendar {
  margin-top: 20px;
}

#bookingCalendar .fc-toolbar-title {
  font-size: 18px;
  color: #123f40;
}

#bookingCalendar .fc-button {
  background: #123f40;
  border-color: #123f40;
}

#bookingCalendar .fc-daygrid-day {
  cursor: pointer;
}

#bookingCalendar .fc-day-past {
  opacity: 0.35;
}

/* SELECTED DATES */

.booking-selection {
  display: grid;
  grid-template-columns: 1fr 1fr;

  gap: 12px;
  margin-top: 24px;
}

.booking-selection > div {
  background: #eeeeeb;
  border-radius: 4px;

  padding: 16px;
}

.booking-selection span {
  display: block;

  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.1em;

  color: #829393;
  margin-bottom: 5px;
}

.booking-selection strong {
  color: #123f40;
}

/* MESSAGE */

.booking-message {
  margin-top: 16px;

  color: #a54f42;
  font-size: 14px;

  min-height: 20px;
}

/* CONTINUE */

.booking-continue {
  width: 100%;

  margin-top: 12px;
  padding: 17px;

  border: 0;
  border-radius: 3px;

  background: #123f40;
  color: white;

  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;

  cursor: pointer;
}

.booking-continue:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

@media (max-width: 600px) {

  .booking-modal {
    padding: 12px;
  }

  .booking-modal__content {
    padding: 28px 18px;
    border-radius: 6px;
  }

  .booking-selection {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 860px) {

  .booking-modal__main {
    grid-template-columns: 1fr;
  }

  .booking-product {
    position: static;
  }
}

/* ========================================
   BOOKING STEP 2
======================================== */

.booking-step-two {
  display: none;
}

.booking-step-two.is-active {
  display: block;
}

.booking-times,
.booking-form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-top: 22px;
}

.booking-times--locked {
  margin-top: 22px;
}

.booking-locked-field {
  display: flex;
  min-height: 72px;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  padding: 14px;
  border-radius: 12px;
  background: #eeeeeb;
}

.booking-locked-field span {
  color: #718686;
  font-size: 12px;
}

.booking-locked-field strong {
  color: #123f40;
  font-size: 15px;
}

.booking-times label,
.booking-form label {
  display: flex;
  flex-direction: column;
  gap: 7px;

  font-size: 12px;
  color: #718686;
}

.booking-times select,
.booking-form input {
  width: 100%;
  padding: 14px;

  border: 1px solid #d8dfdc;
  border-radius: 12px;

  background: #ffffff;
  color: #123f40;

  font: inherit;
}

.booking-times select:focus,
.booking-form input:focus {
  outline: 2px solid #4aa59e;
  outline-offset: 1px;
}

.booking-back {
  border: 0;
  background: none;

  padding: 0;
  margin-bottom: 24px;

  color: #567575;
  cursor: pointer;
}

.booking-summary {
  margin-top: 25px;
  padding: 20px;

  border-radius: 18px;
  background: #eeeeeb;
}

.booking-summary__row {
  display: flex;
  justify-content: space-between;
  gap: 20px;

  padding: 10px 0;

  border-bottom: 1px solid #d8ddda;
}

.booking-summary__row:last-child {
  border-bottom: 0;
}

.booking-summary__row span {
  color: #718686;
}

.booking-summary__row strong {
  text-align: right;
  color: #123f40;
}

@media (max-width: 600px) {

  .booking-times,
  .booking-form,
  .booking-duration,
  .booking-halfday {
    grid-template-columns: 1fr;
  }
}

/* ============ NAV ACCOUNT DROPDOWN ============ */
.nav-account{position:relative;}
.nav-account[hidden]{display:none;}
.nav-account-trigger{
  display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border-radius:99px;
  border:1.5px solid var(--line-strong);background:transparent;cursor:pointer;color:#fff;
  font-family:var(--font-body);font-weight:700;font-size:13.5px;
}
.subpage .nav-account-trigger,
.nav.scrolled .nav-account-trigger{color:var(--ink);border-color:var(--line-strong);}
.nav-account-avatar{
  width:26px;height:26px;border-radius:50%;background:var(--aqua);color:var(--brand-ink-deep);
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;flex:none;
}
.nav-account-caret{width:14px;height:14px;opacity:.7;}
.nav-account-menu{
  position:absolute;top:calc(100% + 10px);right:0;width:220px;
  background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius-m);
  box-shadow:var(--shadow-lg);padding:8px;display:flex;flex-direction:column;gap:2px;z-index:120;
}
.nav-account-menu[hidden]{display:none;}
.nav-account-menu-head{padding:10px 12px 12px;border-bottom:1px solid var(--line);margin-bottom:6px;display:flex;flex-direction:column;gap:2px;}
.nav-account-menu-head strong{font-size:14px;color:var(--ink);}
.nav-account-menu-head span{font-size:12px;color:var(--ink-soft);overflow-wrap:anywhere;}
.nav-account-menu a,
.nav-account-logout{
  display:block;width:100%;text-align:left;padding:9px 12px;border-radius:var(--radius-s);
  font-size:13.5px;font-weight:700;color:var(--ink);background:none;border:none;cursor:pointer;
  font-family:var(--font-body);
}
.nav-account-menu a:hover,
.nav-account-logout:hover{background:var(--surface);}
.nav-account-logout{color:var(--cyan);margin-top:4px;border-top:1px solid var(--line);border-radius:0 0 var(--radius-s) var(--radius-s);}
.mobile-panel-logout{
  display:none;background:none;border:none;text-align:left;padding:16px 4px;font-size:15px;
  font-weight:700;color:var(--ink-soft);font-family:var(--font-body);border-bottom:1px solid var(--line);
}
.mobile-panel-logout[hidden]{display:none;}
@media (max-width:860px){
  .nav-cta .nav-account{display:none;}
  .mobile-panel-logout:not([hidden]){display:block;}
}

/* ============ ACCOUNT PAGE ADDITIONS ============ */
@media (min-width:721px){
  .account-metrics{grid-template-columns:repeat(4,1fr);}
}
.account-setting-form-wide{grid-column:1/-1;}
.account-toggle-row{
  display:flex;align-items:flex-start;gap:12px;padding:14px 16px;margin-top:16px;
  border:1px solid var(--line);border-radius:var(--radius-m);background:var(--surface);cursor:pointer;
}
.account-toggle-row input{margin-top:3px;flex:none;width:16px;height:16px;accent-color:var(--ink);}
.account-toggle-row strong{display:block;font-size:13.5px;}
.account-toggle-row small{display:block;margin-top:2px;font-size:12px;color:var(--ink-soft);}
.account-support-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.account-support-card{
  display:block;border:1px solid var(--line);border-radius:var(--radius-s);padding:16px;
  background:var(--surface);text-align:left;text-decoration:none;cursor:pointer;font-family:var(--font-body);
  transition:border-color .15s ease, background .15s ease;
}
.account-support-card:hover{border-color:var(--ink);background:var(--paper-raised);}
.account-support-card span{display:block;font-family:var(--font-mono);font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint);}
.account-support-card strong{display:block;margin-top:6px;font-family:var(--font-body);font-size:15px;color:var(--ink);}
@media (max-width:720px){
  .account-support-grid{grid-template-columns:1fr;}
}

/* ============ AI ASSISTANT WIDGET ============ */
.assistant-widget{position:fixed;right:20px;bottom:96px;z-index:150;font-family:var(--font-body);}
@media (max-width:720px){.assistant-widget{right:14px;bottom:84px;}}
.assistant-toggle{
  position:relative;width:72px;height:72px;border-radius:50%;border:none;cursor:pointer;
  background:var(--ink);color:var(--paper-raised);display:flex;align-items:center;justify-content:center;
  box-shadow:0 16px 32px -10px rgba(14,61,64,0.55);transition:transform .2s ease, box-shadow .2s ease;
}
.assistant-toggle:hover{transform:translateY(-2px);}
.assistant-toggle-icon{position:absolute;transition:opacity .15s ease, transform .15s ease;}
.assistant-icon-close{width:24px;height:24px;opacity:0;transform:scale(.6) rotate(-45deg);}
.assistant-toggle-brand{display:flex;flex-direction:column;align-items:center;gap:2px;}
.assistant-toggle-logo{width:44px;height:auto;display:block;}
.assistant-toggle-tag{font-family:var(--font-mono);font-size:9px;font-weight:700;letter-spacing:.12em;color:var(--aqua);line-height:1;}
.assistant-widget.is-open .assistant-icon-bot{opacity:0;transform:scale(.6) rotate(45deg);}
.assistant-widget.is-open .assistant-icon-close{opacity:1;transform:scale(1) rotate(0deg);}
.assistant-panel{
  position:absolute;right:0;bottom:74px;width:368px;max-width:calc(100vw - 28px);
  max-height:min(560px, 72vh);display:flex;flex-direction:column;overflow:hidden;
  background:var(--paper-raised);border:1px solid var(--line);border-radius:var(--radius-l);box-shadow:var(--shadow-lg);
}
.assistant-panel[hidden]{display:none;}
.assistant-head{display:flex;align-items:center;gap:12px;padding:16px 16px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,var(--paper-raised),var(--surface));}
.assistant-head-avatar{width:46px;height:46px;border-radius:50%;background:var(--ink);color:var(--aqua);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;flex:none;}
.assistant-head-avatar-logo{width:27px;height:auto;display:block;}
.assistant-head-avatar-tag{font-family:var(--font-mono);font-size:6.5px;font-weight:700;letter-spacing:.1em;color:var(--aqua);line-height:1;}
.assistant-head-copy{display:flex;flex-direction:column;gap:2px;min-width:0;}
.assistant-head-copy strong{font-size:14.5px;}
.assistant-head-copy span{font-size:12px;color:var(--ink-soft);}
.assistant-close{margin-left:auto;background:none;border:none;cursor:pointer;color:var(--ink-soft);padding:4px;flex:none;}
.assistant-close svg{width:18px;height:18px;display:block;}
.assistant-close:hover{color:var(--ink);}
.assistant-messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;min-height:180px;}
.assistant-msg{max-width:86%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.45;}
.assistant-msg-bot{align-self:flex-start;background:var(--surface);color:var(--ink);border-bottom-left-radius:4px;}
.assistant-msg-user{align-self:flex-end;background:var(--ink);color:var(--paper-raised);border-bottom-right-radius:4px;}
.assistant-msg-thinking{color:var(--ink-faint);font-family:var(--font-mono);letter-spacing:.14em;}
.assistant-chips{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 10px;}
.assistant-chip{border:1px solid var(--line-strong);background:transparent;color:var(--ink);border-radius:99px;padding:6px 11px;font-size:12px;cursor:pointer;transition:background .15s ease,border-color .15s ease;font-family:var(--font-body);}
.assistant-chip:hover{background:var(--surface);border-color:var(--ink);}
.assistant-input-row{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--line);}
.assistant-input-row input{flex:1;border:1px solid var(--line-strong);border-radius:99px;padding:10px 16px;font-size:13.5px;font-family:var(--font-body);background:var(--paper);color:var(--ink);}
.assistant-input-row input:focus{outline:none;border-color:var(--cyan);box-shadow:0 0 0 4px var(--cyan-wash);}
.assistant-send{width:38px;height:38px;border-radius:50%;border:none;background:var(--ink);color:var(--paper-raised);display:flex;align-items:center;justify-content:center;flex:none;cursor:pointer;}
.assistant-send svg{width:16px;height:16px;}
.assistant-send:hover{background:var(--brand-ink-deep);}
.assistant-whatsapp{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px;margin:0 14px 14px;border-radius:var(--radius-m);background:var(--aqua-wash);color:var(--ink);font-weight:800;font-size:13px;text-decoration:none;}
.assistant-whatsapp svg{width:17px;height:17px;}
.assistant-whatsapp:hover{background:var(--aqua);}
@media (max-width:480px){
  .assistant-panel{width:calc(100vw - 24px);right:-6px;}
}

/* ============ BOOKING: STEP INDICATOR, TERMS, PAYMENT ============ */
.booking-steps{display:flex;align-items:center;gap:10px;margin-bottom:22px;}
.booking-step{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:#a8b6b6;transition:color .2s ease;}
.booking-step i{
  width:22px;height:22px;border-radius:50%;border:1.5px solid #d8ddda;display:flex;align-items:center;justify-content:center;
  font-style:normal;font-size:11.5px;flex:none;transition:background .2s ease,border-color .2s ease,color .2s ease;
}
.booking-step.is-active{color:#123f40;}
.booking-step.is-active i{background:#123f40;border-color:#123f40;color:#fff;}
.booking-step:not(:last-child)::after{content:"";width:22px;height:1.5px;background:#d8ddda;margin-left:2px;}

.booking-terms-check{
  display:flex;align-items:flex-start;gap:10px;margin-top:22px;padding:14px 16px;
  border:1px solid #d8ddda;border-radius:4px;background:#f7f8f6;font-size:13px;color:#4c6060;line-height:1.5;
}
.booking-terms-check input{margin-top:2px;flex:none;width:16px;height:16px;accent-color:#123f40;}
.booking-terms-link{background:none;border:none;padding:0;color:#123f40;font-weight:700;text-decoration:underline;text-underline-offset:2px;cursor:pointer;}

.booking-id-note{margin:8px 2px 0;font-size:12px;color:#4c6060;line-height:1.5;}

.booking-insurance{margin-top:18px;padding:16px;border:1px solid #d8ddda;border-radius:4px;background:#fff;}
.booking-insurance-check{display:flex;align-items:center;gap:12px;cursor:pointer;}
.booking-insurance-check input{width:16px;height:16px;flex:none;accent-color:#123f40;}
.booking-insurance-check span{display:flex;align-items:center;justify-content:space-between;flex:1;gap:10px;font-size:13.5px;color:#123f40;}
.booking-insurance-check strong{font-weight:700;}
.booking-insurance-check small{font-weight:800;color:#123f40;font-size:13px;flex:none;}
.booking-insurance-note{margin:10px 0 0;font-size:12.5px;color:#4c6060;line-height:1.5;}

.booking-waiver-note{margin-top:14px;font-size:12.5px;color:#4c6060;line-height:1.5;}

.booking-payment{margin-top:18px;padding:18px;border:1px solid #d8ddda;border-radius:4px;background:#fff;}
.booking-payment-pickup p{font-size:13px;color:#4c6060;line-height:1.5;margin:0;}
.booking-card-element{padding:14px;border:1px solid #d8ddda;border-radius:4px;background:#fbfbf9;}
.booking-payment-secure{margin:10px 0 0;font-size:11.5px;color:#8a9a9a;}
.booking-payment-request{margin-bottom:14px;}
.booking-payment-or{margin:0 0 12px;font-size:11px;text-align:center;text-transform:uppercase;letter-spacing:0.1em;color:#8a9a9a;}

.terms-overlay{position:fixed;inset:0;z-index:10000;background:rgba(14,61,64,0.82);display:flex;align-items:center;justify-content:center;padding:24px;}
.terms-overlay[hidden]{display:none;}
.terms-modal{position:relative;width:100%;max-width:640px;max-height:82vh;overflow-y:auto;background:#fff;border-radius:6px;box-shadow:var(--shadow-lg);padding:36px 32px;}
.terms-modal h3{font-size:24px;margin:6px 0 20px;color:#123f40;}
.terms-close{position:absolute;top:18px;right:18px;width:34px;height:34px;border-radius:50%;border:none;background:none;display:flex;align-items:center;justify-content:center;color:#8a9a9a;cursor:pointer;}
.terms-close svg{width:16px;height:16px;}
.terms-close:hover{background:#f2f4f2;color:#123f40;}
.terms-body section{padding:16px 0;border-top:1px solid #e6e9e6;}
.terms-body section:first-child{border-top:none;padding-top:0;}
.terms-body h4{font-size:14px;color:#123f40;margin-bottom:6px;}
.terms-body p{font-size:13.5px;color:#4c6060;line-height:1.6;}
@media (max-width:600px){
  .terms-modal{padding:28px 20px;}
}