:root{
  --p:#2563eb; --p-dark:#1e40af; --p-light:#60a5fa; --accent:#10b981; --accent-2:#f59e0b;
  --ink:#0f172a; --muted:#64748b; --bg:#f8fafc; --card:#ffffff; --border:#e5e9f2;
  --radius-lg:24px; --radius-md:16px; --radius-sm:10px;
  --shadow-soft:0 10px 40px rgba(15,23,42,.08); --shadow-deep:0 20px 60px rgba(37,99,235,.18);
}
*{box-sizing:border-box;}
body{font-family:'Poppins','Inter',-apple-system,sans-serif;color:var(--ink);background:var(--bg);margin:0;line-height:1.6;}
h1,h2,h3,h4{font-weight:800;letter-spacing:-.02em;}
a{text-decoration:none;color:inherit;}
.container{max-width:1180px;margin:0 auto;padding:0 20px;}

/* Nav */
.site-nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);}
.site-nav .wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;max-width:1180px;margin:0 auto;}
.logo{font-weight:900;font-size:1.35rem;display:flex;align-items:center;gap:8px;}
.logo .mark{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--p),var(--accent));display:flex;align-items:center;justify-content:center;color:#fff;font-weight:900;box-shadow:var(--shadow-deep);}
.nav-links{display:flex;gap:26px;font-weight:600;font-size:.92rem;color:var(--muted);}
.nav-links a:hover{color:var(--p);}
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:100px;font-weight:700;font-size:.9rem;border:none;cursor:pointer;transition:.2s;}
.btn-primary{background:linear-gradient(135deg,var(--p),var(--p-dark));color:#fff;box-shadow:0 8px 24px rgba(37,99,235,.35);}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(37,99,235,.45);color:#fff;}
.btn-ghost{background:#fff;border:1.5px solid var(--border);color:var(--ink);}

/* Hero */
.hero{position:relative;overflow:hidden;padding:80px 0 100px;background:radial-gradient(circle at 20% 20%, #dbeafe, transparent 45%), radial-gradient(circle at 85% 15%, #d1fae5, transparent 40%), var(--bg);}
.hero .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center;}
.eyebrow{display:inline-flex;align-items:center;gap:8px;background:#eff6ff;color:var(--p);font-weight:700;font-size:.8rem;padding:8px 16px;border-radius:100px;margin-bottom:20px;}
.hero h1{font-size:3rem;line-height:1.1;margin:0 0 20px;}
.hero h1 .accent{background:linear-gradient(135deg,var(--p),var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero p.lead{font-size:1.1rem;color:var(--muted);max-width:520px;margin-bottom:32px;}
.hero-actions{display:flex;gap:14px;margin-bottom:40px;}
.trust-strip{display:flex;gap:28px;flex-wrap:wrap;}
.trust-strip .item{font-size:.85rem;color:var(--muted);display:flex;align-items:center;gap:8px;font-weight:600;}
.trust-strip .item i{color:var(--accent);}

.hero-visual{position:relative;height:460px;}
.float-card{position:absolute;background:var(--card);border-radius:var(--radius-md);box-shadow:var(--shadow-soft);padding:16px 18px;border:1px solid var(--border);animation:float 6s ease-in-out infinite;}
.float-card.c1{top:10px;left:0;width:230px;animation-delay:0s;}
.float-card.c2{bottom:60px;right:0;width:250px;animation-delay:1.2s;}
.float-card.c3{top:180px;right:30px;width:200px;animation-delay:2.4s;}
.hero-blob{position:absolute;inset:0;margin:auto;width:340px;height:340px;border-radius:45% 55% 60% 40%/50% 45% 55% 50%;background:linear-gradient(135deg,var(--p),var(--accent));opacity:.15;filter:blur(10px);}
@keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-14px);}}

/* Category grid */
.section{padding:70px 0;}
.section-head{text-align:center;max-width:640px;margin:0 auto 46px;}
.section-head h2{font-size:2.1rem;margin-bottom:12px;}
.section-head p{color:var(--muted);}
.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.cat-card{background:var(--card);border-radius:var(--radius-md);padding:26px 22px;border:1px solid var(--border);box-shadow:var(--shadow-soft);transition:.25s;position:relative;overflow:hidden;}
.cat-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-deep);border-color:var(--p-light);}
.cat-card .ico{width:52px;height:52px;border-radius:14px;background:linear-gradient(135deg,var(--p),var(--accent));display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.3rem;margin-bottom:16px;box-shadow:0 10px 24px rgba(37,99,235,.3);}
.cat-card h4{font-size:1.05rem;margin:0 0 8px;}
.cat-card p{font-size:.85rem;color:var(--muted);margin:0;}

/* How it works */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
.step{text-align:center;padding:10px;}
.step .num{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--p-dark));color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.2rem;margin:0 auto 16px;box-shadow:var(--shadow-deep);}

/* Services */
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.svc-card{background:var(--card);border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow-soft);transition:.25s;}
.svc-card:hover{transform:translateY(-6px);}
.svc-card .banner{height:100px;background:linear-gradient(135deg,var(--p-light),var(--accent));}
.svc-card .body{padding:18px;}
.svc-card h5{font-size:1rem;margin:0 0 8px;}
.svc-card .price{font-weight:800;color:var(--p);}

/* Testimonial / stats */
.stats-band{background:linear-gradient(135deg,var(--ink),#1e3a8a);color:#fff;border-radius:var(--radius-lg);padding:50px;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center;}
.stats-band .num{font-size:2.2rem;font-weight:900;}
.stats-band .lbl{color:#cbd5e1;font-size:.85rem;}

/* Footer */
footer{background:var(--ink);color:#cbd5e1;padding:60px 0 24px;margin-top:60px;}
footer .grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px;margin-bottom:40px;}
footer h5{color:#fff;margin-bottom:16px;font-size:.95rem;}
footer a{color:#94a3b8;font-size:.87rem;display:block;margin-bottom:10px;}
footer a:hover{color:#fff;}
.footer-bottom{border-top:1px solid #1e293b;padding-top:20px;text-align:center;font-size:.8rem;color:#64748b;}

@media(max-width:900px){
  .hero .grid{grid-template-columns:1fr;} .hero-visual{display:none;}
  .cat-grid,.svc-grid{grid-template-columns:repeat(2,1fr);} .steps{grid-template-columns:repeat(2,1fr);}
  .stats-band{grid-template-columns:repeat(2,1fr);} footer .grid{grid-template-columns:1fr 1fr;}
  .nav-links{display:none;}
}