/* ---------- vertical rhythm: less air between sections ---------- */
.section { padding-block: clamp(56px, 7.5vw, 112px); }
/* the newsletter runs straight on from the FAQ */
#faq { padding-bottom: clamp(34px, 4vw, 60px); }
.section:has(> .news) { padding-top: 0; padding-bottom: clamp(56px, 7vw, 100px); }

/* ============================================================
   MYRO — clean.css
   Desktop flow brought in line with AG1 / Nomio / Organised:
   light product hero, tick list, one idea per section, Nomio
   dosing table, AG1 pricing panel, Nomio athlete tabs.
   Applies at all widths; mobile.css refines phones afterwards.
   ============================================================ */

/* ---------- sections retired from the flow ---------- */
#product, .trustbar, .marquee, .promotab, .stickybar { display: none !important; }
body:not(.subpage) #xray, body:not(.subpage) .soil, body:not(.subpage) .specimen,
body:not(.subpage) .blurband, body:not(.subpage) #shop { display: none !important; }

/* ---------- "2.7kg of broccoli" statement (replaces the molecule) ---------- */
.kg { display: flex; flex-direction: column; margin: 14px 0 22px; }
.kg__n { font-family: var(--display); font-weight: 500; font-size: clamp(5rem, 11vw, 9.5rem); line-height: .9; letter-spacing: -.045em; color: var(--espresso); }
.kg__n small { font-family: var(--mono); font-size: .3em; letter-spacing: .02em; color: var(--lab); margin-left: 10px; }
.kg__l { font-family: var(--display); font-weight: 500; font-size: clamp(1.6rem, 3vw, 2.6rem); line-height: 1.05; letter-spacing: -.02em; margin-top: 12px; color: var(--espresso); }
.molecule__art { background: #F3EEE4; border: none; }
.molecule__art img { mix-blend-mode: normal; animation: none; object-fit: cover; }
.molecule__copy .readout { display: none; }

/* ---------- protocol: a proper dosing table ---------- */
.dose__legend {
  display: flex; flex-wrap: wrap; gap: 10px 30px; list-style: none; margin: 0 0 26px;
  font-size: 13.5px; color: var(--ink-soft);
}
.dose__legend li { display: flex; align-items: center; gap: 10px; }
.dose { display: block; background: transparent; border: none; border-radius: 0; border-top: 1px solid var(--line); }
.dose > div {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto 170px;
  grid-template-rows: auto auto;
  align-items: center; column-gap: 26px; row-gap: 2px;
  padding: 18px 0; border-bottom: 1px solid var(--line);
  background: transparent; min-height: 0;
}
.dose .k {
  grid-column: 1; grid-row: 1; align-self: end; margin: 0;
  display: block; font-family: var(--mono); font-size: 9.5px; letter-spacing: .18em;
  text-transform: uppercase; color: var(--ink-faint);
}
.dose h4 {
  grid-column: 1; grid-row: 2; align-self: start; margin: 0;
  font-family: var(--display); font-weight: 400; font-size: 1.25rem;
  color: var(--espresso); letter-spacing: -.01em;
}
.dose .bottles {
  grid-column: 2; grid-row: 1 / span 2; justify-self: center;
  display: flex; align-items: center; gap: 7px; margin: 0; height: auto;
}
.dose .bottles i, .dose__legend .d {
  width: 13px; height: 13px; border-radius: 50%; border: 1.5px solid var(--clay);
  background: transparent; display: inline-block; position: relative; flex-shrink: 0;
}
.dose .bottles i::before { display: none; }
.dose .bottles i.on, .dose__legend .d.on, .dose .race .bottles i.on { background: var(--gold); border-color: var(--gold); }
.dose .bottles i + i, .dose__legend .d + .d { margin-left: 0; }
.dose .t {
  grid-column: 3; grid-row: 1 / span 2; margin: 0; text-align: right;
  font-family: var(--grotesk); font-size: 12.5px; line-height: 1.4; color: var(--ink-soft);
}
.dose .t b { display: block; color: var(--espresso); font-weight: 500; font-size: 13.5px; }
.dose .t br { display: none; }
.dose .race { background: transparent; }
.dose .race h4, .dose .race .t b { color: var(--espresso); }
.dose .race .k { color: var(--gold); }
.dose .race .t { color: var(--ink-soft); }

/* ---------- pricing: AG1 dark panel ---------- */
.subs__art .seal { display: none; }
.subs__panel { background: var(--espresso); color: var(--bone); border: none; }
.subs__panel h2, .subs__price .now { color: var(--bone); }
.subs__panel .eyebrow { color: var(--gold-2); }
.subs__stars { color: rgba(239,233,222,.7); }
.toggle { background: rgba(239,233,222,.12); }
.toggle button { color: rgba(239,233,222,.7); }
.toggle button.active { background: var(--bone); color: var(--espresso); }
.subs__price .was { color: rgba(239,233,222,.5); }
.subs__price .per { color: var(--gold-2); }
.subs__free, .subs__list, .subs__note { display: none; }
.subs__includes { border-top-color: rgba(239,233,222,.2); margin: 14px 0 20px; }
.subs__inc-title { color: rgba(239,233,222,.75); }
.inc b { color: var(--bone); font-size: 15px; }
.inc span { color: rgba(239,233,222,.65); font-size: 13px; }
.inc em { color: var(--bone); font-family: var(--grotesk); font-weight: 500; font-size: 15px; }
.inc em s { color: rgba(239,233,222,.5); font-weight: 400; }
.inc.total { border-top-color: rgba(239,233,222,.2); }
.subs__panel .btn--dark { background: var(--bone); color: var(--espresso); font-size: 16px; padding: 17px; }
.subs__panel .btn--dark:hover { background: #fff; }
.subs__checks { display: flex; justify-content: center; gap: 22px; flex-wrap: wrap; margin-top: 16px; font-size: 13.5px; color: rgba(239,233,222,.85); list-style: none; }

/* ---------- athletes: Nomio "Trusted by the best" tabs ---------- */
.ath-tabs { display: flex; gap: 28px; overflow-x: auto; scrollbar-width: none; border-bottom: 1px solid var(--line); margin-bottom: 30px; }
.ath-tabs::-webkit-scrollbar { display: none; }
.ath-tabs button { flex: 0 0 auto; font-size: 17px; color: var(--ink-soft); padding: 0 0 12px; border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color .3s; }
.ath-tabs button.on { color: var(--espresso); border-color: var(--espresso); }
.athletes__grid { display: block; }
.ath { display: none; aspect-ratio: auto; background: transparent; border-radius: 0; }
.ath.on { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 70px); align-items: center; }
.ath img { position: static; aspect-ratio: 4/3.4; border-radius: var(--radius-lg); order: 2; }
.ath:hover img { transform: none; }
.ath__cap { position: static; padding: 0; background: none; color: var(--espresso); display: flex; flex-direction: column; }
.ath__cap .who { order: -1; margin: 0 0 18px; flex-direction: column; align-items: flex-start; gap: 6px; font-family: var(--grotesk); text-transform: none; letter-spacing: 0; opacity: 1; }
.ath__cap .who span { font-family: var(--display); font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1; color: var(--espresso); }
.ath__cap .who i { color: var(--ink-soft); font-size: 16px; }
.ath__cap q, .ath--wide .ath__cap q { font-family: var(--grotesk); font-size: clamp(1.1rem, 1.6vw, 1.35rem); line-height: 1.5; color: var(--espresso); max-width: 46ch; }
.athletes__row .disciplines { display: none; }

/* ---------- research: plain list, no side image ---------- */
.research__grid { grid-template-columns: 1fr; }
.research__media { display: none; }
.paper .meta { display: none; }
.paper { grid-template-columns: 54px minmax(0, 1fr) 132px; gap: 28px; padding: 26px 0; align-items: start; }
.paper h3 { max-width: 46ch; }
.paper a.go { justify-self: end; text-align: center; width: 100%; }
/* every study is listed at this width, so the reveal button is redundant */
.papers__more { display: none; }
.research__disc { margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--line); max-width: 78ch; }

/* ---------- founder ---------- */
.founder__media .badge { max-width: calc(100% - 36px); white-space: normal; text-align: center; line-height: 1.5; }

/* the product photo in the hero is a phone-only element */
.vhero__img { display: none; }
.vhero__cta .btn--light { background: var(--bone); color: var(--espresso); }
@media (max-width: 820px) { .ath.on { grid-template-columns: 1fr; } }


/* ---------- ingredients: photo, then caption beneath ---------- */
.ingredients { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(18px, 2.5vw, 30px); }
.ing { display: block; margin: 0; background: none; border-radius: 0; aspect-ratio: auto; overflow: visible; }
.ing__media { border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 4/4.4; background: var(--sand); }
.ing__media img { position: static; width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.ing:hover .ing__media img { transform: scale(1.03); }
.ing__cap { position: static; padding: 18px 0 0; background: none; width: auto; color: var(--espresso); }
.ing__cap h4 { font-family: var(--display); font-size: clamp(1.3rem, 2vw, 1.7rem); color: var(--espresso); text-transform: none; letter-spacing: -.02em; }
.ing__cap p {
  margin-top: 8px; font-size: 14.5px; line-height: 1.5; color: var(--ink-soft); max-width: none;
  /* two lines of near-equal length, every card the same height */
  text-wrap: balance;
  min-height: calc(2 * 1.5em);
}

/* ---------- newsletter: dark editorial band ---------- */
.news {
  background: var(--espresso); color: var(--bone); border: none; border-radius: var(--radius-lg);
  padding: 0; text-align: left; overflow: hidden;
  display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 0; align-items: stretch;
}
.news__media { position: relative; min-height: 100%; background: #14110b; }
.news__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.news__body { padding: clamp(34px, 4.4vw, 62px); display: flex; flex-direction: column; justify-content: center; }
.news .eyebrow { display: block; color: var(--gold-2); }
.news h2 {
  color: var(--bone); font-family: var(--display); font-weight: 400;
  font-size: clamp(1.9rem, 3.1vw, 2.7rem); line-height: 1.06; letter-spacing: -.015em; margin-top: 14px;
}
.news .news__form { display: flex; align-items: flex-end; gap: 14px; margin: 30px 0 0; flex-wrap: wrap; }
.news__field { flex: 1 1 260px; display: block; border-bottom: 1px solid rgba(239,233,222,.35); transition: border-color .3s var(--ease); }
.news__field:focus-within { border-color: var(--gold-2); }
.news__field > span {
  display: block; font-family: var(--mono); font-size: 10px; letter-spacing: .2em;
  text-transform: uppercase; color: rgba(239,233,222,.55); margin-bottom: 8px;
}
.news .news__form input {
  width: 100%; border: none; background: transparent; border-radius: 0; padding: 0 0 12px;
  font-family: var(--grotesk); font-size: 17px; color: var(--bone);
}
.news .news__form input::placeholder { color: rgba(239,233,222,.4); }
.news .news__form input:focus { outline: none; }
.news .news__form .btn--light { background: var(--bone); color: var(--espresso); flex-shrink: 0; }
.news .news__form .btn--light:hover { background: #fff; }
.news__perks { list-style: none; margin: 30px 0 0; display: grid; gap: 11px; }
.news__perks li {
  display: flex; align-items: baseline; gap: 12px; font-size: 14.5px; color: rgba(239,233,222,.78);
}
.news__perks li::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold-2); flex-shrink: 0;
  transform: translateY(-2px);
}

@media (max-width: 900px) {
  .news { grid-template-columns: 1fr; }
  .news__media { min-height: 0; aspect-ratio: 16/9; }
  .news__body { padding: 30px 24px 34px; }
  .news h2 { font-size: 1.9rem; }
  .news .news__form { flex-direction: column; align-items: stretch; gap: 20px; }
  .news .news__form .btn--light { width: 100%; border-radius: 6px; }
}

/* ---------- founder credit: name and role on their own lines ---------- */
.founder blockquote { text-wrap: pretty; }
.founder cite { display: block; }
.founder cite span { display: block; margin-top: 4px; color: var(--ink-soft); }


/* ============================================================
   EXPANDING FILM (Neko-style) — inset card grows to full bleed
   ============================================================ */
.expand { position: relative; height: 250vh; background: var(--bone); }
.expand__sticky { position: sticky; top: 0; height: 100svh; overflow: hidden; }
.expand__media {
  position: absolute; inset: 0; overflow: hidden;
  --p: 0;
  clip-path: inset(
    calc((1 - var(--p)) * 11vh)
    calc((1 - var(--p)) * 15vw)
    round calc((1 - var(--p)) * 26px)
  );
  will-change: clip-path;
}
.expand__media video, .expand__media img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transform: scale(calc(1.1 - var(--p) * 0.1));
}
.expand__scrim {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(12,10,7,.45) 0%, rgba(12,10,7,.25) 40%, rgba(12,10,7,.72) 100%);
}
.expand__copy {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; padding: 0 var(--gutter); color: var(--bone);
  opacity: var(--p); transition: opacity .2s linear;
}
.expand__copy .eyebrow { color: rgba(239,233,222,.8); display: block; }
.expand__copy h2 {
  color: var(--bone); font-size: clamp(2rem, 4.6vw, 3.6rem); line-height: 1.04; margin: 16px 0 18px;
  text-shadow: 0 2px 40px rgba(0,0,0,.35);
}
.expand__copy p { max-width: 52ch; font-size: clamp(1rem, 1.5vw, 1.2rem); color: rgba(239,233,222,.88); line-height: 1.5; }
.expand__copy .btn--light { margin-top: 30px; background: var(--bone); color: var(--espresso); }

@media (max-width: 820px) {
  .expand { height: 200vh; }
  .expand__media { clip-path: inset(calc((1 - var(--p)) * 7vh) calc((1 - var(--p)) * 7vw) round calc((1 - var(--p)) * 20px)); }
  .expand__copy p { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .expand { height: auto; }
  .expand__sticky { position: static; height: 90svh; }
  .expand__media { clip-path: none; }
  .expand__copy { opacity: 1; }
}


/* ---------- serif headings: a few size and tracking corrections ---------- */
.vhero h1, .hero__title { letter-spacing: -0.02em; line-height: 1.0; }
.kg__n { font-size: clamp(5rem, 10vw, 8.6rem); letter-spacing: -.03em; line-height: 1; }
.stat .v, .reviews__score .big, .subs__price .now { letter-spacing: -.015em; }
.ath__cap .who span { letter-spacing: -.012em; }
h2 em, h1 em { font-style: italic; }

/* ---------- buttons at AG1 / Organised scale ---------- */
.vhero__cta .btn, .hero__cta .btn, .evidence__copy .btn, .guarantee .btn,
.expand__copy .btn, .athletes__row .btn, .bfacts, .papers__more { min-height: 60px; font-size: 16px; }
.subs__panel .btn--dark { min-height: 62px; font-size: 16.5px; padding: 20px 34px; }
.pcard .btn, .paper a.go, .chips button, .toggle button { min-height: 0; }
.pcard .btn { padding: 14px 26px; min-height: 48px; font-size: 14.5px; }
.nav__buy { min-height: 0; padding: 11px 20px; font-size: 13.5px; }


/* ============================================================
   HERO EXIT — the film contracts into a card as you scroll off
   ============================================================ */
.vhero { display: block; overflow: visible; height: 175vh; background: var(--bone); }
.vhero__stage {
  position: sticky; top: 0; height: 100svh; overflow: hidden;
  display: flex; align-items: flex-end; --e: 0;
}
.vhero__media {
  clip-path: inset(
    calc(var(--e) * 9vh)
    calc(var(--e) * 13vw)
    round calc(var(--e) * 26px)
  );
  will-change: clip-path;
}
.vhero__media img, .vhero__media video { transform: scale(calc(1 + var(--e) * 0.04)); }
.vhero__inner, .vhero__scroll { opacity: calc(1 - var(--e) * 1.6); }
.vhero__inner { transform: translateY(calc(var(--e) * -26px)); }

@media (max-width: 820px) {
  .vhero { height: 165vh; }
  .vhero__media { clip-path: inset(calc(var(--e) * 6vh) calc(var(--e) * 6vw) round calc(var(--e) * 18px)); }
}
@media (prefers-reduced-motion: reduce) {
  .vhero { height: auto; }
  .vhero__stage { position: static; height: 92svh; }
  .vhero__media { clip-path: none; }
  .vhero__inner, .vhero__scroll { opacity: 1; transform: none; }
}


/* ---------- repeated buy call to action ---------- */
.buyrow { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-top: clamp(30px, 4vw, 46px); }
.buyrow__note { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft); }
#ingredients .buyrow, #reviews .buyrow { justify-content: center; }
@media (max-width: 820px) {
  .buyrow { flex-direction: column; align-items: stretch; gap: 12px; text-align: center; margin-top: 26px; }
  .buyrow .btn { width: 100%; border-radius: 6px; }
  .buyrow__note { text-align: center; font-size: 10.5px; }
}


/* ============================================================
   SUBPAGES — page header, explore cards, closing CTA
   ============================================================ */
.phead { background: var(--bone-2); padding: clamp(46px, 7vw, 96px) 0 clamp(40px, 6vw, 80px); border-bottom: 1px solid var(--line-soft); }
.phead__back {
  display: inline-block; font-family: var(--mono); font-size: 10.5px; letter-spacing: .2em;
  text-transform: uppercase; color: var(--ink-soft); margin-bottom: 22px; transition: color .3s;
}
.phead__back::before { content: "\2190"; margin-right: 9px; }
.phead__back:hover { color: var(--espresso); }
.phead .eyebrow { display: block; color: var(--ink-soft); }
.phead h1 { margin: 14px 0 20px; }
.phead .lead { max-width: 58ch; }
/* the first section on a subpage sits closer to the header, and does not repeat its title */
.subpage .phead + section { padding-top: clamp(40px, 5vw, 76px); }
.subpage .phead + section > .wrap > .shead:first-child { display: none; }
.subpage .molecule { background: var(--bone); }

.explore { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.ecard {
  display: block; border-radius: var(--radius-lg); overflow: hidden; background: var(--paper);
  border: 1px solid var(--line-soft); transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}
.ecard:hover { transform: translateY(-5px); box-shadow: 0 30px 60px -34px rgba(33,30,24,.28); }
.ecard img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.ecard__body { padding: 22px 22px 26px; }
.ecard__body span { font-family: var(--mono); font-size: 10.5px; letter-spacing: .2em; color: var(--gold); }
.ecard__body h3 { font-size: 1.4rem; margin: 10px 0 8px; }
.ecard__body p { font-size: 13.5px; color: var(--ink-soft); line-height: 1.45; }

.pcta { text-align: center; max-width: 640px; margin-inline: auto; }
.pcta .lead { margin: 16px auto 0; }
.pcta .buyrow { justify-content: center; }

@media (max-width: 1000px) { .explore { grid-template-columns: repeat(2, 1fr); } }


/* ============================================================
   BUY BAND — the product offer, straight after the hero
   ============================================================ */
.buyband { background: var(--bone); padding-block: clamp(48px, 6vw, 92px); }
.buyband__grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(30px, 5vw, 72px); align-items: center; }
.buyband__media { aspect-ratio: 4/4.2; display: grid; place-items: center; }
.buyband__media img { width: 100%; height: 100%; object-fit: contain; }
.buyband__body { max-width: 540px; }
.buyband .eyebrow { display: block; color: var(--ink-soft); }
.buyband h2 { margin-top: 14px; }
.buyband__price { display: flex; align-items: baseline; gap: 14px; margin: 22px 0 4px; }
.buyband__price .now { font-family: var(--display); font-size: clamp(2.2rem, 3.4vw, 3rem); color: var(--espresso); letter-spacing: -.02em; }
.buyband__price .was { font-family: var(--mono); font-size: 15px; color: var(--ink-faint); text-decoration: line-through; }
.buyband__price .per { font-family: var(--mono); font-size: 12px; letter-spacing: .06em; color: var(--gold); }
.buyband__list { list-style: none; margin: 22px 0 0; display: grid; gap: 11px; }
.buyband__list li { display: flex; align-items: baseline; gap: 12px; font-size: 15px; color: var(--ink); }
.buyband__list li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); flex-shrink: 0; transform: translateY(-2px); }
.buyband__cta { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; margin-top: 30px; }
.buyband__alt { font-size: 14.5px; color: var(--ink-soft); border-bottom: 1px solid var(--line); padding-bottom: 2px; transition: color .3s, border-color .3s; }
.buyband__alt:hover { color: var(--espresso); border-color: var(--espresso); }
.buyband__trust {
  display: flex; gap: 24px; flex-wrap: wrap; margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line);
  font-family: var(--mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft);
}

@media (max-width: 820px) {
  .buyband { padding-block: 34px 44px; }
  .buyband__grid { grid-template-columns: 1fr; gap: 22px; }
  .buyband__media { aspect-ratio: 4/3.6; }
  .buyband h2 { font-size: 2rem; }
  .buyband__cta { flex-direction: column; align-items: stretch; gap: 14px; }
  .buyband__cta .btn { width: 100%; border-radius: 6px; }
  .buyband__alt { text-align: center; border: none; }
  .buyband__trust { gap: 14px; font-size: 9.5px; justify-content: space-between; }
}


/* ---------- protocol: the track photo runs flush to the left edge ---------- */
.protocol__grid { align-items: stretch; }
.protocol__media {
  aspect-ratio: auto; align-self: stretch; min-height: 460px;
  border-radius: var(--radius-lg);
}
.protocol__media img { object-position: 60% 50%; }
.protocol__grid > .reveal:last-child { display: flex; flex-direction: column; justify-content: center; }
@media (max-width: 820px) {
  .protocol__media { min-height: 0; aspect-ratio: 16/10; border-radius: 14px; }
}


/* ============================================================
   PRIMARY CTA — give the buy buttons real presence
   ============================================================ */
.btn--dark, .vhero__cta .btn--light, .subs__panel .btn--dark, .expand__copy .btn--light {
  font-weight: 600; letter-spacing: .005em;
  box-shadow: 0 14px 34px -16px rgba(33, 30, 24, .55);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), background .3s var(--ease);
}
.btn--dark:hover, .vhero__cta .btn--light:hover, .subs__panel .btn--dark:hover, .expand__copy .btn--light:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 44px -16px rgba(33, 30, 24, .62);
}
.btn--dark:active, .vhero__cta .btn--light:active { transform: translateY(0); }
/* on dark panels the shadow reads as depth, not grime */
.subs__panel .btn--dark, .expand__copy .btn--light { box-shadow: 0 16px 38px -18px rgba(0, 0, 0, .8); }
.pcard .btn--dark { box-shadow: none; }
.pcard .btn--dark:hover { transform: none; }

/* the repeated buy call to action owns its own line */
.buyrow {
  display: flex; flex-direction: column; align-items: flex-start; gap: 14px;
  margin-top: clamp(34px, 4.5vw, 54px);
}
.buyrow .btn { min-height: 64px; padding: 21px 46px; font-size: 16.5px; }
.buyrow__note {
  font-family: var(--mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--ink-soft);
}
#ingredients .buyrow, #reviews .buyrow, .pcta .buyrow { align-items: center; }
@media (max-width: 820px) {
  .buyrow { align-items: stretch; text-align: center; }
  .buyrow .btn { width: 100%; border-radius: 6px; }
}


/* the dosing table's rules all run the same width */
.dose > div:last-child { border-bottom: 1px solid var(--line); }
.dose__legend { border-bottom: none; }

/* instagram link on the UGC tag line */
.ugc__tag a { display: inline-flex; align-items: center; gap: 10px; color: inherit; transition: color .3s; }
.ugc__tag a:hover { color: var(--espresso); }
.ugc__tag .ig { width: 17px; height: 17px; flex-shrink: 0; }


/* ============================================================
   SUBSCRIPTION — gallery, spec strip, denser panel (AG1 / Organised)
   ============================================================ */
.subs { background: var(--bone-2); }
.subs__grid { grid-template-columns: 1fr 1.02fr; align-items: start; }
.subs__gallery { display: flex; flex-direction: column; gap: 12px; }
.subs__stage {
  position: relative; border-radius: var(--radius-lg); overflow: hidden;
  aspect-ratio: 4/3.6; background: var(--paper); border: 1px solid var(--line-soft);
}
.subs__stage img { width: 100%; height: 100%; object-fit: cover; }
.subs__flag {
  position: absolute; top: 16px; left: 16px;
  font-family: var(--mono); font-size: 10px; letter-spacing: .16em; text-transform: uppercase;
  background: var(--espresso); color: var(--bone); padding: 8px 14px; border-radius: 100px;
}
.subs__thumbs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.subs__thumbs button {
  padding: 0; border-radius: 12px; overflow: hidden; aspect-ratio: 1/1;
  border: 1px solid var(--line-soft); background: var(--paper);
  transition: border-color .3s var(--ease), transform .3s var(--ease);
}
.subs__thumbs button img { width: 100%; height: 100%; object-fit: cover; display: block; }
.subs__thumbs button:hover { transform: translateY(-2px); }
.subs__thumbs button.on { border-color: var(--espresso); }
.subs__spec {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
  background: var(--line); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; margin-top: 4px;
}
.subs__spec > div { background: var(--bone-2); padding: 16px 12px; text-align: center; }
.subs__spec b { display: block; font-family: var(--display); font-size: 1.5rem; color: var(--espresso); letter-spacing: -.02em; }
.subs__spec span { display: block; margin-top: 4px; font-family: var(--mono); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-soft); }

.subs__panel { padding: clamp(28px, 3.4vw, 44px); }
.subs__checks {
  display: flex; justify-content: center; gap: 22px; flex-wrap: wrap; margin: 16px 0 0;
  font-size: 13px; color: rgba(239,233,222,.85); list-style: none;
}
.subs__checks li { display: inline-flex; align-items: center; gap: 8px; }
.subs__checks li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--gold-2); }
.subs__foot { margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(239,233,222,.2); text-align: center; }
.subs__ship {
  display: block; font-family: var(--mono); font-size: 10px; letter-spacing: .14em;
  text-transform: uppercase; color: rgba(239,233,222,.6);
}
.subs__pay { display: flex; justify-content: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.subs__pay span {
  font-size: 10.5px; letter-spacing: .02em; color: rgba(239,233,222,.75);
  border: 1px solid rgba(239,233,222,.22); border-radius: 6px; padding: 6px 10px;
}

@media (max-width: 900px) { .subs__grid { grid-template-columns: 1fr; } }
@media (max-width: 820px) {
  .subs__stage { aspect-ratio: 4/3.2; }
  .subs__spec b { font-size: 1.25rem; }
  .subs__spec > div { padding: 13px 8px; }
  .subs__checks { gap: 12px; font-size: 12.5px; }
  .subs__pay span { font-size: 9.5px; padding: 5px 8px; }
}


/* ============================================================
   CHAMPION BADGE — brushed gold plate on the founder photo
   ============================================================ */
.founder__media .badge--champ {
  position: absolute; left: 20px; bottom: 20px; right: auto; z-index: 3;
  display: inline-flex; align-items: center; gap: 13px;
  padding: 12px 20px 12px 15px; border-radius: 12px;
  background:
    linear-gradient(135deg, #F3E3B8 0%, #C9A964 26%, #EBD9A8 46%, #A8863F 68%, #DCC489 88%, #B2924E 100%);
  color: #241F14; border: 1px solid rgba(255,255,255,.45);
  box-shadow: 0 12px 30px -12px rgba(20,16,8,.75), inset 0 1px 0 rgba(255,255,255,.55);
  text-transform: none; letter-spacing: 0; white-space: nowrap; max-width: none;
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
.badge--champ .badge__ic { width: 26px; height: 26px; flex-shrink: 0; color: #241F14; }
.badge--champ .badge__txt { display: flex; flex-direction: column; gap: 2px; text-align: left; }
.badge--champ .badge__txt b {
  font-family: var(--grotesk); font-weight: 600; font-size: 13.5px; letter-spacing: .01em; line-height: 1.1;
}
.badge--champ .badge__txt i {
  font-style: normal; font-family: var(--mono); font-size: 9.5px; letter-spacing: .16em;
  text-transform: uppercase; color: rgba(36,31,20,.72); line-height: 1.1;
}
@media (max-width: 820px) {
  .founder__media .badge--champ { display: inline-flex; left: 14px; bottom: 14px; padding: 10px 16px 10px 12px; gap: 10px; }
  .badge--champ .badge__ic { width: 22px; height: 22px; }
  .badge--champ .badge__txt b { font-size: 12.5px; }
  .badge--champ .badge__txt i { font-size: 8.5px; letter-spacing: .12em; }
}


/* the subscription band reads as its own block */
.subs { background: var(--bone-2); border-block: 1px solid var(--line-soft); }
.subs > .wrap:first-child .shead { margin-bottom: clamp(28px, 3.4vw, 44px); }


/* the still sits behind the film; on phones it replaces it entirely */
.expand__still { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.expand__media video { position: absolute; inset: 0; z-index: 1; }


/* no doubled rule where the dosing table meets the notes */
.protocol__notes > div:first-child { border-top-color: transparent; }
@media (min-width: 821px) { .protocol__notes > div:first-child { border-top-color: var(--line); } }
