/* =============================================================
   ALKALEAN — Core Stylesheet
   Design tokens — warm "molten metabolism" direction, amber brand
   ============================================================= */
:root{
  --ak-amber: #FBBF24;
  --ak-amber-dark: #D97706;
  --ak-amber-deep: #92400E;
  --ak-stone: #1C1917;
  --ak-stone-soft: #292524;
  --ak-cream: #FFFBEB;
  --ak-cream-2: #FEF3C7;
  --ak-sage: #4D7C0F;
  --ak-sage-light: #84CC16;
  --ak-white: #FFFFFF;
  --ak-ink-soft: #78716C;

  --font-display: 'Sora', -apple-system, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  --radius-lg: 22px;
  --radius-md: 14px;
  --radius-sm: 8px;

  --shadow-soft: 0 20px 45px -18px rgba(28,25,23,0.35);
  --shadow-card: 0 10px 28px -12px rgba(28,25,23,0.18);
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  font-family:var(--font-body);
  color:var(--ak-stone);
  background:var(--ak-cream);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,.font-display{
  font-family:var(--font-display);
  font-weight:700;
  letter-spacing:-0.01em;
  color:var(--ak-stone);
}

a{ text-decoration:none; }

.eyebrow{
  font-family:var(--font-body);
  font-size:0.72rem;
  font-weight:700;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--ak-amber-dark);
}

.section{ padding:5.5rem 0; }
@media (max-width:767px){ .section{ padding:3.25rem 0; } }

.section-amber{
  background:linear-gradient(180deg,var(--ak-amber) 0%, var(--ak-amber-dark) 100%);
  color:var(--ak-stone);
}
.section-amber h2,.section-amber h3{ color:var(--ak-stone); }
.section-amber .eyebrow{ color:var(--ak-stone-soft); }
.section-amber p{ color:rgba(28,25,23,0.82); }

.section-stone{
  background:var(--ak-stone);
  color:var(--ak-cream);
}
.section-stone h2,.section-stone h3{ color:var(--ak-white); }
.section-stone p{ color:rgba(255,251,235,0.8); }

.btn-ak{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  background:var(--ak-stone);
  color:var(--ak-amber);
  font-weight:700;
  padding:0.95rem 2.1rem;
  border-radius:50px;
  border:none;
  font-size:1rem;
  box-shadow:var(--shadow-soft);
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn-ak:hover{
  background:var(--ak-stone-soft);
  transform:translateY(-2px);
  color:var(--ak-amber);
}
.btn-ak-outline{
  background:transparent;
  border:2px solid var(--ak-stone);
  color:var(--ak-stone);
}
.btn-ak-outline:hover{
  background:var(--ak-stone);
  color:var(--ak-amber);
}
.section-stone .btn-ak-outline{ border-color:var(--ak-cream); color:var(--ak-cream); }
.section-stone .btn-ak-outline:hover{ background:var(--ak-cream); color:var(--ak-stone); }

/* ---------- Navbar ---------- */
.ak-navbar{
  background:var(--ak-cream);
  border-bottom:1px solid rgba(28,25,23,0.08);
  padding:0.85rem 0;
}
.ak-navbar .brand-word{
  font-family:var(--font-display);
  font-size:1.45rem;
  font-weight:800;
  color:var(--ak-stone);
}
.ak-navbar .brand-word span{ color:var(--ak-amber-dark); }
.ak-navbar .nav-link{ color:var(--ak-stone) !important; font-weight:600; font-size:.92rem; }
.ak-navbar .nav-link:hover{ color:var(--ak-amber-dark) !important; }

/* ---------- Hero ---------- */
.hero{
  padding:3.5rem 0 4.5rem;
  background:radial-gradient(120% 120% at 85% 5%, var(--ak-cream-2) 0%, var(--ak-cream) 55%);
  overflow:hidden;
}
.hero h1{
  font-size:clamp(2rem, 3.4vw, 2.95rem);
  line-height:1.14;
}
.hero .lede{
  font-size:1.06rem;
  color:var(--ak-ink-soft);
  max-width:47ch;
}
.hero-badges{ display:flex; gap:1.1rem; flex-wrap:wrap; margin-top:1.75rem; }
.hero-badge{ font-size:0.82rem; font-weight:600; color:var(--ak-ink-soft); display:flex; align-items:center; gap:.4rem; }
.hero-badge svg{ width:18px; height:18px; color:var(--ak-sage); flex-shrink:0; }

/* Signature element: Metabolic Melt Meter */
.melt-meter-wrap{ position:relative; display:flex; align-items:center; justify-content:center; }
.melt-meter-card{
  background:var(--ak-white);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card);
  padding:2rem;
  width:100%;
  max-width:400px;
}
.melt-meter-label{
  text-align:center;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--ak-ink-soft);
  margin-top:.75rem;
}
.melt-legend{
  display:flex;
  justify-content:space-between;
  margin-top:1.1rem;
  padding-top:1.1rem;
  border-top:1px dashed rgba(28,25,23,0.15);
}
.melt-legend div{ text-align:center; flex:1; }
.melt-legend strong{ display:block; font-family:var(--font-display); font-size:1.1rem; color:var(--ak-amber-dark); }
.melt-legend span{ font-size:.7rem; color:var(--ak-ink-soft); text-transform:uppercase; letter-spacing:.05em; }

/* ---------- Image placeholder ---------- */
.image-placeholder{
  background:repeating-linear-gradient(135deg, #FDECC8, #FDECC8 12px, #FCE3AE 12px, #FCE3AE 24px);
  border:1px dashed var(--ak-amber-dark);
  border-radius:var(--radius-md);
  display:flex; align-items:center; justify-content:center; text-align:center;
  color:var(--ak-ink-soft);
  font-size:.78rem;
  padding:1rem;
  width:100%;
}
.image-placeholder .ph-title{ font-weight:700; color:var(--ak-stone); display:block; margin-bottom:.25rem; }

/* ---------- Trust strip ---------- */
.trust-icon{
  width:64px; height:64px; margin:0 auto 0.85rem;
  display:flex; align-items:center; justify-content:center;
  border-radius:50%;
  background:rgba(28,25,23,0.06);
  color:var(--ak-amber-dark);
}
.section-stone .trust-icon{ background:rgba(255,255,255,0.1); color:var(--ak-amber); }
.section-amber .trust-icon{ background:rgba(28,25,23,0.08); }
.trust-card{ text-align:center; }
.trust-card h4{ font-size:1rem; margin-bottom:.4rem; }
.trust-card p{ font-size:.86rem; margin:0; }

/* ---------- Reviews ---------- */
.review-card{
  background:var(--ak-white);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-card);
  padding:1.6rem;
  height:100%;
  border-top:3px solid var(--ak-amber);
}
.review-stars{ color:var(--ak-amber-dark); letter-spacing:2px; }
.review-avatar{
  width:52px; height:52px; border-radius:50%;
  background:var(--ak-cream-2);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-weight:700; color:var(--ak-amber-dark);
}
.verified-tag{ font-size:.72rem; font-weight:700; color:var(--ak-sage); text-transform:uppercase; letter-spacing:.04em; }

/* ---------- Ingredient rows ---------- */
.ingredient-row{ display:flex; gap:1.25rem; padding:1.4rem 0; border-bottom:1px solid rgba(28,25,23,0.08); }
.ingredient-num{
  width:42px; height:42px; flex-shrink:0; border-radius:50%;
  background:var(--ak-amber);
  color:var(--ak-stone);
  display:flex; align-items:center; justify-content:center;
  font-weight:800; font-family:var(--font-display);
}

/* ---------- Pricing ---------- */
.price-card{
  background:var(--ak-white);
  border-radius:var(--radius-lg);
  border:2px solid transparent;
  box-shadow:var(--shadow-card);
  padding:2rem 1.5rem;
  text-align:center;
  height:100%;
  position:relative;
  transition:transform .18s ease;
}
.price-card:hover{ transform:translateY(-4px); }
.price-card.popular{ border-color:var(--ak-amber-dark); }
.price-card .ribbon{
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  background:var(--ak-stone); color:var(--ak-amber);
  font-size:.72rem; font-weight:700; letter-spacing:.05em;
  padding:.35rem 1rem; border-radius:50px; white-space:nowrap;
}
.price-card .plan-name{ font-family:var(--font-display); font-size:1.2rem; margin-bottom:.25rem; }
.price-card .plan-supply{ font-size:.85rem; color:var(--ak-ink-soft); margin-bottom:1.1rem; }
.price-card .big-price{ font-family:var(--font-display); font-size:2.6rem; color:var(--ak-amber-dark); line-height:1; }
.price-card .per-bottle{ font-size:.85rem; color:var(--ak-ink-soft); }
.price-card .total-line{ font-size:.85rem; margin:.9rem 0; color:var(--ak-ink-soft); }
.price-card .strike{ text-decoration:line-through; opacity:.55; }

/* ---------- Guarantee ---------- */
.guarantee-seal{
  width:150px; height:150px; border-radius:50%;
  background:radial-gradient(circle at 35% 30%, var(--ak-amber), var(--ak-amber-dark) 70%);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  color:var(--ak-stone); font-family:var(--font-display);
  box-shadow:var(--shadow-soft);
  text-align:center; margin:0 auto;
}
.guarantee-seal .days{ font-size:2.1rem; font-weight:800; line-height:1; }
.guarantee-seal .small{ font-size:.65rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }

/* ---------- FAQ ---------- */
.accordion-button{ font-family:var(--font-body); font-weight:600; }
.accordion-button:not(.collapsed){ color:var(--ak-amber-dark); background:var(--ak-cream-2); }
.accordion-button:focus{ box-shadow:0 0 0 3px rgba(217,119,6,0.25); }

/* ---------- Footer ---------- */
.ak-footer{ background:var(--ak-stone); color:rgba(255,251,235,0.75); padding:3.5rem 0 1.5rem; }
.ak-footer a{ color:rgba(255,251,235,0.75); }
.ak-footer a:hover{ color:var(--ak-amber); }
.ak-footer h5{ color:var(--ak-white); font-family:var(--font-display); margin-bottom:1rem; }
.ak-footer .legal-links a{ display:block; margin-bottom:.5rem; font-size:.88rem; }
.footer-disclaimer{ font-size:.78rem; opacity:.6; border-top:1px solid rgba(255,255,255,0.1); padding-top:1.25rem; margin-top:2rem; }

/* ---------- Sticky CTA ---------- */
.sticky-cta{
  position:fixed; bottom:0; left:0; right:0;
  background:var(--ak-stone);
  padding:.75rem 1rem;
  z-index:1000;
  display:none;
  align-items:center; justify-content:space-between;
  box-shadow:0 -8px 24px rgba(0,0,0,0.25);
}
.sticky-cta.show{ display:flex; }
.sticky-cta span{ color:var(--ak-amber); font-size:.85rem; font-weight:600; }

/* ---------- Utility ---------- */
.section-title{ margin-bottom:2.75rem; }
.divider-amber{ width:60px; height:3px; background:var(--ak-amber-dark); border-radius:3px; margin:0.9rem 0 1.4rem; }
.section-stone .divider-amber,.section-amber .divider-amber{ background:var(--ak-stone); }
