:root{
  --primary:#2563eb;
  --secondary:#06b6d4;
  --dark:#0b1220;
  --muted:#64748b;
  --light:#f8fafc;
  --border:#e2e8f0;
}
html{scroll-behavior:smooth}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:#172033;background:#fff}
.navbar{background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.navbar-brand{font-weight:800;letter-spacing:-.5px;color:var(--dark)!important}
.brand-dot{color:var(--primary)}
.nav-link{font-weight:600;color:#334155!important;margin:0 .2rem}
.nav-link:hover,.nav-link.active{color:var(--primary)!important}
.btn-primary{background:var(--primary);border-color:var(--primary);font-weight:700}
.btn-primary:hover{background:#1d4ed8;border-color:#1d4ed8}
.btn-outline-primary{font-weight:700}
.hero{padding:8.5rem 0 5rem;background:radial-gradient(circle at 85% 15%,rgba(37,99,235,.14),transparent 30%),linear-gradient(180deg,#f8fbff,#fff)}
.hero h1{font-size:clamp(2.4rem,5vw,4.5rem);font-weight:800;letter-spacing:-2px;line-height:1.05;color:var(--dark)}
.hero h1 span{color:var(--primary)}
.hero p{font-size:1.15rem;line-height:1.8;color:var(--muted)}
.section{padding:5.5rem 0}
.section-title{font-weight:800;color:var(--dark);letter-spacing:-1px}
.section-lead{color:var(--muted);max-width:720px}
.card-soft{height:100%;border:1px solid var(--border);border-radius:20px;padding:2rem;background:#fff;transition:.25s;box-shadow:0 10px 30px rgba(15,23,42,.04)}
.card-soft:hover{transform:translateY(-5px);box-shadow:0 18px 45px rgba(15,23,42,.09)}
.icon-box{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:#eff6ff;color:var(--primary);font-size:1.35rem;font-weight:800}
.badge-soft{background:#eff6ff;color:#1d4ed8;padding:.55rem .85rem;border-radius:999px;font-weight:700}
.page-hero{padding:8rem 0 4rem;background:linear-gradient(135deg,#0b1220,#172554);color:#fff}
.page-hero h1{font-weight:800;font-size:clamp(2.4rem,5vw,4rem)}
.page-hero p{color:#cbd5e1;max-width:760px}
.stat{padding:1.5rem;border:1px solid var(--border);border-radius:18px;background:#fff;text-align:center}
.stat strong{display:block;font-size:2rem;color:var(--primary)}
.contact-card{border:0;border-radius:24px;background:#0b1220;color:#fff;padding:2.5rem}
.contact-card p{color:#cbd5e1}
.form-control,.form-select{padding:.85rem 1rem;border-radius:12px;border:1px solid var(--border)}
footer{background:#080e19;color:#cbd5e1;padding:3rem 0}
footer a{color:#cbd5e1;text-decoration:none}
footer a:hover{color:#fff}
.whatsapp{position:fixed;right:20px;bottom:20px;z-index:1050;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#25d366;color:#fff;text-decoration:none;font-size:28px;box-shadow:0 10px 25px rgba(0,0,0,.2)}
.whatsapp:hover{color:#fff;transform:scale(1.06)}
.hero-card{border-radius:28px;background:#0b1220;color:#fff;padding:2rem;box-shadow:0 25px 60px rgba(15,23,42,.18)}
.hero-card .mini{border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:1rem;background:rgba(255,255,255,.04)}
.solution{border-radius:22px;overflow:hidden;border:1px solid var(--border);background:#fff}
.solution-body{padding:1.75rem}
@media(max-width:767.98px){
  .hero{padding:7rem 0 3.5rem}
  .section{padding:4rem 0}
  .page-hero{padding:7rem 0 3.5rem}
  .hero h1{letter-spacing:-1px}
  .whatsapp{right:15px;bottom:15px}
}

/* Quick System uploaded brand logo */
.logo-brand{display:flex;align-items:center;padding-top:.25rem;padding-bottom:.25rem}
.site-logo{display:block;width:auto;height:54px;max-width:220px;object-fit:contain}
@media(max-width:991.98px){
  .site-logo{height:48px;max-width:200px}
}
@media(max-width:575.98px){
  .site-logo{height:43px;max-width:175px}
}