:root{
  --bg:#f8fafc; --ink:#0f172a; --muted:#475569; --line:#e2e8f0;
  --primary:#10b981; --primary-dark:#059669; --gold:#f59e0b;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg); color:var(--ink); line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

.container{max-width:1100px;margin:0 auto;padding:24px}

/* HERO */
.hero{
  display:grid; gap:28px; align-items:center; padding:28px 24px 10px;
  background:linear-gradient(180deg,#eafff7 0%,transparent 70%);
}
.hero-copy h1{font-size:clamp(30px,6vw,56px); line-height:1.05; margin:10px 0}
.lead{font-size:clamp(16px,2.4vw,20px); color:var(--muted); margin:0 0 14px}
.badge{display:inline-flex;align-items:center;gap:8px;color:#7c2d12;background:#fffbeb;border:1px solid #fde68a;
  padding:8px 12px;border-radius:999px;font-weight:700}
.badge .star{color:var(--gold)}

.cta-row{margin:10px 0 0}
.cta{
  display:inline-block;background:var(--primary);color:#fff;text-decoration:none;font-weight:800;
  padding:14px 22px;border-radius:12px;box-shadow:0 14px 24px rgba(16,185,129,.25);
  transition:transform .12s ease, box-shadow .2s ease, background .2s ease
}
.cta:hover{transform:translateY(-1px);background:var(--primary-dark);box-shadow:0 18px 28px rgba(5,150,105,.32)}
.subtle{display:block;margin-top:8px;color:var(--muted);font-size:14px}
.charity{margin-top:8px;color:#059669;font-weight:600}

.trust-icons{display:flex;gap:16px;list-style:none;padding:0;margin:14px 0 6px;color:var(--muted);flex-wrap:wrap}
.trust-icons li{display:flex;gap:6px;align-items:center}

/* Hero art */
.hero-art{display:grid;place-items:center}
.book-cover{
  width:min(300px, 90%);
  height:auto;
  border-radius:12px;
  box-shadow:0 10px 24px rgba(0,0,0,.15);
}
.device-badge{
  margin-top:10px;
  background:#eefcf5;
  color:#065f46;
  border:1px solid #ccf0e3;
  padding:8px 12px;
  border-radius:999px;
  font-size:14px;
}

/* Sections */
.section{padding:14px 0}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 10px 22px rgba(2,6,23,.05)}
.grid-3{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:920px){.grid-3{grid-template-columns:repeat(3,1fr)}}

.bullets{list-style:none;margin:0;padding:0}
.bullets li{margin:10px 0}
.check{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-right:8px;border-radius:999px;background:var(--primary);color:#fff;font-weight:900}

/* Testimonials */
.testimonials{display:grid;gap:16px;grid-template-columns:1fr}
@media(min-width:920px){.testimonials{grid-template-columns:repeat(3,1fr)}}
.t-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 10px 22px rgba(2,6,23,.05)}
.t-quote{font-weight:600}
.t-who{color:var(--muted);font-size:14px;margin-top:6px}

/* Bonus + Guarantee strip */
.guarantee{background:#062a1a;color:#d1fae5}
.g-wrap{display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:16px 24px}
.g-bonus{font-weight:800}
.g-guarantee{opacity:.95}

/* Video poster + modal */
.video-poster{position:relative;display:inline-block;border-radius:14px;overflow:hidden;border:1px solid var(--line)}
.video-poster img{display:block;width:min(820px,100%);height:auto}
.play-overlay{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(0deg,rgba(15,23,42,.35),rgba(15,23,42,.1))}
.play-overlay .btn{width:76px;height:76px;border-radius:999px;background:var(--gold);display:grid;place-items:center;box-shadow:0 10px 22px rgba(245,158,11,.35)}
.play-overlay .btn::after{content:'▶';font-weight:900;color:#1f2937;font-size:28px;margin-left:4px}
.video-caption{color:var(--muted);font-size:14px;margin-top:8px}

/* Lightbox */
.modal{position:fixed;inset:0;background:rgba(2,6,23,.75);display:none;align-items:center;justify-content:center;padding:20px;z-index:50}
.modal.open{display:flex}
.modal video{max-width:960px;width:100%;border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.4)}
.modal .close{position:absolute;top:14px;right:14px;background:#fff;border:none;border-radius:8px;padding:8px 10px;font-size:14px;cursor:pointer}

/* Footer */
.footer{padding:24px 0;color:var(--muted);font-size:14px;text-align:center}
.footer a{color:var(--muted);text-decoration:none}
.footer a:hover{text-decoration:underline}
.footer-trust{margin-top:6px;color:var(--muted);font-size:13px}
