/* ============================================================
   The Test Bench - ignitrareviews.com
   "Bench Blue" instrument theme. ITCSS @layer cascade.
   Namespacing: tb- components, .is-/.has- states, u- helpers.
   Data viz driven by inline custom property --val (0-100).
   ============================================================ */

@layer settings, reset, base, objects, components, utilities;

/* -- metric-matched fallbacks (anti-CLS on font swap) ------- */
@font-face{
  font-family:"Grotesk fallback";
  src:local("Arial");
  size-adjust:95%;
  ascent-override:90%;
  descent-override:23%;
}
@font-face{
  font-family:"Public fallback";
  src:local("Arial");
  size-adjust:99%;
}

@layer settings{
  :root{
    /* ink + neutrals */
    --ink:#161b22;
    --ink-soft:#2b3340;
    --slate:#475569;
    --slate-2:#5b6678;
    --line:#e2e6ec;
    --line-2:#cfd6e0;
    --paper:#ffffff;
    --panel:#f5f7fa;
    --panel-2:#eef2f8;
    --tint:#eaf1fe;

    /* brand cobalt + instrument navy */
    --brand:#1b54c0;
    --brand-strong:#16429a;
    --azure:#2f6df6;
    --azure-soft:#7fb0ff;
    --navy:#0f1b2e;
    --navy-2:#16243c;
    --on-navy:#eaf0fb;
    --on-navy-mute:#a9bbd6;

    /* verdict semantics */
    --good:#15803d;  --good-bg:#e7f4ec;
    --warn:#b45309;  --warn-bg:#fbf0df;
    --bad:#b91c1c;   --bad-bg:#fbeceb;
    --star:#d98a1f;

    /* type */
    --font-display:"Space Grotesk","Grotesk fallback",system-ui,sans-serif;
    --font-body:"Public Sans","Public fallback",system-ui,Arial,sans-serif;

    /* shape */
    --r-xs:6px; --r-sm:9px; --r:13px; --r-lg:20px; --r-pill:999px;
    --shadow-sm:0 1px 2px rgba(15,27,46,.06);
    --shadow:0 8px 26px rgba(15,27,46,.08);
    --shadow-lg:0 22px 55px rgba(15,27,46,.16);

    --wrap:1080px;
    --wrap-tight:760px;
  }
}

/* ====================== RESET ============================== */
@layer reset{
  *,*::before,*::after{box-sizing:border-box}
  *{margin:0}
  html{-webkit-text-size-adjust:100%}
  body{min-height:100vh;line-height:1.62;-webkit-font-smoothing:antialiased}
  img,svg{display:block;max-width:100%}
  img{height:auto}
  button,input,select,textarea{font:inherit;color:inherit}
  ul,ol{list-style:none;padding:0}
  a{color:inherit}
  table{border-collapse:collapse;width:100%}
  :focus-visible{outline:3px solid var(--azure);outline-offset:2px;border-radius:3px}
}

/* ====================== BASE ============================== */
@layer base{
  body{
    font-family:var(--font-body);
    color:var(--ink);
    background:var(--paper);
    font-size:1.02rem;
  }
  h1,h2,h3,h4{
    font-family:var(--font-display);
    line-height:1.16;
    letter-spacing:-.01em;
    color:var(--ink);
    font-weight:700;
    text-wrap:balance;
  }
  h2{font-size:clamp(1.5rem,1.05rem + 1.7vw,2.05rem);margin-bottom:.55rem}
  h3{font-size:1.2rem;margin-bottom:.4rem}
  p{margin-bottom:1rem}
  a{color:var(--brand);text-underline-offset:2px;text-decoration-thickness:1px}
  a:hover{color:var(--brand-strong)}
  strong{font-weight:700;color:var(--ink)}
  small{font-size:.82rem}
  th,td{text-align:left}
}

/* ====================== OBJECTS =========================== */
@layer objects{
  .tb-wrap{width:min(100% - 2.2rem,var(--wrap));margin-inline:auto}
  .tb-wrap--tight{max-width:var(--wrap-tight)}
  .tb-section{padding-block:clamp(2.2rem,1.4rem + 3vw,3.6rem)}
  .tb-section--flush{padding-block:0}
  .tb-stack>*+*{margin-top:1rem}
  .tb-stack-lg>*+*{margin-top:1.6rem}
  .tb-cluster{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
  .tb-grid{display:grid;gap:1.1rem}
  @media(min-width:640px){
    .tb-grid--2{grid-template-columns:1fr 1fr}
    .tb-grid--3{grid-template-columns:repeat(3,1fr)}
  }
  @media(min-width:880px){
    .tb-grid--4{grid-template-columns:repeat(4,1fr)}
  }
  .tb-rule{height:1px;background:var(--line);border:0;margin-block:1.4rem}
  .tb-lead{font-size:1.12rem;color:var(--ink-soft)}
}

/* ====================== COMPONENTS ======================== */
@layer components{

  /* ---- skip link ---- */
  .tb-skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--navy);
    color:#fff;padding:.7rem 1.1rem;border-radius:0 0 var(--r-sm) 0;font-weight:600}
  .tb-skip:focus{left:0}

  /* ---- header ---- */
  .tb-header{position:sticky;top:0;z-index:90;background:rgba(245,247,250,.92);
    backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--line-2)}
  .tb-header__bar{display:flex;align-items:center;justify-content:space-between;
    gap:1rem;min-height:62px}
  .tb-brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink)}
  .tb-brand__tile{display:grid;place-items:center;width:38px;height:38px;border-radius:9px;
    background:var(--navy);color:#fff;font-family:var(--font-display);font-weight:700;
    font-size:1.02rem;letter-spacing:.02em;box-shadow:var(--shadow-sm)}
  .tb-brand__name{font-family:var(--font-display);font-weight:700;font-size:1.04rem;
    letter-spacing:.02em;line-height:1}
  .tb-brand__tag{display:block;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;
    color:var(--slate);font-weight:600;margin-top:3px}
  .tb-nav{display:flex;align-items:center;gap:.3rem}
  .tb-nav__links{display:none}
  .tb-nav__links a{display:inline-block;padding:.5rem .7rem;border-radius:var(--r-sm);
    text-decoration:none;color:var(--ink-soft);font-weight:600;font-size:.94rem}
  .tb-nav__links a:hover{background:var(--panel-2);color:var(--brand)}
  .tb-nav__links a[aria-current="page"]{color:var(--brand);background:var(--tint)}
  .tb-burger{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:var(--r-sm);
    border:1px solid var(--line-2);background:var(--paper);cursor:pointer}
  .tb-burger span,.tb-burger span::before,.tb-burger span::after{content:"";display:block;
    width:18px;height:2px;background:var(--ink);transition:transform .2s}
  .tb-burger span::before{transform:translateY(-5px)}
  .tb-burger span::after{transform:translateY(3px)}
  .tb-menu{display:none}
  @media(min-width:920px){
    .tb-nav__links{display:flex}
    .tb-burger{display:none}
  }

  /* mobile drawer */
  .tb-menu.is-open{display:block;border-top:1px solid var(--line-2);background:var(--panel)}
  .tb-menu__inner{padding:.5rem 0 1rem}
  .tb-menu a{display:block;padding:.8rem .2rem;border-bottom:1px solid var(--line);
    text-decoration:none;color:var(--ink-soft);font-weight:600}
  .tb-menu a:last-child{border-bottom:0}

  /* ---- buttons / CTA ---- */
  .tb-cta{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
    font-family:var(--font-display);font-weight:700;font-size:1.08rem;letter-spacing:.02em;
    background:linear-gradient(180deg,#2a63d8,var(--brand));color:#fff;text-decoration:none;cursor:pointer;
    padding:1.05rem 1.9rem;border-radius:var(--r-pill);border:0;line-height:1.12;min-height:56px;
    box-shadow:0 12px 26px rgba(27,84,192,.34);transition:transform .12s,box-shadow .2s,background .15s}
  .tb-cta::after{content:"\2192";font-size:1.05em;line-height:1;transition:transform .18s}
  .tb-cta:hover{background:linear-gradient(180deg,#2258cc,var(--brand-strong));color:#fff;
    transform:translateY(-2px);box-shadow:0 18px 34px rgba(27,84,192,.44)}
  .tb-cta:hover::after{transform:translateX(5px)}
  .tb-cta:active{transform:translateY(0)}
  .tb-cta--sm{padding:.72rem 1.3rem;font-size:1rem;min-height:0;gap:.4rem;
    box-shadow:0 8px 18px rgba(27,84,192,.32)}
  .tb-cta--sm::after{font-size:.95em}
  .tb-cta--ghost{background:var(--paper);color:var(--brand);border:1.5px solid var(--line-2);
    box-shadow:var(--shadow-sm)}
  .tb-cta--ghost:hover{background:var(--tint);color:var(--brand-strong)}
  .tb-cta--block{display:flex;width:100%}
  /* calm full-width button (e.g. review submit) - no arrow, no pulse */
  .tb-cta--wide{display:flex;width:100%}
  .tb-cta--wide::after{display:none}
  /* loud conversion buttons: larger + soft attention pulse */
  .tb-cta--pulse{font-size:1.2rem;padding:1.2rem 2.1rem;min-height:62px;letter-spacing:.025em;
    animation:tb-pulse 2.6s ease-in-out infinite}
  @keyframes tb-pulse{
    0%,100%{box-shadow:0 12px 26px rgba(27,84,192,.34)}
    50%{box-shadow:0 16px 38px rgba(47,109,246,.6)}
  }
  .tb-cta__sub{display:block;font-family:var(--font-body);font-weight:500;font-size:.82rem;
    color:var(--slate);margin-top:.6rem}
  .tb-cta-wrap{text-align:center}

  /* ---- disclosure banner ---- */
  .tb-banner{background:var(--navy);color:var(--on-navy)}
  .tb-banner__in{display:flex;gap:.6rem;align-items:flex-start;padding:.6rem 0;font-size:.86rem;
    line-height:1.5}
  .tb-banner__in svg{flex:none;margin-top:2px;color:var(--azure-soft)}
  .tb-banner a{color:#fff;font-weight:700;text-decoration:underline}

  /* ---- breadcrumb ---- */
  .tb-crumb{padding:.7rem 0;font-size:.82rem;color:var(--slate)}
  .tb-crumb ol{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
  .tb-crumb a{color:var(--slate);text-decoration:none}
  .tb-crumb a:hover{color:var(--brand);text-decoration:underline}
  .tb-crumb [aria-current]{color:var(--ink-soft);font-weight:600}
  .tb-crumb li+li::before{content:"/";margin-right:.35rem;color:var(--line-2)}

  /* ---- hero / H1 ---- */
  .tb-hero{padding-top:1.4rem}
  .tb-eyebrow{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--font-display);
    font-weight:600;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;
    color:var(--brand);background:var(--tint);padding:.3rem .7rem;border-radius:var(--r-pill)}
  .tb-h1{font-size:clamp(2rem,1.2rem + 3.6vw,3.1rem);margin:.7rem 0 .5rem}
  .tb-h1 .is-mark{color:var(--brand)}
  .tb-sub{font-size:1.15rem;color:var(--ink-soft);max-width:48ch}

  /* ---- byline ---- */
  .tb-byline{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem .8rem;
    margin-top:1.1rem;padding-top:1rem;border-top:1px solid var(--line);
    font-size:.86rem;color:var(--slate)}
  .tb-byline strong{color:var(--ink)}
  .tb-byline .tb-dot{width:4px;height:4px;border-radius:50%;background:var(--line-2)}

  /* ---- stars ---- */
  .tb-stars{--pct:100%;display:inline-block;position:relative;font-size:1em;line-height:1;
    color:var(--line-2)}
  .tb-stars::before{content:"★★★★★";letter-spacing:.06em}
  .tb-stars__on{position:absolute;inset:0;width:var(--pct);overflow:hidden;color:var(--star);
    white-space:nowrap}
  .tb-stars__on::before{content:"★★★★★";letter-spacing:.06em}

  /* ---- verdict (instrument panel) ---- */
  .tb-verdict{background:linear-gradient(165deg,var(--navy),var(--navy-2));color:var(--on-navy);
    border-radius:var(--r-lg);padding:clamp(1.3rem,1rem + 1.6vw,2rem);box-shadow:var(--shadow-lg);
    position:relative;overflow:hidden}
  .tb-verdict::after{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;
    background:radial-gradient(circle,rgba(47,109,246,.35),transparent 70%);pointer-events:none}
  .tb-verdict__head{display:flex;flex-wrap:wrap;gap:1.1rem 1.6rem;align-items:center}
  .tb-score{text-align:center;flex:none}
  .tb-score__num{font-family:var(--font-display);font-weight:700;font-size:3.5rem;line-height:.9;
    color:#fff;font-feature-settings:"tnum" 1}
  .tb-score__num span{font-size:1.3rem;color:var(--on-navy-mute)}
  .tb-score .tb-stars{font-size:1.1rem;color:rgba(255,255,255,.22);margin-top:.4rem}
  .tb-score__label{display:block;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
    color:var(--on-navy-mute);margin-top:.5rem;font-weight:600}
  .tb-verdict__lead{flex:1 1 280px;min-width:240px}
  .tb-verdict__lead .tb-tag{display:inline-block;font-family:var(--font-display);font-size:.7rem;
    letter-spacing:.16em;text-transform:uppercase;color:var(--azure-soft);font-weight:600;
    margin-bottom:.45rem}
  .tb-verdict__lead p{color:var(--on-navy);margin:0;font-size:1.06rem}
  .tb-verdict__lead strong{color:#fff}

  /* readout grid (dl) */
  .tb-readout{margin-top:1.4rem;border-top:1px solid rgba(255,255,255,.14);padding-top:1.2rem}
  .tb-readout__title{font-family:var(--font-display);font-size:.72rem;letter-spacing:.16em;
    text-transform:uppercase;color:var(--on-navy-mute);font-weight:600;margin-bottom:.8rem}
  .tb-readout dl{display:grid;gap:.8rem 1.2rem;grid-template-columns:1fr 1fr}
  @media(min-width:720px){.tb-readout dl{grid-template-columns:repeat(3,1fr)}}
  .tb-fact{display:flex;flex-direction:column-reverse;gap:.1rem}
  .tb-fact dt{font-size:.74rem;color:var(--on-navy-mute);letter-spacing:.02em}
  .tb-fact dd{font-family:var(--font-display);font-weight:600;font-size:1.02rem;color:#fff}
  .tb-verdict__cta{margin-top:1.5rem}
  .tb-verdict__cta .tb-cta{background:var(--azure)}
  .tb-verdict__cta .tb-cta:hover{background:#1c5be0}
  .tb-micro{font-size:.78rem;color:var(--on-navy-mute);margin:.6rem 0 0;line-height:1.5}
  .tb-micro a{color:#fff}

  /* ---- generic surface card ---- */
  .tb-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
    padding:1.2rem 1.25rem;box-shadow:var(--shadow-sm)}
  .tb-card--panel{background:var(--panel);border-color:var(--line)}
  .tb-card--tint{background:var(--tint);border-color:#cfe0fb}

  /* ---- labelled blocks (tldr / takeaways) ---- */
  .tb-note{border-left:4px solid var(--brand);background:var(--panel);
    border-radius:0 var(--r) var(--r) 0;padding:1.1rem 1.25rem}
  .tb-note__label{font-family:var(--font-display);font-size:.72rem;letter-spacing:.15em;
    text-transform:uppercase;color:var(--brand);font-weight:700;margin-bottom:.45rem}
  .tb-note p:last-child{margin-bottom:0}
  .tb-keylist{display:grid;gap:.7rem}
  .tb-keylist li{position:relative;padding-left:1.7rem;color:var(--ink-soft)}
  .tb-keylist li::before{content:"";position:absolute;left:0;top:.42em;width:11px;height:11px;
    border-radius:3px;background:var(--azure);box-shadow:0 0 0 4px var(--tint)}

  /* ---- price curiosity band (CRO) ---- */
  .tb-band{background:linear-gradient(135deg,#11365f,var(--brand));color:#fff;
    border-radius:var(--r-lg);padding:clamp(1.2rem,1rem + 1.4vw,1.8rem);
    display:flex;flex-wrap:wrap;gap:1rem 1.6rem;align-items:center;justify-content:space-between;
    box-shadow:var(--shadow)}
  .tb-band__txt{flex:1 1 320px}
  .tb-band__txt h2{color:#fff;margin-bottom:.3rem;font-size:1.4rem}
  .tb-band__txt p{color:#dbe6fb;margin:0;font-size:.96rem}
  .tb-band__act{flex:none;text-align:center}
  .tb-band .tb-cta{background:#fff;color:var(--brand-strong)}
  .tb-band .tb-cta:hover{background:#eaf1fe;color:var(--brand-strong)}
  .tb-band__act small{display:block;color:#cdddf7;margin-top:.5rem;font-size:.74rem}

  /* ---- pros / cons ---- */
  .tb-pc{border-radius:var(--r);padding:1.2rem 1.25rem;border:1px solid var(--line)}
  .tb-pc--pro{background:var(--good-bg);border-color:#bfe3cc}
  .tb-pc--con{background:var(--warn-bg);border-color:#f0d8af}
  .tb-pc h3{display:flex;align-items:center;gap:.5rem;font-size:1.05rem}
  .tb-pc--pro h3{color:#11633a}
  .tb-pc--con h3{color:#8a4209}
  .tb-pc__list li{position:relative;padding-left:1.6rem;margin-top:.6rem;color:var(--ink-soft);
    font-size:.97rem}
  .tb-pc__icon{position:absolute;left:0;top:.15em;font-weight:700;font-family:var(--font-display)}
  .tb-pc--pro .tb-pc__icon{color:var(--good)}
  .tb-pc--con .tb-pc__icon{color:var(--warn)}

  /* ---- criteria bars (custom-property gauges) ---- */
  .tb-scorecard{display:grid;gap:1rem}
  @media(min-width:680px){.tb-scorecard{grid-template-columns:1fr 1fr;gap:1rem 2rem}}
  .tb-meter__top{display:flex;justify-content:space-between;align-items:baseline;
    gap:.5rem;margin-bottom:.35rem}
  .tb-meter__name{font-weight:600;font-size:.95rem}
  .tb-meter__val{font-family:var(--font-display);font-weight:700;color:var(--brand);
    font-feature-settings:"tnum" 1}
  .tb-meter__track{height:9px;border-radius:var(--r-pill);background:var(--panel-2);overflow:hidden}
  .tb-meter__fill{height:100%;width:calc(var(--val,80) * 1%);border-radius:var(--r-pill);
    background:linear-gradient(90deg,var(--azure),var(--brand))}

  /* ---- tables ---- */
  .tb-tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);
    box-shadow:var(--shadow-sm)}
  .tb-table{font-size:.95rem;min-width:480px}
  .tb-table caption{text-align:left;font-size:.8rem;color:var(--slate);padding:.7rem .9rem;
    background:var(--panel)}
  .tb-table th,.tb-table td{padding:.7rem .9rem;border-bottom:1px solid var(--line);
    vertical-align:top}
  .tb-table thead th{background:var(--navy);color:#fff;font-family:var(--font-display);
    font-size:.82rem;letter-spacing:.03em;font-weight:600;border-bottom:0}
  .tb-table tbody tr:nth-child(even){background:var(--panel)}
  .tb-table tbody th{font-weight:700}
  .tb-table .is-best{color:var(--brand);font-weight:700}
  .tb-pricecell{font-family:var(--font-display);font-weight:700}

  /* ---- snapshot stat grid ---- */
  .tb-snap{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);
    padding:clamp(1.2rem,1rem + 1.2vw,1.7rem)}
  .tb-snap__grid{display:grid;gap:1rem;grid-template-columns:repeat(2,1fr)}
  @media(min-width:760px){.tb-snap__grid{grid-template-columns:repeat(4,1fr)}}
  .tb-stat{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
    padding:1rem;text-align:center}
  .tb-stat__num{font-family:var(--font-display);font-weight:700;font-size:1.8rem;color:var(--brand);
    line-height:1;font-feature-settings:"tnum" 1}
  .tb-stat__lab{display:block;font-size:.78rem;color:var(--slate);margin-top:.4rem;line-height:1.35}

  /* ---- star distribution ---- */
  .tb-dist{display:grid;gap:.5rem}
  .tb-dist__row{display:grid;grid-template-columns:54px 1fr 46px;gap:.7rem;align-items:center}
  .tb-dist__k{font-size:.86rem;color:var(--slate);font-weight:600}
  .tb-dist__track{height:11px;border-radius:var(--r-pill);background:var(--panel-2);overflow:hidden}
  .tb-dist__fill{height:100%;width:calc(var(--val,0)*1%);background:var(--star);border-radius:var(--r-pill)}
  .tb-dist__p{font-family:var(--font-display);font-weight:600;font-size:.86rem;text-align:right;
    font-feature-settings:"tnum" 1}

  /* ---- theme frequency bars ---- */
  .tb-themes{display:grid;gap:.85rem}
  .tb-theme__top{display:flex;justify-content:space-between;gap:.6rem;margin-bottom:.3rem}
  .tb-theme__name{font-size:.93rem;font-weight:600}
  .tb-theme__p{font-family:var(--font-display);font-weight:700;font-feature-settings:"tnum" 1}
  .tb-theme__track{height:8px;border-radius:var(--r-pill);background:var(--panel-2);overflow:hidden}
  .tb-theme__fill{height:100%;width:calc(var(--val,0)*1%);border-radius:var(--r-pill);
    background:linear-gradient(90deg,var(--azure),var(--brand))}
  .tb-theme--neg .tb-theme__fill{background:linear-gradient(90deg,#e3a04a,var(--warn))}
  .tb-theme--neg .tb-theme__p{color:var(--warn)}

  /* ---- testimonials ---- */
  .tb-reviews{display:grid;gap:1.1rem}
  @media(min-width:720px){.tb-reviews{grid-template-columns:1fr 1fr}}
  .tb-quote{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
    padding:1.15rem 1.2rem;box-shadow:var(--shadow-sm)}
  .tb-quote__head{display:flex;align-items:center;gap:.7rem;margin-bottom:.6rem}
  .tb-avatar{width:42px;height:42px;border-radius:50%;flex:none;display:grid;place-items:center;
    font-family:var(--font-display);font-weight:700;color:#fff;background:var(--brand);font-size:.95rem}
  .tb-avatar.is-alt{background:var(--navy)}
  .tb-quote__who{font-weight:700;font-size:.92rem;line-height:1.2}
  .tb-quote__meta{font-size:.76rem;color:var(--slate)}
  .tb-quote .tb-stars{font-size:.85rem;margin-bottom:.4rem}
  .tb-quote p{font-size:.95rem;margin:0;color:var(--ink-soft)}
  .tb-vbadge{display:inline-flex;align-items:center;gap:.3rem;font-size:.68rem;font-weight:700;
    letter-spacing:.04em;text-transform:uppercase;color:var(--good);background:var(--good-bg);
    padding:.18rem .5rem;border-radius:var(--r-pill);margin-left:auto}
  .tb-critical{background:var(--warn-bg);border:1px solid #f0d8af;border-radius:var(--r);
    padding:1.1rem 1.2rem;margin-top:1.1rem}
  .tb-critical h3{color:#8a4209}

  /* ---- review form ---- */
  .tb-form{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);
    padding:clamp(1.2rem,1rem + 1.2vw,1.8rem);box-shadow:var(--shadow)}
  .tb-field{margin-bottom:1rem}
  .tb-field label{display:block;font-weight:600;font-size:.9rem;margin-bottom:.35rem}
  .tb-field .tb-req{color:var(--bad)}
  .tb-input,.tb-textarea,.tb-select{width:100%;border:1.5px solid var(--line-2);border-radius:var(--r-sm);
    padding:.7rem .8rem;background:var(--paper);font-size:1rem;min-height:46px}
  .tb-textarea{min-height:120px;resize:vertical;line-height:1.55}
  .tb-input:focus,.tb-textarea:focus,.tb-select:focus{border-color:var(--brand);outline:none;
    box-shadow:0 0 0 3px var(--tint)}
  .tb-hint{font-size:.78rem;color:var(--slate);margin-top:.3rem}
  .tb-2col{display:grid;gap:0 1rem}
  @media(min-width:560px){.tb-2col{grid-template-columns:1fr 1fr}}
  .tb-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

  /* star input widget */
  .tb-starpick{display:inline-flex;flex-direction:row-reverse;gap:.15rem}
  .tb-starpick input{position:absolute;opacity:0;width:1px;height:1px}
  .tb-starpick label{margin:0;cursor:pointer;font-size:1.9rem;line-height:1;color:var(--line-2);
    padding:.1rem;min-width:44px;min-height:44px;display:inline-grid;place-items:center}
  .tb-starpick label:hover,.tb-starpick label:hover ~ label,
  .tb-starpick input:checked ~ label{color:var(--star)}
  .tb-starpick input:focus-visible + label{outline:3px solid var(--azure);outline-offset:2px}

  .tb-check{display:flex;gap:.6rem;align-items:flex-start;font-size:.9rem;color:var(--ink-soft)}
  .tb-check input{margin-top:.25rem;width:20px;height:20px;flex:none;accent-color:var(--brand)}

  .tb-formnote{font-size:.8rem;color:var(--slate);margin-top:.9rem;line-height:1.55}
  .tb-success{display:none;background:var(--good-bg);border:1px solid #bfe3cc;border-radius:var(--r);
    padding:1.1rem 1.2rem;color:#11633a}
  .tb-success.is-on{display:block}
  .tb-success h3{color:#11633a;margin-bottom:.3rem}

  /* ---- faq ---- */
  .tb-faq{display:grid;gap:.7rem}
  .tb-faq details{border:1px solid var(--line);border-radius:var(--r);background:var(--paper);
    overflow:hidden}
  .tb-faq summary{cursor:pointer;list-style:none;padding:1rem 1.15rem;font-family:var(--font-display);
    font-weight:600;font-size:1.02rem;display:flex;justify-content:space-between;gap:1rem;align-items:center}
  .tb-faq summary::-webkit-details-marker{display:none}
  .tb-faq summary::after{content:"+";font-size:1.4rem;color:var(--brand);flex:none;line-height:1}
  .tb-faq details[open] summary::after{content:"\2013"}
  .tb-faq__body{padding:0 1.15rem 1.1rem}
  .tb-faq__body p:last-child{margin-bottom:0}

  /* ---- mobile sticky cta ---- */
  .tb-sticky{position:fixed;left:0;right:0;bottom:0;z-index:95;display:none;
    background:var(--navy);color:#fff;border-top:1px solid #28354c;
    padding:.5rem .8rem env(safe-area-inset-bottom);align-items:center;gap:.7rem;
    box-shadow:0 -8px 24px rgba(15,27,46,.22)}
  .tb-sticky.is-on{display:flex}
  .tb-sticky__txt{flex:1;min-width:0;font-size:.78rem;line-height:1.25;color:var(--on-navy)}
  .tb-sticky__txt b{display:block;font-family:var(--font-display);color:#fff;font-size:.9rem}
  .tb-sticky .tb-cta{flex:none;background:var(--azure)}
  .tb-sticky__x{flex:none;width:34px;height:34px;border-radius:50%;border:1px solid #2c3b54;
    background:transparent;color:var(--on-navy-mute);cursor:pointer;font-size:1rem;line-height:1}
  @media(min-width:920px){.tb-sticky{display:none !important}}

  /* ---- footer ---- */
  .tb-footer{background:var(--navy);color:var(--on-navy-mute);margin-top:2rem;
    padding-block:2.4rem 1.6rem;font-size:.9rem}
  .tb-footer__grid{display:grid;gap:1.6rem}
  @media(min-width:760px){.tb-footer__grid{grid-template-columns:1.6fr 1fr 1fr}}
  .tb-footer h3{color:#fff;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;
    margin-bottom:.8rem}
  .tb-footer a{color:var(--on-navy-mute);text-decoration:none}
  .tb-footer a:hover{color:#fff;text-decoration:underline}
  .tb-footer__links li{margin-bottom:.5rem}
  .tb-footer__brand .tb-brand__name{color:#fff}
  .tb-footer__brand p{color:var(--on-navy-mute);font-size:.88rem;margin:.7rem 0 0}
  .tb-disc{border-top:1px solid #25324a;margin-top:1.8rem;padding-top:1.3rem;font-size:.8rem;
    line-height:1.6;color:var(--on-navy-mute)}
  .tb-disc strong{color:#c9d6ec}
  .tb-disc p{margin-bottom:.7rem}
  .tb-copy{margin-top:1rem;font-size:.8rem;color:#7e8eaa}

  /* ---- article prose helpers ---- */
  .tb-prose h2{margin-top:.4rem}
  .tb-prose h3{margin-top:1.4rem;color:var(--ink)}
  .tb-prose ul:not([class]){display:grid;gap:.5rem;margin:0 0 1rem}
  .tb-prose ul:not([class]) li{position:relative;padding-left:1.5rem;color:var(--ink-soft)}
  .tb-prose ul:not([class]) li::before{content:"";position:absolute;left:.1rem;top:.55em;
    width:7px;height:7px;border-radius:2px;background:var(--azure)}
  .tb-prose ol:not([class]){counter-reset:n;display:grid;gap:.6rem;margin:0 0 1rem}
  .tb-prose ol:not([class]) li{counter-increment:n;position:relative;padding-left:2.1rem;color:var(--ink-soft)}
  .tb-prose ol:not([class]) li::before{content:counter(n);position:absolute;left:0;top:0;
    width:1.5rem;height:1.5rem;border-radius:6px;background:var(--tint);color:var(--brand);
    font-family:var(--font-display);font-weight:700;font-size:.85rem;display:grid;place-items:center}

  /* section heading kicker */
  .tb-kicker{display:block;font-family:var(--font-display);font-size:.74rem;letter-spacing:.16em;
    text-transform:uppercase;color:var(--brand);font-weight:600;margin-bottom:.4rem}

  /* product figure */
  .tb-hero__media{display:flex;justify-content:center}
  .tb-bottle{max-width:330px;width:100%;height:auto;filter:drop-shadow(0 22px 30px rgba(15,27,46,.18))}
}

/* ====================== UTILITIES ========================= */
@layer utilities{
  .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}
  .u-center{text-align:center}
  .u-mt-0{margin-top:0}
  .u-mb-0{margin-bottom:0}
  .u-muted{color:var(--slate)}
  .u-narrow{max-width:62ch}
  .u-hero-grid{display:grid;gap:1.6rem}
  @media(min-width:880px){.u-hero-grid{grid-template-columns:1.05fr .95fr;align-items:center}}
  .u-hide{display:none}
  @media(prefers-reduced-motion:reduce){
    *{animation-duration:.001ms !important;transition-duration:.001ms !important}
  }
}