*{box-sizing:border-box;margin:0;padding:0}
:root{
  --green:#2D6A2D;--green-light:#4CAF50;--amber:#F5A623;
  --dark:#0F1A0F;--text:#1a1a1a;--muted:#555;--bg:#FAFDF7;
}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden}
a{text-decoration:none;color:inherit}

/* NAV */
nav{background:var(--dark);padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100}
.logo{font-size:1.3rem;font-weight:700;color:#fff;display:flex;align-items:center;gap:8px}
.logo .leaf{color:var(--green-light);font-size:1.5rem}
.logo .iq{color:var(--amber)}
.nav-btns{display:flex;gap:10px}
.btn-green{background:var(--green-light);color:#fff;padding:8px 18px;border-radius:6px;font-weight:600;font-size:13px;display:inline-block}
.btn-amber{background:var(--amber);color:var(--dark);padding:8px 18px;border-radius:6px;font-weight:600;font-size:13px;display:inline-block}

/* HERO */
.hero{background:linear-gradient(160deg,#0F1A0F 0%,#1a3a1a 60%,#0d2a0d 100%);padding:4rem 2rem 3rem;text-align:center}
.hero-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(245,166,35,0.12);border:1px solid rgba(245,166,35,0.35);color:var(--amber);padding:6px 14px;border-radius:20px;font-size:12px;font-weight:500;margin-bottom:1.5rem;letter-spacing:.03em}
.hero h1{font-size:clamp(2rem,5vw,3.2rem);font-weight:700;color:#fff;line-height:1.15;margin-bottom:1.25rem;max-width:750px;margin-left:auto;margin-right:auto}
.hero h1 em{color:var(--green-light);font-style:normal}
.hero h1 span{color:var(--amber)}
.hero-sub{font-size:1.05rem;color:rgba(255,255,255,0.68);max-width:540px;margin:0 auto 2rem;line-height:1.75}
.hero-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:2.5rem}
.btn-hero-p{background:var(--green-light);color:#fff;padding:13px 26px;border-radius:8px;font-weight:600;font-size:14px;display:inline-block}
.btn-hero-s{background:transparent;color:#fff;border:1px solid rgba(255,255,255,0.25);padding:13px 26px;border-radius:8px;font-weight:600;font-size:14px;display:inline-block}
.ussd-dial{display:inline-block;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);border-radius:12px;padding:1.25rem 2rem}
.ussd-label{font-size:11px;color:rgba(255,255,255,0.35);text-transform:uppercase;letter-spacing:.1em;margin-bottom:.75rem}
.ussd-code{font-family:'Courier New',monospace;font-size:1.6rem;color:var(--amber);font-weight:700;letter-spacing:.05em}
.ussd-sub{font-size:11px;color:rgba(255,255,255,0.3);margin-top:.5rem}

/* STATS */
.stats{display:grid;grid-template-columns:repeat(4,1fr);background:var(--amber)}
.stat{padding:1.25rem 1.5rem;text-align:center;border-right:1px solid rgba(0,0,0,0.1)}
.stat:last-child{border-right:none}
.stat-n{font-size:1.9rem;font-weight:700;color:var(--dark);line-height:1}
.stat-l{font-size:12px;color:rgba(0,0,0,0.6);margin-top:5px}

/* SECTIONS */
.section{padding:4rem 2rem;max-width:1060px;margin:0 auto}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--green-light);margin-bottom:.6rem}
.section-h2{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:700;color:var(--dark);line-height:1.25;margin-bottom:.85rem}
.section-lead{font-size:1rem;color:var(--muted);line-height:1.75;max-width:580px}

/* PROBLEM CARDS */
.prob-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:2.25rem}
.prob-card{background:#fff;border:1px solid #e4ede4;border-radius:10px;padding:1.4rem;border-left:3px solid var(--green-light)}
.prob-icon{font-size:1.6rem;margin-bottom:.6rem}
.prob-title{font-size:14px;font-weight:600;color:var(--dark);margin-bottom:.4rem}
.prob-body{font-size:13px;color:#666;line-height:1.6}

/* VIDEO */
.video-bg{background:var(--dark);padding:4rem 2rem}
.video-inner{max-width:860px;margin:0 auto;text-align:center}
.video-eyebrow{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--amber);margin-bottom:.6rem}
.video-title{font-size:clamp(1.4rem,3vw,2rem);font-weight:700;color:#fff;margin-bottom:.75rem}
.video-sub{font-size:.95rem;color:rgba(255,255,255,0.6);margin-bottom:1.75rem;line-height:1.7}
.video-frame{position:relative;padding-bottom:56.25%;height:0;border-radius:14px;overflow:hidden;border:1px solid rgba(245,166,35,0.25)}
.video-frame iframe{position:absolute;top:0;left:0;width:100%;height:100%}

/* HOW IT WORKS */
.how-bg{background:#fff;padding:4rem 2rem}
.how-inner{max-width:1060px;margin:0 auto}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-top:2.25rem}
.step{text-align:center;padding:1.5rem 1rem}
.step-num{width:46px;height:46px;border-radius:50%;background:var(--green);color:#fff;font-size:1.1rem;font-weight:700;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem}
.step-title{font-size:14px;font-weight:600;color:var(--dark);margin-bottom:.5rem}
.step-body{font-size:13px;color:#666;line-height:1.6}

/* DEMO */
.demo-wrap{display:grid;grid-template-columns:1fr 1fr;gap:2.5rem;align-items:center;margin-top:2.25rem}
.phone{background:var(--dark);border-radius:20px;padding:1.5rem;font-family:'Courier New',monospace;font-size:12.5px;line-height:1.85;max-width:290px}
.phone-header{font-size:10px;color:rgba(255,255,255,0.3);margin-bottom:.85rem;text-align:center;letter-spacing:.05em}
.phone-screen{background:#111;border-radius:10px;padding:1.1rem}
.phone-t{color:rgba(255,255,255,0.45);font-size:10px;margin-bottom:.4rem}
.phone-green{color:var(--green-light)}
.phone-white{color:#fff}
.phone-muted{color:rgba(255,255,255,0.4);font-size:11px}
.demo-pts{display:flex;flex-direction:column;gap:14px}
.demo-pt{display:flex;gap:12px;align-items:flex-start}
.demo-dot{width:8px;height:8px;border-radius:50%;background:var(--green-light);flex-shrink:0;margin-top:6px}
.demo-txt{font-size:13.5px;color:var(--muted);line-height:1.65}
.demo-txt strong{color:var(--dark)}

/* TECH STACK */
.tech-bg{background:#F4F9F4;padding:4rem 2rem}
.tech-inner{max-width:1060px;margin:0 auto}
.tech-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-top:2rem}
.tech-pill{background:#fff;border:1px solid #dceadc;border-radius:8px;padding:.85rem 1rem;display:flex;align-items:center;gap:10px}
.tech-icon{font-size:1.3rem}
.tech-label{font-size:13px;font-weight:600;color:#1a3a1a}
.tech-sub{font-size:11px;color:#666;margin-top:2px}

/* CTA */
.cta-bg{background:linear-gradient(150deg,#2D6A2D 0%,#1a4a1a 100%);padding:5rem 2rem;text-align:center}
.cta-code{display:inline-block;background:var(--amber);color:var(--dark);font-family:'Courier New',monospace;font-size:1.6rem;font-weight:700;padding:12px 30px;border-radius:8px;margin-bottom:1.5rem;letter-spacing:.05em}
.cta-h2{font-size:clamp(1.4rem,3vw,2.2rem);font-weight:700;color:#fff;margin-bottom:.85rem}
.cta-p{color:rgba(255,255,255,0.7);font-size:.95rem;margin-bottom:2rem;max-width:460px;margin-left:auto;margin-right:auto;line-height:1.7}
.cta-btn{display:inline-block;background:var(--amber);color:var(--dark);padding:14px 30px;border-radius:8px;font-weight:700;font-size:14px}

/* FOOTER */
footer{background:var(--dark);color:rgba(255,255,255,0.45);text-align:center;padding:1.75rem 2rem;font-size:12.5px;line-height:1.9}
footer strong{color:#fff}

/* RESPONSIVE */
@media(max-width:700px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .stat{border-right:none;border-bottom:1px solid rgba(0,0,0,0.1)}
  .demo-wrap{grid-template-columns:1fr}
  .phone{max-width:100%}
}
@media(max-width:420px){
  .stats{grid-template-columns:1fr}
  .hero h1{font-size:1.75rem}
  .nav-btns .btn-green{display:none}
}
