
:root{
  --bg:#0f172a;
  --panel:#111827;
  --card:#ffffff;
  --muted:#64748b;
  --text:#0f172a;
  --accent:#2563eb;
  --accent2:#16a34a;
  --soft:#f8fafc;
  --border:#e2e8f0;
}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  background:var(--soft);
  color:var(--text);
  line-height:1.55;
}
a{color:inherit}
.container{width:min(1100px,92%);margin:0 auto}
header{
  background:var(--bg);
  color:#fff;
  padding:18px 0;
  position:sticky;
  top:0;
  z-index:10;
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{font-size:1.35rem;font-weight:800;letter-spacing:.3px}
.navlinks{display:flex;gap:18px;font-size:.95rem}
.navlinks a{text-decoration:none;color:#e2e8f0}
.hero{
  background:linear-gradient(135deg,#0f172a,#1e293b);
  color:#fff;
  padding:72px 0 58px;
}
.hero h1{font-size:clamp(2.1rem,5vw,4rem);line-height:1.05;margin:0 0 18px}
.hero p{max-width:720px;font-size:1.15rem;color:#dbeafe;margin:0 0 28px}
.btn{
  display:inline-block;
  background:var(--accent);
  color:#fff;
  text-decoration:none;
  padding:14px 20px;
  border-radius:10px;
  font-weight:700;
}
.btn.secondary{background:#fff;color:var(--bg);margin-left:8px}
section{padding:54px 0}
.section-title{font-size:2rem;margin:0 0 12px}
.section-sub{color:var(--muted);margin:0 0 28px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  padding:22px;
  box-shadow:0 8px 20px rgba(15,23,42,.06);
}
.card h3{margin-top:0}
.badge{
  display:inline-block;
  padding:6px 9px;
  background:#dbeafe;
  color:#1d4ed8;
  border-radius:999px;
  font-size:.8rem;
  font-weight:700;
}
.offer-wrap{max-width:840px;margin:0 auto}
.offer-hero{
  background:#fff;
  border:1px solid var(--border);
  border-radius:18px;
  padding:32px;
  margin-top:36px;
}
.offer-hero h1{font-size:2.35rem;margin:.4rem 0 1rem}
.bullets{padding-left:20px}
.cta-box{
  margin-top:28px;
  padding:20px;
  border:1px solid var(--border);
  background:#f8fafc;
  border-radius:14px;
}
.disabled{
  display:inline-block;
  padding:14px 20px;
  background:#94a3b8;
  color:#fff;
  border-radius:10px;
  text-decoration:none;
  font-weight:700;
  pointer-events:none;
}
.notice{
  background:#fff7ed;
  border:1px solid #fed7aa;
  padding:14px 16px;
  border-radius:12px;
  color:#9a3412;
  margin:18px 0;
}
footer{
  background:#0f172a;
  color:#cbd5e1;
  padding:30px 0;
  margin-top:40px;
}
footer a{color:#cbd5e1}
.footer-links{display:flex;flex-wrap:wrap;gap:14px}
.small{font-size:.9rem;color:var(--muted)}
@media(max-width:800px){
  .grid{grid-template-columns:1fr}
  .navlinks{display:none}
  .hero{padding:52px 0 42px}
  .btn.secondary{display:block;margin:10px 0 0;width:max-content}
}
