
*{box-sizing:border-box}body{margin:0;background:#071018;color:#fff;font-family:Arial,sans-serif;padding-bottom:80px}
.topbar{position:sticky;top:0;background:#0f172a;padding:12px;text-align:center;z-index:99}
.hero{text-align:center;padding:30px 15px}
.logo{max-width:220px;width:80%}
h1{font-size:42px;margin:10px 0;background:linear-gradient(90deg,#22c55e,#ef4444);-webkit-background-clip:text;color:transparent}
.tag{font-weight:bold}
.cta,.bottom-cta{background:#16a34a;color:#fff;text-decoration:none;border-radius:40px;padding:14px 22px;display:inline-block}
.stats,.features{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:15px}
.card{background:#111827;border-radius:16px;padding:18px;text-align:center}
.card span{font-size:28px;font-weight:bold;display:block}
h2{text-align:center}
.carousel{display:flex;overflow-x:auto;gap:12px;padding:15px;scroll-snap-type:x mandatory}
.carousel img{width:260px;border-radius:16px;scroll-snap-align:center}
.urgency{text-align:center;padding:20px}
#timer{font-size:34px;font-weight:bold}
.progress{height:12px;background:#222;border-radius:20px;max-width:500px;margin:15px auto}
.fill{height:100%;width:96%;background:linear-gradient(90deg,#22c55e,#ef4444)}
.bottom-cta{position:fixed;left:10px;right:10px;bottom:10px;text-align:center;font-weight:bold;z-index:100}
.popup{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:200}
.popup-box{background:#111827;padding:20px;border-radius:16px;max-width:320px;margin:25vh auto;text-align:center}
@media(min-width:768px){.stats,.features{grid-template-columns:repeat(4,1fr)}}
