:root{
  --brand:#0d6efd;
  --ink:#0b2239;
  --muted:#6c7a89;
  --bg:#f8fbff;
}
html,body{scroll-behavior:smooth;}
body{font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;color:var(--ink);background:var(--bg);}
.navbar-brand strong{letter-spacing:.2px}
.hero{
  background: radial-gradient(1200px 600px at 10% 10%, #e9f2ff 0%, transparent 60%),
              radial-gradient(1000px 500px at 90% -10%, #e6f0ff 0%, transparent 60%),
              linear-gradient(180deg,#ffffff 0%, #f6f9ff 100%);
}
.hero .lead{color:#375273}
.section{padding:80px 0}
.section-title{font-weight:700; letter-spacing:.2px}
.badge-soft{background:rgba(13,110,253,.08); color:var(--brand); border:1px solid rgba(13,110,253,.15)}
.card-feature{border:1px solid #e9eef6; transition: all .2s ease; height:100%}
.card-feature:hover{transform:translateY(-4px); box-shadow:0 10px 24px rgba(13,110,253,.08)}
.icon-xxl{font-size:42px; line-height:1; color:var(--brand)}
.stat{border:1px solid #e9eef6; border-radius:16px; padding:18px; background:#fff}
.process-step{border-left:3px solid var(--brand); padding-left:16px}
.cta{background:linear-gradient(135deg, #0d6efd 0%, #6f9bff 100%); color:#fff}
.cta .btn{border-color:#fff}
.footer{background:#0b2239; color:#cfe0ff}
.footer a{color:#cfe0ff; text-decoration:none}
.footer a:hover{text-decoration:underline}
.logo-placeholder{
  width:40px;height:40px;border-radius:10px;background:var(--brand);display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:700
}
@media (max-width: 991px){
  .section{padding:56px 0}
}