  /* ============ TOKENS ============ */
  :root{
    --bg-primary:#F5F6F3;
    --bg-secondary:#ECEFEA;
    --surface:#FFFFFF;
    --text-primary:#171918;
    --text-secondary:#626863;
    --text-muted:#8A908B;
    --accent:#17483D;
    --accent-dark:#10352E;
    --accent-light:#DDE9E3;
    --accent-pop:#B7D66A;
    --border:#DDE2DE;
    /* legacy aliases kept so existing component rules keep working unchanged */
    --bg:var(--bg-primary);
    --bg-soft:var(--bg-secondary);
    --surface-2:var(--bg-secondary);
    --ink:var(--text-primary);
    --ink-soft:var(--text-secondary);
    --ink-faint:var(--text-muted);
    --line:var(--border);
    --line-strong:#C9D2CB;
    --accent-2:var(--accent-pop);
    --accent-soft:var(--accent-light);
    --accent-ink:var(--accent-dark);
    --on-accent:#FFFFFF;
    --success:var(--accent);
    --danger:#C23A2E;
    --shadow-1: 0 1px 2px rgba(23,25,24,.04);
    --shadow-2: 0 2px 8px rgba(23,25,24,.06);
    --shadow-3: 0 6px 18px rgba(23,25,24,.09);
    --radius-lg:16px;
    --radius-md:14px;
    --radius-sm:7px;
    --font-display:'Manrope', 'Segoe UI', -apple-system, sans-serif;
    --font-body:'Manrope', 'Segoe UI', -apple-system, sans-serif;
    --font-mono:'Manrope', 'Segoe UI', -apple-system, sans-serif;
    --header-h: 84px;
    /* fixed-dark: always-dark surfaces (hero band, CTA panel) — independent of viewer theme, by design */
    --fixed-dark-bg:#0E211B;
    --fixed-dark-bg-2:#173026;
    --fixed-dark-ink:#F1F5EF;
    --fixed-dark-ink-soft:#C3D1C7;
    --fixed-dark-ink-faint:#8FA093;
    --fixed-dark-line: rgba(241,245,239,.14);
    --fixed-dark-line-strong: rgba(241,245,239,.26);
    --fixed-dark-accent-soft: rgba(183,214,106,.16);
    --fixed-dark-accent-ink:#D7E9A8;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg:#12211B;
      --bg-soft:#182B23;
      --surface:#1C3128;
      --surface-2:#20372D;
      --ink:#F1F5EF;
      --ink-soft:#C4D1C7;
      --ink-faint:#8B9A8E;
      --line:#2C4038;
      --line-strong:#3A5145;
      --accent:#4E9C82;
      --accent-2:#B7D66A;
      --accent-soft:#213A30;
      --accent-ink:#9BD6B9;
      --on-accent:#0B1A11;
      --shadow-1: 0 1px 2px rgba(0,0,0,.3);
      --shadow-2: 0 2px 8px rgba(0,0,0,.35);
      --shadow-3: 0 6px 18px rgba(0,0,0,.4);
    }
  }
  :root[data-theme="dark"]{
    --bg:#12211B;
    --bg-soft:#182B23;
    --surface:#1C3128;
    --surface-2:#20372D;
    --ink:#F1F5EF;
    --ink-soft:#C4D1C7;
    --ink-faint:#8B9A8E;
    --line:#2C4038;
    --line-strong:#3A5145;
    --accent:#4E9C82;
    --accent-2:#B7D66A;
    --accent-soft:#213A30;
    --accent-ink:#9BD6B9;
    --on-accent:#0B1A11;
    --shadow-1: 0 1px 2px rgba(0,0,0,.3);
    --shadow-2: 0 2px 8px rgba(0,0,0,.35);
    --shadow-3: 0 6px 18px rgba(0,0,0,.4);
  }

  *,*::before,*::after{box-sizing:border-box}
  /* Forms are hidden via the `hidden` attribute after successful submission
     (see wireForm()/wireNewsletter()). The HTML spec makes [hidden] just
     display:none with ordinary (low) specificity, so any class rule that
     sets display on the same element — e.g. .newsletter-form{display:flex},
     .quiz-step, form{display:flex} — silently wins and the "hidden" form
     stays visible, stacked on top of the success message. This makes
     [hidden] win regardless of what else targets the element. */
  [hidden]{display:none !important}
  html{scroll-behavior:smooth}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important}
  }
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:var(--font-body);
    font-size:16px;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
  }
  img,svg{max-width:100%;display:block}
  a{color:inherit;text-decoration:none}
  button{font-family:inherit;cursor:pointer}
  ul{list-style:none;margin:0;padding:0}
  h1,h2,h3,h4{margin:0;font-family:var(--font-display);text-wrap:balance;letter-spacing:-.01em}
  p{margin:0}
  :focus-visible{outline:2.5px solid var(--accent);outline-offset:3px;border-radius:4px}

  .wrap{max-width:1320px;margin:0 auto;padding-inline:24px}
  @media (max-width:640px){ .wrap{padding-inline:16px} }

  .eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    font-family:var(--font-mono);
    font-size:12.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;
    color:var(--accent-ink);
    background:var(--accent-soft);
    border:1px solid transparent;
    padding:7px 14px 7px 12px;border-radius:999px;
  }
  .eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent-2);flex:none}

  h2.section-title{
    font-size:clamp(36px,4vw,48px);
    font-weight:600;
    text-transform:none;
    line-height:1.08;
    letter-spacing:-.01em;
  }
  .section-sub{
    color:var(--ink-soft);
    font-size:clamp(16px,1.6vw,18px);
    max-width:58ch;
    line-height:1.6;
  }
  .section-head{
    display:flex;flex-direction:column;gap:16px;margin-bottom:52px;
  }
  section{padding-block:96px}
  @media (max-width:900px){ section{padding-block:64px} }

  /* buttons */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:10px;
    font-family:var(--font-body);font-weight:600;font-size:14.5px;letter-spacing:0;text-transform:none;
    padding:14px 24px;border-radius:var(--radius-sm);border:1px solid transparent;
    transition:background-color .28s ease-out, border-color .28s ease-out, color .28s ease-out;
    white-space:nowrap;
  }
  .btn svg{width:16px;height:16px;flex:none;transition:transform .28s ease-out}
  .btn-primary{background:var(--accent);color:var(--on-accent)}
  .btn-primary:hover{background:var(--accent-ink)}
  .btn-primary:hover svg{transform:translateX(3px)}
  .btn-outline{background:transparent;color:var(--accent);border-color:var(--accent)}
  .btn-outline:hover{background:var(--accent-soft)}
  .btn-ghost{background:var(--surface);color:var(--ink);border-color:var(--line)}
  .btn-ghost:hover{border-color:var(--line-strong)}
  .btn-sm{padding:11px 16px;font-size:13px}
  .btn-block{width:100%}
  .btn:disabled{opacity:.55;cursor:not-allowed}

  .icon-btn{
    width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
    background:transparent;border:1px solid var(--line);color:var(--ink);flex:none;
    transition:border-color .18s ease, background-color .18s ease;
  }
  .icon-btn:hover{border-color:var(--line-strong);background:var(--surface-2)}
  .icon-btn svg{width:18px;height:18px}

  /* ============ HEADER ============ */
  header.site-header{
    position:sticky;top:env(safe-area-inset-top,0px);z-index:80;
    background:color-mix(in srgb, var(--bg) 88%, transparent);
    backdrop-filter:blur(14px) saturate(1.4);
    -webkit-backdrop-filter:blur(14px) saturate(1.4);
    border-bottom:1px solid transparent;
    transition:border-color .25s ease, box-shadow .25s ease;
  }
  header.site-header.is-scrolled{border-color:var(--line);box-shadow:var(--shadow-1)}
  .header-inner{
    display:flex;align-items:center;justify-content:space-between;gap:20px;
    height:var(--header-h);
  }
  .brand{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:800;font-size:19px;letter-spacing:.01em;text-transform:uppercase}
  .brand-mark{
    width:36px;height:36px;border-radius:10px;background:var(--ink);color:var(--bg);
    display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:900;flex:none;
  }
  nav.main-nav{display:flex;align-items:center;gap:6px}
  nav.main-nav a{
    padding:10px 16px;border-radius:var(--radius-sm);font-weight:500;font-size:14.5px;
    color:var(--ink-soft);transition:color .28s ease-out, background-color .28s ease-out;
  }
  nav.main-nav a:hover{color:var(--ink);background:var(--surface-2)}
  .header-actions{display:flex;align-items:center;gap:10px}
  .lang-switch{position:relative}
  .lang-current{
    display:inline-flex;align-items:center;gap:6px;height:42px;padding:0 14px;border-radius:999px;
    border:1px solid var(--line);background:transparent;color:var(--ink);
    font-family:var(--font-mono);font-weight:600;font-size:13px;letter-spacing:.05em;
    transition:border-color .18s ease;
  }
  .lang-current:hover{border-color:var(--line-strong)}
  .lang-current svg{width:14px;height:14px;transition:transform .18s ease}
  .lang-switch[data-open="true"] .lang-current svg{transform:rotate(180deg)}
  .lang-menu{
    position:absolute;top:calc(100% + 8px);right:0;min-width:172px;
    background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-3);
    padding:6px;opacity:0;visibility:hidden;transform:translateY(-6px);
    transition:opacity .16s ease, transform .16s ease, visibility .16s ease;
    z-index:90;
  }
  .lang-switch[data-open="true"] .lang-menu{opacity:1;visibility:visible;transform:translateY(0)}
  .lang-menu button{
    width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;
    padding:10px 12px;border-radius:9px;background:transparent;border:none;color:var(--ink);
    font-size:14px;font-weight:600;text-align:left;
  }
  .lang-menu button:hover{background:var(--surface-2)}
  .lang-menu button[aria-current="true"]{color:var(--accent-ink);background:var(--accent-soft)}
  .lang-code{font-family:var(--font-mono);font-size:12px;color:var(--ink-faint)}
  .search-wrap{position:relative;display:flex;align-items:center}
  .search-input{
    width:0;opacity:0;padding:0;margin-right:0;border:1.5px solid transparent;
    height:42px;border-radius:999px;background:var(--surface-2);color:var(--ink);
    font-family:var(--font-body);font-size:14px;
    transition:width .22s ease, opacity .18s ease, padding .22s ease, border-color .18s ease, margin .22s ease;
  }
  .search-wrap.is-open .search-input{width:220px;opacity:1;padding:0 16px;margin-right:8px;border-color:var(--line)}
  .search-wrap.is-open .search-input:focus{border-color:var(--accent)}
  .hamburger{display:none}
  @media (max-width:980px){
    nav.main-nav{display:none}
    .header-cta-desktop{display:none}
    .hamburger{display:inline-flex}
    .search-wrap.is-open .search-input{width:150px}
  }

  /* mobile drawer */
  .mobile-drawer{
    position:fixed;inset:0;z-index:120;visibility:hidden;
  }
  .mobile-drawer[data-open="true"]{visibility:visible}
  .drawer-backdrop{
    position:absolute;inset:0;background:rgba(15,29,21,.45);opacity:0;transition:opacity .22s ease;
  }
  .mobile-drawer[data-open="true"] .drawer-backdrop{opacity:1}
  .drawer-panel{
    position:absolute;top:0;right:0;height:100%;width:min(360px,86vw);
    background:var(--surface);padding:24px;padding-top:calc(24px + env(safe-area-inset-top,0px));
    display:flex;flex-direction:column;gap:26px;
    transform:translateX(100%);transition:transform .28s cubic-bezier(.32,.72,0,1);
    box-shadow:var(--shadow-3);overflow-y:auto;
  }
  .mobile-drawer[data-open="true"] .drawer-panel{transform:translateX(0)}
  .drawer-top{display:flex;align-items:center;justify-content:space-between}
  .drawer-nav{display:flex;flex-direction:column;gap:4px}
  .drawer-nav a{padding:14px 6px;border-bottom:1px solid var(--line);font-weight:700;font-size:17px;text-transform:uppercase;font-family:var(--font-display)}
  .drawer-langs{display:flex;gap:8px;flex-wrap:wrap}
  .drawer-langs button{
    padding:9px 14px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink);
    font-family:var(--font-mono);font-size:12.5px;font-weight:700;letter-spacing:.05em;
  }
  .drawer-langs button[aria-current="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}

  /* ============ HERO ============ */
  .hero-shell{padding-top:28px}
  .hero-card{
    position:relative;overflow:hidden;
    /* deliberately dark, regardless of viewer theme — see fixed-dark tokens */
    --ink:var(--fixed-dark-ink);
    --ink-soft:var(--fixed-dark-ink-soft);
    --ink-faint:var(--fixed-dark-ink-faint);
    --line:var(--fixed-dark-line);
    --line-strong:var(--fixed-dark-line-strong);
    --surface:var(--fixed-dark-bg-2);
    --surface-2:var(--fixed-dark-bg-2);
    --bg-soft:var(--fixed-dark-bg-2);
    --accent-soft:var(--fixed-dark-accent-soft);
    --accent-ink:var(--fixed-dark-accent-ink);
    background:var(--fixed-dark-bg);
    color:var(--fixed-dark-ink);
    border-radius:var(--radius-lg);
    border:1px solid var(--fixed-dark-line);
    box-shadow:var(--shadow-3);
    display:grid;grid-template-columns:1.05fr 1fr;align-items:stretch;
    min-height:0;
  }
  @media (max-width:980px){ .hero-card{grid-template-columns:1fr} }
  .hero-copy{
    padding:64px 56px;display:flex;flex-direction:column;align-items:flex-start;gap:22px;
    position:relative;z-index:3;
  }
  @media (max-width:640px){ .hero-copy{padding:40px 22px 32px} }
  .hero-title{
    font-size:clamp(40px,5.6vw,72px);
    font-weight:700;line-height:1.02;text-transform:none;letter-spacing:-.02em;
  }
  .hero-title em{
    font-style:normal;color:var(--accent);
  }
  .hero-sub{font-size:clamp(15.5px,1.7vw,18.5px);color:var(--ink-soft);max-width:46ch;line-height:1.65}
  .hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:6px}
  .hero-badges{
    display:flex;gap:0;flex-wrap:wrap;margin-top:20px;padding-top:22px;border-top:1px solid var(--line);width:100%;
  }
  .hero-badge{
    display:flex;align-items:center;gap:10px;padding-right:22px;margin-right:22px;border-right:1px solid var(--line);
    font-size:13px;color:var(--ink-soft);font-weight:600;
  }
  .hero-badge:last-child{border-right:none;margin-right:0;padding-right:0}
  .hero-badge svg{width:18px;height:18px;color:var(--accent);flex:none}
  @media (max-width:640px){ .hero-badge{border-right:none;margin-right:0;padding-right:0;width:100%} }

  /* ============ HERO COUNTDOWN ============ */
  .hero-countdown{
    display:inline-flex;align-items:center;gap:12px;flex-wrap:wrap;
    background:var(--accent-soft);border:1px solid var(--accent);border-radius:999px;
    padding:9px 18px 9px 14px;
  }
  .hero-countdown-label{font-family:var(--font-mono);font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--accent-ink)}
  .hero-countdown-digits{display:flex;align-items:baseline;gap:6px;font-family:var(--font-mono)}
  .cd-unit{display:flex;align-items:baseline;gap:2px}
  .cd-num{font-weight:700;font-size:15px;color:var(--ink)}
  .cd-unit-label{font-size:11px;color:var(--ink-faint)}
  .cd-sep{color:var(--ink-faint)}
  .hero-countdown-ended{
    display:inline-flex;align-items:center;
    background:var(--surface);border:1px solid var(--line);border-radius:999px;
    padding:9px 18px;font-size:13px;color:var(--ink-soft);
  }
  .form-notice{
    background:var(--surface-2);border:1px solid var(--line-strong);border-radius:var(--radius-sm);
    padding:12px 14px;font-size:13px;line-height:1.5;color:var(--ink);
  }

  .hero-visual{
    position:relative;
    background:
      radial-gradient(140% 120% at 88% 8%, rgba(94,180,130,.24) 0%, transparent 55%),
      var(--fixed-dark-bg-2);
    overflow:hidden;
    min-height:420px;
  }
  .hero-visual::before{
    content:"";position:absolute;inset:0;
    background-image:radial-gradient(circle, rgba(241,245,239,.14) 1px, transparent 1px);
    background-size:18px 18px;
    -webkit-mask-image:linear-gradient(to bottom, transparent, black 30%, black 70%, transparent);
    mask-image:linear-gradient(to bottom, transparent, black 30%, black 70%, transparent);
    opacity:.5;
  }
  .hero-blob{
    position:absolute;right:-10%;top:44%;transform:translateY(-50%);
    width:64%;aspect-ratio:1/1;border-radius:50%;
    background:radial-gradient(circle at 35% 30%, rgba(140,211,169,.45), rgba(43,122,78,.30) 48%, transparent 75%);
    filter:blur(6px);
  }
  .hero-bottle{
    position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
    animation:float-bottle 6s ease-in-out infinite;
  }
  @keyframes float-bottle{
    0%,100%{transform:translateY(0) rotate(-1.2deg)}
    50%{transform:translateY(-16px) rotate(1.2deg)}
  }
  .hero-bottle svg{width:min(280px,62%);filter:drop-shadow(0 24px 32px rgba(15,29,21,.30))}
  .hero-bottle img{width:min(280px,62%);max-height:80%;object-fit:contain;filter:drop-shadow(0 24px 32px rgba(15,29,21,.30))}
  .hero-rating{
    position:absolute;left:24px;top:24px;z-index:3;
    background:var(--surface);border:1px solid var(--line);border-radius:999px;
    padding:9px 14px;display:flex;align-items:center;gap:8px;box-shadow:var(--shadow-2);
    font-size:12.5px;font-weight:700;
  }
  .hero-rating svg{width:14px;height:14px;color:var(--accent)}

  /* fade-in-up utility */
  .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.22,.7,.2,1), transform .7s cubic-bezier(.22,.7,.2,1)}
  .reveal.is-visible{opacity:1;transform:translateY(0)}
  .hero-copy > *{opacity:0;transform:translateY(16px);animation:hero-in .7s cubic-bezier(.22,.7,.2,1) forwards}
  .hero-copy > *:nth-child(1){animation-delay:.05s}
  .hero-copy > *:nth-child(2){animation-delay:.14s}
  .hero-copy > *:nth-child(3){animation-delay:.22s}
  .hero-copy > *:nth-child(4){animation-delay:.30s}
  .hero-copy > *:nth-child(5){animation-delay:.38s}
  @keyframes hero-in{to{opacity:1;transform:translateY(0)}}

  /* ============ WHY CHOOSE US ============ */
  .why-grid{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;
  }
  .why-card{
    background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);
    padding:30px 26px;display:flex;flex-direction:column;gap:16px;
    transition:transform .3s ease-out, box-shadow .3s ease-out, border-color .3s ease-out;
  }
  .why-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-2);border-color:var(--accent)}
  .why-icon{
    width:50px;height:50px;border-radius:14px;background:var(--accent-soft);color:var(--accent-ink);
    display:flex;align-items:center;justify-content:center;flex:none;
  }
  .why-icon svg{width:24px;height:24px}
  .why-card h3{font-size:17.5px;text-transform:none;font-weight:600;letter-spacing:-.005em}
  .why-card p{color:var(--ink-soft);font-size:14.5px;line-height:1.6}

  /* ============ SPECIALISTS ============ */
  .specialists-grid{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;
  }
  .specialist-card{
    background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);
    padding:30px 26px;display:flex;flex-direction:column;gap:14px;
    transition:transform .3s ease-out, box-shadow .3s ease-out, border-color .3s ease-out;
  }
  .specialist-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-2);border-color:var(--accent)}
  .specialist-icon{
    width:50px;height:50px;border-radius:14px;background:var(--accent-soft);color:var(--accent-ink);
    display:flex;align-items:center;justify-content:center;flex:none;
  }
  .specialist-icon svg{width:24px;height:24px}
  .specialist-role{font-size:17.5px;text-transform:none;font-weight:600;letter-spacing:-.005em;min-height:3em}
  .specialist-desc{color:var(--ink-soft);font-size:14.5px;line-height:1.6;min-height:4.8em}
  .specialist-note{font-size:12px;color:var(--ink-faint);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.04em;margin-top:auto}

  /* ============ SPECIALISTS FLUID FX ============
     Purely decorative background layer: an interactive fluid/blob canvas
     behind the specialist cards. It never affects layout — it's an
     absolutely-positioned, pointer-events:none sibling of .wrap, painted
     first (z-index:0) while .wrap sits above it (z-index:1). See
     wireSpecialistsFluidFX() in the script for the animation itself. */
  #specialists{position:relative;overflow:hidden}
  #specialists .wrap{position:relative;z-index:1}
  .specialists-fx{
    position:absolute;inset:0;z-index:0;overflow:hidden;
    pointer-events:none;
  }
  .specialists-fx canvas{
    position:absolute;inset:0;width:100%;height:100%;display:block;
    filter:blur(64px) saturate(1.4) contrast(1.05);
    opacity:.8;
    transform:translateZ(0);
  }
  @media (max-width:640px){
    .specialists-fx canvas{ filter:blur(38px) saturate(1.35) }
  }
  @media (prefers-reduced-motion: reduce){
    .specialists-fx{ opacity:.55 }
  }

  /* ============ CONSULT FORM EXTRAS ============
  .consult-disclaimer{
    background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);
    padding:14px 16px;font-size:12.5px;line-height:1.6;color:var(--ink-soft);margin-bottom:4px;
  }
  .bmi-readout{
    display:flex;align-items:baseline;gap:8px;padding:10px 14px;border-radius:10px;
    background:var(--surface-2);border:1px solid var(--line);
  }
  .bmi-readout .bmi-value{font-family:var(--font-mono);font-weight:700;font-size:15px}
  .bmi-readout .bmi-hint{font-size:12px;color:var(--ink-faint)}

  /* ============ CATEGORY TABS ============ */
  .tabs-row{
    display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;margin-bottom:36px;
    scrollbar-width:none;
  }
  .tabs-row::-webkit-scrollbar{display:none}
  .tab-btn{
    flex:none;padding:13px 22px;border-radius:var(--radius-sm);border:1px solid var(--line);background:var(--surface);
    font-weight:700;font-size:13.5px;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-soft);
    transition:all .2s ease;
  }
  .tab-btn:hover{border-color:var(--line-strong);color:var(--ink)}
  .tab-btn[aria-selected="true"]{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
  .category-intro{
    display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:36px;flex-wrap:wrap;
  }
  .category-intro-text{max-width:60ch}
  .category-intro-text h3{font-size:clamp(22px,2.4vw,28px);text-transform:none;font-weight:600;margin-bottom:10px}
  .category-intro-text p{color:var(--ink-soft);font-size:15px;line-height:1.65}
  .category-count{
    font-family:var(--font-mono);font-size:13px;color:var(--ink-faint);white-space:nowrap;padding-bottom:6px;
  }

  /* ============ PRODUCT GRID ============ */
  .product-grid{
    display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
  }
  @media (max-width:1180px){ .product-grid{grid-template-columns:repeat(3,1fr)} }
  @media (max-width:860px){ .product-grid{grid-template-columns:repeat(2,1fr)} }
  @media (max-width:560px){ .product-grid{grid-template-columns:1fr} }

  .product-card{
    background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);
    display:flex;flex-direction:column;overflow:hidden;
    transition:transform .3s ease-out, box-shadow .3s ease-out, border-color .3s ease-out;
  }
  .product-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-2);border-color:var(--accent)}
  .product-media{
    aspect-ratio:1/1;background:var(--bg-soft);position:relative;overflow:hidden;
    display:flex;align-items:center;justify-content:center;padding:18px;
  }
  .product-media svg{width:66%;transition:transform .4s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 10px 14px rgba(15,29,21,.14))}
  .product-card:hover .product-media svg{transform:scale(1.03)}
  .product-media .product-photo{max-width:76%;max-height:82%;object-fit:contain;transition:transform .4s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 14px 18px rgba(15,29,21,.16))}
  .product-card:hover .product-media .product-photo{transform:scale(1.03)}
  .product-tag{
    position:absolute;top:12px;left:12px;background:var(--surface);border:1px solid var(--line);
    padding:5px 11px;border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.06em;
    text-transform:uppercase;color:var(--ink-soft);
  }
  .product-body{padding:20px 20px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
  .product-name{font-size:17px;font-weight:600;font-family:var(--font-display);text-transform:none;letter-spacing:-.005em}
  .product-format{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-faint);letter-spacing:.03em;text-transform:uppercase}
  .product-desc{font-size:13.5px;color:var(--ink-soft);line-height:1.55;flex:1}
  .product-foot{display:flex;flex-direction:column;gap:12px;margin-top:6px;padding-top:14px;border-top:1px solid var(--line)}
  .product-price{font-family:var(--font-mono);font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink)}
  .product-consult-note{display:block;font-size:11.5px;color:var(--ink-faint);line-height:1.4;margin-top:2px}
  .product-grid[data-empty="true"]{display:block}
  .grid-empty{display:none;text-align:center;padding:60px 20px;color:var(--ink-soft)}
  .grid-empty.is-visible{display:block}

  /* ============ HOW IT WORKS ============ */
  .steps-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:step}
  @media (max-width:900px){ .steps-grid{grid-template-columns:repeat(2,1fr);gap:24px 18px} }
  @media (max-width:520px){ .steps-grid{grid-template-columns:1fr;gap:22px} }
  .step-card{position:relative;padding:0 22px 0 0;counter-increment:step}
  @media (max-width:900px){ .step-card{padding-right:0} }
  .step-card::after{
    content:"";position:absolute;top:23px;left:calc(100% - 11px);width:calc(22px * 2);height:1.5px;background:var(--line-strong);
  }
  .steps-grid .step-card:last-child::after{display:none}
  @media (max-width:900px){ .step-card::after{display:none} }
  .step-num{
    width:46px;height:46px;border-radius:50%;border:1px solid var(--line-strong);
    display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-weight:700;font-size:15px;
    color:var(--accent-ink);background:var(--surface);margin-bottom:18px;
  }
  .step-num::before{content:counter(step, decimal-leading-zero)}
  .step-card h3{font-size:16.5px;text-transform:none;font-weight:600;letter-spacing:-.005em;margin-bottom:8px}
  .step-card p{font-size:13.5px;color:var(--ink-soft);line-height:1.6}

  /* ============ PRODUCT SHOWCASE ============
     A premium, mostly-static composition: a product photo with a subtle
     mouse-driven 3D tilt/highlight/shadow, four benefit cards connected to
     it with thin animated lines, and a fluid blue blob canvas behind
     everything (reuses createFluidBlobFX(), see the script's "REUSABLE
     FLUID / BLOB BACKGROUND ENGINE"). Every moving layer here has
     pointer-events:none except the cards and the CTA button, so nothing
     decorative can ever block a click. */
  #showcase{position:relative;overflow:hidden}
  #showcase .wrap{position:relative;z-index:1}
  .showcase-fx{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
  .showcase-fx canvas{
    position:absolute;inset:0;width:100%;height:100%;display:block;
    filter:blur(68px) saturate(1.4) contrast(1.05);opacity:.75;transform:translateZ(0);
  }
  @media (max-width:640px){ .showcase-fx canvas{filter:blur(40px) saturate(1.3)} }
  @media (prefers-reduced-motion:reduce){ .showcase-fx{opacity:.55} }

  .showcase-stage{
    position:relative;
    display:grid;
    grid-template-columns:1fr minmax(220px,300px) 1fr;
    grid-template-areas:"tl product tr" "bl product br";
    align-items:center;
    gap:36px 44px;
    padding-block:12px;
  }
  @media (max-width:900px){
    .showcase-stage{
      grid-template-columns:1fr;
      grid-template-areas:"product" "tl" "tr" "bl" "br";
      gap:22px;justify-items:center;text-align:center;
    }
  }

  .showcase-lines{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:visible}
  .showcase-lines .showcase-line{
    fill:none;stroke:var(--accent);stroke-opacity:.24;stroke-width:1.4;stroke-linecap:round;
  }
  .showcase-lines .showcase-line.is-pulsing{
    stroke-dasharray:5 340;animation:showcase-pulse 5.5s linear infinite;
  }
  .showcase-lines .showcase-line.is-active{stroke-opacity:.7;stroke-width:2}
  @keyframes showcase-pulse{ from{stroke-dashoffset:340} to{stroke-dashoffset:0} }
  @media (max-width:900px){ .showcase-lines{display:none} }

  .showcase-benefit{
    position:relative;z-index:2;display:flex;gap:14px;align-items:flex-start;max-width:300px;
    transition:opacity .3s ease;
  }
  .showcase-benefit--tl{grid-area:tl;justify-self:end}
  .showcase-benefit--tr{grid-area:tr;justify-self:start;flex-direction:row-reverse;text-align:right}
  .showcase-benefit--bl{grid-area:bl;justify-self:end}
  .showcase-benefit--br{grid-area:br;justify-self:start;flex-direction:row-reverse;text-align:right}
  @media (max-width:900px){
    .showcase-benefit, .showcase-benefit--tr, .showcase-benefit--br{
      justify-self:center;flex-direction:row;text-align:left;
    }
  }
  .showcase-benefit-dot{
    position:absolute;top:24px;width:8px;height:8px;border-radius:50%;
    background:var(--surface);border:2px solid var(--accent);z-index:3;
  }
  .showcase-benefit--tl .showcase-benefit-dot, .showcase-benefit--bl .showcase-benefit-dot{right:-30px}
  .showcase-benefit--tr .showcase-benefit-dot, .showcase-benefit--br .showcase-benefit-dot{left:-30px}
  @media (max-width:900px){ .showcase-benefit-dot{display:none} }
  .showcase-benefit-icon{
    width:44px;height:44px;border-radius:12px;flex:none;
    background:var(--accent-soft);color:var(--accent-ink);
    display:flex;align-items:center;justify-content:center;
    transition:transform .3s ease-out, filter .3s ease-out;
  }
  .showcase-benefit-icon svg{width:21px;height:21px}
  .showcase-benefit:hover .showcase-benefit-icon{transform:scale(1.07)}
  .showcase-benefit-body h3{font-size:15.5px;font-weight:600;text-transform:none;letter-spacing:-.005em;margin-bottom:4px}
  .showcase-benefit-body p{font-size:13px;color:var(--ink-soft);line-height:1.55}

  .showcase-product-reveal{opacity:0;transform:scale(.96);transition:opacity .8s cubic-bezier(.22,.7,.2,1), transform .8s cubic-bezier(.22,.7,.2,1)}
  .showcase-product-reveal.is-visible{opacity:1;transform:scale(1)}
  .showcase-product{
    grid-area:product;position:relative;z-index:2;
    display:flex;flex-direction:column;align-items:center;gap:16px;
    perspective:1000px;
  }
  .showcase-product-tilt{
    position:relative;width:100%;max-width:230px;
    transform-style:preserve-3d;will-change:transform;
  }
  .showcase-product-img{width:100%;height:auto;display:block;position:relative;z-index:2;filter:drop-shadow(0 18px 26px rgba(15,29,21,.16))}
  .showcase-highlight{
    position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:50%;
    background:radial-gradient(circle at 50% 30%, rgba(255,255,255,.5), transparent 55%);
    mix-blend-mode:overlay;opacity:.85;
  }
  .showcase-shadow{
    position:absolute;left:50%;bottom:-10px;width:64%;height:24px;transform:translateX(-50%);
    background:radial-gradient(ellipse at center, rgba(15,29,21,.34), transparent 72%);
    filter:blur(7px);z-index:1;
  }
  .showcase-product-label{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center}
  .showcase-product-name{font-family:var(--font-display);font-weight:700;font-size:16.5px;letter-spacing:-.005em}
  .showcase-product-sub{font-family:var(--font-mono);font-size:11px;color:var(--ink-faint);letter-spacing:.03em;text-transform:uppercase}
  .showcase-cta{margin-top:2px}

  /* ============ PRICING ============ */
  .pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  @media (max-width:900px){ .pricing-grid{grid-template-columns:1fr;max-width:420px;margin:0 auto} }
  .pricing-card{
    background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);
    padding:32px 28px;display:flex;flex-direction:column;gap:20px;
    transition:transform .3s ease-out, box-shadow .3s ease-out, border-color .3s ease-out;
  }
  .pricing-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-2);border-color:var(--accent)}
  .pricing-card h3{font-size:20px;text-transform:none;font-weight:600}
  .pricing-price{font-family:var(--font-mono);font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink)}
  .pricing-features{display:flex;flex-direction:column;gap:12px;flex:1}
  .pricing-features li{display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--ink-soft);line-height:1.5}
  .pricing-features svg{width:16px;height:16px;color:var(--accent);flex:none;margin-top:2px}

  /* ============ FAQ ============ */
  .faq-list{display:flex;flex-direction:column;gap:12px;max-width:820px}
  .faq-item{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden}
  .faq-q{
    width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;
    padding:20px 22px;background:none;border:none;text-align:left;color:var(--ink);
    font-size:15px;font-weight:700;font-family:var(--font-body);
  }
  .faq-q svg{width:18px;height:18px;flex:none;color:var(--ink-faint);transition:transform .2s ease}
  .faq-item[data-open="true"] .faq-q svg{transform:rotate(45deg)}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .28s ease}
  .faq-a p{padding:0 22px 20px;font-size:13.5px;color:var(--ink-soft);line-height:1.65}

  /* ============ MODAL ============ */
  .modal-overlay{
    position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
    padding:20px;visibility:hidden;
  }
  .modal-overlay[data-open="true"]{visibility:visible}
  .modal-backdrop{position:absolute;inset:0;background:rgba(15,29,21,.5);opacity:0;transition:opacity .24s ease}
  .modal-overlay[data-open="true"] .modal-backdrop{opacity:1}
  .modal-panel{
    position:relative;width:100%;max-width:480px;max-height:88vh;overflow-y:auto;
    background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--line);box-shadow:var(--shadow-3);
    padding:32px;transform:translateY(18px) scale(.98);opacity:0;transition:transform .26s cubic-bezier(.22,.8,.2,1), opacity .22s ease;
  }
  .modal-overlay[data-open="true"] .modal-panel{transform:translateY(0) scale(1);opacity:1}
  .modal-close{position:absolute;top:20px;right:20px}
  .modal-title{font-size:24px;text-transform:none;font-weight:600;margin-bottom:6px}
  .modal-selected{
    display:flex;align-items:center;gap:12px;background:var(--surface-2);border:1px solid var(--line);
    border-radius:12px;padding:12px 14px;margin:18px 0 22px;
  }
  .modal-selected svg{width:34px;height:34px;flex:none}
  .modal-selected-label{font-size:11px;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.05em;font-family:var(--font-mono)}
  .modal-selected-name{font-weight:700;font-size:14.5px}

  form{display:flex;flex-direction:column;gap:16px}
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .field{display:flex;flex-direction:column;gap:7px}
  .field label{font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft)}
  .field input,.field select,.field textarea{
    width:100%;padding:13px 15px;border-radius:10px;border:1px solid var(--line);
    background:var(--surface);color:var(--ink);font-family:var(--font-body);font-size:14.5px;
    transition:border-color .16s ease;
  }
  .field textarea{resize:vertical;min-height:88px}
  .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent)}
  .field.has-error input,.field.has-error select,.field.has-error textarea{border-color:var(--danger)}
  .field-error{font-size:12px;color:var(--danger);display:none;font-weight:600}
  .field.has-error .field-error{display:block}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
  @media (max-width:480px){ .field-row{grid-template-columns:1fr} }
  .consent{display:flex;align-items:flex-start;gap:10px;font-size:12.5px;color:var(--ink-soft);line-height:1.5}
  .consent input{width:17px;height:17px;margin-top:2px;accent-color:var(--accent);flex:none}
  .consent .field-error{margin-left:27px}
  .field[data-field="consent"]{display:none;margin-top:-6px}
  .field[data-field="consent"].has-error{display:block}
  .field[data-field="consent"] .field-error{display:block}
  .form-note{font-size:11.5px;color:var(--ink-faint);line-height:1.6}

  .form-success{display:none;text-align:center;padding:20px 4px;flex-direction:column;align-items:center;gap:14px}
  .form-success.is-visible{display:flex}
  .form-success-icon{
    width:58px;height:58px;border-radius:50%;background:var(--accent-soft);color:var(--accent-ink);
    display:flex;align-items:center;justify-content:center;
  }
  .form-success-icon svg{width:28px;height:28px}
  .form-success h4{font-size:22px;text-transform:none;font-weight:600}
  .form-success p{color:var(--ink-soft);font-size:14px;max-width:36ch;line-height:1.6}
  .modal-panel.is-success form,.lead-panel.is-success form{display:none}

  .promo-slot{width:100%;align-self:stretch;display:flex;flex-direction:column;gap:12px}
  .promo-box{
    width:100%;background:var(--accent-soft);border:1px solid var(--accent-light);border-radius:var(--radius-sm);
    padding:14px 16px;display:flex;flex-direction:column;gap:10px;text-align:left;
  }
  .promo-label{font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-ink)}
  .promo-row{display:flex;align-items:center;gap:10px}
  .promo-code{font-family:var(--font-mono);font-weight:700;font-size:18px;letter-spacing:.04em;color:var(--ink);flex:1;word-break:break-all}
  .promo-copy{flex:none}
  .promo-copy.is-copied{color:var(--accent);border-color:var(--accent)}
  .promo-note{font-size:12px;color:var(--ink-faint);line-height:1.5}
  .promo-chat-btn svg{width:16px;height:16px}
  .spinner{width:16px;height:16px;border-radius:50%;border:2px solid color-mix(in srgb, var(--on-accent) 35%, transparent);border-top-color:var(--on-accent);animation:spin .7s linear infinite;display:none}
  .btn.is-loading .spinner{display:inline-block}
  .btn.is-loading .btn-label{opacity:.7}
  @keyframes spin{to{transform:rotate(360deg)}}

  /* ============ QUIZ ============ */
  .modal-panel-quiz{max-width:540px}
  .quiz-progress{display:flex;flex-direction:column;gap:8px;margin:18px 0 24px}
  .quiz-progress-track{height:5px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);overflow:hidden}
  .quiz-progress-fill{height:100%;width:25%;background:var(--accent);border-radius:999px;transition:width .3s ease}
  .quiz-progress-label{font-family:var(--font-mono);font-size:11.5px;color:var(--ink-faint);letter-spacing:.04em;text-transform:uppercase}
  .quiz-step[hidden]{display:none}
  .quiz-question{font-size:18px;font-weight:600;font-family:var(--font-display);text-transform:none;margin-bottom:16px;line-height:1.3}
  .quiz-options{display:flex;flex-direction:column;gap:10px}
  .quiz-option{
    display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;
    padding:15px 18px;border-radius:12px;border:1px solid var(--line);background:var(--surface);
    color:var(--ink);font-size:14.5px;font-weight:600;text-align:left;
    transition:border-color .16s ease, background-color .16s ease, transform .16s ease;
  }
  .quiz-option:hover{border-color:var(--line-strong);transform:translateY(-1px)}
  .quiz-option[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink)}
  .quiz-option-check{
    width:20px;height:20px;border-radius:50%;border:1px solid var(--line-strong);flex:none;
    display:flex;align-items:center;justify-content:center;
  }
  .quiz-option[aria-pressed="true"] .quiz-option-check{border-color:var(--accent);background:var(--accent)}
  .quiz-option-check svg{width:12px;height:12px;color:var(--on-accent);opacity:0}
  .quiz-option[aria-pressed="true"] .quiz-option-check svg{opacity:1}
  .quiz-nav{display:flex;gap:12px;margin-top:24px}
  .quiz-nav #quizNext,.quiz-nav #quizSubmit{flex:1}

  /* ============ REVIEWS ============ */
  .reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
  @media (max-width:980px){ .reviews-grid{grid-template-columns:repeat(2,1fr)} }
  @media (max-width:640px){ .reviews-grid{grid-template-columns:1fr} }
  .review-card{
    background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);
    padding:26px 24px;display:flex;flex-direction:column;gap:16px;
  }
  .review-stars{display:flex;gap:3px;color:var(--accent)}
  .review-stars svg{width:16px;height:16px}
  .review-text{font-size:14.5px;line-height:1.65;color:var(--ink);flex:1;font-style:italic}
  .review-who{display:flex;align-items:center;gap:12px;padding-top:14px;border-top:1px solid var(--line)}
  .review-avatar{
    width:38px;height:38px;border-radius:50%;background:var(--surface-2);border:1px dashed var(--line-strong);
    display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:10px;color:var(--ink-faint);flex:none;
  }
  .review-name{font-weight:700;font-size:13.5px}
  .review-country{font-size:12px;color:var(--ink-faint)}

  /* ============ LEAD / DISCOUNT SECTION ============ */
  .lead-section{padding-block:0 88px}
  .lead-panel{
    position:relative;overflow:hidden;
    /* deliberately dark, regardless of viewer theme — see fixed-dark tokens */
    --ink:var(--fixed-dark-ink);
    --accent-soft:var(--fixed-dark-accent-soft);
    --accent-ink:var(--fixed-dark-accent-ink);
    background:var(--fixed-dark-bg);color:var(--fixed-dark-ink);
    border-radius:var(--radius-lg);padding:64px 56px;
    display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:center;
  }
  @media (max-width:900px){ .lead-panel{grid-template-columns:1fr;padding:44px 26px} }
  .lead-panel::before{
    content:"";position:absolute;right:-10%;top:-30%;width:60%;aspect-ratio:1/1;border-radius:50%;
    background:radial-gradient(circle, var(--accent) 0%, transparent 70%);opacity:.4;
  }
  .lead-copy{position:relative;z-index:2;display:flex;flex-direction:column;gap:16px}
  .lead-copy h2{font-size:clamp(28px,4vw,44px);text-transform:none;font-weight:700;line-height:1.08;color:var(--fixed-dark-ink)}
  .lead-copy p{color:var(--fixed-dark-ink-soft);font-size:15.5px;line-height:1.65;max-width:48ch}
  .lead-points{display:flex;flex-direction:column;gap:10px;margin-top:8px}
  .lead-point{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--fixed-dark-ink-soft);font-weight:600}
  .lead-point svg{width:17px;height:17px;color:var(--accent);flex:none}
  .lead-form-card{
    position:relative;z-index:2;background:var(--surface);color:var(--ink);border-radius:var(--radius-md);
    padding:30px;box-shadow:var(--shadow-3);
  }
  .lead-form-card .form-note{margin-top:2px}

  /* ============ NEWSLETTER ============ */
  .newsletter-section{padding-block:0 96px}
  .newsletter-panel{
    position:relative;overflow:hidden;
    /* deliberately dark, regardless of viewer theme — see fixed-dark tokens */
    --ink:var(--fixed-dark-ink);
    --ink-soft:var(--fixed-dark-ink-soft);
    --ink-faint:var(--fixed-dark-ink-faint);
    --line:var(--fixed-dark-line);
    --line-strong:var(--fixed-dark-line-strong);
    --accent-soft:var(--fixed-dark-accent-soft);
    --accent-ink:var(--fixed-dark-accent-ink);
    background:var(--fixed-dark-bg);color:var(--fixed-dark-ink);
    border-radius:var(--radius-lg);border:1px solid var(--fixed-dark-line);
    display:flex;justify-content:center;
  }
  .newsletter-copy{
    position:relative;z-index:2;padding:56px;display:flex;flex-direction:column;gap:16px;
    max-width:640px;width:100%;
  }
  @media (max-width:640px){ .newsletter-copy{padding:36px 24px} }
  .newsletter-copy h2{font-size:clamp(28px,3.6vw,40px);font-weight:700;line-height:1.1;color:var(--fixed-dark-ink)}
  .newsletter-copy h2 em{font-style:normal;color:var(--accent-2)}
  .newsletter-copy p{color:var(--fixed-dark-ink-soft);font-size:14.5px;line-height:1.6;max-width:42ch}
  .newsletter-form{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
  .newsletter-form input{
    flex:1;min-width:200px;padding:13px 16px;border-radius:999px;border:1px solid var(--fixed-dark-line-strong);
    background:rgba(241,245,239,.06);color:var(--fixed-dark-ink);font-family:var(--font-body);font-size:14px;
    transition:border-color .18s ease;
  }
  .newsletter-form input::placeholder{color:var(--fixed-dark-ink-faint)}
  .newsletter-form input:focus{border-color:var(--accent-2);outline:none}
  .newsletter-form .btn{border-radius:999px;flex:none}
  .newsletter-error{display:none;font-size:12px;color:#E8A3A3;font-weight:600;margin-top:-4px}
  .newsletter-error.is-visible{display:block}
  .newsletter-note{font-size:11.5px;color:var(--fixed-dark-ink-faint);margin-top:2px}
  .newsletter-success{display:none;flex-direction:column;align-items:flex-start;gap:12px;margin-top:8px}
  .newsletter-success.is-visible{display:flex}
  .newsletter-success .form-success-icon{
    width:48px;height:48px;border-radius:50%;background:var(--fixed-dark-accent-soft);color:var(--accent-2);
    display:flex;align-items:center;justify-content:center;flex:none;
  }
  .newsletter-success .form-success-icon svg{width:24px;height:24px}
  .newsletter-success h4{font-size:19px;font-weight:600;text-transform:none;color:var(--fixed-dark-ink)}
  .newsletter-success p{color:var(--fixed-dark-ink-soft);font-size:14px;line-height:1.6;max-width:40ch}
  .newsletter-success .promo-slot{margin-top:2px}

  /* ============ FOOTER ============ */
  footer.site-footer{background:var(--bg-soft);border-top:1px solid var(--line);padding-block:64px 28px}
  .footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:40px;padding-bottom:44px}
  @media (max-width:860px){ .footer-grid{grid-template-columns:1fr 1fr;row-gap:34px} }
  @media (max-width:480px){ .footer-grid{grid-template-columns:1fr} }
  .footer-brand p{color:var(--ink-soft);font-size:13.5px;line-height:1.65;max-width:34ch;margin-top:12px}
  .footer-col h4{font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-faint);margin-bottom:16px;font-family:var(--font-mono);font-weight:600}
  .footer-col ul{display:flex;flex-direction:column;gap:11px}
  .footer-col a{font-size:14px;color:var(--ink-soft);transition:color .16s ease}
  .footer-col a:hover{color:var(--ink)}
  .footer-col li{font-size:14px;color:var(--ink-soft)}
  .footer-bottom{
    display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;
    padding-top:26px;border-top:1px solid var(--line);
  }
  .footer-copy{font-size:12.5px;color:var(--ink-faint)}
  .footer-langs{display:flex;gap:6px}
  .footer-langs button{
    padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink-soft);
    font-family:var(--font-mono);font-size:11.5px;font-weight:700;letter-spacing:.04em;
  }
  .footer-langs button[aria-current="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}

  .disclaimer-bar{background:var(--surface-2);border-top:1px solid var(--line)}
  .disclaimer-bar p{padding-block:14px;font-size:11.5px;color:var(--ink-faint);line-height:1.6;max-width:1320px;margin:0 auto}
