/* =========================================================
   /01-nutra-page — botanical-natural preset (scoped to body.preset-botanical)
   Green / beige / earth palette · organic morphing blobs · glass ML-card hero
   · animated count-up trust · botanical section gradients · leaf-rounded buttons
   Activates ONLY on pages with body.preset-botanical (home). All other pages unaffected.
   ========================================================= */

body.preset-botanical {
  /* Botanical structure (organic blobs + warm earth bg) over the GLOBAL jade palette.
     --color-primary stays jade #00A878 (inherited) so home is consistent with the rest of the site. */
  --bot-forest: var(--color-primary-dark, #00795A);
  --bot-moss: var(--color-primary, #00A878);
  --bot-cream: #FBF7EF;
  --bot-sand: #F0EAD9;
  --bot-clay: #C9A87A;
  --bot-leaf: #5DD3A8;
  background:
    radial-gradient(1200px 600px at 80% -5%, #e6f6ef 0%, transparent 60%),
    radial-gradient(900px 500px at -5% 10%, #f4efe2 0%, transparent 55%),
    var(--bot-cream);
}

/* ---------- Display font feel: warmer, organic ---------- */
body.preset-botanical h1,
body.preset-botanical h2,
body.preset-botanical h3,
body.preset-botanical .heading-accent {
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  letter-spacing: -0.02em;
}
body.preset-botanical .heading-accent::after {
  background: linear-gradient(90deg, var(--bot-forest), var(--bot-leaf));
}

/* ---------- HERO: glass ML-card + morphing organic blobs ---------- */
body.preset-botanical .modern-hero-preset {
  position: relative;
  overflow: clip;
  background: linear-gradient(160deg, #eef5e6 0%, #f7f4ec 55%, #f0ead9 100%);
  padding-block: 64px 72px;
}
body.preset-botanical .hero-blobs {
  position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: clip;
}
body.preset-botanical .hero-blobs .blob {
  position: absolute; border-radius: 42% 58% 63% 37% / 47% 42% 58% 53%;
  filter: blur(2px); opacity: .55;
  animation: blobMorph 18s ease-in-out infinite;
}
body.preset-botanical .blob-1 { width: 420px; height: 420px; top: -120px; left: -80px;
  background: radial-gradient(circle at 30% 30%, #cfe6b8, #8fbc6e); animation-delay: 0s; }
body.preset-botanical .blob-2 { width: 340px; height: 340px; top: 40px; right: -100px;
  background: radial-gradient(circle at 60% 40%, #e7d9b8, #c9a87a); opacity: .42; animation-delay: -4s; }
body.preset-botanical .blob-3 { width: 280px; height: 280px; bottom: -100px; left: 30%;
  background: radial-gradient(circle at 40% 60%, #bfe0c4, #4a7c52); opacity: .35; animation-delay: -9s; }
body.preset-botanical .blob-4 { width: 200px; height: 200px; top: 30%; left: 45%;
  background: radial-gradient(circle at 50% 50%, #f0e6cf, #ddc9a0); opacity: .3; animation-delay: -13s; }
body.preset-botanical .hero-blobs .leaf {
  position: absolute; font-size: 2.2rem; opacity: .5; animation: leafFloat 9s ease-in-out infinite;
}
body.preset-botanical .leaf-1 { top: 18%; right: 12%; animation-delay: -2s; }
body.preset-botanical .leaf-2 { bottom: 20%; left: 8%; animation-delay: -5s; font-size: 1.7rem; }

@keyframes blobMorph {
  0%,100% { border-radius: 42% 58% 63% 37% / 47% 42% 58% 53%; transform: translate(0,0) rotate(0deg); }
  33%     { border-radius: 60% 40% 38% 62% / 55% 58% 42% 45%; transform: translate(20px,-18px) rotate(8deg); }
  66%     { border-radius: 38% 62% 55% 45% / 62% 38% 62% 38%; transform: translate(-16px,14px) rotate(-6deg); }
}
@keyframes leafFloat {
  0%,100% { transform: translateY(0) rotate(-6deg); }
  50%     { transform: translateY(-14px) rotate(8deg); }
}

body.preset-botanical .modern-hero-preset .modern-hero-grid { position: relative; z-index: 1; }

/* Glass ML-card around hero content */
body.preset-botanical .glass-card {
  background: rgba(255,255,255,0.72);
  backdrop-filter: saturate(160%) blur(14px);
  -webkit-backdrop-filter: saturate(160%) blur(14px);
  border: 1px solid rgba(255,255,255,0.7);
  border-radius: 24px;
  padding: 32px 30px;
  box-shadow: 0 24px 60px rgba(47,93,58,0.14), inset 0 1px 0 rgba(255,255,255,0.6);
}
body.preset-botanical .glass-card .eyebrow {
  background: var(--bot-forest); color: #fff;
}

/* Floating product with soft shadow */
body.preset-botanical .hero-product-float .modern-hero-product-img {
  filter: drop-shadow(0 30px 50px rgba(47,93,58,0.22));
  animation: productFloat 6s ease-in-out infinite;
}
@keyframes productFloat {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-12px); }
}

/* ---------- Botanical section gradients (override blue/cyan/purple) ---------- */
body.preset-botanical .sec-gradient-blue   { background: linear-gradient(180deg, #eef5e6 0%, #ffffff 100%); }
body.preset-botanical .sec-gradient-cyan   { background: linear-gradient(180deg, #f4efe2 0%, #ffffff 100%); }
body.preset-botanical .sec-gradient-purple { background: linear-gradient(180deg, #e8f0de 0%, #ffffff 100%); }
body.preset-botanical .sec-gradient-green  { background: linear-gradient(180deg, #e3ecd9 0%, #ffffff 100%); }

/* ---------- Trust bar — botanical + count-up emphasis ---------- */
body.preset-botanical .trust-bar {
  background: linear-gradient(180deg, #f7f4ec 0%, #f0ead9 100%);
  border-block: 1px solid #e3dcc8;
}
body.preset-botanical .trust-bar-item strong,
body.preset-botanical .counter-number {
  color: var(--bot-forest);
  font-variant-numeric: tabular-nums;
}

/* ---------- Buttons — leaf-rounded botanical green ---------- */
body.preset-botanical .btn-primary {
  background: linear-gradient(135deg, var(--bot-forest), var(--bot-moss));
  border-radius: 14px 22px 14px 22px;
  box-shadow: 0 8px 22px rgba(47,93,58,0.28);
}
body.preset-botanical .btn-primary:hover {
  box-shadow: 0 12px 30px rgba(47,93,58,0.34);
}
body.preset-botanical .price-save-chip { background: #e3ecd9; color: var(--bot-forest); }
body.preset-botanical .price-now { color: var(--bot-forest); }

/* ---------- Card accents ---------- */
body.preset-botanical .mechanism-card.is-main { border-color: var(--bot-forest); background: linear-gradient(180deg, #ffffff 0%, #f4f8ee 100%); }
body.preset-botanical .answer-pill,
body.preset-botanical .ing-tag,
body.preset-botanical .ing-timeline { background: #e3ecd9; color: var(--bot-forest); }
body.preset-botanical .benefit-icon { background: #e3ecd9 !important; }
body.preset-botanical .timeline-week { background: var(--bot-forest); }
body.preset-botanical .howtake-num { background: linear-gradient(135deg, var(--bot-forest), var(--bot-moss)); }
body.preset-botanical .mid-cta-banner { background: linear-gradient(135deg, var(--bot-forest) 0%, var(--bot-moss) 100%); }
body.preset-botanical .order-final { background: linear-gradient(135deg, #2f5d3a 0%, #4a7c52 50%, #2f5d3a 100%); }
body.preset-botanical .order-save { color: var(--bot-forest); }
body.preset-botanical .who-card::before { color: var(--bot-leaf); }

/* ---------- Mobile: tame blobs (perf + no overflow) ---------- */
@media (max-width: 767px) {
  body.preset-botanical .modern-hero-preset { padding-block: 36px 44px; }
  body.preset-botanical .hero-blobs .blob { opacity: .35; filter: blur(4px); }
  body.preset-botanical .blob-4, body.preset-botanical .hero-blobs .leaf { display: none; }
  body.preset-botanical .glass-card { padding: 22px 18px; border-radius: 18px; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  body.preset-botanical .blob,
  body.preset-botanical .leaf,
  body.preset-botanical .hero-product-float .modern-hero-product-img { animation: none !important; }
}