@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@300;400;500;600&family=DM+Mono:wght@400;500&display=swap');

/* ============ TOKENS ============ */
:root {
  --black: #0A0A0A;
  --black-card: #111111;
  --black-border: #222222;
  --white: #F5F3EF;
  --white-dim: rgba(245,243,239,0.65);
  --cobalt: #2563EB;
  --cobalt-light: rgba(37,99,235,0.12);
  --cobalt-mid: rgba(37,99,235,0.4);
  --gray-text: #AAAAAA;
  --gray-border: #2A2A2A;

  --font-heading: 'Syne', sans-serif;
  --font-body: 'Plus Jakarta Sans', sans-serif;
  --font-mono: 'DM Mono', monospace;
}

/* ============ RESET / BASE ============ */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }

html { scroll-behavior: smooth; }

body {
  background: var(--black);
  color: var(--white);
  font-family: var(--font-body);
  font-weight: 300;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

::selection { background: var(--cobalt); color: var(--white); }

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }

.container { width: min(1240px, 92vw); margin: 0 auto; }

/* ============ GRAIN OVERLAY ============ */
.grain-overlay {
  position: fixed; inset: 0; pointer-events: none; z-index: 9999; opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============ NAV ============ */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  background: transparent;
  transition: background 0.4s ease, backdrop-filter 0.4s ease, border-color 0.4s ease;
  border-bottom: 1px solid transparent;
}
.nav.scrolled {
  background: rgba(10,10,10,0.95);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-bottom-color: var(--black-border);
}
.nav-inner {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 0;
}
.nav-logo {
  font-family: var(--font-heading); font-weight: 800; font-size: 24px;
  color: var(--cobalt); letter-spacing: 0.06em;
}
.nav-links { display: flex; gap: 36px; align-items: center; }
.nav-links a {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: 0.04em;
  color: var(--white-dim); transition: color 0.25s ease;
}
.nav-links a:hover { color: var(--white); }
.nav-cta {
  background: var(--cobalt); color: #fff; border: none;
  font-family: var(--font-mono); font-size: 13px; font-weight: 500;
  padding: 10px 22px; border-radius: 6px; letter-spacing: 0.04em;
  transition: background 0.25s ease, transform 0.25s ease;
}
.nav-cta:hover { background: #1d4fd6; transform: translateY(-1px); }

@media (max-width: 760px) {
  .nav-links a:not(.nav-cta) { display: none; }
}

/* ============ HERO ============ */
.hero {
  position: relative; min-height: 100vh;
  display: flex; align-items: center; justify-content: center;
  background: var(--black); overflow: hidden;
}
.hero-bg {
  position: absolute; inset: 0; z-index: 0;
}
.hero-bg img {
  width: 100%; height: 100%; object-fit: cover; opacity: 0.35;
}
.hero-bg::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(10,10,10,0.3) 0%, rgba(10,10,10,0.1) 40%, rgba(10,10,10,0.95) 100%);
}
.hero-content {
  position: relative; z-index: 1; text-align: center; padding: 120px 24px 80px;
}
.hero-kicker {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: 0.28em;
  text-transform: uppercase; color: var(--cobalt); margin-bottom: 28px;
}
.hero-title {
  font-family: var(--font-heading); font-weight: 800;
  font-size: clamp(48px, 8vw, 120px);
  line-height: 1.02; color: var(--white); letter-spacing: -0.01em;
  margin-bottom: 28px;
}
.hero-title .char { display: inline-block; will-change: transform, opacity; }
.hero-sub {
  font-size: clamp(16px, 2vw, 20px); color: var(--white-dim);
  max-width: 560px; margin: 0 auto 52px; font-weight: 300;
}
.hero-stats {
  display: flex; align-items: center; justify-content: center; gap: 0;
  flex-wrap: wrap;
}
.hero-stat {
  font-family: var(--font-mono); font-size: 14px; color: var(--white-dim);
  padding: 0 32px; letter-spacing: 0.03em;
}
.hero-stat strong { color: var(--white); font-weight: 500; }
.hero-stat + .hero-stat { border-left: 1px solid var(--cobalt-mid); }
@media (max-width: 640px) {
  .hero-stat { padding: 6px 16px; }
  .hero-stat + .hero-stat { border-left: none; }
}
.scroll-indicator {
  position: absolute; bottom: 36px; left: 50%; transform: translateX(-50%);
  z-index: 2; color: var(--cobalt);
  animation: bob 2s ease-in-out infinite;
}
@keyframes bob {
  0%, 100% { transform: translate(-50%, 0); opacity: 1; }
  50% { transform: translate(-50%, 10px); opacity: 0.5; }
}

/* ============ HERO PROOF PILL ============ */
.hero-proof {
  display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap;
  justify-content: center;
  background: rgba(37,99,235,0.10); border: 1px solid var(--cobalt-mid);
  border-radius: 100px; padding: 8px 22px; margin-bottom: 32px;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.08em;
  color: var(--white-dim); text-transform: uppercase;
}
.hero-proof strong { color: var(--cobalt); font-weight: 500; }
.hero-proof .hp-dot { color: var(--cobalt-mid); }

/* ============ HERO CTAS ============ */
.hero-ctas {
  display: flex; align-items: center; justify-content: center;
  gap: 20px; flex-wrap: wrap; margin-bottom: 52px;
}
.btn-hero-primary {
  background: var(--cobalt); color: #fff;
  font-family: var(--font-mono); font-size: 13px; font-weight: 500;
  padding: 14px 32px; border-radius: 6px; letter-spacing: 0.06em;
  transition: background 0.25s ease, transform 0.25s ease;
  display: inline-block;
}
.btn-hero-primary:hover { background: #1d4fd6; transform: translateY(-2px); }
.btn-hero-secondary {
  color: var(--white-dim); font-family: var(--font-mono); font-size: 13px;
  letter-spacing: 0.06em;
  border-bottom: 1px solid var(--cobalt-mid); padding-bottom: 2px;
  transition: color 0.25s ease, border-color 0.25s ease;
  display: inline-block;
}
.btn-hero-secondary:hover { color: var(--white); border-color: var(--cobalt); }

/* ============ TICKER ============ */
.ticker {
  border-top: 1px solid var(--black-border);
  border-bottom: 1px solid var(--black-border);
  padding: 18px 0; overflow: hidden; white-space: nowrap;
  background: var(--black);
}
.ticker-track {
  display: inline-flex; will-change: transform;
  animation: marquee 40s linear infinite;
}
.ticker-item {
  font-family: var(--font-mono); font-size: 13px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--gray-text);
  padding-right: 12px;
}
.ticker-item .dot { color: var(--cobalt); padding-left: 12px; }
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ============ SECTION SHELL ============ */
.section { padding: 120px 0; position: relative; }
.section-label {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.28em;
  text-transform: uppercase; color: var(--cobalt); margin-bottom: 18px;
}
.section-heading {
  font-family: var(--font-heading); font-weight: 700;
  font-size: clamp(34px, 4.6vw, 60px); line-height: 1.08;
  color: var(--white); margin-bottom: 20px;
}
.section-sub {
  color: var(--gray-text); max-width: 560px; font-size: 16px; margin-bottom: 64px;
}

/* ============ PRODUCTS ============ */
.products-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;
}
@media (max-width: 1080px) { .products-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .products-grid { grid-template-columns: 1fr; } }

.product-card {
  background: var(--black-card);
  border: 1px solid var(--black-border);
  border-radius: 8px; overflow: hidden;
  display: flex; flex-direction: column;
  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
  will-change: transform, opacity;
}
.product-card:hover {
  transform: translateY(-2px);
  border-color: var(--cobalt-mid);
  box-shadow: 0 0 0 1px var(--cobalt-light), 0 24px 48px -24px rgba(37,99,235,0.25);
}
.product-card.is-featured {
  border-color: var(--cobalt-mid);
  box-shadow: 0 0 0 1px var(--cobalt-light);
}
.card-media {
  position: relative; aspect-ratio: 4 / 3; overflow: hidden;
}
.card-media img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform 0.6s ease;
}
.product-card:hover .card-media img { transform: scale(1.04); }
.card-media::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(10,10,10,0.15) 0%, rgba(10,10,10,0.45) 100%);
}
.product-card.is-out .card-media img { filter: grayscale(0.7) brightness(0.7); }
.card-badges {
  position: absolute; top: 12px; left: 12px; z-index: 2;
  display: flex; gap: 6px; flex-wrap: wrap;
}
.badge {
  font-family: var(--font-mono); font-size: 12px; font-weight: 500;
  letter-spacing: 0.1em; text-transform: uppercase;
  padding: 5px 10px; border-radius: 4px;
}
.badge-cobalt { background: var(--cobalt); color: #fff; }
.badge-gray {
  background: rgba(10,10,10,0.75); color: var(--white-dim);
  border: 1px solid var(--gray-border);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.card-body {
  padding: 22px 20px 24px; display: flex; flex-direction: column; flex: 1;
}
.card-ingredients {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--gray-text); margin-bottom: 10px;
}
.card-name {
  font-family: var(--font-heading); font-weight: 600; font-size: 21px;
  color: var(--white); margin-bottom: 6px;
}
.card-micro { font-size: 14px; color: var(--gray-text); margin-bottom: 14px; }
.card-benefits {
  list-style: none; margin-bottom: 18px;
}
.card-benefits li {
  font-family: var(--font-mono); font-size: 12px; color: var(--white-dim);
  padding: 3px 0 3px 16px; position: relative; letter-spacing: 0.02em;
}
.card-benefits li::before {
  content: '+'; position: absolute; left: 0; color: var(--cobalt); font-weight: 500;
}
.card-footer {
  margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  flex-wrap: wrap;
}
.card-price {
  font-family: var(--font-mono); font-size: 19px; font-weight: 500; color: var(--white);
}
.card-price span { font-size: 12px; color: var(--gray-text); margin-left: 3px; }
.btn-cart {
  background: var(--cobalt); color: #fff; border: none;
  font-family: var(--font-mono); font-size: 12px; font-weight: 500;
  padding: 11px 18px; border-radius: 6px; letter-spacing: 0.04em;
  transition: background 0.25s ease, transform 0.25s ease; white-space: nowrap;
}
.btn-cart:hover { background: #1d4fd6; transform: translateY(-1px); }
.btn-notify {
  background: transparent; color: var(--white-dim);
  border: 1px solid var(--gray-border);
  font-family: var(--font-mono); font-size: 12px; font-weight: 500;
  padding: 10px 18px; border-radius: 6px; letter-spacing: 0.04em;
  transition: border-color 0.25s ease, color 0.25s ease; white-space: nowrap;
}
.btn-notify:hover { border-color: var(--cobalt); color: var(--white); }
.btn-view {
  display: inline-block; font-family: var(--font-mono); font-size: 12px;
  color: var(--cobalt); letter-spacing: 0.08em; text-transform: uppercase;
  border-bottom: 1px solid var(--cobalt-mid); padding-bottom: 1px;
  transition: border-color 0.2s ease; margin-top: 4px; white-space: nowrap;
}
.btn-view:hover { border-color: var(--cobalt); }

/* ============ SCIENCE ============ */
.science { overflow: hidden; background: var(--black); }
.science-bg {
  position: absolute; left: 0; right: 0; top: -15%; height: 130%;
  z-index: 0; will-change: transform;
}
.science-bg img {
  width: 100%; height: 100%; object-fit: cover; opacity: 0.15;
}
.science .container { position: relative; z-index: 1; }
.science-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
}
@media (max-width: 900px) { .science-grid { grid-template-columns: 1fr; } }
.science-card {
  background: var(--black-card);
  border: 1px solid var(--black-border);
  border-top: 2px solid var(--cobalt);
  border-radius: 8px; padding: 32px 28px;
}
.science-card .sc-label {
  font-family: var(--font-mono); font-size: 13px; font-weight: 500;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--cobalt);
  margin-bottom: 14px;
}
.science-card p { color: var(--white-dim); font-size: 15px; }

/* ============ STACK BUILDER ============ */
.stacks { background: var(--black); border-top: 1px solid var(--black-border); }
.stack-row {
  display: flex; align-items: center; justify-content: center;
  gap: clamp(12px, 3vw, 32px); margin: 56px 0 44px; flex-wrap: wrap;
}
.stack-thumb {
  width: clamp(140px, 20vw, 240px); text-align: center;
}
.stack-thumb .thumb-img {
  aspect-ratio: 1 / 1; border-radius: 8px; overflow: hidden;
  border: 1px solid var(--black-border); position: relative; margin-bottom: 14px;
}
.stack-thumb .thumb-img img { width: 100%; height: 100%; object-fit: cover; }
.stack-thumb .thumb-img::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(10,10,10,0.6) 100%);
}
.stack-thumb .thumb-name {
  font-family: var(--font-heading); font-weight: 600; font-size: 16px; color: var(--white);
}
.stack-thumb .thumb-ing {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--gray-text); margin-top: 2px;
}
.stack-plus {
  font-family: var(--font-heading); font-weight: 700;
  font-size: clamp(24px, 3vw, 40px); color: var(--cobalt);
}
.stack-link {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-mono); font-size: 14px; letter-spacing: 0.06em;
  color: var(--cobalt); transition: gap 0.25s ease;
}
.stack-link:hover { gap: 14px; }
.stacks .center { text-align: center; }
.stacks .section-sub { margin-left: auto; margin-right: auto; margin-bottom: 0; }

/* ============ TESTIMONIALS ============ */
.reviews { background: #141414; border-top: 1px solid var(--black-border); border-bottom: 1px solid var(--black-border); }
.reviews-stats {
  display: flex; gap: 0; flex-wrap: wrap; margin-bottom: 64px;
}
.reviews-stats .r-stat {
  font-family: var(--font-mono); font-size: 14px; color: var(--white-dim);
  padding: 0 28px; letter-spacing: 0.03em;
}
.reviews-stats .r-stat:first-child { padding-left: 0; }
.reviews-stats .r-stat strong { color: var(--white); font-weight: 500; }
.reviews-stats .r-stat + .r-stat { border-left: 1px solid var(--cobalt-mid); }
@media (max-width: 640px) {
  .reviews-stats .r-stat { padding: 6px 0; width: 100%; }
  .reviews-stats .r-stat + .r-stat { border-left: none; }
}
.carousel {
  display: flex; gap: 20px; overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 20px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin; scrollbar-color: var(--gray-border) transparent;
}
.carousel::-webkit-scrollbar { height: 4px; }
.carousel::-webkit-scrollbar-thumb { background: var(--gray-border); border-radius: 2px; }
.review-card {
  scroll-snap-align: start; flex: 0 0 min(420px, 82vw);
  background: var(--black-card); border: 1px solid var(--black-border);
  border-radius: 8px; padding: 44px 32px 32px; position: relative; overflow: hidden;
}
.review-card .quote-mark {
  position: absolute; top: -18px; left: 14px;
  font-family: var(--font-heading); font-weight: 800; font-size: 140px;
  color: var(--cobalt); opacity: 0.10; line-height: 1; pointer-events: none;
}
.review-card blockquote {
  font-size: 16.5px; color: var(--white); font-weight: 300;
  line-height: 1.65; margin-bottom: 24px; position: relative; z-index: 1;
}
.review-card cite {
  font-family: var(--font-mono); font-style: normal; font-size: 12.5px;
  letter-spacing: 0.08em; color: var(--gray-text); text-transform: uppercase;
}
.review-card .stars { color: var(--cobalt); font-size: 13px; letter-spacing: 3px; margin-bottom: 16px; }

/* ============ TRUST ============ */
.trust { background: linear-gradient(180deg, #0A0A0A 0%, #111111 100%); }
.trust-grid {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;
}
@media (max-width: 720px) { .trust-grid { grid-template-columns: 1fr; } }
.trust-card {
  border: 1px solid var(--black-border); border-radius: 8px;
  padding: 40px 36px; background: rgba(17,17,17,0.5);
}
.trust-card .t-num {
  font-family: var(--font-mono); font-size: 12px; color: var(--cobalt);
  letter-spacing: 0.2em; margin-bottom: 16px;
}
.trust-card h3 {
  font-family: var(--font-heading); font-weight: 600; font-size: 22px;
  color: var(--white); margin-bottom: 8px;
}
.trust-card p { color: var(--gray-text); font-size: 15px; }

/* ============ TRUST STRIP ============ */
.trust-strip {
  background: var(--black); border-bottom: 1px solid var(--black-border);
  padding: 0;
}
.trust-strip-items {
  display: flex; align-items: stretch; justify-content: center;
  flex-wrap: wrap;
}
.ts-item {
  display: flex; align-items: center; gap: 9px;
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.1em;
  color: var(--white-dim); padding: 16px 28px;
  text-transform: uppercase; white-space: nowrap;
}
.ts-item + .ts-item { border-left: 1px solid var(--black-border); }
.ts-icon { color: var(--cobalt); font-style: normal; font-size: 15px; line-height: 1; }
@media (max-width: 900px) { .ts-item { padding: 14px 18px; font-size: 12px; } }
@media (max-width: 600px) {
  .ts-item { width: 50%; padding: 12px 16px; border-left: none !important; }
  .ts-item:nth-child(even) { border-left: 1px solid var(--black-border) !important; }
}

/* ============ PER-DAY + CARD TRUST ============ */
.card-per-day {
  display: block; font-size: 12px; font-family: var(--font-mono);
  color: var(--gray-text); letter-spacing: 0.05em; margin-top: 3px;
}
.card-trust {
  display: flex; gap: 14px; padding-top: 12px;
  border-top: 1px solid var(--black-border); margin-top: 12px; flex-wrap: wrap;
}
.card-trust span {
  font-family: var(--font-mono); font-size: 12px; color: var(--gray-text); letter-spacing: 0.05em;
}

/* ============ FAQ ============ */
.faq { background: #0C0C0C; border-top: 1px solid var(--black-border); }
.faq-list { max-width: 800px; }
.faq-item { border-bottom: 1px solid var(--black-border); }
.faq-q {
  width: 100%; background: none; border: none; color: var(--white);
  font-family: var(--font-heading); font-weight: 500; font-size: 17px; text-align: left;
  padding: 22px 0; cursor: pointer;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  transition: color 0.25s ease;
}
.faq-q:hover { color: var(--cobalt); }
.faq-chevron { color: var(--cobalt); font-size: 20px; transition: transform 0.3s ease; flex-shrink: 0; }
.faq-q[aria-expanded="true"] .faq-chevron { transform: rotate(180deg); }
.faq-a {
  font-size: 15px; color: var(--white-dim); line-height: 1.75;
  max-height: 0; overflow: hidden; transition: max-height 0.38s ease, padding-bottom 0.38s ease;
}
.faq-a.open { max-height: 500px; padding-bottom: 22px; }

/* ============ MOBILE STICKY CTA ============ */
.sticky-cta {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 900;
  background: rgba(17,17,17,0.97); border-top: 1px solid var(--cobalt-mid);
  padding: 14px 20px; display: none; align-items: center;
  justify-content: space-between; gap: 14px;
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  transform: translateY(100%); transition: transform 0.4s ease;
}
.sticky-cta.visible { transform: translateY(0); }
.sticky-cta-label {
  font-family: var(--font-mono); font-size: 12px; color: var(--white-dim); letter-spacing: 0.04em;
}
.sticky-cta-label strong { display: block; color: var(--white); font-size: 14px; letter-spacing: 0; }
.sticky-cta-btn {
  background: var(--cobalt); color: #fff; border: none; flex-shrink: 0;
  font-family: var(--font-mono); font-size: 12px; font-weight: 500;
  padding: 12px 20px; border-radius: 6px; letter-spacing: 0.05em; cursor: pointer;
  transition: background 0.25s ease;
}
.sticky-cta-btn:hover { background: #1d4fd6; }
@media (max-width: 760px) { .sticky-cta { display: flex; } }

/* ============ FOOTER ============ */
.footer {
  background: var(--black); border-top: 1px solid var(--black-border);
  padding: 72px 0 40px;
}
.footer-top {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 32px; flex-wrap: wrap; margin-bottom: 56px;
}
.footer-logo {
  font-family: var(--font-heading); font-weight: 800; font-size: 28px;
  color: var(--cobalt); letter-spacing: 0.06em;
}
.footer-tag {
  font-family: var(--font-mono); font-size: 12px; color: var(--gray-text);
  margin-top: 8px; letter-spacing: 0.06em;
}
.footer-nav { display: flex; gap: 60px; flex-wrap: wrap; }
.footer-nav-col h4 {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--cobalt); margin-bottom: 16px;
}
.footer-nav-col a {
  display: block; font-family: var(--font-mono); font-size: 13px;
  color: var(--white-dim); letter-spacing: 0.03em; margin-bottom: 10px;
  transition: color 0.2s ease;
}
.footer-nav-col a:hover { color: var(--white); }
.footer-links { display: flex; gap: 32px; flex-wrap: wrap; }
.footer-links a {
  font-family: var(--font-mono); font-size: 13px; color: var(--white-dim);
  letter-spacing: 0.04em; transition: color 0.25s ease;
}
.footer-links a:hover { color: var(--white); }
.footer-legal {
  border-top: 1px solid var(--black-border); padding-top: 28px;
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
.footer-legal p {
  font-family: var(--font-mono); font-size: 12px; color: var(--gray-text);
  letter-spacing: 0.03em;
}

/* ============ PDP — PRODUCT DETAIL PAGES ============ */
.pdp-hero {
  min-height: 100vh; display: flex; align-items: center;
  position: relative; overflow: hidden; background: var(--black);
}
.pdp-hero-bg { position: absolute; inset: 0; z-index: 0; }
.pdp-hero-bg img { width: 100%; height: 100%; object-fit: cover; opacity: 0.25; }
.pdp-hero-bg::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(10,10,10,0.92) 0%, rgba(10,10,10,0.7) 50%, rgba(10,10,10,0.4) 100%);
}
.pdp-hero-content {
  position: relative; z-index: 1; padding: 160px 0 100px;
  display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
}
@media (max-width: 860px) {
  .pdp-hero-content { grid-template-columns: 1fr; gap: 48px; padding: 140px 0 80px; }
}
.pdp-breadcrumb {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.14em;
  color: var(--gray-text); text-transform: uppercase; margin-bottom: 20px;
}
.pdp-breadcrumb a { color: var(--cobalt); transition: color 0.2s ease; }
.pdp-breadcrumb a:hover { color: var(--white); }
.pdp-breadcrumb span { margin: 0 8px; color: var(--gray-border); }
.pdp-ingredients-label {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--cobalt); margin-bottom: 18px;
}
.pdp-title {
  font-family: var(--font-heading); font-weight: 800;
  font-size: clamp(44px, 6vw, 88px); line-height: 1.02;
  color: var(--white); letter-spacing: -0.01em; margin-bottom: 20px;
}
.pdp-micro {
  font-size: clamp(16px, 1.8vw, 20px); color: var(--white-dim);
  font-weight: 300; margin-bottom: 36px; max-width: 480px;
}
.pdp-price-row {
  display: flex; align-items: baseline; gap: 14px; margin-bottom: 32px;
  flex-wrap: wrap;
}
.pdp-price {
  font-family: var(--font-mono); font-size: 32px; font-weight: 500; color: var(--white);
}
.pdp-price-perday {
  font-family: var(--font-mono); font-size: 13px; color: var(--gray-text);
  letter-spacing: 0.04em;
}
.pdp-format-spec {
  font-family: var(--font-mono); font-size: 12px; color: var(--white-dim);
  letter-spacing: 0.06em; text-transform: uppercase; margin: 14px 0 20px;
  border-left: 2px solid var(--cobalt); padding-left: 10px; line-height: 1.6;
}
.pdp-buy-row {
  display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 24px;
}
.btn-pdp-primary {
  background: var(--cobalt); color: #fff; border: none;
  font-family: var(--font-mono); font-size: 13px; font-weight: 500;
  padding: 16px 36px; border-radius: 6px; letter-spacing: 0.05em;
  transition: background 0.25s ease, transform 0.2s ease; cursor: pointer;
}
.btn-pdp-primary:hover { background: #1d4fd6; transform: translateY(-1px); }
.btn-pdp-secondary {
  background: transparent; color: var(--white-dim);
  border: 1px solid var(--gray-border);
  font-family: var(--font-mono); font-size: 13px; font-weight: 500;
  padding: 15px 28px; border-radius: 6px; letter-spacing: 0.05em;
  transition: border-color 0.25s ease, color 0.25s ease; cursor: pointer;
}
.btn-pdp-secondary:hover { border-color: var(--cobalt); color: var(--white); }
.pdp-guarantee {
  font-family: var(--font-mono); font-size: 12px; color: var(--gray-text);
  letter-spacing: 0.06em;
}
.pdp-stat-block { text-align: center; }
.pdp-stat-number {
  font-family: var(--font-heading); font-weight: 800;
  font-size: clamp(72px, 12vw, 140px); line-height: 1;
  color: var(--white); letter-spacing: -0.02em; margin-bottom: 12px;
}
.pdp-stat-label {
  font-family: var(--font-mono); font-size: 13px; color: var(--white-dim);
  letter-spacing: 0.08em; text-transform: uppercase; max-width: 280px;
  margin: 0 auto 8px;
}
.pdp-stat-source {
  font-family: var(--font-mono); font-size: 12px; color: var(--cobalt);
  letter-spacing: 0.12em; text-transform: uppercase;
}

/* PDP sections */
.pdp-mechanism { background: var(--black-card); border-top: 1px solid var(--black-border); }
.mechanism-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
  margin-top: 64px;
}
@media (max-width: 860px) { .mechanism-grid { grid-template-columns: 1fr; } }
.mechanism-card {
  border: 1px solid var(--black-border); border-top: 2px solid var(--cobalt);
  border-radius: 8px; padding: 32px 28px; background: var(--black);
}
.mech-step {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.2em;
  color: var(--cobalt); text-transform: uppercase; margin-bottom: 14px;
}
.mech-title {
  font-family: var(--font-heading); font-weight: 600; font-size: 20px;
  color: var(--white); margin-bottom: 10px;
}
.mech-body { font-size: 14.5px; color: var(--white-dim); line-height: 1.7; }

.pdp-protocol { background: var(--black); border-top: 1px solid var(--black-border); }
.protocol-table { width: 100%; border-collapse: collapse; margin-top: 48px; }
.protocol-table th {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--cobalt); padding: 14px 20px;
  border-bottom: 1px solid var(--black-border); text-align: left;
}
.protocol-table td {
  font-family: var(--font-mono); font-size: 13px; color: var(--white-dim);
  padding: 16px 20px; border-bottom: 1px solid var(--black-border);
}
.protocol-table tr:last-child td { border-bottom: none; }
.protocol-table td:first-child { color: var(--white); font-weight: 500; }

.pdp-evidence { background: #0C0C0C; border-top: 1px solid var(--black-border); }
.evidence-card {
  background: var(--black-card); border: 1px solid var(--black-border);
  border-left: 3px solid var(--cobalt); border-radius: 8px; padding: 32px 28px;
  margin-bottom: 16px;
}
.ev-source {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--cobalt); margin-bottom: 12px;
}
.ev-finding {
  font-size: 16px; color: var(--white); font-weight: 300; line-height: 1.65;
  margin-bottom: 12px;
}
.ev-context { font-family: var(--font-mono); font-size: 12px; color: var(--gray-text); }

/* ============ POLICY PAGES ============ */
.page-main { padding: 160px 0 120px; min-height: 80vh; }
.page-main .page-label {
  font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.28em;
  text-transform: uppercase; color: var(--cobalt); margin-bottom: 16px;
}
.page-main h1 {
  font-family: var(--font-heading); font-weight: 700;
  font-size: clamp(36px, 5vw, 68px); line-height: 1.06;
  color: var(--white); margin-bottom: 40px;
}
.page-main .page-content { max-width: 720px; }
.page-main h2 {
  font-family: var(--font-heading); font-weight: 600; font-size: 22px;
  color: var(--white); margin: 48px 0 14px;
}
.page-main p {
  font-size: 15px; color: var(--white-dim); line-height: 1.8; margin-bottom: 16px;
}
.page-main a { color: var(--cobalt); border-bottom: 1px solid var(--cobalt-mid); }
.page-main a:hover { border-color: var(--cobalt); }
.page-main ul {
  margin: 0 0 16px 0; padding-left: 0; list-style: none;
}
.page-main ul li {
  font-size: 15px; color: var(--white-dim); line-height: 1.8;
  padding-left: 18px; position: relative; margin-bottom: 8px;
}
.page-main ul li::before {
  content: '+'; position: absolute; left: 0; color: var(--cobalt); font-weight: 500;
}
.page-main .last-updated {
  font-family: var(--font-mono); font-size: 12px; color: var(--gray-text);
  letter-spacing: 0.06em; margin-bottom: 48px;
}

/* ============ PDP PRODUCT GALLERY ============ */
.pdp-gallery {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 52px;
}
.pdp-gallery figure {
  background: var(--black-card); border: 1px solid var(--black-border);
  border-radius: 10px; overflow: hidden; aspect-ratio: 4 / 3;
  transition: border-color 0.25s ease, transform 0.25s ease;
}
.pdp-gallery figure.g-wide { grid-column: 1 / -1; aspect-ratio: 21 / 9; }
.pdp-gallery figure:hover { border-color: var(--cobalt); transform: translateY(-2px); }
.pdp-gallery img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 720px) {
  .pdp-gallery { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .pdp-gallery figure.g-wide { aspect-ratio: 16 / 9; }
}