/* ===========================================================
   peptide sticks. site styles
   Display: Syne · Body: Inter · Tagline: DM Serif italic · Labels: DM Mono
   Cream + Lab Black surfaces · Peptide Yellow accent · no gradients
   =========================================================== */

:root{
  --cream:#F7F5EE;
  --cream-2:#FBFAF4;
  --cream-photo:#F2F1EB;
  --black:#0F0F0F;
  --ink:#1A1A17;
  --ink-2:#3A3A33;
  --muted:#6E6D64;
  --hair:#E4E2D9;
  --hair-2:#EFEDE4;
  --yellow:#F0E040;
  --yellow-dk:#C8BC00;

  --f-display:'Syne',sans-serif;
  --f-heading:'Inter',system-ui,-apple-system,sans-serif;
  --f-body:'Inter',system-ui,-apple-system,sans-serif;
  --f-serif:'DM Serif Display',serif;
  --f-mono:'DM Mono',ui-monospace,monospace;

  --maxw:1240px;
  --pad:clamp(20px,5vw,64px);
}

.m-gallery{display:flex;gap:8px;justify-content:center;padding:10px 14px 16px;overflow-x:auto}.m-gallery-thumb{width:52px;height:52px;padding:3px;border:1px solid rgba(15,15,15,.2);border-radius:6px;background:#fff;cursor:pointer}.m-gallery-thumb.is-active{border-color:#0f0f0f;box-shadow:inset 0 0 0 1px #0f0f0f}.m-gallery-thumb img{width:100%;height:100%;object-fit:contain;display:block}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  background:var(--cream);
  color:var(--ink);
  font-family:var(--f-body);
  font-weight:400;
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }

a:focus-visible, button:focus-visible, [role=button]:focus-visible, [tabindex]:focus-visible{
  outline:2px solid var(--yellow-dk);
  outline-offset:3px;
  border-radius:6px;
}

.wrap{ max-width:var(--maxw); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }

/* ---------- type helpers ---------- */
.serif{ font-family:var(--f-serif); font-style:italic; font-weight:400; }
.mono{ font-family:var(--f-mono); font-weight:500; letter-spacing:0.12em; text-transform:uppercase; }
.dot::after{ content:'.'; color:var(--yellow-dk); }

/* ---------- buttons ---------- */
.btn{
  font-family:var(--f-body); font-weight:600; font-size:14px; letter-spacing:0;
  padding:13px 22px; border-radius:999px; border:none; cursor:pointer;
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  transition:transform .18s ease, background .18s ease, color .18s ease;
}
.btn-yellow{ background:var(--yellow); color:var(--black); }
.btn-yellow:hover{ background:var(--yellow-dk); transform:translateY(-1px); }
.btn-black{ background:var(--black); color:#fff; }
.btn-black:hover{ background:#262620; transform:translateY(-1px); }
.btn-ghost{ background:transparent; color:var(--black); padding:13px 4px; }
.btn-ghost:hover{ color:var(--yellow-dk); }
.btn .arr{ transition:transform .18s ease; }
.btn:hover .arr{ transform:translateX(3px); }

/* ---------- announcement bar ---------- */
.announcement{
  position:sticky;
  top:0;
  z-index:70;
  background:var(--black);
  color:#fff;
  border-bottom:1px solid rgba(240,224,64,0.28);
  font-family:var(--f-body);
  font-size:14px;
  line-height:1.4;
}
.announcement-in{
  min-height:48px;
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:8px var(--pad);
}
@keyframes ann-pulse{
  0%{ box-shadow:0 0 0 0 rgba(240,224,64,0.55); }
  70%{ box-shadow:0 0 0 10px rgba(240,224,64,0); }
  100%{ box-shadow:0 0 0 0 rgba(240,224,64,0); }
}
.ann-text{ color:#fff; font-weight:500; letter-spacing:-0.005em; }
.ann-cta{
  font-family:var(--f-body); font-weight:600; font-size:13px;
  color:var(--yellow); display:inline-flex; align-items:center; gap:5px;
  padding:7px 10px; border-radius:8px; border:1px solid #34342d;
  transition:background .15s, color .15s, border-color .15s;
  white-space:nowrap;
}
.ann-cta:hover{ background:var(--yellow); color:var(--black); border-color:var(--yellow); }
@media (max-width:600px){
  .announcement-in{ min-height:54px; gap:12px; padding:7px var(--pad); }
  .ann-text{ font-size:12px; line-height:1.3; text-align:left; }
  .ann-cta{ font-size:11.5px; padding:7px 9px; }
}

/* ---------- nav ---------- */
.nav{
  position:sticky; top:0; z-index:60;
  background:rgba(247,245,238,0.88);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--hair);
}
.nav-in{ position:relative; display:flex; align-items:center; justify-content:space-between; height:68px; gap:20px; }
.brand{ display:flex; align-items:center; gap:0; }
.brand-mark{ width:126px; height:auto; display:block; }
.nav .nav-links{ position:absolute; left:50%; transform:translateX(-50%); display:flex; gap:clamp(14px,1.8vw,28px); align-items:center; }
.nav-links a{ font-family:var(--f-body); font-weight:500; font-size:14px; color:var(--ink); transition:color .15s; white-space:nowrap; }
.nav-links a:hover{ color:var(--yellow-dk); }
.nav-right{ display:flex; align-items:center; gap:16px; }
.bag{ font-family:var(--f-mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; display:inline-flex; align-items:center; gap:7px; white-space:nowrap; color:var(--muted); min-height:44px; padding:0 4px; background:transparent; border:none; cursor:pointer; }
.bag .dotmark{ width:8px; height:8px; border-radius:50%; background:var(--yellow); display:inline-block; }

/* mobile nav toggle (hamburger) */
.nav-toggle{
  display:none;
  width:44px; height:44px;
  background:transparent; border:1px solid var(--hair);
  border-radius:12px; cursor:pointer; padding:0;
  align-items:center; justify-content:center;
  transition:background .15s, border-color .15s;
}
.nav-toggle:hover{ background:#fff; border-color:var(--ink); }
.nav-toggle-bars{
  position:relative; width:18px; height:12px;
  display:inline-block;
}
.nav-toggle-bars span{
  position:absolute; left:0; right:0; height:1.6px;
  background:var(--ink); border-radius:2px;
  transition:transform .25s ease, opacity .2s ease, top .25s ease;
}
.nav-toggle-bars span:nth-child(1){ top:0; }
.nav-toggle-bars span:nth-child(2){ top:5.2px; }
.nav-toggle-bars span:nth-child(3){ top:10.4px; }
.nav-toggle.is-open .nav-toggle-bars span:nth-child(1){ top:5.2px; transform:rotate(45deg); }
.nav-toggle.is-open .nav-toggle-bars span:nth-child(2){ opacity:0; }
.nav-toggle.is-open .nav-toggle-bars span:nth-child(3){ top:5.2px; transform:rotate(-45deg); }

.nav-mobile{
  display:flex; flex-direction:column;
  padding:6px var(--pad) 18px;
  border-top:1px solid var(--hair);
  background:rgba(247,245,238,0.96);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  animation:nav-mobile-in .22s ease;
}
.nav-mobile[hidden]{ display:none; }
.nav-mobile a{
  font-family:var(--f-heading); font-weight:500; font-size:17px;
  letter-spacing:-0.012em; color:var(--ink);
  padding:14px 4px;
  border-bottom:1px solid var(--hair-2);
  display:flex; align-items:center; justify-content:space-between;
  transition:color .15s, padding .15s;
}
.nav-mobile a:hover{ color:var(--yellow-dk); }
.nav-mobile a:last-child{ border-bottom:none; }
.nav-mobile a::after{
  content:'→'; color:var(--muted);
  font-family:var(--f-body); font-weight:400;
  transition:transform .15s, color .15s;
}
.nav-mobile a:hover::after{ color:var(--ink); transform:translateX(2px); }
@keyframes nav-mobile-in{ from{ opacity:0; transform:translateY(-4px); } to{ opacity:1; transform:none; } }
body.nav-mobile-open{ overflow:hidden; }

@media (max-width:1100px){
  .nav .nav-links{ display:none; }
  .nav-toggle{ display:inline-flex; }
  .nav-shop-cta{ display:none; }
}
@media (min-width:1101px){
  .nav-mobile{ display:none !important; }
}

/* ---------- hero ---------- */
.hero{ padding:clamp(40px,5.5vw,72px) 0 clamp(48px,6vw,80px); }
.hero-grid{ display:grid; grid-template-columns:1.35fr 0.65fr; gap:clamp(28px,5vw,72px); align-items:center; }
.eyebrow{ font-family:var(--f-mono); font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted); margin-bottom:24px; display:flex; align-items:center; gap:10px; }
.eyebrow::before{ content:''; width:24px; height:1.5px; background:var(--yellow); }
.hero h1{
  font-family:var(--f-heading); font-weight:700;
  letter-spacing:-0.025em; line-height:1.14;
  font-size:clamp(42px,5.6vw,76px);
  color:var(--black);
}
.hero h1 em{ font-family:var(--f-serif); font-style:italic; font-weight:400; letter-spacing:-0.005em; }
.hero h1 .hl{ position:relative; display:inline-block; padding:0 0.05em; }
.hero h1 .hl::before{
  content:''; position:absolute; left:-0.04em; right:-0.04em;
  top:42%; bottom:-2%;
  background:var(--yellow);
  border-radius:6px 14px 8px 18px / 10px 8px 14px 6px;
  transform:rotate(-1.2deg) skewX(-4deg);
  z-index:0;
}
.hero h1 .hl-text{ position:relative; z-index:1; font-family:var(--f-heading); font-style:normal; }
.hero-tag{
  font-family:var(--f-serif); font-style:italic; font-weight:400;
  font-size:clamp(18px,1.7vw,22px); line-height:1.3;
  color:var(--ink); margin:18px 0 0; letter-spacing:-0.005em;
}
.hero-tag em{ font-style:italic; }
.hero-sub{
  font-family:var(--f-body); font-weight:400;
  font-size:clamp(16.5px,1.6vw,19px); line-height:1.55;
  color:var(--ink-2); margin:10px 0 30px; max-width:44ch;
}
.hero-cta{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.hero-fineprint{
  margin:20px 0 0;
  font-family:var(--f-mono);
  font-size:10.5px; letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--ink-2);
}
.hero-reserve-note{
  margin:16px 0 0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px 0;
  max-width:620px;
  color:var(--ink-2);
}
.hero-reserve-note span{
  font-family:var(--f-body);
  font-size:13.5px;
  line-height:1.45;
  color:inherit;
  display:inline-flex;
  align-items:center;
}
.hero-reserve-note span:first-child{ color:var(--ink); font-weight:600; }
.hero-reserve-note span:not(:last-child)::after{
  content:"";
  width:3px;
  height:3px;
  border-radius:50%;
  background:var(--yellow-dk);
  margin:0 10px;
  opacity:.75;
}
.hero-pills{
  list-style:none; padding:0; margin:22px 0 0;
  display:flex; flex-wrap:wrap; gap:8px 10px;
}
.hero-pills li{
  display:inline-flex; align-items:center; gap:7px;
  background:#fff; border:1px solid var(--hair);
  border-radius:999px; padding:7px 13px 7px 9px;
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--ink);
}
.hero-pills .hp-ic{
  width:16px; height:16px; border-radius:50%;
  background:var(--yellow); color:var(--black);
  font-size:10px; font-weight:700; line-height:1;
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--f-body); letter-spacing:0;
}
.hero-trust{ display:flex; gap:8px 22px; flex-wrap:wrap; margin-top:32px; }
.hero-trust span{ font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted); display:flex; align-items:center; gap:8px; }
.hero-trust span::before{ content:''; width:5px; height:5px; border-radius:50%; background:var(--yellow); }

/* pre-order eyebrow */
.eyebrow-preorder{
  background:#fff;
  border:1px solid var(--hair);
  border-radius:999px;
  padding:7px 14px 7px 11px;
  display:inline-flex;
  width:fit-content;
  gap:8px;
  color:var(--ink);
  font-size:11px;
  letter-spacing:0.14em;
}
.eyebrow-preorder::before{ display:none; }
.eb-dot{
  width:7px; height:7px; border-radius:50%; background:#1f9c5a;
  box-shadow:0 0 0 0 rgba(31,156,90,0.4);
  animation:eb-pulse 2s ease-out infinite;
}
@keyframes eb-pulse{
  0%{ box-shadow:0 0 0 0 rgba(31,156,90,0.4); }
  70%{ box-shadow:0 0 0 8px rgba(31,156,90,0); }
  100%{ box-shadow:0 0 0 0 rgba(31,156,90,0); }
}
.eb-sep{ color:var(--muted); padding:0 2px; }
.eb-sm{ display:none; }
@media (max-width:600px){
  .eb-lg{ display:none; }
  .eb-sm{ display:inline; }
}
@media (prefers-reduced-motion:reduce){ .eb-dot{ animation:none; } }

/* hero launch-run tag */
.hero-batch{
  position:absolute; top:14px; left:14px; z-index:2;
  background:var(--yellow);
  color:var(--black);
  font-family:var(--f-mono);
  font-size:9.5px; letter-spacing:0.14em; text-transform:uppercase;
  padding:6px 10px; border-radius:999px;
  font-weight:500;
}

.hero-photo{
  position:relative;
  --hero-accent:var(--yellow);
  background:var(--cream-photo);
  border-radius:24px;
  overflow:hidden;
  width:100%;
  max-width:300px;
  aspect-ratio:3/4;
  margin-left:auto;
  display:flex; align-items:center; justify-content:center;
}
.hero-photo[role="button"]{ cursor:pointer; }
.hero-photo[role="button"]:focus-visible{
  outline:2px solid var(--black);
  outline-offset:4px;
}
.hero-photo img{
  width:auto; height:auto;
  max-width:88%; max-height:92%;
  object-fit:contain;
}
.hero-photo-barrier{
  --hero-accent:#F06A00;
  background:#F3EEE9;
}
.hero-photo-barrier img{
  width:100%; height:100%;
  max-width:100%; max-height:100%;
  object-fit:cover; object-position:center;
}
.hero-photo .tag{
  position:absolute; left:14px; bottom:14px; background:#fff; border-radius:10px; padding:9px 12px;
  box-shadow:0 10px 28px -12px rgba(20,40,30,.25); display:flex; flex-direction:column; gap:2px;
}
.hero-photo .tag .n{ font-family:var(--f-heading); font-weight:700; font-size:13px; letter-spacing:-0.015em; }
.hero-photo .tag .dot::after{ color:var(--hero-accent); }
.hero-photo .tag .p{ font-family:var(--f-mono); font-size:10px; letter-spacing:0.08em; color:var(--muted); }
.hero-blob{ position:absolute; width:64px; height:64px; border-radius:50%; background:var(--hero-accent); top:-14px; right:-14px; z-index:0; }
@media (max-width:820px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-photo{ order:-1; max-width:260px; margin:0 auto; }
}

/* ---------- marquee ---------- */
.marquee{ background:var(--black); color:#fff; overflow:hidden; padding:16px 0; }
.marquee-track{ display:flex; gap:0; width:max-content; animation:scroll 32s linear infinite; }
.marquee-track span{ font-family:var(--f-heading); font-weight:600; font-size:18px; letter-spacing:-0.015em; padding:0 22px; display:flex; align-items:center; gap:22px; white-space:nowrap; }
.marquee-track span::after{ content:''; width:7px; height:7px; border-radius:50%; background:var(--yellow); }
@keyframes scroll{ to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .marquee-track{ animation:none; } }

/* ---------- sections ---------- */
.section{ padding:clamp(56px,8vw,112px) 0; }
.sec-head{ max-width:680px; margin-bottom:clamp(36px,4vw,56px); }
.sec-kicker{ font-family:var(--f-mono); font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); margin-bottom:16px; display:flex; align-items:center; gap:10px; }
.sec-kicker::before{ content:''; width:22px; height:1.5px; background:var(--yellow); }
.sec-title{
  font-family:var(--f-heading); font-weight:700;
  letter-spacing:-0.025em; line-height:1.16;
  font-size:clamp(28px,3.6vw,46px); color:var(--black);
}
.sec-title em{ font-family:var(--f-serif); font-style:italic; font-weight:400; }
.sec-lead{
  font-family:var(--f-body); font-weight:400;
  font-size:clamp(16px,1.5vw,18px); line-height:1.6;
  color:var(--ink-2); margin-top:16px; max-width:58ch;
}

/* ---------- format / how ---------- */
.format-grid{ display:grid; grid-template-columns:0.95fr 1.05fr; gap:clamp(32px,5vw,72px); align-items:center; }
.format-copy{ max-width:560px; justify-self:center; }
.format-intro{ max-width:540px; margin:0 auto 0; text-align:center; }
.format-copy .sec-kicker{ justify-content:center; }
.format-copy .sec-kicker::before{ display:none; }
.format-copy .sec-title{ max-width:13ch; margin:0 auto; }
.format-copy .sec-lead{ max-width:45ch; margin-left:auto; margin-right:auto; }
.format-photo{
  position:relative;
  background:#fff;
  border:1px solid var(--hair);
  border-radius:26px;
  max-width:520px;
  aspect-ratio:5/4;
  overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
button.format-photo{
  width:100%; padding:0; margin:0;
  font:inherit; color:inherit; text-align:left;
  cursor:pointer;
}
button.format-photo:focus{ outline:none; }
button.format-photo:focus-visible{ outline:none; }
.format-photo img{
  display:block;
  width:100%; height:100%;
  object-fit:cover;
}
/* ============ IMAGE LIGHTBOX ============ */
.img-lightbox{
  position:fixed; inset:0; z-index:1100;
  display:flex; align-items:center; justify-content:center;
  padding:32px;
  opacity:0; transition:opacity .2s ease;
}
.img-lightbox.is-open{ opacity:1; }
.img-lightbox[hidden]{ display:none !important; }
.img-lightbox-backdrop{
  position:absolute; inset:0;
  background:rgba(15,15,15,0.72);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border:0; padding:0; margin:0;
  cursor:zoom-out;
}
.img-lightbox-figure{
  position:relative; margin:0;
  max-width:min(96vw, 1400px);
  max-height:92vh;
  display:flex; align-items:center; justify-content:center;
  transform:scale(0.985); transition:transform .25s cubic-bezier(.2,.7,.3,1);
}
.img-lightbox.is-open .img-lightbox-figure{ transform:scale(1); }
.img-lightbox-img{
  display:block;
  max-width:100%; max-height:92vh;
  width:auto; height:auto;
  object-fit:contain;
  border-radius:18px;
  box-shadow:0 30px 80px -20px rgba(0,0,0,0.6);
  background:#fff;
}
.img-lightbox-close{
  position:absolute; top:-14px; right:-14px;
  width:44px; height:44px; border-radius:50%;
  background:#fff; color:var(--black);
  border:0; cursor:pointer;
  font-size:24px; line-height:1;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px -10px rgba(0,0,0,0.5);
  transition:transform .2s ease, background .2s ease;
}
.img-lightbox-close:hover{ background:var(--yellow); transform:rotate(90deg); }
.img-lightbox-close:focus-visible{ outline:2px solid var(--yellow-dk); outline-offset:2px; }
@media (max-width:640px){
  .img-lightbox{ padding:16px; }
  .img-lightbox-figure{ max-width:100vw; }
  .img-lightbox-close{ top:8px; right:8px; width:40px; height:40px; font-size:22px; }
}
@media (prefers-reduced-motion:reduce){
  .img-lightbox, .img-lightbox-figure{ transition:none; }
  .img-lightbox-close:hover{ transform:none; }
}
.format-tag{
  position:absolute; bottom:18px; left:18px;
  background:var(--yellow); color:var(--black);
  padding:8px 14px; border-radius:999px;
  font-size:10.5px; letter-spacing:0.12em;
}
.steps{ display:flex; flex-direction:column; gap:0; margin-top:28px; }
.step{ display:grid; grid-template-columns:auto 1fr; gap:22px; padding:22px 0; border-top:1px solid var(--hair); align-items:start; }
.step .no{ font-family:var(--f-mono); font-size:12px; letter-spacing:0.1em; color:var(--yellow-dk); padding-top:5px; min-width:30px; }
.step h3{ font-family:var(--f-heading); font-weight:700; font-size:clamp(20px,2.2vw,26px); letter-spacing:-0.02em; color:var(--black); line-height:1.15; }
.step p{ font-family:var(--f-body); font-size:15px; line-height:1.55; color:var(--muted); margin-top:6px; max-width:46ch; }
@media (max-width:820px){
  .format-grid{ grid-template-columns:1fr; }
  .format-photo{ max-width:440px; margin:0 auto; }
  .format-copy{ justify-self:stretch; max-width:none; }
  .format-intro{ max-width:560px; }
  .format-copy .sec-title{ max-width:14ch; }
}

/* ---------- roadmap / where we are ---------- */
.roadmap{
  background:var(--cream);
  border-top:1px solid var(--hair);
  border-bottom:1px solid var(--hair);
  position:relative; overflow:hidden;
}
.roadmap::before{
  content:''; position:absolute; pointer-events:none;
  right:-180px; top:60px;
  width:360px; height:360px; border-radius:50%;
  background:radial-gradient(circle, rgba(240,224,64,0.10) 0%, transparent 65%);
  filter:blur(8px);
}
.timeline{
  list-style:none; padding:0;
  margin:clamp(40px,5vw,64px) auto 0;
  max-width:1120px;
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
}
.timeline::before{
  content:'';
  position:absolute;
  top:11px;
  left:12.5%;
  right:12.5%;
  height:1px;
  background:var(--hair);
}
.tl-step{
  display:grid;
  grid-template-rows:24px 1fr;
  gap:18px;
  padding:0 10px;
  position:relative;
  min-width:0;
}

.tl-rail{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:1;
}
.tl-line{
  display:none;
}
.tl-marker{
  position:relative;
  width:14px; height:14px;
  flex:none; z-index:2;
}
.tl-orb{
  position:absolute; inset:0;
  border-radius:50%;
  background:var(--cream);
  border:1.5px solid var(--hair);
  transition:background .3s, border-color .3s, transform .3s;
}
.tl-step.is-current .tl-orb{
  background:var(--yellow);
  border-color:var(--yellow-dk);
  transform:scale(1.15);
  box-shadow:0 0 0 4px rgba(240,224,64,0.12);
}
.tl-pulse{
  position:absolute; inset:-10px;
  border-radius:50%;
  background:rgba(240,224,64,0.35);
  opacity:0;
  animation:tl-pulse 2.4s ease-out infinite;
  z-index:1;
}
@keyframes tl-pulse{
  0%{ opacity:0.45; transform:scale(0.55); }
  100%{ opacity:0; transform:scale(1.8); }
}
@media (prefers-reduced-motion:reduce){
  .tl-pulse{ animation:none; }
  .tl-step.reveal{ opacity:1 !important; transform:none !important; }
}

.tl-content{
  background:#fff;
  border:1px solid var(--hair);
  border-radius:16px;
  padding:20px 20px 22px;
  min-height:100%;
}
.tl-step.is-current .tl-content{
  border-color:rgba(200,188,0,0.42);
  background:#fffef3;
}
.tl-meta{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-bottom:14px;
  font-family:var(--f-mono);
  font-size:10.5px; letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--muted);
}
.tl-no{ color:var(--ink-2); font-weight:500; }
.tl-status{
  background:var(--hair-2); color:var(--ink-2);
  padding:4px 10px; border-radius:999px;
  letter-spacing:0.12em; font-size:9.5px;
}
.tl-step.is-current .tl-status{
  background:var(--yellow); color:var(--black);
}
.tl-when{
  font-family:var(--f-serif);
  font-style:italic; font-weight:400;
  font-size:clamp(28px,3vw,36px);
  letter-spacing:-0.012em;
  line-height:1.0;
  color:var(--black);
  margin:0 0 10px;
}
.tl-when em{ font-style:italic; }
.tl-step:nth-child(4) .tl-when{
  font-size:clamp(25px,2.6vw,32px);
  white-space:nowrap;
}
.tl-title{
  font-family:var(--f-heading);
  font-weight:600;
  font-size:clamp(16px,1.5vw,18px);
  letter-spacing:-0.01em;
  line-height:1.3;
  color:var(--ink);
  margin:0 0 10px;
}
.tl-body{
  font-family:var(--f-body);
  font-size:14px; line-height:1.58;
  color:var(--muted);
  margin:0;
}
.tl-step.is-current .tl-body{ color:var(--ink-2); }

/* reveal animation */
.tl-step.reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
.tl-step.reveal.in{ opacity:1; transform:translateY(0); }
.tl-step.reveal:nth-child(2){ transition-delay:.05s; }
.tl-step.reveal:nth-child(3){ transition-delay:.1s; }
.tl-step.reveal:nth-child(4){ transition-delay:.15s; }

/* promise cards under timeline */
.tl-promise{
  margin:clamp(48px,6vw,80px) auto 0;
  max-width:1120px;
  border-top:1px solid var(--hair);
  padding-top:clamp(32px,3.5vw,44px);
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(20px,2.5vw,36px);
  opacity:0; transform:translateY(18px);
  transition:opacity .7s ease, transform .7s ease;
}
.tl-promise.in{ opacity:1; transform:translateY(0); }
.tl-promise-card{ text-align:left; }
.tl-promise-k{
  font-family:var(--f-serif);
  font-style:italic; font-weight:400;
  font-size:clamp(20px,2.2vw,26px);
  letter-spacing:-0.01em;
  color:var(--black);
  margin-bottom:10px;
  line-height:1.1;
}
.tl-promise-k em{ font-style:italic; }
.tl-promise-v{
  font-family:var(--f-body);
  font-size:13.5px; line-height:1.6;
  color:var(--muted);
}

@media (max-width:720px){
  .timeline{
    grid-template-columns:repeat(4,minmax(228px,1fr));
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    margin-left:calc(var(--pad) * -1);
    margin-right:calc(var(--pad) * -1);
    padding:0 var(--pad) 12px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    /* fade edges to hint at scrolling */
    mask-image:linear-gradient(to right, transparent 0, #000 calc(var(--pad) + 4px), #000 calc(100% - var(--pad) - 4px), transparent 100%);
    -webkit-mask-image:linear-gradient(to right, transparent 0, #000 calc(var(--pad) + 4px), #000 calc(100% - var(--pad) - 4px), transparent 100%);
  }
  .timeline::-webkit-scrollbar{ display:none; }
  .timeline::before{
    left:calc(var(--pad) + 114px);
    right:calc(var(--pad) + 114px);
  }
  .tl-step{
    padding:0 8px;
    scroll-snap-align:start;
  }
  .tl-content{ border-radius:14px; padding:18px; }
  .tl-when{ font-size:29px; }
  .tl-promise{ grid-template-columns:1fr; gap:22px; padding-top:32px; }
  .roadmap::before{ display:none; }
  /* hint chip to indicate horizontal scroll */
  .roadmap .wrap > .sec-head + .timeline::after{ content:''; }
  .roadmap .sec-head-center::after{
    content:'Swipe →';
    display:inline-block;
    margin-top:14px;
    font-family:var(--f-mono); font-size:10px; letter-spacing:0.14em;
    text-transform:uppercase; color:var(--muted);
    padding:5px 10px; border:1px solid var(--hair); border-radius:999px;
    background:#fff;
  }
}

/* ---------- shop ---------- */
.shop-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap; margin-bottom:clamp(28px,3.5vw,44px); }
.shop-disclosure{
  max-width:680px;
  margin-top:12px;
  font-size:13.5px;
  line-height:1.55;
  color:var(--muted);
}
.chips{ display:flex; gap:8px; flex-wrap:wrap; }
.chip{ font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; padding:8px 14px; border-radius:999px; border:1px solid var(--hair); background:#fff; color:var(--ink); cursor:pointer; transition:.15s; }
.chip:hover{ border-color:var(--ink); }
.chip.active{ background:var(--black); color:#fff; border-color:var(--black); }

.grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.8vw,24px); }
@media (max-width:760px){ .grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* ---------- product cards (image-based) ---------- */
.sku{
  position:relative;
  background:#fff;
  border:1px solid var(--hair);
  border-radius:18px;
  overflow:hidden;
  cursor:pointer;
  display:flex; flex-direction:column;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.sku[hidden]{ display:none; }
.sku:hover{
  transform:translateY(-6px);
  border-color:var(--hair-2);
  box-shadow:0 1px 2px rgba(20,40,30,.06), 0 32px 50px -28px rgba(20,40,30,.4);
}
.sku-photo{
  position:relative;
  background:var(--cream-photo);
  aspect-ratio:3/2;
  display:flex; align-items:center; justify-content:center;
  padding:0;
  overflow:hidden;
}
.sku-photo img{
  width:100%; height:100%;
  object-fit:cover;
  transition:transform .3s ease;
}
.sku:hover .sku-photo img{ transform:translateY(-3px) scale(1.02); }
.sku-info{
  padding:20px 22px 16px;
  display:flex; flex-direction:column; gap:8px;
  flex:1;
}
.sku-name{
  font-family:var(--f-display); font-weight:700;
  letter-spacing:0; line-height:1.14;
  font-size:clamp(18px,1.5vw,22px);
  color:var(--black);
  max-width:100%;
  overflow-wrap:normal;
  word-break:normal;
  white-space:nowrap;
  hyphens:none;
  -webkit-hyphens:none;
}
.sku-best{
  font-family:var(--f-body);
  font-size:13px;
  line-height:1.4;
  color:var(--ink-2);
}
.sku-inci{
  font-family:var(--f-mono); font-size:9.5px;
  letter-spacing:0.12em; text-transform:uppercase;
  color:var(--muted); margin-top:auto; padding-top:8px;
  line-height:1.5;
}
.sku-pep{
  display:inline-flex; align-items:center; gap:7px;
  font-family:var(--f-body); font-size:12.5px; letter-spacing:0;
  text-transform:none; color:var(--ink); font-weight:600;
  padding:5px 11px; border-radius:999px;
  background:rgba(240,224,64,0.22);
  border:1px solid rgba(200,188,0,0.32);
  width:fit-content;
  font-weight:500;
  margin-bottom:2px;
}
.sku-pep-dot{
  width:6px; height:6px; border-radius:50%; background:var(--yellow-dk);
}
.sku-band{
  background:var(--yellow); padding:14px 18px;
  display:flex; justify-content:center; align-items:center; gap:12px;
}
.sku-band .meta{ font-family:var(--f-mono); font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--black); white-space:nowrap; }
.sku-band .add{ font-family:var(--f-heading); font-weight:700; font-size:13px; letter-spacing:-0.005em; color:var(--black); display:inline-flex; align-items:center; gap:5px; white-space:nowrap; flex:none; }
.sku-band .add .arr{ transition:transform .18s ease; }
.sku:hover .sku-band .add .arr{ transform:translateX(3px); }

/* ---------- section-dark (shared dark surface for why-peptides etc.) ---------- */
.section-dark{ background:var(--black); color:#fff; }
.section-dark .sec-kicker{ color:rgba(240,224,64,0.85); }
.section-dark .sec-kicker::before{ background:rgba(240,224,64,0.55); }
.section-dark .sec-title{ color:#fff; }
.section-dark .sec-lead{ color:#b4b4ab; }
.pv-head{ margin-bottom:clamp(28px,3.5vw,44px); }

/* ---------- trust band ---------- */
.trust-band{ background:var(--cream-2); }
.trust-quote{
  max-width:68ch; margin:0 auto;
  text-align:center;
  padding-bottom:clamp(28px,3.5vw,44px);
  border-bottom:1px solid var(--hair);
  position:relative;
}
.tq-text{
  font-family:var(--f-serif); font-style:italic;
  font-size:clamp(18px,2.1vw,23px); line-height:1.5;
  color:var(--ink); padding-top:38px; position:relative;
}
.tq-text::before{
  content:'\201C';
  font-family:var(--f-serif); font-size:76px;
  position:absolute; top:-10px; left:50%; transform:translateX(-50%);
  color:var(--yellow); line-height:1; pointer-events:none;
}
.tq-source{ margin-top:18px; }
.tq-name{
  display:block;
  font-family:var(--f-heading); font-weight:700;
  font-size:14px; letter-spacing:-0.01em; color:var(--black);
}
.tq-role{
  display:block;
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--muted); margin-top:4px;
}
.trust-badges{
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
  margin-top:clamp(28px,3.5vw,44px);
}
.tb-item{
  display:flex; flex-direction:column; gap:6px;
  align-items:center; text-align:center;
}
.tb-n{
  font-family:var(--f-heading); font-weight:700;
  font-size:clamp(26px,2.8vw,34px);
  letter-spacing:-0.025em; color:var(--black); line-height:1;
}
.tb-l{
  font-family:var(--f-body); font-size:13px; line-height:1.45;
  color:var(--muted); max-width:24ch;
}
@media (max-width:600px){
  .trust-badges{ grid-template-columns:1fr; gap:20px; }
  .tb-item{ align-items:flex-start; text-align:left; flex-direction:row; gap:14px; }
  .tb-n{ font-size:24px; min-width:48px; }
}

/* ---------- science (dark) ---------- */
.science{ background:var(--black); color:#fff; }
.science .sec-kicker{ color:rgba(240,224,64,0.85); }
.science .sec-kicker::before{ background:rgba(240,224,64,0.55); }
.science .sec-title{ color:#fff; }
.science .sec-lead{ color:#b4b4ab; }

.science-head{
  max-width:760px;
  margin-left:auto; margin-right:auto;
  text-align:center;
  padding-bottom:clamp(18px,2vw,28px);
  border-bottom:1px solid #232320;
}
.science-head .sec-kicker{
  justify-content:center;
  margin-bottom:22px;
  font-size:10.5px; letter-spacing:0.22em;
}
.science-head .sec-kicker::before,
.science-head .sec-kicker::after{
  content:''; width:34px; height:1px;
  background:rgba(240,224,64,0.45);
}
.science-head .sec-title{
  font-family:var(--f-heading); font-weight:600;
  font-size:clamp(34px,4.4vw,58px);
  letter-spacing:-0.028em; line-height:1.08;
  margin:0 auto;
  max-width:18ch;
}
.science-head .sec-title em{
  font-family:var(--f-serif); font-style:italic; font-weight:400;
  color:rgba(255,255,255,0.78);
  letter-spacing:-0.01em;
}
.science-head .sec-lead{
  margin:22px auto 0;
  max-width:54ch;
  font-size:16px; line-height:1.65;
  color:#a8a89e;
}
.actives{ display:grid; grid-template-columns:repeat(2,1fr); gap:0; margin-top:clamp(36px,4vw,56px); border-top:1px solid #2a2a26; }
.act{ padding:28px 4px; border-bottom:1px solid #2a2a26; display:grid; grid-template-columns:auto 1fr; gap:24px; align-items:start; }
.act:nth-child(odd){ padding-right:36px; border-right:1px solid #2a2a26; }
.act:nth-child(even){ padding-left:36px; }
.act .inci{ font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--yellow); white-space:nowrap; padding-top:6px; min-width:140px; }
.act h4{ font-family:var(--f-heading); font-weight:700; font-size:clamp(18px,1.9vw,22px); letter-spacing:-0.02em; line-height:1.2; }
.act p{ font-family:var(--f-body); font-size:14.5px; line-height:1.6; color:#b4b4ab; margin-top:7px; }
@media (max-width:760px){
  .actives{ grid-template-columns:1fr; }
  .act:nth-child(odd){ padding-right:4px; border-right:none; }
  .act:nth-child(even){ padding-left:4px; }
  .chip,
  .routine .rfoot .btn,
  .signup .btn{ min-height:44px; }
  .fcol a{ min-height:44px; display:flex; align-items:center; }
}

/* ---------- routines ---------- */
.routines{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,24px); }
.routine{
  position:relative;
  background:#fff; border:1px solid var(--hair); border-radius:22px;
  padding:28px 26px; display:flex; flex-direction:column;
  cursor:pointer;
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.routine:focus-visible{ outline:3px solid var(--yellow); outline-offset:4px; }
.rsave{
  position:absolute; top:-12px; right:22px;
  background:var(--yellow); color:var(--black);
  font-family:var(--f-body); font-weight:700; font-size:11.5px;
  letter-spacing:0.01em; padding:6px 11px; border-radius:999px;
  box-shadow:0 6px 18px -6px rgba(200,188,0,0.6);
}
.rstrike{ color:var(--muted); text-decoration:line-through; font-weight:500; }
.routine:hover{ transform:translateY(-4px); box-shadow:0 26px 44px -30px rgba(20,40,30,.4); border-color:var(--hair-2); }
.routine .rname{ font-family:var(--f-heading); font-weight:700; font-size:clamp(22px,2.3vw,26px); letter-spacing:-0.02em; line-height:1.24; color:var(--black); }
.routine .rsub{ font-family:var(--f-serif); font-style:italic; font-size:15.5px; color:var(--muted); margin-top:6px; }
.routine-points{
  list-style:none;
  padding:0;
  margin:16px 0 0;
  display:grid;
  gap:7px;
}
.routine-points li{
  font-family:var(--f-body);
  font-size:13px;
  line-height:1.35;
  color:var(--ink-2);
  display:flex;
  align-items:flex-start;
  gap:8px;
}
.routine-points li::before{
  content:"";
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--yellow-dk);
  flex:none;
  margin-top:7px;
}

/* mini product tubes (image-based) inside routine cards */
.mini-tubes{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:24px 0; }
.mt{
  position:relative;
  background:var(--cream-photo);
  border-radius:12px;
  aspect-ratio:3/4;
  display:flex; align-items:center; justify-content:center;
  padding:10px;
  overflow:hidden;
}
.mt img{
  width:100%; height:100%;
  object-fit:cover;
}

.routine .rfoot{ margin-top:auto; display:flex; align-items:center; justify-content:center; gap:16px; padding-top:18px; border-top:1px solid var(--hair); }
.routine .rprice{ display:flex; flex-direction:column; align-items:flex-start; gap:4px; min-width:82px; color:var(--ink); }
.routine .rdeposit{ font-family:var(--f-mono); font-size:10px; letter-spacing:0.1em; line-height:1; text-transform:uppercase; color:var(--muted); }
.routine .rprice-line{ display:flex; align-items:baseline; gap:7px; line-height:1; white-space:nowrap; }
.routine .rprice b{ font-family:var(--f-heading); font-weight:700; font-size:22px; letter-spacing:-0.03em; }
.routine .rprice .rstrike{ font-family:var(--f-body); font-size:12px; letter-spacing:0; }
.routine .rfoot .btn{ flex-shrink:0; justify-content:center; min-width:214px; padding-inline:20px; font-size:13px; }
@media (max-width:860px){ .routines{ grid-template-columns:1fr; max-width:480px; } }

/* ---------- routine modal ---------- */
.routine-modal{ position:fixed; inset:0; z-index:110; display:grid; place-items:center; padding:24px; }
.routine-modal[hidden]{ display:none; }
.routine-modal-backdrop{
  position:absolute; inset:0; width:100%; height:100%; border:0;
  background:rgba(17,17,14,.7); cursor:default;
  backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px);
  animation:fade-in .18s ease;
}
.routine-modal-panel{
  position:relative; z-index:1; width:min(1060px,100%); max-height:calc(100dvh - 48px);
  display:grid; grid-template-columns:minmax(390px,.92fr) minmax(430px,1.08fr);
  overflow:auto; background:#fff; color:var(--ink); border-radius:16px;
  box-shadow:0 24px 70px rgba(0,0,0,.3); animation:modal-in .24s ease-out;
}
.routine-modal-close{
  position:absolute; z-index:4; top:14px; right:14px; width:36px; height:36px;
  display:grid; place-items:center; border:1px solid rgba(20,20,15,.12); border-radius:50%;
  background:#fff; color:var(--black); font:600 22px/1 var(--f-body); cursor:pointer;
  transition:background .15s ease, border-color .15s ease;
}
.routine-modal-close:hover{ background:var(--cream); border-color:rgba(20,20,15,.24); }
.routine-modal-stage{
  position:relative; min-height:680px; padding:42px 38px 30px; overflow:hidden;
  display:flex; flex-direction:column; justify-content:space-between;
  background:var(--black); color:#fff;
}
.rm-stage-copy{ position:relative; z-index:2; max-width:310px; }
.rm-stage-copy span{
  font:500 10px/1.2 var(--f-mono); letter-spacing:.13em; text-transform:uppercase; color:var(--yellow);
}
.rm-stage-copy p{ margin-top:12px; font:400 19px/1.35 var(--f-serif); font-style:italic; color:#deded5; }
.rm-products{
  position:absolute; inset:120px 12px 52px; display:flex; align-items:center; justify-content:center;
}
.rm-product{ position:absolute; width:31%; height:78%; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.rm-product:nth-child(1){ transform:translateX(-105px) rotate(-7deg); z-index:1; }
.rm-product:nth-child(2){ transform:translateY(-13px); z-index:3; }
.rm-product:nth-child(3){ transform:translateX(105px) rotate(7deg); z-index:2; }
.rm-product img{ width:100%; height:100%; object-fit:cover; filter:drop-shadow(0 18px 20px rgba(0,0,0,.35)); }
.rm-product span{ position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.rm-swipe-note{ position:relative; z-index:2; margin:0; font:400 11px/1.3 var(--f-mono); letter-spacing:.08em; color:#97978e; }
.routine-modal-body{ padding:48px 50px 34px; display:flex; flex-direction:column; }
.rm-heading{ padding-right:28px; }
.rm-set-label{ margin:0 0 12px; font:500 10px/1.2 var(--f-mono); letter-spacing:.13em; text-transform:uppercase; color:var(--muted); }
.rm-heading h3{ margin:0; max-width:440px; font:700 clamp(30px,3.5vw,44px)/1.04 var(--f-heading); letter-spacing:-.035em; color:var(--black); }
.rm-heading > p:last-child{ margin:16px 0 0; max-width:48ch; font:400 15px/1.6 var(--f-body); color:var(--ink-2); }
.rm-plan{ margin-top:28px; border-top:1px solid var(--hair); border-bottom:1px solid var(--hair); padding:22px 0; }
.rm-plan-head{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:15px; }
.rm-plan h4,.rm-fit h4{ margin:0; font:700 15px/1.2 var(--f-heading); color:var(--black); }
.rm-plan-head span{ font:500 9px/1 var(--f-mono); letter-spacing:.12em; color:var(--muted); }
.rm-plan ol{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:auto 1fr; gap:10px 16px; }
.rm-plan li{ display:grid; grid-template-columns:subgrid; grid-column:1/-1; align-items:baseline; font:400 13px/1.5 var(--f-body); color:var(--ink-2); }
.rm-plan li b{ font:500 9px/1.5 var(--f-mono); letter-spacing:.08em; text-transform:uppercase; color:var(--yellow-dk); white-space:nowrap; }
.rm-plan li strong{ color:var(--black); font-weight:650; }
.rm-fit{ padding:22px 0 24px; }
.rm-fit ul{ margin:12px 0 0; padding:0; list-style:none; display:grid; gap:9px; }
.rm-fit li{ position:relative; padding-left:16px; font:400 13px/1.45 var(--f-body); color:var(--ink-2); }
.rm-fit li::before{ content:""; position:absolute; left:0; top:7px; width:5px; height:5px; border-radius:50%; background:var(--yellow-dk); }
.rm-footer{ margin-top:auto; display:grid; grid-template-columns:1fr auto; align-items:center; gap:14px 20px; padding-top:20px; border-top:1px solid var(--hair); }
.rm-price{ display:flex; flex-direction:column; gap:3px; }
.rm-price strong{ font:700 21px/1.15 var(--f-heading); color:var(--black); }
.rm-price span{ font:400 11px/1.35 var(--f-body); color:var(--muted); }
.rm-footer .btn{ min-width:205px; justify-content:center; border-radius:10px; }
.rm-footer > p{ grid-column:1/-1; margin:0; font:400 10.5px/1.4 var(--f-body); color:var(--muted); text-align:right; }
@media (max-width:820px){
  .routine-modal{ padding:14px; }
  .routine-modal-panel{ width:min(520px,100%); max-height:calc(100dvh - 28px); grid-template-columns:1fr; }
  .routine-modal-stage{ min-height:280px; padding:28px 24px 20px; }
  .rm-stage-copy{ max-width:280px; }
  .rm-stage-copy p{ font-size:16px; }
  .rm-products{ inset:58px 22px 18px; }
  .rm-product{ width:28%; height:90%; }
  .rm-product:nth-child(1){ transform:translateX(-74px) rotate(-7deg); }
  .rm-product:nth-child(3){ transform:translateX(74px) rotate(7deg); }
  .rm-product span,.rm-swipe-note{ display:none; }
  .routine-modal-body{ padding:28px 24px calc(24px + env(safe-area-inset-bottom)); }
  .rm-heading h3{ font-size:30px; padding-right:16px; }
  .rm-heading > p:last-child{ margin-top:12px; font-size:14px; }
  .rm-plan{ margin-top:22px; padding:18px 0; }
  .rm-plan li{ grid-template-columns:1fr; gap:2px; }
  .rm-fit{ padding:18px 0; }
  .rm-footer{ grid-template-columns:1fr; gap:12px; }
  .rm-footer .btn{ width:100%; }
  .rm-footer > p{ text-align:left; }
}
@media (max-width:420px){
  .routine-modal-stage{ min-height:230px; }
  .rm-products{ inset:55px 25px 8px; }
  .rm-fit ul{ grid-template-columns:1fr; gap:6px; }
}
@media (prefers-reduced-motion:reduce){ .routine-modal-backdrop,.routine-modal-panel{ animation:none; } }

/* ---------- CTA band ---------- */
.cta{ background:var(--yellow); }
.cta .wrap{ padding:clamp(48px,6.5vw,88px) var(--pad); display:grid; grid-template-columns:1.1fr 0.9fr; gap:40px; align-items:center; }
.cta h2{ font-family:var(--f-heading); font-weight:700; letter-spacing:-0.025em; line-height:1.16; font-size:clamp(30px,4vw,52px); color:var(--black); }
.cta h2 em{ font-family:var(--f-serif); font-style:italic; font-weight:400; }
.cta-copy{ margin-top:14px; max-width:42ch; color:var(--ink-2); font-size:15px; line-height:1.55; }
.cta-actions{ display:flex; flex-direction:column; gap:14px; max-width:440px; margin-left:auto; width:100%; }
.cta-reserve{ justify-content:center; padding:16px 22px; font-size:15px; }
.cta-or{ display:flex; align-items:center; gap:12px; font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-2); }
.cta-or::before, .cta-or::after{ content:""; flex:1; height:1px; background:rgba(20,20,15,0.18); }
.signup{ display:flex; gap:8px; background:#fff; border-radius:999px; padding:6px 6px 6px 20px; box-shadow:0 12px 30px -16px rgba(40,40,0,.35); width:100%; }
.signup input{ flex:1; min-width:0; border:none; outline:none; font-family:var(--f-body); font-weight:400; font-size:15px; background:transparent; color:var(--ink); }
.signup input::placeholder{ color:#9a9a90; }
@media (max-width:760px){ .cta .wrap{ grid-template-columns:1fr; } .cta-actions{ margin-left:0; max-width:none; } }

/* ---------- footer ---------- */
.footer{ background:var(--black); color:#fff; padding:clamp(56px,6vw,84px) 0 28px; }
.foot-cols{ display:grid; grid-template-columns:2fr repeat(3,1fr); gap:48px; padding-bottom:44px; border-bottom:1px solid #262620; align-items:start; }
.foot-brand{ display:flex; flex-direction:column; gap:20px; max-width:360px; }
.foot-mark{ width:clamp(150px,14vw,180px); }
.foot-mark img{ width:100%; height:auto; display:block; }
.foot-cols .blurb{ font-family:var(--f-body); font-size:14.5px; color:#b8b8af; line-height:1.55; margin:0; }
.fcol h5{ font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:#8a8a80; margin-bottom:18px; }
.fcol a{ display:block; font-family:var(--f-body); font-weight:500; font-size:14.5px; color:#e7e7df; padding:6px 0; transition:color .15s, transform .15s; }
.fcol a:hover{ color:var(--yellow); transform:translateX(2px); }
.foot-base{ display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; padding-top:24px; }
.foot-base .fine{ font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:#6e6e64; }
.foot-social{ display:flex; gap:22px; }
.foot-social a{ font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:#b8b8af; transition:color .15s; }
.foot-social a:hover{ color:var(--yellow); }
.scroll-top{
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:80;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.18);
  background:var(--black);
  color:var(--yellow);
  font-family:var(--f-heading);
  font-size:22px;
  line-height:1;
  display:grid;
  place-items:center;
  box-shadow:0 18px 38px -24px rgba(0,0,0,.55);
  opacity:0;
  pointer-events:none;
  transform:translateY(8px);
  transition:opacity .18s ease, transform .18s ease, background .18s ease;
}
.scroll-top.is-visible{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}
.scroll-top:hover{ background:#23231f; }
@media (max-width:960px){ .foot-cols{ grid-template-columns:1fr 1fr 1fr; gap:36px 32px; } .foot-brand{ grid-column:1/-1; max-width:480px; } }
@media (max-width:560px){ .foot-cols{ grid-template-columns:1fr 1fr; } .foot-base{ justify-content:flex-start; } }
@media (max-width:560px){ .sku-name{ font-size:clamp(12px,3.25vw,16px); } }

/* ---------- modal ---------- */
.modal{ position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:24px; }
.modal[hidden]{ display:none; }
.modal-backdrop{ position:absolute; inset:0; background:rgba(15,15,15,0.55); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); animation:fade-in .2s ease; }
.modal-panel{
  position:relative; z-index:1;
  background:var(--cream);
  border-radius:24px;
  width:100%; max-width:1120px;
  max-height:90vh; overflow:auto;
  box-shadow:0 40px 80px -20px rgba(0,0,0,0.5);
  animation:modal-in .28s cubic-bezier(.2,.7,.3,1);
}
.modal-close{
  position:absolute; top:14px; right:14px; z-index:3;
  width:36px; height:36px; border-radius:50%;
  border:none; background:rgba(255,255,255,0.85);
  font-family:var(--f-display); font-size:22px; line-height:1; font-weight:600;
  color:var(--ink); cursor:pointer;
  display:grid; place-items:center;
  transition:background .15s, transform .15s;
}
.modal-close:hover{ background:#fff; transform:rotate(90deg); }
.modal-grid{ display:grid; grid-template-columns:1.35fr 1fr; min-height:520px; }
.modal-photo{
  position:relative;
  background:var(--cream-photo);
  display:flex; align-items:center; justify-content:center;
  padding:0;
  border-radius:24px 0 0 24px;
  overflow:hidden;
  /* cursor:zoom-in; */
}
.modal-photo img{
  width:100%; height:auto; max-height:100%; object-fit:contain;
  /* transform-origin:var(--zoom-x, 50%) var(--zoom-y, 50%); */
  /* transition:transform 1s cubic-bezier(.22, .72, .22, 1), filter 1s ease; */
  /* will-change:transform; */
}
/* .modal-photo.is-zooming{ cursor:zoom-out; } */
/* .modal-photo.is-zooming img{ */
/*   transform:scale(1.85); */
/*   filter:saturate(1.02) contrast(1.01); */
/* } */
.modal-body{
  padding:42px 44px;
  display:flex; flex-direction:column; gap:18px;
}
.m-no{ font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.16em; text-transform:uppercase; color:var(--muted); }
.m-name{
  font-family:var(--f-heading); font-weight:800;
  font-size:46px;
  letter-spacing:-0.025em; line-height:1.1;
  color:var(--black);
  margin-top:-6px;
  white-space:nowrap;
  overflow:hidden;
}
.m-name-link{
  color:inherit;
  text-decoration:underline;
  text-decoration-color:transparent;
  text-decoration-thickness:2px;
  text-underline-offset:.12em;
  transition:text-decoration-color .15s ease;
}
.m-name-link:hover{ text-decoration-color:var(--yellow-dk); }
.m-name-link:focus-visible{ outline:2px solid var(--yellow-dk); outline-offset:4px; }
.m-tag{
  font-family:var(--f-serif); font-style:italic;
  font-size:18px; line-height:1.35; color:var(--ink-2);
}
.m-active{
  background:#fff; border:1px solid var(--hair); border-radius:14px;
  padding:16px 18px; display:flex; align-items:center; justify-content:space-between; gap:14px;
  margin:6px 0 4px;
}
.m-active-label{ font-family:var(--f-mono); font-size:9.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--muted); margin-bottom:6px; }
.m-active-name{ font-family:var(--f-heading); font-weight:700; font-size:17px; letter-spacing:-0.015em; color:var(--black); }
.m-active-full{ font-family:var(--f-body); font-size:12.5px; color:var(--muted); margin-top:3px; }
.m-active-dot{ width:30px; height:30px; border-radius:50%; background:var(--yellow); flex:none; }
.m-section h5{
  font-family:var(--f-mono); font-size:10px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--yellow-dk); margin-bottom:8px;
  display:flex; align-items:center; gap:8px;
}
.m-section h5::before{ content:''; width:14px; height:1.5px; background:var(--yellow); }
.m-section p{ font-family:var(--f-body); font-size:14.5px; line-height:1.6; color:var(--ink-2); }
.m-where{ list-style:none; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:6px 16px; }
.m-where li{
  font-family:var(--f-body); font-size:14px; line-height:1.5; color:var(--ink);
  padding-left:14px; position:relative;
}
.m-where li::before{ content:''; position:absolute; left:0; top:9px; width:5px; height:5px; border-radius:50%; background:var(--yellow); }
.m-foot{
  margin-top:auto; padding-top:18px; border-top:1px solid var(--hair);
  display:flex; align-items:center; justify-content:space-between; gap:14px;
}
.m-price{ font-family:var(--f-heading); font-weight:700; font-size:22px; letter-spacing:-0.015em; }
.m-price-meta{ font-family:var(--f-mono); font-size:11px; letter-spacing:0.08em; color:var(--muted); font-weight:400; margin-left:4px; }
@media (max-width:760px){
  .modal{
    padding:18px;
    place-items:center;
  }
  .modal-panel{
    width:min(100%, 460px);
    max-height:calc(100dvh - 36px);
    border-radius:18px;
    overflow:auto;
    display:flex; flex-direction:column;
    box-shadow:0 18px 48px -22px rgba(0,0,0,0.55);
  }
  .modal-grid{
    grid-template-columns:1fr;
    min-height:0;
    display:flex; flex-direction:column;
  }
  .modal-photo{
    flex:none; height:clamp(150px, 28dvh, 230px);
    aspect-ratio:auto;
    border-radius:18px 18px 0 0;
    cursor:default;
  }
  .modal-photo img{ width:100%; height:100%; object-fit:contain; padding:8px 0; transform:none; }
  .modal-body{
    min-height:0;
    padding:18px 18px calc(18px + env(safe-area-inset-bottom));
    gap:12px;
  }
  .m-where{ grid-template-columns:1fr 1fr; gap:2px 12px; }
}
@keyframes fade-in{ from{ opacity:0; } to{ opacity:1; } }
@keyframes modal-in{ from{ opacity:0; transform:translateY(12px) scale(.98); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){
  .modal-backdrop, .modal-panel{ animation:none; }
  .modal-photo img{ transition:none; }
}

/* ---------- price-tbd + bell + notify modal ---------- */
.price-tbd{
  font-family:var(--f-body); font-style:italic; font-weight:500;
  color:var(--ink-2); letter-spacing:0;
}
.m-actions{ display:flex; flex-direction:column; gap:8px; align-items:flex-end; }
.bell-cta{
  display:inline-flex; align-items:center; gap:7px;
  background:transparent; border:1px solid var(--hair); border-radius:999px;
  padding:8px 16px 8px 13px;
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.13em; text-transform:uppercase;
  color:var(--ink-2); cursor:pointer;
  white-space:nowrap;
  transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;
}
.bell-cta:hover{ background:var(--yellow); border-color:var(--yellow-dk); color:var(--black); transform:translateY(-1px); }
.bell-ic{ width:12px; height:12px; flex:none; }

.notify-modal{ position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; padding:24px; }
.notify-modal[hidden]{ display:none !important; }
.notify-backdrop{ position:absolute; inset:0; background:rgba(20,18,12,0.58); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); animation:fade-in .25s ease; }
.notify-panel{
  position:relative; z-index:2;
  width:100%; max-width:460px;
  background:var(--cream);
  border:1px solid var(--hair);
  border-radius:20px;
  padding:42px 38px 32px;
  box-shadow:0 32px 70px -22px rgba(20,18,12,.28);
  animation:notify-rise .38s cubic-bezier(.2,.7,.2,1);
}
.notify-close{
  position:absolute; top:10px; right:10px;
  width:44px; height:44px; border-radius:50%;
  background:transparent; border:none; color:var(--muted);
  font-size:22px; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s, color .2s, transform .25s;
}
.notify-close:hover{ background:rgba(20,18,12,.06); color:var(--ink); transform:rotate(90deg); }
.notify-eyebrow{
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.16em;
  text-transform:uppercase; color:var(--muted); margin-bottom:14px;
  display:inline-flex; align-items:center; gap:9px;
}
.notify-eyebrow::before{
  content:''; width:6px; height:6px; border-radius:50%;
  background:var(--yellow); box-shadow:0 0 0 4px rgba(240,224,64,0.22);
}
.notify-title{
  font-family:var(--f-heading); font-weight:600;
  font-size:clamp(26px,3.2vw,32px); letter-spacing:-0.018em;
  line-height:1.1; margin:0 0 14px; color:var(--black);
}
.notify-title em{ font-family:var(--f-serif); font-style:italic; font-weight:400; }
.notify-lead{
  font-family:var(--f-body); font-size:14.5px; line-height:1.6;
  color:var(--muted); margin:0 0 22px;
}
.notify-form{ display:flex; flex-direction:column; gap:8px; }
.notify-form[hidden]{ display:none; }
.notify-label{
  font-family:var(--f-mono); font-size:10px; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--ink-2);
}
.notify-form input[type=email]{
  font-family:var(--f-body); font-size:15px;
  padding:14px 16px; border:1px solid var(--hair); border-radius:12px;
  background:#fff; color:var(--black);
  transition:border-color .2s, box-shadow .2s;
}
.notify-form input[type=email]:focus{
  outline:none; border-color:var(--yellow-dk);
  box-shadow:0 0 0 3px rgba(240,224,64,0.24);
}
.notify-submit{ margin-top:8px; width:100%; justify-content:center; }
.notify-fine{
  font-family:var(--f-body); font-size:11.5px; line-height:1.5;
  color:var(--muted); margin:10px 0 0; text-align:center;
}
.notify-success{ text-align:center; padding:10px 0 4px; }
.notify-success[hidden]{ display:none; }
.notify-success-mark{
  width:52px; height:52px; border-radius:50%;
  background:var(--yellow); color:var(--black);
  display:flex; align-items:center; justify-content:center;
  font-size:24px; font-weight:600; margin:0 auto 18px;
  box-shadow:0 0 0 6px rgba(240,224,64,0.18);
}
.notify-success h4{
  font-family:var(--f-heading); font-weight:600;
  font-size:22px; margin:0 0 8px; color:var(--black);
}
.notify-success p{
  font-family:var(--f-body); font-size:14px; line-height:1.55;
  color:var(--muted); margin:0;
}
@keyframes notify-rise{
  from{ opacity:0; transform:translateY(16px) scale(0.985); }
  to{ opacity:1; transform:none; }
}
@media (max-width:480px){
  .notify-panel{ padding:34px 22px 26px; border-radius:18px; }
  .notify-title{ font-size:25px; }
}
@media (prefers-reduced-motion:reduce){
  .notify-backdrop, .notify-panel{ animation:none; }
  .notify-close:hover{ transform:none; }
}

/* ---------- mobile refinement ---------- */
@media (max-width:600px){
  :root{ --pad:20px; }

  /* extra bottom padding when sticky CTA is visible */
  body{ padding-bottom:0; }
  .footer{ padding-bottom:96px; }

  .eyebrow-preorder{ font-size:10px; padding:7px 12px 7px 10px; letter-spacing:0.1em; align-items:center; }
  .eyebrow-preorder .eb-sep{ display:none; }
  .eyebrow-preorder { gap:7px; }
  .hero-batch{ top:10px; left:10px; font-size:8.5px; padding:5px 9px; }

  .sku-pep{ font-size:11.5px; padding:4px 9px; }
  .sku-pep-dot{ width:5px; height:5px; }

  .rsave{ font-size:10.5px; padding:5px 10px; top:-10px; right:16px; }
  .rstrike{ font-size:11px; }

  .vs-actives{ margin-bottom:36px; }

  .atlas-card{ padding:18px 16px 16px; }
  .atlas-name{ font-size:18px; }

  .founder-trust{ margin-top:28px; padding-top:22px; }
  .ft-n{ font-size:28px; }
  .pull-card{ padding:26px 22px; }
  .pull-quote{ font-size:18px; }

  .faq-q{ padding:18px 4px; font-size:15.5px; }
  .faq-icon{ font-size:22px; }
  .faq-a p{ font-size:14.5px; padding-right:24px; }
  .faq-item.is-open .faq-a{ padding-bottom:18px; }

  .cta-perks{ gap:6px 14px; margin-top:14px; }
  .cta-perks span{ font-size:10px; }

  .sticky-cta-copy{ font-size:12px; }
  .sticky-cta-btn{ padding:10px 14px; font-size:12px; min-height:44px; }

  .btn-black,
  .sku-band .add{
    border-radius:12px;
    box-shadow:none;
    justify-content:center;
    transform:none;
  }
  .btn-black{
    min-height:46px;
    padding:12px 16px;
    font-size:14px;
  }
  .btn-black:hover,
  .sku-band .add:hover{
    transform:none;
  }

  .nav-in{ height:64px; gap:10px; }
  .brand-mark{ width:94px; height:auto; }
  .nav-right{ gap:10px; min-width:0; }
  .nav-right .btn{ min-height:44px; padding:11px 17px; }
  .bag{ font-size:10px; gap:5px; }
  .bag .dotmark{ width:7px; height:7px; }

  .hero{ padding:36px 0 48px; }
  .hero-grid{ gap:32px; }
  .hero-photo{ order:initial; max-width:240px; margin:0 auto; }
  .eyebrow{ font-size:10px; line-height:1.5; margin-bottom:18px; }
  .hero h1{ font-size:clamp(40px,12vw,52px); }
  .hero h1 .hl::before{ top:48%; }
  .hero-tag{ font-size:17px; margin-top:14px; }
  .hero-sub{ margin:8px 0 22px; font-size:15.5px; }
  .hero-cta{ gap:10px; }
  .hero-cta .btn{ min-height:46px; }
  .hero-reserve-note{ display:block; max-width:34ch; }
  .hero-reserve-note span{ display:inline; font-size:13px; line-height:1.55; }
  .hero-reserve-note span:not(:last-child)::after{ display:inline-block; vertical-align:middle; margin:0 8px; }
  .hero-pills{ margin-top:22px; gap:6px 8px; }
  .hero-pills li{ font-size:9px; padding:6px 11px 6px 7px; }
  .hero-pills .hp-ic{ width:14px; height:14px; font-size:9px; }
  .hero-trust{ margin-top:26px; gap:10px 16px; }
  .hero-trust span{ font-size:9px; }

  .marquee{ padding:12px 0; }
  .marquee-track span{ font-size:15px; padding:0 16px; gap:16px; }

  .section{ padding:64px 0; }
  .sec-kicker{ margin-bottom:12px; }
  .sec-lead{ font-size:16px; }

  .format-grid{ gap:30px; }
  .format-photo{ width:100%; border-radius:18px; }
  .format-tag{ bottom:12px; left:12px; padding:7px 10px; font-size:9px; }
  .step{ gap:14px; padding:20px 0; }
  .step .no{ min-width:26px; }

  .shop-head{ align-items:flex-start; gap:20px; }
  .chips{
    width:calc(100vw - 20px);
    margin-right:-20px;
    flex-wrap:nowrap;
    overflow-x:auto;
    padding:0 20px 4px 0;
    scrollbar-width:none;
  }
  .chips::-webkit-scrollbar{ display:none; }
  .chip{ min-height:44px; padding:10px 15px; flex:none; }

  .grid{ gap:12px; }
  .sku{ border-radius:14px; }
  .sku:hover{ transform:none; box-shadow:none; }
  .sku-photo{ aspect-ratio:3/2; }
  .sku-info{ padding:14px 12px 12px; gap:6px; }
  .sku-name{ font-size:clamp(12px,3.25vw,15px); letter-spacing:0; line-height:1.12; }
  .sku[data-key="overnight-renewal"] .sku-name{ white-space:normal; }
  .sku-best{ font-size:11.5px; line-height:1.35; }
  .sku-inci{ display:none; }
  .sku-band{
    background:#fff;
    padding:0 12px 14px;
    min-height:0;
  }
  .sku-band .meta{ font-size:9px; letter-spacing:0.06em; }
  .sku-band .add{
    width:100%;
    min-width:0;
    min-height:42px;
    font-family:var(--f-body);
    font-size:13px;
    font-weight:700;
    letter-spacing:0;
    text-transform:none;
    padding:10px 12px;
    box-shadow:none;
  }
  .sku-band .add-for,
  .sku-band .add-price,
  .sku-band .add .arr{ display:none; }

  .act{ grid-template-columns:1fr; gap:10px; padding:24px 0; }
  .act:nth-child(odd), .act:nth-child(even){ padding-left:0; padding-right:0; }
  .act .inci{ min-width:0; padding-top:0; white-space:normal; }
  .act p{ font-size:15px; }

  .routines{ max-width:none; }
  .routine{ border-radius:16px; padding:22px 18px; }
  .mini-tubes{ gap:8px; margin:20px 0; }
  .mt{ padding:7px; border-radius:9px; }
  .routine .rfoot{ gap:10px; }
  .routine .rprice{ font-size:9px; }
  .routine .rfoot .btn{ width:100%; min-height:46px; padding:12px 16px; }

  .cta .wrap{ gap:26px; }
  .cta-reserve{ width:100%; }
  .signup{ width:100%; max-width:none; min-width:0; padding-left:16px; }
  .signup input{ min-width:0; width:100%; }
  .signup .btn{ min-height:44px; padding:11px 18px; }

  .foot-mark{ margin-bottom:24px; }
  .foot-cols{ gap:28px 20px; }
  .fcol a{ min-height:44px; display:flex; align-items:center; padding:8px 0; }
  .foot-base{ align-items:flex-start; flex-direction:column; }

  .modal{ padding:16px; place-items:center; }
  .modal-panel{
    width:min(100%, 430px);
    max-height:calc(100dvh - 32px);
    border-radius:18px;
  }
  .modal-close{ width:38px; height:38px; font-size:22px; top:10px; right:10px; }
  .modal-grid{ min-height:0; }
  .modal-photo{ height:clamp(140px, 25dvh, 200px); min-height:0; aspect-ratio:auto; border-radius:18px 18px 0 0; }
  .modal-body{ padding:16px 16px calc(16px + env(safe-area-inset-bottom)); gap:9px; }
  .m-name{ font-size:28px; line-height:1.08; margin-top:-2px; white-space:normal; overflow:visible; }
  .m-tag{ font-size:13.5px; line-height:1.3; }
  .m-active{ padding:8px 12px; margin:2px 0; }
  .m-active-name{ font-size:15px; }
  .m-active-full{ font-size:11.5px; margin-top:1px; }
  .m-active-label{ font-size:9px; margin-bottom:3px; }
  .m-active-dot{ width:22px; height:22px; }
  .m-section h5{ font-size:9.5px; margin-bottom:4px; }
  .m-section p{ font-size:13px; line-height:1.45; }
  .m-where li{ font-size:12.5px; padding-left:11px; }
  .m-where li::before{ top:7px; width:4px; height:4px; }
  .m-foot{
    position:relative;
    margin:6px 0 0;
    padding-top:10px;
    gap:10px;
  }
  .m-price{ font-size:18px; }
  .m-price-pre{ font-size:9.5px; }
  .m-price-meta{ display:none; }
  .m-foot .btn{ min-height:42px; padding:0 14px; font-size:13px; border-radius:12px; }
  .bell-cta{ padding:6px 12px 6px 10px; font-size:9.5px; }
  .m-reviews{ display:none; }
}

@media (max-width:360px){
  .nav-in{ gap:6px; }
  .nav-right{ gap:6px; }
  .brand-mark{ width:80px; }
  .bag{ font-size:9.5px; gap:4px; padding:0 2px; }
  .bag .dotmark{ width:6px; height:6px; }
  .nav-right .btn{ padding-inline:16px; }
  .hero h1{ font-size:40px; }
  .hero-cta{ align-items:stretch; flex-direction:column; }
  .hero-cta .btn{ justify-content:center; width:100%; }
  .grid{ grid-template-columns:1fr; }
  .sku-photo{ aspect-ratio:4/3; }
  .sku-info{ padding:16px; }
  .sku-name{ font-size:20px; }
  .sku-inci{ display:block; }
  .sku-band{ padding-inline:16px; }
  .foot-cols{ grid-template-columns:1fr; }
  .foot-cols .blurb{ grid-column:auto; }
}

/* ---------- science extras: vs-actives + atlas + act-meta ---------- */
.vs-actives{
  margin-top:clamp(28px,3.5vw,40px);
  margin-bottom:clamp(48px,6vw,72px);
}
.vs-title{
  font-family:var(--f-heading); font-weight:700;
  font-size:clamp(18px,1.9vw,22px);
  letter-spacing:-0.015em; color:#fff;
  margin-bottom:18px;
}
.vs-title-deeper{ margin-top:clamp(48px,5vw,72px); }
/* ---------- layer lab (Why peptides interactive comparison) ---------- */
.layer-lab{
  --ll-accent:#F0E040;
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:18px;
  margin-top:8px;
}
.layer-lab[data-compare="retinol"]{ --ll-accent:#F5A65A; }
.layer-lab[data-compare="vitamin-c"]{ --ll-accent:#F5DA4A; }
.layer-lab[data-compare="niacinamide"]{ --ll-accent:#9FD8C8; }

.ll-peptides,
.ll-compare{
  position:relative;
  background:linear-gradient(180deg,#15150f 0%,#0b0b08 100%);
  border:1px solid #28281f;
  border-radius:18px;
  padding:28px 28px 26px;
  display:flex; flex-direction:column;
  overflow:hidden;
}
.ll-peptides{
  background:linear-gradient(180deg,rgba(240,224,64,0.05) 0%,rgba(240,224,64,0.015) 60%,#0b0b08 100%);
  border-color:rgba(240,224,64,0.18);
}
.ll-pep-glow{
  position:absolute; top:-80px; right:-80px;
  width:240px; height:240px; border-radius:50%;
  background:radial-gradient(circle,rgba(240,224,64,0.22),rgba(240,224,64,0) 70%);
  pointer-events:none;
}
.ll-pep-eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.14em;
  text-transform:uppercase; color:rgba(240,224,64,0.9);
}
.ll-pulse{
  width:7px; height:7px; border-radius:50%;
  background:var(--yellow);
  box-shadow:0 0 0 0 rgba(240,224,64,0.55);
  animation:ll-pulse 2.4s ease-out infinite;
}
@keyframes ll-pulse{
  0%{ box-shadow:0 0 0 0 rgba(240,224,64,0.55); }
  70%{ box-shadow:0 0 0 10px rgba(240,224,64,0); }
  100%{ box-shadow:0 0 0 0 rgba(240,224,64,0); }
}
.ll-pep-name{
  font-family:var(--f-display); font-weight:700;
  font-size:clamp(30px,3.3vw,40px); line-height:1.05;
  color:#fff;
  margin:14px 0 12px;
}
.ll-pep-body{
  font-family:var(--f-body); font-size:15px; line-height:1.55;
  color:#cfcfc5;
  max-width:40ch;
}
.ll-pep-body strong{ color:#fff; font-weight:600; }

.ll-tabs{
  display:flex; gap:6px;
  background:rgba(255,255,255,0.04);
  border:1px solid #28281f;
  border-radius:999px;
  padding:5px;
  width:fit-content;
  margin-bottom:22px;
}
.ll-tab{
  appearance:none; border:none; cursor:pointer;
  background:transparent; color:#9a9a90;
  font-family:var(--f-body); font-size:13px; font-weight:500;
  letter-spacing:0.01em;
  padding:8px 16px 8px 12px; border-radius:999px;
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
  transition:color .25s ease, background .25s ease, transform .15s ease;
}
.ll-tab:hover{ color:#e7e7dd; }
.ll-tab .ll-tab-dot{
  width:7px; height:7px; border-radius:50%;
  background:currentColor; opacity:0.45;
  transition:opacity .25s ease, transform .25s ease;
}
.ll-tab.is-active{
  background:var(--ll-accent);
  color:#15150f;
  font-weight:600;
}
.ll-tab.is-active .ll-tab-dot{ opacity:1; transform:scale(1.1); }
.ll-tab:focus-visible{ outline:2px solid rgba(240,224,64,0.55); outline-offset:2px; }

.ll-panels{ position:relative; flex:1; display:grid; }
.ll-panels > .ll-panel{ grid-area:1/1; }
.ll-panel,
.ll-panel[hidden]{
  display:flex; flex-direction:column;
  visibility:hidden;
  opacity:0;
  transform:translateY(4px);
  pointer-events:none;
  transition:opacity .28s ease, transform .28s ease;
}
.ll-panel.is-active{
  visibility:visible;
  pointer-events:auto;
  opacity:1;
  transform:none;
}
.ll-panel-head{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:14px;
  margin-bottom:8px;
}
.ll-panel-name{
  font-family:var(--f-display); font-weight:700;
  font-size:clamp(24px,2.4vw,30px); line-height:1.1;
  color:#fff; margin:0;
}
.ll-panel-class{
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--ll-accent);
  padding:4px 10px; border-radius:999px;
  background:color-mix(in srgb, var(--ll-accent) 12%, transparent);
  border:1px solid color-mix(in srgb, var(--ll-accent) 25%, transparent);
  white-space:nowrap;
}
.ll-panel-body{
  font-family:var(--f-body); font-size:14.5px; line-height:1.55;
  color:#b4b4ab;
  margin-bottom:18px;
}

.ll-stats{
  display:flex; flex-direction:column; gap:0;
  margin:auto 0 0;
  padding:0;
  border-top:1px solid #22221b;
}
.ll-stat{
  display:grid; grid-template-columns:128px 1fr;
  gap:14px;
  padding:13px 0;
  border-bottom:1px solid #22221b;
  align-items:center;
}
.ll-stat:last-child{ border-bottom:none; }
.ll-stat dt{
  font-family:var(--f-mono); font-size:10px; letter-spacing:0.14em;
  text-transform:uppercase; color:#7a7a72;
  margin:0;
}
.ll-stat dd{
  margin:0;
  font-family:var(--f-body); font-size:13.5px;
  color:#e7e7dd;
  display:flex; align-items:center; gap:10px;
}
.ll-bar{
  display:inline-flex; gap:4px;
}
.ll-bar i{
  width:18px; height:6px; border-radius:3px;
  background:rgba(255,255,255,0.08);
  transition:background .35s ease;
}
.ll-bar[data-level="1"] i:nth-child(-n+1){ background:#9FD8C8; }
.ll-bar[data-level="2"] i:nth-child(-n+2){ background:#F5DA4A; }
.ll-bar[data-level="3"] i:nth-child(-n+3){ background:#F5A65A; }
.ll-bar-l{
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.1em;
  text-transform:uppercase; color:#9a9a90;
}

.ll-verdict dd{
  align-items:flex-start;
  font-size:13.5px; line-height:1.45; color:#cfcfc5;
}
.ll-verdict dd strong{ color:#fff; font-weight:600; }
.ll-check{
  flex:none;
  display:inline-grid; place-items:center;
  width:22px; height:22px; border-radius:50%;
  background:rgba(159,216,200,0.16);
  color:#9FD8C8;
  margin-top:1px;
}
.ll-check svg{ width:14px; height:14px; }

@media (max-width:880px){
  .layer-lab{ grid-template-columns:1fr; gap:14px; }
  .ll-peptides, .ll-compare{ padding:24px 22px 22px; }
  .ll-stat{ grid-template-columns:108px 1fr; gap:10px; }
}
@media (max-width:520px){
  .ll-stat{ grid-template-columns:1fr; gap:6px; padding:11px 0; }
  .ll-stat dt{ font-size:9.5px; }
  .ll-tabs{ width:100%; justify-content:space-between; }
  .ll-tab{ flex:1; justify-content:center; gap:5px; padding:8px 6px; font-size:11.5px; }
  .ll-tab .ll-tab-dot{ width:5px; height:5px; }
}

.act-meta{
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.12em;
  text-transform:uppercase; color:#8a8a80; margin-top:10px;
}
.act-meta a{ color:var(--yellow); border-bottom:1px solid rgba(240,224,64,0.3); padding-bottom:1px; transition:.15s; }
.act-meta a:hover{ border-bottom-color:var(--yellow); }

.atlas{ margin-top:clamp(48px,6vw,72px); }
.atlas-head{ margin-bottom:24px; }
.atlas-lead{
  font-family:var(--f-body); font-size:15px; line-height:1.55;
  color:#b4b4ab; margin-top:6px; max-width:58ch;
}
.atlas-grid{
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.atlas-card{
  background:#fff; color:var(--ink);
  border-radius:16px; padding:22px 20px 20px;
  position:relative; overflow:hidden;
  transition:transform .2s ease, box-shadow .2s ease;
  cursor:default;
}
.atlas-card::before{
  content:''; position:absolute; inset:0 0 auto 0; height:6px;
  background:var(--c, var(--yellow));
}
.atlas-card:hover{ transform:translateY(-3px); box-shadow:0 22px 40px -22px rgba(0,0,0,0.5); }
.atlas-name{
  font-family:var(--f-heading); font-weight:700;
  font-size:20px; letter-spacing:-0.02em; color:var(--black);
  margin-top:8px;
}
.atlas-pep{
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--yellow-dk);
  margin-top:6px;
}
.atlas-job{
  font-family:var(--f-serif); font-style:italic;
  font-size:14.5px; line-height:1.4; color:var(--ink-2);
  margin-top:10px;
}
@media (max-width:760px){
  .atlas-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:480px){
  .atlas-grid{ grid-template-columns:1fr; }
}

/* ---------- posts preview ---------- */
.posts-preview{
  background:var(--cream-2);
  border-top:1px solid var(--hair);
  border-bottom:1px solid var(--hair);
}
.posts-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:clamp(28px,3.5vw,44px);
}
.posts-head .sec-lead{
  max-width:54ch;
}
.posts-head-cta{
  flex:none;
}
.posts-shelf{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(300px,0.92fr);
  gap:clamp(16px,2vw,24px);
  align-items:stretch;
}
.posts-feature,
.posts-card{
  background:#fff;
  border:1px solid var(--hair);
  color:var(--ink);
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.posts-feature:hover,
.posts-card:hover{
  transform:translateY(-4px);
  border-color:var(--ink);
  box-shadow:0 24px 44px -30px rgba(20,40,30,.4);
}
.posts-feature{
  display:grid;
  grid-template-columns:minmax(260px,0.88fr) minmax(0,1fr);
  min-height:360px;
  background:var(--black);
  border-color:var(--black);
  color:#fff;
}
.posts-feature-art{
  background:var(--cream-photo);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  overflow:hidden;
}
.posts-feature-art img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.posts-feature-copy,
.posts-card-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.posts-feature-copy{
  padding:clamp(28px,4vw,48px);
}
.posts-label{
  font-family:var(--f-mono);
  font-size:10.5px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--yellow-dk);
}
.posts-feature .posts-label{
  color:var(--yellow);
}
.posts-feature h3,
.posts-card h3{
  font-family:var(--f-heading);
  font-weight:700;
  letter-spacing:-0.03em;
  line-height:1.04;
}
.posts-feature h3{
  margin:16px 0 12px;
  font-size:clamp(32px,3.5vw,48px);
  color:#fff;
}
.posts-feature p{
  max-width:38ch;
  color:#e7e4d8;
  font-size:16px;
  line-height:1.58;
}
.posts-link{
  margin-top:28px;
  font-family:var(--f-body);
  font-weight:700;
  color:#fff;
}
.posts-stack{
  display:grid;
  grid-template-rows:1fr 1fr;
  gap:clamp(16px,2vw,24px);
}
.posts-card{
  display:grid;
  grid-template-columns:0.68fr 1fr;
  min-height:168px;
}
.posts-card-art{
  background:#F0EEE5;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  overflow:hidden;
}
.posts-card-art img{
  max-width:86%;
  max-height:180px;
  object-fit:contain;
}
.posts-card-art-routine{
  gap:0;
}
.posts-card-art-routine img{
  max-width:58%;
  margin:0 -12%;
}
.posts-card-copy{
  padding:24px 24px 22px;
}
.posts-card h3{
  margin:10px 0 8px;
  font-size:clamp(22px,2.5vw,30px);
  color:var(--black);
}
.posts-card p{
  font-family:var(--f-body);
  font-size:14.5px;
  line-height:1.55;
  color:var(--ink-2);
}
@media (max-width:980px){
  .posts-head{
    align-items:flex-start;
    flex-direction:column;
  }
  .posts-shelf,
  .posts-feature{
    grid-template-columns:1fr;
  }
  .posts-feature{
    min-height:0;
  }
  .posts-feature-art{
    min-height:300px;
  }
}
@media (max-width:620px){
  .posts-head-cta{
    width:100%;
    justify-content:center;
  }
  .posts-feature-art{
    min-height:260px;
  }
  .posts-card{
    grid-template-columns:1fr;
  }
  .posts-card-art{
    min-height:210px;
  }
}
@media (max-width:480px){
  .posts-feature,
  .posts-card{
    border-radius:14px;
  }
  .posts-feature-copy,
  .posts-card-copy{
    padding:22px;
  }
  .posts-feature-art{
    min-height:230px;
    padding:0;
  }
}

/* ---------- quiz ---------- */
.quiz{ background:var(--cream-2); }
.quiz-wrap{ max-width:920px; }
.quiz-head{ text-align:center; max-width:640px; margin:0 auto clamp(28px,3.5vw,40px); }
.quiz-head .sec-kicker{ justify-content:center; }
.quiz-head .sec-kicker::before{ display:none; }
.quiz-head .sec-lead{ margin:14px auto 0; }
.quiz-card{
  background:#fff;
  border:1px solid var(--hair);
  border-radius:24px;
  padding:clamp(24px,3.2vw,40px);
  box-shadow:0 30px 60px -34px rgba(20,40,30,0.25);
  position:relative;
  overflow:hidden;
}
.quiz-progress{
  display:flex; align-items:center; gap:14px;
  margin-bottom:24px;
}
.qp-bar{
  flex:1; height:4px; border-radius:999px;
  background:var(--hair);
  overflow:hidden;
}
.qp-fill{
  height:100%; width:0%;
  background:var(--yellow);
  border-radius:999px;
  transition:width .35s cubic-bezier(.4,.7,.3,1);
}
.qp-step{
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--muted);
  white-space:nowrap;
}
.qp-of{ color:var(--muted); }

.quiz-step{ display:none; animation:quiz-fade .35s ease both; }
.quiz-step.is-active{ display:block; }
@keyframes quiz-fade{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }

.quiz-q{
  font-family:var(--f-heading); font-weight:700;
  font-size:clamp(20px,2.4vw,26px);
  letter-spacing:-0.02em; line-height:1.25;
  color:var(--black);
  margin-bottom:18px;
}
.quiz-opts{
  display:grid; grid-template-columns:repeat(2,1fr); gap:10px;
}
.qopt{
  display:flex; flex-direction:column; align-items:flex-start;
  gap:4px;
  text-align:left;
  background:#fff; border:1.5px solid var(--hair); border-radius:14px;
  padding:16px 18px;
  cursor:pointer;
  transition:border-color .15s ease, background .15s ease, transform .15s ease;
  font-family:var(--f-body);
  color:var(--ink);
  position:relative;
}
.qopt:hover{ border-color:var(--ink); transform:translateY(-1px); }
.qopt.is-on{ border-color:var(--black); background:rgba(240,224,64,0.08); }
.qopt-dot{
  display:inline-block; width:14px; height:14px;
  border-radius:50%; background:var(--c, var(--yellow));
  border:1.5px solid rgba(0,0,0,0.06);
  margin-bottom:6px;
}
.qopt-label{
  font-family:var(--f-heading); font-weight:700;
  font-size:15px; letter-spacing:-0.012em;
  color:var(--black);
}
.qopt-sub{
  font-family:var(--f-body); font-size:13px;
  color:var(--muted); line-height:1.4;
}

.quiz-result-kicker{
  font-family:var(--f-mono); font-size:11px; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--yellow-dk); margin-bottom:14px;
  display:flex; align-items:center; gap:10px;
}
.quiz-result-kicker::before{ content:''; width:18px; height:1.5px; background:var(--yellow); }
.quiz-result-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:16px;
}
.quiz-rec{
  border:1.5px solid var(--hair); border-radius:18px;
  padding:24px; background:#fff;
  display:flex; gap:18px; align-items:stretch;
  position:relative;
}
.quiz-rec-alt{ background:var(--cream-2); }
.qrec-badge{
  position:absolute; top:-10px; left:18px;
  background:var(--black); color:#fff;
  font-family:var(--f-mono); font-size:10px; letter-spacing:0.14em;
  text-transform:uppercase; padding:5px 10px; border-radius:999px;
}
.quiz-rec-alt .qrec-badge{ background:var(--yellow-dk); }
.quiz-rec img{
  width:80px; height:auto;
  flex:none; align-self:flex-start;
  border-radius:10px;
  background:var(--cream-photo);
  padding:8px;
}
.qrec-info{ flex:1; display:flex; flex-direction:column; gap:6px; }
.qrec-info h3{
  font-family:var(--f-heading); font-weight:700;
  font-size:22px; letter-spacing:-0.02em; line-height:1.2;
  color:var(--black);
}
.qrec-info p{
  font-family:var(--f-body); font-size:13.5px; line-height:1.5;
  color:var(--ink-2);
}
.qrec-pep{
  display:flex; flex-direction:column; gap:3px; align-items:flex-start;
  font-family:var(--f-mono); font-size:10px; letter-spacing:0.12em;
  text-transform:uppercase; margin-top:6px;
}
.qrec-pep-label{ color:var(--muted); }
.qrec-pep > span:last-child{ color:var(--yellow-dk); font-weight:500; }
.qrec-cta{ margin-top:auto; width:100%; justify-content:center; }
.quiz-restart{
  display:block; margin:20px auto 0;
  background:none; border:none; cursor:pointer;
  font-family:var(--f-mono); font-size:11px; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--muted);
  transition:color .15s;
}
.quiz-restart:hover{ color:var(--ink); text-decoration:underline; }

@media (max-width:680px){
  .quiz-opts{ grid-template-columns:1fr; }
  .quiz-result-grid{ grid-template-columns:1fr; }
  .quiz-rec{ flex-direction:row; padding:18px; }
  .quiz-rec img{ width:64px; }
}

/* ---------- founder ---------- */
.founder{ background:var(--cream-2); }
.founder-grid{
  display:grid; grid-template-columns:1.1fr 0.9fr;
  gap:clamp(32px,5vw,72px); align-items:start;
}
.founder-body{
  font-family:var(--f-body); font-size:16.5px; line-height:1.6;
  color:var(--ink-2); margin-top:18px; max-width:54ch;
}
.founder-body strong{ color:var(--black); font-weight:600; }
.founder-sig{
  font-family:var(--f-serif); font-style:italic;
  font-size:18px; color:var(--ink); margin-top:18px;
}
.founder-trust{
  display:grid; grid-template-columns:repeat(3,1fr); gap:16px;
  margin-top:36px; padding-top:28px; border-top:1px solid var(--hair);
}
.ft-item{
  display:flex; flex-direction:column; gap:6px;
}
.ft-n{
  font-family:var(--f-heading); font-weight:700;
  font-size:clamp(28px,3vw,36px);
  letter-spacing:-0.025em; color:var(--black);
  line-height:1;
}
.ft-l{
  font-family:var(--f-body); font-size:13px; line-height:1.45;
  color:var(--muted); max-width:24ch;
}
.founder-pull{ position:sticky; top:96px; }
.pull-card{
  background:#fff; border:1px solid var(--hair); border-radius:20px;
  padding:32px 30px;
  box-shadow:0 30px 60px -34px rgba(20,40,30,0.25);
}
.pull-quote{
  font-family:var(--f-serif); font-style:italic;
  font-size:clamp(20px,2.2vw,24px); line-height:1.4;
  color:var(--ink); position:relative;
}
.pull-quote::before{
  content:'"'; font-family:var(--f-serif); font-size:64px;
  position:absolute; top:-22px; left:-8px; color:var(--yellow);
  line-height:1;
}
.pull-source{ margin-top:22px; padding-top:18px; border-top:1px solid var(--hair); }
.pull-name{
  font-family:var(--f-heading); font-weight:700; font-size:15px;
  letter-spacing:-0.012em; color:var(--black);
}
.pull-role{
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--muted); margin-top:4px;
}
@media (max-width:860px){
  .founder-grid{ grid-template-columns:1fr; }
  .founder-pull{ position:static; }
  .founder-trust{ grid-template-columns:1fr; }
}

/* ---------- FAQ ---------- */
.sec-head-center{ text-align:center; max-width:680px; margin-left:auto; margin-right:auto; }
.sec-head-center .sec-kicker{ justify-content:center; }
.sec-head-center .sec-kicker::before{ display:none; }
.sec-head-center .sec-lead{ margin-left:auto; margin-right:auto; }
.sec-head-center .sec-lead a{ color:var(--yellow-dk); border-bottom:1px solid rgba(200,188,0,0.4); }

.faq-list{
  list-style:none; padding:0; margin:0 auto;
  max-width:780px;
  border-top:1px solid var(--hair);
}
.faq-item{
  border-bottom:1px solid var(--hair);
}
.faq-q{
  width:100%; background:none; border:none; cursor:pointer;
  padding:22px 4px; text-align:left;
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  font-family:var(--f-heading); font-weight:600;
  font-size:clamp(16.5px,1.6vw,18.5px);
  letter-spacing:-0.012em; color:var(--black);
  transition:color .15s;
}
.faq-q:hover{ color:var(--yellow-dk); }
.faq-icon{
  font-family:var(--f-heading); font-weight:400;
  font-size:24px; line-height:1; color:var(--ink);
  transition:transform .25s ease;
  flex:none;
}
.faq-item.is-open .faq-icon{ transform:rotate(45deg); }
.faq-a{
  max-height:0; overflow:hidden;
  transition:max-height .35s ease, padding .35s ease;
}
.faq-item.is-open .faq-a{
  max-height:400px;
  padding-bottom:22px;
}
.faq-a p{
  font-family:var(--f-body); font-size:15.5px; line-height:1.6;
  color:var(--ink-2); padding-right:48px;
}
.faq-a p strong{ color:var(--black); font-weight:600; }
.faq-a p em{ font-style:italic; }

/* ---------- CTA enhancements ---------- */
.cta-perks{
  display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:18px;
}
.cta-perks span{
  font-family:var(--f-mono); font-size:11px; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--ink);
  display:inline-flex; align-items:center; gap:6px;
}
.cta-check{
  display:inline-grid; place-items:center;
  width:16px; height:16px; border-radius:50%;
  background:var(--black); color:var(--yellow);
  font-size:9px; font-weight:700;
}

/* ---------- bag pulse ---------- */
.bag.is-pulse .dotmark{ animation:bag-pulse .6s ease; }
@keyframes bag-pulse{
  0%{ transform:scale(1); }
  50%{ transform:scale(1.7); box-shadow:0 0 0 6px rgba(240,224,64,0.25); }
  100%{ transform:scale(1); }
}

/* ---------- sticky mobile CTA ---------- */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0;
  z-index:55;
  background:rgba(15,15,15,0.96);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-top:1px solid #1d1d1a;
  transform:translateY(120%);
  transition:transform .3s cubic-bezier(.4,.7,.3,1);
  pointer-events:none;
}
.sticky-cta.is-visible{ transform:translateY(0); pointer-events:auto; }
.sticky-cta-in{
  display:flex; align-items:center; justify-content:space-between;
  gap:14px;
  padding:12px var(--pad) calc(12px + env(safe-area-inset-bottom));
  max-width:var(--maxw); margin:0 auto;
}
.sticky-cta-copy{
  display:flex; align-items:center; gap:10px;
  color:#e7e7df;
  font-family:var(--f-body); font-size:13px; line-height:1.3;
  min-width:0; white-space:nowrap;
}
.sticky-cta-copy span{ overflow:hidden; text-overflow:ellipsis; }
.sticky-cta-copy strong{ color:#fff; font-weight:600; }
.sticky-sep{ color:#5a5a52; padding:0 2px; }
.sticky-cta-pulse{
  width:8px; height:8px; border-radius:50%;
  background:var(--yellow);
  box-shadow:0 0 0 0 rgba(240,224,64,0.55);
  animation:ann-pulse 1.8s ease-out infinite;
  flex:none;
}
.sticky-cta-btn{ padding:11px 18px; font-size:13px; flex:none; }
@media (min-width:861px){
  .sticky-cta{ display:none; }
}

/* ---------- modal price label ---------- */
.m-price-pre{
  display:block;
  font-family:var(--f-mono); font-size:9.5px; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--yellow-dk);
  font-weight:500; margin-bottom:2px;
}

/* ---------- scroll reveal ---------- */
.reveal.in{ animation:reveal-up .65s ease both; }
@keyframes reveal-up{ from{ opacity:0; transform:translateY(18px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ .reveal.in{ animation:none; } }

/* ---------- bag button reset ---------- */
button.bag{
  background:transparent;
  border:none;
  cursor:pointer;
  padding:6px 4px;
  border-radius:6px;
  transition:color .15s, background .15s;
}
button.bag:hover{ color:var(--ink); background:rgba(0,0,0,0.03); }
button.bag:focus-visible{ outline:2px solid var(--yellow-dk); outline-offset:2px; }

/* ---------- cart drawer ---------- */
.drawer{ position:fixed; inset:0; z-index:110; }
.drawer[hidden]{ display:none; }
.drawer-backdrop{
  position:absolute; inset:0;
  background:rgba(15,15,15,0.5);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  opacity:0; transition:opacity .22s ease;
}
.drawer.is-open .drawer-backdrop{ opacity:1; }
.drawer-panel{
  position:absolute; top:0; right:0; bottom:0;
  width:min(440px, 100vw);
  background:var(--cream);
  display:flex; flex-direction:column;
  box-shadow:-20px 0 60px rgba(15,15,15,0.18);
  transform:translateX(100%);
  transition:transform .28s cubic-bezier(.4,.7,.3,1);
}
.drawer.is-open .drawer-panel{ transform:translateX(0); }
.drawer-head{
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:14px;
  padding:22px 22px 18px;
  border-bottom:1px solid var(--hair);
}
.drawer-kicker{
  font-family:var(--f-mono); font-size:10px; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--yellow-dk);
  margin-bottom:6px;
}
.drawer-title{
  font-family:var(--f-display); font-weight:600;
  font-size:22px; line-height:1.15; letter-spacing:-0.01em;
  color:var(--ink);
  display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;
}
.drawer-count{ font-family:var(--f-mono); font-size:13px; color:var(--muted); font-weight:500; letter-spacing:0.06em; }
.drawer-close{
  width:34px; height:34px; flex:none;
  background:transparent; border:1px solid var(--hair);
  border-radius:50%; font-size:20px; line-height:1; color:var(--ink);
  cursor:pointer; display:grid; place-items:center;
  transition:background .15s, transform .2s, border-color .15s;
}
.drawer-close:hover{ background:#fff; border-color:var(--ink); transform:rotate(90deg); }

.drawer-body{ flex:1; overflow-y:auto; padding:8px 4px 8px 0; }
.drawer-items{ list-style:none; margin:0; padding:0; }
.drawer-item{
  display:grid;
  grid-template-columns:84px 1fr;
  gap:14px;
  padding:18px 22px;
  border-bottom:1px solid var(--hair-2);
  animation:drawer-item-in .25s ease both;
}
@keyframes drawer-item-in{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:none; } }
.drawer-item-photo{
  background:var(--cream-photo);
  border-radius:14px;
  aspect-ratio:1;
  display:grid; place-items:center;
  padding:8px;
  overflow:hidden;
}
.drawer-item-photo img{ width:100%; height:100%; object-fit:contain; }
.drawer-routine-photo{
  position:relative; display:block; padding:0; background:var(--black);
}
.drawer-routine-photo img{
  position:absolute; top:10%; width:43%; height:82%; object-fit:cover;
  border:1px solid rgba(255,255,255,.7); box-shadow:0 4px 10px rgba(0,0,0,.22);
}
.drawer-routine-photo img:nth-child(1){ left:7%; transform:rotate(-7deg); }
.drawer-routine-photo img:nth-child(2){ left:29%; z-index:2; }
.drawer-routine-photo img:nth-child(3){ right:7%; transform:rotate(7deg); }
.drawer-item-info{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.drawer-item-pep{
  font-family:var(--f-mono); font-size:9.5px; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--yellow-dk); font-weight:500;
}
.drawer-item-name{
  font-family:var(--f-display); font-weight:600;
  font-size:17px; line-height:1.15; color:var(--ink);
  letter-spacing:-0.005em;
}
.drawer-routine-includes{
  font-family:var(--f-body); font-size:10.5px; line-height:1.35; color:var(--muted);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.drawer-item-meta{
  display:flex; align-items:baseline; gap:8px; flex-wrap:wrap;
  margin-top:2px;
  font-family:var(--f-body); font-size:12.5px; color:var(--ink-2);
}
.drawer-item-deposit{ font-weight:600; color:var(--ink); }
.drawer-item .price-tbd{ font-size:11px; color:var(--muted); }
.drawer-item-controls{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin-top:10px;
}
.drawer-qty{
  display:inline-flex; align-items:center; gap:0;
  border:1px solid var(--hair); border-radius:999px;
  background:#fff; overflow:hidden;
}
.drawer-qty-btn{
  width:30px; height:30px; border:none; background:transparent;
  font-size:16px; line-height:1; color:var(--ink); cursor:pointer;
  display:grid; place-items:center;
  transition:background .12s, color .12s;
}
.drawer-qty-btn:hover{ background:var(--yellow); color:var(--black); }
.drawer-qty-n{
  min-width:24px; text-align:center;
  font-family:var(--f-mono); font-weight:500; font-size:13px;
  color:var(--ink);
}
.drawer-remove{
  background:transparent; border:none; cursor:pointer;
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--muted);
  padding:6px 2px;
  transition:color .15s;
}
.drawer-remove:hover{ color:var(--ink); text-decoration:underline; text-underline-offset:3px; }

.drawer-empty{
  padding:40px 28px 32px;
  text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:12px;
}
.drawer-empty[hidden]{ display:none; }
.drawer-empty-mark{
  width:56px; height:56px; border-radius:50%;
  background:var(--cream-photo);
  display:grid; place-items:center;
  margin-bottom:4px;
}
.drawer-empty-mark .dotmark{
  width:14px; height:14px; border-radius:50%;
  background:var(--yellow); display:inline-block;
}
.drawer-empty h4{
  font-family:var(--f-display); font-weight:600;
  font-size:19px; color:var(--ink); letter-spacing:-0.005em;
}
.drawer-empty p{
  font-family:var(--f-body); font-size:14px; line-height:1.5;
  color:var(--ink-2); max-width:30ch;
}
.drawer-loading{
  padding:44px 28px 34px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}
.drawer-loading[hidden]{ display:none; }
.drawer-loader{
  position:relative;
  width:68px;
  height:68px;
  margin-bottom:6px;
  display:grid;
  place-items:center;
}
.drawer-loader::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  border:1px solid rgba(26,26,23,0.08);
  background:linear-gradient(#fff,#fff) padding-box, conic-gradient(from 90deg, rgba(240,224,64,0), var(--yellow), rgba(26,26,23,0.18), rgba(240,224,64,0)) border-box;
  border:2px solid transparent;
  animation:drawer-spin 1.05s linear infinite;
}
.drawer-loader span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--yellow);
  display:block;
  position:absolute;
  box-shadow:0 0 0 6px rgba(240,224,64,0.16);
  animation:drawer-pulse 1.05s ease-in-out infinite;
}
.drawer-loader span:nth-child(1){ --loader-x:-15px; transform:translateX(var(--loader-x)); animation-delay:-.2s; }
.drawer-loader span:nth-child(2){ --loader-x:0; transform:translateX(var(--loader-x)); }
.drawer-loader span:nth-child(3){ --loader-x:15px; transform:translateX(var(--loader-x)); animation-delay:.2s; }
.drawer-loading h4{
  font-family:var(--f-display);
  font-weight:600;
  font-size:21px;
  line-height:1.15;
  color:var(--ink);
}
.drawer-loading p{
  font-family:var(--f-body);
  font-size:14px;
  line-height:1.5;
  color:var(--ink-2);
  max-width:30ch;
}
.drawer-loading-lines{
  width:min(260px, 78%);
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:8px;
}
.drawer-loading-lines span{
  height:10px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(26,26,23,0.07), rgba(255,255,255,0.9), rgba(26,26,23,0.07));
  background-size:220% 100%;
  animation:drawer-shimmer 1.1s ease-in-out infinite;
}
.drawer-loading-lines span:nth-child(2){ width:82%; align-self:center; animation-delay:.12s; }
.drawer-loading-lines span:nth-child(3){ width:58%; align-self:center; animation-delay:.24s; }
@keyframes drawer-spin{ to{ transform:rotate(360deg); } }
@keyframes drawer-pulse{ 0%,100%{ opacity:.45; transform:translateX(var(--loader-x,0)) scale(.78); } 50%{ opacity:1; transform:translateX(var(--loader-x,0)) scale(1); } }
@keyframes drawer-shimmer{ 0%{ background-position:120% 0; } 100%{ background-position:-120% 0; } }

.drawer-foot{
  border-top:1px solid var(--hair);
  padding:18px 22px calc(28px + env(safe-area-inset-bottom));
  background:var(--cream-2);
  display:flex; flex-direction:column; gap:10px;
}
.drawer-foot[hidden]{ display:none; }
.drawer-row{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.drawer-row-sub{
  font-family:var(--f-body); font-weight:500; font-size:14px; color:var(--ink-2);
}
.drawer-sub{
  font-family:var(--f-display); font-weight:600; font-size:24px;
  color:var(--ink); letter-spacing:-0.01em;
}
.drawer-fine{
  font-family:var(--f-body); font-size:11.5px; line-height:1.45;
  color:var(--muted);
}
.drawer-fine a{
  color:var(--ink);
  text-decoration:underline;
  text-decoration-color:var(--yellow);
  text-underline-offset:3px;
}
.drawer-fine a:hover{ text-decoration-color:var(--yellow-dk); }
.drawer-trust{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:10px 0 2px;
  padding:12px 14px;
  border-radius:10px;
  background:#f6f5ee;
  border:1px solid rgba(26,26,23,0.06);
}
.drawer-trust .dt-item{
  font-family:var(--f-body);
  font-size:12px;
  line-height:1.3;
  color:var(--ink-2);
  display:flex;
  gap:9px;
  align-items:center;
  letter-spacing:0.005em;
}
.drawer-trust .dt-icon{
  width:15px;
  height:15px;
  flex:none;
  color:var(--ink);
  opacity:0.7;
}
.drawer-ship{
  display:flex; flex-direction:column; gap:6px;
  padding:10px 12px;
  border:1px solid var(--hair); border-radius:10px;
  background:#fafaf6;
}
.drawer-ship[data-state="unlocked"]{
  background:rgba(240,224,64,0.18); border-color:rgba(240,224,64,0.55);
}
.drawer-ship-msg{
  font-family:var(--f-body); font-size:12px; line-height:1.35;
  color:var(--ink); font-weight:600; letter-spacing:-0.005em;
  display:flex; align-items:center; gap:6px;
}
.drawer-ship-tick{
  display:inline-grid; place-items:center;
  width:14px; height:14px; border-radius:50%;
  background:var(--ink); color:var(--yellow);
  font-size:9px; font-weight:700;
}
.drawer-ship-bar{
  height:4px; border-radius:99px;
  background:rgba(26,26,23,0.08); overflow:hidden;
}
.drawer-ship-fill{
  display:block; height:100%;
  background:var(--ink);
  border-radius:99px;
  transition:width .25s ease;
}
.drawer-ship[data-state="unlocked"] .drawer-ship-fill{ background:var(--ink); }
.drawer-checkout{ width:100%; justify-content:center; margin-top:4px; padding:15px 22px; font-size:14.5px; }
.drawer-keep{
  background:transparent; border:none; cursor:pointer;
  font-family:var(--f-mono); font-size:10.5px; letter-spacing:0.12em;
  text-transform:uppercase; color:var(--muted);
  padding:8px 2px; align-self:center;
  transition:color .15s;
}
.drawer-keep:hover{ color:var(--ink); }

.drawer-success{
  padding:48px 28px 32px;
  text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:12px;
  flex:1;
}
.drawer-success[hidden]{ display:none; }
.drawer-success-mark{
  width:64px; height:64px; border-radius:50%;
  background:var(--yellow); color:var(--black);
  display:grid; place-items:center;
  font-size:30px; font-weight:600;
  margin-bottom:8px;
}
.drawer-success-mark.is-loading{
  position:relative;
  background:#fff;
  color:transparent;
  border:1px solid rgba(26,26,23,0.08);
  overflow:hidden;
}
.drawer-success-mark.is-loading::before{
  content:"";
  position:absolute;
  inset:7px;
  border-radius:50%;
  border:3px solid rgba(26,26,23,0.08);
  border-top-color:var(--yellow);
  border-right-color:var(--yellow);
  animation:drawer-spin .85s linear infinite;
}
.drawer-success-mark.is-loading span{
  width:10px;
  height:10px;
  border-radius:50%;
  background:var(--yellow);
  box-shadow:0 0 0 8px rgba(240,224,64,0.18);
  display:block;
}
.drawer-success h4{
  font-family:var(--f-display); font-weight:600;
  font-size:24px; color:var(--ink); letter-spacing:-0.01em;
}
.drawer-success p{
  font-family:var(--f-body); font-size:14.5px; line-height:1.55;
  color:var(--ink-2); max-width:32ch;
  margin-bottom:12px;
}

.js-add.is-loading{
  position:relative;
  color:transparent;
  pointer-events:none;
}
.js-add.is-loading .arr,
.js-add.is-loading .add-for,
.js-add.is-loading .add-price{ color:transparent; }
.js-add.is-loading::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  margin-left:-9px;
  margin-top:-9px;
  width:18px;
  height:18px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,0.35);
  border-top-color:var(--yellow);
  animation:drawer-spin .7s linear infinite;
}

/* ---------- drawer line items (breakdown) ---------- */
.drawer-row-line{
  font-family:var(--f-body); font-size:13px; color:var(--ink-2);
  padding:2px 0;
}
.drawer-row-line[hidden]{ display:none; }
.drawer-line-v{ font-family:var(--f-mono); font-weight:500; font-size:12.5px; color:var(--ink); letter-spacing:0.02em; }

/* ---------- Founder Pass add-on ---------- */
.drawer-add{
  border:1px solid var(--hair);
  background:#fff;
  border-radius:14px;
  margin-bottom:4px;
  transition:border-color .18s, box-shadow .18s;
}
.drawer-add.is-active{
  border-color:var(--yellow-dk);
  box-shadow:0 0 0 3px rgba(240,224,64,0.18);
}
.drawer-add-toggle{
  width:100%; background:transparent; border:none; cursor:pointer;
  display:flex; align-items:center; gap:12px;
  padding:12px 14px;
  text-align:left;
  color:var(--ink);
  border-radius:14px;
}
.drawer-add-toggle:hover{ background:rgba(240,224,64,0.06); }
.drawer-add-mark{
  width:30px; height:30px; flex:none;
  border-radius:50%;
  background:var(--cream-photo);
  display:grid; place-items:center;
}
.drawer-add.is-active .drawer-add-mark{ background:var(--yellow); }
.drawer-add-mark .dotmark{
  width:8px; height:8px; border-radius:50%;
  background:var(--yellow);
}
.drawer-add.is-active .drawer-add-mark .dotmark{ background:var(--black); }
.drawer-add-copy{ display:flex; flex-direction:column; gap:2px; flex:1; min-width:0; }
.drawer-add-title{
  font-family:var(--f-body); font-weight:600; font-size:14px;
  color:var(--ink); letter-spacing:-0.005em;
  display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.drawer-add-title em{
  font-family:var(--f-serif); font-style:italic; font-weight:400;
  color:var(--ink);
}
.drawer-add-pill{
  font-family:var(--f-mono); font-size:10.5px; font-weight:500;
  letter-spacing:0.06em;
  background:var(--yellow); color:var(--black);
  padding:2px 8px; border-radius:999px;
  line-height:1.4;
}
.drawer-add-pill[hidden]{ display:none; }
.drawer-add-sub{
  font-family:var(--f-body); font-size:12px; line-height:1.4;
  color:var(--muted);
}
.drawer-add-caret{
  width:26px; height:26px; flex:none;
  border-radius:50%; border:1px solid var(--hair);
  display:grid; place-items:center;
  font-size:16px; line-height:1; color:var(--ink);
  transition:background .15s, border-color .15s, color .15s;
}
.drawer-add.is-active .drawer-add-caret{
  background:var(--ink); color:#fff; border-color:var(--ink);
  font-size:14px;
}
.drawer-add-amt{
  font-family:var(--f-heading); font-weight:700;
  color:var(--ink); letter-spacing:-0.01em;
}
.drawer-add.is-active .drawer-add-amt{ color:var(--muted); }

@media (max-width:480px){
  .drawer-item{ grid-template-columns:72px 1fr; padding:16px 18px; }
  .drawer-head{ padding:18px 18px 14px; }
  .drawer-foot{ padding:16px 18px calc(26px + env(safe-area-inset-bottom)); }
  .drawer-qty-btn{ width:40px; height:40px; font-size:18px; }
  .drawer-qty-n{ min-width:28px; font-size:14px; }
  .drawer-remove{ padding:12px 4px; min-height:44px; display:inline-flex; align-items:center; }
}
@media (prefers-reduced-motion:reduce){
  .drawer-panel, .drawer-backdrop{ transition:none; }
  .drawer-item{ animation:none; }
}

/* ============================================================
   SHOP — Shopify commerce additions
   ============================================================ */

/* SKU band — convert the "add" pill into a real button + inline stock pill */
.sku-band .add{
  display:inline-flex; align-items:center; gap:6px;
  justify-content:center;
  background:var(--ink); color:#fff;
  border:none; cursor:pointer;
  font:inherit; font-family:var(--f-mono); font-size:11px; letter-spacing:0.14em;
  text-transform:uppercase;
  min-width:178px;
  padding:11px 18px;
  border-radius:999px;
  transition:transform .12s ease, background .15s;
}
.sku-band .add:hover{ background:#000; transform:translateY(-1px); }
.sku-band .add:active{ transform:translateY(0); }
.sku-band .meta{
  display:inline-flex; align-items:center; gap:10px;
  flex-wrap:wrap;
}
.sku-band:has(.sku-stock:not([hidden])){ justify-content:space-between; }
.sku-band .meta:has(.sku-stock[hidden]){ display:none; }
.sku-stock{
  display:inline-block;
  font-family:var(--f-mono); font-size:10px; letter-spacing:0.1em;
  text-transform:uppercase;
  padding:3px 7px; border-radius:999px;
  background:rgba(0,0,0,0.05); color:var(--ink-2);
}
.sku-stock.is-low{ background:rgba(255, 200, 60, 0.18); color:#7a5400; }
.sku-stock.is-out{ background:rgba(160, 30, 30, 0.1); color:#8a1a1a; }
.sku-stock[hidden]{ display:none; }

/* Drawer item — replace TBD/deposit pill with real price */
.drawer-item-price{
  font-family:var(--f-mono); font-weight:600; color:var(--ink);
}
.drawer-item-sub{
  display:inline-block; margin-left:8px;
  font-family:var(--f-mono); font-size:10px; letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--ink-2);
  padding:2px 6px; border-radius:999px; background:rgba(0,0,0,0.05);
}

/* Modal — subscription toggle */
.m-sub{
  display:flex; align-items:center; gap:12px;
  margin:14px 0 4px;
  padding:12px 14px;
  border:1px solid rgba(0,0,0,0.08);
  border-radius:12px;
  cursor:pointer;
  transition:border-color .15s, background .15s;
}
.m-sub:has(input:checked){
  border-color:var(--ink);
  background:rgba(0,0,0,0.03);
}
.m-sub input{
  appearance:none;
  width:18px; height:18px;
  border:1.5px solid var(--ink-2); border-radius:5px;
  cursor:pointer; position:relative;
  flex:0 0 auto;
  transition:background .15s, border-color .15s;
}
.m-sub input:checked{
  background:var(--ink); border-color:var(--ink);
}
.m-sub input:checked::after{
  content:''; position:absolute; left:5px; top:1px;
  width:5px; height:10px;
  border:solid #fff; border-width:0 2px 2px 0;
  transform:rotate(45deg);
}
.m-sub-copy{ display:flex; flex-direction:column; gap:1px; flex:1 1 auto; min-width:0; }
.m-sub-title{ font-weight:600; font-size:14px; color:var(--ink); }
.m-sub-sub{ font-size:11.5px; color:var(--ink-2); }
.m-sub-pill{
  font-family:var(--f-mono); font-size:11px; font-weight:600; letter-spacing:0.06em;
  padding:4px 9px; border-radius:999px;
  background:var(--ink); color:#fff;
  flex:0 0 auto;
}
.m-sub[hidden]{ display:none; }

/* Modal — reviews slot (empty placeholder; widget injects markup) */
.m-reviews:empty{ display:none; }
.m-reviews{ margin-top:18px; padding-top:16px; border-top:1px solid rgba(0,0,0,0.06); }

/* Modal price clean-up — no more "TBD" */
.m-price-pre{
  font-family:var(--f-mono); font-size:10px; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--muted);
  margin-right:8px;
}

@media (max-width:480px){
  .sku-band{ flex-wrap:wrap; gap:8px; }
  .sku-band .add{
    width:100%;
    min-width:0;
    min-height:42px;
    justify-content:center;
    border-radius:12px;
    font-family:var(--f-body);
    font-size:13px;
    font-weight:700;
    letter-spacing:0;
    text-transform:none;
    padding:10px 12px;
    box-shadow:none;
  }
  .m-sub{ padding:10px 12px; }
}