/* =====================================================================
   HEFT v3 components.css  (owned by the foundation builder)
   Every class here is documented in SPEC.md section 3.
   ===================================================================== */

/* ---------- C03 wordmark ---------- */
.wordmark{display:block;height:var(--wm-h,22px);width:auto;color:var(--ink)}
.wordmark__dot{fill:var(--cayenne)}
.on-dark .wordmark,.chapter-hero .wordmark{color:var(--on-dark)}
@media (min-width:1120px){.site-header .wordmark{--wm-h:26px}}

/* ---------- C05 buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:48px;padding:0 20px;border:1.5px solid transparent;border-radius:var(--r-1);font:650 1rem/1.1 var(--font-text);letter-spacing:.005em;text-decoration:none;text-align:center;cursor:pointer;transition:background-color var(--t-fast) var(--ease-out),color var(--t-fast) var(--ease-out),border-color var(--t-fast) var(--ease-out)}
.btn--primary{background:var(--cayenne);color:#fff}
.btn--primary:hover{background:#86350B}
.btn--secondary{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn--secondary:hover{background:var(--ink);color:var(--paper)}
.btn--on-dark{background:var(--paper);color:var(--ink)}
.btn--on-dark:hover{background:#fff}
.btn--sm{min-height:40px;padding:0 14px;font-size:.9375rem}
.btn--block{width:100%}
.btn[hidden]{display:none}
.btn[aria-busy="true"]{opacity:.7;cursor:progress}
.btn[disabled]{cursor:not-allowed}

/* ---------- C04 site header + nav ---------- */
.site-header{position:relative;z-index:20}
.site-header__inner{display:flex;align-items:center;gap:var(--s-4);min-height:56px}
.site-header__home{display:flex;align-items:center;min-height:40px;padding:var(--s-2) 0;margin-right:auto;text-decoration:none}
.site-header__status{display:none;color:var(--muted)}
.site-nav__toggle{min-height:40px;padding:0 var(--s-2);background:none;border:0;font:600 .9375rem/1 var(--font-text);cursor:pointer;text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:.3em}
.site-nav__list{display:none;margin:0}
.site-nav__list a{text-decoration:none;font-weight:600;font-size:.9375rem}
.site-nav__list a:hover,.site-nav__list a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--cayenne);text-decoration-thickness:2px}
html.js .site-nav.is-open .site-nav__list{display:grid;position:absolute;left:0;right:0;top:100%;background:var(--paper);border-top:1px solid var(--rule);border-bottom:8px solid var(--ink);padding:var(--s-2) var(--gutter) var(--s-4)}
html.js .site-nav.is-open .site-nav__list a{display:block;padding:var(--s-3) 0;border-bottom:1px solid var(--rule);font-size:var(--fs-body)}
html:not(.js) .site-nav__toggle{display:none}
html:not(.js) .site-nav__list{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-4)}
/* no JS below 1120px: the nav takes its own row under the wordmark and Join */
@media (max-width:1119px){html:not(.js) .site-header__inner{flex-wrap:wrap;row-gap:0}html:not(.js) .site-nav{order:3;flex-basis:100%;padding-bottom:var(--s-2)}html:not(.js) .site-nav__list a{display:inline-block;padding:var(--s-1) 0}}
.chapter-page .site-header{background:var(--chapter);color:var(--on-dark)}
.chapter-page .site-header :is(.site-nav__toggle,.site-header__status,.wordmark){color:var(--on-dark)}
.chapter-page .site-header :focus-visible{outline-color:var(--on-dark)}
body[data-hero-form] .site-header__join{background:transparent;color:var(--ink);border-color:var(--ink)}
body[data-hero-form] .site-header__join:hover{background:var(--ink);color:var(--paper)}
.chapter-page .site-header .btn--primary{background:var(--paper);color:var(--chapter)}
.chapter-page .site-header .btn--primary:hover{background:#fff}
.chapter-page[data-hero-form] .site-header__join{background:transparent;color:var(--on-dark);border-color:var(--on-dark)}
.chapter-page[data-hero-form] .site-header__join:hover{background:var(--on-dark);color:var(--chapter)}
@media (max-width:1119px){html.js .chapter-page .site-nav.is-open .site-nav__list{background:var(--chapter);border-top-color:var(--rule-on-dark)}html.js .chapter-page .site-nav.is-open .site-nav__list a{color:var(--on-dark);border-bottom-color:var(--rule-on-dark)}}
@media (min-width:768px){
  .site-header__inner{min-height:64px;gap:var(--s-6)}
  .site-header__status{display:block}
}
@media (min-width:1120px){
  .site-nav__toggle{display:none}
  .site-nav__list,html.js .site-nav.is-open .site-nav__list{display:flex;position:static;gap:var(--s-5);padding:0;border:0;background:none}
  html.js .site-nav.is-open .site-nav__list a{display:inline;padding:0;border:0;font-size:.9375rem}
  .chapter-page .site-nav__list a{color:var(--on-dark)}
}

/* ---------- C07 panel: the one structural primitive ---------- */
.panel{position:relative;background:var(--card);padding:calc(var(--s-4) + 8px) var(--s-4) var(--s-5);border-bottom:1px solid var(--ink)}
.panel::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:var(--ink);transform-origin:0 50%}
.panel__nature{font-size:var(--fs-micro);line-height:1.4;color:var(--muted);padding-bottom:var(--s-2);margin-bottom:var(--s-4);border-bottom:1px solid var(--rule);max-width:none}
.panel__kicker{margin-bottom:var(--s-3);color:var(--muted)}
:where(.panel>ul:not([class]),.panel>ol:not([class])){padding-left:1.25em;display:grid;gap:var(--s-2)}
@media (min-width:768px){.panel{padding:calc(var(--s-5) + 8px) var(--s-6) var(--s-6)}}
@media (prefers-reduced-motion:no-preference){
  .panel.is-armed:not(.is-in)::before{transform:scaleX(0)}
  .panel.is-armed::before{transition:transform var(--t-rule) var(--ease-out)}
}

/* ---------- C08 declaration (hero) ---------- */
.declaration{padding-block:var(--s-2) var(--s-7)}
.declaration__grid{display:grid;gap:var(--s-7);align-items:center}
.declaration__title{font-size:var(--fs-h1);margin-bottom:var(--s-3)}
.declaration__title [data-hook-variant]:not([data-hook-variant="default"]){display:none}
html[data-hook] .declaration__title [data-hook-variant="default"]{display:none}
html[data-hook="creatine"] .declaration__title [data-hook-variant="creatine"],
html[data-hook="shaker"] .declaration__title [data-hook-variant="shaker"],
html[data-hook="vitd"] .declaration__title [data-hook-variant="vitd"]{display:inline}
/* long H1s (60+ characters): pass .declaration__title--long so the hero form stays above a 900px fold on desktop */
@media (min-width:1120px){.declaration__title--long{font-size:clamp(3.5rem,1rem + 3.6vw,4.75rem)}}
.declaration__lede{font-size:var(--fs-body);line-height:1.45;margin-bottom:var(--s-4);max-width:36ch}
.declaration__lede-more{display:none}
.declaration .declaration__object{display:none}
@media (max-width:767px){
  .declaration .panel__nature{display:none}
  .declaration{padding-top:var(--s-1)}
  .declaration .panel__kicker{margin-bottom:var(--s-2)}
  .declaration__title{margin-bottom:var(--s-2)}
  .declaration__lede,.declaration .dose-strip,.declaration .price-label{margin-bottom:var(--s-3)}
  .declaration .dose-strip__cell{padding-bottom:var(--s-2)}
  .declaration .price-label__row{padding:6px 0}
}
@media (min-width:768px){.declaration__lede{font-size:var(--fs-lede)}.declaration__lede-more{display:inline}}
@media (min-width:1120px){
  .declaration{padding-block:var(--s-6) var(--s-9)}
  .declaration__grid{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
  .declaration__panel{grid-column:1 / span 7}
  .declaration .declaration__object{display:grid;justify-items:center;gap:var(--s-4);grid-column:9 / span 4}
}

/* ---------- C09 dose strip ---------- */
.dose-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 var(--s-4);border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.dose-strip__cell{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:2px;padding:var(--s-2) var(--s-2) var(--s-3);border-left:1px solid var(--rule);min-width:0;contain:layout}
.dose-strip__cell:first-child{border-left:0;padding-left:0}
.dose-strip__value{font-family:var(--font-display);font-weight:var(--w-numeral-m);font-size:var(--fs-num-m);line-height:1;letter-spacing:-.03em;white-space:nowrap;margin:0}
.dose-strip__label{font-size:var(--fs-micro);line-height:1.25;color:var(--muted)}
@media (max-width:399px){.dose-strip__cell{padding-inline:6px}.dose-strip__cell:last-child{padding-right:0}.dose-strip__value{font-size:clamp(1.25rem,6.6vw,1.75rem)}}
.chapter-hero .dose-strip{border-top-color:var(--on-dark);border-bottom-color:var(--rule-on-dark)}
.chapter-hero .dose-strip__cell{border-left-color:var(--rule-on-dark)}
.chapter-hero .dose-strip__label{color:var(--on-dark)}
@media (prefers-reduced-motion:no-preference){
  .declaration .dose-strip__value,.chapter-hero .dose-strip__value{animation:weight-in var(--t-weight) var(--ease-out) 400ms both}
}
@keyframes weight-in{from{font-weight:220}to{font-weight:var(--w-numeral-m)}}

/* ---------- C10 price label ---------- */
.price-label{margin:0 0 var(--s-4);font-size:var(--fs-small);line-height:1.35}
.price-label__row{display:grid;grid-template-columns:6.75em minmax(0,1fr);gap:var(--s-2);padding:var(--s-2) 0;border-bottom:1px solid var(--rule)}
.price-label__row dt{color:var(--muted)}
.price-label__row dd{margin:0;font-variant-numeric:tabular-nums lining-nums}
.price-label__row--founder dd{font-weight:650}
.price-label--large{font-size:var(--fs-body)}
.price-label--large .price-label__row{grid-template-columns:8.5em minmax(0,1fr);padding:var(--s-3) 0}
.price-label__big{display:block;font:var(--w-numeral) var(--fs-num-l)/1 var(--font-display);letter-spacing:-.04em;margin-bottom:var(--s-1)}
.chapter-hero .price-label__row{border-bottom-color:var(--rule-on-dark)}
.chapter-hero .price-label__row dt{color:var(--on-dark)}

/* ---------- C11 join form (waitlist + notify) ---------- */
.join{display:grid;gap:var(--s-2);position:relative}
.join__row{display:grid;gap:var(--s-2)}
.join__label{font-size:var(--fs-micro);font-weight:600;letter-spacing:.02em}
.join__input{width:100%;min-height:48px;padding:0 var(--s-3);background:#fff;color:var(--ink);border:1.5px solid var(--ink);border-radius:var(--r-1);font-size:1rem}
.join__input::placeholder{color:var(--muted);opacity:1}
.join__input[aria-invalid="true"]{border-color:var(--cayenne);box-shadow:inset 0 0 0 1px var(--cayenne)}
.join__also{display:flex;gap:var(--s-2);align-items:flex-start;font-size:var(--fs-small);line-height:1.4}
.join__also input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--ink);flex:none}
.join__consent{max-width:none}
.join__hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.join__error{color:var(--cayenne);font-weight:600;font-size:var(--fs-small);max-width:none}
.join__error:empty{display:none}
.join.is-done .join__row,.join.is-done .join__also,.join.is-done .join__consent{display:none}
.join__result:empty{display:none}
.join__result:focus{outline:none}
.chapter-hero .join__label,.on-dark .join__label{color:var(--on-dark)}
.chapter-hero .join__input,.on-dark .join__input{border-color:var(--on-dark)}
.chapter-hero .join__error,.on-dark .join__error{color:var(--on-dark)}
.chapter-hero .join__also input{accent-color:var(--paper)}
@media (min-width:768px){
  .join__row{grid-template-columns:minmax(0,1fr) auto;align-items:end}
  .join__label{grid-column:1 / -1}
}

/* ---------- C12 join result: stamp card, share, ladder, survey ---------- */
.stamp-card{position:relative;background:var(--card);color:var(--ink);padding:calc(var(--s-4) + 8px) var(--s-4) var(--s-4);border-bottom:1px solid var(--ink);display:grid;gap:var(--s-3);overflow-x:clip}
.stamp-card::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:var(--ink)}
.stamp-card__title{font:600 var(--fs-small)/1.3 var(--font-text);letter-spacing:0;margin:0}
.stamp-card__no{display:block;font:var(--w-numeral) var(--fs-num-l)/.95 var(--font-display);letter-spacing:-.04em;color:var(--cayenne);font-variant-numeric:tabular-nums lining-nums}
.stamp-card__state{font-size:var(--fs-small);max-width:44ch}
.stamp-card__list{display:block;margin-top:var(--s-2);font:600 var(--fs-small)/1.3 var(--font-text);letter-spacing:0;color:var(--ink)}
.chapter-hero .stamp-card :is(.fine,.muted){color:var(--muted)}
.chapter-hero .stamp-card a{text-decoration-color:var(--cayenne)}
.chapter-hero .stamp-card :focus-visible{outline-color:var(--ink)}
@keyframes stamp-in{0%{opacity:0;transform:scale(1.25) rotate(-3deg)}55%{opacity:1}100%{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){.stamp-card.is-new .stamp-card__no{animation:stamp-in var(--t-stamp) var(--ease-stamp) both;transform-origin:0 75%}}
.share{display:grid;gap:var(--s-2);padding-top:var(--s-3);border-top:1px solid var(--rule)}
.share__label{font-size:var(--fs-micro);font-weight:600}
.share__row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s-2)}
@media (max-width:479px){.share__row{grid-template-columns:minmax(0,1fr)}.share__row>.btn{justify-self:start}}
.share__url{min-height:40px;padding:0 var(--s-2);border:1.5px solid var(--ink);border-radius:var(--r-1);background:#fff;font:500 .9375rem/1 var(--font-text);color:var(--ink);min-width:0}
@media (max-width:359px){.share__url{font-size:.8125rem;padding:0 6px}}
.share__buttons{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.share__hint{font-size:var(--fs-small);color:var(--muted);max-width:52ch}
.ladder{width:100%;border-collapse:collapse;font-size:var(--fs-small);background:var(--card)}
.ladder th,.ladder td{padding:var(--s-2);border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
.ladder thead th{font-size:var(--fs-micro);color:var(--muted);font-weight:600;border-top:8px solid var(--ink);border-bottom:1px solid var(--ink)}
.ladder .c-status{width:2.5em;text-align:center}
.survey{display:grid;gap:var(--s-5)}
.survey__q{border:0;margin:0;padding:0;display:grid;gap:var(--s-2);min-width:0}
.survey__q legend{font-weight:650;margin-bottom:var(--s-2);padding:0}
.chips{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.chip span{display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border:1.5px solid var(--ink);border-radius:var(--r-1);font-size:.9375rem;background:#fff}
.chip input:checked+span{background:var(--ink);color:var(--paper)}
.chip input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}
.survey__saved{font-size:var(--fs-micro);color:var(--muted);min-height:1.2em}

/* ---------- C13 status marks + legend ---------- */
.mark{display:inline-block;width:.72em;height:.72em;border:1.5px solid currentColor;border-radius:50%;vertical-align:-.04em;flex:none}
.mark--lab{background:currentColor}
.mark--progress{background:linear-gradient(90deg,currentColor 50%,transparent 50%)}
.legend{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);font-size:var(--fs-small);line-height:1.4;padding:var(--s-3) 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.legend__item{display:flex;gap:var(--s-2);align-items:baseline}
.legend__note{flex-basis:100%;color:var(--muted);max-width:none}

/* ---------- C14 section head ---------- */
.section-head{display:grid;gap:var(--s-3);margin-bottom:var(--s-6);max-width:52rem}
.section-head__num{font:var(--w-numeral-m) 1.25rem/1 var(--font-display);color:var(--muted);letter-spacing:0}
.section-head__kicker{color:var(--muted)}
.section-head__lede{max-width:46ch}
.on-dark .section-head__num,.on-dark .section-head__kicker{color:var(--on-dark-muted)}

/* ---------- C15 dose table + mini glass ---------- */
.dose-table{width:100%;border-collapse:collapse;background:var(--card);font-size:var(--fs-small);line-height:1.4}
.dose-table caption{text-align:left;padding-bottom:var(--s-2);font-size:var(--fs-micro);color:var(--muted)}
.dose-table thead th{font-size:var(--fs-micro);font-weight:600;color:var(--muted);text-align:left;padding:var(--s-2);border-top:8px solid var(--ink);border-bottom:1px solid var(--ink);vertical-align:bottom}
.dose-table tbody th,.dose-table tbody td{padding:var(--s-3) var(--s-2);border-bottom:1px solid var(--rule);text-align:left;vertical-align:top;font-weight:400}
.dose-table tbody tr:last-child>*{border-bottom:1px solid var(--ink)}
.dose-table .c-amount{text-align:right;white-space:nowrap}
.dose-table .c-nrv{text-align:right;white-space:nowrap;color:var(--muted)}
.dose-table .c-status{width:1.75em;text-align:center}
.dose-table tbody .c-amount{font:var(--w-numeral-m) 1.25rem/1.1 var(--font-display);letter-spacing:-.02em}
.dose-table .sub{display:block;font:500 .6875rem/1.25 var(--font-text);letter-spacing:.01em;color:var(--muted)}
.dose-table .second{display:block;margin-top:var(--s-2)}
.dose-table__name{display:flex;gap:var(--s-2);align-items:flex-start;font-weight:650}
.dose-table__note{display:block;margin-top:var(--s-1);font-size:.8125rem;line-height:1.45;color:var(--muted);font-weight:400}
.dose-table__claim{display:block;margin-top:var(--s-1);font-size:.8125rem;line-height:1.45;color:var(--ink);font-weight:400}
.dose-table__claim b{font-weight:650}
.dose-table tbody tr.is-active>*{background:#F6EFE6}
.dose-table tbody tr.is-active .c-amount{color:var(--cayenne)}
/* narrow phones: the four columns must fit 288px without horizontal scroll */
@media (max-width:479px){.dose-table thead th,.dose-table tbody th,.dose-table tbody td{padding-inline:4px}.dose-table tbody .c-amount{font-size:1.125rem}.dose-table .c-nrv,.dose-table thead th,.dose-table thead .c-amount,.dose-table .c-amount .sub{white-space:normal}.dose-table__name{gap:6px}}
/* 320px reflow: five-column tables (the /label nutrition table) shrink type and hyphenate row names */
@media (max-width:359px){.dose-table{font-size:.8125rem}.dose-table tbody .c-amount{font-size:1rem}.dose-table tbody th{hyphens:auto;-webkit-hyphens:auto}}
.mini-glass{width:18px;height:26px;flex:none;margin-top:1px;overflow:visible}
.mini-glass__out{fill:none;stroke:var(--ink);stroke-width:1.5;stroke-linejoin:round}
.mini-glass__band{fill:var(--cayenne)}

/* ---------- C16 figure 1: the graduated glass ---------- */
.fig1{display:grid;gap:var(--s-3);justify-items:start;margin:0}
.fig1__stage{display:grid;grid-template-columns:var(--fig1-w,min(50vw,200px)) minmax(8.5em,1fr);column-gap:var(--s-3);align-items:stretch}
.fig1__svg{width:100%;height:auto;aspect-ratio:120 / 160;overflow:visible}
.fig1__labels{position:relative;margin:0;padding:0;list-style:none}
.fig1__label{position:absolute;left:0;top:calc(var(--y) / 160 * 100%);transform:translateY(-50%);font-size:.8125rem;line-height:1.15;white-space:nowrap}
.fig1__label b{display:block;font:var(--w-numeral-m) 1.125rem/1 var(--font-display);letter-spacing:-.02em}
.fig1__label.is-active b{color:var(--cayenne)}
.fig1 figcaption{font-size:var(--fs-micro);color:var(--muted);max-width:40ch}
.fig1__outline{fill:none;stroke:var(--ink);stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.fig1__steam,.fig1__spoon{fill:none;stroke:var(--ink);stroke-width:1.1;stroke-linecap:round;opacity:.75}
.fig1__lines{fill:none;stroke:var(--ink);stroke-width:.55;opacity:.9}
.fig1__ticks{fill:none;stroke:var(--ink);stroke-width:.7}
.fig1__layer{transform-box:fill-box;transform-origin:50% 100%}
.fig1__layer[data-layer="1"]{fill:url(#p-min)}
.fig1__layer[data-layer="2"]{fill:url(#p-bvit)}
.fig1__layer[data-layer="3"]{fill:url(#p-vitd)}
.fig1__layer[data-layer="4"]{fill:url(#p-crea)}
.fig1__layer[data-layer="5"]{fill:url(#p-whey)}
.fig1__layer[data-layer="6"]{fill:var(--fig1-top,var(--ink))}
.fig1__layer.is-active[data-layer="1"]{fill:url(#p-min-a)}
.fig1__layer.is-active[data-layer="2"]{fill:url(#p-bvit-a)}
.fig1__layer.is-active[data-layer="3"]{fill:url(#p-vitd-a)}
.fig1__layer.is-active[data-layer="4"]{fill:url(#p-crea-a)}
.fig1__layer.is-active[data-layer="5"]{fill:url(#p-whey-a)}
.fig1__layer.is-active[data-layer="6"]{fill:var(--cayenne)}
.fig1--matcha{--fig1-top:var(--leaf)}
.fig1--decaf{--fig1-top:var(--slate)}
.fig1--empty :is(.fig1__layer,.fig1__lines){display:none}
/* phones: number and name share one line so labels fit the 18-unit layer spacing; the label column may shrink */
@media (max-width:767px){.fig1{--fig1-w:clamp(112px,64vw - 92px,200px)}.fig1__stage{grid-template-columns:var(--fig1-w) minmax(0,1fr);justify-self:stretch}.fig1__label{font-size:.75rem;line-height:1.15;white-space:normal;max-width:100%}.fig1__label b{display:inline;font-size:.9375rem;margin-right:.3em}}
@media (min-width:768px){.fig1{--fig1-w:240px}}
@media (min-width:1120px){.fig1{--fig1-w:300px}}
@media (prefers-reduced-motion:no-preference){
  .fig1.is-armed:not(.is-in) .fig1__layer{transform:scaleY(0)}
  .fig1.is-armed:not(.is-in) :is(.fig1__outline,.fig1__steam){stroke-dasharray:1;stroke-dashoffset:1}
  .fig1.is-armed.is-in :is(.fig1__outline,.fig1__steam){stroke-dasharray:1;animation:fig1-draw var(--t-draw) var(--ease-in-out) both}
  .fig1.is-armed.is-in .fig1__layer{animation:fig1-fill var(--t-layer) var(--ease-out) both;animation-delay:calc(var(--t-draw) * .6 + (var(--n) - 1) * 180ms)}
}
@keyframes fig1-fill{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes fig1-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}

/* ---------- C17 figure 2: 30.0g, accounted for ---------- */
.fig2{display:grid;margin:0}
.fig2__plate{padding:var(--s-5) 0;border-top:1px solid var(--rule)}
.fig2__plate:first-child{border-top:8px solid var(--ink)}
.fig2__mag{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-1) var(--s-3);margin-bottom:var(--s-3)}
.fig2__x{font:var(--w-numeral) var(--fs-num-m)/1 var(--font-display);letter-spacing:-.03em}
.fig2__range{font-size:var(--fs-small);color:var(--muted)}
.fig2__bar{display:flex;height:44px;background:var(--card);box-shadow:inset 0 0 0 1px var(--ink)}
.seg{flex:0 0 calc(var(--w) * 1%);min-width:2px;height:100%;border-right:1px solid var(--card);transform-origin:0 50%}
.seg--whey{background:radial-gradient(circle,var(--ink) .9px,transparent 1.3px) 0 0/5px 5px}
.seg--coffee{background:var(--ink)}
.seg--crea{background:repeating-linear-gradient(45deg,var(--ink) 0 1px,transparent 1px 5px)}
.seg--premix,.seg--mg,.seg--zn{background:repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 5px),repeating-linear-gradient(0deg,var(--ink) 0 1px,transparent 1px 5px)}
.seg--b6,.seg--b12{background:repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 4px)}
.seg--vitd{background:var(--cayenne)}
.seg--else{background:repeating-linear-gradient(-45deg,var(--rule-strong) 0 1px,transparent 1px 7px)}
.fig2__ruler{display:flex;justify-content:space-between;margin-top:var(--s-1);font-size:var(--fs-micro);color:var(--muted);font-variant-numeric:tabular-nums}
.fig2__legend{display:flex;flex-wrap:wrap;gap:var(--s-1) var(--s-4);margin-top:var(--s-3);font-size:.8125rem;list-style:none;padding:0}
.fig2__legend li{display:block}
.fig2__legend .sw{display:inline-block;width:14px;height:10px;box-shadow:inset 0 0 0 1px var(--ink);margin-right:6px;vertical-align:-1px}
.fig2__caption{margin-top:var(--s-3);font-size:var(--fs-small)}
.fig2__caption--big{font:var(--w-head) var(--fs-h3)/1.25 var(--font-display);letter-spacing:-.015em;max-width:30ch}
.fig2>figcaption{padding-top:var(--s-3);border-top:1px solid var(--ink);font-size:var(--fs-micro);color:var(--muted);max-width:60ch}
@media (prefers-reduced-motion:no-preference){
  .fig2__plate.is-armed:not(.is-in) .seg{transform:scaleX(0)}
  .fig2__plate.is-armed .seg{transition:transform 600ms var(--ease-out)}
}

/* ---------- C18 claims: claim, won't, band, promise ---------- */
.claims-band{background:var(--ink);color:var(--on-dark);padding-block:var(--section)}
.claims-band__cols{display:grid;gap:var(--s-7)}
.claims-band__h{font-size:var(--fs-h3);margin-bottom:var(--s-3)}
.claim{padding:var(--s-4) 0;border-top:1px solid var(--rule);margin:0}
.on-dark .claim{border-top-color:var(--rule-on-dark)}
.claim__text{font:420 var(--fs-h3)/1.3 var(--font-display);letter-spacing:-.01em;max-width:32ch;margin:0}
.claim__meta{margin-top:var(--s-2);color:var(--muted)}
.on-dark .claim__meta{color:var(--on-dark-muted)}
.claim__cond{margin-top:var(--s-2);font-size:var(--fs-small);max-width:60ch}
.wonts{list-style:none;padding:0;margin:0}
.wont{display:grid;gap:var(--s-1);padding:var(--s-3) 0;border-top:1px solid var(--rule)}
.on-dark .wont{border-top-color:var(--rule-on-dark)}
.wont__line{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s-1) var(--s-3)}
.wont__topic{font:500 1.125rem/1.3 var(--font-text);color:var(--muted);text-decoration-line:line-through;text-decoration-color:var(--cayenne);text-decoration-thickness:2px}
.on-dark .wont__topic{color:var(--on-dark-muted);text-decoration-color:var(--cayenne-lift)}
.wont__flag{color:var(--cayenne)}
.on-dark .wont__flag{color:var(--cayenne-lift)}
.wont__note{font-size:var(--fs-small);color:var(--muted)}
.on-dark .wont__note{color:var(--on-dark-muted)}
.promise{margin-top:var(--s-6);padding:var(--s-4);border:1.5px solid var(--ink);font-size:var(--fs-body);max-width:52ch}
.on-dark .promise{border-color:var(--rule-on-dark)}
@media (min-width:1120px){.claims-band__cols{grid-template-columns:1fr 1fr;column-gap:var(--s-9)}}

/* ---------- C19 corrections box ---------- */
.corrections{border:2px solid var(--ink);background:var(--card);padding:var(--s-4)}
.corrections__title{font:var(--w-head) var(--fs-h3)/1.2 var(--font-display);letter-spacing:-.015em;padding-bottom:var(--s-2);border-bottom:3px double var(--ink);margin-bottom:var(--s-3)}
.corrections__list{display:grid;list-style:none;padding:0;margin:0}
.corrections__item{padding:var(--s-3) 0;border-bottom:1px solid var(--rule);font-size:var(--fs-small)}
.corrections__item:last-child{border-bottom:0}
.corrections__was{display:block;color:var(--muted)}
@media (min-width:768px){.corrections{padding:var(--s-5) var(--s-6)}}

/* ---------- C20 timeline ---------- */
.timeline{list-style:none;padding:0;margin:0;border-top:8px solid var(--ink);background:var(--card)}
.timeline__item{display:grid;grid-template-columns:1.5em minmax(0,1fr) auto;gap:var(--s-2);align-items:baseline;padding:var(--s-3);border-bottom:1px solid var(--rule)}
.timeline__item:last-child{border-bottom:1px solid var(--ink)}
.timeline__date{font-size:var(--fs-micro);color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.timeline__item--done .timeline__label{font-weight:650}
.timeline__updated{margin-top:var(--s-2);font-size:var(--fs-micro);color:var(--muted)}

/* ---------- C21 cupping card (Blind Mug Test) ---------- */
.cupping{background:var(--card);border:1.5px solid var(--ink)}
.cupping__head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-3);flex-wrap:wrap;padding:var(--s-3) var(--s-4);border-bottom:3px double var(--ink)}
.cupping__title{font:var(--w-head) var(--fs-h3)/1.2 var(--font-display);letter-spacing:-.015em}
.cupping table{width:100%;border-collapse:collapse;font-size:var(--fs-small)}
.cupping th,.cupping td{padding:var(--s-3) var(--s-4);border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
.cupping thead th{font-size:var(--fs-micro);font-weight:600;color:var(--muted)}
.cupping tbody th{font-weight:600}
.cupping .box{display:inline-block;white-space:nowrap;min-width:5.5em;padding:4px 6px;border:1.5px dashed var(--rule-strong);font-size:var(--fs-micro);color:var(--muted);text-align:center}
.cupping__foot{padding:var(--s-3) var(--s-4);font-size:var(--fs-small)}

/* ---------- C22 scene placeholder (Fig. 3, not shot yet) ---------- */
.scene-pending{margin:0;display:grid;gap:var(--s-3)}
.scene-pending__frame{aspect-ratio:4 / 5;display:grid;place-items:center;align-content:center;gap:var(--s-3);padding:var(--s-5);border:2px dashed var(--rule-strong);background:var(--card);text-align:center}
.scene-pending__slate{font:600 var(--fs-micro)/1.3 var(--font-text);letter-spacing:var(--track-micro);text-transform:uppercase}
.scene-pending__frame .icon{width:72px;height:72px}
.scene-pending figcaption{font-size:var(--fs-small);max-width:52ch}
@media (min-width:768px){.scene-pending__frame{aspect-ratio:16 / 9}}

/* ---------- C23 batch stamp ---------- */
.batch-stamp{display:inline-block;padding:6px 10px;border:2px solid var(--ink);transform:rotate(-3deg);font:650 var(--fs-micro)/1.2 var(--font-text);letter-spacing:var(--track-micro);text-transform:uppercase}

/* ---------- C24 dot plot (cost per cup) ---------- */
.dotplot{margin:0;display:grid;gap:var(--s-2);--max:2}
.dotplot__track{position:relative;margin:var(--s-2) var(--s-2) 0}
.dotplot__row{position:relative;height:34px;border-bottom:1px solid var(--rule)}
.dotplot__dot{position:absolute;left:calc(var(--v) / var(--max) * 100%);top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--card);border:2px solid var(--ink)}
.dotplot__row--heft .dotplot__dot{background:var(--cayenne);border-color:var(--cayenne)}
.dotplot__label{position:absolute;left:calc(var(--v) / var(--max) * 100% + 12px);top:50%;transform:translateY(-50%);white-space:nowrap;font-size:.8125rem;line-height:1.2}
.dotplot__row--flip .dotplot__label{left:auto;right:calc(100% - var(--v) / var(--max) * 100% + 12px)}
.dotplot__axis{display:flex;justify-content:space-between;margin:0 var(--s-2);padding-top:var(--s-1);border-top:1.5px solid var(--ink);font-size:var(--fs-micro);color:var(--muted);font-variant-numeric:tabular-nums}
.dotplot figcaption{font-size:var(--fs-micro);color:var(--muted)}
@media (max-width:479px){
  .dotplot__row{height:38px}
  .dotplot__label{right:0;white-space:normal;font-size:.75rem;line-height:1.2}
  .dotplot__row--flip .dotplot__label{left:0;text-align:right}
}

/* ---------- C25 compare table + cards ---------- */
.compare-wrap{overflow-x:auto;border-top:8px solid var(--ink)}
.compare{width:100%;min-width:720px;border-collapse:collapse;background:var(--card);font-size:var(--fs-small)}
.compare th,.compare td{padding:var(--s-3) var(--s-2);border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
.compare thead th{font-weight:650;border-bottom:1px solid var(--ink);vertical-align:bottom}
.compare tbody th{font-weight:600;color:var(--muted);white-space:nowrap}
.compare .col-heft{background:#F6EFE6}
.compare .not-checked{color:var(--muted)}
.compare-cards{display:grid;gap:var(--s-4)}
.compare-card{background:var(--card);border-top:8px solid var(--ink);padding:var(--s-3) var(--s-4)}
.compare-card h3{font-size:var(--fs-h3);margin-bottom:var(--s-2)}
.compare-card dl{display:grid;grid-template-columns:8.5em minmax(0,1fr);margin:0;font-size:var(--fs-small)}
.compare-card dt,.compare-card dd{margin:0;padding:var(--s-2) 0;border-bottom:1px solid var(--rule)}
.compare-card dt{color:var(--muted);padding-right:var(--s-3)}
.compare-card .not-checked{color:var(--muted)}
@media (max-width:767px){.compare-wrap{display:none}}
@media (min-width:768px){.compare-cards{display:none}}

/* ---------- C26 pouch render ---------- */
.pouch-fig{display:grid;justify-items:center;gap:var(--s-3);margin:0}
.pouch-fig figcaption{font-size:var(--fs-micro);color:var(--muted);text-align:center;max-width:26ch}
.chapter-hero .pouch-fig figcaption{color:var(--on-dark)}
.pouch{--pouch-body:var(--ink);--pouch-print:var(--glass);container-type:inline-size;position:relative;width:clamp(220px,22vw,320px);aspect-ratio:300 / 440;border-radius:10px 10px 26px 26px;background:var(--pouch-body);color:var(--pouch-print);box-shadow:var(--shadow-object),inset 0 -14px 30px rgba(0,0,0,.1),inset 6px 0 18px rgba(255,255,255,.04);display:flex;flex-direction:column;align-items:center;padding:0 8.5% 7%;overflow:hidden}
.pouch--matcha{--pouch-body:#264429;--pouch-print:var(--paper)}
.pouch--decaf{--pouch-body:#2A394C;--pouch-print:var(--paper)}
.pouch__zip{align-self:stretch;margin:0 -10%;height:9%;display:grid;grid-template-rows:1fr auto}
.pouch__seal{border-bottom:1px dashed currentColor;opacity:.4}
.pouch__tab{border-bottom:1.5px solid currentColor;padding:1.6cqi 5cqi;font-size:2.4cqi;letter-spacing:.28em;text-transform:uppercase;opacity:.8}
.pouch__mark{margin-top:11cqi;display:grid;justify-items:center;gap:2.5cqi}
.pouch__mark .wordmark{height:12.5cqi;color:currentColor}
.pouch__kind{font-size:3.5cqi;letter-spacing:.42em;text-transform:uppercase;opacity:.85;margin:0 -.42em 0 0}
.pouch__flavour{font:780 5cqi/1 var(--font-display);letter-spacing:.12em;text-transform:uppercase;margin:0 -.12em 0 0}
.pouch__illo{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;width:100%;padding:3cqi 0}
.pouch__illo svg{height:100%;max-height:70cqi;width:auto;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;opacity:.88}
.pouch__doses{font-size:3.4cqi;letter-spacing:.06em;opacity:.9;white-space:nowrap;margin:0}
.pouch__base{align-self:stretch;display:flex;justify-content:space-between;margin-top:3.5cqi;padding-top:3cqi;border-top:1px solid currentColor;font-size:2.9cqi;letter-spacing:.1em;text-transform:uppercase;opacity:.8}
.e-mark{display:inline-block;width:1em;height:1em;vertical-align:-.12em;fill:none;stroke:currentColor;stroke-width:1.3;overflow:visible}
.pouch__base .e-mark{margin-left:.2em}
@media (prefers-reduced-motion:no-preference){
  :is(.declaration,.chapter-hero) .pouch__illo path{stroke-dasharray:1;animation:fig1-draw 1100ms var(--ease-in-out) 300ms both}
}

/* ---------- C27 specimen tiles ---------- */
.specimens{display:grid;gap:var(--gap)}
.specimen{--tile:var(--leaf);display:grid;align-content:space-between;gap:var(--s-5);min-height:240px;padding:var(--s-5);background:var(--tile);color:var(--on-dark);text-decoration:none}
.specimen--decaf{--tile:var(--slate)}
.specimen .icon{width:48px;height:48px}
.specimen__name{font:var(--w-display) var(--fs-h2)/1 var(--font-display);letter-spacing:var(--track-display);margin:0}
.specimen__line{font-size:var(--fs-small);max-width:34ch;margin-top:var(--s-2)}
.specimen__cta{font-weight:650;text-decoration:underline;text-decoration-color:var(--paper);text-underline-offset:.2em}
.specimen:hover .specimen__cta{text-decoration-thickness:2px}
.specimen:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
@media (min-width:768px){.specimens{grid-template-columns:1fr 1fr}}

/* ---------- C28 founder note ---------- */
.founder-note{position:relative;background:var(--card);padding:calc(var(--s-5) + 8px) var(--s-4) var(--s-5);border-bottom:1px solid var(--ink);max-width:44rem}
.founder-note::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:var(--ink)}
.founder-note p{font:420 var(--fs-lede)/1.45 var(--font-display);letter-spacing:-.01em;max-width:38ch}
.founder-note p+p{margin-top:var(--s-3)}
.founder-note__sig{margin-top:var(--s-5);font:600 var(--fs-body)/1.3 var(--font-text)!important;letter-spacing:0!important}
.founder-note__sig span{display:block;font-weight:400;font-size:var(--fs-small);color:var(--muted)}
@media (min-width:768px){.founder-note{padding:calc(var(--s-6) + 8px) var(--s-7) var(--s-6)}}

/* ---------- C29 FAQ accordion ---------- */
.faq{border-top:8px solid var(--ink);background:var(--card)}
.faq__item{border-bottom:1px solid var(--rule)}
.faq__item:last-child{border-bottom:1px solid var(--ink)}
.faq__q{display:block;position:relative;padding:var(--s-4) calc(var(--s-4) * 2 + .75em) var(--s-4) var(--s-4);cursor:pointer;list-style:none;font:650 var(--fs-body)/1.35 var(--font-text)}
.faq__q::-webkit-details-marker{display:none}
.faq__q::after{content:"+";position:absolute;right:var(--s-4);top:var(--s-4);font:300 1.5rem/1 var(--font-display)}
.faq__item[open] .faq__q::after{content:"\2212"}
.faq__a{padding:0 var(--s-4) var(--s-4)}
.faq__a p+p{margin-top:var(--s-3)}

/* ---------- C30 method protocol ---------- */
.protocol{list-style:none;padding:0;margin:0;border-top:8px solid var(--ink);background:var(--card)}
.protocol__step{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:var(--s-3);align-items:baseline;padding:var(--s-4);border-bottom:1px solid var(--rule)}
.protocol__step:last-child{border-bottom:1px solid var(--ink)}
.protocol__time{font:var(--w-numeral) var(--fs-num-m)/1 var(--font-display);letter-spacing:-.03em;font-variant-numeric:tabular-nums lining-nums}
.protocol__text{font-size:var(--fs-body)}
.protocol__note{margin-top:var(--s-3);font-size:var(--fs-small);color:var(--muted)}

/* ---------- C31 objections ---------- */
.objections{margin:0;border-top:8px solid var(--ink);background:var(--card)}
.objections__row{padding:var(--s-4);border-bottom:1px solid var(--rule);display:grid;gap:var(--s-2)}
.objections__row:last-child{border-bottom:1px solid var(--ink)}
.objections dt{font:var(--w-head) var(--fs-h3)/1.25 var(--font-display);letter-spacing:-.015em}
.objections dd{margin:0;max-width:60ch}
@media (min-width:1120px){.objections__row{grid-template-columns:5fr 7fr;column-gap:var(--gap)}}

/* ---------- C32 note box (callout) ---------- */
.note-box{border:2px solid var(--ink);padding:var(--s-4);background:var(--paper);max-width:44rem}
.note-box__title{font:650 var(--fs-body)/1.3 var(--font-text);margin-bottom:var(--s-2)}
.note-box p{font-size:var(--fs-small)}
.note-box p+p{margin-top:var(--s-2)}

/* ---------- C33 link list ---------- */
.link-list{list-style:none;padding:0;margin:0;border-top:8px solid var(--ink);background:var(--card)}
.link-list a{display:grid;grid-template-columns:32px minmax(0,1fr);gap:var(--s-3);align-items:center;padding:var(--s-3) var(--s-4);border-bottom:1px solid var(--rule);text-decoration:none;min-height:64px}
.link-list li:last-child a{border-bottom:1px solid var(--ink)}
.link-list a:hover .link-list__title{text-decoration:underline;text-decoration-color:var(--cayenne)}
.link-list .icon{width:32px;height:32px}
.link-list__title{font-weight:650}
.link-list__sub{display:block;font-size:var(--fs-small);color:var(--muted)}

/* ---------- C34 paper (articles) ---------- */
.paper{padding-block:var(--s-5) var(--section)}
.crumbs{font-size:var(--fs-micro);color:var(--muted);margin-bottom:var(--s-4)}
.crumbs ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:var(--s-2)}
.crumbs li+li::before{content:"/";margin-right:var(--s-2)}
.crumbs a{color:inherit}
.paper__head{display:grid;gap:var(--s-3);margin-bottom:var(--s-6);max-width:48rem}
.paper>.paper__head:first-child{padding-top:calc(var(--section) - var(--s-5))}
.paper__byline{font-size:var(--fs-small);color:var(--muted)}
.paper__abstract{position:relative;background:var(--card);padding:calc(var(--s-4) + 8px) var(--s-4) var(--s-4);border-bottom:1px solid var(--ink);margin-bottom:var(--s-5);max-width:44rem}
.paper__abstract::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:var(--ink)}
.paper__abstract p{font-size:var(--fs-body)}
.paper__body{max-width:68ch}
.paper__body h2{font-size:var(--fs-h3);margin:var(--s-7) 0 var(--s-3)}
.paper__body p+p{margin-top:var(--s-3)}
.paper__body ul,.paper__body ol{padding-left:1.25em;margin:var(--s-3) 0;display:grid;gap:var(--s-2)}
.paper__body .link-list{padding:0;margin:var(--s-5) 0 0;display:block}
.paper__note{margin-top:var(--s-7);font-size:var(--fs-micro);line-height:1.5;color:var(--muted);max-width:68ch}
.paper__disclosure{font-size:var(--fs-small);color:var(--muted);padding:var(--s-3) 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin-bottom:var(--s-5);max-width:68ch}
.footnotes{margin-top:var(--s-7);padding-top:var(--s-3);border-top:1px solid var(--ink);font-size:var(--fs-micro);line-height:1.5;color:var(--muted);max-width:68ch}
.footnotes h2{font:600 var(--fs-micro)/1.3 var(--font-text);letter-spacing:var(--track-micro);text-transform:uppercase;margin-bottom:var(--s-2);color:var(--ink)}
.footnotes ol{padding-left:1.4em;display:grid;gap:var(--s-2);margin:0}
.fn{font-size:.7em;line-height:0;vertical-align:.45em;text-decoration:none;font-weight:600;padding:0 .1em}

/* ---------- C35 chapter pages (matcha, decaf) ---------- */
.chapter-page{--chapter:var(--leaf);--chapter-lift:var(--leaf-lift)}
.chapter-page--decaf{--chapter:var(--slate);--chapter-lift:var(--slate-lift)}
.chapter-hero{background:var(--chapter);color:var(--on-dark);padding-block:var(--s-5) var(--section)}
.chapter-hero :focus-visible{outline-color:var(--on-dark)}
.chapter-hero a{text-decoration-color:var(--on-dark)}
.chapter-hero__grid{display:grid;gap:var(--s-7);align-items:center}
.chapter-hero__kicker{color:var(--chapter-lift);margin-bottom:var(--s-3)}
.chapter-hero__title{font-size:var(--fs-h1);margin-bottom:var(--s-4)}
.chapter-hero__lede{font-size:var(--fs-lede);line-height:1.45;margin-bottom:var(--s-5);max-width:36ch}
.chapter-hero .fine,.chapter-hero .muted{color:var(--on-dark)}
.chapter-hero .btn--primary{background:var(--paper);color:var(--chapter)}
.chapter-hero .btn--primary:hover{background:#fff}
.vote-split{font-size:var(--fs-small);margin-top:var(--s-3)}
@media (min-width:1120px){
  .chapter-hero__grid{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
  .chapter-hero__copy{grid-column:1 / span 7}
  .chapter-hero__object{grid-column:9 / span 4;display:grid;justify-items:center}
}
@media (max-width:1119px){.chapter-hero__object{display:none}}

/* ---------- C36 footer + safety strip ---------- */
.site-footer{background:var(--paper-2);padding-block:var(--s-8) calc(var(--s-6) + 64px)}
.safety{border:2px solid var(--ink);padding:var(--s-4);margin-bottom:var(--s-7);background:var(--paper)}
.safety__title{margin-bottom:var(--s-2)}
.safety p{font-size:var(--fs-small);max-width:none}
.site-footer__nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-6) var(--gap);margin-bottom:var(--s-7)}
.site-footer__group h2{font:600 var(--fs-micro)/1.3 var(--font-text);letter-spacing:var(--track-micro);text-transform:uppercase;color:var(--muted);margin-bottom:var(--s-2)}
.site-footer__group ul{display:grid;gap:var(--s-2);list-style:none;padding:0;margin:0}
.site-footer__group a{text-decoration:none;font-size:var(--fs-small)}
.site-footer__group a:hover{text-decoration:underline;text-decoration-color:var(--cayenne)}
.site-footer__base{display:grid;gap:var(--s-3);padding-top:var(--s-5);border-top:1px solid var(--ink);font-size:var(--fs-micro);color:var(--muted)}
.site-footer__base p{max-width:none}
.site-footer__base .wordmark{--wm-h:32px}
@media (min-width:768px){.site-footer{padding-bottom:var(--s-6)}.site-footer__nav{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1120px){.site-footer__nav{grid-template-columns:repeat(6,minmax(0,1fr))}.site-footer__base{grid-template-columns:auto 1fr auto;align-items:end;column-gap:var(--s-6)}}

/* ---------- C37 sticky join bar (mobile only) ---------- */
.sticky-join{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);padding:var(--s-2) var(--gutter) calc(var(--s-2) + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid var(--ink);transform:translateY(110%);transition:transform 240ms var(--ease-out),visibility 0s linear 240ms;visibility:hidden}
.sticky-join.is-visible{transform:none;visibility:visible;transition:transform 240ms var(--ease-out)}
.sticky-join__text{font-size:var(--fs-small);line-height:1.3;margin:0}
@media (min-width:768px){.sticky-join{display:none}}
html:not(.js) .sticky-join{display:none}

/* ---------- C38 icons (sprite) ---------- */
.icon{width:24px;height:24px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}

/* ---------- C39 not found ---------- */
.not-found{display:grid;justify-items:start;gap:var(--s-4);padding-block:var(--s-8) var(--section)}
.not-found .link-list{justify-self:stretch;max-width:44rem}

/* ---------- C40 layout helpers ---------- */
.split{display:grid;gap:var(--s-7)}
@media (min-width:1120px){
  .split{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:start}
  .split__main{grid-column:1 / span 7;grid-row:1}
  .split__side{grid-column:8 / span 5;grid-row:1;justify-self:end}
}
.in-out{display:grid;gap:var(--s-5)}
.in-out__col{background:var(--card);border-top:8px solid var(--ink);padding:var(--s-4)}
.in-out__col h3{margin-bottom:var(--s-3)}
.in-out__col ul{list-style:none;padding:0;margin:0}
.in-out__col li{padding:var(--s-2) 0;border-bottom:1px solid var(--rule);font-size:var(--fs-small)}
.in-out__col li:last-child{border-bottom:0}
@media (min-width:768px){.in-out{grid-template-columns:1fr 1fr}}
.more-link{display:inline-block;margin-top:var(--s-4);font-weight:650}
.on-dark .more-link{color:var(--on-dark)}
.join-panel{max-width:44rem}
.join-panel h2{margin-bottom:var(--s-3)}
.join-panel .lede{margin-bottom:var(--s-5)}

@media print{.site-header,.sticky-join,.site-footer__nav,.join{display:none}.fig1__layer,.seg{transform:none!important;animation:none!important}}

/* =====================================================================
   MINIMAL THEME (3 Oct 2026). Calm, neutral and product-led: the pack is
   the colour. One typeface, ink buttons, quiet rules, no panel bars.
   ===================================================================== */
body{background-image:none}
h1,h2,h3,h4{font-weight:500}
h3{letter-spacing:-.02em}
strong,b{font-weight:600}
.micro{font-weight:500;letter-spacing:.12em;color:var(--muted)}
a{text-decoration-color:currentColor;text-decoration-thickness:1px}
::selection{background:var(--ink);color:var(--paper)}

/* buttons */
.btn{font-weight:500;border-radius:var(--r-1);letter-spacing:0}
.btn--primary{background:var(--ink);color:#fff}
.btn--primary:hover{background:#000}
.btn--secondary{border-color:rgba(29,24,21,.35)}
.btn--secondary:hover{background:var(--ink);border-color:var(--ink);color:#fff}

/* announcement bar */
.announce{margin:0;max-width:none;background:var(--ink);color:#F3F0EB;text-align:center;font-size:.8125rem;line-height:1.3;padding:9px var(--gutter)}
.announce a{color:inherit;text-underline-offset:.2em}

/* header */
.site-header{border-bottom:1px solid var(--rule);background:var(--paper)}
.site-header__status{display:none!important}
.site-header .wordmark{--wm-h:20px}
.site-nav__list a{font-weight:500}

/* panels: quiet cards */
.panel{background:var(--card);border:1px solid var(--rule);border-radius:var(--r-2);padding:var(--s-5) var(--s-4)}
.panel::before{display:none}
@media (min-width:768px){.panel{padding:var(--s-6) var(--s-6)}}
.panel__nature{font-family:var(--font-text);border-bottom-color:var(--rule)}
.section-head__num{display:none}
.section-head__kicker,.panel__kicker{font-weight:500;letter-spacing:.12em}

/* doses */
.dose-strip{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.dose-strip__value{font-weight:450;letter-spacing:-.04em}
.dose-strip__label{font-family:var(--font-text);color:var(--muted)}
.price-label__row dd{font-weight:500}

/* forms */
.join__input{border:1px solid rgba(29,24,21,.35);border-radius:var(--r-1);background:#fff}
.join__input:focus{border-color:var(--ink);outline:none;box-shadow:0 0 0 3px rgba(29,24,21,.12)}
.stamp-card{border:1px solid var(--rule);border-radius:var(--r-2);border-bottom:1px solid var(--rule)}
.stamp-card::before{display:none}
.share__url{border:1px solid rgba(29,24,21,.35)}

/* footer */
.site-footer{background:var(--paper-2);border-top:1px solid var(--rule)}
.safety{background:var(--card);border:1px solid var(--rule);border-radius:var(--r-2)}
.site-footer__base{border-top:1px solid var(--rule)}
.site-footer__group h2{font-weight:500}

/* product imagery */
.render{display:block;width:100%;height:auto}
.render-caption{font-size:var(--fs-micro);color:var(--muted);margin-top:var(--s-2);text-align:center;max-width:none}

/* product cards (range) */
.range{display:grid;gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.range-card{display:grid;gap:var(--s-3);text-decoration:none;color:inherit}
.range-card__img{background:var(--paper-2);border-radius:var(--r-2);padding:var(--s-3);aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:background-color var(--t-fast) var(--ease-out)}
.range-card:hover .range-card__img{background:#E1DBD1}
.range-card__img img{width:100%;height:auto;transform:scale(1.12);transform-origin:50% 60%}
.range-card__row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s-3)}
.range-card__name{font-size:1.25rem;font-weight:500;letter-spacing:-.02em;margin:0}
.range-card__nick{color:var(--muted);font-size:var(--fs-small);margin:0}
.range-card__meta{font-size:var(--fs-small);margin:0;white-space:nowrap}

/* the six, as tiles */
.six{display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:var(--r-2);overflow:hidden;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:768px){.six{grid-template-columns:repeat(3,minmax(0,1fr))}}
.six__item{background:var(--paper);padding:var(--s-5) var(--s-4);display:grid;gap:4px;align-content:start}
.six__num{font-size:var(--fs-num-m);font-weight:400;letter-spacing:-.045em;line-height:1;margin:0}
.six__num .u{font-size:.45em;margin-left:.06em}
.six__name{font-weight:500;margin:var(--s-2) 0 0}
.six__line{color:var(--muted);font-size:var(--fs-small);margin:0}

/* steps */
.steps{display:grid;gap:var(--gap);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));counter-reset:step;list-style:none;padding:0;margin:0}
.steps li{border-top:1px solid var(--ink);padding-top:var(--s-4);display:grid;gap:var(--s-2)}
.steps li::before{counter-increment:step;content:"0" counter(step);font-size:var(--fs-small);color:var(--muted)}
.steps h3{font-size:var(--fs-h3);margin:0}
.steps p{color:var(--muted);margin:0}

/* split feature */
.feature{display:grid;gap:var(--s-6);align-items:center}
@media (min-width:900px){.feature{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.feature__img{background:var(--paper-2);border-radius:var(--r-2);padding:var(--s-6);display:flex;justify-content:center}
.feature__copy{display:grid;gap:var(--s-3);max-width:34rem}
.feature__copy p{color:var(--muted)}
.text-link{font-weight:500;text-underline-offset:.25em}

/* quote */
.quote{max-width:46rem;margin-inline:auto;text-align:center;display:grid;gap:var(--s-4)}
.quote p{font-size:var(--fs-h3);line-height:1.35;letter-spacing:-.02em;margin-inline:auto}
.quote cite{font-style:normal;color:var(--muted);font-size:var(--fs-small)}

/* closing call */
.closer{text-align:center;display:grid;justify-items:center;gap:var(--s-4)}
.closer h2{max-width:18ch}

/* chapter pages (matcha, decaf): neutral ground, the pouch carries the colour */
.chapter-page .site-header{background:var(--paper);color:var(--ink)}
.chapter-page .site-header :is(.site-nav__toggle,.site-header__status,.wordmark){color:var(--ink)}
.chapter-page[data-hero-form] .site-header__join{background:transparent;color:var(--ink);border-color:rgba(29,24,21,.35)}
.chapter-hero{background:var(--paper);color:var(--ink);padding-block:var(--s-6) var(--section)}
.chapter-hero :focus-visible{outline-color:var(--ink)}
.chapter-hero a{text-decoration-color:currentColor}
.chapter-hero__kicker{color:var(--chapter)}
.chapter-hero :is(.fine,.muted){color:var(--muted)}
.chapter-hero .dose-strip{border-top-color:var(--rule);border-bottom-color:var(--rule)}
.chapter-hero .dose-strip__cell{border-left-color:var(--rule)}
.chapter-hero .dose-strip__label{color:var(--muted)}
.chapter-hero .price-label__row{border-bottom-color:var(--rule)}
.chapter-hero .price-label__row dt{color:var(--muted)}
.chapter-hero :is(.join__label,.join__error){color:var(--ink)}
.chapter-hero .join__input{border-color:rgba(29,24,21,.35)}
.chapter-hero .join__also input{accent-color:var(--chapter)}
.chapter-hero .btn--primary{background:var(--chapter);color:#fff}
.chapter-hero .btn--primary:hover{background:var(--ink);color:#fff}
.chapter-hero .pouch-fig figcaption,.pouch-fig figcaption{color:var(--muted)}
.pouch-fig .render{max-width:420px}
.chapter-page .site-nav__list a{color:var(--ink)}
@media (max-width:1119px){html.js .chapter-page .site-nav.is-open .site-nav__list{background:var(--paper);border-top-color:var(--rule)}html.js .chapter-page .site-nav.is-open .site-nav__list a{color:var(--ink);border-bottom-color:var(--rule)}}