/* ==========================================================================
   ANABULL — site styles v2
   Tailwind handles utilities; this file owns the brand-specific behaviour:
   glows, atmospheric effects, tactical buttons, hazard stripes, registration
   marks, modals, sticky cart, social proof, language switcher, etc.
   ========================================================================== */

:root {
  --ink: #000;
  --ink-2: #0a0a0a;
  --graphite: #141414;            /* alt section bg, breaks up black */
  --charcoal: #1f1f1f;            /* card bg, subtle contrast on graphite */
  --steel: #1a1a1a;               /* legacy bg name (don't break old rules) */
  --steel-cool: #6b7280;          /* spec accent-steel for cancel/technical UI */
  --steel-2: #222;
  --bone: #e5e5e5;
  --blood: #a01818;
  --fire: #d62828;                /* brand red — kept, used 30% less */
  --amber: #f4a51e;               /* PRIMARY CTA color */
  --toxic: #c4ff00;               /* electric lime, scientific data only */
  --warn: #f4c430;
  --gradient-fire: linear-gradient(135deg, #d62828 0%, #f4a51e 100%);
  --shadow-blood: 0 0 60px rgba(160, 24, 24, .55);
  --shadow-card:  0 4px 24px rgba(214, 40, 40, 0.08), 0 1px 0 rgba(255,255,255,0.05) inset;
  --shadow-card-hover: 0 8px 36px rgba(244, 165, 30, 0.18), 0 2px 0 rgba(255,255,255,0.08) inset;
  --easing: cubic-bezier(.2, .9, .2, 1);
  --header-h: 64px;
}
@media (min-width:768px){:root{--header-h:80px}}

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 12px); overflow-x: hidden; }
body {
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  /* Subtle noise texture — opacity baked into SVG so no extra paint cost */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.04 0'/></filter><rect width='160' height='160' filter='url(%23n)'/></svg>");
  background-attachment: fixed;
}
*::selection { background: var(--amber); color: #000; }

/* Global rule for any element using Anton: never let inherited font-weight
   trigger synthetic bold. Anton ships at 400 only. Reset it to normal on
   every Anton-typeset element. Also lock kerning/feature settings. */
.font-head,
[class*="__title"][style*="Anton"], /* defensive */
.feature__num, .feature__title,
.ingredient__title, .ingredient__list li b,
.price__main, .price-table__title, .price-table__badge, .price-table__total span, .price-table__total b,
.price-table__list li b,
.subscribe-box__badge,
.compare-table thead th, .compare-table tbody th,
.how-sub__steps b,
.promise-card__num, .promise-card h3,
.testimonial footer,
.science-card h3,
.faq__q, .faq__chev,
.footer__title,
.trust-badge__label,
.stat__num,
.pull-quote,
.btn-primary, .btn-ghost {
  font-weight: 400;        /* Anton's only real weight — never synthesise */
  font-feature-settings: "kern" 1;
  text-rendering: optimizeLegibility;
}

/* ============ URGENCY BAR ============ */
.urgency-bar { position: relative; background:#000; border-bottom:1px solid var(--amber); color:#fff; font-size:.78rem; padding:.55rem 0; overflow:hidden; }
@media (min-width:640px){ .urgency-bar{ font-size:.85rem; } }
.urgency-bar__track { display:flex; white-space:nowrap; will-change:transform; animation: ticker 38s linear infinite; }
.urgency-bar__chunk { padding:0 2.5rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.urgency-bar__chunk b { color: var(--amber); }
@keyframes ticker { 0%{transform:translateX(0)} 100%{transform:translateX(-60%)} }
@media (prefers-reduced-motion: reduce) { .urgency-bar__track{animation:none} }

/* ============ HEADER ============ */
.site-header { position:sticky; top:0; z-index:50; background:rgba(0,0,0,.95); backdrop-filter:blur(8px); border-bottom:1px solid rgba(255,255,255,.05); transition:height .15s var(--easing); }
.site-header.shrunk > div { height:56px; }
@media (min-width:768px){ .site-header.shrunk > div{ height:64px; } }
.nav-link { color:#fff; position:relative; padding:.25rem 0; transition:color .15s var(--easing); background:none; border:0; cursor:pointer; font:inherit; }
.nav-link:hover { color: var(--fire); }
.nav-link::after { content:""; position:absolute; left:0; right:100%; bottom:-2px; height:2px; background:var(--fire); transition:right .15s var(--easing); }
.nav-link:hover::after { right:0; }
.nav-link--quiz { color: var(--warn); }
.mobile-link { display:block; padding:1rem .5rem; color:#fff; border-bottom:1px solid rgba(255,255,255,.05); background:none; border:0; width:100%; font:inherit; }
.mobile-link:hover, .mobile-link:focus { color: var(--fire); background: rgba(160,24,24,.08); }
.mobile-link--quiz { color: var(--warn); }

/* ============ LANG SWITCHER ============ */
.lang-switcher { position:relative; }
.lang-switcher__current { display:inline-flex; align-items:center; gap:.4rem; padding:.4rem .6rem; background:transparent; border:1px solid rgba(255,255,255,.15); color:#fff; font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; cursor:pointer; transition:border-color .15s; }
.lang-switcher__current:hover { border-color: var(--fire); }
.lang-switcher__flag { font-size:1.1em; line-height:1; }
.lang-switcher__menu { position:absolute; right:0; top:calc(100% + 4px); list-style:none; padding:.25rem 0; margin:0; background:#0a0a0a; border:1px solid rgba(255,255,255,.1); min-width:140px; z-index:60; box-shadow:0 8px 30px rgba(0,0,0,.6); }
.lang-switcher__menu li { padding:0; }
.lang-switcher__menu a { display:flex; align-items:center; gap:.5rem; padding:.5rem .75rem; color:#fff; text-decoration:none; font-size:.8rem; font-weight:600; letter-spacing:.1em; }
.lang-switcher__menu a:hover { background: rgba(160,24,24,.15); color: var(--fire); }
.lang-switcher__menu[hidden] { display:none; }

/* ============ BUTTONS — tactical hierarchy ============ */
/* PRIMARY: amber on black, 3D pressed-edge effect, gradient-fire on hover.
   This is the biggest conversion lift on the page. */
.btn-primary {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:1rem 2rem; min-height:56px;
  font-family:'Anton','Bebas Neue',Impact,sans-serif;
  letter-spacing:.14em; text-transform:uppercase;
  font-size:1rem; line-height:1;
  /* NO font-weight here — Anton is single-weight (400). Forcing 700/800/900
     triggers synthetic bold and produces fuzzy edges, especially at this
     letter-spacing on amber-on-black. Anton at native weight is heavy enough. */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern" 1;
  background: var(--amber); color:#000;
  border:0;
  /* Pressed-3D effect: black bottom + right edge */
  box-shadow: 4px 4px 0 #000, 0 0 0 1px rgba(0,0,0,.6) inset;
  cursor:pointer;
  text-decoration:none;
  position:relative;
  transition: background .15s linear, color .15s linear, transform .12s var(--easing), box-shadow .15s linear;
  will-change: transform, box-shadow;
}
.btn-primary:hover {
  background: var(--gradient-fire);
  color:#000;
  transform: translate(-2px,-2px);
  box-shadow: 6px 6px 0 var(--fire), 0 0 0 1px rgba(0,0,0,.6) inset;
}
.btn-primary:active { transform: scale(.97) translate(0,0); box-shadow: 2px 2px 0 #000; }
@media (prefers-reduced-motion: reduce) {
  .btn-primary, .btn-primary:hover, .btn-primary:active { transform:none; }
}

/* SECONDARY: outlined white */
.btn-ghost {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:1rem 2rem; min-height:56px;
  font-family:'Anton','Bebas Neue',Impact,sans-serif;
  letter-spacing:.14em; text-transform:uppercase;
  font-size:1rem; line-height:1;
  /* No font-weight — Anton is single-weight; synthetic bold causes blur. */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern" 1;
  background: transparent; color:#fff;
  border:2px solid #fff;
  cursor:pointer; text-decoration:none;
  transition: background .12s linear, color .12s linear, transform .12s var(--easing);
}
.btn-ghost:hover { background:#fff; color:#000; }
.btn-ghost:active { transform: scale(.97); }

/* TERTIARY: amber text link */
.btn-tertiary {
  display:inline-flex; align-items:center; gap:.3rem;
  background:transparent; border:0; padding:0; cursor:pointer;
  color: var(--amber); font-weight:700; text-decoration:none;
  transition: color .12s;
}
.btn-tertiary:hover { color:#fff; text-decoration: underline; text-underline-offset:3px; }

/* DESTRUCTIVE / CANCEL */
.btn-cancel {
  display:inline-flex; align-items:center; justify-content:center;
  padding:.85rem 1.4rem;
  background: transparent; color: var(--bone);
  border:1px solid var(--steel-cool); cursor:pointer;
  font-weight:600; text-transform:uppercase; letter-spacing:.1em; font-size:.85rem;
  transition: color .12s, border-color .12s;
}
.btn-cancel:hover { color:#fff; border-color:#fff; }

/* Size modifiers */
.btn-lg { padding:1.05rem 2.1rem; font-size:1.05rem; min-height:60px; }
.btn-xl { padding:1.3rem 2.4rem; font-size:1.25rem; min-height:68px; }

/* ============ HERO ============ */
.hero { position:relative; }
.hero__bg { position:absolute; inset:0; overflow:hidden; }
.hero__video, .hero__img-fallback { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:70% center; opacity:.85; }
/* portrait video on mobile: keep central composition */
@media (max-width: 767px) {
  .hero__video, .hero__img-fallback { object-position: center center; }
}
.hero__img-fallback { display:none; }
@media (prefers-reduced-motion: reduce) { .hero__video { display:none; } .hero__img-fallback { display:block; } }
.hero__shade { position:absolute; inset:0; background: linear-gradient(90deg, rgba(0,0,0,.95) 0%, rgba(0,0,0,.75) 35%, rgba(0,0,0,.4) 60%, rgba(0,0,0,.15) 100%), linear-gradient(180deg, rgba(0,0,0,.4) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,.6) 100%); }
.hero__vignette { position:absolute; inset:0; background: radial-gradient(circle at 0% 100%, rgba(160,24,24,.4) 0%, transparent 35%), radial-gradient(circle at 100% 100%, rgba(160,24,24,.25) 0%, transparent 40%); pointer-events:none; }
.hero__smoke { position:absolute; inset:-10% -20%; background: radial-gradient(ellipse 50% 30% at 30% 70%, rgba(255,255,255,.04) 0%, transparent 60%), radial-gradient(ellipse 60% 40% at 70% 30%, rgba(255,255,255,.03) 0%, transparent 60%), radial-gradient(ellipse 40% 25% at 50% 50%, rgba(214,40,40,.06) 0%, transparent 70%); filter:blur(8px); animation:smoke 22s ease-in-out infinite; pointer-events:none; }
@keyframes smoke { 0%,100%{transform:translate(0,0) scale(1);opacity:.9} 50%{transform:translate(2%,-1%) scale(1.05);opacity:1} }
@media (prefers-reduced-motion: reduce) { .hero__smoke { animation:none; } }

.pre-head { font-weight:800; text-transform:uppercase; letter-spacing:.3em; font-size:.78rem; color: var(--amber); margin-bottom:1rem; }
.trust { display:inline-flex; align-items:center; gap:.4rem; font-weight:600; line-height:1.4; }
.trust__check { color: var(--amber); font-weight:900; font-size:1.1em; }

/* Body prose readability — wider line-height + max readable column */
.prose-body { line-height: 1.75; max-width: 60ch; }
.prose-body.prose-body--center { margin-left:auto; margin-right:auto; }

/* Pull-quote — single-line punchy callout with amber bracket marks */
.pull-quote {
  font-family:'Anton',sans-serif; color: var(--amber); font-size:1.6rem;
  letter-spacing:.04em; text-transform:uppercase; line-height:1.15;
  padding: .5rem 1.5rem; position:relative;
}
.pull-quote::before { content:"["; color: var(--fire); margin-right:.4rem; }
.pull-quote::after  { content:"]"; color: var(--fire); margin-left:.4rem; }

/* ============ TRUST BAR ============ */
.trust-bar { background: var(--graphite); border-top:1px solid rgba(244,165,30,.15); border-bottom:1px solid rgba(244,165,30,.15); }
.trust-badge { display:flex; align-items:center; gap:.75rem; color:#fff; min-height:48px; padding:.25rem 0; }
.trust-badge__svg { width:36px; height:36px; color: var(--amber); flex-shrink:0; }
.trust-badge__label { font-family:'Anton',sans-serif; text-transform:uppercase; font-size:.85rem; line-height:1.2; letter-spacing:.06em; }
.trust-badge__label small { font-family:'Inter',sans-serif; text-transform:none; font-size:.7rem; color: var(--bone); opacity:.7; letter-spacing:0; }
.trust-badge--reviews { grid-column: span 2; justify-content:center; }
@media (min-width:768px){ .trust-badge--reviews { grid-column: span 1; justify-content:flex-start; } }
.trust-badge__stars { color: var(--amber); font-size:1.4rem; letter-spacing:.1em; line-height:1; }

/* ============ STAT CARDS — toxic-green data treatment ============ */
.stat-card {
  background: var(--charcoal);
  padding:2.25rem 1.25rem; text-align:center;
  border:1px solid rgba(255,255,255,.06);
  border-top:3px solid var(--amber);
  box-shadow: var(--shadow-card);
  transition: border-color .2s var(--easing), transform .2s var(--easing), box-shadow .2s var(--easing);
}
.stat-card:hover { border-top-color: var(--toxic); transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
.stat__num {
  line-height:.85; margin-bottom:.75rem;
  color: var(--toxic) !important;
  font-family:'Anton',sans-serif; letter-spacing:-.02em;
  text-shadow: 0 0 30px rgba(196,255,0,.35), 0 0 6px rgba(196,255,0,.2);
}
.stat__label {
  color: var(--fire); font-size:.78rem;
  text-transform:uppercase; letter-spacing:.18em;
  line-height:1.4; font-weight:700;
  border-top: 1px solid rgba(214,40,40,.25); padding-top: .75rem; margin-top: .5rem;
}

/* ============ HAZARD STRIPES ============ */
.hazard-stripes { position:absolute; top:0; left:0; right:0; height:16px; background: repeating-linear-gradient(-45deg, var(--warn) 0px, var(--warn) 16px, #000 16px, #000 32px); opacity:.65; }

/* ============ FEATURE CARDS ============ */
.feature-card {
  display:block; background: var(--charcoal); padding:2rem 1.5rem;
  border:1px solid rgba(255,255,255,.06);
  box-shadow: var(--shadow-card);
  position:relative; text-decoration:none; color:inherit;
  transition: border-color .2s var(--easing), background .2s var(--easing), transform .2s var(--easing), box-shadow .2s var(--easing);
}
.feature-card:hover { border-color: var(--amber); transform: translateY(-3px); box-shadow: var(--shadow-card-hover); }
.feature__num { display:block; font-family:'Anton',sans-serif; font-size:3.5rem; line-height:1; color: var(--amber); margin-bottom:.5rem; letter-spacing:.04em; }
.feature__title { font-family:'Anton',sans-serif; text-transform:uppercase; font-size:1.75rem; letter-spacing:.04em; margin-bottom:.75rem; color:#fff; }
.feature__copy { color:var(--bone); line-height:1.6; font-size:.98rem; }

/* ============ REGISTRATION MARKS ============ */
.reg-corners { position:absolute; inset:0; pointer-events:none; }
.reg { position:absolute; color:var(--fire); font-size:1.5rem; line-height:1; opacity:.9; font-weight:700; }
.reg--tl { top:1rem; left:1rem; } .reg--tr { top:1rem; right:1rem; }
.reg--bl { bottom:1rem; left:1rem; } .reg--br { bottom:1rem; right:1rem; }
.reg-corners--inner .reg { font-size:.9rem; opacity:.8; top:.35rem; left:.35rem; }
.reg-corners--inner .reg--tr { left:auto; right:.35rem; }
.reg-corners--inner .reg--bl { top:auto; bottom:.35rem; }
.reg-corners--inner .reg--br { top:auto; left:auto; bottom:.35rem; right:.35rem; }

/* ============ PRODUCT IMG — drop-shadow + hover tilt ============ */
.product-img-wrap { position:relative; padding:1.5rem; min-height:380px; display:flex; align-items:center; justify-content:center; }
.product-glow { position:absolute; inset:10%; border-radius:50%; filter:blur(80px); pointer-events:none; transition: filter .25s var(--easing), opacity .25s var(--easing); }
.product-glow--red { background: radial-gradient(circle, rgba(214,40,40,.65) 0%, rgba(160,24,24,.3) 50%, transparent 75%); }
.product-glow--silver { background: radial-gradient(circle, rgba(180,180,200,.35) 0%, rgba(120,120,140,.15) 50%, transparent 75%); }
.product-img {
  position:relative; max-height:520px; width:auto; max-width:100%;
  filter: drop-shadow(0 10px 30px rgba(0,0,0,.55)) drop-shadow(0 0 40px rgba(214,40,40,.28));
  transition: transform .35s var(--easing), filter .35s var(--easing);
  will-change: transform;
}
.product-img--tilt-l { transform: rotate(-3deg); }
.product-img--tilt-r { transform: rotate(3deg); }
.product-img-wrap:hover .product-img--tilt-l { transform: rotate(-6deg) scale(1.03); filter: drop-shadow(0 14px 36px rgba(0,0,0,.7)) drop-shadow(0 0 48px rgba(214,40,40,.45)); }
.product-img-wrap:hover .product-img--tilt-r { transform: rotate(6deg)  scale(1.03); filter: drop-shadow(0 14px 36px rgba(0,0,0,.7)) drop-shadow(0 0 48px rgba(214,40,40,.45)); }
.product-img-wrap:hover .product-glow { filter: blur(70px); opacity: 1.15; }
@media (prefers-reduced-motion: reduce) {
  .product-img, .product-img-wrap:hover .product-img { transition: none; transform: rotate(0); }
}

/* ============ COPY ============ */
.prose-body { color:var(--bone); font-size:1.05rem; line-height:1.75; }
.prose-body p:first-child::first-line { font-weight:700; color:#fff; }
.bullet-list { list-style:none; padding:0; margin:0; }
.bullet-list li { padding-left:1.75rem; position:relative; padding-bottom:.5rem; color:var(--bone); font-weight:500; }
.bullet-list li::before { content:"▸"; position:absolute; left:0; top:-1px; color:var(--fire); font-weight:900; font-size:1.1rem; }

/* ============ INGREDIENT BOX ============ */
.ingredient-box { position:relative; background: var(--charcoal); border:1px solid rgba(244,165,30,.35); padding:1.5rem 1.25rem 1.25rem; box-shadow: var(--shadow-card); }
.ingredient__title { font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:.15em; font-size:1rem; color: var(--amber); margin-bottom:1rem; padding-bottom:.75rem; border-bottom:1px solid rgba(244,165,30,.25); }
.ingredient__list { list-style:none; padding:0; margin:0; }
.ingredient__list li { display:flex; justify-content:space-between; align-items:baseline; gap:1rem; padding:.55rem 0; border-bottom:1px dashed rgba(255,255,255,.08); font-size:.95rem; color:var(--bone); }
.ingredient__list li:last-child { border-bottom:0; }
.ingredient__list li b { color:#fff; white-space:nowrap; font-family:'Anton',sans-serif; letter-spacing:.05em; font-size:1.05rem; }

/* ============ PRICE BOX ============ */
.price-box { background: var(--charcoal); border:1px solid rgba(244,165,30,.4); padding:1.25rem 1.5rem; display:flex; flex-direction:column; gap:.4rem; box-shadow: var(--shadow-card); border-left: 3px solid var(--amber); }
.price__main { font-family:'Anton',sans-serif; color:#fff; display:flex; align-items:baseline; gap:.4rem; flex-wrap:wrap; }
.price__currency { font-size:1.5rem; opacity:.9; }
.price__value { font-size:3rem; line-height:1; color: var(--amber); }
.price__per { font-size:.95rem; color: var(--bone); margin-left:.25rem; letter-spacing:.1em; text-transform:uppercase; }
.price__sub { color:var(--bone); font-size:.9rem; text-transform:uppercase; letter-spacing:.15em; }
.price-box [data-price][data-format="big"] { font-family:'Anton',sans-serif; font-size:3rem; line-height:1; color: var(--amber); }

/* ============ CLINICAL FRAME ============ */
.clinical-frame { background:linear-gradient(180deg, rgba(180,180,200,.04), transparent 30%), var(--ink); }
.clinical-frame::before, .clinical-frame::after { content:""; position:absolute; left:0; right:0; height:1px; background:linear-gradient(90deg, transparent, rgba(180,180,200,.3), transparent); }
.clinical-frame::before { top:0; } .clinical-frame::after { bottom:0; }
.warning-callout { display:flex; align-items:center; gap:1rem; padding:1.1rem 1.5rem; background:rgba(244,165,30,.08); border:1px solid var(--amber); position:relative; font-weight:600; color:#fff; }
.warning-callout::before, .warning-callout::after { content:""; position:absolute; width:14px; height:14px; border-color:var(--amber); border-style:solid; }
.warning-callout::before { top:-1px; left:-1px; border-width:2px 0 0 2px; }
.warning-callout::after { bottom:-1px; right:-1px; border-width:0 2px 2px 0; }
.warning-callout p, .warning-callout b { color: #fff; }
.warning-callout b { color: var(--amber); }
.warn-icon { color: var(--amber); font-size:1.5rem; line-height:1; }

/* ============ ATMOSPHERIC GLOW ============ */
.atmospheric-glow { position:absolute; pointer-events:none; filter:blur(120px); opacity:.55; }
.atmospheric-glow--right { top:10%; right:-10%; width:60%; height:80%; background:radial-gradient(circle, var(--blood), transparent 70%); }
.atmospheric-glow--center { top:0; left:50%; transform:translateX(-50%); width:90%; height:100%; background:radial-gradient(ellipse at 50% 50%, rgba(160,24,24,.35) 0%, transparent 60%); }
.atmospheric-glow--massive { top:0; left:50%; transform:translateX(-50%); width:120%; height:120%; background:radial-gradient(ellipse at 50% 60%, rgba(214,40,40,.45) 0%, rgba(160,24,24,.2) 30%, transparent 60%); }

/* ============ COMPARISON TABLE ============ */
.compare-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; box-shadow: var(--shadow-card); }
.compare-table { width:100%; min-width:600px; border-collapse:collapse; background:var(--charcoal); border:1px solid rgba(255,255,255,.08); }
.compare-table th, .compare-table td { padding:.9rem 1rem; text-align:center; border-bottom:1px solid rgba(255,255,255,.05); border-right:1px solid rgba(255,255,255,.05); font-size:.9rem; vertical-align:middle; }
.compare-table thead th { background:#000; color:var(--bone); font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:.08em; font-size:1rem; padding:1.1rem .75rem; }
.compare-table thead th.compare-table__us { background: var(--amber); color:#000; box-shadow:inset 0 -3px 0 var(--fire); }
.compare-table tbody th { text-align:left; background:rgba(0,0,0,.3); font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:.05em; font-size:.85rem; color:#fff; font-weight:400; padding:.9rem 1rem; }
.compare-table td { color:var(--bone); }
.compare-table .compare-yes { background:rgba(244,165,30,.1); color:#fff; font-weight:600; }
.compare-table .compare-yes b { color: var(--amber); }
.compare-table .compare-no { color:var(--bone); opacity:.55; }
.compare-table .compare-yes::before { content:"✓ "; color: var(--amber); font-weight:900; }
.compare-table .compare-no::before  { content:"✗ "; color: var(--steel-cool); font-weight:900; }

/* ============ STAMPEDE PRICE TABLE ============ */
.price-table { position:relative; background:var(--charcoal); padding:2rem 1.5rem; border:1px solid rgba(255,255,255,.08); box-shadow: var(--shadow-card); display:flex; flex-direction:column; }
.price-table--featured { border:2px solid var(--amber); background:linear-gradient(180deg, rgba(244,165,30,.08) 0%, rgba(0,0,0,.5) 100%); box-shadow: 0 0 60px rgba(244,165,30,.18), var(--shadow-card); }
.price-table__badge { position:absolute; top:-14px; right:1rem; background: var(--amber); color:#000; padding:.4rem .9rem; font-family:'Anton',sans-serif; font-size:.85rem; letter-spacing:.15em; text-transform:uppercase; box-shadow: 3px 3px 0 #000; }
.price-table__title { font-family:'Anton',sans-serif; text-transform:uppercase; font-size:2rem; letter-spacing:.04em; color:#fff; margin-bottom:1rem; padding-bottom:.75rem; border-bottom:1px solid rgba(255,255,255,.1); }
.price-table__list { list-style:none; padding:0; margin:0; flex:1; }
.price-table__list li { display:flex; justify-content:space-between; align-items:baseline; padding:.65rem 0; color:var(--bone); border-bottom:1px dashed rgba(255,255,255,.06); }
.price-table__list li:last-child { border-bottom:0; }
.price-table__list li b { color:#fff; font-family:'Anton',sans-serif; letter-spacing:.04em; font-size:1.15rem; }
.price-table__total { margin-top:.5rem; padding-top:1rem !important; border-top:1px solid rgba(255,255,255,.15) !important; border-bottom:0 !important; }
.price-table__total span { font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:.15em; color:#fff; font-size:1rem; }
.price-table__total b { font-size:2.25rem !important; color: var(--amber); }
.price-table--featured .price-table__total b { color: var(--amber); }

/* ============ SUBSCRIBE BOX ============ */
.subscribe-box { position:relative; padding:2.5rem 1.5rem; background:linear-gradient(135deg, var(--charcoal) 0%, #050505 100%); border:2px solid var(--amber); text-align:center; box-shadow: 0 0 60px rgba(244,165,30,.2), var(--shadow-card); }
.subscribe-box__badge { position:absolute; top:-15px; left:50%; transform:translateX(-50%); background: var(--amber); color:#000; padding:.45rem 1.1rem; font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:.2em; font-size:.85rem; box-shadow: 3px 3px 0 #000; }

/* ============ HOW SUBSCRIPTION WORKS ============ */
/* Fix: 5 items in 2 cols was producing stair-step. Use grid w/ explicit equal
   1fr columns + flex-baseline alignment per item. Item 5 sits in row 3 col 1
   (not centered, not full-width) so it visually aligns under item 1. */
.how-sub { background: var(--charcoal); border:1px solid rgba(255,255,255,.06); padding:2rem 1.5rem; box-shadow: var(--shadow-card); }
.how-sub__steps {
  list-style:none; padding:0; margin:0 auto; max-width:720px;
  display:grid; grid-template-columns:1fr; gap:12px;
}
@media (min-width:768px){
  .how-sub__steps { grid-template-columns: 1fr 1fr; grid-auto-rows: 1fr; }
}
.how-sub__steps li {
  display:flex; align-items:baseline; gap:.6rem;
  padding:1rem 1.25rem;
  background: rgba(255,255,255,.03);
  border-left: 3px solid var(--amber);
  color: var(--bone);
  min-height: 64px;
  line-height: 1.55;
}
.how-sub__steps b {
  color: var(--amber); flex-shrink: 0; min-width: 1.6rem;
  font-family:'Anton',sans-serif; font-size: 1.05rem;
  letter-spacing: .03em;
}
/* item 5 explicitly stays in column 1 (default behaviour, but make intent
   clear so it never accidentally centers or spans 2). */
.how-sub__steps li:nth-child(5) { grid-column: 1; }

/* ============ PROMISE / RISK REVERSAL ============ */
.promise-card {
  background: var(--charcoal); border:1px solid rgba(255,255,255,.06);
  border-top:3px solid var(--amber);
  padding:2rem 1.5rem; text-align:center;
  box-shadow: var(--shadow-card);
  transition: border-color .15s var(--easing), transform .2s var(--easing), box-shadow .2s var(--easing);
}
.promise-card:hover { border-top-color: var(--toxic); transform: translateY(-3px); box-shadow: var(--shadow-card-hover); }
.promise-card__num {
  font-family:'Anton',sans-serif; font-size:5rem; line-height:1;
  color: var(--amber); margin-bottom:.5rem;
  text-shadow:0 0 30px rgba(244,165,30,.45);
}
.promise-card h3 { font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:.06em; font-size:1.5rem; color:#fff; margin-bottom:.75rem; }
.promise-card p { color: var(--bone); line-height:1.65; }

/* ============ TESTIMONIALS ============ */
.testimonial {
  background: var(--charcoal); padding:1.5rem;
  border-top:3px solid var(--amber);
  border-left:1px solid rgba(255,255,255,.05);
  border-right:1px solid rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05);
  box-shadow: var(--shadow-card);
  display:flex; flex-direction:column; gap:.75rem;
  transition: transform .15s var(--easing), border-color .15s var(--easing), box-shadow .15s var(--easing);
}
.testimonial:hover { transform:translateY(-3px); border-top-color: var(--toxic); box-shadow: var(--shadow-card-hover); }
.testimonial__top { display:flex; justify-content:space-between; align-items:center; gap:.5rem; }
.stars { color: var(--amber); letter-spacing:.15em; font-size:1.1rem; }
.verified-badge { font-size:.65rem; text-transform:uppercase; letter-spacing:.15em; color: var(--amber); border:1px solid var(--amber); padding:.2rem .45rem; font-weight:700; }
.testimonial p { color:var(--bone); line-height:1.7; font-size:1rem; flex:1; }
.testimonial footer { font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:.12em; color:#fff; font-size:.85rem; border-top:1px solid rgba(255,255,255,.08); padding-top:.75rem; }

/* ============ SCIENCE CARDS ============ */
.science-card {
  background: var(--charcoal); padding:2rem 1.5rem;
  border:1px solid rgba(255,255,255,.06);
  box-shadow: var(--shadow-card);
  text-align:left; display:block; text-decoration:none; color:inherit;
  transition: border-color .15s var(--easing), background .15s var(--easing), transform .15s var(--easing), box-shadow .15s var(--easing);
}
.science-card:hover { border-color: var(--toxic); transform: translateY(-3px); box-shadow: var(--shadow-card-hover); }
.science-card__icon { width:56px; height:56px; background:rgba(196,255,0,.08); border:1px solid var(--toxic); display:flex; align-items:center; justify-content:center; margin-bottom:1rem; color: var(--toxic); }
.science-card__icon svg { width:28px; height:28px; }
.science-card h3 { font-family:'Anton',sans-serif; text-transform:uppercase; font-size:1.5rem; letter-spacing:.05em; color:#fff; margin-bottom:.75rem; }
.science-card p { color:var(--bone); line-height:1.7; font-size:.98rem; }

/* ============ FAQ ============ */
.faq__item { border:1px solid rgba(255,255,255,.06); background: var(--charcoal); margin-bottom:.5rem; transition: border-color .15s var(--easing), box-shadow .15s var(--easing); }
.faq__item[open] { border-color: var(--amber); box-shadow: 0 0 0 1px rgba(244,165,30,.25); }
.faq__q { display:flex; justify-content:space-between; align-items:center; gap:1rem; cursor:pointer; padding:1.15rem 1.25rem; font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:.06em; font-size:1.1rem; color:#fff; list-style:none; user-select:none; }
.faq__q::-webkit-details-marker { display:none; }
.faq__chev { color: var(--amber); font-family:'Anton',sans-serif; font-size:1.5rem; line-height:1; transition: transform .2s var(--easing); flex-shrink: 0; }
.faq__item[open] .faq__chev { transform: rotate(45deg); }
.faq__a { padding:0 1.25rem 1.25rem; color: var(--bone); line-height:1.75; }

/* ============ FOOTER ============ */
.footer__title { font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:.12em; color:#fff; font-size:1.1rem; margin-bottom:1rem; }
.footer__links { list-style:none; padding:0; margin:0; }
.footer__links li { padding:.25rem 0; }
.footer__links a { color:var(--bone); transition:color .15s var(--easing); font-size:.95rem; }
.footer__links a:hover { color:var(--fire); }
.newsletter { display:flex; gap:0; }
.newsletter__input { flex:1; min-width:0; background:var(--steel); border:1px solid rgba(255,255,255,.1); padding:.85rem 1rem; color:#fff; font-family:inherit; outline:none; }
.newsletter__input:focus { border-color: var(--fire); }
.newsletter__btn { border-left:0; }

/* ============ MODALS ============ */
.modal { position:fixed; inset:0; z-index:200; display:flex; align-items:center; justify-content:center; padding:1rem; }
.modal[hidden] { display:none; }
.modal__backdrop { position:absolute; inset:0; background:rgba(0,0,0,.85); backdrop-filter:blur(4px); }
.modal__panel { position:relative; background:linear-gradient(135deg, var(--steel) 0%, #050505 100%); border:2px solid var(--fire); padding:2rem 1.5rem; max-width:480px; width:100%; box-shadow: var(--shadow-blood); animation:modal-in .25s var(--easing); }
.modal__panel--wide { max-width:600px; }
@keyframes modal-in { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
.modal__close { position:absolute; top:.5rem; right:.5rem; background:none; border:0; color:#fff; font-size:1.75rem; line-height:1; padding:.5rem; cursor:pointer; }
.modal__close:hover { color: var(--fire); }

/* ============ QUIZ ============ */
.quiz__progress { height:4px; background:rgba(255,255,255,.08); margin-bottom:1.5rem; overflow:hidden; }
.quiz__progress-bar { height:100%; background:var(--fire); width:0%; transition:width .25s var(--easing); }
.quiz__q { font-family:'Anton',sans-serif; font-size:1.5rem; text-transform:uppercase; letter-spacing:.05em; color:#fff; margin-bottom:1.5rem; }
.quiz__options { display:flex; flex-direction:column; gap:.5rem; }
.quiz__options button { background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.15); color:#fff; padding:1rem 1.25rem; text-align:left; font:inherit; cursor:pointer; transition:all .15s var(--easing); font-weight:500; }
.quiz__options button:hover, .quiz__options button:focus { background:rgba(214,40,40,.15); border-color: var(--fire); color: var(--fire); }
.quiz__form { display:flex; flex-direction:column; gap:.5rem; }
.quiz__discount { padding:1rem; background:rgba(244,196,48,.08); border:1px dashed var(--warn); text-align:center; }
.quiz__code { display:inline-block; font-family:'Anton',sans-serif; font-size:1.75rem; letter-spacing:.2em; color: var(--warn); padding:.25rem .75rem; background:#000; border:1px solid var(--warn); }

/* ============ STICKY CART (mobile) ============ */
.sticky-cart { position:fixed; bottom:0; left:0; right:0; z-index:80; display:flex; align-items:center; gap:.75rem; padding:.5rem .75rem; background:#000; border-top:2px solid var(--fire); box-shadow:0 -4px 20px rgba(0,0,0,.6); transform:translateY(100%); transition:transform .25s var(--easing); }
.sticky-cart[hidden] { display:none; }
.sticky-cart.show { transform:translateY(0); }
.sticky-cart__img { width:44px; height:44px; object-fit:contain; flex-shrink:0; }
.sticky-cart__info { flex:1; min-width:0; }
.sticky-cart__title { font-family:'Anton',sans-serif; font-size:.95rem; text-transform:uppercase; letter-spacing:.06em; color:#fff; line-height:1; margin-bottom:.15rem; }
.sticky-cart__price { font-family:'Anton',sans-serif; color: var(--fire); font-size:1.05rem; line-height:1; }
.sticky-cart__btn { padding:.7rem 1rem; font-size:.9rem; }
@media (min-width:1024px) { .sticky-cart { display:none !important; } }

/* ============ SOCIAL PROOF POPUP ============ */
.social-proof { position:fixed; left:1rem; bottom:1rem; z-index:70; max-width:320px; background:#0a0a0a; border:1px solid var(--blood); padding:.75rem .9rem; display:flex; gap:.75rem; align-items:center; box-shadow:0 8px 30px rgba(0,0,0,.6); transform:translateX(-120%); transition:transform .35s var(--easing); }
.social-proof[hidden] { display:none; }
.social-proof.show { transform:translateX(0); }
.social-proof__icon { color: var(--fire); flex-shrink:0; }
.social-proof__icon svg { width:32px; height:32px; }
.social-proof__msg { font-size:.85rem; color:#fff; font-weight:600; margin-bottom:.15rem; line-height:1.3; }
.social-proof__time { font-size:.7rem; color:var(--bone); opacity:.7; text-transform:uppercase; letter-spacing:.1em; }
@media (max-width:767px){ .social-proof { display:none !important; } .sticky-cart { padding-bottom: max(.5rem, env(safe-area-inset-bottom)); } }

/* ============ CHAT LAUNCHER ============ */
.chat-launcher { position:fixed; bottom:1rem; right:1rem; z-index:70; display:inline-flex; align-items:center; gap:.5rem; background: var(--fire); color:#000; padding:.7rem 1rem; border:0; cursor:pointer; font-family:'Anton',sans-serif; text-transform:uppercase; letter-spacing:.1em; font-size:.85rem; box-shadow:0 6px 20px rgba(0,0,0,.5); transition:background .15s, transform .15s; clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px); }
.chat-launcher:hover { background:#fff; }
.chat-launcher__label { display:none; }
@media (min-width:1024px){ .chat-launcher__label { display:inline; } .chat-launcher { bottom: 1.5rem; right: 1.5rem; padding:.8rem 1.2rem; } }
@media (max-width:767px){ .chat-launcher { bottom: calc(60px + env(safe-area-inset-bottom)); padding:.6rem; } .chat-launcher svg { width:20px; height:20px; } }

/* ============ MEDIA QUERIES ============ */
@media (max-width: 640px) {
  .product-img-wrap { min-height:320px; }
  .price-table { padding:1.5rem 1.25rem; }
  .ingredient-box { padding:1.25rem 1rem; }
}

/* ============ ARTICLE / CONTENT PAGES ============ */
.article-prose { color: var(--bone); font-size:1.05rem; line-height:1.8; max-width:720px; margin:0 auto; }
.article-prose h1 { font-family:'Anton',sans-serif; color:#fff; font-size:2.5rem; line-height:1.05; text-transform:uppercase; letter-spacing:.02em; margin-bottom:1rem; }
@media (min-width:768px){ .article-prose h1 { font-size:3.5rem; } }
.article-prose h2 { font-family:'Anton',sans-serif; color:#fff; font-size:1.75rem; text-transform:uppercase; letter-spacing:.04em; margin:2.5rem 0 1rem; padding-bottom:.5rem; border-bottom:1px solid rgba(160,24,24,.4); }
.article-prose h3 { font-family:'Anton',sans-serif; color: var(--fire); font-size:1.25rem; text-transform:uppercase; letter-spacing:.05em; margin:1.5rem 0 .75rem; }
.article-prose p { margin-bottom:1rem; }
.article-prose a { color: var(--fire); text-decoration:underline; text-underline-offset:3px; }
.article-prose a:hover { color:#fff; }
.article-prose ul, .article-prose ol { padding-left:1.5rem; margin-bottom:1rem; }
.article-prose li { margin-bottom:.4rem; }
.article-prose blockquote { border-left:3px solid var(--fire); padding:.5rem 1rem; color:#fff; font-style:italic; margin:1.5rem 0; background:rgba(160,24,24,.05); }
.article-prose code { background:#000; color: var(--warn); padding:.1rem .4rem; font-size:.9em; }
.article-meta { color:var(--bone); opacity:.7; font-size:.85rem; text-transform:uppercase; letter-spacing:.1em; margin-bottom:1.5rem; }
.article-cta { margin: 2.5rem 0; padding: 1.5rem; background:linear-gradient(135deg, var(--steel) 0%, #050505 100%); border:1px solid var(--fire); text-align:center; }

/* ============ GEO SUGGESTION BANNER ============ */
.geo-banner {
  display: flex; align-items: center; gap: .75rem;
  padding: .65rem 1rem;
  background: #1a1a1a;
  border-bottom: 1px solid var(--blood);
  color: #fff; font-size: .85rem;
  position: relative;
  transform: translateY(-100%);
  animation: geo-slide-in .35s var(--easing) .3s forwards;
}
.geo-banner[hidden] { display: none !important; }
@keyframes geo-slide-in { to { transform: translateY(0); } }
.geo-banner__flag { font-size: 1.5rem; line-height: 1; flex-shrink: 0; }
.geo-banner__text { flex: 1; min-width: 0; }
.geo-banner__text > span { display: inline; }
.geo-banner__text [data-geo-title] { font-weight: 600; margin-right: .25rem; }
.geo-banner__text [data-geo-question] { color: var(--bone); }
.geo-banner__actions { display: flex; gap: .4rem; flex-shrink: 0; }
.geo-banner__btn {
  padding: .35rem .7rem; border: 1px solid var(--fire); background: transparent;
  color: #fff; font-size: .75rem; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase; cursor: pointer; transition: all .12s linear;
  font-family: inherit;
}
.geo-banner__btn--primary { background: var(--fire); color: #000; }
.geo-banner__btn--primary:hover { background: #fff; border-color: #fff; }
.geo-banner__btn--ghost:hover { background: rgba(255,255,255,.08); }
.geo-banner__close {
  background: none; border: 0; color: var(--bone); font-size: 1.4rem;
  line-height: 1; padding: .25rem .5rem; cursor: pointer; flex-shrink: 0;
}
.geo-banner__close:hover { color: var(--fire); }
@media (max-width: 640px) {
  .geo-banner { flex-wrap: wrap; padding: .65rem .75rem; }
  .geo-banner__text { flex-basis: 100%; order: 2; font-size: .8rem; }
  .geo-banner__actions { flex-basis: 100%; order: 3; justify-content: stretch; }
  .geo-banner__btn { flex: 1; }
}

/* ============ CURRENCY SWITCHER ============ */
.curr-switcher .lang-switcher__menu { right: 0; min-width: 110px; }

/* ============ SHIPPING NOTE under product CTAs ============ */
.ship-note {
  margin-top: .5rem; font-size: .8rem; color: var(--bone); opacity: .7;
  letter-spacing: .04em;
}
.ship-note:empty { display: none; }

/* breadcrumbs */
.breadcrumbs { font-size:.8rem; color: var(--bone); text-transform:uppercase; letter-spacing:.1em; margin-bottom:1rem; }
.breadcrumbs a { color: var(--bone); }
.breadcrumbs a:hover { color: var(--fire); }
.breadcrumbs span[aria-current] { color: var(--fire); }

/* article hero */
.article-hero { background:linear-gradient(180deg, #0a0a0a 0%, #000 100%); padding:4rem 0 3rem; border-bottom:1px solid rgba(160,24,24,.3); }

/* ============ SECTION DIVIDERS ============ */
/* Pattern A: hazard stripe — between problem → solution */
.divider--hazard {
  height: 24px; width: 100%;
  background: repeating-linear-gradient(45deg, #000 0 20px, var(--amber) 20px 40px);
  border-top: 1px solid #000; border-bottom: 1px solid #000;
}
/* Pattern B: red gradient line — between products → Stampede */
.divider--gradient {
  height: 6px; width: 100%;
  background: linear-gradient(90deg, transparent 0%, var(--fire) 50%, transparent 100%);
}
/* Pattern C: tactical bracket frame — top corners of major sections */
.bracket-frame { position: relative; }
.bracket-frame::before, .bracket-frame::after {
  content: ""; position: absolute; top: 16px; width: 80px; height: 40px;
  border-color: var(--amber); border-style: solid; pointer-events: none;
}
.bracket-frame::before { left: 16px; border-width: 3px 0 0 3px; }
.bracket-frame::after  { right: 16px; border-width: 3px 3px 0 0; }
@media (max-width: 640px) {
  .bracket-frame::before, .bracket-frame::after { width: 40px; height: 24px; top: 8px; }
  .bracket-frame::before { left: 8px; } .bracket-frame::after { right: 8px; }
}
/* Pattern D: massive number watermark — behind product copy */
/* CRITICAL: overflow:hidden so the absolute-positioned __num at 28vw, right:-2%
   never pushes the page width on mobile (was causing horizontal scroll). */
.watermark { position: relative; overflow: hidden; }
.watermark__num {
  position: absolute; top: 8%; right: 0;
  font-family: 'Anton', sans-serif; font-size: 22vw; line-height: .85;
  color: #2a2a2a; letter-spacing: -.04em;
  pointer-events: none; user-select: none; z-index: 0;
  opacity: .55;
  max-width: 90vw;
}
.watermark > * { position: relative; z-index: 1; }
@media (min-width: 1024px) { .watermark__num { font-size: 22rem; top: 4%; max-width: none; } }

/* ============ SCROLL FADE-UP — initial state, JS toggles .in-view ============ */
.fade-up {
  opacity: 0; transform: translateY(20px);
  transition: opacity .55s var(--easing), transform .55s var(--easing);
}
.fade-up.in-view { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  .fade-up { opacity: 1; transform: none; transition: none; }
}

/* ============ ADD-TO-CART success "+1" rise ============ */
.flash-plus-one {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  font-family: 'Anton', sans-serif; font-size: 1.4rem; color: var(--amber);
  pointer-events: none; opacity: 0;
  text-shadow: 0 0 12px rgba(244,165,30,.6);
}
.flash-plus-one.go { animation: plus-one-rise .9s var(--easing) forwards; }
@keyframes plus-one-rise {
  0%   { opacity: 0; transform: translate(-50%, 0); }
  20%  { opacity: 1; }
  100% { opacity: 0; transform: translate(-50%, -56px); }
}
.btn-primary.flash {
  background: var(--gradient-fire) !important;
  box-shadow: 0 0 0 4px rgba(244,165,30,.35), 4px 4px 0 #000 !important;
}

/* ============ Section bg utility (alternation hint) ============ */
.bg-graphite { background-color: var(--graphite) !important; }
.bg-charcoal { background-color: var(--charcoal) !important; }