/* ============================================================
   PEPTIQUE : design system v2 (2026-10-17). v1 tokens untouched; v2 components appended at the end.
   Palette sampled directly from the Peptique vial label artwork.
   Two families: Archivo (display + body), IBM Plex Mono (technical).
   ============================================================ */

:root{
  /* ground + ink, sampled from the label photograph */
  --bone:#F0EDE6;
  --bone-deep:#E6DFD5;
  --paper:#FAF8F5;
  --white:#FFFFFF;
  --ink:#0A0A0A;
  --ink-soft:#3A3733;
  --grey:#7E796F;
  --warm:#CAC3BA;
  --line:rgba(10,10,10,.14);
  --line-soft:rgba(10,10,10,.08);
  --line-inv:rgba(255,255,255,.16);

  /* v4: champagne gold, sampled from the vial label. Every call to action wears it; nothing else does. */
  --gold:#C7AE73;
  --gold-light:#D9C48F;
  --gold-deep:#AE955B;
  --gold-soft:rgba(199,174,115,.22);
  --gold-sheen:linear-gradient(135deg,var(--gold-light) 0%,var(--gold) 46%,var(--gold-deep) 100%);
  --gold-sheen-hover:linear-gradient(135deg,var(--gold) 0%,var(--gold-deep) 62%,#9D8550 100%);

  /* type */
  --disp:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;

  /* fibonacci spacing */
  --s1:8px; --s2:13px; --s3:21px; --s4:34px; --s5:55px; --s6:89px; --s7:144px;

  --container:1280px;
  --radius:2px;
  --ease:cubic-bezier(.2,.7,.3,1);
}

/* ---------- section themes (scoped tokens, never hardcoded) ---------- */
.t-bone  { --bg:var(--bone);      --fg:var(--ink); --muted:var(--grey);  --rule:var(--line); --cardbg:var(--paper); }
.t-paper { --bg:var(--paper);     --fg:var(--ink); --muted:var(--grey);  --rule:var(--line); --cardbg:var(--white); }
.t-ink   { --bg:var(--ink);       --fg:var(--paper); --muted:#A29D94;    --rule:var(--line-inv); --cardbg:#161513; }
.t-deep  { --bg:var(--bone-deep); --fg:var(--ink); --muted:var(--grey);  --rule:var(--line); --cardbg:var(--paper); }

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bone);color:var(--ink);
  font-family:var(--disp);font-size:17px;line-height:1.6;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}

::selection{background:var(--ink);color:var(--bone)}
html{scrollbar-color:var(--warm) var(--bone)}

:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:var(--radius)}
.t-ink :focus-visible{outline-color:var(--paper)}

.skip{position:absolute;left:-9999px;top:0;z-index:999;background:var(--ink);color:var(--paper);padding:14px 20px;font-family:var(--mono);font-size:13px}
.skip:focus{left:12px;top:12px}

/* ---------- layout ---------- */
.wrap{max-width:var(--container);margin:0 auto;padding:0 28px}
section{background:var(--bg);color:var(--fg)}
.band{padding:var(--s6) 0}
.band-sm{padding:var(--s5) 0}
.band-lg{padding:var(--s7) 0}

/* ---------- type ---------- */
h1,h2,h3,h4{margin:0;font-weight:800;letter-spacing:-.025em;line-height:1.05;text-wrap:balance}
.d1{font-size:clamp(56px,10.5vw,150px);font-weight:800;letter-spacing:-.04em;line-height:.92}
.d2{font-size:clamp(34px,5.2vw,68px);letter-spacing:-.03em;line-height:1.02}
.d3{font-size:clamp(24px,2.9vw,38px);letter-spacing:-.02em;line-height:1.1}
.d4{font-size:clamp(19px,1.9vw,24px);letter-spacing:-.015em;line-height:1.2}
p{margin:0 0 var(--s3)}
.lede{font-size:clamp(18px,1.55vw,21px);line-height:1.55;max-width:62ch;color:var(--ink-soft)}
.t-ink .lede{color:#C9C4BB}
.muted{color:var(--muted)}
.measure{max-width:66ch}

/* the technical voice: every label, spec and eyebrow */
.mono{font-family:var(--mono);font-size:13px;letter-spacing:.12em;text-transform:uppercase;font-weight:500}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:0 0 var(--s3)}
.spec-val{font-family:var(--mono);font-size:15px;letter-spacing:.01em;text-transform:none}

/* ---------- buttons: exactly two, per the method ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:58px;padding:0 32px;border:1.5px solid var(--gold-deep);background:var(--gold-sheen);color:var(--ink);
  font-family:var(--mono);font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;
  border-radius:var(--radius);cursor:pointer;width:auto;
  transition:transform .11s ease-out,background .18s ease-out,color .18s ease-out,border-color .18s ease-out;
}
.btn:hover{background:var(--gold-sheen-hover);border-color:#9D8550}
.btn:active{transform:translateY(1px)}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.btn-2{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-2:hover{background:var(--ink);color:var(--paper)}
.t-ink .btn{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.t-ink .btn:hover{background:var(--gold-sheen-hover);border-color:#9D8550}
.t-ink .btn-2{background:transparent;color:var(--paper);border-color:var(--paper)}
.t-ink .btn-2:hover{background:var(--paper);color:var(--ink)}
.btn-full{width:100%}

/* every other action is a text link with a drawn underline */
.tlink{font-family:var(--mono);font-size:13px;letter-spacing:.12em;text-transform:uppercase;position:relative;display:inline-block;padding-bottom:3px}
.tlink::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1.5px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .24s var(--ease)}
.tlink:hover::after{transform:scaleX(1)}

/* ---------- RUO strip + ticker ---------- */
.ruo-strip{background:var(--ink);color:var(--paper);text-align:center;padding:9px 20px;font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase}
.ticker{background:var(--bone-deep);border-bottom:1px solid var(--line);overflow:hidden;padding:11px 0}
.ticker-row{display:flex;gap:0;width:max-content;animation:slide 46s linear infinite}
.ticker-row span{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);padding:0 26px;white-space:nowrap}
.ticker-row span::before{content:"\25C6";margin-right:26px;color:var(--warm)}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.no-motion .ticker-row{animation:none}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:60;background:rgba(240,237,230,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hdr-in{display:flex;align-items:center;gap:var(--s4);height:74px}
.brand{font-weight:800;font-size:23px;letter-spacing:-.045em;text-transform:uppercase}
.nav{display:flex;gap:26px;margin-left:auto;align-items:center}
.nav a{font-family:var(--mono);font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;position:relative;padding:6px 0}
.nav a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1.5px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .24s var(--ease)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.cart-btn{display:inline-flex;align-items:center;gap:9px;border:1.5px solid var(--ink);background:transparent;padding:11px 17px;border-radius:var(--radius);font-family:var(--mono);font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;cursor:pointer;transition:background .18s,color .18s}
.cart-btn:hover{background:var(--ink);color:var(--paper)}
.cart-n{min-width:21px;height:21px;display:grid;place-items:center;background:var(--ink);color:var(--paper);border-radius:50%;font-size:11px;letter-spacing:0}
.cart-btn:hover .cart-n{background:var(--paper);color:var(--ink)}
.cart-n.has,.cart-btn:hover .cart-n.has{background:var(--gold-sheen);color:var(--ink)}
.burger{display:none;margin-left:auto;background:none;border:1.5px solid var(--ink);width:46px;height:46px;border-radius:var(--radius);cursor:pointer;align-items:center;justify-content:center}
.burger span{display:block;width:19px;height:1.5px;background:var(--ink);position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:19px;height:1.5px;background:var(--ink)}
.burger span::before{top:-6px}.burger span::after{top:6px}

/* ---------- hero ---------- */
.hero{background:var(--bone);padding:var(--s6) 0 var(--s5)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--s5);align-items:center}
.hero h1{margin-bottom:var(--s3)}
.hero-sub{font-size:clamp(19px,1.9vw,25px);line-height:1.35;font-weight:500;letter-spacing:-.015em;max-width:19ch;margin-bottom:var(--s3)}
.hero-proof{font-family:var(--mono);font-size:13px;letter-spacing:.1em;color:var(--grey);text-transform:uppercase;margin-bottom:var(--s4)}
.hero-cta{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center}
.hero-fig{position:relative}
.hero-fig img{width:100%;border-radius:var(--radius)}
.hero-stamp{position:absolute;left:0;bottom:-14px;background:var(--ink);color:var(--paper);font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:9px 15px}

/* ---------- stat row ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4);border-top:1px solid var(--rule);padding-top:var(--s4)}
.stat .n{font-size:clamp(38px,4.4vw,60px);font-weight:800;letter-spacing:-.04em;line-height:1}
.stat .l{font-family:var(--mono);font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-top:9px}

/* ---------- trust row ---------- */
.trust{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule)}
.trust div{background:var(--bg);padding:var(--s3) var(--s2);text-align:center}
.trust .tt{font-family:var(--mono);font-size:12.5px;letter-spacing:.11em;text-transform:uppercase;font-weight:600}
.trust .ts{font-size:14px;color:var(--muted);margin-top:5px}

/* ---------- product grid ---------- */
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--s4);margin-bottom:var(--s5);flex-wrap:wrap}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:var(--s3)}
.card{background:var(--cardbg);border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:transform .22s var(--ease),box-shadow .22s var(--ease)}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(10,10,10,.09)}
.card-fig{position:relative;overflow:hidden;background:var(--bone)}
.card-fig img{width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .5s var(--ease)}
.card:hover .card-fig img{transform:scale(1.035)}
.card-tag{position:absolute;top:12px;left:12px;background:rgba(250,248,245,.94);border:1px solid var(--line);font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px}
/* the signature interaction: the spec drawer slides up, like reading the label */
.card-spec{position:absolute;left:0;right:0;bottom:0;background:rgba(10,10,10,.93);color:var(--paper);padding:14px 16px;transform:translateY(101%);transition:transform .32s var(--ease)}
.card:hover .card-spec,.card:focus-within .card-spec{transform:translateY(0)}
.card-spec dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:3px 14px;font-family:var(--mono);font-size:11.5px;letter-spacing:.04em}
.card-spec dt{color:#9C978E;text-transform:uppercase;letter-spacing:.12em}
.card-spec dd{margin:0;text-align:right}
.card-body{padding:var(--s3);display:flex;flex-direction:column;gap:9px;flex:1}
.card-cat{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.card-name{font-size:21px;font-weight:800;letter-spacing:-.025em;line-height:1.15}
.card-desc{font-size:15px;line-height:1.5;color:var(--muted);margin:0}
.card-foot{margin-top:auto;padding-top:var(--s2);display:flex;align-items:center;justify-content:space-between;gap:var(--s2);border-top:1px solid var(--rule)}
.card-price{font-family:var(--mono);font-size:17px;font-weight:600;letter-spacing:.02em}
.card-price small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:block}

/* ---------- feature ---------- */
.feature{display:grid;grid-template-columns:1fr 1.618fr;gap:var(--s5);align-items:center}
.split-golden{display:grid;grid-template-columns:1fr 1.618fr;gap:var(--s5);align-items:start}
.feature-fig{border:1px solid var(--rule);background:var(--bone);border-radius:var(--radius);overflow:hidden}
.chiprow{display:flex;gap:var(--s1);flex-wrap:wrap;margin-bottom:var(--s3)}
.chip{font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;border:1px solid var(--rule);padding:7px 12px;color:var(--muted)}

/* ---------- product page ---------- */
.crumb{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);padding:var(--s4) 0 0}
.crumb a:hover{color:var(--ink)}
.pdp{display:grid;grid-template-columns:1.05fr 1fr;gap:var(--s5);padding:var(--s4) 0 var(--s6);align-items:start}
.pdp-fig{position:sticky;top:104px;border:1px solid var(--line);background:var(--paper);border-radius:var(--radius);overflow:hidden}
.pdp-fig img{width:100%;aspect-ratio:1/1;object-fit:cover}
.pdp-badge{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;border:1px solid var(--line);padding:7px 12px;margin-bottom:var(--s3)}
.pdp h1{font-size:clamp(38px,4.6vw,62px);letter-spacing:-.035em;margin-bottom:var(--s2)}
.pdp-ref{font-family:var(--mono);font-size:12.5px;letter-spacing:.1em;color:var(--grey);text-transform:uppercase;margin-bottom:var(--s3)}
.opts{display:flex;gap:var(--s1);flex-wrap:wrap;margin:var(--s2) 0 var(--s3)}
.opt{font-family:var(--mono);font-size:13px;letter-spacing:.08em;border:1.5px solid var(--line);background:var(--paper);padding:13px 19px;cursor:pointer;border-radius:var(--radius);transition:border-color .16s,background .16s,color .16s}
.opt:hover{border-color:var(--ink)}
.opt[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.opt[disabled]{opacity:.4;cursor:not-allowed;text-decoration:line-through}
.buybox{border:1px solid var(--line);background:var(--paper);border-radius:var(--radius);padding:var(--s3);margin:var(--s3) 0}
.price{font-size:clamp(32px,3.4vw,44px);font-weight:800;letter-spacing:-.035em;line-height:1}
.price-note{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey);margin-top:7px}
.plan{display:flex;gap:var(--s1);margin:var(--s3) 0}
.plan label{flex:1;border:1.5px solid var(--line);border-radius:var(--radius);padding:15px;cursor:pointer;background:var(--white);transition:border-color .16s}
.plan label:has(input:checked){border-color:var(--ink)}
/* v6: Subscribe and save is the default and wears the champagne gold at half strength */
.plan label[data-plan-sub-wrap]:has(input:checked){background:rgba(199,174,115,.5);border-color:var(--gold-deep)}
.plan label[data-plan-sub-wrap]:has(input:checked) .pd{color:var(--ink-soft)}
.plan label[data-plan-sub-wrap]:not(:has(input:checked)):hover{background:var(--gold-soft)}
.plan input{position:absolute;opacity:0;pointer-events:none}
.plan .pn{font-family:var(--mono);font-size:12px;letter-spacing:.11em;text-transform:uppercase;font-weight:600}
.plan .pp{font-size:19px;font-weight:700;letter-spacing:-.02em;margin-top:5px}
.plan .pd{font-size:13px;color:var(--grey);line-height:1.4;margin-top:4px}
.sku{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--grey);text-transform:uppercase;margin-bottom:var(--s2)}
.guarantee{border:1px solid var(--line);border-radius:var(--radius);padding:var(--s3);margin-top:var(--s3)}
.guarantee h3{font-size:17px;margin-bottom:var(--s2)}
.guarantee ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.guarantee li{font-size:15px;line-height:1.45;padding-left:24px;position:relative;color:var(--ink-soft)}
.guarantee li::before{content:"\2713";position:absolute;left:0;top:0;font-family:var(--mono);font-size:13px}

/* spec table */
.spec-table{width:100%;border-collapse:collapse;border-top:1px solid var(--rule)}
.spec-table th,.spec-table td{text-align:left;padding:17px var(--s2);border-bottom:1px solid var(--rule);vertical-align:top}
.spec-table th{width:30%;font-family:var(--mono);font-size:12px;letter-spacing:.13em;text-transform:uppercase;font-weight:500;color:var(--muted)}
.spec-table td{font-family:var(--mono);font-size:14.5px;line-height:1.55;word-break:break-word}

.doc-list{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule)}
.doc-list li{background:var(--bg);display:flex;align-items:center;gap:var(--s2);padding:17px var(--s3)}
.doc-kind{font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;border:1px solid var(--rule);padding:5px 9px;flex:none}
.doc-list .nm{font-size:15px;flex:1}

.faq{border-top:1px solid var(--rule)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{cursor:pointer;list-style:none;padding:var(--s3) 0;font-size:19px;font-weight:700;letter-spacing:-.02em;display:flex;justify-content:space-between;gap:var(--s3);align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono);font-weight:400;font-size:22px;flex:none}
.faq details[open] summary::after{content:"\2013"}
.faq .ans{padding:0 0 var(--s3);max-width:72ch;color:var(--ink-soft)}
.t-ink .faq .ans{color:#C9C4BB}

.disclaimer{border:1px solid var(--rule);border-left-width:4px;padding:var(--s3);font-size:15px;line-height:1.55;color:var(--ink-soft)}
.t-ink .disclaimer{color:#C9C4BB}

/* ---------- gate ---------- */
.gate{position:fixed;inset:0;z-index:200;background:rgba(10,10,10,.72);backdrop-filter:blur(6px);display:grid;place-items:center;padding:20px}
.gate[hidden]{display:none}
.gate-card{background:var(--bone);max-width:560px;width:100%;border-radius:var(--radius);padding:var(--s5) var(--s4);max-height:92vh;overflow:auto}
.gate-card h2{font-size:clamp(28px,3.4vw,40px);letter-spacing:-.03em;margin-bottom:var(--s2)}
.gate-card p{font-size:15.5px;line-height:1.55;color:var(--ink-soft)}
.gate-check{display:flex;gap:12px;align-items:flex-start;margin:var(--s3) 0;font-size:15px;line-height:1.45}
.gate-check input{margin-top:4px;width:19px;height:19px;accent-color:var(--ink);flex:none}
.gate-exit{display:block;text-align:center;margin-top:var(--s3)}

/* ---------- footer ---------- */
.foot{background:var(--ink);color:var(--paper);padding:var(--s6) 0 var(--s4)}
.foot-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:var(--s4);padding-bottom:var(--s5);border-bottom:1px solid var(--line-inv)}
.foot h4{font-family:var(--mono);font-size:11.5px;letter-spacing:.17em;text-transform:uppercase;color:#9C978E;font-weight:500;margin-bottom:var(--s2)}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.foot a{font-size:15px;color:#D9D4CB}
.foot a:hover{color:var(--paper)}
.foot-brand{font-size:28px;font-weight:800;letter-spacing:-.04em;text-transform:uppercase;margin-bottom:var(--s2)}
.foot-note{font-size:14.5px;line-height:1.6;color:#9C978E;max-width:46ch}
.foot-bottom{padding-top:var(--s3);display:flex;justify-content:space-between;gap:var(--s3);flex-wrap:wrap;font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:#8A857D}

/* ---------- reveal (static-safe) ---------- */
.rev{opacity:0;transform:translateY(16px);transition:opacity .62s var(--ease),transform .62s var(--ease)}
.rev.in{opacity:1;transform:none}
.no-motion .rev,html:not(.js) .rev{opacity:1!important;transform:none!important}

/* ---------- responsive ---------- */
@media (max-width:1024px){
  .hero-grid{grid-template-columns:1fr;gap:var(--s4)}
  .hero-sub{max-width:26ch}
  .feature{grid-template-columns:1fr;gap:var(--s4)}
  .split-golden{grid-template-columns:1fr;gap:var(--s4)}
  .pdp{grid-template-columns:1fr;gap:var(--s4)}
  .pdp-fig{position:static}
  .trust{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr);gap:var(--s3)}
}
@media (max-width:760px){
  .wrap{padding:0 20px}
  .band{padding:var(--s5) 0}
  .band-lg{padding:var(--s6) 0}
  .nav{display:none}
  .nav.open{display:flex;position:absolute;top:74px;left:0;right:0;flex-direction:column;align-items:flex-start;gap:0;background:var(--bone);border-bottom:1px solid var(--line);padding:var(--s2) 20px var(--s3)}
  .nav.open a{padding:14px 0;width:100%;border-bottom:1px solid var(--line-soft);font-size:14px}
  .burger{display:inline-flex}
  .hdr-in{gap:var(--s2)}
  .cart-btn{order:3}
  .grid{grid-template-columns:1fr;gap:var(--s3)}
  .trust{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .foot-grid{grid-template-columns:1fr 1fr;gap:var(--s4)}
  .plan{flex-direction:column}
  .spec-table th{width:42%;font-size:11px}
  .spec-table td{font-size:13.5px}
  .btn{width:100%}
  .hero-cta .btn{width:100%}
  .card-spec{transform:translateY(0);position:static;background:transparent;color:var(--fg);padding:0 var(--s3) var(--s3);border:0}
  .card-spec dt{color:var(--muted)}
  .card-spec dd{color:var(--fg)}
  /* phone sticky buy bar */
  .js .stickybuy.show{display:flex}
}
.stickybuy{display:none;position:fixed;left:0;right:0;bottom:0;z-index:70;background:rgba(240,237,230,.97);backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:11px 16px;gap:12px;align-items:center}
.stickybuy .sp{font-family:var(--mono);font-weight:600;font-size:16px;flex:none}
.stickybuy .btn{min-height:50px;flex:1;padding:0 18px}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .rev{opacity:1!important;transform:none!important}
}
@media print{.hdr,.ticker,.gate,.stickybuy,.foot{display:none}}

/* ============================================================
   v2 components: official bar, offer band, gallery card, buy card,
   volume pricing, product notice, research notice, tabs, rp sections,
   related grid, COA vault, footer newsletter.
   ============================================================ */
.sr{position:absolute;left:-9999px}
.official-bar{background:var(--paper);border-bottom:1px solid var(--line);text-align:center;padding:8px 20px;font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap}
.official-bar .tlink{font-size:11.5px}
.ob-sep{color:var(--warm)}

/* offer band */
.offer{padding:var(--s5) 0}
.offer-in{display:grid;grid-template-columns:1.3fr 1fr auto;gap:var(--s4);align-items:center}
.offer .d3{color:var(--paper);max-width:24ch}
.offer-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.offer-list li{display:grid;grid-template-columns:88px 1fr;gap:14px;align-items:baseline;border-top:1px solid var(--line-inv);padding-top:10px}
.offer-list .n{font-size:26px;font-weight:800;letter-spacing:-.03em;color:var(--paper)}
.offer-list .l{font-size:14px;color:#C9C4BB}
.price-line{font-family:var(--mono);font-size:15px;margin:0 0 var(--s3)}
.price-line del{color:var(--grey)}
.price-line strong{font-size:22px;letter-spacing:-.02em;margin:0 6px}
.qgrid{margin-top:55px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:34px}

[hidden]{display:none}
.opts[hidden],.fmt[hidden],.plan[hidden],.stage[hidden]{display:none}
.plan .pn,.plan .pp,.plan .pd{display:block}
.addons .doc-list li{padding-left:14px}
.addons .doc-list li::before{content:none}

/* product cards: badges */
.card-tags{position:absolute;top:12px;left:12px;display:flex;gap:6px;flex-wrap:wrap}
.card-tags .card-tag{position:static}
.card-sale{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.card-price del{color:var(--grey);font-weight:400;margin-right:6px}
.grid-4{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}

/* ---------- product page, v2 hero ---------- */
.pdp2{display:grid;grid-template-columns:1.08fr 1fr;gap:var(--s3) var(--s5);padding:var(--s4) 0 var(--s6);align-items:start}
/* v8: the sticky gallery sits inside its own column cell that stretches to the buy card's height.
   A sticky box can travel the full height of its containing block, so without this wrapper the gallery
   kept sliding down the page over the accordion copy below it. The wrapper caps the travel at the end
   of the buy card; the bone background makes the card opaque so nothing can show through it. */
.gallery-col{grid-column:1;grid-row:1;align-self:stretch;min-width:0}
.gallery-card{position:sticky;top:104px;background:var(--bone)}
.buycard{grid-column:2;grid-row:1}
.gallery-info{grid-column:1;grid-row:2;margin-top:0}
.gallery{display:grid;grid-template-columns:76px 1fr;gap:var(--s2)}
.rail{display:flex;flex-direction:column;gap:8px;max-height:640px;overflow:auto;scrollbar-width:thin}
.thumb{border:1.5px solid var(--line);background:var(--paper);padding:0;cursor:pointer;border-radius:var(--radius);overflow:hidden;aspect-ratio:1/1;transition:border-color .16s}
.thumb img{width:100%;height:100%;object-fit:cover}
.thumb-doc img{object-fit:cover;object-position:top}
.thumb:hover{border-color:var(--grey)}
.thumb[aria-pressed="true"]{border-color:var(--ink)}
.stage-wrap{position:relative;border:1px solid var(--line);background:var(--paper);border-radius:var(--radius);overflow:hidden}
.stage{margin:0}
.stage img{width:100%;aspect-ratio:1/1;object-fit:cover}
.stage-doc img{object-fit:contain;background:var(--paper)}
.stage-nav{position:absolute;right:12px;bottom:12px;display:flex;gap:6px;align-items:center;background:rgba(250,248,245,.94);border:1px solid var(--line);padding:4px}
.snav{border:0;background:transparent;width:34px;height:34px;cursor:pointer;font-size:16px}
.snav:hover{background:var(--ink);color:var(--paper)}
.scount{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;padding:0 8px;color:var(--grey)}
.gallery-note{margin-top:var(--s2);border:1px solid var(--line);border-left-width:4px;padding:13px 17px;font-size:14px;line-height:1.5;color:var(--ink-soft);background:var(--paper)}
.gallery-info{border:1px solid var(--line);padding:var(--s3);background:var(--paper)}
.gi-head{display:flex;gap:var(--s2);align-items:center;flex-wrap:wrap;margin-bottom:var(--s2);font-size:13.5px}
.gi-head .pdp-badge{margin:0}
.faq-sm summary{font-size:15px;padding:14px 0;gap:14px;justify-content:flex-start}
.faq-sm summary .mono{color:var(--grey);font-size:11px}
.faq-sm summary::after{margin-left:auto;font-size:18px}
.faq-sm .ans{font-size:14px;color:var(--ink-soft)}
.faq-sm .ans ul{margin:8px 0 12px;padding-left:18px;display:grid;gap:4px}
.faq-sm .ans p{margin-bottom:8px}

/* ---------- buy card ---------- */
.buycard{border:1px solid var(--line);background:var(--paper);border-radius:var(--radius);padding:var(--s4)}
.buycard h1{font-size:clamp(36px,4.2vw,56px);letter-spacing:-.035em;margin-bottom:var(--s2)}
.buycard .chiprow{margin-bottom:var(--s3)}
.price-row{display:flex;align-items:baseline;gap:var(--s2);flex-wrap:wrap;margin-top:var(--s2)}
.price-meta{display:flex;gap:10px;align-items:center}
.price-reg{font-family:var(--mono);font-size:16px;color:var(--grey)}
.sale-pill{font-family:var(--mono);font-size:11px;letter-spacing:.14em;background:var(--ink);color:var(--paper);padding:5px 9px}
.sale-pill[hidden]{display:none}
.fmt{display:flex;gap:var(--s1);flex-wrap:wrap}
.fmt .opt{flex:1;text-align:center}
.kit-note{font-size:13.5px;margin:-8px 0 var(--s2)}
.stock-alert{display:flex;gap:8px;align-items:center;flex-wrap:wrap;border:1px solid var(--line);padding:13px;margin-bottom:var(--s3)}
.stock-alert[hidden]{display:none}
.stock-alert input{flex:1;min-width:180px;border:1.5px solid var(--line);padding:12px;font:inherit;font-size:14px;background:var(--white)}
.stock-alert .btn{min-height:46px;padding:0 18px;width:auto}
.stock-alert .pdp-badge{margin:0}
.volume{border:1px solid var(--line);margin:var(--s3) 0}
.volume[hidden]{display:none}
.vol-head{display:flex;justify-content:space-between;align-items:center;padding:12px 17px;border-bottom:1px solid var(--line);font-size:14px}
.tiers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr)}
.tiers li{padding:12px 10px;border-right:1px solid var(--line);display:grid;gap:3px;text-align:center}
.tiers li:last-child{border-right:0}
.tiers li.on{background:var(--ink);color:var(--paper)}
/* v5: tiles are buttons */
.tiers li[data-tier-qty]{cursor:pointer;transition:background .15s,color .15s;-webkit-user-select:none;user-select:none}
.tiers li[data-tier-qty]:hover:not(.on){background:var(--gold-soft)}
.tiers li[data-tier-qty]:hover:not(.on) .tr-label{text-decoration:underline;text-decoration-color:var(--gold-deep);text-decoration-thickness:2px;text-underline-offset:3px}
.tiers li[data-tier-qty]:focus-visible{outline:3px solid var(--ink);outline-offset:-3px;z-index:1}
.tiers li[data-tier-qty]:active{transform:translateY(1px)}
.tiers li.on .tr-note{opacity:.85}
.qty.pulse{box-shadow:0 0 0 3px var(--gold-soft);transition:box-shadow .15s}
.qty{transition:box-shadow .35s}
.tr-range{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:inherit;opacity:.75}
.tr-label{font-weight:700;font-size:14px;letter-spacing:-.01em}
.tr-note{font-size:11.5px;opacity:.7}
.tr-kit .tlink{font-size:10.5px;padding:0;background:none;border:0;cursor:pointer;letter-spacing:.08em}
.qty-row{display:flex;gap:var(--s2);align-items:stretch;margin-top:var(--s3)}
.qty{display:flex;border:1.5px solid var(--ink);border-radius:var(--radius);overflow:hidden}
.qty button{width:48px;border:0;background:transparent;font-size:20px;cursor:pointer}
.qty button:hover{background:var(--ink);color:var(--paper)}
.qty input{width:56px;text-align:center;border:0;border-left:1.5px solid var(--ink);border-right:1.5px solid var(--ink);font-family:var(--mono);font-size:16px;-moz-appearance:textfield}
.qty input::-webkit-inner-spin-button,.qty input::-webkit-outer-spin-button{-webkit-appearance:none}
.btn-grow{flex:1;width:auto}
.summary{margin:var(--s2) 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.summary div{background:var(--bone);padding:10px 12px}
.summary dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.summary dd{margin:3px 0 0;font-family:var(--mono);font-size:15px;font-weight:600}
.notice{border:1px solid var(--line);border-left:4px solid var(--ink);padding:var(--s3);margin-top:var(--s3);background:var(--bone)}
.notice ul{list-style:none;margin:0;padding:0;display:grid;gap:13px}
.notice li{display:grid;grid-template-columns:26px 1fr;gap:12px;font-size:14px;line-height:1.5}
.notice li strong{display:block;font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:3px}
.notice li p{margin:0;color:var(--ink-soft)}
.ni{width:24px;height:24px;border:1.5px solid var(--ink);display:grid;place-items:center;font-family:var(--mono);font-size:12px;font-weight:600}
.assure{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:var(--s3)}
.assure div{background:var(--paper);padding:12px;display:grid;gap:3px;font-size:12.5px;color:var(--grey)}
.assure .mono{font-size:10.5px;color:var(--grey)}
.assure strong{color:var(--ink);font-size:14px}
.secure{display:flex;justify-content:space-between;gap:var(--s2);padding:12px 0 0;font-size:13.5px;color:var(--ink-soft);flex-wrap:wrap}
.secure .mono{font-size:11px;color:var(--grey)}
.addons .doc-list li{padding:12px 14px}
.add-mini{font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;font-weight:600;border:1.5px solid var(--gold-deep);background:var(--gold-sheen);color:var(--ink);padding:7px 11px;cursor:pointer;flex:none;transition:background .16s,border-color .16s}
.add-mini:hover{background:var(--gold-sheen-hover);border-color:#9D8550}
.addons .nm a{text-decoration:underline;text-decoration-color:var(--warm);text-underline-offset:3px}

/* ---------- research notice band ---------- */
.rnotice{padding:var(--s3) 0}
.rnotice-in{display:flex;gap:var(--s4);align-items:center;flex-wrap:wrap}
.rnotice p{margin:0;flex:1;font-size:15px;color:#C9C4BB;min-width:260px}
.rnotice p strong{color:var(--paper)}

/* ---------- tabs ---------- */
.tabs-band{padding-top:var(--s5)}
.tablist{display:flex;gap:0;border-bottom:1px solid var(--rule);overflow:auto;scrollbar-width:none}
.tablist button{border:0;background:transparent;font-family:var(--mono);font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;padding:16px 22px;cursor:pointer;position:relative;white-space:nowrap;color:var(--grey)}
.tablist button span{margin-right:6px}
.tablist button::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--ink);transform:scaleX(0);transition:transform .24s var(--ease)}
.tablist button[aria-selected="true"]{color:var(--ink)}
.tablist button[aria-selected="true"]::after{transform:scaleX(1)}
.tabpanel{padding-top:var(--s5)}
.tabpanel[hidden]{display:none}
html:not(.js) .tabpanel[hidden]{display:block}
.rp-hero{max-width:72ch;margin-bottom:var(--s5)}
.rp-hero .d2{margin-bottom:var(--s3)}
.rp{border-top:1px solid var(--rule);padding:var(--s4) 0}
.rp-k{display:flex;gap:14px;align-items:center;margin-bottom:var(--s2)}
.rp-k .mono{color:var(--grey)}
.rp .d3{margin-bottom:var(--s3)}
.ident{margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.ident div{background:var(--bg);padding:14px 16px}
.ident dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey)}
.ident dd{margin:5px 0 0;font-family:var(--mono);font-size:14px;word-break:break-word}
.rp-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--s2)}
.rp-cards div{border:1px solid var(--rule);padding:var(--s3);background:var(--cardbg);display:grid;gap:8px;align-content:start}
.rp-cards strong{font-size:16px;letter-spacing:-.01em}
.rp-cards p{margin:0;font-size:14.5px;line-height:1.55;color:var(--ink-soft)}
.rp-cards .mono{color:var(--grey);font-size:11px}
.check{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:9px 24px}
.check li{padding-left:24px;position:relative;font-size:15px;color:var(--ink-soft)}
.check li::before{content:"\2713";position:absolute;left:0;top:0;font-family:var(--mono);font-size:13px}
.restrict{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule)}
.restrict li{background:var(--bg);padding:12px 14px;font-family:var(--mono);font-size:12.5px;letter-spacing:.06em}
.restrict li::before{content:"\00d7  ";color:var(--grey)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s2)}
.steps div{border-top:2px solid var(--ink);padding-top:12px;display:grid;gap:6px;align-content:start}
.steps strong{font-size:17px}
.steps p{margin:0;font-size:14.5px;color:var(--ink-soft)}
.rp-final{border:1px solid var(--rule);border-left:4px solid var(--ink);padding:var(--s3);margin-top:var(--s4);background:var(--cardbg)}
.rp-final .d4{margin:10px 0 8px}
.rp-final p{margin:0;font-size:14.5px;color:var(--ink-soft)}
.doc-list .status{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);border:1px solid var(--rule);padding:5px 9px;flex:none}
.doc-list .tlink{flex:none}

/* ---------- COA vault ---------- */
.vault-tools{margin-top:var(--s4);display:grid;gap:var(--s2)}
.vault-tools input{width:100%;border:1.5px solid var(--ink);background:var(--paper);padding:16px 18px;font-family:var(--mono);font-size:14px}
.pills{display:flex;gap:8px;flex-wrap:wrap}
.vault{display:grid;gap:var(--s2)}
.vcard{border:1px solid var(--rule);background:var(--cardbg)}
.vcard summary{list-style:none;display:flex;align-items:center;gap:var(--s2);padding:var(--s3);cursor:pointer}
.vcard summary::-webkit-details-marker{display:none}
.vicon{width:46px;height:46px;border:1.5px solid var(--ink);display:grid;place-items:center;font-family:var(--mono);font-weight:600;font-size:13px;flex:none}
.vname{font-size:20px;font-weight:800;letter-spacing:-.02em}
.vmeta{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
.vcount{margin-left:auto;font-family:var(--mono);font-size:11px;letter-spacing:.12em;border:1px solid var(--rule);padding:6px 10px;flex:none}
.vpanel{border-top:1px solid var(--rule);padding:var(--s3)}
.vpanel .vp-head{display:flex;justify-content:space-between;gap:var(--s2);margin-bottom:var(--s2);font-size:14px;color:var(--grey);flex-wrap:wrap}
.vrow{display:grid;grid-template-columns:90px 1fr 110px 110px auto;gap:var(--s2);align-items:center;padding:12px 0;border-top:1px solid var(--rule);font-family:var(--mono);font-size:13px}
.vrow:first-of-type{border-top:0}
.vrow .res{border:1px solid var(--rule);padding:4px 8px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;text-align:center}
.vrow .res.ok{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.vempty{padding:var(--s3);color:var(--grey);font-size:14px}

/* ---------- footer newsletter ---------- */
.foot-news{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--s4);align-items:center;padding-bottom:var(--s5);margin-bottom:var(--s5);border-bottom:1px solid var(--line-inv)}
.news-form{display:flex;gap:8px}
.news-form input{flex:1;border:1.5px solid var(--line-inv);background:transparent;color:var(--paper);padding:14px 16px;font:inherit;font-size:14px}
.news-form .btn{width:auto}
.foot-disc{font-size:13px;line-height:1.6;color:#8A857D;max-width:92ch;padding:var(--s3) 0 var(--s2)}
.stickybuy .sp small{display:block;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);font-weight:400}

@media (max-width:1100px){
  .offer-in{grid-template-columns:1fr;gap:var(--s3)}
  .pdp2{grid-template-columns:1fr;gap:var(--s4)}
  .gallery-col{grid-column:auto;grid-row:auto;align-self:auto}
  .gallery-card{position:static}
  .buycard{grid-column:auto;grid-row:auto}
  .gallery-info{grid-column:auto;grid-row:auto}
}
@media (max-width:760px){
  .gallery{grid-template-columns:1fr}
  .rail{flex-direction:row;max-height:none;overflow-x:auto;order:2;padding-bottom:4px}
  .thumb{flex:0 0 64px}
  .buycard{padding:var(--s3)}
  .tiers{grid-template-columns:repeat(2,1fr)}
  .tiers li:nth-child(2n){border-right:0}
  .tiers li{border-bottom:1px solid var(--line)}
  .summary{grid-template-columns:repeat(2,1fr)}
  .assure{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .foot-news{grid-template-columns:1fr}
  .news-form{flex-direction:column}
  .vrow{grid-template-columns:1fr 1fr;gap:6px}
  .vrow .tlink{grid-column:span 2}
  .qty-row{flex-wrap:wrap}
  .btn-grow{width:100%;padding:0 18px}
  .official-bar{font-size:10.5px}
}


/* ---------- v3: cart drawer ---------- */
.cart-drawer[hidden]{display:none}
.cart-drawer{position:fixed;inset:0;z-index:120}
.cart-scrim{position:absolute;inset:0;background:rgba(10,10,10,.42)}
.cart-panel{position:absolute;top:0;right:0;bottom:0;width:min(440px,100%);background:var(--bone);display:flex;flex-direction:column;box-shadow:-18px 0 48px rgba(10,10,10,.18);transform:translateX(0);animation:cart-in .22s var(--ease)}
@keyframes cart-in{from{transform:translateX(24px);opacity:.6}to{transform:none;opacity:1}}
.no-motion .cart-panel{animation:none}
body.cart-open{overflow:hidden}
.cart-head{display:flex;align-items:center;justify-content:space-between;padding:21px 24px 13px;border-bottom:1px solid var(--line)}
.cart-head h2{font-size:22px;letter-spacing:-.02em}
.cart-count{font-family:var(--mono);font-size:13px;color:var(--grey);font-weight:400;margin-left:6px}
.cart-x{background:none;border:0;font-size:30px;line-height:1;cursor:pointer;padding:0 4px;color:var(--ink)}
.ship-bar{padding:13px 24px;background:var(--paper);border-bottom:1px solid var(--line)}
.ship-bar[hidden]{display:none}
.ship-bar p{font-size:13.5px;margin:0 0 8px;color:var(--ink-soft)}
.ship-track{height:4px;background:var(--line);border-radius:2px;overflow:hidden}
.ship-track span{display:block;height:100%;background:var(--gold-sheen);width:0;transition:width .3s var(--ease)}
.cart-lines{flex:1;overflow:auto;padding:0 24px}
.cl{display:grid;grid-template-columns:64px 1fr auto;gap:13px;padding:17px 0;border-bottom:1px solid var(--line);align-items:start}
.cl-img img{width:64px;height:64px;object-fit:cover;border-radius:var(--radius);background:var(--paper);display:block}
.cl-ph{display:grid;place-items:center;width:64px;height:64px;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--grey)}
.co-totals div[hidden]{display:none}
.cl-name{font-weight:700;font-size:15.5px;letter-spacing:-.01em;text-decoration:none;color:var(--ink)}
.cl-meta{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--grey);margin:3px 0 6px}
.cl-plan{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;background:none;border:0;padding:0;cursor:pointer;color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--gold);text-decoration-thickness:2px;margin-bottom:8px}
.cl-plan.on{text-decoration:none;cursor:default;background:var(--gold-soft);padding:3px 7px;border-radius:var(--radius)}
.cl-plan-back{display:block;background:none;border:0;padding:0;font-size:12px;color:var(--grey);cursor:pointer;text-decoration:underline;margin:-4px 0 8px}
.cl-row{display:flex;align-items:center;justify-content:space-between;gap:13px}
.cl-qty{display:inline-flex;align-items:center;border:1.5px solid var(--ink);border-radius:var(--radius);font-family:var(--mono);font-size:13px}
.cl-qty button{width:32px;height:32px;background:none;border:0;cursor:pointer;font-size:16px;color:var(--ink)}
.cl-qty span{min-width:26px;text-align:center}
.cl-price{font-family:var(--mono);font-size:14px;font-weight:600;text-align:right}
.cl-price small{display:block;font-size:10px;font-weight:400;color:var(--grey);letter-spacing:.06em;text-transform:uppercase}
.cl-rm{background:none;border:0;padding:0;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.cart-empty{padding:55px 24px;text-align:center}
.cart-empty[hidden]{display:none}
.cart-empty p{font-size:17px;margin-bottom:21px}
.cart-foot{padding:17px 24px 24px;border-top:1px solid var(--line);background:var(--paper)}
.cart-foot[hidden]{display:none}
.cart-sub{display:flex;justify-content:space-between;align-items:baseline;font-size:15px}
.cart-sub strong{font-family:var(--mono);font-size:20px}
.cart-tax{font-size:12.5px;margin:6px 0 13px}
.cart-continue{display:block;margin:13px auto 0;background:none;border:0;cursor:pointer}

/* ---------- v3: checkout page ---------- */
.checkout .co-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--s5);margin-top:var(--s4);align-items:start}
.co-lines{margin-top:var(--s4);border-top:1px solid var(--line)}
.co-line{display:grid;grid-template-columns:44px 1fr auto;gap:13px;padding:15px 0;border-bottom:1px solid var(--line);align-items:start;font-size:15px}
.co-line a{font-weight:700;text-decoration:none;color:var(--ink)}
.co-line small{font-family:var(--mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--grey)}
.co-qty,.co-amt{font-family:var(--mono);font-size:14px}
.co-amt{font-weight:600}
.co-totals{margin-top:var(--s3)}
.co-totals[hidden]{display:none}
.co-totals div{display:flex;justify-content:space-between;padding:9px 0;font-size:15px;border-bottom:1px solid var(--line-soft)}
.co-totals dd{font-family:var(--mono)}
.co-grand{font-weight:700;font-size:17px}
.co-grand dd{font-size:20px}
.co-note{font-size:13.5px;margin-top:13px}
.co-note[hidden],.co-empty[hidden]{display:none}
.co-empty{margin-top:var(--s4)}
.co-pay{background:var(--paper);border:1px solid var(--line);padding:var(--s4);position:sticky;top:104px}
.co-steps{list-style:none;margin:13px 0 21px}
.co-steps li{display:grid;grid-template-columns:34px 1fr;gap:10px;padding:13px 0;border-top:1px solid var(--line-soft);font-size:14.5px;line-height:1.5;color:var(--ink-soft)}
.co-steps .n{font-family:var(--mono);font-size:12px;color:var(--grey)}
.co-strip{margin:21px 0}
.co-pay .tlink{display:inline-block;margin-top:4px}
@media (max-width:900px){
  .checkout .co-grid{grid-template-columns:1fr}
  .co-pay{position:static}
}

/* ---------- v7: diluent strip under the catalog ---------- */
.supply-strip{display:grid;grid-template-columns:150px 1fr auto;gap:var(--s4);align-items:center;margin-top:var(--s4);padding:var(--s3) var(--s4);background:var(--paper);border:1px solid var(--line)}
.ss-fig img{width:150px;height:150px;object-fit:cover;display:block;border-radius:var(--radius)}
.ss-body h3{font-size:24px;letter-spacing:-.02em;margin:4px 0 6px}
.ss-body p{margin:0;color:var(--ink-soft);font-size:15px;max-width:60ch}
.ss-buy{display:grid;gap:10px;justify-items:end;text-align:right}
.ss-buy .price{font-family:var(--mono);font-size:15px}
@media (max-width:760px){
  .supply-strip{grid-template-columns:1fr;text-align:left}
  .ss-fig img{width:120px;height:120px}
  .ss-buy{justify-items:stretch;text-align:left}
}

/* ============================================================
   v9 (2026-10-23): competitor parity pass.
   Reviewed against dryptides.com, veltrigen.com, peptideclub.com and
   researchpurposelabs.shop. Everything below is either a component those
   sites have and v8 did not, or the Peptique version of one done better.
   No token is redefined; the champagne gold from v4 still carries every
   call to action and nothing else.
   ============================================================ */

/* ---------- rotating announcement bar (DRYPtides pattern) ---------- */
.announce{background:var(--gold-sheen);color:var(--ink);text-align:center;padding:10px 20px;
  border-bottom:1px solid var(--gold-deep)}
.an-in{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  font-weight:600;min-height:17px;display:block}
.an-item[hidden]{display:none}

/* ---------- researcher gate (Veltrigen pattern, with the record line) ---------- */
.gate-card{max-width:600px;padding:var(--s4) var(--s4) var(--s3)}
.gate-brand{font-size:20px;font-weight:800;letter-spacing:.22em;text-transform:uppercase;
  text-align:center;margin-bottom:var(--s3);color:var(--ink)}
.gate-card h2{text-align:center;margin-bottom:var(--s1)}
.gate-lede{text-align:center;margin:0 auto var(--s3);max-width:40ch}
.gate-perks{list-style:none;margin:0 0 var(--s3);padding:var(--s2) 0;display:grid;gap:9px;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.gate-perks li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.4;color:var(--ink-soft)}
.gate-perks li span{color:var(--gold-deep);font-weight:700;flex:none}
.gate-check{background:var(--paper);border:1px solid var(--line);padding:13px;margin:0 0 var(--s1);
  font-size:14.5px}
.gate-check:has(input:checked){border-color:var(--gold-deep);background:var(--gold-soft)}
.gate-field{margin:var(--s2) 0 var(--s3)}
.gate-field label{display:block;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--grey);margin-bottom:6px}
.gate-field select{width:100%;padding:12px 13px;border:1px solid var(--line);background:var(--white);
  font-family:var(--disp);font-size:15px;color:var(--ink);border-radius:var(--radius)}
.gate-field select:focus-visible{outline:2px solid var(--gold-deep);outline-offset:1px}
.gate-affirm{font-size:13px;line-height:1.5;color:var(--grey);margin-top:var(--s3);text-align:center}
.gate-affirm a{text-decoration:underline;text-underline-offset:2px}
.gate-fda{font-size:11.5px;line-height:1.55;color:var(--grey);margin-top:var(--s2);
  padding-top:var(--s2);border-top:1px solid var(--line-soft);text-align:left}
#gate-go[disabled]{opacity:.45;cursor:not-allowed}

/* ---------- buy one get one free ---------- */
.bogo-tag{display:inline-block;background:var(--ink);color:var(--gold-light);font-family:var(--mono);
  font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;padding:4px 8px;
  vertical-align:middle}
.card-tag.card-bogo{background:var(--ink);color:var(--gold-light);border-color:var(--ink)}
.bogo-strip{display:flex;gap:12px;align-items:flex-start;background:var(--gold-soft);
  border:1px solid var(--gold-deep);border-left-width:3px;padding:13px 15px;margin:var(--s3) 0 0}
.bogo-copy{font-size:14.5px;line-height:1.45;color:var(--ink-soft)}
.bogo-copy strong{color:var(--ink)}
.hero-offer{margin-top:var(--s3);font-size:16px;line-height:1.7;color:var(--ink-soft);max-width:54ch}
.hero-offer .bogo-tag{margin-right:8px}
.hero-offer strong{color:var(--ink)}
.ships{margin:11px 0 0;font-size:14px;color:var(--ink-soft);display:flex;gap:10px;align-items:center}
.ships[hidden]{display:none}

/* ---------- same-day cutoff clock ---------- */
.cutoff{display:flex;gap:9px;align-items:center;margin:var(--s2) 0 0;font-size:14px;color:var(--ink-soft)}
.cutoff[hidden]{display:none}
.cutoff strong{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.cutoff-dot{width:8px;height:8px;border-radius:50%;background:#2F7D4F;flex:none;
  box-shadow:0 0 0 3px rgba(47,125,79,.18)}
.cutoff.closed .cutoff-dot{background:var(--warm);box-shadow:0 0 0 3px rgba(202,195,186,.3)}

/* ---------- quick add on the catalog card ---------- */
.qa-chips{display:flex;flex-wrap:wrap;gap:5px;margin:var(--s2) 0 0}
.qa-chip{background:var(--white);border:1px solid var(--line);font-family:var(--mono);font-size:11.5px;
  letter-spacing:.06em;padding:6px 9px;cursor:pointer;border-radius:var(--radius);transition:all .14s}
.qa-chip:hover{border-color:var(--gold-deep);background:var(--gold-soft)}
.qa-chip[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.card-price small{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--grey);margin-top:3px;font-weight:400}
.card-price del{color:var(--grey);font-weight:400;margin-right:6px;font-size:.78em}
.card-price del[hidden]{display:none}
.qa-add{margin-top:var(--s2)}
.qa-more{display:block;text-align:center;margin-top:11px;font-size:13.5px}

/* ---------- subscription: the thing no competitor sells ---------- */
.plan label[data-plan-sub-wrap]{position:relative;padding-top:24px}
.plan-flag{position:absolute;top:0;left:0;right:0;background:var(--ink);color:var(--gold-light);
  font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  text-align:center;padding:4px 6px;font-weight:600}
.sub-panel{border:1px solid var(--gold-deep);border-top:3px solid var(--gold);background:var(--paper);
  padding:var(--s3);margin:0 0 var(--s3)}
.sub-panel[hidden]{display:none}
.sub-cad{margin-bottom:var(--s3)}
.sub-cad .mono{display:block;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--grey);margin-bottom:8px}
.cad-row{display:flex;gap:6px;flex-wrap:wrap}
.cad-chip{flex:1;min-width:92px;background:var(--white);border:1px solid var(--line);
  font-family:var(--mono);font-size:12px;padding:10px 8px;cursor:pointer;border-radius:var(--radius);
  transition:all .14s}
.cad-chip:hover{border-color:var(--gold-deep)}
.cad-chip[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.sub-benefits{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.sub-benefits li{display:grid;gap:2px;padding-left:19px;position:relative}
.sub-benefits li::before{content:"\2713";position:absolute;left:0;top:1px;color:var(--gold-deep);font-weight:700}
.sub-benefits strong{font-size:14.5px}
.sub-benefits span{font-size:13.5px;color:var(--grey);line-height:1.45}
.sub-save{margin:var(--s3) 0 0;padding-top:var(--s2);border-top:1px solid var(--line-soft);font-size:15px}
.sub-fine{font-size:12.5px;line-height:1.5;margin-top:9px}
.sub-grid{list-style:none;margin:var(--s4) 0 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line)}
.sub-grid li{background:var(--cardbg);padding:var(--s3);display:grid;gap:6px;align-content:start}
.sub-grid strong{font-size:17px;letter-spacing:-.01em}
.sub-grid span{font-size:14px;color:var(--muted);line-height:1.5}
.sub-cta{display:flex;gap:var(--s3);align-items:center;flex-wrap:wrap;margin-top:var(--s4)}
.sub-cta .muted{font-size:14px;max-width:44ch}

/* ---------- offer band + release stats ---------- */
.offer-sub{font-size:15px;line-height:1.55;color:#A29D94;margin-top:var(--s2);max-width:52ch}
.offer-fine{font-size:12px;line-height:1.5;color:#8A857D;margin-top:var(--s3);max-width:76ch}
.stats-note{font-size:13.5px;line-height:1.55;margin-top:var(--s3);max-width:62ch}

/* ---------- Research Use Compliance panel (DRYPtides pattern, with the receipt) ---------- */
.ruo-panel{background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--gold);
  padding:var(--s3);margin:var(--s3) 0}
.ruo-panel-h{font-size:20px;letter-spacing:-.02em;margin:0 0 5px}
.ruo-panel-sub{font-size:13.5px;color:var(--grey);margin:0 0 var(--s3)}
.ruo-lbl{display:block;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--grey);margin-bottom:6px}
.ruo-panel abbr{color:#A3241C;text-decoration:none;border:0}
.ruo-panel select,.ruo-panel input[type="text"]{width:100%;padding:11px 12px;border:1px solid var(--line);
  background:var(--white);font-family:var(--disp);font-size:15px;color:var(--ink);
  border-radius:var(--radius);margin-bottom:var(--s2)}
.ruo-panel input[type="text"][hidden]{display:none}
.ruo-check{display:flex;gap:11px;align-items:flex-start;font-size:14px;line-height:1.45;
  margin-bottom:var(--s2);color:var(--ink-soft)}
.ruo-check input{margin-top:3px;width:18px;height:18px;accent-color:var(--ink);flex:none}
.ruo-check a{text-decoration:underline;text-underline-offset:2px}
.ruo-err{background:rgba(163,36,28,.08);border-left:3px solid #A3241C;color:#8A1E17;font-size:13.5px;
  padding:10px 12px;margin:0}
.ruo-err[hidden]{display:none}
.ruo-receipt{border-top:1px solid var(--line);margin-top:var(--s2);padding-top:var(--s2)}
.ruo-receipt[hidden]{display:none}
.ruo-receipt .mono{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);
  font-weight:600;margin:0 0 9px}
.ruo-receipt dl{margin:0 0 9px;display:grid;gap:4px}
.ruo-receipt dl div{display:flex;justify-content:space-between;gap:13px;font-size:13px}
.ruo-receipt dt{color:var(--grey)}
.ruo-receipt dd{margin:0;font-family:var(--mono);font-size:12px;text-align:right}
.ruo-receipt .muted{font-size:12px;line-height:1.5}
[data-pay-stub][disabled]{opacity:.45;cursor:not-allowed}

/* ---------- discount code ---------- */
.promo{display:flex;gap:8px;flex-wrap:wrap;margin:var(--s3) 0 0;align-items:flex-start}
.promo input{flex:1;min-width:160px;padding:12px 13px;border:1px solid var(--line);background:var(--white);
  font-family:var(--mono);font-size:14px;letter-spacing:.08em;text-transform:uppercase;
  border-radius:var(--radius)}
.promo .btn-2{flex:none}
.promo-msg{width:100%;margin:0;font-size:13px;min-height:0}
.promo-msg.good{color:#2F7D4F}
.promo-msg.bad{color:#A3241C}

/* ---------- cart and checkout, BOGO lines ---------- */
.cart-bogo{margin:9px 0 0;font-size:13px;line-height:1.45;color:var(--ink-soft);
  background:var(--gold-soft);border:1px solid var(--gold-deep);padding:9px 11px}
.cart-bogo[hidden]{display:none}
.cl-free{margin:7px 0 0;font-size:12.5px;line-height:1.4;color:var(--ink-soft);display:flex;
  gap:8px;align-items:center;flex-wrap:wrap}
.co-free{color:var(--gold-deep);font-weight:600}
.co-totals div[hidden]{display:none}

/* ---------- email capture ---------- */
.capture{position:fixed;inset:0;z-index:190;display:grid;place-items:center;padding:20px}
.capture[hidden]{display:none}
.capture-scrim{position:absolute;inset:0;background:rgba(10,10,10,.66);backdrop-filter:blur(4px)}
.capture-card{position:relative;background:var(--bone);max-width:470px;width:100%;
  padding:var(--s4);border-radius:var(--radius);border-top:3px solid var(--gold);
  max-height:92vh;overflow:auto}
.capture-card h2{font-size:clamp(23px,2.8vw,30px);letter-spacing:-.03em;margin:var(--s1) 0 var(--s2)}
.capture-card p{font-size:15px;line-height:1.5;color:var(--ink-soft);margin:0}
.capture-x{position:absolute;top:11px;right:13px;background:none;border:0;font-size:26px;line-height:1;
  cursor:pointer;color:var(--grey);padding:4px 8px}
.capture-x:hover{color:var(--ink)}
.capture-form{display:flex;gap:8px;flex-wrap:wrap;margin:var(--s3) 0 var(--s2)}
.capture-form input{flex:1;min-width:170px;padding:13px;border:1px solid var(--line);
  background:var(--white);font-family:var(--disp);font-size:15px;border-radius:var(--radius)}
.capture-fine{font-size:12px!important;line-height:1.5;color:var(--grey)!important}
.capture-done{font-size:15px;line-height:1.5}

@media (max-width:680px){
  .gate-card{padding:var(--s3) var(--s3) var(--s2)}
  .gate-card h2{font-size:26px}
  .gate-perks li{font-size:13.5px}
  .gate-fda{font-size:11px}
  .sub-cta{gap:var(--s2)}
  .an-in{font-size:11px;letter-spacing:.07em}
}
.ruo-warn{background:var(--gold-soft);border-left:3px solid var(--gold-deep);font-size:13.5px;
  line-height:1.45;padding:10px 12px;margin:0 0 var(--s2);color:var(--ink-soft)}
.ruo-warn[hidden]{display:none}
.ruo-warn .tlink{background:none;border:0;padding:0;cursor:pointer;font-size:inherit}
.capture-card .bogo-tag{margin-bottom:var(--s2)}
.capture-card h2{margin-top:0}

/* ============================================================
   v10 (2026-10-24): catalog density.
   Nick: four across on desktop, two across on the phone. The v9 grid was
   auto-fill at a 340px minimum, which landed on three across at container
   width and collapsed to a single column at 760. Fixed column counts give
   a predictable shelf at every size, and the card tightens as it narrows
   so the strength chips and the add button still work at two up on a phone.
   ============================================================ */
.grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1180px){ .grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:860px){  .grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:760px){  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)} }

/* four up is a narrower card than v9 ever drew, so the card's own type steps down */
@media (min-width:861px){
  .grid .card-body{padding:var(--s3)}
  .grid .card-name{font-size:21px}
  .grid .card-desc{font-size:14px;line-height:1.5}
  .grid .qa-chip{font-size:11px;padding:5px 8px}
  .grid .card-price{font-size:21px}
}
/* two up on a phone: the tightest the card is ever drawn */
@media (max-width:760px){
  .grid .card-body{padding:var(--s2)}
  .grid .card-cat{font-size:9.5px;letter-spacing:.1em}
  .grid .card-name{font-size:17px;line-height:1.15}
  .grid .card-desc{font-size:12.5px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .grid .qa-chips{gap:4px}
  .grid .qa-chip{font-size:10px;padding:5px 6px;letter-spacing:0}
  .grid .card-price{font-size:17px}
  .grid .card-price small{font-size:9.5px;letter-spacing:.05em}
  .grid .card-price del{font-size:.72em;margin-right:4px}
  .grid .qa-add{font-size:11px;padding:11px 8px;letter-spacing:.06em}
  .grid .qa-more{font-size:11.5px}
  .grid .card-spec{display:none}
  .grid .card-tags{top:7px;left:7px;gap:4px}
  .grid .card-tag{font-size:9px;padding:4px 6px;letter-spacing:.1em}
}

/* ---------- legal documents (v10) ---------- */
.lg-version{font-family:var(--mono);font-size:12px;line-height:1.6;color:var(--grey);
  margin-top:var(--s3);padding-top:var(--s2);border-top:1px solid var(--line);max-width:72ch}
.lg-grid{display:grid;grid-template-columns:240px minmax(0,1fr);gap:var(--s5);align-items:start}
.lg-toc{position:sticky;top:104px;border-left:2px solid var(--gold);padding-left:var(--s2)}
.lg-toc .mono{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--grey);margin:0 0 11px}
.lg-toc ol{list-style:none;margin:0;padding:0;display:grid;gap:7px;counter-reset:none}
.lg-toc a{font-size:13px;line-height:1.35;color:var(--ink-soft);display:block}
.lg-toc a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.lg-body{max-width:76ch}
.lg-h{font-size:clamp(19px,2vw,23px);letter-spacing:-.02em;margin:var(--s4) 0 var(--s2);
  padding-top:var(--s2);border-top:1px solid var(--line-soft);scroll-margin-top:120px}
.lg-h:first-child{margin-top:0;padding-top:0;border-top:0}
.lg-body p{font-size:15.5px;line-height:1.65;color:var(--ink-soft);margin:0 0 var(--s2)}
.lg-body p strong{color:var(--ink)}
.lg-body a{text-decoration:underline;text-underline-offset:2px}
.lg-ul{margin:0 0 var(--s2);padding-left:21px;display:grid;gap:7px}
.lg-ul li{font-size:15.5px;line-height:1.6;color:var(--ink-soft)}
.lg-caps{font-size:13.5px!important;line-height:1.6!important;letter-spacing:.01em;
  background:var(--bone);border-left:3px solid var(--ink);padding:13px 15px;color:var(--ink)!important}
@media (max-width:980px){
  .lg-grid{grid-template-columns:1fr;gap:var(--s3)}
  .lg-toc{position:static;border-left:0;border-top:2px solid var(--gold);padding:var(--s2) 0 0}
  .lg-toc ol{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
}

/* ---------- v10 fix: the nav collapsed too late ----------
   Pre-existing since at least v8 and never caught, because QA only ever rendered at 1440 and 390.
   The header's content cannot compress below 809px once the nav stops shrinking, but the nav only
   collapsed to the burger at 760, so every viewport from 761 to 808 scrolled sideways by 41px.
   Collapsing at 860 clears it with room to spare. QA now sweeps seven widths for overflow. */
@media (max-width:860px){
  .nav{display:none}
  .nav.open{display:flex;position:absolute;top:74px;left:0;right:0;flex-direction:column;
    align-items:flex-start;gap:0;background:var(--bone);border-bottom:1px solid var(--line);
    padding:var(--s2) 20px var(--s3)}
  .nav.open a{padding:14px 0;width:100%;border-bottom:1px solid var(--line-soft);font-size:14px}
  .burger{display:inline-flex}
  .hdr-in{gap:var(--s2)}
  .cart-btn{order:3}
}