:root{
  --background:oklch(0.99 0.005 280);
  --foreground:oklch(0.18 0.02 270);
  --card:#fff;
  --muted-fg:oklch(0.5 0.02 270);
  --border:oklch(0.92 0.01 280);
  --secondary:oklch(0.96 0.01 280);
  --lavender:oklch(0.72 0.12 285);
  --lavender-soft:oklch(0.92 0.05 285);
  --cta:oklch(0.7 0.19 145);
  --cta-fg:#fff;
  --destructive:oklch(0.58 0.22 27);
  --radius:0.875rem;
  --font-display:"Plus Jakarta Sans",sans-serif;
  --font-sans:"Inter",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;border-color:var(--border)}
html,body{overflow-x:hidden}
body{background:var(--background);color:var(--foreground);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;line-height:1.5}
h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:-0.02em;line-height:1.1}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
ul{list-style:none}
em{font-style:italic}
strong{font-weight:700}
s{text-decoration:line-through}

.page{min-height:100vh}
.container{max-width:48rem;margin:0 auto;padding:0 1.25rem}
.section{padding:2.5rem 0}
@media(min-width:640px){.section{padding:3rem 0}}
.center{text-align:center}
.bold{font-weight:700}
.small{font-size:0.875rem}
.micro{font-size:0.75rem;color:var(--muted-fg);margin-top:0.75rem}
.muted{color:var(--muted-fg)}
.lavender{color:var(--lavender)}
.mt{margin-top:0.75rem}
.mt-lg{margin-top:1.25rem}
.block{display:block;margin:0 auto}

/* Icons */
.icon{width:1.25rem;height:1.25rem;flex-shrink:0}
.icon.sm{width:0.875rem;height:0.875rem}
.icon.xl{width:2.5rem;height:2.5rem}
.icon.white{color:#fff}

/* HERO */
.hero{position:relative;overflow:hidden;background:linear-gradient(to bottom,oklch(0.92 0.05 285 / 0.5),var(--background) 60%,var(--background));padding:3rem 1.25rem 2.5rem;text-align:center}
@media(min-width:640px){.hero{padding:5rem 1.25rem 4rem}}
.badge{display:inline-flex;align-items:center;gap:0.5rem;border:1px solid oklch(0.72 0.12 285 / 0.3);background:rgba(255,255,255,0.7);backdrop-filter:blur(8px);border-radius:9999px;padding:0.375rem 1rem;font-size:0.75rem;font-weight:600;letter-spacing:0.05em;color:rgba(0,0,0,0.8);margin-bottom:1.5rem}
.h1{font-size:2rem;font-weight:800;line-height:1.05;letter-spacing:-0.02em}
@media(min-width:640px){.h1{font-size:3rem}}
@media(min-width:768px){.h1{font-size:3.75rem}}
.lead{max-width:32rem;margin:1.25rem auto 0;font-size:1rem;color:var(--muted-fg)}
@media(min-width:640px){.lead{font-size:1.125rem}}
.mockup-wrap{margin-top:1.5rem}
.mockup{width:78%;max-width:420px;margin:0 auto;filter:drop-shadow(0 30px 40px oklch(0.22 0.03 270 / 0.25))}
.cta-wrap{margin-top:1.25rem;display:flex;flex-direction:column;align-items:center}
.quote-italic{max-width:28rem;margin:1.5rem auto 0;font-style:italic;font-size:0.875rem;color:rgba(0,0,0,0.7)}

/* CTA */
.cta{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;min-height:56px;width:100%;border-radius:1rem;background:var(--cta);color:var(--cta-fg);padding:1rem 1.5rem;font-size:1rem;font-weight:700;letter-spacing:-0.01em;box-shadow:0 10px 30px -10px oklch(0.7 0.19 145 / 0.55);transition:transform .2s,box-shadow .2s}
@media(min-width:640px){.cta{width:auto;min-width:280px}}
.cta:hover{transform:translateY(-2px);box-shadow:0 18px 40px -12px oklch(0.7 0.19 145 / 0.7)}
.cta:active{transform:translateY(0)}

/* Cards */
.card{border:1px solid var(--border);background:var(--card);border-radius:1.5rem}
.pad{padding:1.5rem}
.pad-lg{padding:1.5rem}
@media(min-width:640px){.pad-lg{padding:2.5rem}}
.shadow{box-shadow:0 25px 50px -12px rgba(0,0,0,0.1)}
.bg-secondary{background:oklch(0.96 0.01 280 / 0.4)}
.bg-lavender-grad{background:linear-gradient(to bottom,oklch(0.92 0.05 285 / 0.4),var(--background))}

/* Social proof */
.stars{display:flex;justify-content:center;gap:0.25rem;color:var(--lavender);font-size:1.25rem;margin-bottom:0.75rem}
.overline{font-size:0.75rem;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;color:var(--muted-fg)}
.overline.lavender{color:var(--lavender)}
.testimonial{margin-top:1rem;font-size:1.125rem;color:rgba(0,0,0,0.9)}
@media(min-width:640px){.testimonial{font-size:1.25rem}}

/* H2 */
.h2{font-size:1.875rem;font-weight:800;line-height:1.2}
@media(min-width:640px){.h2{font-size:2.25rem}}
.h3{font-size:1.5rem;font-weight:700}

/* Pain quotes */
.stack{display:grid;gap:0.75rem;margin-top:1.5rem}
.stack-lg{display:grid;gap:1rem;margin-top:1.5rem}
.stack-sm{display:grid;gap:0.5rem;margin-top:1.5rem}
.pain-quote{border-left:4px solid var(--lavender);background:var(--card);padding:1rem 1.25rem;border-radius:1rem;font-style:italic;color:rgba(0,0,0,0.85);box-shadow:0 1px 2px rgba(0,0,0,.04)}

/* Causes */
.cause{display:flex;gap:1rem}
.cause-num{flex-shrink:0;width:2.5rem;height:2.5rem;border-radius:9999px;background:var(--lavender-soft);color:var(--lavender);font-weight:700;display:flex;align-items:center;justify-content:center;font-size:.875rem}
.cause p{padding-top:0.375rem;color:rgba(0,0,0,0.85)}
.big-center{margin-top:1.75rem;text-align:center;font-size:1.5rem;font-weight:700}
@media(min-width:640px){.big-center{font-size:1.875rem}}

/* Steps */
.step{border:1px solid var(--border);background:var(--card);border-radius:1rem;padding:1.5rem;transition:transform .2s}
.step:hover{transform:translateY(-2px)}
.step-num{font-size:.75rem;font-weight:700;letter-spacing:0.15em;color:var(--lavender)}
.step h3{margin-top:0.5rem;font-size:1.25rem;font-weight:700}
.step p{margin-top:0.5rem;color:var(--muted-fg)}

/* What you get */
.item{display:flex;gap:1rem;border:1px solid var(--border);background:var(--card);border-radius:1rem;padding:1.25rem}
.item-icon{flex-shrink:0;width:2.5rem;height:2.5rem;border-radius:.75rem;background:var(--lavender-soft);display:flex;align-items:center;justify-content:center;color:var(--lavender);font-weight:900}
.item p.bold{font-weight:700}
.item .small{color:var(--muted-fg)}
.bonus{display:flex;gap:1rem;border:2px solid oklch(0.72 0.12 285 / 0.4);background:oklch(0.92 0.05 285 / 0.4);border-radius:1rem;padding:1.25rem;margin-top:0.75rem}
.bonus-icon{flex-shrink:0;width:2.5rem;height:2.5rem;border-radius:.75rem;background:var(--lavender);display:flex;align-items:center;justify-content:center}

/* For/Not for */
.grid-2{display:grid;gap:1.25rem}
@media(min-width:768px){.grid-2{grid-template-columns:1fr 1fr}}
.tag{display:inline-flex;align-items:center;gap:0.5rem;font-size:.875rem;font-weight:700;margin-bottom:0.75rem}
.tag.cta-color{color:var(--cta)}
.tag.destructive{color:var(--destructive)}
.card.pad .tag+ul{}
.bullet{display:grid;gap:0.75rem;font-size:.875rem;color:rgba(0,0,0,.85)}
.card.pad{border-color:oklch(0.7 0.19 145 / 0.3)}
.card.pad:nth-child(2){border-color:oklch(0.58 0.22 27 / 0.3)}

/* Pricing */
.price-list{margin-top:2rem;font-size:.875rem}
@media(min-width:640px){.price-list{font-size:1rem}}
.price-list li{display:flex;justify-content:space-between;gap:1rem;padding:0.75rem 0;border-bottom:1px solid var(--border)}
.price-list li:last-child{border-bottom:none;font-weight:700;padding:1rem 0}
.price-list .old{color:var(--muted-fg);text-decoration:line-through;font-weight:600;flex-shrink:0}
.price-box{margin-top:1.25rem;border-radius:1rem;background:linear-gradient(135deg,oklch(0.92 0.05 285 / 0.6),var(--background));padding:1.5rem;text-align:center}
.price{margin-top:0.25rem;font-size:3.75rem;font-weight:800;letter-spacing:-0.02em}
@media(min-width:640px){.price{font-size:4.5rem}}
.guarantee{display:inline-flex;align-items:center;gap:0.5rem;margin-top:1.5rem;background:var(--card);padding:0.5rem 1rem;border-radius:9999px;font-size:.75rem;font-weight:600;color:rgba(0,0,0,.8)}

/* Author */
.author-img{width:8rem;height:8rem;border-radius:9999px;border:4px solid var(--card);object-fit:cover;box-shadow:0 10px 25px rgba(0,0,0,0.1);margin:0 auto}
@media(min-width:640px){.author-img{width:10rem;height:10rem}}
.story{margin-top:1.25rem;display:grid;gap:1rem;color:rgba(0,0,0,.85)}
.check-list{display:grid;gap:0.75rem;font-size:.875rem}
.check-list li{display:flex;gap:.75rem}
.check{color:var(--lavender);font-weight:900;flex-shrink:0}

/* FAQ */
.faq{overflow:hidden;border:1px solid var(--border);background:var(--card);border-radius:1rem}
.faq-btn{display:flex;width:100%;min-height:56px;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;text-align:left;background:none;border:none;cursor:pointer;font:inherit;color:inherit}
.faq-q{font-size:1rem;font-weight:600}
.faq-chev{width:1.25rem;height:1.25rem;color:var(--lavender);transition:transform .2s}
.faq.open .faq-chev{transform:rotate(180deg)}
.faq-a{display:none;border-top:1px solid var(--border);padding:1rem 1.25rem;font-size:.875rem;color:var(--muted-fg)}
.faq.open .faq-a{display:block}

/* Final CTA */
.final-cta{background:linear-gradient(to bottom,var(--background),oklch(0.92 0.05 285 / 0.6))}
.dark-box{max-width:36rem;margin:0 auto;border-radius:1.5rem;background:oklch(0.22 0.03 270);color:var(--background);padding:2rem;text-align:center}
@media(min-width:640px){.dark-box{padding:3rem}}
.dark-lead{margin-top:1rem;opacity:.8}
.dark-foot{margin-top:1.5rem;display:inline-flex;align-items:center;gap:.5rem;font-size:.75rem;opacity:.7}
.dark-box .cta-wrap{margin-top:2rem}

/* Footer */
.footer{border-top:1px solid var(--border);padding:2.5rem 1.25rem;text-align:center;font-size:.875rem;color:var(--muted-fg)}
.footer .stack-sm{gap:1rem;margin-top:0}
.dark-text{color:var(--foreground)}
