:root{
  --bg:#0f1724;
  --accent-1:#07a0d7;
  --accent-2:#5de0b8;
  --muted:#94a3b8;
  --glass: rgba(255,255,255,0.04);
  --card:#0b1220;
  --radius:14px;
  --maxw:1200px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;padding:0;font-family:Inter, Poppins, system-ui, -apple-system, 'Segoe UI', Roboto, Arial;color:#e6eef6;
  background:radial-gradient(1200px 600px at 10% 10%, rgba(7,160,215,0.06), transparent 8%), linear-gradient(180deg,#071022 0%, #071426 100%);
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
.container{max-width:var(--maxw);margin:28px auto;padding:20px}
.header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
nav{display:flex;gap:16px;align-items:center}
nav a{color:var(--muted);text-decoration:none;font-weight:600}
.btn{background:linear-gradient(90deg,var(--accent-1),var(--accent-2));padding:10px 16px;border-radius:12px;color:#05202a;font-weight:700;text-decoration:none;box-shadow:0 8px 30px rgba(7,160,215,0.12)}

.hero{display:flex;gap:28px;align-items:center;margin-top:28px}
.hero .left{flex:1}
.hero h1{font-family:Poppins,Inter;font-size:36px;line-height:1.06;margin:0;color:#eaf6ff}
.hero p{color:var(--muted);margin-top:10px}

.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));border-radius:var(--radius);padding:18px;box-shadow:0 6px 30px rgba(2,6,23,0.6);}

.features{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.feature{padding:16px;border-radius:10px;background:var(--card)}

.section{margin-top:40px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:20px}

footer{margin-top:40px;padding:18px;border-radius:12px;background:transparent;color:var(--muted);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}

/* responsive */
@media (max-width:980px){
  .hero{flex-direction:column}
  .features{grid-template-columns:1fr 1fr}
  .two-col{grid-template-columns:1fr}
}
@media (max-width:540px){
  nav{display:none}
  .features{grid-template-columns:1fr}
}
.small{color:var(--muted);font-size:14px}