/* ======================================================================
   PotentStream™ — OBSIDIAN LUXE THEME
   Premium Black / Emerald / Gold — Masculine, Authoritative, High-End
   ====================================================================== */

/* Fonts loaded via <link> in HTML for faster rendering */

:root {
  /* ── Core Palette ── */
  --obsidian: #0B0E11;
  --charcoal: #141820;
  --slate: #1C2230;
  --gunmetal: #252D3A;
  --steel: #3A4456;
  --ash: #6B7A8D;
  --mist: #9AAAB8;
  --cloud: #C8D4DE;
  --snow: #EEF2F6;
  --white: #FFFFFF;

  /* Accent: Emerald */
  --emerald: #10B981;
  --emerald-dark: #059669;
  --emerald-light: #34D399;
  --emerald-glow: rgba(16,185,129,.15);
  --emerald-glow-strong: rgba(16,185,129,.25);

  /* Accent: Gold */
  --gold: #D4A017;
  --gold-light: #F2CC5B;
  --gold-glow: rgba(212,160,23,.12);

  /* Functional */
  --danger: #EF4444;
  --danger-glow: rgba(239,68,68,.15);

  /* ── Typography ── */
  --font-display: 'Cormorant Garamond', 'Georgia', serif;
  --font-body: 'Manrope', 'Segoe UI', sans-serif;

  /* ── Spacing ── */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 32px;
  --radius-full: 9999px;

  /* ── Shadows ── */
  --shadow-sm: 0 2px 8px rgba(0,0,0,.25);
  --shadow-md: 0 6px 20px rgba(0,0,0,.35);
  --shadow-lg: 0 12px 40px rgba(0,0,0,.4);
  --shadow-xl: 0 24px 60px rgba(0,0,0,.5);
  --shadow-emerald: 0 6px 30px rgba(16,185,129,.25);
  --shadow-gold: 0 4px 20px rgba(212,160,23,.2);

  /* ── Transitions ── */
  --ease: cubic-bezier(.4,0,.2,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
  --t-fast: .2s;
  --t-normal: .35s;
  --t-slow: .6s;
}

/* ══════════════════════════════════════════
   RESET & BASE
   ══════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
*{-webkit-tap-highlight-color:transparent}
body{font-family:var(--font-body);color:var(--cloud);background:var(--obsidian);line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;color:inherit}
ul,ol{list-style:none}
button{cursor:pointer;border:none;font-family:inherit;background:none}

/* ── Utility ── */
.container{width:100%;max-width:1200px;margin:0 auto;padding-left:20px;padding-right:20px}
.section-pad{padding:64px 0}
.text-center{text-align:center}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* ── Typography ── */
h1,h2,h3,h4{font-family:var(--font-display);font-weight:700;line-height:1.2;color:var(--white)}
h1{font-size:1.75rem;margin-bottom:18px;letter-spacing:-.01em}
h2{font-size:1.45rem;margin-bottom:16px}
h3{font-size:1.15rem;margin-bottom:10px}
p{margin-bottom:14px;color:var(--mist);font-weight:400}
strong{color:var(--white);font-weight:700}

/* ── Section Tag ── */
.section-tag{
  display:inline-flex;align-items:center;gap:8px;
  font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:3px;
  color:var(--emerald);margin-bottom:12px;
}
.section-tag::before{content:'';width:24px;height:1px;background:var(--emerald)}
.section-tag::after{content:'';width:24px;height:1px;background:var(--emerald)}

/* ── CTA Buttons ── */
.btn-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  background:linear-gradient(135deg,var(--emerald-dark),var(--emerald));
  color:var(--white);font-weight:700;font-size:.95rem;
  padding:17px 36px;border-radius:var(--radius-full);
  min-height:54px;width:100%;max-width:480px;
  box-shadow:var(--shadow-emerald);
  transition:all var(--t-normal) var(--ease);
  position:relative;overflow:hidden;
  text-transform:uppercase;letter-spacing:1px;
}
.btn-cta::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.12),transparent 60%);
  opacity:0;transition:opacity var(--t-fast) var(--ease);
}
.btn-cta:hover{transform:translateY(-2px);box-shadow:0 8px 36px rgba(16,185,129,.4)}
.btn-cta:hover::before{opacity:1}
.btn-cta:active{transform:scale(.97)}

.btn-outline{
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--emerald);border:1.5px solid var(--emerald);
  font-weight:700;font-size:.85rem;padding:12px 28px;
  border-radius:var(--radius-full);min-height:48px;
  transition:all var(--t-normal) var(--ease);
}
.btn-outline:hover{background:var(--emerald);color:var(--white)}

/* ── Reveal Animation ── */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-left{opacity:0;transform:translateX(-30px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.reveal-left.visible{opacity:1;transform:translateX(0)}
.reveal-right{opacity:0;transform:translateX(30px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.reveal-right.visible{opacity:1;transform:translateX(0)}
/* Fallback: if JS fails, show everything */
.no-js .reveal,.no-js .reveal-left,.no-js .reveal-right{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  .reveal,.reveal-left,.reveal-right{opacity:1;transform:none;transition:none}
  *,*::before,*::after{animation-duration:0s!important;transition-duration:0s!important}
}

/* ── Gold Divider ── */
.gold-divider{
  width:60px;height:2px;margin:20px auto;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}

/* ══════════════════════════════════════════
   1. NAVIGATION
   ══════════════════════════════════════════ */
.site-header{
  position:fixed;top:0;left:0;width:100%;z-index:1000;
  background:rgba(11,14,17,.75);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(255,255,255,.04);
  transition:all var(--t-normal) var(--ease);
}
.site-header.scrolled{background:rgba(11,14,17,.95);box-shadow:0 4px 30px rgba(0,0,0,.5)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.nav-logo{font-family:var(--font-display);font-size:1.25rem;font-weight:700;color:var(--white);letter-spacing:.02em}
.nav-logo em{font-style:normal;color:var(--emerald)}
.nav-links{display:none}
.nav-cta-desk{display:none}

/* Hamburger */
.hamburger{width:44px;height:44px;display:flex;align-items:center;justify-content:center;position:relative}
.hamburger span{display:block;width:22px;height:2px;background:var(--cloud);border-radius:2px;transition:all var(--t-normal) var(--ease);position:absolute}
.hamburger span:nth-child(1){transform:translateY(-7px)}
.hamburger span:nth-child(3){transform:translateY(7px)}
.hamburger.active span:nth-child(1){transform:rotate(45deg)}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){transform:rotate(-45deg)}

/* Mobile Menu */
.mobile-menu{
  position:fixed;top:64px;right:-100%;width:85%;max-width:340px;
  height:calc(100vh - 64px);background:var(--charcoal);
  border-left:1px solid rgba(255,255,255,.05);
  box-shadow:-12px 0 40px rgba(0,0,0,.5);
  transition:right .4s var(--ease);
  padding:32px 28px;z-index:999;
  display:flex;flex-direction:column;gap:6px;
}
.mobile-menu.open{right:0}
.mobile-menu a{
  display:block;padding:16px 0;font-size:1rem;font-weight:600;
  color:var(--mist);border-bottom:1px solid rgba(255,255,255,.05);
  transition:color var(--t-fast);
}
.mobile-menu a:hover{color:var(--emerald)}
.mobile-menu .btn-cta{margin-top:24px;text-align:center}
.menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:998;opacity:0;pointer-events:none;transition:opacity .3s}
.menu-overlay.show{opacity:1;pointer-events:auto}

/* ══════════════════════════════════════════
   2. HERO
   ══════════════════════════════════════════ */
.hero{
  padding-top:84px;padding-bottom:48px;
  background:var(--obsidian);
  position:relative;overflow:hidden;
}
/* Emerald gradient orb */
.hero::before{
  content:'';position:absolute;top:-20%;right:-15%;
  width:500px;height:500px;border-radius:50%;
  background:radial-gradient(circle,rgba(16,185,129,.08),transparent 70%);
  pointer-events:none;
}
/* Gold accent orb */
.hero::after{
  content:'';position:absolute;bottom:-10%;left:-10%;
  width:400px;height:400px;border-radius:50%;
  background:radial-gradient(circle,rgba(212,160,23,.05),transparent 70%);
  pointer-events:none;
}
.hero-grid{display:flex;flex-direction:column;gap:32px;align-items:center;position:relative;z-index:1}

/* Hero Image */
.hero-image{position:relative;text-align:center}
.hero-image img{
  max-width:260px;margin:0 auto;
  filter:drop-shadow(0 20px 50px rgba(16,185,129,.2));
  animation:heroFloat 5s ease-in-out infinite;
}
@keyframes heroFloat{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-14px) rotate(.5deg)}}
.hero-image .ring{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:240px;height:240px;border-radius:50%;
  border:1px solid rgba(16,185,129,.15);
  animation:ringPulse 3s ease-in-out infinite;
}
.hero-image .ring-2{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:290px;height:290px;border-radius:50%;
  border:1px solid rgba(16,185,129,.08);
  animation:ringPulse 3s ease-in-out infinite .5s;
}
@keyframes ringPulse{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.6}50%{transform:translate(-50%,-50%) scale(1.08);opacity:1}}

/* Particles */
.hero-particle{
  position:absolute;width:3px;height:3px;border-radius:50%;
  background:var(--emerald);opacity:.3;
  animation:particleDrift 8s linear infinite;
}
@keyframes particleDrift{
  0%{transform:translateY(0) translateX(0);opacity:0}
  10%{opacity:.4}
  90%{opacity:.4}
  100%{transform:translateY(-200px) translateX(30px);opacity:0}
}

/* Hero Content */
.hero-content h1 em{font-style:italic;color:var(--emerald-light)}
.hero-desc{font-size:.95rem;color:var(--mist);line-height:1.75}
.hero-rating{
  display:inline-flex;align-items:center;gap:8px;
  margin-bottom:20px;padding:8px 16px;
  background:rgba(212,160,23,.08);border:1px solid rgba(212,160,23,.15);
  border-radius:var(--radius-full);
}
.hero-rating .stars{color:var(--gold);font-size:.9rem;letter-spacing:1px}
.hero-rating .rating-text{font-size:.78rem;color:var(--gold-light);font-weight:600}
.hero-benefits{margin-bottom:28px;display:flex;flex-direction:column;gap:12px}
.hero-benefits li{
  display:flex;align-items:center;gap:12px;
  font-size:.92rem;color:var(--cloud);
  padding:10px 16px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.05);
  border-radius:var(--radius-sm);
  transition:all var(--t-fast) var(--ease);
}
.hero-benefits li:hover{background:var(--emerald-glow);border-color:rgba(16,185,129,.2)}
.hero-benefits li .ico{font-size:1.15rem;flex-shrink:0}

/* ══════════════════════════════════════════
   3. WHY CHOOSE — Trust Badges
   ══════════════════════════════════════════ */
.why-choose{background:var(--charcoal);border-top:1px solid rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.04)}
.trust-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:28px}
.trust-card{
  background:var(--slate);border:1px solid rgba(255,255,255,.05);
  border-radius:var(--radius-md);padding:24px 16px;text-align:center;
  transition:all var(--t-normal) var(--ease);position:relative;overflow:hidden;
}
.trust-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--emerald),transparent);
  opacity:0;transition:opacity var(--t-normal);
}
.trust-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.trust-card:hover::before{opacity:1}
.trust-card img{width:52px;height:52px;object-fit:contain;margin:0 auto 14px}
.trust-card h3{font-size:.9rem;margin-bottom:6px;font-family:var(--font-body);font-weight:700;color:var(--white)}
.trust-card p{font-size:.78rem;color:var(--ash);margin-bottom:0;line-height:1.55}

/* ══════════════════════════════════════════
   4. FORMULA STANDS OUT
   ══════════════════════════════════════════ */
.formula-section{background:var(--obsidian);position:relative}
.formula-section::before{
  content:'';position:absolute;top:50%;right:0;
  width:300px;height:300px;border-radius:50%;
  background:radial-gradient(circle,rgba(212,160,23,.04),transparent 70%);
  transform:translateY(-50%);pointer-events:none;
}
.formula-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-top:32px}
.formula-card{
  background:linear-gradient(135deg,var(--charcoal),var(--slate));
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--radius-md);padding:24px 20px;
  position:relative;overflow:hidden;
  transition:all var(--t-normal) var(--ease);
}
.formula-card::after{
  content:'';position:absolute;top:0;left:0;width:3px;height:100%;
  background:linear-gradient(180deg,var(--emerald),var(--gold));
  opacity:.5;transition:opacity var(--t-normal);
}
.formula-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.formula-card:hover::after{opacity:1}
.formula-card .fc-num{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;flex-shrink:0;
  background:var(--emerald-glow);border:1px solid rgba(16,185,129,.25);
  color:var(--emerald);font-weight:800;font-size:.85rem;
  font-family:var(--font-body);margin-bottom:14px;
}
.formula-card h3{font-size:1.05rem;color:var(--white);font-family:var(--font-body);font-weight:700}
.formula-card p{font-size:.88rem;color:var(--mist);margin-bottom:0;line-height:1.7}

/* ══════════════════════════════════════════
   5. WHAT IS
   ══════════════════════════════════════════ */
.what-is{background:var(--charcoal);position:relative;overflow:hidden}
.what-is::before{
  content:'';position:absolute;bottom:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--steel),transparent);
}
.what-is-grid{display:flex;flex-direction:column;gap:32px;align-items:center}
.what-is-img{position:relative}
.what-is-img img{
  max-width:300px;margin:0 auto;border-radius:var(--radius-lg);
  box-shadow:var(--shadow-xl);
  border:1px solid rgba(255,255,255,.06);
}
.what-is-text p{font-size:.93rem}

/* ══════════════════════════════════════════
   6. HOW IT WORKS
   ══════════════════════════════════════════ */
.how-works{
  background:linear-gradient(175deg,var(--obsidian) 0%,#080C0F 100%);
  position:relative;
}
.how-works-desc{max-width:720px;margin:0 auto 36px}
.steps-list{display:flex;flex-direction:column;gap:0;position:relative;padding-left:0}
.steps-list::before{
  content:'';position:absolute;left:24px;top:32px;bottom:32px;width:2px;
  background:linear-gradient(180deg,var(--emerald),var(--gold),var(--emerald-dark));
  opacity:.2;
}
.step-item{display:flex;gap:20px;padding:22px 0;position:relative}
.step-num{
  width:48px;height:48px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.9rem;font-family:var(--font-body);
  background:var(--charcoal);border:2px solid var(--emerald);
  color:var(--emerald);z-index:1;
  transition:all var(--t-normal) var(--ease);
}
.step-item.visible .step-num{
  animation:stepBounce .6s var(--ease-spring);
  background:var(--emerald);color:var(--white);
  box-shadow:var(--shadow-emerald);
}
@keyframes stepBounce{0%{transform:scale(0)}60%{transform:scale(1.2)}100%{transform:scale(1)}}
.step-text h3{font-size:1rem;margin-bottom:6px;font-family:var(--font-body);font-weight:700}
.step-text p{font-size:.88rem;margin-bottom:0;color:var(--mist)}

/* ══════════════════════════════════════════
   7. REVIEWS
   ══════════════════════════════════════════ */
.reviews{background:var(--charcoal)}
.review-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-top:32px}
.review-card{
  background:var(--slate);border:1px solid rgba(255,255,255,.06);
  border-radius:var(--radius-md);padding:28px 22px;
  transition:all var(--t-normal) var(--ease);position:relative;overflow:hidden;
}
.review-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--emerald),var(--gold));
  opacity:0;transition:opacity var(--t-normal);
}
.review-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.review-card:hover::before{opacity:1}
.review-card.visible{animation:cardReveal .7s var(--ease) forwards}
@keyframes cardReveal{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
.review-header{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.review-avatar{
  width:56px;height:56px;border-radius:50%;overflow:hidden;flex-shrink:0;
  border:2px solid var(--emerald);
  box-shadow:0 0 0 4px var(--emerald-glow);
}
.review-avatar img{width:100%;height:100%;object-fit:cover}
.review-name{font-weight:700;color:var(--white);font-size:.95rem}
.review-loc{font-size:.78rem;color:var(--ash)}
.review-badge{
  display:inline-flex;align-items:center;gap:4px;
  font-size:.7rem;font-weight:700;color:var(--emerald);
  background:var(--emerald-glow);padding:3px 10px;border-radius:var(--radius-full);
  margin-bottom:12px;
}
.review-stars{display:flex;gap:2px;margin-bottom:14px}
.review-stars svg{width:18px;height:18px;fill:var(--gold)}
.review-text{font-size:.88rem;color:var(--mist);line-height:1.7;margin-bottom:0}

/* ══════════════════════════════════════════
   8. RESEARCH BACKED
   ══════════════════════════════════════════ */
.research-backed{background:var(--obsidian)}
.research-content{max-width:820px;margin:0 auto}
.research-content h3{margin-top:28px;font-family:var(--font-body);font-weight:700;color:var(--white)}
.research-content ul{margin:16px 0 16px 4px}
.research-content ul li{
  position:relative;padding-left:24px;margin-bottom:10px;
  font-size:.9rem;color:var(--mist);
}
.research-content ul li::before{content:'✦';position:absolute;left:0;color:var(--emerald);font-size:.75rem;top:3px}

/* ══════════════════════════════════════════
   8b. PRICING
   ══════════════════════════════════════════ */
.pricing{
  background:linear-gradient(175deg,#070A0D 0%,var(--obsidian) 50%,#0D1117 100%);
  position:relative;overflow:hidden;
}
.pricing::before{
  content:'';position:absolute;top:-100px;left:50%;transform:translateX(-50%);
  width:600px;height:400px;border-radius:50%;
  background:radial-gradient(circle,rgba(16,185,129,.06),transparent 70%);
  pointer-events:none;
}

/* Countdown */
.countdown-wrap{margin:24px 0 36px;text-align:center}
.countdown{
  display:inline-flex;align-items:center;gap:10px;
  background:var(--danger-glow);border:1px solid rgba(239,68,68,.3);
  border-radius:var(--radius-lg);padding:14px 28px;
}
.cd-block{text-align:center}
.cd-num{
  font-size:2.2rem;font-weight:800;font-family:var(--font-body);
  color:var(--danger);line-height:1;
  text-shadow:0 0 20px rgba(239,68,68,.3);
}
.cd-label{font-size:.6rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--ash);margin-top:2px}
.cd-sep{font-size:1.8rem;color:var(--ash);line-height:1;padding:0 4px}

/* Pricing Grid */
.pricing-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-top:10px}
.price-card{
  background:linear-gradient(160deg,var(--charcoal),var(--slate));
  border:1px solid rgba(255,255,255,.07);
  border-radius:var(--radius-lg);padding:32px 22px;text-align:center;
  position:relative;overflow:hidden;transition:all var(--t-normal) var(--ease);
}
.price-card.popular{
  background:linear-gradient(160deg,rgba(16,185,129,.08),rgba(16,185,129,.02));
  border-color:var(--emerald);
  box-shadow:0 0 0 1px var(--emerald),var(--shadow-emerald);
}
.price-card.popular::before{
  content:'★ MOST POPULAR ★';position:absolute;top:0;left:0;right:0;
  background:linear-gradient(90deg,var(--emerald-dark),var(--emerald));
  color:var(--white);font-size:.68rem;font-weight:800;
  letter-spacing:2px;padding:8px 0;
}
.price-card.popular{padding-top:52px}
.price-label{
  font-size:.72rem;font-weight:800;letter-spacing:2.5px;
  text-transform:uppercase;color:var(--ash);margin-bottom:8px;
}
.price-bottles{font-size:1.4rem;font-weight:800;color:var(--white)}
.price-supply{font-size:.82rem;color:var(--ash);margin-bottom:16px}
.price-card img{max-width:140px;height:160px;object-fit:contain;margin:0 auto 16px}
.price-old{font-size:1rem;color:var(--ash);text-decoration:line-through;margin-bottom:4px}
.price-amount{font-size:2.6rem;font-weight:800;color:var(--white);line-height:1}
.price-amount small{font-size:.85rem;font-weight:400;color:var(--mist)}
.price-total{font-size:.85rem;color:var(--mist);margin-bottom:18px}
.price-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:18px}
.badge{
  display:inline-block;padding:5px 14px;border-radius:var(--radius-full);
  font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;
}
.badge-emerald{background:var(--emerald-glow);color:var(--emerald-light);border:1px solid rgba(16,185,129,.2)}
.badge-gold{background:var(--gold-glow);color:var(--gold-light);border:1px solid rgba(212,160,23,.2)}
.price-card .btn-cta{margin-bottom:14px;font-size:.88rem}
.payment-logos{display:flex;justify-content:center;gap:8px;opacity:.4}
.payment-logos span{font-size:.65rem;color:var(--mist)}

/* ══════════════════════════════════════════
   9. INGREDIENTS
   ══════════════════════════════════════════ */
.ingredients{background:var(--charcoal)}
.ingr-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-top:32px}
.ingr-card{
  background:var(--slate);border:1px solid rgba(255,255,255,.05);
  border-radius:var(--radius-md);overflow:hidden;
  transition:all var(--t-normal) var(--ease);cursor:pointer;
}
.ingr-card:hover{border-color:rgba(16,185,129,.15)}
.ingr-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 20px;
}
.ingr-header h3{margin-bottom:0;font-size:.95rem;color:var(--white);font-family:var(--font-body);font-weight:700;display:flex;align-items:center;gap:10px}
.ingr-toggle{
  width:32px;height:32px;border-radius:50%;
  background:rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;
  transition:all var(--t-normal) var(--ease);font-size:1.1rem;color:var(--ash);flex-shrink:0;
}
.ingr-card.open .ingr-toggle{transform:rotate(45deg);color:var(--emerald);background:var(--emerald-glow)}
.ingr-body{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.ingr-body-inner{padding:0 20px 20px;font-size:.88rem;color:var(--mist);line-height:1.7}

/* ══════════════════════════════════════════
   10. SCIENTIFIC EVIDENCE
   ══════════════════════════════════════════ */
.science{background:var(--obsidian)}
.science-content{max-width:820px;margin:0 auto}
.science-content p{font-size:.9rem}
.science-content a{color:var(--mist);border-bottom:none}
.science-content a:hover{color:var(--emerald-light)}
.collapse-btn{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  background:var(--slate);border:1px solid rgba(255,255,255,.06);
  padding:14px 20px;border-radius:var(--radius-md);
  font-weight:600;color:var(--white);font-size:.92rem;
  width:100%;min-height:52px;margin-bottom:10px;
  transition:all var(--t-normal) var(--ease);
}
.collapse-btn:hover{background:var(--gunmetal);border-color:rgba(16,185,129,.15)}
.collapse-btn.active{border-color:var(--emerald);background:var(--emerald-glow)}
.collapse-body{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.collapse-body-inner{padding:12px 0 24px}

/* ══════════════════════════════════════════
   11. GUARANTEE
   ══════════════════════════════════════════ */
.guarantee{background:var(--charcoal);position:relative}
.guarantee::before{
  content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:500px;height:500px;border-radius:50%;
  background:radial-gradient(circle,rgba(212,160,23,.03),transparent 70%);
  pointer-events:none;
}
.guarantee-grid{display:flex;flex-direction:column;align-items:center;gap:28px}
.guarantee-img img{max-width:200px;margin:0 auto;filter:drop-shadow(0 8px 24px rgba(0,0,0,.4))}
.guarantee-point{display:flex;align-items:flex-start;gap:14px;margin-bottom:18px}
.guarantee-point .gp-icon{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--emerald-dark),var(--emerald));
  color:var(--white);font-size:.9rem;font-weight:700;
  box-shadow:var(--shadow-emerald);
}
.guarantee-point p{font-size:.9rem;margin-bottom:0}

/* ══════════════════════════════════════════
   12. BENEFITS
   ══════════════════════════════════════════ */
.benefits{background:var(--obsidian)}
.benefits-list{max-width:820px;margin:32px auto 0}
.benefit-item{display:flex;align-items:flex-start;gap:16px;margin-bottom:22px}
.benefit-check{
  width:30px;height:30px;border-radius:50%;flex-shrink:0;margin-top:2px;
  display:flex;align-items:center;justify-content:center;
  background:var(--emerald-glow);border:1px solid rgba(16,185,129,.2);
  color:var(--emerald);font-size:.8rem;font-weight:700;
}
.benefit-item p{font-size:.9rem;margin-bottom:0}

/* ══════════════════════════════════════════
   13. PROS & CONS
   ══════════════════════════════════════════ */
.pros-cons{background:var(--charcoal)}
.pc-grid{display:grid;grid-template-columns:1fr;gap:20px;margin-top:32px}
.pc-col{
  background:var(--slate);border:1px solid rgba(255,255,255,.05);
  border-radius:var(--radius-md);padding:28px 22px;
}
.pc-col h3{display:flex;align-items:center;gap:8px;font-family:var(--font-body);font-weight:700}
.pc-col li{
  position:relative;padding-left:26px;padding-bottom:12px;
  font-size:.9rem;color:var(--mist);
}
.pc-col li::before{position:absolute;left:0;font-weight:700;font-size:.85rem}
.pros-list li::before{content:'✓';color:var(--emerald)}
.cons-list li::before{content:'✗';color:var(--danger)}

/* ══════════════════════════════════════════
   15. WHERE TO BUY
   ══════════════════════════════════════════ */
.where-buy{background:var(--obsidian)}
.where-buy .research-content a{color:var(--emerald)}

/* ══════════════════════════════════════════
   16. ORDER STEPS
   ══════════════════════════════════════════ */
.order-steps{background:var(--charcoal)}
.order-steps-grid{display:flex;flex-direction:column;gap:32px;align-items:center}
.order-steps-img img{
  max-width:380px;margin:0 auto;border-radius:var(--radius-md);
  box-shadow:var(--shadow-xl);border:1px solid rgba(255,255,255,.06);
}
.order-steps-text p{font-size:.93rem}

/* ══════════════════════════════════════════
   17. FAQ
   ══════════════════════════════════════════ */
.faq{background:var(--obsidian)}
.faq-list{max-width:820px;margin:32px auto 0}
.faq-item{
  border:1px solid rgba(255,255,255,.06);border-radius:var(--radius-md);
  margin-bottom:12px;overflow:hidden;background:var(--charcoal);
  transition:all var(--t-normal) var(--ease);
}
.faq-item:hover{border-color:rgba(255,255,255,.1)}
.faq-q{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 22px;cursor:pointer;
  font-weight:600;font-size:.93rem;color:var(--white);
  min-height:56px;transition:all var(--t-fast);
}
.faq-q:hover{background:rgba(255,255,255,.02)}
.faq-icon{
  width:30px;height:30px;border-radius:50%;
  background:rgba(255,255,255,.05);
  display:flex;align-items:center;justify-content:center;
  transition:all var(--t-normal) var(--ease);
  font-size:1rem;color:var(--ash);flex-shrink:0;
}
.faq-item.open .faq-icon{transform:rotate(45deg);color:var(--emerald);background:var(--emerald-glow)}
.faq-item.open{border-color:rgba(16,185,129,.15)}
.faq-a{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.faq-a-inner{padding:0 22px 22px;font-size:.88rem;color:var(--mist);line-height:1.7}
.faq-a-inner a{color:var(--emerald)}

/* ══════════════════════════════════════════
   18. FINAL CTA
   ══════════════════════════════════════════ */
.final-cta{
  background:linear-gradient(175deg,#070A0D 0%,var(--obsidian) 100%);
  text-align:center;position:relative;overflow:hidden;
}
.final-cta::before{
  content:'';position:absolute;bottom:-80px;left:50%;transform:translateX(-50%);
  width:600px;height:400px;border-radius:50%;
  background:radial-gradient(circle,rgba(16,185,129,.06),transparent 60%);
  pointer-events:none;
}
.final-cta img{
  max-width:240px;margin:0 auto 28px;position:relative;z-index:1;
  animation:heroFloat 5s ease-in-out infinite;
  filter:drop-shadow(0 20px 50px rgba(16,185,129,.2));
}
.final-cta .old-price{font-size:1.2rem;text-decoration:line-through;color:var(--ash)}
.final-cta .new-price{
  font-size:2.4rem;font-weight:800;
  background:linear-gradient(90deg,var(--gold),var(--gold-light));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;margin-bottom:24px;
}
.final-cta .btn-cta{margin:0 auto}

/* ══════════════════════════════════════════
   19. FOOTER
   ══════════════════════════════════════════ */
.site-footer{
  background:#060809;border-top:1px solid rgba(255,255,255,.04);
  padding:40px 0 24px;font-size:.8rem;
}
.footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin-bottom:20px}
.footer-links a{color:var(--ash);transition:color var(--t-fast)}
.footer-links a:hover{color:var(--emerald)}
.footer-social{display:flex;justify-content:center;gap:12px;margin-bottom:20px}
.footer-social a{
  width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);
  display:flex;align-items:center;justify-content:center;
  color:var(--ash);font-size:1rem;transition:all var(--t-normal) var(--ease);
}
.footer-social a:hover{background:var(--emerald);border-color:var(--emerald);color:var(--white)}
.footer-disclaimer{max-width:800px;margin:24px auto 0;font-size:.7rem;line-height:1.6;color:var(--steel);text-align:center}

/* ══════════════════════════════════════════
   PURCHASE POPUP
   ══════════════════════════════════════════ */
.purchase-popup{
  position:fixed;bottom:20px;left:20px;z-index:900;
  background:var(--charcoal);border:1px solid rgba(16,185,129,.15);
  border-radius:var(--radius-md);box-shadow:var(--shadow-xl);
  padding:14px 18px;display:flex;align-items:center;gap:12px;
  max-width:330px;transform:translateX(-120%);
  transition:transform .5s var(--ease);
}
.purchase-popup.show{transform:translateX(0)}
.purchase-popup .pp-icon{font-size:1.3rem}
.purchase-popup .pp-name{font-weight:700;color:var(--emerald-light);font-size:.82rem}
.purchase-popup .pp-text{font-size:.78rem;color:var(--mist);line-height:1.4}
.purchase-popup .pp-time{font-size:.68rem;color:var(--ash)}

/* ══════════════════════════════════════════
   SCROLL TO TOP
   ══════════════════════════════════════════ */
.scroll-top{
  position:fixed;bottom:24px;right:24px;z-index:800;
  width:52px;height:52px;border-radius:50%;
  background:linear-gradient(135deg,var(--emerald-dark),var(--emerald));
  color:var(--white);display:flex;align-items:center;justify-content:center;
  box-shadow:var(--shadow-emerald);font-size:1.3rem;
  opacity:0;pointer-events:none;transition:all var(--t-normal) var(--ease);
}
.scroll-top.show{opacity:1;pointer-events:auto}
.scroll-top:active{transform:scale(.9)}

/* ══════════════════════════════════════════
   RESPONSIVE — TABLET+
   ══════════════════════════════════════════ */
@media(min-width:576px){
  .container{padding-left:28px;padding-right:28px}
  .review-grid{grid-template-columns:repeat(2,1fr)}
  .pc-grid{grid-template-columns:repeat(2,1fr)}
  .pricing-grid{grid-template-columns:repeat(2,1fr)}
}

@media(min-width:768px){
  h1{font-size:2.2rem}
  h2{font-size:1.7rem}
  .section-pad{padding:90px 0}
  .hero{padding-top:110px;padding-bottom:70px}
  .hero-grid{flex-direction:row;gap:50px}
  .hero-image img{max-width:340px}
  .hero-image .ring{width:320px;height:320px}
  .hero-image .ring-2{width:380px;height:380px}
  .trust-grid{grid-template-columns:repeat(4,1fr)}
  .formula-grid{grid-template-columns:repeat(2,1fr)}
  .what-is-grid{flex-direction:row}
  .what-is-img img{max-width:380px}
  .review-grid{grid-template-columns:repeat(3,1fr)}
  .ingr-grid{grid-template-columns:repeat(2,1fr)}
  .guarantee-grid{flex-direction:row;align-items:flex-start}
  .order-steps-grid{flex-direction:row;align-items:center}
  .order-steps-img{flex-shrink:0}

  /* Desktop Nav */
  .hamburger{display:none}
  .mobile-menu{display:none!important}
  .menu-overlay{display:none!important}
  .nav-links{display:flex;align-items:center;gap:30px}
  .nav-links a{
    font-size:.85rem;font-weight:600;color:var(--mist);
    position:relative;transition:color var(--t-fast);
  }
  .nav-links a::after{
    content:'';position:absolute;bottom:-4px;left:0;
    width:0;height:2px;background:var(--emerald);
    transition:width var(--t-normal) var(--ease);
  }
  .nav-links a:hover{color:var(--emerald)}
  .nav-links a:hover::after{width:100%}
  .nav-cta-desk{display:inline-flex}
  .btn-cta{width:auto}
}

@media(min-width:1024px){
  h1{font-size:2.8rem}
  h2{font-size:2rem}
  .section-pad{padding:110px 0}
  .hero{padding-top:130px;padding-bottom:90px}
  .hero-image img{max-width:420px}
  .hero-image .ring{width:400px;height:400px}
  .hero-image .ring-2{width:460px;height:460px}
  .formula-grid{grid-template-columns:repeat(3,1fr)}
  .pricing-grid{grid-template-columns:repeat(3,1fr)}
  .price-card.popular{transform:scale(1.05)}
  .ingr-grid{grid-template-columns:repeat(3,1fr)}
  .final-cta img{max-width:300px}
  .final-cta .new-price{font-size:3rem}
}

@media(min-width:1440px){
  .container{max-width:1280px}
}