body{margin:0;font-family:Arial,sans-serif;background:#f8f8f8;color:#0a1b4d}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:20px 40px;background:#081b59;color:white;flex-wrap:wrap}
.logo{font-size:34px;font-weight:900}.logo span{color:#ff5fa2}
nav a{color:white;margin:0 12px;text-decoration:none;font-weight:bold}
.cta-buttons button,.btn{background:#23c7c9;border:none;color:white;padding:12px 20px;border-radius:30px;font-weight:bold;text-decoration:none;display:inline-block;margin-right:10px}
.cta-buttons .donate,.secondary{background:#ff5f7d}
.hero{display:flex;flex-wrap:wrap;padding:60px 40px;align-items:center}
.hero-text{flex:1;min-width:300px}
.hero-text h1{font-size:64px;line-height:1.0}
.hero-image{flex:1;min-width:300px;background:#d9eef0;padding:120px;text-align:center;border-radius:30px;font-weight:bold}
.benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;background:#081b59;color:white;padding:30px;text-align:center;font-weight:bold}
.how{padding:60px 40px;text-align:center}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.steps div,.card{background:white;padding:25px;border-radius:20px}
.steps span{display:inline-block;background:#23c7c9;color:white;width:40px;height:40px;line-height:40px;border-radius:50%}
.split{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:40px}
.teal{background:#23c7c9;color:white}.purple{background:#7d58d6;color:white}
.dark{background:#081b59}
footer{background:#081b59;color:white;padding:40px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}
input{padding:10px;border-radius:20px;border:none;width:60%}
@media(max-width:768px){.benefits,.steps,.split,footer{grid-template-columns:1fr}.hero-text h1{font-size:42px}}