:root {
  --cream: #f3f4eb;
  --forest: #294135;
  --sage: #6c7c56;
  --gold: #c8a96b;
  --leaf: #dfe6d0;
  --white: #fffef9;
  --line: rgba(41,65,53,.16);
  --serif: Georgia, "Times New Roman", serif;
  --sans: "Trebuchet MS", ui-sans-serif, system-ui, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--cream); color: var(--forest); font-family: var(--sans); line-height: 1.68; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 4px; }
.wrap { width: min(1160px, calc(100% - 42px)); margin-inline: auto; }
.skip-link { position: fixed; left: 12px; top: 12px; z-index: 1000; transform: translateY(-170%); padding: 10px 14px; border-radius: 12px; background: var(--forest); color: #fff; text-decoration: none; }
.skip-link:focus { transform: translateY(0); }
.soft-banner { min-height: 34px; display: grid; place-items: center; padding: 7px 18px; background: var(--forest); color: #eef3e7; font-size: .68rem; font-weight: 700; letter-spacing: .09em; text-align: center; text-transform: uppercase; }
.natural-header { position: sticky; top: 0; z-index: 60; border-bottom: 1px solid transparent; background: rgba(243,244,235,.90); backdrop-filter: blur(16px); transition: box-shadow .25s, border-color .25s; }
.natural-header.scrolled { border-color: var(--line); box-shadow: 0 12px 34px rgba(41,65,53,.08); }
.nav-wrap { min-height: 78px; display: grid; grid-template-columns: 1fr auto 1fr; gap: 28px; align-items: center; }
.natural-brand { width: min(280px,100%); }
.natural-brand img { width: 100%; height: auto; }
.nav-wrap nav { display: flex; gap: 26px; }
.nav-wrap nav a { font-size: .84rem; font-weight: 750; text-decoration: none; }
.nav-wrap > .leaf-button { justify-self: end; }
.leaf-button { display: inline-flex; min-height: 53px; align-items: center; justify-content: center; gap: 12px; padding: 0 25px; border: 1px solid var(--forest); border-radius: 58% 42% 55% 45% / 48% 55% 45% 52%; background: var(--forest); color: #fff; font-weight: 800; text-decoration: none; box-shadow: 0 13px 30px rgba(41,65,53,.16); transition: transform .2s, border-radius .25s, background .2s; }
.leaf-button:hover { transform: translateY(-2px); border-radius: 45% 55% 43% 57% / 55% 45% 55% 45%; background: #1f352b; }
.leaf-button.compact { min-height: 43px; padding-inline: 18px; font-size: .78rem; box-shadow: none; }
.natural-hero { position: relative; overflow: hidden; padding: clamp(62px,8vw,112px) 0 100px; background: radial-gradient(circle at 8% 25%, rgba(223,230,208,.82), transparent 32%), linear-gradient(180deg,var(--cream),#ecefdf); }
.natural-hero::before { content: ''; position: absolute; width: 650px; height: 650px; right: -320px; bottom: -330px; border: 1px solid rgba(108,124,86,.18); border-radius: 46% 54% 57% 43% / 43% 47% 53% 57%; box-shadow: inset 0 0 0 65px rgba(108,124,86,.035), inset 0 0 0 130px rgba(108,124,86,.025); }
.hero-layout { display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: clamp(44px,7vw,90px); }
.overline { margin: 0 0 14px; color: var(--sage); font-size: .69rem; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
h1,h2,h3 { margin-top: 0; font-family: var(--serif); font-weight: 500; line-height: 1.08; letter-spacing: -.025em; }
h1 { max-width: 720px; margin-bottom: 24px; font-size: clamp(3rem,6.4vw,5.9rem); }
h2 { margin-bottom: 20px; font-size: clamp(2.25rem,4.7vw,4.3rem); }
h3 { margin-bottom: 10px; font-size: 1.35rem; }
p { margin-top: 0; }
.intro { max-width: 670px; color: #4c6255; font-size: clamp(1.04rem,1.8vw,1.2rem); }
.natural-copy blockquote { max-width: 620px; margin: 28px 0 0; padding: 18px 22px; border: 0; border-left: 3px solid var(--gold); background: rgba(255,254,249,.55); }
.natural-copy blockquote span { display: block; margin-bottom: 5px; color: var(--sage); font-size: .65rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.natural-copy blockquote p { margin: 0; font-family: var(--serif); font-size: 1.12rem; }
.natural-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; margin-top: 30px; }
.quiet-link { font-family: var(--serif); font-style: italic; text-underline-offset: 5px; }
.affiliate-note { margin: 18px 0 0; color: #6d7a70; font-size: .74rem; }
.botanical-visual { position: relative; }
.organic-frame { overflow: hidden; border: 9px solid rgba(255,254,249,.76); border-radius: 44% 56% 48% 52% / 53% 43% 57% 47%; box-shadow: 0 30px 75px rgba(41,65,53,.15); transform: rotate(-1.5deg); }
.botanical-picture { display: block; }
.botanical-picture img { width: 100%; aspect-ratio: 1.385/1; object-fit: cover; }
.plant-tag { position: absolute; right: -16px; bottom: 6%; width: min(280px,67%); display: grid; grid-template-columns: 35px 1fr; gap: 12px; padding: 16px 18px; border: 1px solid rgba(41,65,53,.13); border-radius: 22px 10px 22px 10px; background: rgba(255,254,249,.93); box-shadow: 0 18px 40px rgba(41,65,53,.13); }
.plant-tag > span { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 50%; background: var(--leaf); color: var(--forest); }
.plant-tag p { margin: 0; font-size: .76rem; line-height: 1.4; }
.floating-leaf { position: absolute; z-index: 1; width: 86px; height: 42px; border-radius: 100% 0 100% 0; background: rgba(108,124,86,.17); pointer-events: none; }
.leaf-a { left: 3%; top: 20%; transform: rotate(32deg); }
.leaf-b { right: 4%; top: 12%; width: 56px; height: 28px; transform: rotate(-24deg); }
.answer-band { border-block: 1px solid var(--line); background: var(--white); }
.answer-grid { display: grid; grid-template-columns: 1.2fr repeat(4,1fr); align-items: stretch; }
.answer-grid > * { margin: 0; padding: 21px 18px; font-size: .76rem; }
.answer-grid > * + * { border-left: 1px solid var(--line); }
.answer-grid > span { color: var(--sage); font-weight: 900; letter-spacing: .13em; }
.answer-grid p { font-family: var(--serif); }
.organic-section { padding: clamp(82px,10vw,132px) 0; background: var(--white); }
.understand-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 80px; align-items: center; }
.section-copy > p:not(.overline) { max-width: 720px; color: #53695b; }
.circle-stack { position: relative; min-height: 530px; }
.circle-card { position: absolute; display: grid; place-items: center; align-content: center; width: 255px; height: 255px; padding: 28px; border: 1px solid rgba(41,65,53,.15); border-radius: 50%; text-align: center; box-shadow: 0 18px 44px rgba(41,65,53,.08); }
.circle-card.one { left: 3%; top: 2%; background: #eef1df; }
.circle-card.two { right: 1%; top: 28%; background: #f2e8cf; }
.circle-card.three { left: 12%; bottom: 0; background: #e2ead7; }
.circle-card span { color: var(--sage); font-size: .65rem; font-weight: 900; letter-spacing: .12em; }
.circle-card strong { margin: 8px 0; font-family: var(--serif); font-size: 1.65rem; font-weight: 500; }
.circle-card small { max-width: 130px; color: #667468; font-size: .72rem; }
.choose-section { padding: 118px 0; background: #e8ebdc; }
.natural-heading { max-width: 800px; margin-bottom: 48px; }
.natural-heading.narrow { max-width: 680px; }
.natural-heading > p:last-child { color: #5c6f61; }
.question-garden { display: grid; grid-template-columns: repeat(2,1fr); gap: 15px; }
.question-garden article { display: grid; grid-template-columns: 50px 1fr; gap: 20px; padding: 28px; border: 1px solid var(--line); border-radius: 30px 8px 30px 8px; background: rgba(255,254,249,.84); }
.question-garden article:nth-child(even) { border-radius: 8px 30px 8px 30px; }
.question-garden article > span { display: grid; width: 45px; height: 45px; place-items: center; border-radius: 50% 50% 50% 7px; background: var(--leaf); color: var(--sage); font-size: .7rem; font-weight: 900; }
.question-garden p { margin: 0; color: #596c5e; font-size: .89rem; }
.natural-warning { padding: 74px 0; background: var(--gold); }
.warning-card { display: grid; grid-template-columns: 100px 1fr; gap: 36px; align-items: center; }
.warning-icon { display: grid; width: 94px; height: 94px; place-items: center; border: 1px solid rgba(41,65,53,.35); border-radius: 50% 45% 50% 45%; font-family: var(--serif); font-size: 2.7rem; }
.warning-card h2 { margin-bottom: 12px; font-size: clamp(2.15rem,4vw,3.8rem); }
.warning-card p:last-child { max-width: 850px; margin: 0; }
.rhythm-section { padding: 118px 0; background: var(--cream); }
.rhythm-layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: 80px; }
.rhythm-layout header > p:last-child { color: #5c6f61; }
.day-path { position: relative; display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.day-path::before { content: ''; position: absolute; left: 61px; top: 25px; bottom: 25px; width: 1px; background: var(--line); }
.day-path li { position: relative; display: grid; grid-template-columns: 122px 1fr; gap: 24px; padding: 20px 0; }
.day-path li > span { position: relative; z-index: 1; align-self: start; width: 104px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 999px; background: var(--cream); color: var(--sage); font-size: .67rem; font-weight: 900; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.day-path h3 { font-size: 1.28rem; }
.day-path p { margin: 0; color: #5d6f62; font-size: .89rem; }
.product-meadow { position: relative; overflow: hidden; padding: 118px 0; background: var(--forest); color: #f6f4e9; }
.meadow-shape { position: absolute; right: -140px; bottom: -230px; width: 620px; height: 620px; border: 1px solid rgba(223,230,208,.16); border-radius: 54% 46% 61% 39% / 42% 57% 43% 58%; box-shadow: inset 0 0 0 70px rgba(223,230,208,.025), inset 0 0 0 140px rgba(223,230,208,.02); }
.product-layout { position: relative; display: grid; grid-template-columns: 1.12fr .88fr; gap: 75px; align-items: center; }
.product-copy > p:not(.overline) { max-width: 720px; color: #cfd8ca; }
.product-copy .overline { color: #cdb77e; }
.product-facts { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; margin: 30px 0; }
.product-facts p { margin: 0; padding: 15px 16px; border: 1px solid rgba(255,255,255,.14); border-radius: 18px 7px 18px 7px; color: #e7ede2; font-size: .82rem; }
.product-facts span { display: block; margin-bottom: 4px; color: #cdb77e; font-size: .6rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.leaf-button.dark { border-color: var(--gold); background: var(--gold); color: var(--forest); }
.decision-branch { padding: 32px; border: 1px solid rgba(255,255,255,.17); border-radius: 42px 12px 42px 12px; background: rgba(255,255,255,.06); }
.decision-branch h3 { margin-bottom: 26px; font-size: 1.7rem; }
.decision-branch > div { display: grid; grid-template-columns: 1fr auto; gap: 10px 18px; padding: 17px 0; border-top: 1px solid rgba(255,255,255,.12); }
.decision-branch span { font-weight: 750; }
.decision-branch b { color: #cdb77e; font-size: .65rem; letter-spacing: .12em; }
.decision-branch p { grid-column: 1/-1; margin: 0; color: #cbd5c6; font-size: .82rem; }
.decision-branch .stop b { color: #f3b8a0; }
.who-section { padding: 110px 0; background: var(--white); }
.care-leaves { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
.care-leaves article { padding: 28px 22px; border: 1px solid var(--line); border-radius: 36px 8px 36px 8px; background: var(--cream); }
.care-leaves article:nth-child(even) { transform: translateY(22px); border-radius: 8px 36px 8px 36px; }
.care-leaves p { margin: 0; color: #5d6e61; font-size: .83rem; }
.natural-faq { padding: 118px 0; background: #e8ebdc; }
.faq-natural-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 78px; }
.faq-natural-grid header > p:last-child { color: #5c6d60; }
.natural-questions { border-top: 1px solid var(--line); }
details { border-bottom: 1px solid var(--line); }
summary { display: grid; grid-template-columns: 1fr 30px; gap: 20px; align-items: center; padding: 23px 0; cursor: pointer; list-style: none; font-family: var(--serif); font-size: 1.14rem; }
summary::-webkit-details-marker { display: none; }
summary span { position: relative; width: 28px; height: 28px; border: 1px solid var(--sage); border-radius: 50%; }
summary span::before, summary span::after { content: ''; position: absolute; left: 7px; right: 7px; top: 13px; height: 1px; background: var(--sage); }
summary span::after { transform: rotate(90deg); transition: transform .2s; }
details[open] summary span::after { transform: rotate(0); }
details > p { margin: -4px 46px 24px 0; color: #596b5d; }
.natural-final { padding: 46px 0 90px; background: #e8ebdc; }
.final-leaf-card { display: grid; grid-template-columns: 1fr auto; gap: 50px; align-items: center; padding: clamp(34px,6vw,64px); border-radius: 50px 12px 50px 12px; background: var(--sage); color: #fff; }
.final-leaf-card h2 { max-width: 750px; }
.final-leaf-card p:not(.overline) { max-width: 720px; margin-bottom: 0; color: #edf0e8; }
.final-leaf-card .overline { color: #f1dca9; }
.leaf-button.light { border-color: #fff; background: #fff; color: var(--forest); white-space: nowrap; }
.natural-legal { padding: 76px 0; background: var(--cream); border-top: 1px solid var(--line); }
.legal-leaves { display: grid; grid-template-columns: repeat(3,1fr); gap: 36px; }
.legal-leaves h2 { font-family: var(--sans); font-size: .75rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.legal-leaves p { margin: 0; color: #617064; font-size: .78rem; }
.natural-footer { padding: 40px 0; background: var(--white); }
.natural-footer > div { display: grid; grid-template-columns: .75fr 1fr auto; gap: 30px; align-items: center; }
.natural-footer img { max-width: 250px; }
.natural-footer p { margin: 0; color: #677468; font-size: .76rem; }
.natural-footer nav { display: flex; gap: 18px; }
.natural-footer nav a { font-size: .78rem; }
.mobile-leaf-cta { display: none; }
[data-grow] { opacity: 0; transform: translateY(20px) scale(.985); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.75,.2,1); }
[data-grow].grown { opacity: 1; transform: none; }
@media (max-width: 1000px) {
  .nav-wrap { grid-template-columns: 1fr auto; }
  .nav-wrap nav { display: none; }
  .hero-layout, .understand-grid, .rhythm-layout, .product-layout, .faq-natural-grid { grid-template-columns: 1fr; }
  .circle-stack { width: min(620px,100%); margin-inline: auto; }
  .care-leaves { grid-template-columns: repeat(2,1fr); }
  .natural-footer > div { grid-template-columns: 1fr 1fr; }
  .natural-footer nav { grid-column: 1/-1; }
}
@media (max-width: 720px) {
  body { padding-bottom: 72px; }
  .wrap { width: min(1160px, calc(100% - 28px)); }
  .soft-banner { font-size: .58rem; }
  .nav-wrap { min-height: 68px; }
  .natural-brand { width: min(225px,58vw); }
  .nav-wrap > .leaf-button { display: none; }
  .natural-hero { padding-top: 52px; }
  h1 { font-size: clamp(2.9rem,14vw,4.8rem); }
  .natural-actions { align-items: stretch; flex-direction: column; }
  .natural-actions .leaf-button { width: 100%; }
  .quiet-link { text-align: center; }
  .plant-tag { right: -2px; bottom: 3%; }
  .answer-grid { grid-template-columns: 1fr; }
  .answer-grid > * + * { border-left: 0; border-top: 1px solid var(--line); }
  .organic-section, .choose-section, .rhythm-section, .product-meadow, .who-section, .natural-faq { padding-block: 80px; }
  .circle-stack { min-height: 690px; }
  .circle-card { width: 220px; height: 220px; }
  .circle-card.one { left: 0; }
  .circle-card.two { right: 0; top: 34%; }
  .circle-card.three { left: 5%; }
  .question-garden, .product-facts, .care-leaves, .legal-leaves { grid-template-columns: 1fr; }
  .warning-card { grid-template-columns: 1fr; gap: 20px; }
  .warning-icon { width: 72px; height: 72px; font-size: 2rem; }
  .day-path li { grid-template-columns: 92px 1fr; gap: 14px; }
  .day-path::before { left: 46px; }
  .day-path li > span { width: 82px; padding-inline: 6px; }
  .care-leaves article:nth-child(even) { transform: none; }
  .final-leaf-card { grid-template-columns: 1fr; gap: 25px; padding: 30px 24px; }
  .final-leaf-card .leaf-button { width: 100%; }
  .natural-footer > div { grid-template-columns: 1fr; }
  .natural-footer nav { grid-column: auto; flex-wrap: wrap; }
  .mobile-leaf-cta { position: fixed; left: 9px; right: 9px; bottom: 9px; z-index: 90; display: flex; min-height: 54px; align-items: center; justify-content: center; gap: 12px; border-radius: 18px 7px 18px 7px; background: var(--forest); color: #fff; font-weight: 850; text-decoration: none; box-shadow: 0 15px 40px rgba(41,65,53,.30); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  [data-grow] { opacity: 1; transform: none; }
  .floating-leaf { display: none; }
}