/* Basic reset */
:root{
  --bg:#0b1722; /* dark hero */
  --card:#ffffff;
  --muted:#6b7280;
  --accent:#11c37b;
  --light-hero:#0b1722;
  --container:1100px;
  --radius:14px;
  --soft:#f7fafb;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;}
a{color:inherit;text-decoration:none}
.container{max-width:var(--container);margin:0 auto;padding:0 20px}

/* HERO */
.hero{
  position:relative;
  color:white;
  min-height:520px;
  display:flex;
  align-items:center;
  background:linear-gradient(180deg, rgba(11,23,34,0.95), rgba(11,23,34,0.95));
  overflow:hidden;
}

/* grid overlay */
.hero::before{
  content:"";
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
  background-size:80px 80px;
  mix-blend-mode:overlay;
  opacity:.55;
  transform:translateZ(0);
}

/* subtle vignette */
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(2,6,12,0.25), rgba(2,6,12,0.55));}

/* content */
.hero-inner{position:relative;z-index:2;padding:48px 20px;max-width:1000px;margin:0 auto;text-align:left}
.badge{display:inline-block;background:rgba(255,255,255,0.06);padding:10px 16px;border-radius:999px;color:#cfece1;margin-bottom:18px;font-weight:600;font-size:14px}
.hero-title{font-size:48px;line-height:1.02;margin:0 0 18px;font-weight:800;color:#fff}
.hero-title .accent{color:var(--accent)}
.hero-sub{color:rgba(255,255,255,0.8);max-width:820px;font-size:18px;margin-bottom:22px}

/* CTAs */
.btn{display:inline-block;padding:14px 22px;border-radius:12px;font-weight:700;margin-right:12px}
.btn.primary{background:linear-gradient(180deg,#15d18f,#0ea06b);color:#042018;box-shadow:0 8px 20px rgba(14,160,107,0.18)}
.btn.ghost{background:rgba(255,255,255,0.06);color:#dceff0;border:1px solid rgba(255,255,255,0.06)}

/* SECTION styles */
.section{padding:64px 0}
.section.light{background:var(--soft)}
.section.white{background:#fff}
.section.dark{background:#071023;color:#d9e5ee}
.section-title{font-size:36px;text-align:center;margin:0 0 14px;font-weight:800;color:#0b1722}
.section-sub{max-width:880px;margin:0 auto 34px;color:var(--muted);text-align:center}

/* cards */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-top:26px}
.card{background:white;border-radius:14px;padding:22px;box-shadow:0 8px 24px rgba(10,20,30,0.06);border:1px solid rgba(11,23,34,0.03)}
.card h3{margin:12px 0 6px;font-size:20px}
.card p{margin:0;color:#5b6570}
.card-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#e9fdf2;margin-bottom:8px}

/* Who we help */
.who-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:28px}
.who-item{background:#fff;border-radius:12px;padding:18px 22px;border:1px solid rgba(11,23,34,0.04);font-weight:600;color:#0b1722}

/* contact */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:30px}
.contact-card{display:flex;gap:16px;align-items:center;background:rgba(255,255,255,0.02);padding:18px;border-radius:12px;border:1px solid rgba(255,255,255,0.03)}
.contact-icon{width:56px;height:56px;border-radius:12px;background:rgba(255,255,255,0.03);display:flex;align-items:center;justify-content:center;font-size:22px}
.muted{color:rgba(255,255,255,0.6);font-size:13px}
.contact-value{font-weight:700;color:#fff}

/* footer */
.site-footer{background:#06121a;color:rgba(255,255,255,0.6);padding:18px 0;text-align:center;font-size:14px}

/* responsiveness */
@media (max-width:880px){
  .hero-title{font-size:36px}
  .btn{width:100%;display:block;margin-bottom:10px}
  .hero-cta{max-width:360px}
  .hero-inner{text-align:center}
}