
:root{
  --primary:#2E86DE;
  --accent:#F9D65C;
  --dark:#0F172A;
  --muted:#64748B;
  --bg:#F7FAFC;
}
*{box-sizing:border-box}
body{margin:0;font-family:Poppins, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;background:var(--bg);color:var(--dark);line-height:1.6}

.site-header{
  position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid #e5e7eb;
  display:flex;align-items:center;justify-content:space-between;padding:.6rem 1rem
}
.site-header .brand img{height:40px}
.site-nav{display:flex;gap:.75rem;align-items:center}
.site-nav a{text-decoration:none;color:var(--dark);padding:.5rem .6rem;border-radius:.5rem}
.site-nav a:hover{background:#f1f5f9}
.btn{display:inline-block;padding:.7rem 1rem;border-radius:.6rem;text-decoration:none;font-weight:600}
.btn-primary{background:var(--primary);color:#fff}
.btn-outline{border:2px solid var(--primary);color:var(--primary)}
.btn-donate{background:var(--accent);color:#111;font-weight:700}

.hero{
  display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center;
  padding:2.5rem 1rem;max-width:1100px;margin:0 auto;
}
.hero .card{background:#fff;border:1px solid #e5e7eb;padding:1.5rem;border-radius:1rem;box-shadow:0 10px 30px rgba(2,8,23,0.05)}
.hero h1{font-size:clamp(1.8rem, 2.4vw + 1rem, 3rem);margin:.2rem 0}
.hero p.lead{font-size:1.05rem;color:var(--muted)}

.section{max-width:1100px;margin:0 auto;padding:2rem 1rem}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.card{background:#fff;border:1px solid #e5e7eb;padding:1.25rem;border-radius:1rem}
.card h3{margin:.2rem 0}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1rem}
.kpi{background:#fff;border:1px solid #e5e7eb;border-radius:1rem;padding:1rem;text-align:center}
.kpi strong{display:block;font-size:1.4rem}

.cta{text-align:center;padding:2rem 1rem;background:linear-gradient(180deg,#fff, #f8fafc)}

.site-footer{background:#0b1220;color:#e2e8f0;margin-top:3rem;padding:2rem 1rem}
.site-footer .grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1rem;max-width:1100px;margin:0 auto}
.site-footer a{color:#e2e8f0}
.footer-logo{height:36px;filter:brightness(1.2)}
.muted{color:#94a3b8}

.form{display:grid;gap:1rem;max-width:720px;margin:0 auto}
.form input,.form select,.form textarea{width:100%;padding:.8rem;border:1px solid #cbd5e1;border-radius:.6rem;background:#fff}
.form button{padding:.8rem 1rem;border:none;border-radius:.6rem;background:var(--primary);color:#fff;font-weight:700}

.notice{background:#ecfeff;border:1px solid #a5f3fc;padding:.8rem;border-radius:.6rem}

/* Responsive */
.nav-toggle{display:none;background:none;border:none}
.nav-toggle span{display:block;width:24px;height:3px;background:#111;margin:5px 0;border-radius:2px}

@media (max-width: 900px){
  .hero{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .kpis{grid-template-columns:repeat(2,1fr)}
  .site-footer .grid{grid-template-columns:1fr}
  .site-nav{display:none;position:absolute;top:64px;right:12px;background:#fff;border:1px solid #e5e7eb;border-radius:.8rem;flex-direction:column;padding:.5rem;box-shadow:0 10px 30px rgba(2,8,23,0.12)}
  .nav-toggle{display:block}
  .site-nav a{padding:.7rem 1rem}
  .site-header .btn-donate{display:none}
}

.badge{display:inline-block;font-size:.8rem;padding:.25rem .5rem;border-radius:999px;background:var(--accent);color:#111;font-weight:700}
.sponsors{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;align-items:center}
.sponsors img{width:100%;height:auto;border:1px solid #e5e7eb;border-radius:.6rem;background:#fff}
@media(max-width:900px){
  .sponsors{grid-template-columns:repeat(2,1fr)}
}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:24px;background:#0b1220;color:#fff;padding:.8rem 1rem;border-radius:.6rem;display:none;z-index:50}
.toast.show{display:block}
