/* ============================================================
   Lumen Peptides - "Club" reskin (localhost build)
   Amino Club layout language, Lumen Meridian brand system.
   Navy #16305e / marine #1d4e89 / aqua #2fa8bd. Light, airy,
   rounded geometry, floating-vial hero.
   ============================================================ */

@font-face { font-family:"Geist"; font-style:normal; font-weight:100 900; font-display:swap; src:url("../fonts/geist.woff2") format("woff2"); }
@font-face { font-family:"Geist Mono"; font-style:normal; font-weight:100 900; font-display:swap; src:url("../fonts/geist-mono.woff2") format("woff2"); }
@font-face { font-family:"Quicksand"; font-style:normal; font-weight:300 700; font-display:swap; src:url("../fonts/quicksand.woff2") format("woff2"); }

:root {
  --n-0:#ffffff; --n-50:#f6f8fb; --n-100:#ecf0f6; --n-150:#e2e8f1; --n-200:#d4dce8;
  --n-300:#bac6d7; --n-400:#92a0b7; --n-500:#6c7a92; --n-600:#515f75; --n-700:#3b475c;
  --n-800:#273245; --n-900:#16202f; --n-950:#0d1522;

  --navy:#16305e; --royal:#1d4e89; --primary:#1c3f7c; --azure:#2fa8bd; --sky:#57d4e0;
  --grad:linear-gradient(135deg,#122a52,#1d4e89,#2fa8bd);

  --accent:#1c3f7c; --accent-hover:#254e94; --accent-press:#122a52;
  --tint:#e9f0fa; --tint-2:#d6e4f4; --aqua-tint:#e6f6f9; --aqua-tint-2:#c9ecf2;

  --ok:#0b6f3f; --ok-tint:#e4f6ec;

  --bg:var(--n-50); --surface:#fff; --ink:var(--n-950); --ink-2:var(--n-700); --ink-3:#5c6a80;
  --line:var(--n-200); --line-2:var(--n-150);

  --d-bg:#0a1526; --d-surface:#122036; --d-surface-2:#182a45;
  --d-ink:#eef3fa; --d-ink-2:#aebdd3; --d-line:rgba(170,200,255,.12);

  --sans:"Geist",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --display:"Quicksand",var(--sans);
  --mono:"Geist Mono",ui-monospace,Menlo,Consolas,monospace;

  --r-sm:10px; --r-md:14px; --r-lg:20px; --r-xl:28px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(18,42,82,.05);
  --sh-2:0 4px 14px rgba(18,42,82,.08);
  --sh-3:0 14px 36px rgba(18,42,82,.12);
  --sh-4:0 26px 64px rgba(18,42,82,.18);
  --wrap:1180px;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--sans); color:var(--ink); background:var(--bg); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased; }
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; border:none; background:none; }
.wrap { max-width:var(--wrap); margin:0 auto; padding:0 22px; }
h1,h2,h3 { font-family:var(--display); font-weight:700; letter-spacing:-.01em; line-height:1.15; color:var(--navy); }
.eyebrow { font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--azure); font-weight:600; }
.section { padding:72px 0; }
.section-head { max-width:640px; margin-bottom:38px; }
@media (max-width:640px){
  .section { padding:28px 0; }
  .section-head { margin-bottom:16px; }
  .view-all { margin-top:18px; }
  .strips { gap:12px; }
  .strip { padding:26px 22px; }
}
.section-head h2 { font-size:clamp(1.7rem,1.3rem + 1.6vw,2.4rem); margin:.4rem 0 .6rem; }
.section-head p { color:var(--ink-2); }

/* ---------- announcement ticker ---------- */
.ticker { background:var(--grad); color:#fff; font-size:.8rem; font-weight:500; text-align:center; padding:8px 14px; letter-spacing:.02em; }
.ticker b { font-weight:700; color:var(--sky); }

/* ---------- header ---------- */
.hdr { position:sticky; top:0; z-index:60; background:rgba(255,255,255,.92); backdrop-filter:blur(12px); border-bottom:1px solid var(--line-2); box-shadow:var(--sh-1); }
.hdr-in { display:flex; align-items:center; justify-content:space-between; height:68px; gap:20px; }
.logo img { height:40px; width:auto; }
.nav { display:flex; gap:4px; align-items:center; }
.nav a { padding:8px 13px; border-radius:var(--r-pill); font-size:.92rem; font-weight:500; color:var(--ink-2); transition:all .15s; }
.nav a:hover { background:var(--tint); color:var(--primary); }
.nav a.on { background:var(--tint); color:var(--primary); font-weight:600; }
.nav .pill-new { font-size:.58rem; background:var(--azure); color:#fff; border-radius:var(--r-pill); padding:1px 6px; margin-left:4px; vertical-align:2px; font-weight:700; letter-spacing:.05em; }
.hdr-acts { display:flex; align-items:center; gap:10px; }
.cart-btn { position:relative; width:42px; height:42px; border-radius:var(--r-pill); background:var(--tint); display:grid; place-items:center; color:var(--primary); transition:background .15s; }
.cart-btn:hover { background:var(--tint-2); }
.cart-count { position:absolute; top:-4px; right:-4px; min-width:19px; height:19px; border-radius:var(--r-pill); background:var(--azure); color:#fff; font-size:.68rem; font-weight:700; display:grid; place-items:center; padding:0 4px; }
.menu-btn { display:none; width:42px; height:42px; border-radius:var(--r-pill); background:var(--tint); color:var(--primary); place-items:center; }

/* ---------- buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; font-weight:600; font-size:.95rem; border-radius:var(--r-pill); padding:13px 26px; transition:all .18s; }
.btn-primary { background:var(--accent); color:#fff; box-shadow:0 6px 18px rgba(28,63,124,.28); }
.btn-primary:hover { background:var(--accent-hover); transform:translateY(-1px); box-shadow:0 10px 24px rgba(28,63,124,.34); }
.btn-ghost { background:#fff; color:var(--primary); border:1px solid var(--line); }
.btn-ghost:hover { border-color:var(--primary); background:var(--tint); }
.btn-aqua { background:var(--azure); color:#fff; box-shadow:0 6px 18px rgba(47,168,189,.3); }
.btn-aqua:hover { background:#279aae; transform:translateY(-1px); }

/* ---------- hero ---------- */
.hero { position:relative; overflow:hidden; background:linear-gradient(180deg,var(--n-50) 0%,var(--aqua-tint) 55%,var(--n-100) 100%); padding:96px 0 110px; text-align:center; }
.hero-in { position:relative; z-index:2; max-width:760px; margin:0 auto; padding:0 22px; }
.hero h1 { font-size:clamp(2.2rem,1.5rem + 3.4vw,3.6rem); margin:.9rem 0 1rem; }
.hero h1 .lum { background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero p { font-size:1.1rem; color:var(--ink-2); max-width:560px; margin:0 auto 1.8rem; }
.hero-chips { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:26px; }
.chip { display:inline-flex; align-items:center; gap:7px; background:rgba(255,255,255,.85); border:1px solid var(--line-2); border-radius:var(--r-pill); padding:7px 15px; font-size:.8rem; font-weight:600; color:var(--ink-2); box-shadow:var(--sh-1); }
.chip svg { color:var(--azure); }
/* floating vials */
.vials { position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; }
.vial { position:absolute; bottom:-32%; will-change:transform; filter:drop-shadow(0 22px 40px rgba(10,21,38,.18)); }
.vial img { width:100%; height:auto; user-select:none; }
@keyframes drift {
  0%   { transform:translate3d(0,0,0) rotate(0deg); }
  25%  { transform:translate3d(9px,-40vh,0) rotate(var(--tilt,10deg)); }
  50%  { transform:translate3d(0,-80vh,0) rotate(0deg); }
  75%  { transform:translate3d(-9px,-120vh,0) rotate(calc(var(--tilt,10deg) * -1)); }
  100% { transform:translate3d(0,-160vh,0) rotate(0deg); }
}
@media (prefers-reduced-motion:reduce){ .vial { animation:none !important; transform:translateY(-40vh) !important; opacity:.4 !important; } }

/* ---------- guarantee cards ---------- */
.guar { background:#fff; }
.guar-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.gcard { background:var(--n-50); border:1px solid var(--line-2); border-radius:var(--r-xl); padding:30px 28px; transition:all .2s; }
.gcard:hover { box-shadow:var(--sh-3); transform:translateY(-3px); background:#fff; }
.gcard .ic { width:52px; height:52px; border-radius:var(--r-md); background:var(--grad); color:#fff; display:grid; place-items:center; margin-bottom:18px; }
.gcard h3 { font-size:1.12rem; margin-bottom:8px; }
.gcard p { font-size:.92rem; color:var(--ink-2); }

/* ---------- promo strips ---------- */
.strip { border-radius:var(--r-xl); padding:44px 46px; display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap; overflow:hidden; position:relative; }
.strip h2 { font-size:clamp(1.4rem,1.1rem + 1.4vw,2rem); }
.strip p { color:var(--ink-2); max-width:480px; margin-top:8px; }
.strip-aqua { background:linear-gradient(120deg,var(--aqua-tint),var(--aqua-tint-2)); border:1px solid var(--aqua-tint-2); }
.strip-navy { background:var(--d-bg); }
.strip-navy h2 { color:#fff; }
.strip-navy p { color:var(--d-ink-2); }
.strips { display:grid; gap:22px; }

/* ---------- product cards ---------- */
.prod-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.pcard { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-lg); padding:18px; display:flex; flex-direction:column; transition:all .2s; position:relative; }
.pcard:hover { box-shadow:var(--sh-3); transform:translateY(-3px); border-color:var(--tint-2); }
.pcard-img { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-md); height:190px; display:grid; place-items:center; margin-bottom:14px; overflow:hidden; }
.pcard-img img { max-height:165px; width:auto; transition:transform .25s; }
.pcard:hover .pcard-img img { transform:scale(1.06) rotate(-2deg); }
.purity-pill { position:absolute; top:26px; left:26px; background:rgba(255,255,255,.92); border:1px solid var(--line-2); border-radius:var(--r-pill); font-family:var(--mono); font-size:.66rem; font-weight:700; color:var(--ok); padding:3px 9px; }
.pcard h3 { font-size:1rem; font-family:var(--sans); font-weight:650; color:var(--ink); }
.pcard .sub { font-size:.78rem; color:var(--ink-3); margin:2px 0 10px; min-height:2.2em; }
.pcard-foot { margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:8px; }
.price { font-weight:700; color:var(--navy); font-size:1.05rem; }
.price .from { font-size:.7rem; font-weight:500; color:var(--ink-3); display:block; line-height:1; margin-bottom:2px; }
.price .was { font-size:.8em; font-weight:500; color:var(--ink-3); text-decoration:line-through; margin-right:6px; }
.add-btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; background:var(--accent); color:#fff; border-radius:var(--r-sm); height:38px; padding:0 16px; font-size:.82rem; font-weight:600; line-height:1; white-space:nowrap; transition:all .15s; }
.add-btn:hover { background:var(--accent-hover); }
.add-btn svg { flex:0 0 auto; }
.view-all { text-align:center; margin-top:36px; }

/* ---------- benefits ---------- */
.bene-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.bene { display:flex; gap:16px; align-items:flex-start; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-lg); padding:24px; }
.bene .ic { flex:0 0 44px; height:44px; border-radius:var(--r-md); background:var(--tint); color:var(--primary); display:grid; place-items:center; }
.bene h3 { font-size:1rem; font-family:var(--sans); font-weight:650; color:var(--ink); margin-bottom:5px; }
.bene p { font-size:.88rem; color:var(--ink-2); }

/* ---------- quality (dark band) ---------- */
.quality { background:var(--d-bg); color:var(--d-ink); }
.quality .eyebrow { color:var(--sky); }
.quality h2 { color:#fff; }
.quality .section-head p { color:var(--d-ink-2); }
.q-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.qcard { background:var(--d-surface); border:1px solid var(--d-line); border-radius:var(--r-lg); padding:24px 20px; }
.qcard .ic { width:40px; height:40px; border-radius:var(--r-sm); background:rgba(87,212,224,.14); color:var(--sky); display:grid; place-items:center; margin-bottom:14px; }
.qcard h3 { color:#fff; font-size:.95rem; font-family:var(--sans); font-weight:650; margin-bottom:6px; }
.qcard p { font-size:.8rem; color:var(--d-ink-2); }

/* ---------- quality verify (aminoclub-parity, Lumen skin) ---------- */
.qv-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:52px; align-items:start; }
.qv-left h2 { font-size:clamp(1.7rem,1.3rem + 1.8vw,2.5rem); margin:.4rem 0 .8rem; }
.qv-left .lead { color:var(--ink-2); max-width:520px; margin-bottom:26px; }
.qv-stats { display:flex; gap:26px; flex-wrap:wrap; margin-bottom:30px; }
.qv-stat { display:flex; align-items:center; gap:10px; padding-right:26px; border-right:1px solid var(--line); }
.qv-stat:last-child { border-right:none; padding-right:0; }
.qv-stat .n { font-family:var(--display); font-weight:700; font-size:1.7rem; color:var(--navy); }
.qv-stat .k { font-size:.78rem; color:var(--ink-3); line-height:1.3; }
.qv-tabs { display:flex; gap:9px; flex-wrap:wrap; margin-bottom:16px; }
.qv-tab { display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line); background:#fff; border-radius:var(--r-pill); padding:10px 18px; font-size:.88rem; font-weight:600; color:var(--ink-2); transition:all .15s; }
.qv-tab:hover { border-color:var(--azure); color:var(--primary); }
.qv-tab.on { background:var(--navy); border-color:var(--navy); color:#fff; }
.qv-card { background:var(--n-50); border:1px solid var(--line-2); border-radius:var(--r-xl); padding:26px 28px; margin-bottom:28px; }
.qv-card .hd { display:flex; align-items:center; gap:12px; margin-bottom:10px; flex-wrap:wrap; }
.qv-card .hd h3 { font-size:1.08rem; }
.qv-method { display:inline-flex; align-items:center; gap:6px; font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:.08em; color:var(--azure); background:var(--aqua-tint); border-radius:var(--r-pill); padding:4px 11px; }
.qv-card > p { font-size:.92rem; color:var(--ink-2); margin-bottom:14px; }
.qv-why { background:#fff; border:1px solid var(--line-2); border-left:3px solid var(--azure); border-radius:var(--r-md); padding:14px 18px; font-size:.86rem; color:var(--ink-2); }
.qv-why b { color:var(--ink); }
.qv-cta { display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.qv-cta .note { display:inline-flex; align-items:center; gap:7px; font-size:.85rem; color:var(--ink-2); }
.qv-cta .note svg { color:var(--azure); }
.qv-panel { position:relative; background:linear-gradient(160deg,var(--tint) 0%,var(--aqua-tint) 55%,var(--aqua-tint-2) 100%); border:1px solid var(--tint-2); border-radius:var(--r-xl); min-height:540px; padding:40px; display:grid; place-items:center; overflow:hidden; }
.qv-vial { max-height:430px; max-width:88%; width:auto; height:auto; object-fit:contain; transform:rotate(12deg); filter:drop-shadow(0 30px 46px rgba(10,21,38,.22)); }
.qv-badge { position:absolute; top:26px; right:26px; display:flex; align-items:center; gap:12px; background:#fff; border-radius:var(--r-lg); box-shadow:var(--sh-3); padding:14px 18px; }
.qv-badge .tick { width:36px; height:36px; border-radius:var(--r-pill); background:var(--aqua-tint); color:var(--azure); display:grid; place-items:center; }
.qv-badge b { display:block; font-size:.88rem; color:var(--ink); }
.qv-badge span { font-size:.74rem; color:var(--ink-3); }
.qv-proof { position:absolute; left:26px; right:26px; bottom:22px; display:flex; align-items:center; gap:14px; background:#fff; border-radius:var(--r-lg); box-shadow:var(--sh-3); padding:15px 20px; transition:all .15s; }
.qv-proof:hover { transform:translateY(-2px); box-shadow:var(--sh-4); }
.qv-proof .ic { width:40px; height:40px; border-radius:var(--r-md); background:var(--n-50); border:1px solid var(--line-2); color:var(--primary); display:grid; place-items:center; }
.qv-proof b { display:block; font-size:.92rem; color:var(--ink); }
.qv-proof span { font-size:.78rem; color:var(--ink-3); }
.qv-proof .arr { margin-left:auto; color:var(--ink-3); }
@media (max-width:1020px){
  /* mobile: showcase panel leads, pills scroll horizontally in one row */
  .qv-grid { grid-template-columns:1fr; gap:34px; }
  .qv-panel { order:-1; min-height:430px; }
  .qv-vial { max-height:330px; }
  .qv-tabs { flex-wrap:nowrap; overflow-x:auto; padding-bottom:8px; scrollbar-width:none; }
  .qv-tabs::-webkit-scrollbar { display:none; }
  .qv-tab { flex:0 0 auto; white-space:nowrap; }
  .qv-stats { gap:18px; }
  .qv-stat { padding-right:18px; }
  .qv-stat .n { font-size:1.45rem; }
  .qv-grid > * { min-width:0; }
}

/* ---------- why choose (pastel card grid) ---------- */
.why-sec { background:linear-gradient(180deg,var(--n-50),#fff); }
.why-sec .section-head { text-align:center; margin:0 auto 38px; }
.why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.wcard { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-lg); padding:26px; box-shadow:var(--sh-1); transition:all .2s; }
.wcard:hover { box-shadow:var(--sh-3); transform:translateY(-3px); }
.wic { width:46px; height:46px; border-radius:var(--r-md); display:grid; place-items:center; margin-bottom:16px; }
.wic.blue { background:var(--tint); color:var(--primary); }
.wic.aqua { background:var(--aqua-tint); color:var(--azure); }
.wic.sky { background:#e8f8fb; color:#1d8ea3; }
.wic.navy { background:#e7ebf4; color:var(--navy); }
.wic.mint { background:var(--ok-tint); color:var(--ok); }
.wic.slate { background:var(--n-100); color:var(--ink-2); }
.wcard h3 { font-size:1rem; font-family:var(--sans); font-weight:700; color:var(--ink); margin-bottom:7px; }
.wcard p { font-size:.88rem; color:var(--ink-2); }
@media (max-width:1020px){ .why-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .why-grid { grid-template-columns:1fr; } }

/* ---------- FAQ ---------- */
.faq-list { max-width:760px; margin:0 auto; display:grid; gap:12px; }
.faq-item { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-lg); overflow:hidden; }
.faq-q { width:100%; display:flex; justify-content:space-between; align-items:center; gap:14px; text-align:left; padding:19px 24px; font-weight:600; font-size:.98rem; color:var(--ink); }
.faq-q .tog { flex:0 0 26px; height:26px; border-radius:var(--r-pill); background:var(--tint); color:var(--primary); display:grid; place-items:center; font-weight:700; transition:transform .2s; }
.faq-item.open .tog { transform:rotate(45deg); background:var(--accent); color:#fff; }
.faq-a { max-height:0; overflow:hidden; transition:max-height .25s ease; }
.faq-a p { padding:0 24px 20px; color:var(--ink-2); font-size:.92rem; }
.faq-item.open .faq-a { max-height:300px; }

/* ---------- big CTA ---------- */
.cta { background:var(--grad); border-radius:var(--r-xl); text-align:center; padding:64px 30px; color:#fff; position:relative; overflow:hidden; }
.cta > *:not(.cta-img) { position:relative; z-index:1; }
/* rendered glass molecular chain, in constant slow drift */
.cta-img { position:absolute; inset:-5%; background:url('../img/cta-molecule.jpg') center right / cover no-repeat; opacity:.5; animation:ctaDrift 38s ease-in-out infinite alternate; pointer-events:none; will-change:transform; }
@keyframes ctaDrift {
  from { transform:scale(1) translate(0,0); }
  to   { transform:scale(1.08) translate(-1.6%, 1.1%); }
}
@media (prefers-reduced-motion:reduce){ .cta-img { animation:none !important; } }
.cta h2 { color:#fff; font-size:clamp(1.6rem,1.2rem + 1.8vw,2.3rem); max-width:640px; margin:0 auto 12px; }
.cta p { color:rgba(255,255,255,.82); max-width:520px; margin:0 auto 26px; }
.cta .btn { background:#fff; color:var(--navy); }
.cta .btn:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(0,0,0,.25); }

/* ---------- footer ---------- */
.ftr { background:var(--d-bg); color:var(--d-ink-2); padding:64px 0 34px; margin-top:80px; }
.ftr-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr 1fr; gap:36px; margin-bottom:44px; }
.ftr img.fl { height:44px; width:auto; margin-bottom:16px; }
.ftr h3 { color:#fff; font-size:.85rem; font-family:var(--sans); font-weight:700; text-transform:uppercase; letter-spacing:.08em; margin-bottom:14px; }
.ftr ul { list-style:none; display:grid; gap:9px; }
.ftr a { font-size:.88rem; transition:color .15s; }
.ftr a:hover { color:var(--sky); }
.ftr-ruo { border:1px solid var(--d-line); border-radius:var(--r-lg); background:var(--d-surface); padding:20px 24px; font-size:.78rem; line-height:1.7; color:var(--d-ink-2); margin-bottom:28px; }
.ftr-ruo b { color:var(--sky); }
.ftr-base { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; border-top:1px solid var(--d-line); padding-top:24px; font-size:.78rem; }
.ftr-mail { display:inline-block; margin-top:10px; color:var(--sky); font-size:.88rem; font-weight:600; }
.ftr-mail:hover { text-decoration:underline; }
.ftr-short-grid { display:flex; justify-content:space-between; align-items:flex-start; gap:36px; flex-wrap:wrap; margin-bottom:36px; }

/* ---------- gate ---------- */
.gate { position:fixed; inset:0; z-index:200; display:grid; place-items:center; padding:20px; background:linear-gradient(160deg,rgba(10,21,38,.94),rgba(18,42,82,.94)); backdrop-filter:blur(10px); }
.gate-card { background:#fff; border-radius:var(--r-xl); max-width:520px; width:100%; padding:38px 36px; box-shadow:var(--sh-4); }
.gate-card img { height:46px; margin-bottom:22px; }
.gate-card h1 { font-size:1.5rem; margin-bottom:10px; }
.gate-card > p { font-size:.92rem; color:var(--ink-2); margin-bottom:20px; }
.gate-check { display:flex; gap:12px; align-items:flex-start; padding:13px 15px; border:1px solid var(--line); border-radius:var(--r-md); margin-bottom:10px; font-size:.88rem; color:var(--ink-2); cursor:pointer; transition:all .15s; }
.gate-check:hover { border-color:var(--azure); background:var(--aqua-tint); }
.gate-check input { margin-top:3px; accent-color:var(--accent); width:16px; height:16px; }
.gate-enter { width:100%; margin-top:14px; opacity:.45; pointer-events:none; }
.gate-enter.ready { opacity:1; pointer-events:auto; }
.gate-fine { font-size:.72rem; color:var(--ink-3); margin-top:16px; line-height:1.6; }
body.gated { overflow:hidden; }

/* ---------- cart drawer (Lumen side cart, conversion pass) ---------- */
.drawer-veil { position:fixed; inset:0; background:rgba(10,21,38,.55); backdrop-filter:blur(2px); z-index:90; opacity:0; pointer-events:none; transition:opacity .2s; }
.drawer { position:fixed; top:0; right:0; bottom:0; width:min(430px,100vw); background:var(--n-50); z-index:95; transform:translateX(102%); transition:transform .28s cubic-bezier(.2,0,0,1); display:flex; flex-direction:column; box-shadow:var(--sh-4); }
body.cart-open .drawer { transform:none; }
body.cart-open .drawer-veil { opacity:1; pointer-events:auto; }
.drawer-hd { display:flex; align-items:center; justify-content:space-between; padding:18px 22px; background:#fff; border-bottom:1px solid var(--line-2); }
.drawer-hd h3 { font-size:1.08rem; }
.drawer-hd h3 small { font-family:var(--mono); font-size:.7rem; color:var(--ink-3); font-weight:600; margin-left:6px; }
.drawer-x { width:36px; height:36px; border-radius:var(--r-pill); background:var(--tint); color:var(--primary); font-size:1rem; }
.drawer-bd { flex:1; overflow-y:auto; padding:16px 18px; }
.drawer-bd > * + * { margin-top:12px; }
.drawer-bd > * { flex-shrink:0; }
/* free-shipping meter */
.cart-meter { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-md); padding:14px 16px; }
.cart-meter .m-lbl { font-size:.8rem; color:var(--ink-2); margin-bottom:8px; }
.cart-meter .m-lbl b { color:var(--primary); }
.cart-meter .m-lbl.done { color:var(--ok); font-weight:600; }
.cart-meter .m-bar { height:8px; border-radius:var(--r-pill); background:var(--n-100); overflow:hidden; }
.cart-meter .m-bar span { display:block; height:100%; border-radius:var(--r-pill); background:var(--grad); transition:width .3s var(--ease-std); }
/* BOGO pairing prompt + free-vial cross-sell */
.cart-bogo { background:#fff; border:1.5px solid var(--azure); border-radius:var(--r-md); overflow:hidden; }
.cart-bogo .cb-hd { display:flex; gap:10px; align-items:center; padding:12px 15px; background:var(--aqua-tint); }
.cart-bogo .cb-hd .gic { flex:0 0 32px; height:32px; border-radius:var(--r-sm); background:#fff; color:var(--azure); display:grid; place-items:center; }
.cart-bogo .cb-hd b { display:block; font-size:.84rem; color:var(--ink); }
.cart-bogo .cb-hd span { font-size:.72rem; color:var(--ink-2); }
.cb-item { display:flex; align-items:center; gap:10px; padding:9px 13px; border-top:1px solid var(--line-2); }
.cb-item img { width:38px; height:38px; object-fit:contain; }
.cb-item .nm { font-size:.8rem; font-weight:650; color:var(--ink); line-height:1.25; }
.cb-item .sz { font-size:.7rem; color:var(--ink-3); }
.cb-item .pr { margin-left:auto; text-align:right; white-space:nowrap; }
.cb-item .pr .free { display:block; font-family:var(--mono); font-size:.72rem; font-weight:700; color:var(--ok); }
.cb-item .pr .was { display:block; font-size:.68rem; color:var(--ink-3); text-decoration:line-through; }
.cb-item .cb-add { flex:0 0 auto; background:var(--accent); color:#fff; border-radius:var(--r-pill); padding:7px 13px; font-size:.74rem; font-weight:700; }
.cb-item .cb-add:hover { background:var(--accent-hover); }
.cart-bogo-active { display:flex; align-items:center; gap:10px; background:var(--ok-tint); border:1px solid #c9ecda; border-radius:var(--r-md); padding:11px 15px; font-size:.8rem; font-weight:600; color:var(--ok); }
.cart-bogo-active svg { flex:0 0 auto; }

/* gift banner */
.cart-gift { display:flex; gap:12px; align-items:center; background:var(--aqua-tint); border:1px solid var(--aqua-tint-2); border-radius:var(--r-md); padding:12px 15px; }
.cart-gift .gic { flex:0 0 34px; height:34px; border-radius:var(--r-sm); background:#fff; color:var(--azure); display:grid; place-items:center; }
.cart-gift b { display:block; font-size:.82rem; color:var(--ink); }
.cart-gift span { font-size:.72rem; color:var(--ink-2); }
/* line items */
.cline { display:flex; gap:12px; align-items:center; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-md); padding:12px 14px; position:relative; }
.cline img { width:54px; height:54px; object-fit:contain; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-sm); }
.cline .nm { font-size:.88rem; font-weight:650; color:var(--ink); padding-right:20px; }
.cline .sz { font-size:.72rem; color:var(--ink-3); }
.cline .sz .deal-tag { color:var(--azure); font-weight:700; }
.cline .qty { display:flex; align-items:center; gap:8px; margin-top:6px; }
.cline .qty button { width:24px; height:24px; border-radius:var(--r-pill); background:var(--tint); color:var(--primary); font-weight:700; font-size:.8rem; }
.cline .pr { margin-left:auto; font-weight:700; color:var(--navy); font-size:.92rem; white-space:nowrap; text-align:right; }
.cline .pr .was { display:block; font-weight:500; font-size:.74rem; color:var(--ink-3); text-decoration:line-through; }
.free-tag { color:var(--ok); background:var(--ok-tint); }
.bogo-hint { font-size:.72rem; color:var(--azure); font-weight:600; margin-top:3px; }
.cart-brk { border-top:1px solid var(--line-2); margin-top:14px; padding-top:12px; }
.cart-brk .row { display:flex; justify-content:space-between; font-size:.84rem; color:var(--ink-2); padding:3px 0; }
.cart-brk .row.save { color:var(--ok); font-weight:600; }
.cline .rm { position:absolute; top:8px; right:10px; color:var(--ink-faint); font-size:.85rem; line-height:1; }
.cline .rm:hover { color:var(--err); }
/* footer */
.drawer-ft { background:#fff; border-top:1px solid var(--line-2); padding:16px 22px 18px; }
.drawer-ft .tot { display:flex; justify-content:space-between; font-weight:700; font-size:1.05rem; margin-bottom:4px; }
#cartSavings .sv { display:flex; justify-content:space-between; font-size:.8rem; font-weight:600; color:var(--ok); margin-bottom:6px; }
.drawer-ft .ft-micro { display:flex; justify-content:center; gap:14px; font-size:.72rem; color:var(--ink-3); margin:8px 0 12px; flex-wrap:wrap; }
.drawer-ft .ft-micro span { display:inline-flex; align-items:center; gap:5px; }
.drawer-ft .ft-micro svg { color:var(--azure); }
.drawer-ft #checkoutBtn { width:100%; background:var(--grad); box-shadow:0 8px 22px rgba(28,63,124,.32); }
.drawer-ft #checkoutBtn:hover { transform:translateY(-1px); box-shadow:0 12px 28px rgba(28,63,124,.4); }
.drawer-ft .ft-chips { display:flex; justify-content:center; gap:6px; margin-top:12px; }
.drawer-ft .ft-chips .cc { font-family:var(--mono); font-size:.58rem; font-weight:700; border:1px solid var(--line); border-radius:4px; padding:2px 7px; color:var(--ink-3); }
.drawer-ft .note { font-size:.68rem; color:var(--ink-faint); text-align:center; margin-top:10px; line-height:1.5; }
.cart-empty { text-align:center; color:var(--ink-3); padding:44px 12px; font-size:.9rem; }
.cart-empty .btn { margin-top:16px; }

/* ---------- shop page ---------- */
.shop-hero { background:linear-gradient(180deg,var(--n-50),var(--aqua-tint)); padding:56px 0 40px; }
.shop-hero h1 { font-size:clamp(1.8rem,1.4rem + 2vw,2.6rem); }
.shop-hero p { color:var(--ink-2); margin-top:8px; max-width:560px; }
.filters { display:flex; gap:8px; flex-wrap:wrap; margin:26px 0 8px; }
.fpill { border:1px solid var(--line); background:#fff; border-radius:var(--r-pill); padding:8px 16px; font-size:.84rem; font-weight:600; color:var(--ink-2); transition:all .15s; }
.fpill:hover { border-color:var(--azure); color:var(--primary); }
.fpill.on { background:var(--accent); border-color:var(--accent); color:#fff; }
.search-in { display:flex; align-items:center; gap:10px; background:#fff; border:1px solid var(--line); border-radius:var(--r-pill); padding:10px 18px; max-width:340px; margin-top:18px; }
.search-in input { border:none; outline:none; font-size:.9rem; width:100%; font-family:inherit; color:var(--ink); background:transparent; }

/* ---------- product page ---------- */
.pdp { padding:52px 0; }
.pdp-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start; }
/* top/bottom padding reserves the badge + chip zones: the centered image is
 * confined to the content box, so it can never overlap the pills */
.pdp-photo { background:#F8F8F8; border:1px solid var(--line-2); border-radius:var(--r-xl); min-height:460px; display:grid; place-items:center; position:relative; padding:64px 40px 74px; box-shadow:var(--sh-2); overflow:hidden; }
.pdp-photo::before { content:""; position:absolute; left:50%; top:52%; width:78%; aspect-ratio:1; transform:translate(-50%,-50%); border-radius:50%; background:radial-gradient(closest-side, rgba(87,212,224,.13) 0%, rgba(47,168,189,.085) 38%, rgba(28,63,124,.04) 62%, transparent 78%); pointer-events:none; }
.pdp-photo img { max-height:320px; max-width:100%; width:auto; position:relative; z-index:1; }
.crumbs { font-size:.8rem; color:var(--ink-3); margin-bottom:22px; }
.crumbs a:hover { color:var(--primary); }
.pdp-info .eyebrow { display:block; margin-bottom:6px; }
.pdp-info h1 { font-size:clamp(1.7rem,1.3rem + 1.8vw,2.4rem); }
.pdp-info .sub { color:var(--ink-2); margin:8px 0 18px; }
.pdp-badges { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:22px; }
.pdp-badges .chip { background:var(--tint); border-color:var(--tint-2); color:var(--primary); }
.size-lbl { font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--ink-3); margin-bottom:10px; }
.sizes { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:24px; }
.size { border:1.5px solid var(--line); border-radius:var(--r-md); padding:12px 18px; text-align:center; transition:all .15s; background:#fff; }
.size .s { display:block; font-weight:700; font-size:.95rem; color:var(--ink); }
.size .p { display:block; font-size:.78rem; color:var(--ink-3); margin-top:2px; }
.size:hover { border-color:var(--azure); }
.size.on { border-color:var(--accent); background:var(--tint); box-shadow:0 0 0 3px rgba(28,63,124,.12); }
.pdp-price { font-size:2rem; font-weight:700; color:var(--navy); font-family:var(--display); margin-bottom:20px; }
.pdp-cta { display:flex; gap:12px; margin-bottom:26px; }
.pdp-cta .btn { flex:1; }
.specs { border:1px solid var(--line-2); border-radius:var(--r-lg); overflow:hidden; }
.spec { display:flex; justify-content:space-between; gap:16px; padding:13px 18px; font-size:.86rem; border-bottom:1px solid var(--line-2); }
.spec:last-child { border-bottom:none; }
.spec dt { color:var(--ink-3); font-weight:500; }
.spec dd { font-weight:600; text-align:right; font-family:var(--mono); font-size:.8rem; word-break:break-all; max-width:60%; }
.pdp-about { max-width:820px; margin:56px auto 0; }
.pdp-about h2 { font-size:1.4rem; margin-bottom:12px; }
.pdp-about > p { color:var(--ink-2); }
.path-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:26px; }
.path { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-lg); padding:20px; }
.path .tag { display:inline-block; font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--azure); background:var(--aqua-tint); border-radius:var(--r-pill); padding:3px 9px; margin-bottom:10px; }
.path h3 { font-size:.95rem; font-family:var(--sans); font-weight:650; color:var(--ink); margin-bottom:6px; }
.path p { font-size:.84rem; color:var(--ink-2); }
.ruo-box { background:var(--tint); border:1px solid var(--tint-2); border-radius:var(--r-lg); padding:18px 22px; font-size:.82rem; color:var(--ink-2); margin-top:32px; line-height:1.7; }
.ruo-box b { color:var(--primary); }
.related { padding:64px 0 20px; }

/* ---------- PDP buy box v3 (aminoclub-parity, Lumen skin) ---------- */
.opt-row { display:flex; align-items:center; gap:18px; margin-bottom:18px; flex-wrap:wrap; }
.opt-lbl { flex:0 0 84px; font-family:var(--mono); font-size:.68rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); }
.mass { display:flex; gap:10px; flex-wrap:wrap; }
.m-pill { border:1.5px solid var(--line); background:#fff; border-radius:var(--r-pill); padding:11px 22px; font-weight:700; font-size:.92rem; color:var(--ink); transition:all .15s; }
.m-pill:hover { border-color:var(--azure); }
.m-pill.on { background:var(--navy); border-color:var(--navy); color:#fff; }
.qtyprice-row { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:20px; flex-wrap:wrap; }
.price-block { text-align:right; }
.price-block .strike { font-size:1.05rem; color:var(--ink-3); text-decoration:line-through; margin-right:10px; font-weight:500; }
.price-block .deal { font-family:var(--display); font-weight:700; font-size:2.1rem; color:var(--primary); }
.price-block .fine { display:block; font-size:.74rem; color:var(--ink-3); margin-top:2px; }
.price-block .fine b { color:var(--azure); font-weight:700; }
.bundle-lbl { font-family:var(--mono); font-size:.68rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); margin-bottom:12px; }
.btiles { display:flex; gap:12px; margin-bottom:22px; flex-wrap:wrap; }
.btile { position:relative; flex:1 1 180px; display:flex; align-items:center; gap:10px; border:1.5px solid var(--line); background:#fff; border-radius:var(--r-lg); padding:16px 16px; transition:all .15s; text-align:left; }
.btile:hover { border-color:var(--azure); }
.btile.on { border-color:var(--primary); background:var(--tint); box-shadow:0 0 0 3px rgba(28,63,124,.12); }
.btile .thumbs { display:flex; flex:0 0 auto; }
.btile .thumbs img { height:46px; width:auto; margin-left:-14px; }
.btile .thumbs img:first-child { margin-left:0; }
.btile .t-name { font-weight:700; font-size:.9rem; color:var(--ink); }
.btile .t-sub { font-size:.76rem; font-weight:700; color:var(--azure); }
.t-badge { position:absolute; top:-9px; left:50%; transform:translateX(-50%); font-family:var(--mono); font-size:.56rem; font-weight:700; letter-spacing:.1em; border-radius:var(--r-pill); padding:3px 10px; white-space:nowrap; }
.t-badge.aqua { background:var(--azure); color:#fff; }
.t-badge.navy { background:var(--navy); color:#fff; }
.pdp-cta .btn-add { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:10px; }
.ship { border:1px solid var(--line-2); border-radius:var(--r-lg); overflow:hidden; background:#fff; margin-bottom:0; }
.ship .srow { display:flex; gap:12px; align-items:flex-start; padding:13px 18px; border-bottom:1px solid var(--line-2); }
.ship .srow.hot { background:var(--aqua-tint); }
.ship .sic { flex:0 0 20px; color:var(--primary); margin-top:3px; }
.ship .srow.hot .sic { color:var(--azure); }
.ship b { display:block; font-size:.88rem; color:var(--ink); }
.ship span { font-size:.78rem; color:var(--ink-3); }
.accept-row { display:flex; align-items:center; gap:12px; padding:13px 18px; flex-wrap:wrap; }
.accept-row .we { font-size:.78rem; color:var(--ink-3); }
.accept-row .sec { display:inline-flex; align-items:center; gap:6px; font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:.12em; color:var(--ink-3); }
.accept-row .cards { margin-left:auto; display:flex; gap:6px; }
.accept-row .cc { font-family:var(--mono); font-size:.6rem; font-weight:700; border:1px solid var(--line); border-radius:4px; padding:3px 7px; color:var(--ink-2); background:#fff; }
.photo-chips { position:absolute; left:18px; bottom:16px; display:flex; gap:8px; flex-wrap:wrap; }
.photo-chips .chip { font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:.08em; padding:6px 12px; }
.photo-chips .chip .dot { width:7px; height:7px; border-radius:50%; background:var(--azure); display:inline-block; }
@media (max-width:640px){
  /* photo panel: vial as large as the safe area allows - the reserved
   * badge/chip padding still guarantees zero overlap */
  .pdp-photo { min-height:445px; padding:58px 18px 62px; }
  .pdp-photo img { max-height:320px; }
  .pdp-grid { gap:20px; }
  /* quantity + price share one line */
  .opt-row { gap:10px; margin-bottom:12px; }
  .qtyprice-row { flex-wrap:nowrap; gap:12px; margin-bottom:14px; }
  .qtyprice-row .opt-lbl { display:none; }
  .price-block { text-align:right; }
  .price-block .deal { font-size:1.6rem; }
  .price-block .strike { font-size:.88rem; margin-right:6px; }
  .m-pill { padding:9px 16px; font-size:.85rem; }
  /* bundle tiles: slim horizontal pills, side by side */
  .btiles { flex-wrap:nowrap; gap:8px; margin-bottom:14px; }
  .btile { flex:1 1 0; min-width:0; flex-direction:row; text-align:left; align-items:center; gap:7px; padding:8px 10px; border-radius:var(--r-md); }
  .btile .thumbs img { height:22px; margin-left:-7px; }
  .btile .thumbs img:not(:first-child) { display:none; }
  .btile .t-name { font-size:.72rem; white-space:nowrap; }
  .btile .t-sub { font-size:.62rem; white-space:nowrap; }
  .t-badge { font-size:.48rem; padding:2px 6px; top:-7px; }
}

/* ---------- PDP v2 (aminoclub-style layout) ---------- */
.alias-row { display:flex; gap:8px; flex-wrap:wrap; margin:6px 0 10px; }
.alias { font-family:var(--mono); font-size:.68rem; font-weight:600; letter-spacing:.06em; color:var(--ink-3); background:var(--n-100); border-radius:var(--r-pill); padding:3px 10px; }
.qty-lbl { font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--ink-3); margin-bottom:10px; }
.qty-row { display:flex; align-items:center; gap:16px; margin-bottom:22px; }
.qty-step { display:inline-flex; align-items:center; border:1.5px solid var(--line); border-radius:var(--r-pill); overflow:hidden; background:#fff; }
.qty-step button { width:42px; height:44px; font-size:1.15rem; font-weight:700; color:var(--primary); }
.qty-step button:hover { background:var(--tint); }
.qty-step .qv { min-width:44px; text-align:center; font-weight:700; font-size:1rem; }
.unit-note { font-size:.8rem; color:var(--ink-3); }
.pdp-cta .btn-coa { flex:0 0 auto; background:#fff; border:1.5px solid var(--line); color:var(--primary); font-weight:700; }
.pdp-cta .btn-coa:hover { border-color:var(--azure); background:var(--aqua-tint); }
.reassure { display:grid; gap:0; border:1px solid var(--line-2); border-radius:var(--r-lg); overflow:hidden; margin-bottom:18px; background:#fff; }
.reassure .rrow { display:flex; gap:12px; align-items:flex-start; padding:13px 18px; border-bottom:1px solid var(--line-2); }
.reassure .rrow:last-child { border-bottom:none; }
.reassure .ric { flex:0 0 32px; height:32px; border-radius:var(--r-sm); background:var(--tint); color:var(--primary); display:grid; place-items:center; margin-top:2px; }
.reassure b { display:block; font-size:.88rem; color:var(--ink); }
.reassure span { font-size:.78rem; color:var(--ink-3); }
.secure-chip { display:flex; align-items:center; justify-content:center; gap:8px; font-family:var(--mono); font-size:.66rem; font-weight:700; letter-spacing:.14em; color:var(--ink-3); }

/* certificate section */
.coa-sec { background:linear-gradient(180deg,var(--n-50),var(--aqua-tint)); }
.cert-wrap { display:grid; grid-template-columns:1.15fr .85fr; gap:26px; align-items:start; }
.cert-card { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-xl); box-shadow:var(--sh-3); overflow:hidden; }
.cert-hd { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:18px 24px; border-bottom:1px solid var(--line-2); }
.cert-lab { display:flex; align-items:center; gap:12px; }
.cert-lab .lab-badge { width:42px; height:42px; border-radius:var(--r-sm); background:var(--grad); color:#fff; display:grid; place-items:center; font-family:var(--mono); font-weight:700; font-size:.7rem; }
.cert-lab b { display:block; font-size:.92rem; color:var(--ink); }
.cert-lab span { font-size:.74rem; color:var(--ink-3); }
.cert-tag { font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:.14em; color:var(--azure); }
.cert-bd { padding:26px 24px; display:grid; grid-template-columns:auto 1fr; gap:26px; align-items:center; }
.cert-purity .big { font-family:var(--display); font-weight:700; font-size:3.4rem; line-height:1; color:var(--navy); }
.cert-purity .big sup { font-size:1.4rem; color:var(--azure); }
.cert-purity .lbl { font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:.14em; color:var(--ink-3); margin-top:6px; }
.cert-meta { display:grid; grid-template-columns:1fr 1fr; gap:12px 20px; }
.cert-meta dt { font-family:var(--mono); font-size:.6rem; font-weight:700; letter-spacing:.12em; color:var(--ink-3); }
.cert-meta dd { font-weight:700; font-size:.95rem; color:var(--ink); }
.cert-ft { padding:0 24px 24px; }
.cert-ft .btn { width:100%; }
.qc-panel { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-xl); overflow:hidden; }
.qc-hd { padding:16px 22px; border-bottom:1px solid var(--line-2); display:flex; justify-content:space-between; align-items:center; }
.qc-hd b { font-size:.9rem; }
.qc-hd span { font-size:.74rem; color:var(--ink-3); }
.qc-row { display:flex; align-items:center; gap:12px; padding:12px 22px; border-bottom:1px solid var(--line-2); font-size:.85rem; }
.qc-row:last-child { border-bottom:none; }
.qc-row .nm { font-weight:600; color:var(--ink); }
.qc-row .mth { font-size:.72rem; color:var(--ink-3); }
.qc-row .val { margin-left:auto; font-family:var(--mono); font-size:.76rem; font-weight:600; color:var(--ink-2); text-align:right; }
.qc-pass { flex:0 0 auto; font-family:var(--mono); font-size:.58rem; font-weight:700; letter-spacing:.1em; color:var(--ok); background:var(--ok-tint); border-radius:var(--r-pill); padding:3px 9px; }
.lots { margin-top:34px; }
.lots h3 { font-size:1.05rem; margin-bottom:14px; }

/* batch-on-record carousel */
.batch-hd { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin:44px 0 20px; }
.batch-hd h3 { font-size:1.3rem; }
.batch-hd p { font-size:.88rem; color:var(--ink-3); margin-top:4px; }
.batch-nav { display:flex; gap:8px; }
.batch-nav button { width:44px; height:44px; border-radius:var(--r-pill); background:#fff; border:1px solid var(--line); color:var(--primary); display:grid; place-items:center; transition:all .15s; }
.batch-nav button:hover { border-color:var(--azure); background:var(--aqua-tint); }
.batch-track { display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 2px 16px; scrollbar-width:thin; }
.bcard { flex:0 0 292px; scroll-snap-align:start; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-lg); padding:22px; display:flex; flex-direction:column; box-shadow:var(--sh-1); }
.bcard-top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:4px; }
.bcard-top b { font-size:.98rem; color:var(--ink); }
.b-badge { font-family:var(--mono); font-size:.58rem; font-weight:700; letter-spacing:.12em; color:var(--azure); background:var(--aqua-tint); border-radius:var(--r-pill); padding:3px 9px; }
.b-lot { font-family:var(--mono); font-size:.7rem; color:var(--ink-3); letter-spacing:.06em; margin-bottom:16px; }
.b-lot b { color:var(--ink-2); }
.b-purity { display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.b-purity .tick { flex:0 0 44px; height:44px; border-radius:var(--r-pill); background:var(--tint); color:var(--primary); display:grid; place-items:center; }
.b-purity .num { font-family:var(--display); font-weight:700; font-size:1.9rem; line-height:1; color:var(--navy); }
.b-purity .num sup { font-size:.9rem; color:var(--azure); }
.b-purity .sub { font-size:.72rem; color:var(--ink-3); margin-top:3px; }
.b-specs { border-top:1px solid var(--line-2); margin-bottom:16px; }
.b-specs .row { display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid var(--line-2); font-size:.82rem; }
.b-specs .row dt { color:var(--ink-3); }
.b-specs .row dd { font-weight:600; color:var(--ink); text-align:right; }
.b-foot { font-size:.72rem; color:var(--ink-3); margin:auto 0 14px; }
.b-foot b { color:var(--ink-2); }
.b-cta { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; background:var(--accent); color:#fff; border-radius:var(--r-pill); padding:13px 0; font-weight:600; font-size:.9rem; transition:all .15s; }
.b-cta:hover { background:var(--accent-hover); }
.lot-row { display:flex; align-items:center; gap:16px; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-md); padding:12px 18px; margin-bottom:8px; font-size:.86rem; flex-wrap:wrap; }
.lot-row .lot { font-family:var(--mono); font-weight:700; color:var(--navy); }
.lot-row .dt { color:var(--ink-3); font-size:.78rem; }
.lot-row .pu { font-family:var(--mono); font-weight:700; color:var(--ok); margin-left:auto; }
.lot-row a { color:var(--primary); font-weight:600; font-size:.8rem; border:1px solid var(--line); border-radius:var(--r-pill); padding:6px 14px; transition:all .15s; }
.lot-row a:hover { border-color:var(--azure); background:var(--aqua-tint); }

/* compound information */
.ci-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.ci-card { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-xl); padding:26px; }
.ci-card h3 { font-size:1.02rem; margin-bottom:16px; }
.ci-card .eyebrow { display:block; margin-bottom:6px; }

/* coa library page - collapsible product modules */
.coa-product { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-lg); margin-bottom:12px; overflow:hidden; transition:box-shadow .2s; }
.coa-product:hover { box-shadow:var(--sh-2); }
.coa-head { width:100%; display:flex; align-items:center; gap:16px; padding:16px 20px; text-align:left; }
.coa-head__thumb { flex:0 0 52px; height:52px; display:grid; place-items:center; background:var(--n-50); border:1px solid var(--line-2); border-radius:var(--r-sm); }
.coa-head__thumb img { max-height:46px; width:auto; }
.coa-head__name { display:block; font-weight:700; font-size:1rem; color:var(--ink); }
.coa-head__sub { display:block; font-size:.76rem; color:var(--ink-3); margin-top:2px; }
.coa-head__right { margin-left:auto; display:flex; align-items:center; gap:14px; }
.coa-head__purity { font-family:var(--mono); font-size:.78rem; font-weight:700; color:var(--ok); background:var(--ok-tint); border-radius:var(--r-pill); padding:4px 12px; }
.coa-head__chev { color:var(--ink-3); transition:transform .25s var(--ease-std); }
.coa-product.open .coa-head__chev { transform:rotate(180deg); }
.coa-product.open .coa-head { border-bottom:1px solid var(--line-2); }
.coa-body { display:none; }
.coa-product.open .coa-body { display:block; }
.coa-body__inner { padding:18px 20px 20px; background:var(--n-50); }
.coa-modules { display:grid; grid-template-columns:repeat(auto-fill,minmax(225px,1fr)); gap:12px; }
.coa-module { display:flex; flex-direction:column; text-align:left; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-md); padding:14px 16px; transition:all .15s; }
.coa-module:hover { border-color:var(--azure); box-shadow:var(--sh-2); transform:translateY(-2px); }
.coa-module__top { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; }
.coa-module__date { font-size:.72rem; color:var(--ink-3); font-weight:600; }
.coa-module__pill { font-family:var(--mono); font-size:.62rem; font-weight:700; color:var(--ok); background:var(--ok-tint); border-radius:var(--r-pill); padding:3px 9px; white-space:nowrap; }
.coa-module__pill.na { color:var(--primary); background:var(--tint); }
.coa-module__rows { border-top:1px solid var(--line-2); }
.coa-module__row { display:flex; justify-content:space-between; gap:10px; padding:7px 0; border-bottom:1px solid var(--line-2); font-size:.76rem; }
.coa-module__row dt { color:var(--ink-3); }
.coa-module__row dd { font-family:var(--mono); font-weight:600; color:var(--ink); text-align:right; word-break:break-all; }
.coa-module__foot { display:flex; align-items:center; justify-content:space-between; margin-top:10px; }
.coa-module__pass { display:inline-flex; align-items:center; gap:5px; font-family:var(--mono); font-size:.6rem; font-weight:700; letter-spacing:.08em; color:var(--ok); }
.coa-module__pass .dot { width:6px; height:6px; border-radius:50%; background:var(--ok); }
.coa-module__view { font-size:.76rem; font-weight:700; color:var(--primary); }
.coa-module:hover .coa-module__view { color:var(--azure); }
@media (max-width:640px){ .coa-modules { grid-template-columns:1fr; } .coa-head { padding:14px 14px; gap:12px; } }

/* coa library page */
.coa-stats { display:flex; gap:14px; flex-wrap:wrap; margin-top:22px; }
.stat { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-lg); padding:16px 24px; }
.stat .v { font-family:var(--display); font-weight:700; font-size:1.6rem; color:var(--navy); }
.stat .k { font-family:var(--mono); font-size:.62rem; font-weight:700; letter-spacing:.12em; color:var(--ink-3); }

@media (max-width:1020px){ .cert-wrap,.ci-grid { grid-template-columns:1fr; } }
@media (max-width:640px){ .cert-bd { grid-template-columns:1fr; } .pdp-cta { flex-wrap:wrap; } }

/* ---------- bulk order builder ---------- */
.bulk-grid { display:grid; grid-template-columns:1.5fr .9fr; gap:30px; align-items:start; }
.bulk-rows { display:grid; gap:12px; }
.brow { display:flex; align-items:center; gap:16px; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-lg); padding:14px 18px; }
.brow .bimg { flex:0 0 58px; height:58px; display:grid; place-items:center; }
.brow .bimg img { max-height:58px; width:auto; }
.brow .bname { min-width:0; flex:1 1 180px; }
.brow .bname b { display:block; font-size:.95rem; color:var(--ink); }
.brow .bname span { font-size:.74rem; color:var(--ink-3); }
.brow select { font-family:inherit; font-size:.84rem; font-weight:600; color:var(--ink); border:1px solid var(--line); border-radius:var(--r-pill); padding:8px 12px; background:#fff; }
.brow .bprice { text-align:right; min-width:110px; }
.brow .bprice .u { display:block; font-weight:700; color:var(--primary); font-size:1rem; }
.brow .bprice .s { font-size:.74rem; color:var(--ink-3); text-decoration:line-through; }
.brow .bprice .pct { font-size:.68rem; color:var(--azure); font-weight:700; }
.brow .badd { background:var(--accent); color:#fff; border-radius:var(--r-pill); padding:10px 18px; font-size:.82rem; font-weight:600; white-space:nowrap; }
.brow .badd:hover { background:var(--accent-hover); }
.brow .qty-step { flex:0 0 auto; }
.brow .qty-step button { width:34px; height:38px; }
.bulk-sum { position:sticky; top:96px; background:#fff; border:1px solid var(--line-2); border-radius:var(--r-xl); box-shadow:var(--sh-2); padding:26px; }
.bulk-sum h2 { font-size:1.25rem; display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.bulk-sum .units { font-family:var(--mono); font-size:.78rem; color:var(--ink-3); font-weight:600; }
.bulk-meter { margin-top:14px; }
.bulk-meter .bar { height:8px; border-radius:var(--r-pill); background:var(--n-100); overflow:hidden; }
.bulk-meter .bar span { display:block; height:100%; width:0; border-radius:var(--r-pill); background:var(--grad); transition:width .3s var(--ease-std); }
.bulk-meter .lbl { display:block; font-size:.74rem; color:var(--ink-3); margin-top:6px; font-weight:600; }
.bulk-sum .tiers { margin:16px 0; border:1px solid var(--line-2); border-radius:var(--r-md); overflow:hidden; }
.bulk-sum .tier { display:flex; justify-content:space-between; padding:10px 15px; font-size:.84rem; background:var(--aqua-tint); font-weight:600; color:var(--ink); }
.bulk-sum .tier .pc { color:var(--azure); font-weight:700; }
.bulk-sum .rules { font-size:.78rem; color:var(--ink-3); margin-bottom:16px; line-height:1.6; }
.bsum-lines { display:grid; gap:8px; margin-bottom:16px; }
.bsum-line { display:flex; justify-content:space-between; gap:10px; font-size:.84rem; border-bottom:1px solid var(--line-2); padding-bottom:8px; }
.bsum-line .n { font-weight:600; color:var(--ink); }
.bsum-line .d { color:var(--ink-3); font-size:.76rem; }
.bsum-line .p { font-weight:700; color:var(--navy); white-space:nowrap; }
.bsum-tot { display:flex; justify-content:space-between; font-weight:700; font-size:1.05rem; margin-bottom:6px; }
.bsum-save { display:flex; justify-content:space-between; font-size:.82rem; color:var(--ok); font-weight:600; margin-bottom:16px; }
.bulk-empty { text-align:center; color:var(--ink-3); font-size:.86rem; padding:22px 0; }
@media (max-width:1020px){ .bulk-grid { grid-template-columns:1fr; } .bulk-sum { position:static; } }
@media (max-width:640px){ .brow { flex-wrap:wrap; } .brow .bprice { text-align:left; } }

/* ---------- doc / legal / support pages ---------- */
.doc-wrap { max-width:820px; margin:0 auto; }
.doc-card { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-xl); padding:38px 42px; box-shadow:var(--sh-1); }
.prose h2 { font-size:1.15rem; margin:26px 0 10px; }
.prose h2:first-child { margin-top:0; }
.prose p { font-size:.94rem; color:var(--ink-2); margin-bottom:12px; }
.prose a { color:var(--primary); font-weight:600; }
.prose a:hover { text-decoration:underline; }
.doc-date { font-family:var(--mono); font-size:.7rem; letter-spacing:.08em; color:var(--ink-3); margin-top:10px; display:block; }
/* contact */
.contact-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:26px; align-items:start; }
.cform label { display:block; font-family:var(--mono); font-size:.64rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); margin:16px 0 6px; }
.cform input, .cform select, .cform textarea { width:100%; font-family:inherit; font-size:.92rem; color:var(--ink); background:#fff; border:1.5px solid var(--line); border-radius:var(--r-md); padding:12px 14px; outline:none; transition:border .15s; }
.cform input:focus, .cform select:focus, .cform textarea:focus { border-color:var(--azure); }
.cform .hint { font-size:.74rem; color:var(--ink-3); margin-top:10px; }
.side-card { background:#fff; border:1px solid var(--line-2); border-radius:var(--r-lg); padding:22px; margin-bottom:14px; }
.side-card .ic { width:42px; height:42px; border-radius:var(--r-md); background:var(--tint); color:var(--primary); display:grid; place-items:center; margin-bottom:12px; }
.side-card h3 { font-size:1rem; margin-bottom:6px; }
.side-card p { font-size:.86rem; color:var(--ink-2); }
@media (max-width:1020px){ .contact-grid { grid-template-columns:1fr; } .doc-card { padding:26px 22px; } }

/* ---------- COA popup viewer ---------- */
.coa-modal { position:fixed; inset:0; z-index:150; display:none; }
body.coa-open .coa-modal { display:block; }
.coa-modal .cm-veil { position:absolute; inset:0; background:rgba(10,21,38,.62); backdrop-filter:blur(3px); }
.coa-modal .cm-box { position:absolute; inset:4% 6%; background:#fff; border-radius:var(--r-xl); box-shadow:var(--sh-4); display:flex; flex-direction:column; overflow:hidden; }
.coa-modal .cm-hd { display:flex; align-items:center; gap:12px; padding:14px 20px; border-bottom:1px solid var(--line-2); }
.coa-modal .cm-hd b { font-size:.95rem; color:var(--ink); }
.coa-modal .cm-hd .cm-tag { font-family:var(--mono); font-size:.6rem; font-weight:700; letter-spacing:.12em; color:var(--azure); background:var(--aqua-tint); border-radius:var(--r-pill); padding:3px 10px; }
.coa-modal .cm-new { margin-left:auto; font-size:.78rem; font-weight:600; color:var(--primary); border:1px solid var(--line); border-radius:var(--r-pill); padding:7px 14px; transition:all .15s; }
.coa-modal .cm-new:hover { border-color:var(--azure); background:var(--aqua-tint); }
.coa-modal .cm-x { width:36px; height:36px; border-radius:var(--r-pill); background:var(--tint); color:var(--primary); font-size:1rem; flex:0 0 auto; }
.coa-modal iframe { flex:1; width:100%; border:none; background:var(--n-100); }
body.coa-open { overflow:hidden; }
@media (max-width:640px){ .coa-modal .cm-box { inset:2% 2%; } .coa-modal .cm-hd b { font-size:.8rem; } }

/* ---------- PDP top disclaimer + sticky mobile buy bar ---------- */
.fda-note { background:var(--n-50); border-bottom:1px solid var(--line-2); color:var(--ink-3); font-size:.72rem; line-height:1.5; text-align:center; padding:8px 16px; }
.fda-note b { color:var(--ink-2); }
.buybar { position:fixed; left:0; right:0; bottom:0; z-index:60; background:#fff; border-top:1px solid var(--line-2); box-shadow:0 -10px 26px rgba(10,21,38,.1); padding:10px 14px calc(10px + env(safe-area-inset-bottom)); display:none; align-items:center; gap:12px; transform:translateY(110%); transition:transform .25s ease; }
body.bb-on .buybar { transform:none; }
.buybar .bb-info { min-width:0; flex:1; }
.buybar .bb-info > b { display:block; font-size:.86rem; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.buybar .bb-price s { font-size:.76rem; color:var(--ink-3); margin-right:6px; }
.buybar .bb-price b { font-family:var(--display); font-size:1.05rem; color:var(--primary); }
.buybar .btn { flex:0 0 auto; padding:12px 22px; }
@media (max-width:760px){ .buybar { display:flex; } }

/* toast */
.toast { position:fixed; bottom:26px; left:50%; transform:translate(-50%,20px); background:var(--navy); color:#fff; border-radius:var(--r-pill); padding:12px 24px; font-size:.88rem; font-weight:600; opacity:0; pointer-events:none; transition:all .25s; z-index:120; box-shadow:var(--sh-4); }
.toast.show { opacity:1; transform:translate(-50%,0); }

/* ---------- responsive ---------- */
@media (max-width:1020px){
  .prod-grid { grid-template-columns:repeat(3,1fr); }
  .q-grid { grid-template-columns:repeat(3,1fr); }
  .guar-grid,.bene-grid { grid-template-columns:1fr 1fr; }
  .ftr-grid { grid-template-columns:1fr 1fr; }
  .ftr-grid > div:first-child { grid-column:1 / -1; }
  .pdp-grid { grid-template-columns:1fr; }
  .nav { display:none; }
  .menu-btn { display:grid; }
}
@media (max-width:640px){
  .prod-grid { grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; }
  .pcard { min-width:0; }
  .pcard-img { height:140px; }
  .pcard-img img { max-height:120px; }
  .q-grid,.bene-grid,.path-grid { grid-template-columns:1fr; }
  .guar-grid { grid-template-columns:1fr 1fr; gap:12px; }
  .gcard { padding:18px 16px; }
  .gcard .ic { width:42px; height:42px; margin-bottom:12px; }
  .gcard h3 { font-size:.95rem; }
  .gcard p { font-size:.8rem; }
  .section { padding:52px 0; }
  .hero { padding:42px 0 52px; }
  .hero-in p { margin-bottom:18px; }
  .strip { padding:32px 26px; }
  /* compact mobile footer: brand block full-width, link columns 2-up, tighter type */
  .ftr { padding:40px 0 24px; margin-top:48px; }
  .ftr-grid { grid-template-columns:1fr 1fr; gap:22px 18px; margin-bottom:26px; }
  .ftr img.fl { height:34px; margin-bottom:10px; }
  .ftr-mail { margin-top:6px; font-size:.82rem; }
  .ftr h3 { font-size:.7rem; margin-bottom:9px; }
  .ftr ul { gap:6px; }
  .ftr a { font-size:.8rem; }
  .ftr-ruo { font-size:.66rem; line-height:1.6; padding:13px 15px; margin-bottom:18px; }
  .ftr-base { flex-direction:column; gap:5px; font-size:.68rem; padding-top:16px; }
}
/* mobile nav sheet */
.mnav { position:fixed; inset:0; z-index:96; background:rgba(10,21,38,.45); opacity:0; pointer-events:none; transition:opacity .25s; overflow:hidden; }
body.mnav-open .mnav { opacity:1; pointer-events:auto; }
.mnav-sheet { position:absolute; top:0; right:0; bottom:0; width:min(340px,90vw); background:#fff; display:flex; flex-direction:column; transform:translateX(102%); transition:transform .28s var(--ease-std); box-shadow:var(--sh-4); }
body.mnav-open .mnav-sheet { transform:none; }
.mnav-hd { display:flex; justify-content:space-between; align-items:center; padding:14px 16px; border-bottom:1px solid var(--line-2); }
.mnav-hd img { height:34px; width:auto; }
.mnav-x { width:40px; height:40px; border-radius:var(--r-pill); background:var(--tint); color:var(--primary); font-size:1.05rem; display:grid; place-items:center; }
.mnav-links { flex:1; overflow-y:auto; padding:8px 10px; }
.mnav-links a { display:flex; align-items:center; gap:12px; font-size:1rem; font-weight:700; font-family:var(--display); color:var(--navy); padding:15px 12px; border-bottom:1px solid var(--line-2); }
.mnav-links a:last-child { border-bottom:none; }
.mnav-links a .mi { flex:0 0 34px; height:34px; border-radius:var(--r-sm); background:var(--n-50); border:1px solid var(--line-2); color:var(--primary); display:grid; place-items:center; }
.mnav-links a .chev { margin-left:auto; color:var(--ink-3); display:grid; }
.mnav-tag { font-family:var(--mono); font-size:.56rem; font-weight:700; letter-spacing:.08em; color:#fff; background:var(--azure); border-radius:var(--r-pill); padding:3px 8px; }
.mnav-promo { margin:10px 14px 0; background:var(--aqua-tint); border:1px solid var(--aqua-tint-2); border-radius:var(--r-md); padding:12px 14px; }
.mnav-promo b { display:block; font-size:.84rem; color:var(--ink); }
.mnav-promo span { font-size:.74rem; color:var(--ink-2); }
.mnav-ft { padding:14px 16px 18px; border-top:1px solid var(--line-2); }
.mnav-ft .btn { width:100%; justify-content:center; display:inline-flex; }
.mnav-ft .mail { display:block; text-align:center; margin-top:12px; font-size:.84rem; font-weight:600; color:var(--primary); }
.mnav-ft .ruo { margin-top:10px; text-align:center; font-family:var(--mono); font-size:.6rem; letter-spacing:.1em; color:var(--ink-faint); }
