/* ============================================================
   RESETAGE — Women's Health soft wine theme
   Applied to /womens-health.html and /protocols/{restore,bloom,
   radiance,hormone-entry,female-libido,scream-cream}.html
   ============================================================ */

:root {
  --w-deep:    #8E6470;  /* wine */
  --w-mauve:   #A88088;  /* dusty mauve */
  --w-mauve-2: #C9A5A8;  /* lighter mauve */
  --w-rose:    #D4B5B5;  /* warm cream-rose */
  --w-cream:   #F0E5E2;  /* light cream rose */
  --w-cream-2: #FAF5F3;  /* warm cream (page bg) */
  --w-ink:     #3D2530;  /* deep wine-charcoal */
  --w-ink-2:   #6B4954;  /* warm wine grey */
  --w-muted:   #8C6B72;
  --w-burnt:   #6E4A55;  /* hover dark wine */
}

/* ---------- Page body & global text -------------------------- */
html, body { background: var(--w-cream-2) !important; }
body {
  color: var(--w-ink) !important;
  background: var(--w-cream-2) !important;
}
body::before { display: none !important; }

/* Kill any saturated pink/rose tokens used elsewhere */
:root {
  --pink: var(--w-rose);
  --rose: var(--w-rose);
  --women-soft:  var(--w-cream);
  --women-blush: var(--w-rose);
  --women-rose:  var(--w-mauve-2);
  --women-deep:  var(--w-deep);
  --women-dust:  var(--w-mauve);
  --women-burnt: var(--w-burnt);
  --women-ink:   var(--w-ink);
  --cream:       var(--w-cream-2);
  --cream-2:     var(--w-cream);
}

/* ---------- Hero (multi-stop wine gradient) ------------------ */
body section.hero,
body .hero,
body .hero-section,
body .product-hero,
body .split {
  background: linear-gradient(180deg,
    #8E6470 0%,
    #A88088 35%,
    #D4B5B5 70%,
    #F0E5E2 100%) !important;
  color: var(--w-cream-2) !important;
  position: relative;
}
body section.hero::before,
body .hero::before { display: none !important; content: none !important; background: none !important; }

/* Hero typography: regular weight, cream */
body .hero h1,
body section.hero h1,
body .product-hero h1,
body .split .detail h1 {
  color: var(--w-cream-2) !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.1 !important;
}
body .hero h1 .accent,
body section.hero h1 .accent,
body .split .detail h1 .accent { color: var(--w-cream) !important; }

body .hero p, body .hero .lead, body .hero p.lead,
body section.hero p, body .product-hero p,
body .split .detail .desc p, body .split .detail .cat {
  color: rgba(250, 245, 243, 0.88) !important;
  font-weight: 400 !important;
}
.hero .micro, .hero-cta-row .micro {
  color: var(--w-ink) !important;
  opacity: 0.85;
  font-weight: 500 !important;
}
.hero-bullets li { color: var(--w-cream-2) !important; }
.hero-bullets li::before {
  background: var(--w-cream-2) !important;
  color: var(--w-deep) !important;
}
.crumb, .crumb a { color: rgba(250, 245, 243, 0.78) !important; }

/* ---------- Section backgrounds (smooth flow) ---------------- */
.section, section.section, .products, section.block, .block {
  background: var(--w-cream-2) !important;
  color: var(--w-ink) !important;
  position: relative;
}

/* Mid-tone band — applied to PRODUCTS section */
.products, section.products {
  background: linear-gradient(180deg,
    #F0E5E2 0%,
    #E4D0CF 100%) !important;
}

/* Light band — FAQ / final CTA / who-for */
.faq, section.faq, .final-cta, .who-for, .whofor {
  background: linear-gradient(180deg,
    #F0E5E2 0%,
    #FAF5F3 100%) !important;
}

/* Smooth transition strips between sections */
.section + .section::before,
.products + .section::before,
.section + .products::before,
.section + .faq::before,
.faq + .final-cta::before {
  content: "";
  display: block;
  height: 80px;
  margin-top: -80px;
  background: linear-gradient(180deg,
    rgba(168, 128, 136, 0) 0%,
    rgba(201, 165, 168, 0.35) 100%);
  pointer-events: none;
}

/* Headlines / body on light sections */
.section h2, section h2, .section-head-center h2 {
  color: var(--w-ink) !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.1 !important;
}
.section h2 .accent, section h2 .accent { color: var(--w-deep) !important; }
.section .lead, .section p.lead, .section p,
.intro-text p, .intro-text p:last-child {
  color: var(--w-ink-2) !important;
}

/* ---------- Cards ------------------------------------------- */
.product-card, .pcard, .whofor-col, .step, .faq-item,
.calc-card, .intro-panel, .metric-card, .faq-list details {
  background: rgba(255, 255, 255, 0.72) !important;
  border: 1px solid rgba(142, 100, 112, 0.14) !important;
  box-shadow:
    0 20px 50px -25px rgba(61, 37, 48, 0.22),
    0 4px 12px -6px rgba(61, 37, 48, 0.08) !important;
}
.product-card h3, .pcard h3, .step h3, .whofor-col h3 {
  color: var(--w-ink) !important;
  font-weight: 500 !important;
}
.product-card p, .product-card .tagline, .product-card .best-for,
.pcard .strength, .pcard .benefit, .step p, .whofor-col li {
  color: var(--w-ink-2) !important;
}
.product-visual, .product-visual.sv-photo-wrap, .pcard-img {
  background: linear-gradient(140deg, #F0E5E2, #FAF5F3) !important;
}
.product-card .price-main,
.product-card span[style*="font-weight:800"] { color: var(--w-ink) !important; }
.product-card .tier-tag, .product-card .price-tag, .price-tag {
  background: rgba(142, 100, 112, 0.10) !important;
  color: var(--w-deep) !important;
}
.product-card .includes li::before,
.whofor-col.yes li::before { color: var(--w-deep) !important; }
.stat-value { color: var(--w-deep) !important; font-weight: 500 !important; }
.stat-label { color: var(--w-ink-2) !important; }
.stat { border-left-color: rgba(142, 100, 112, 0.4) !important; }

/* Step number badge */
.step-num { background: var(--w-deep) !important; color: var(--w-cream-2) !important; }
.step-body { background: rgba(240, 229, 226, 0.55) !important; }

/* ---------- CTA buttons (Hims pill style) -------------------- */
.btn, .btn-primary, .btn-dark, .btn-gold, .add-cart,
.cta, .sel-cta, .btn.btn-primary {
  border-radius: 999px !important;
  padding: 14px 28px !important;
  font-weight: 500 !important;
  font-size: 16px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease !important;
  border: 1px solid transparent !important;
}
/* Wine-tinted pulsing glow for CTAs on women's pages (overrides sage glow) */
@keyframes w-cta-glow {
  0%,100% {
    box-shadow:
      0 0 0 0 rgba(240, 229, 226, .78),
      0 14px 34px -10px rgba(110, 74, 85, .62),
      0 0 22px rgba(212, 181, 181, .72),
      0 0 44px rgba(142, 100, 112, .34);
  }
  50% {
    box-shadow:
      0 0 0 14px rgba(240, 229, 226, 0),
      0 18px 44px -8px rgba(110, 74, 85, .78),
      0 0 34px rgba(240, 229, 226, .9),
      0 0 70px rgba(142, 100, 112, .54);
  }
}

/* Primary CTA on dark/mid gradient (hero) — cream pill */
.hero .btn, .hero .btn-primary, .hero a.btn,
section.hero .btn-primary, .product-hero .btn-primary,
.split .add-cart, .add-cart, .split .btn-dark,
.btn-gold, .cta-glow {
  background: var(--w-cream-2) !important;
  color: var(--w-ink) !important;
  animation: w-cta-glow 2.2s ease-in-out infinite !important;
  box-shadow: 0 0 26px rgba(240, 229, 226, .75), 0 14px 36px -10px rgba(110, 74, 85, .66) !important;
}
.hero .btn:hover, .hero .btn-primary:hover,
.split .add-cart:hover, .add-cart:hover, .split .btn-dark:hover,
.btn-gold:hover, .cta-glow:hover {
  background: #fff !important;
  color: var(--w-ink) !important;
  transform: scale(1.02) !important;
}

/* Secondary translucent CTA on dark/mid */
.hero .btn-ghost, .hero .btn-secondary, section.hero .btn-ghost {
  background: rgba(250, 245, 243, 0.18) !important;
  color: var(--w-cream-2) !important;
  border: 1px solid rgba(250, 245, 243, 0.32) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

/* Primary CTA on light sections — wine pill */
.section .btn-primary, .products .btn-primary,
.final-cta .btn-primary, .faq .btn-primary,
.section .btn, .products .btn, .final-cta .btn,
.rs-steps-cta, .product-card .btn-primary, .btn.btn-primary {
  background: var(--w-deep) !important;
  color: var(--w-cream-2) !important;
  animation: w-cta-glow 2.2s ease-in-out infinite !important;
  box-shadow: 0 0 24px rgba(212, 181, 181, .85), 0 14px 36px -10px rgba(110, 74, 85, .68) !important;
}
.section .btn-primary:hover, .products .btn-primary:hover,
.final-cta .btn-primary:hover, .section .btn:hover,
.rs-steps-cta:hover, .product-card .btn-primary:hover, .btn.btn-primary:hover {
  background: var(--w-burnt) !important;
  color: var(--w-cream-2) !important;
  transform: scale(1.02) !important;
}

/* Commit toggle on protocol pages */
.commit-opt { border-color: rgba(142, 100, 112, 0.30) !important; background: #fff !important; }
.commit-opt:hover { border-color: var(--w-deep) !important; }
.commit-opt.active { background: var(--w-deep) !important; color: var(--w-cream-2) !important; border-color: var(--w-deep) !important; }
.commit-opt .save, .commit-opt.active .save { color: var(--w-cream) !important; }

/* Ingredient pills / category labels on protocol pages */
.ingredient-pills span {
  background: rgba(255, 255, 255, 0.65) !important;
  border-color: rgba(142, 100, 112, 0.22) !important;
  color: var(--w-ink-2) !important;
  border-radius: 999px !important;
}
.detail .cat { color: var(--w-deep) !important; }
.section-divider { color: var(--w-muted) !important; }
.section-divider::before, .section-divider::after { background: rgba(142, 100, 112, 0.25) !important; }
.cat-disc { background: rgba(255, 255, 255, 0.7) !important; border-left-color: var(--w-deep) !important; color: var(--w-ink-2) !important; }
.media { background: linear-gradient(180deg, #F0E5E2, #FAF5F3) !important; }
.media .tier { background: #fff !important; color: var(--w-ink) !important; border-color: rgba(142,100,112,0.18) !important; }
.price-large, .price-large small { color: var(--w-ink) !important; }
.supply, .supply b, .desc p { color: var(--w-ink-2) !important; }
.supply b { color: var(--w-ink) !important; }

/* Trust strip & FAQ accents */
.trust-strip { border-color: rgba(142, 100, 112, 0.18) !important; }
.trust-item .ico { color: var(--w-deep) !important; }
.trust-item span { color: var(--w-ink) !important; }
.faq-item summary { color: var(--w-ink) !important; font-weight: 500 !important; }
.faq-item summary::after { color: var(--w-deep) !important; }
.faq-item p { color: var(--w-ink-2) !important; }

/* Active nav link / breadcrumb */
.nav-links a[href*="womens-health"],
.mobile-menu a[href*="womens-health"] { color: var(--w-deep) !important; }

/* ---------- Typography softening ----------------------------- */
body, p, li { font-weight: 400 !important; letter-spacing: -0.005em; }
h1, h2, h3, .serif, .display {
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
}
.btn, .add-cart { font-weight: 500 !important; }

/* Header stays neutral white */
header {
  background: rgba(255, 255, 255, 0.92) !important;
  border-bottom-color: rgba(142, 100, 112, 0.12) !important;
}

/* Footer untouched (dark) */
footer { background: #000 !important; }

/* ---------- Mobile ------------------------------------------- */
@media (max-width: 768px) {
  .hero h1, section.hero h1, .split .detail h1 {
    font-size: clamp(40px, 10vw, 48px) !important;
  }
  body { background: var(--w-cream-2) !important; }
}
