/* styles.css - clean, responsive, blue & white theme */
:root{
  --blue:#0b69ff;
  --dark:#073367;
  --muted:#6b7a90;
  --bg:#f6f9ff;
  --glass: rgba(255,255,255,0.7);
}
*{box-sizing:border-box}
body{font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; margin:0; color:#0e2b4f; background:var(--bg); -webkit-font-smoothing:antialiased}
.container{max-width:1100px; margin:0 auto; padding:28px}
.nav{background:#fff; box-shadow:0 6px 18px rgba(11,105,255,0.06); position:sticky; top:0; z-index:40}
.nav .container{display:flex; align-items:center; justify-content:space-between}
.logo{font-weight:700; color:var(--dark)}
.nav-links a{margin-left:18px; text-decoration:none; color:var(--muted)}
.hero{padding:48px 0}
.hero-grid{display:grid; grid-template-columns:1fr 420px; gap:30px; align-items:center}
.hero-left h1{font-size:2.2rem; margin:0 0 12px}
.lead{color:var(--muted); margin-bottom:18px}
.cta-area{display:flex; gap:12px; margin:14px 0}
.cta-area input{flex:1; padding:12px 14px; border-radius:10px; border:1px solid #dbe9ff; background:#fff}
.btn{background:linear-gradient(90deg,var(--blue),#3aa0ff); color:#fff; border:none; padding:12px 18px; border-radius:10px; font-weight:600; cursor:pointer; box-shadow:0 8px 24px rgba(11,105,255,0.12); transition:transform .18s ease}
.btn:active{transform:translateY(1px)}
.stats{display:flex; gap:14px; margin-top:18px; list-style:none; padding:0}
.stats li{background:#fff; padding:12px 16px; border-radius:10px; box-shadow:0 6px 18px rgba(11,105,255,0.04); min-width:120px; text-align:center}
.hero-right .card{background:linear-gradient(180deg,#fff, #f5fbff); padding:18px; border-radius:14px; box-shadow:0 20px 40px rgba(11,105,255,0.06); margin-bottom:12px}
.features{padding:40px 0}
.features-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px}
.feature{background:#fff; padding:18px; border-radius:10px; box-shadow:0 8px 30px rgba(11,105,255,0.04)}
.how{padding:28px 0}
.steps{background:#fff; padding:18px; border-radius:10px; box-shadow:0 8px 30px rgba(11,105,255,0.04)}
.success{padding:28px 0}
.testimonials{display:flex; gap:14px}
blockquote{background:#fff; padding:16px; border-radius:10px; box-shadow:0 8px 30px rgba(11,105,255,0.04); margin:0}
.final-cta{padding:28px 0; text-align:center}
.footer{padding:24px 0; color:var(--muted); font-size:0.9rem; text-align:center}

/* Responsive */
@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr; padding-bottom:12px}
  .features-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .features-grid{grid-template-columns:1fr}
  .nav .container{padding:12px}
  .hero-left h1{font-size:1.5rem}
  .cta-area{flex-direction:column}
  .cta-area input{width:100%}
}