:root{
  --bg:#ffffff;
  --card:#f9fafb;
  --muted:#4b5563;
  --accent:#3b82f6; /* clean blue accent */
  --accent-strong:#2563eb;
  --text:#111827;
  --text-strong:#000000;
  --shadow:0 4px 20px rgba(0,0,0,.08);
  --radius:16px;
  --radius-lg:22px;
  --maxw:1100px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:var(--maxw);margin:0 auto;padding:24px}

header{
  position:sticky;top:0;z-index:50;backdrop-filter:saturate(140%) blur(8px);
  background:#ffffff;border-bottom:1px solid #e5e7eb;
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.3px}
.brand img{height:50px;width:auto}
.nav a.btn{display:inline-block;padding:10px 16px;border-radius:999px;background:var(--accent);color:#fff;font-weight:700;box-shadow:var(--shadow)}
.nav a.btn:hover{background:var(--accent-strong)}

/* Hamburger menu styles */
.hamburger{display:none;flex-direction:column;cursor:pointer;padding:8px}
.hamburger span{width:25px;height:3px;background:var(--text);margin:3px 0;transition:0.3s}
.nav-links{display:flex;gap:16px;align-items:center}
.nav-links a{color:var(--text);font-weight:500}
.nav-links a:hover{color:var(--accent)}

/* Mobile menu */
@media (max-width: 768px){
  .hamburger{display:flex}
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;background:white;flex-direction:column;padding:20px;border-bottom:1px solid #e5e7eb;box-shadow:var(--shadow)}
  .nav-links.active{display:flex}
  .nav-links a{padding:12px 0;border-bottom:1px solid #f3f4f6}
  .nav-links a:last-child{border-bottom:none}
}

.hero{padding:72px 24px 36px}
.hero .wrap{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.2fr .8fr;gap:28px}
.card{background:#fff;border:1px solid #e5e7eb;box-shadow:var(--shadow);border-radius:var(--radius-lg);}
.padded{padding:28px}
h1{margin:0 0 12px;font-size:clamp(28px,4vw,44px);line-height:1.1;color:var(--text-strong)}
.lead{color:var(--muted);font-size:clamp(16px,2.1vw,18px)}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}
.badge{padding:6px 10px;border-radius:999px;background:#f3f4f6;border:1px solid #e5e7eb;font-size:13px;color:var(--muted)}
.cta{display:flex;gap:12px;align-items:center;margin-top:18px}
.cta .btn{padding:12px 18px;border-radius:12px;background:var(--accent);color:#fff;font-weight:800;border:none;cursor:pointer}
.cta .btn.secondary{background:#f9fafb;color:var(--accent);border:1px solid #e5e7eb}
.cta .btn:hover{background:var(--accent-strong);color:#fff}
.hero aside{display:flex;flex-direction:column;gap:16px}
.stat{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:14px;background:#f9fafb;border:1px solid #e5e7eb}
.stat strong{color:var(--text-strong)}

section{padding:16px 24px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.panel{background:var(--card);border:1px solid #e5e7eb;border-radius:var(--radius);padding:22px}
h2{margin:0 0 10px;font-size:clamp(22px,2.6vw,28px);color:var(--text-strong)}
h3{margin:0 0 8px;font-size:18px;color:var(--text-strong)}
p{margin:8px 0 12px;line-height:1.55}
ul{margin:8px 0 12px 20px}
li{margin:6px 0}

details{border:1px solid #e5e7eb;background:#f9fafb;border-radius:12px;padding:14px 16px}
summary{font-weight:700;cursor:pointer}

.donate{padding:32px 24px}
.donate .wrap{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.embed{background:#f9fafb;border:1px solid #e5e7eb;border-radius:14px;padding:16px}

.footer{padding:28px 24px;border-top:1px solid #e5e7eb;color:#6b7280}
.footer a{color:#6b7280}

.sticky-cta{position:fixed;right:18px;bottom:18px;z-index:60}
.sticky-cta a{display:inline-block;padding:12px 16px;background:var(--accent);color:#fff;border-radius:999px;font-weight:800;box-shadow:var(--shadow)}

/* Q&A specific styles */
.qa-container{max-width:800px;margin:0 auto}
.qa-item{margin-bottom:32px}
.qa-question{font-weight:700;color:var(--text-strong);font-size:18px;margin-bottom:12px;line-height:1.4}
.qa-answer{line-height:1.6}
.qa-answer ul{margin:16px 0 16px 20px}
.qa-answer li{margin:8px 0}

@media (max-width: 960px){
  .hero .wrap{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr}
  .donate .wrap{grid-template-columns:1fr}
}