/* CELLMIND local reference rebuild — generated from website/cellmind-rebuild/src/styles. Do not edit output. */
/* ---- designs/signature/pages/product.css ---- */
/* ==========================================================================
   Product page (templates/product.njk + product/*.njk + brand/bundle.njk + brand/strengths.njk).
   Mobile first: stock → title → price → image → strength → offers → CTA (grid order; see .pdp-info { display: contents }).
   Hooks kept: h1.pdp-title, .pdp-price > .pdp-price__now | .pdp-price__pending, .pdp-stock--in, div.pdp-crumbs,
   [data-pdp-tier].is-active[aria-pressed], .pdp-tier__price, [data-pdp-total], [data-pdp-add], [data-pdp-sticky].is-visible.
   ========================================================================== */
.pdp { padding-top: clamp(16px, 2.5vw, 32px); }
.pdp-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 22px; font-size: var(--pf-fs-xs); color: var(--pf-ink-3); }
.pdp-crumbs a:hover { color: var(--pf-ink); text-decoration: underline; text-underline-offset: 3px; }
.pdp-crumbs__sep { color: var(--pf-line-strong); }
.pdp-crumbs__current { color: var(--pf-ink); }

/* ---- hero grid ---- */
.pdp-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: start; }

/* ---- gallery ---- */
.pdp-gallery { position: sticky; top: calc(var(--pf-header-h) + 16px); display: grid; gap: 12px; }
.pdp-gallery__stage { position: relative; }
.pdp-gallery__main { position: relative; display: grid; place-items: center; aspect-ratio: 1 / 1; border-radius: var(--pf-r-xl); background: radial-gradient(110% 80% at 50% 15%, #ffffff 0%, var(--pf-plate) 55%, var(--pf-surface-2) 100%); border: 1px solid var(--pf-line); overflow: hidden; cursor: zoom-in; }
.pdp-gallery__main:focus-visible { outline-offset: -3px; }
.pdp-gallery__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 8%; mix-blend-mode: multiply; transition: transform var(--pf-dur-3) var(--pf-ease); }
.pdp-gallery__main:hover .pdp-gallery__img { transform: scale(1.03); }
.pdp-gallery__angle { position: absolute; left: 16px; bottom: 14px; padding: 5px 10px; border-radius: var(--pf-pill); background: rgba(var(--pf-white-rgb), 0.85); font-family: var(--pf-font-mono); font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--pf-ink-3); }
.pdp-gallery__main::after { content: ""; position: absolute; right: 14px; bottom: 12px; width: 36px; height: 36px; border-radius: 50%; background: rgba(var(--pf-white-rgb), 0.9) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230e1116' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M16.2 16.2 21 21M11 8.5v5M8.5 11h5'/%3E%3C/svg%3E") center / 16px no-repeat; box-shadow: var(--pf-shadow-1); }
.pdp-gallery.is-coa .pdp-gallery__main { display: none; }
.pdp-coaview { display: grid; gap: 14px; padding: 16px; border-radius: var(--pf-r-xl); background: var(--pf-surface); border: 1px solid var(--pf-line); }
.pdp-coaview__doc img { width: 100%; border-radius: var(--pf-r-md); }
.pdp-coaview__badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--pf-pill); background: var(--pf-verdigris-50); color: var(--pf-verdigris-ink); font-family: var(--pf-font-mono); font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; }
.pdp-coaview__line { font-size: var(--pf-fs-sm); color: var(--pf-ink-2); }
.pdp-coaview__open { justify-self: start; min-height: 40px; padding: 0 16px; border: 1px solid var(--pf-ink); border-radius: var(--pf-pill); background: var(--pf-ink); color: var(--pf-on-night); font-weight: 600; cursor: pointer; }
.pdp-thumbs { display: flex; gap: 8px; }
.pdp-thumb { position: relative; width: 72px; height: 72px; padding: 0; border: 1px solid var(--pf-line); border-radius: var(--pf-r-md); background: var(--pf-surface); overflow: hidden; cursor: pointer; transition: border-color var(--pf-dur-1) var(--pf-ease); }
.pdp-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pdp-thumb:hover { border-color: var(--pf-line-strong); }
.pdp-thumb.is-current, .pdp-thumb[aria-pressed="true"] { border-color: var(--pf-ink); box-shadow: inset 0 0 0 1px var(--pf-ink); }
.pdp-thumb__tag { position: absolute; left: 50%; bottom: 4px; transform: translateX(-50%); padding: 1px 6px; border-radius: var(--pf-pill); background: var(--pf-ink); color: var(--pf-on-night); font-family: var(--pf-font-mono); font-size: 9px; letter-spacing: 0.08em; }

/* ---- buy box ---- */
.pdp-info { display: grid; gap: 14px; align-content: start; }
.pdp-info__stock { display: flex; }
.pdp-stock { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 10px; border-radius: var(--pf-pill); background: var(--pf-surface); border: 1px solid var(--pf-line); font-family: var(--pf-font-mono); font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--pf-ink-2); }
.pdp-stock::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--pf-verdigris); }
.pdp-stock--out::before { background: var(--pf-bad); }
.pdp-stock--pending::before { background: var(--pf-ink-4); }
.pdp-title { font-family: var(--pf-font-display); font-size: clamp(2rem, 1.4rem + 2vw, 3.2rem); font-weight: 500; letter-spacing: var(--pf-ls-display); line-height: 1.05; }
.pdp-title__dose { font-family: var(--pf-font-mono); font-size: 0.42em; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--pf-gold-ink); vertical-align: 0.35em; margin-left: 4px; }
.pdp-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; }
.pdp-price__now { font-size: 2rem; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.pdp-price__was { font-size: var(--pf-fs-md); color: var(--pf-ink-4); }
.pdp-price__save { padding: 4px 10px; border-radius: var(--pf-pill); background: var(--pf-verdigris-50); color: var(--pf-verdigris-ink); font-size: var(--pf-fs-xs); font-weight: 600; }
.pdp-price__pending { font-size: var(--pf-fs-lg); font-weight: 600; color: var(--pf-ink-3); }
.pdp-rating { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: var(--pf-fs-sm); color: var(--pf-ink-3); }
.pdp-rating__stars { display: inline-flex; gap: 2px; color: var(--pf-ink); }
.pdp-rating__stars svg { width: 13px; height: 13px; }
.pdp-rating strong { color: var(--pf-ink); }
.pdp-tagline { font-family: var(--pf-font-display); font-size: var(--pf-fs-xl); font-style: italic; color: var(--pf-ink-2); }
/* strengths */
.pdp-strengths { display: grid; gap: 8px; }
.pdp-strengths__label { font-family: var(--pf-font-mono); font-size: var(--pf-fs-xs); letter-spacing: var(--pf-ls-caps); text-transform: uppercase; color: var(--pf-ink-3); }
.pdp-strengths__single { display: flex; align-items: center; gap: 12px; }
.pdp-strength__chip { padding: 6px 14px; border: 1px solid var(--pf-ink); border-radius: var(--pf-pill); font-family: var(--pf-font-mono); font-size: var(--pf-fs-sm); font-weight: 500; letter-spacing: 0.04em; }
.pdp-strengths__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px; }
.pdp-strength { display: grid; gap: 2px; padding: 12px 14px; border: 1px solid var(--pf-line-strong); border-radius: var(--pf-r-md); background: var(--pf-surface); color: var(--pf-ink); transition: border-color var(--pf-dur-1) var(--pf-ease), box-shadow var(--pf-dur-1) var(--pf-ease); }
.pdp-strength:hover { border-color: var(--pf-ink); }
.pdp-strength.is-current { border-color: var(--pf-ink); box-shadow: inset 0 0 0 1px var(--pf-ink); background: var(--pf-bg); }
.pdp-strength__dose { font-family: var(--pf-font-mono); font-size: var(--pf-fs-md); font-weight: 500; letter-spacing: 0.04em; }
.pdp-strength__name { font-size: var(--pf-fs-xs); color: var(--pf-ink-3); }
.pdp-strength__price { font-size: var(--pf-fs-sm); font-weight: 600; margin-top: 4px; }
/* specs */
.pdp-specs-label { margin-top: 6px; font-family: var(--pf-font-mono); font-size: var(--pf-fs-xs); letter-spacing: var(--pf-ls-caps); text-transform: uppercase; color: var(--pf-ink-3); }
.pdp-specs { display: grid; border-top: 1px solid var(--pf-line); }
.pdp-specs__row { display: grid; grid-template-columns: minmax(96px, 34%) 1fr; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--pf-line); font-size: var(--pf-fs-sm); }
.pdp-specs__label { color: var(--pf-ink-3); }
.pdp-specs__val { font-weight: 500; }
.pdp-specs__coa { display: inline-flex; align-items: center; gap: 6px; padding: 0; border: 0; background: none; color: var(--pf-gold-ink); font: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.pdp-specs__coa svg { width: 14px; height: 14px; }
/* buy area */
.pdp-buy { display: grid; gap: 16px; margin-top: 6px; }
.pdp-free { display: flex; align-items: center; gap: 12px; padding: 10px 14px 10px 10px; border-radius: var(--pf-r-md); background: var(--pf-verdigris-50); color: var(--pf-ink); }
.pdp-free__vial { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--pf-r-sm); background: #fff; overflow: hidden; }
.pdp-free__vial img { width: 44px; height: 44px; object-fit: cover; }
.pdp-free__text { flex: 1; font-size: var(--pf-fs-sm); }
.pdp-free__gratis { padding: 4px 10px; border-radius: var(--pf-pill); background: var(--pf-verdigris); color: #fff; font-family: var(--pf-font-mono); font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; }
/* offer cards */
.pdp-bundle { display: grid; gap: 16px; padding: 18px; border: 1px solid var(--pf-line); border-radius: var(--pf-r-xl); background: var(--pf-surface); }
.pdp-bundle__heading { font-size: var(--pf-fs-sm); font-weight: 600; margin-bottom: 10px; }
.pdp-bundle__total { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px; padding-top: 14px; border-top: 1px solid var(--pf-line); }
.pdp-bundle__sum { display: flex; align-items: baseline; gap: 10px; }
.pdp-bundle__total-label { font-size: var(--pf-fs-sm); color: var(--pf-ink-3); }
.pdp-bundle__amount { font-size: 1.6rem; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.pdp-bundle__pill { font-size: var(--pf-fs-sm); font-weight: 600; color: var(--pf-verdigris-ink); }
.pdp-bundle__pill:empty { display: none; }
/* free shipping for the cart after adding the selection (brand-js/commerce/product.js); the unlock animation is shared
   with the cart drawer (components/drawer.css .pf-unlock) */
.pdp-freeship { flex: 1 0 100%; display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--pf-line); border-radius: var(--pf-r-md); background: var(--pf-bg); transition: background-color var(--pf-dur-2) var(--pf-ease), border-color var(--pf-dur-2) var(--pf-ease); }
.pdp-freeship[hidden] { display: none; }
.pdp-freeship__body { display: grid; gap: 6px; flex: 1; min-width: 0; }
.pdp-freeship__text { font-size: var(--pf-fs-sm); font-weight: 600; color: var(--pf-ink); line-height: 1.35; }
.pdp-freeship__bar { display: block; height: 5px; border-radius: var(--pf-pill); background: var(--pf-surface-2); overflow: hidden; }
.pdp-freeship__fill { display: block; height: 100%; width: 0; border-radius: var(--pf-pill); background: linear-gradient(90deg, var(--pf-gold), var(--pf-verdigris)); transition: width var(--pf-dur-3) var(--pf-ease); }
.pdp-freeship.is-free { border-color: rgba(var(--pf-verdigris-rgb), 0.4); background: var(--pf-verdigris-50); }
.pdp-freeship.is-free .pdp-freeship__text { color: var(--pf-verdigris-ink); }
.pdp-freeship.is-free .pdp-freeship__fill { background: var(--pf-verdigris); }
.pdp-freeship.is-celebrating { animation: pf-freeship-glow 1100ms var(--pf-ease-out); }
@keyframes pf-freeship-glow { 0% { box-shadow: 0 0 0 0 rgba(var(--pf-verdigris-rgb), 0.35); } 100% { box-shadow: 0 0 0 12px rgba(var(--pf-verdigris-rgb), 0); } }
.pdp-bundle__actions { display: grid; gap: 10px; }
.pdp-add { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 0 22px; border: 1px solid var(--pf-gold); border-radius: var(--pf-pill); background: var(--pf-gold); color: var(--pf-on-gold); font-size: var(--pf-fs-md); font-weight: 600; cursor: pointer; transition: background-color var(--pf-dur-1) var(--pf-ease), color var(--pf-dur-1) var(--pf-ease), border-color var(--pf-dur-1) var(--pf-ease), transform var(--pf-dur-1) var(--pf-ease), box-shadow var(--pf-dur-1) var(--pf-ease); }
.pdp-add:hover { background: var(--pf-ink); border-color: var(--pf-ink); color: var(--pf-gold); box-shadow: var(--pf-shadow-2); }
.pdp-add:active { transform: translateY(1px); }
.pdp-add__amount { font-variant-numeric: tabular-nums; opacity: 0.9; padding-left: 12px; border-left: 1px solid rgba(var(--pf-ink-rgb), 0.25); }
.pdp-add:hover .pdp-add__amount { border-left-color: rgba(var(--pf-gold-rgb), 0.4); }
.pdp-buy-now { min-height: 48px; border: 1px solid var(--pf-line-strong); border-radius: var(--pf-pill); background: var(--pf-surface); color: var(--pf-ink); font-weight: 600; cursor: pointer; transition: border-color var(--pf-dur-1) var(--pf-ease); }
.pdp-buy-now:hover { border-color: var(--pf-ink); }
.pdp-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pdp-chips > * { padding: 5px 10px; border-radius: var(--pf-pill); background: var(--pf-surface-2); font-size: var(--pf-fs-xs); color: var(--pf-ink-2); }
.pdp-guarantee { display: flex; align-items: center; gap: 8px; font-size: var(--pf-fs-xs); color: var(--pf-ink-3); }
.pdp-guarantee svg { width: 14px; height: 14px; color: var(--pf-verdigris-ink); }
.pdp-pay { display: none; }
/* restock (out of stock, reference variant only) */
.pdp-restock { display: grid; gap: 12px; padding: 16px; border: 1px solid var(--pf-line); border-radius: var(--pf-r-lg); background: var(--pf-surface); }
.pdp-restock__bar { display: flex; gap: 10px; }
.pdp-restock__dot { width: 8px; height: 8px; margin-top: 7px; border-radius: 50%; background: var(--pf-bad); }
.pdp-restock__form { display: flex; gap: 8px; }
.pdp-restock__submit { min-height: 48px; padding: 0 18px; border: 1px solid var(--pf-ink); border-radius: var(--pf-pill); background: var(--pf-ink); color: var(--pf-on-night); font-weight: 600; }

/* ---- sticky purchase bar: top on desktop, bottom on phones ---- */
.pdp-sticky { position: fixed; left: 0; right: 0; top: var(--pf-header-h); z-index: var(--pf-z-sticky); background: rgba(var(--pf-white-rgb), 0.96); border-bottom: 1px solid var(--pf-line); box-shadow: var(--pf-shadow-2); transform: translateY(-110%); opacity: 0; transition: transform var(--pf-dur-2) var(--pf-ease), opacity var(--pf-dur-2) var(--pf-ease); }
.pdp-sticky.is-visible { transform: none; opacity: 1; }
.pdp-sticky__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; max-width: var(--pf-container); margin: 0 auto; padding: 10px var(--pf-gutter); }
.pdp-sticky__product { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pdp-sticky__media { display: grid; place-items: center; width: 48px; height: 48px; border-radius: var(--pf-r-sm); background: var(--pf-plate); border: 1px solid var(--pf-line); overflow: hidden; flex: none; }
.pdp-sticky__thumb { width: 100%; height: 100%; object-fit: contain; padding: 4px; mix-blend-mode: multiply; }
.pdp-sticky__copy { display: grid; min-width: 0; }
.pdp-sticky__title { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pdp-sticky__meta { font-size: var(--pf-fs-sm); color: var(--pf-ink-3); font-variant-numeric: tabular-nums; }
.pdp-sticky__meta strong { color: var(--pf-ink); }
.pdp-sticky__btn { flex: none; min-height: 48px; padding: 0 22px; border: 1px solid var(--pf-gold); border-radius: var(--pf-pill); background: var(--pf-gold); color: var(--pf-on-gold); font-weight: 600; cursor: pointer; }
.pdp-sticky__btn:hover { background: var(--pf-ink); border-color: var(--pf-ink); color: var(--pf-gold); }

/* ---- below the fold ---- */
.pdp-guide { margin-top: var(--pf-section); padding: clamp(28px, 4vw, 48px); border-radius: var(--pf-r-xl); background: var(--pf-surface); border: 1px solid var(--pf-line); }
.pdp-guide__grid { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 16px; margin-top: 28px; } /* as many equal columns as items (3 since the certificate card is omitted) */
.pdp-guide__item { padding: 20px; border-radius: var(--pf-r-lg); background: var(--pf-bg); border: 1px solid var(--pf-line); }
.pdp-guide__icon { display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 50%; background: var(--pf-gold-50); color: var(--pf-gold-ink); margin-bottom: 12px; }
.pdp-guide__icon svg { width: 18px; height: 18px; }
.pdp-guide__title { font-size: var(--pf-fs-md); font-weight: 600; }
.pdp-guide__text { margin-top: 6px; font-size: var(--pf-fs-sm); color: var(--pf-ink-3); line-height: 1.55; }
.pdp-related { margin-top: var(--pf-section); }
.pdp-related__head { margin-bottom: 24px; }
.pdp-related__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.pdp-trust { margin-top: var(--pf-section-sm); }
.pdp-trust__inner { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 12px; }
.pdp-trust__item { display: flex; align-items: center; gap: 12px; padding: 16px 18px; background: var(--pf-surface); border: 1px solid var(--pf-line); border-radius: var(--pf-r-md); }
.pdp-trust__icon { display: inline-flex; color: var(--pf-gold-ink); }
.pdp-trust__icon svg { width: 20px; height: 20px; }
.pdp-trust__val { font-family: var(--pf-font-display); font-size: 1.35rem; font-weight: 500; line-height: 1; }
.pdp-trust__lbl { font-size: var(--pf-fs-xs); color: var(--pf-ink-3); margin-top: 2px; }

/* ---- responsive ---- */
@media (max-width: 1023px) {
  .pdp-gallery { position: static; }
  .pdp-guide__grid, .pdp-trust__inner { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pdp-related__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
}
@media (max-width: 767px) {
  /* first viewport: stock, name, price, image, then strength/offers — one grid, source order unchanged */
  .pdp-hero { grid-template-columns: 1fr; gap: 12px; }
  .pdp-info { display: contents; }
  .pdp-info > * { order: 5; }
  .pdp-info__stock { order: 1; }
  .pdp-title { order: 2; }
  .pdp-price { order: 3; }
  .pdp-gallery { order: 4; margin: 4px 0 10px; }
  .pdp-gallery__main { aspect-ratio: 5 / 4; border-radius: var(--pf-r-lg); }
  .pdp-gallery__img { padding: 4%; }
  .pdp-crumbs { margin-bottom: 14px; }
  .pdp-title { font-size: 2rem; }
  .pdp-price__now { font-size: 1.7rem; }
  .pdp-bundle { padding: 14px; border-radius: var(--pf-r-lg); }
  .pdp-strengths__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pdp-sticky { top: auto; bottom: 0; border-bottom: 0; border-top: 1px solid var(--pf-line); box-shadow: 0 -12px 30px -16px rgba(var(--pf-ink-rgb), 0.3); transform: translateY(110%); padding-bottom: var(--pf-safe-b); }
  .pdp-sticky__inner { padding: 8px 16px; }
  .pdp-sticky__btn { padding: 0 16px; min-height: 46px; }
  .pdp-sticky__title { font-size: var(--pf-fs-sm); }
  body.has-pdp-sticky { padding-bottom: calc(76px + var(--pf-safe-b)); }
  .pdp-guide { padding: 20px 16px; }
  .pdp-guide__grid { grid-template-columns: 1fr; gap: 10px; }
  .pdp-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .pdp-related__grid .product-card:nth-child(3) { grid-column: 1 / -1; }
  .pdp-trust__inner { gap: 8px; }
  .pdp-trust__item { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) { .pdp-sticky { transition: none; } .pdp-freeship.is-celebrating { animation: none; } .pdp-freeship, .pdp-freeship__fill { transition: none; } }

/* Release C — the subscription option under the bundle cards (brand-js/commerce/subscription-option.js) */
.pdp-sub { display: grid; gap: .5rem; margin-block: .75rem; }
.pdp-sub__opt { display: grid; gap: .15rem; text-align: start; padding: .75rem .9rem; border: 1px solid var(--line, #d9d9d9); border-radius: 12px; background: var(--surface, #fff); color: inherit; font: inherit; cursor: pointer; }
.pdp-sub__opt.is-active { border-color: var(--gold, #9a7420); box-shadow: inset 0 0 0 1px var(--gold, #9a7420); }
.pdp-sub__opt:focus-visible { outline: 2px solid var(--gold, #9a7420); outline-offset: 2px; }
.pdp-sub__title { font-weight: 600; }
.pdp-sub__detail { font-size: .875rem; opacity: .8; }