:root{
  --brand:#0b6bff;        /* electric blue */
  --brand-dark:#0a55cc;
  --ink:#0f172a;
  --soft:#f8fafc;
  --accent:#22c55e;       /* success green */
}
body{color:var(--ink);}
.btn-brand{background:var(--brand); color:#fff;}
.btn-brand:hover{background:var(--brand-dark); color:#fff;}
.text-brand{color:var(--brand);}
.badge-soft{background:#eaf2ff; color:var(--brand); border-radius:999px; padding:.5rem .75rem;}

.hero{
  background: radial-gradient(1200px 600px at 70% -10%, #eaf2ff 0%, transparent 60%),
              linear-gradient(180deg,#ffffff 0%,#f9fbff 100%);
}
.feature-icon{
  width:56px;height:56px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;
  background:#eef6ff;
}
.shadow-soft{box-shadow:0 10px 30px rgba(2,6,23,.08);}
.rounded-2xl{border-radius:1.25rem;}
.section{padding:5rem 0;}
.small-muted{color:#64748b;}
.check{color:var(--accent);}
.footer{background:#0f172a; color:#cbd5e1;}
.gradient-card{background:linear-gradient(145deg,#ffffff, #f3f7ff);}

/* Equal height images in HOW IT WORKS */
.how-img{
  width:100%;
  height:220px;           /* tweak to taste */
  object-fit:cover;       /* preserve aspect ratio without distortion */
  border-radius:1rem;
}
@media (max-width: 767.98px){
  .how-img{ height:300px; }
}

/* Objective cards */
.obj-card{
  background:#fff;
  border:1px solid #eef2f7;
}