:root{
  --g9:#0B3D1E; --g8:#11522A; --g7:#1A6B36; --g6:#23843F; --g1:#E3F3E6; --g0:#F3FAF4;
  --r7:#B3261E; --r6:#C62828; --r1:#FDECEA;
  --y5:#F9C80E; --y3:#FFE27A; --y1:#FFF7DB;
  --ink:#1B2A21; --mut:#56685D; --line:#DDE8E0; --bg:#FFFFFF; --soft:#F7FAF8;
  --rad:16px; --sh:0 10px 30px rgba(17,82,42,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; font-family:'Mukta',system-ui,sans-serif; font-size:18px; line-height:1.65; color:var(--ink); background:var(--bg); -webkit-font-smoothing:antialiased;}
img{max-width:100%; height:auto; display:block}
a{color:var(--g7)}
h1,h2,h3{font-family:'Baloo 2','Mukta',sans-serif; line-height:1.2; margin:0 0 .5em; color:var(--g9)}
h1{font-size:clamp(30px,5vw,48px); font-weight:800}
h2{font-size:clamp(26px,3.8vw,38px); font-weight:800}
h3{font-size:22px; font-weight:700}
p{margin:0 0 1em}
.wrap{max-width:1120px; margin:0 auto; padding:0 18px}
.narrow{max-width:820px}
section{padding:64px 0}
.center{text-align:center}
.eyebrow{display:inline-block; font-weight:700; font-size:14px; letter-spacing:2px; text-transform:uppercase; color:var(--r6); background:var(--r1); padding:4px 14px; border-radius:30px; margin-bottom:14px}
.lead{font-size:20px; color:#33463A}
.hl{background:linear-gradient(transparent 58%, var(--y3) 58%)}
.red{color:var(--r6)}

/* top bar */
.topbar{background:var(--g9); color:#fff; font-size:14.5px; text-align:center; padding:8px 12px; font-weight:600}
.topbar b{color:var(--y3)}
header.nav{position:sticky; top:0; z-index:40; background:rgba(255,255,255,.96); backdrop-filter:blur(6px); border-bottom:1px solid var(--line)}
header.nav .wrap{display:flex; align-items:center; justify-content:space-between; height:64px}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--g9); font-family:'Baloo 2'; font-weight:800; font-size:20px}
.brand img{width:40px; height:40px; border-radius:50%}
.nav .btn{padding:10px 18px; font-size:16px}

/* buttons */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; background:linear-gradient(180deg,#E53935,#C62828); color:#fff; font-family:'Baloo 2'; font-weight:800; font-size:21px; padding:16px 30px; border-radius:14px; text-decoration:none; box-shadow:0 8px 20px rgba(198,40,40,.30), inset 0 -3px 0 rgba(0,0,0,.15); transition:transform .15s, box-shadow .15s; border:0; cursor:pointer; line-height:1.2; text-align:center}
.btn:hover{transform:translateY(-2px); box-shadow:0 12px 26px rgba(198,40,40,.38)}
.btn small{display:block; font-family:'Mukta'; font-weight:600; font-size:13.5px; opacity:.92}
.btn.block{width:100%}
.btn .arr{font-size:24px}
.secure{display:flex; flex-wrap:wrap; justify-content:center; gap:6px 16px; margin-top:12px; font-size:14.5px; color:var(--mut)}
.secure span::before{content:"✔ "; color:var(--g6); font-weight:800}

/* hero */
.hero{background:radial-gradient(1200px 500px at 85% -10%, #FFF4C9 0, transparent 60%), linear-gradient(180deg,#F3FAF4 0%, #fff 100%); padding:44px 0 56px}
.hero .wrap{display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center}
.pill{display:inline-flex; gap:8px; align-items:center; background:#fff; border:1.5px solid var(--g1); color:var(--g7); font-weight:700; font-size:15px; padding:6px 14px; border-radius:30px; margin-bottom:16px}
.hero h1 .red{display:block}
.hero ul{list-style:none; padding:0; margin:18px 0 24px}
.hero li{position:relative; padding-left:34px; margin-bottom:8px; font-size:18.5px}
.hero li::before{content:"✓"; position:absolute; left:0; top:3px; width:24px; height:24px; border-radius:50%; background:var(--g6); color:#fff; font-size:14px; font-weight:800; display:flex; align-items:center; justify-content:center}
.pricebox{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:16px}
.price{font-family:'Baloo 2'; font-weight:800; font-size:48px; color:var(--r6); line-height:1}
.price-note{font-size:15px; color:var(--mut); line-height:1.4}
.hero-img{position:relative}
.hero-img img{filter:drop-shadow(0 22px 30px rgba(0,0,0,.18))}
.badge-float{position:absolute; bottom:6%; left:-4%; background:#fff; border-radius:14px; box-shadow:var(--sh); padding:10px 14px; font-size:14.5px; font-weight:700; color:var(--g8); display:flex; gap:10px; align-items:center}
.badge-float b{font-family:'Baloo 2'; font-size:24px; color:var(--r6)}

/* trust strip */
.strip{background:var(--g9); color:#fff; padding:18px 0}
.strip .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; text-align:center}
.strip b{display:block; font-family:'Baloo 2'; font-size:26px; color:var(--y3); line-height:1.1}
.strip span{font-size:14.5px; opacity:.9}

/* problem */
.problem{background:#fff}
.qgrid{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:26px 0}
.q{background:var(--soft); border:1px solid var(--line); border-left:5px solid var(--r6); border-radius:12px; padding:14px 16px; font-weight:600}
.callout{background:var(--y1); border:1.5px solid #F2DC8A; border-radius:var(--rad); padding:20px 22px; font-size:19px}

/* stats */
.stats{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:28px}
.stat{background:#fff; border:1px solid var(--line); border-radius:var(--rad); padding:22px; text-align:center; box-shadow:var(--sh)}
.stat b{display:block; font-family:'Baloo 2'; font-size:40px; color:var(--r6); line-height:1.1}
.stat span{font-size:16px; color:#33463A}
.stat small{display:block; margin-top:6px; font-size:12.5px; color:var(--mut)}

/* inside */
.inside{background:var(--soft)}
.parts{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:30px}
.part{background:#fff; border-radius:var(--rad); overflow:hidden; box-shadow:var(--sh); border:1px solid var(--line)}
.part .ph{padding:14px 16px; color:#fff; font-family:'Baloo 2'; font-weight:800; font-size:20px}
.part .ph small{display:block; font-family:'Mukta'; font-weight:600; font-size:13px; letter-spacing:1.5px; opacity:.85}
.part ol{margin:0; padding:14px 18px 16px 34px; font-size:16px}
.part li{margin-bottom:6px}
.p1 .ph{background:#1A6B36} .p2 .ph{background:#B07A00} .p3 .ph{background:#1D4E89} .p4 .ph{background:#B3261E}
.extras{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:24px}
.extras span{background:#fff; border:1.5px solid var(--g1); border-radius:30px; padding:6px 14px; font-size:15.5px; font-weight:600; color:var(--g8)}

/* gallery */
.gallery{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:30px}
.gallery figure{margin:0; background:#fff; border-radius:var(--rad); overflow:hidden; box-shadow:var(--sh); border:1px solid var(--line); cursor:zoom-in; transition:transform .2s}
.gallery figure:hover{transform:translateY(-4px)}
.gallery img{aspect-ratio:1055/1491; object-fit:cover; width:100%}
.gallery figcaption{padding:10px 14px; font-weight:700; font-size:16px; color:var(--g8)}
.lightbox{position:fixed; inset:0; background:rgba(5,20,10,.9); display:none; align-items:center; justify-content:center; z-index:100; padding:20px}
.lightbox.open{display:flex}
.lightbox img{max-height:92vh; width:auto; border-radius:10px}
.lightbox button{position:absolute; top:14px; right:18px; background:#fff; border:0; border-radius:50%; width:44px; height:44px; font-size:24px; cursor:pointer}

/* bonus */
.bonus{background:linear-gradient(180deg,#fff, #FFF9E6)}
.bgrid{display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:30px}
.bcard{background:#fff; border:2px solid #F2DC8A; border-radius:20px; padding:22px; display:grid; grid-template-columns:42% 1fr; gap:18px; align-items:center; box-shadow:var(--sh); position:relative}
.bcard .tag{position:absolute; top:-14px; left:20px; background:var(--r6); color:#fff; font-weight:800; font-size:13px; letter-spacing:1.5px; padding:4px 12px; border-radius:20px}
.bcard h3{margin-bottom:6px}
.bcard ul{padding-left:18px; margin:0; font-size:16px}
.bcard .free{display:inline-block; margin-top:10px; background:var(--g1); color:var(--g8); font-weight:800; padding:3px 12px; border-radius:20px; font-size:15px}

/* for whom */
.who{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:28px}
.who > div{border-radius:var(--rad); padding:22px 24px}
.yes{background:var(--g0); border:1.5px solid #BFE3C6}
.no{background:var(--r1); border:1.5px solid #F4BDB7}
.who ul{list-style:none; padding:0; margin:0}
.who li{padding-left:30px; position:relative; margin-bottom:10px}
.yes li::before{content:"✓"; position:absolute; left:0; color:var(--g6); font-weight:800; font-size:20px}
.no li::before{content:"✕"; position:absolute; left:0; color:var(--r6); font-weight:800; font-size:18px}

/* trust */
.trust{background:var(--g9); color:#fff}
.trust h2{color:#fff}
.tgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:28px}
.tcard{background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.15); border-radius:var(--rad); padding:22px}
.tcard h3{color:var(--y3); font-size:20px}
.tcard p{font-size:16.5px; opacity:.92; margin:0}
.sources{margin-top:22px; display:flex; flex-wrap:wrap; gap:8px; justify-content:center}
.sources span{background:#fff; color:var(--g9); font-weight:700; font-size:14px; border-radius:20px; padding:5px 12px}

/* offer */
.offer{background:var(--soft)}
.offerbox{max-width:620px; margin:0 auto; background:#fff; border:3px solid var(--g6); border-radius:24px; box-shadow:0 20px 50px rgba(17,82,42,.18); overflow:hidden}
.offerbox .oh{background:var(--g7); color:#fff; text-align:center; padding:16px; font-family:'Baloo 2'; font-weight:800; font-size:22px}
.offerbox .ob{padding:24px 26px}
.offerbox img{max-width:360px; margin:0 auto 10px}
.olist{list-style:none; padding:0; margin:0 0 18px}
.olist li{display:flex; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px dashed var(--line); font-weight:600}
.olist li span:last-child{color:var(--g7); white-space:nowrap}
.ototal{text-align:center; margin:8px 0 16px}
.ototal .price{font-size:56px}

/* faq */
.faq details{background:#fff; border:1px solid var(--line); border-radius:14px; margin-bottom:10px; padding:4px 18px}
.faq summary{cursor:pointer; font-weight:700; font-size:18.5px; padding:12px 0; list-style:none; position:relative; padding-right:30px; color:var(--g9)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; position:absolute; right:0; top:8px; font-size:26px; color:var(--g6)}
.faq details[open] summary::after{content:"–"}
.faq details p{color:#33463A}

/* final */
.final{background:linear-gradient(135deg,var(--g9),var(--g7)); color:#fff; text-align:center}
.final h2{color:#fff}
.final p{opacity:.92}

.disc{background:#FFF7F6; border-top:1px solid #F4D2CE; padding:26px 0; font-size:14.5px; color:#5a3a37}
footer{background:#08281A; color:#C9DDD0; padding:40px 0 90px; font-size:15px}
footer .fgrid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:24px}
footer h4{color:#fff; font-family:'Baloo 2'; font-size:18px; margin:0 0 10px}
footer a{color:#C9DDD0; text-decoration:none; display:block; margin-bottom:6px}
footer a:hover{color:#fff}
footer .copy{border-top:1px solid rgba(255,255,255,.12); margin-top:24px; padding-top:16px; font-size:13.5px; opacity:.8}

/* sticky mobile cta */
.mcta{position:fixed; left:0; right:0; bottom:0; z-index:50; background:#fff; border-top:1px solid var(--line); box-shadow:0 -6px 20px rgba(0,0,0,.08); padding:10px 14px; display:none; align-items:center; gap:12px}
.mcta .p{font-family:'Baloo 2'; font-weight:800; font-size:26px; color:var(--r6); line-height:1}
.mcta .p small{display:block; font-family:'Mukta'; font-size:12px; color:var(--mut); font-weight:600}
.mcta .btn{flex:1; font-size:18px; padding:13px 14px}

/* legal pages */
.legal{padding:40px 0 70px}
.legal h1{font-size:34px}
.legal h2{font-size:23px; margin-top:28px}
.legal p,.legal li{font-size:17px; color:#2b3a31}
.legal .upd{color:var(--mut); font-size:15px}
.legal .box{background:var(--soft); border:1px solid var(--line); border-left:5px solid var(--g6); border-radius:12px; padding:16px 18px; margin:18px 0}
.legal .box.r{border-left-color:var(--r6); background:#FFF7F6}

@media (max-width:900px){
  .hero .wrap{grid-template-columns:1fr; gap:20px}
  .hero-img{order:-1; max-width:520px; margin:0 auto}
  .badge-float{left:0}
  .parts{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:1fr 1fr}
  .bgrid,.who,.tgrid{grid-template-columns:1fr}
  .strip .wrap{grid-template-columns:1fr 1fr}
  footer .fgrid{grid-template-columns:1fr}
}
@media (max-width:640px){
  body{font-size:17px}
  section{padding:46px 0}
  .qgrid,.stats,.parts{grid-template-columns:1fr}
  .gallery{gap:10px}
  .bcard{grid-template-columns:1fr; text-align:left}
  .bcard img{max-width:240px; margin:0 auto}
  .nav .btn{display:none}
  .mcta{display:flex}
  .price{font-size:42px}
  .btn{font-size:19px; padding:15px 20px}
}
