/* =====================================================================
   US-SODATIDE.US — custom design system (loaded AFTER Bootstrap 5)
   Palette: Sage / Warm Cream / Terracotta Coral / Charcoal
===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Lora:wght@500;600;700&family=Work+Sans:wght@400;500;600;700&display=swap');

:root{
  --sage:#5B7461;
  --sage-dark:#425A47;
  --moss:#3A4A3D;
  --cream:#FBF6EE;
  --cream-deep:#F3E9D8;
  --coral:#D97757;
  --coral-dark:#B85E42;
  --white:#FFFFFF;
  --charcoal:#2B2A26;
  --muted:#6B6A62;
  --line: rgba(43,42,38,.12);
  --line-dark: rgba(251,246,238,.16);
  --radius-lg:20px;
  --radius-md:14px;
  --radius-sm:8px;
  --shadow-soft: 0 20px 48px -28px rgba(43,42,38,.35);
  --shadow-deep: 0 30px 64px -24px rgba(0,0,0,.5);
  --grad-dark: linear-gradient(135deg,#2E3B30 0%,#425A47 55%,#5B7461 100%);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
}

body{
  margin:0;
  font-family:'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size:17px;
  line-height:1.7;
  color:var(--charcoal);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
  padding-bottom:64px; /* space for fixed CTA bar so it never covers content */
}
img{max-width:100%;display:block;height:auto;}
a{color:var(--sage-dark);text-decoration:none;}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
:focus-visible{outline:3px solid var(--coral);outline-offset:3px;}

h1,h2,h3,h4{
  font-family:'Lora', Georgia, serif;
  color:var(--charcoal);
  line-height:1.22;
  margin:0 0 .5em;
  font-weight:700;
}
h1{font-size:clamp(2.2rem,4.6vw,3.6rem);}
h2{font-size:clamp(1.7rem,3.2vw,2.5rem);}
h3{font-size:clamp(1.25rem,2vw,1.6rem);}
p{margin:0 0 1.1em; color:var(--muted); font-size:1.06rem;}
p:last-child{margin-bottom:0;}
strong{color:var(--charcoal);}
ul,ol{padding-left:1.3em; color:var(--muted);}
li{margin-bottom:.5em; font-size:1.06rem;}

.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  text-transform:uppercase; letter-spacing:.14em; font-size:.85rem; font-weight:700;
  color:var(--coral-dark); margin-bottom:14px;
}
.eyebrow::before{content:"";width:20px;height:2px;background:var(--coral);display:inline-block;}
.section-dark .eyebrow{color:#E8C9BA;}

.section-head{max-width:700px; margin:0 0 40px;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}

.seo-link{color:var(--sage-dark); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; text-decoration-color:rgba(217,119,87,.5);}
.seo-link:hover{text-decoration-color:currentColor;}

.skip-link{position:absolute;left:-999px;top:0;background:var(--moss);color:#fff;padding:12px 22px;z-index:9998;border-radius:0 0 8px 0;}
.skip-link:focus{left:0;}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:80;
  background:var(--cream); border-bottom:1px solid transparent;
  transition:box-shadow .2s ease, border-color .2s ease;
}
.site-header.is-scrolled{ box-shadow:0 10px 26px -20px rgba(43,42,38,.4); border-bottom:1px solid var(--line); background:#fff; }
.site-header .inner{display:flex; align-items:center; justify-content:space-between; gap:24px; padding:18px 0;}
.brand{display:flex; align-items:center; gap:10px; font-family:'Lora',serif; font-weight:700; font-size:1.3rem; color:var(--charcoal);}
.brand-mark{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px;height:36px;border-radius:50%; flex-shrink:0;
  background:var(--grad-dark); color:#F3E4D6; font-family:'Lora',serif; font-weight:700; font-size:.9rem;
}
.main-nav{display:flex; align-items:center; gap:28px;}
.main-nav a{color:var(--charcoal); font-weight:500; font-size:.98rem;}
.main-nav a:hover{color:var(--coral-dark);}
.header-cta{
  background:var(--coral); color:#fff !important; padding:11px 24px; border-radius:100px;
  font-weight:600; font-size:.92rem; letter-spacing:.02em;
}
.header-cta:hover{background:var(--coral-dark);}
.nav-toggle{
  display:none; background:none; border:1px solid var(--line); border-radius:8px;
  width:44px;height:44px; align-items:center; justify-content:center; cursor:pointer;
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after{
  content:""; display:block; width:20px; height:2px; background:var(--charcoal); position:relative; transition:transform .2s ease, opacity .2s ease;
}
.nav-toggle span::before{position:absolute; top:-6px;}
.nav-toggle span::after{position:absolute; top:6px;}
.nav-toggle[aria-expanded="true"] span{background:transparent;}
.nav-toggle[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg);}

/* ---------- Buttons (custom names, no Bootstrap collisions) ---------- */
.btn-cta{
  display:inline-flex; align-items:center; justify-content:center; gap:.5em;
  font-family:'Work Sans',sans-serif; font-weight:600; font-size:1rem;
  padding:15px 30px; border-radius:100px; text-decoration:none; border:none; cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn-cta-solid{background:var(--coral); color:#fff; box-shadow:0 16px 30px -16px rgba(217,119,87,.55);}
.btn-cta-solid:hover{background:var(--coral-dark); color:#fff; transform:translateY(-2px);}
.btn-cta-dark{background:var(--moss); color:#fff;}
.btn-cta-dark:hover{background:var(--sage-dark); color:#fff; transform:translateY(-2px);}
.btn-cta-outline{background:transparent; border:2px solid var(--charcoal); color:var(--charcoal);}
.btn-cta-outline:hover{background:var(--charcoal); color:#fff;}
.btn-cta-ghost{background:transparent; border:2px solid rgba(255,255,255,.4); color:#fff;}
.btn-cta-ghost:hover{background:rgba(255,255,255,.14); border-color:#fff; color:#fff;}
.btn-cta-block{width:100%;}

/* ---------- Sections ---------- */
.sect{padding:84px 0;}
.sect-tight{padding:52px 0;}
.sect-white{background:var(--white);}
.sect-cream{background:var(--cream-deep);}
.sect-dark{background:var(--grad-dark); color:#F1EFE8;}
.sect-dark h2, .sect-dark h3{color:#fff;}
.sect-dark p{color:#D7DED8;}
.sect-dark li{color:#D7DED8;}

/* ---------- Hero ---------- */
.hero{padding:56px 0 64px; background:linear-gradient(180deg, var(--cream) 0%, var(--cream-deep) 100%); position:relative; overflow:hidden;}
.hero::before{content:"";position:absolute;right:-180px;top:-160px;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle, rgba(217,119,87,.16), transparent 70%);}
.hero .row{position:relative;z-index:1;}
.hero-badges{display:flex; gap:10px; flex-wrap:wrap; margin:22px 0 26px;}
.hero-badges span{font-size:.85rem; font-weight:600; color:var(--sage-dark); background:rgba(91,116,97,.1); padding:7px 14px; border-radius:100px;}
.hero p.lede{font-size:1.15rem; max-width:54ch;}
.hero-actions{display:flex; gap:16px; flex-wrap:wrap; margin:24px 0 20px;}
.hero-media{position:relative; text-align:center;}
.hero-media img{border-radius:var(--radius-lg); box-shadow:var(--shadow-soft); max-width:80%; margin:0 auto;}
.hero-fact-strip{display:flex; gap:0; margin-top:28px; border-top:1px solid var(--line); padding-top:20px;}
.hero-fact-strip div{flex:1;}
.hero-fact-strip strong{display:block; font-family:'Lora',serif; font-size:1.02rem; color:var(--charcoal);}
.hero-fact-strip span{font-size:.9rem; color:var(--muted);}

/* ---------- Editorial split ---------- */
.pull-quote{border-left:3px solid var(--coral); padding:4px 0 4px 24px; margin:28px 0; font-family:'Lora',serif; font-weight:600; font-size:1.25rem; color:var(--charcoal);}
.stat-row{display:flex; gap:30px; flex-wrap:wrap; margin-top:28px;}
.stat-item{flex:1; min-width:140px;}
.stat-item strong{display:block; font-family:'Lora',serif; font-size:1.6rem; color:var(--coral-dark);}
.stat-item span{font-size:.92rem; color:var(--muted);}

/* ---------- Benefits: TRUE 50/50 alternating rows (Bootstrap grid) ---------- */
.benefit-row{padding:56px 0; border-bottom:1px solid var(--line);}
.benefit-row:last-child{border-bottom:none;}
.benefit-row img{border-radius:var(--radius-lg); box-shadow:var(--shadow-soft); width:100%; height:auto;}
.benefit-num{font-family:'Lora',serif; font-weight:700; font-size:1rem; color:var(--coral-dark); letter-spacing:.06em; margin-bottom:10px; display:block;}
.benefit-row h3{font-size:1.6rem;}

/* ---------- Product profile panel ---------- */
.profile-panel{background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); padding:8px; box-shadow:var(--shadow-soft); max-width:520px; margin:36px auto 0;}
.profile-row{display:flex; justify-content:space-between; align-items:center; padding:16px 22px; border-bottom:1px solid var(--line); font-size:.98rem;}
.profile-row:last-child{border-bottom:none;}
.profile-row .label{color:var(--muted); font-weight:500;}
.profile-row .value{color:var(--charcoal); font-weight:700; font-family:'Lora',serif;}

/* ---------- Routine wheel (morning/daytime/evening/consistency) ---------- */
.routine-wheel{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.routine-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); padding:30px 24px; text-align:center;}
.routine-icon{width:54px;height:54px;border-radius:50%;background:var(--cream-deep);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:1.3rem;}

/* ---------- Formula story (dark) ---------- */
.formula-story{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
.formula-story-media{position:relative; display:flex; justify-content:center;}
.formula-story-media img{max-width:60%;}
.formula-tag-row{display:flex; gap:12px; flex-wrap:wrap; margin-top:24px;}
.formula-tag-row span{font-size:.88rem; font-weight:600; color:#F1EFE8; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); padding:8px 16px; border-radius:100px;}

/* ---------- Ingredient portraits (full-width alternating blocks) ---------- */
.ing-portrait{padding:60px 0; border-bottom:1px solid var(--line);}
.ing-portrait:last-child{border-bottom:none;}
.ing-portrait img{border-radius:var(--radius-lg); box-shadow:var(--shadow-soft); width:100%;}
.ing-portrait .tag{font-family:'Lora',serif;font-weight:700;font-size:.95rem;color:var(--coral-dark);letter-spacing:.04em;margin-bottom:8px;display:block;}

/* ---------- Why choose (editorial checklist over big type) ---------- */
.why-wrap{position:relative;}
.why-bg-type{position:absolute; top:-30px; left:0; font-family:'Lora',serif; font-weight:700; font-size:clamp(3rem,10vw,7rem); color:rgba(43,42,38,.05); white-space:nowrap; z-index:0; user-select:none;}
.why-list{position:relative; z-index:1; display:grid; gap:0;}
.why-item{display:grid; grid-template-columns:56px 1fr; gap:24px; padding:26px 0; border-bottom:1px solid var(--line); align-items:start;}
.why-item:first-child{border-top:1px solid var(--line);}
.why-check{width:36px;height:36px;border-radius:50%;background:var(--sage);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;}

/* ---------- Reviews (editorial photo + quote) ---------- */
.review-feature{display:grid; grid-template-columns:.8fr 1.2fr; gap:48px; align-items:center; margin-bottom:40px;}
.review-feature img{border-radius:var(--radius-lg); box-shadow:var(--shadow-soft);}
.review-feature-quote{font-family:'Lora',serif; font-weight:600; font-size:1.3rem; color:var(--charcoal); line-height:1.4;}
.review-name{font-weight:700; color:var(--charcoal); margin-top:14px;}
.review-loc{font-size:.92rem; color:var(--muted);}

/* ---------- Wellness library (magazine cards) ---------- */
.mag-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.mag-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; text-decoration:none; color:inherit; display:block;}
.mag-card:hover{border-color:var(--coral);}
.mag-card-body{padding:24px;}
.mag-cat{font-size:.82rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--sage-dark); margin-bottom:8px; display:block;}
.mag-card h3{font-size:1.1rem;margin-bottom:6px;}
.mag-card p{font-size:.96rem;margin-bottom:0;}

/* ---------- Package pedestals (pricing section 1) ---------- */
.pedestal-row{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:end;}
.pedestal{background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); padding:30px 26px; text-align:center;}
.pedestal-featured{border:2px solid var(--coral); box-shadow:var(--shadow-soft); transform:translateY(-14px); position:relative;}
.pedestal-badge{position:absolute; top:-14px; left:50%; transform:translateX(-50%); background:var(--coral); color:#fff; font-size:.82rem; font-weight:700; padding:6px 16px; border-radius:100px; white-space:nowrap;}
.pedestal h3{font-size:1.2rem;margin-bottom:2px;}
.pedestal .supply{font-size:.92rem;color:var(--muted);margin-bottom:16px;}
.pedestal img{max-width:70%;margin:0 auto 16px;}
.pedestal .figure{font-family:'Lora',serif;font-weight:700;font-size:2rem;color:var(--charcoal);}
.pedestal .figure span{font-size:.9rem;font-weight:500;color:var(--muted);}
.pedestal .save{display:block;color:var(--coral-dark);font-weight:700;font-size:.92rem;margin:8px 0 18px;}
.pedestal .total{font-size:.92rem;color:var(--muted);margin-bottom:18px;}
.pedestal .total .was{text-decoration:line-through;margin-right:6px;}
.pedestal .total .now{font-weight:700;color:var(--charcoal);}

/* ---------- Guarantee (warm minimalist) ---------- */
.guarantee-wrap{background:var(--cream-deep); border-radius:var(--radius-lg); padding:60px; text-align:center;}
.guarantee-badge-circle{
  width:150px;height:150px;border-radius:50%;background:var(--white); border:2px solid var(--coral);
  display:flex; align-items:center; justify-content:center; margin:0 auto 28px;
  font-family:'Lora',serif; font-weight:700; font-size:1.3rem; color:var(--coral-dark); text-align:center; line-height:1.2;
}

/* ---------- Bonuses ---------- */
.bonus-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.bonus-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); padding:20px; text-align:center;}
.bonus-card img{border-radius:var(--radius-md); margin-bottom:16px;}
.bonus-num{font-family:'Lora',serif;font-weight:700;color:var(--coral-dark);font-size:.92rem;margin-bottom:6px;display:block;}
.bonus-was{text-decoration:line-through;color:var(--muted);font-size:.9rem;}

/* ---------- Final purchase rows (pricing section 2 - horizontal) ---------- */
.package-row{display:grid; grid-template-columns:180px 1fr auto; gap:30px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); padding:26px 30px; margin-bottom:22px;}
.package-row.is-best{border:2px solid var(--coral); box-shadow:var(--shadow-soft); position:relative;}
.package-row-badge{position:absolute; top:-13px; left:30px; background:var(--coral); color:#fff; font-size:.8rem; font-weight:700; padding:5px 14px; border-radius:100px;}
.package-row img{width:100%;}
.package-mid h3{font-size:1.2rem;margin-bottom:4px;}
.package-mid .supply{color:var(--muted);font-size:.95rem;margin-bottom:8px;}
.package-tags{display:flex;gap:8px;flex-wrap:wrap;}
.package-tags span{font-size:.85rem;font-weight:600;color:var(--sage-dark);background:rgba(91,116,97,.1);padding:4px 12px;border-radius:100px;}
.package-right{text-align:right;}
.package-right .figure{font-family:'Lora',serif;font-weight:700;font-size:1.7rem;color:var(--charcoal);}
.package-right .was{text-decoration:line-through;color:var(--muted);font-size:.92rem;margin-right:6px;}
.package-right .save{display:block;color:var(--coral-dark);font-weight:700;font-size:.9rem;margin-bottom:12px;}

/* ---------- Table ---------- */
.table-wrap{overflow-x:auto; border-radius:var(--radius-md); border:1px solid var(--line);}
table{width:100%; border-collapse:collapse; background:var(--white); font-size:.98rem;}
th,td{padding:15px 18px; text-align:left; border-bottom:1px solid var(--line);}
thead th{background:var(--moss); color:#fff; font-family:'Lora',serif; font-weight:700;}
tbody tr:last-child td{border-bottom:none;}
tbody tr:nth-child(even){background:var(--cream-deep);}

/* ---------- FAQ (two-column, custom accordion) ---------- */
.faq-2col{display:grid; grid-template-columns:.9fr 1.1fr; gap:56px; align-items:start;}
.faq-2col img{border-radius:var(--radius-lg); box-shadow:var(--shadow-soft);}
.faq-item{border-bottom:1px solid var(--line);}
.faq-item:first-child{border-top:1px solid var(--line);}
.faq-q{
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  padding:20px 4px; font-family:'Lora',serif; font-weight:700; font-size:1.05rem; color:var(--charcoal);
  display:flex; justify-content:space-between; align-items:center; gap:20px;
}
.faq-q .plus{flex-shrink:0; width:26px;height:26px;border-radius:50%;border:1.5px solid var(--sage-dark);display:flex;align-items:center;justify-content:center;color:var(--sage-dark);transition:transform .2s ease;font-size:.9rem;}
.faq-item[data-open="true"] .plus{transform:rotate(45deg); background:var(--moss); border-color:var(--moss); color:#fff;}
.faq-a{max-height:0; overflow:hidden; transition:max-height .25s ease;}
.faq-a-inner{padding:0 4px 20px; color:var(--muted); font-size:1rem;}

/* ---------- Breadcrumb ---------- */
.breadcrumb-custom{font-size:.95rem; padding:18px 0; color:var(--muted);}
.breadcrumb-custom a{color:var(--muted);}
.breadcrumb-custom a:hover{color:var(--coral-dark);}

/* ---------- Disclaimer box ---------- */
.disclaimer-box{background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); padding:24px 26px; font-size:.95rem; color:var(--muted);}
.disclaimer-box p{margin-bottom:.6em; font-size:.95rem;}
.disclaimer-box p:last-child{margin-bottom:0;}

/* ---------- Related links ---------- */
.related-links{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.related-links a{display:block; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); padding:20px; color:var(--charcoal); font-weight:700;}
.related-links a span{display:block; font-weight:400; color:var(--muted); font-size:.92rem; margin-top:5px;}
.related-links a:hover{border-color:var(--coral);}

/* ---------- Final CTA ---------- */
.final-cta{position:relative; overflow:hidden; border-radius:var(--radius-lg); background:var(--grad-dark); color:#fff; padding:64px; text-align:center;}
.final-cta img{max-width:200px; margin:0 auto 26px;}

/* ---------- FIXED CTA BAR (mandatory) ---------- */
.fixed-cta-bar{
  position:fixed; bottom:0; left:0; right:0; z-index:9999;
  background:var(--moss); color:#fff; border-top:1px solid rgba(255,255,255,.14);
  box-shadow:0 -12px 30px -18px rgba(0,0,0,.4);
}
.fixed-cta-inner{max-width:1200px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.fixed-cta-text{font-family:'Lora',serif;font-weight:600;font-size:1rem;}
.fixed-cta-text .price{color:#F0B79E;}
.fixed-cta-btn{background:var(--coral);color:#fff;padding:11px 22px;border-radius:100px;font-weight:700;font-size:.92rem;white-space:nowrap;flex-shrink:0;}
.fixed-cta-btn:hover{background:var(--coral-dark);color:#fff;}

/* ---------- Blog featured ---------- */
.blog-featured{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-lg); padding:36px; margin-bottom:44px;}
.blog-featured img{border-radius:var(--radius-md);}

/* ---------- Footer ---------- */
.site-footer{background:var(--moss); color:#C9D2C9; padding:56px 0 0;}
.site-footer h4{color:#fff; font-family:'Lora',serif; font-size:1.02rem;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; padding-bottom:32px; border-bottom:1px solid rgba(255,255,255,.12);}
.footer-grid a{color:#C9D2C9;}
.footer-grid a:hover{color:#fff;}
.footer-grid ul{list-style:none; padding:0; margin:0;}
.footer-grid li{margin-bottom:10px;}
.footer-bottom{display:flex; flex-wrap:wrap; justify-content:space-between; gap:14px; padding:20px 0; font-size:.88rem; color:#9AA69B;}
.footer-disclaimer{font-size:.85rem; color:#8C9A8D; max-width:960px; padding-bottom:24px; line-height:1.6;}

/* ---------- Reveal ---------- */
.js .reveal{opacity:0; transform:translateY(16px); transition:opacity .5s ease, transform .5s ease;}
.js .reveal.is-visible{opacity:1; transform:translateY(0);}

/* ---------- Responsive ---------- */
@media (max-width:991px){
  .hero .row{flex-direction:column-reverse;}
  .formula-story{grid-template-columns:1fr;}
  .routine-wheel{grid-template-columns:repeat(2,1fr);}
  .why-item{grid-template-columns:44px 1fr;}
  .review-feature{grid-template-columns:1fr;}
  .mag-grid{grid-template-columns:1fr;}
  .pedestal-row{grid-template-columns:1fr;}
  .pedestal-featured{transform:none;}
  .bonus-grid{grid-template-columns:repeat(2,1fr);}
  .package-row{grid-template-columns:1fr;text-align:center;}
  .package-right{text-align:center;}
  .package-row img{max-width:160px;margin:0 auto;}
  .faq-2col{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .main-nav{
    position:fixed; inset:0 0 0 auto; width:min(320px,86vw); height:100vh;
    background:var(--cream); flex-direction:column; align-items:flex-start; justify-content:flex-start;
    padding:96px 28px 28px; gap:22px; transform:translateX(100%); transition:transform .25s ease;
    box-shadow:-16px 0 40px rgba(0,0,0,.15); z-index:9997;
  }
  .main-nav.is-open{transform:translateX(0);}
  .main-nav a{font-size:1.1rem;}
  .header-cta{width:100%; text-align:center;}
  .nav-toggle{display:flex;}
}
@media (max-width:640px){
  .sect{padding:56px 0;}
  .routine-wheel{grid-template-columns:1fr;}
  .bonus-grid{grid-template-columns:1fr;}
  .guarantee-wrap{padding:36px 22px;}
  .final-cta{padding:36px 22px;}
  .fixed-cta-text{font-size:.85rem;}
  .fixed-cta-btn{padding:10px 16px;font-size:.85rem;}
  body{padding-bottom:76px;}
}