:root{
  --dark:#142016; --green:#1f6b3a; --earth:#7a3f16; --sand:#f5d28a;
  --cream:#fffaf0; --muted:#63705d; --white:#ffffff;
}

*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--cream);color:#172014;line-height:1.6}
a{text-decoration:none;color:inherit}
header{position:sticky;top:0;z-index:100;background:rgba(20,32,22,.95);color:white}
.nav{max-width:1200px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:14px 24px}
.logo{display:flex;gap:12px;align-items:center;font-weight:900;font-size:22px}
.logo-mark{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,#f5d28a,#1f6b3a);display:flex;align-items:center;justify-content:center;font-size:26px}
.logo span{color:var(--sand)}
.menu{display:flex;gap:18px;font-weight:700;font-size:14px}
.menu a:hover{color:var(--sand)}
.btn{display:inline-block;background:var(--green);color:white;padding:13px 20px;border-radius:14px;font-weight:900;border:0;cursor:pointer}
.btn.gold{background:var(--sand);color:#211608}.btn.earth{background:var(--earth)}
.hero{background:linear-gradient(120deg,rgba(20,32,22,.94),rgba(31,107,58,.70)),url('https://images.unsplash.com/photo-1549366021-9f761d450615?q=80&w=1800&auto=format&fit=crop');background-size:cover;background-position:center;color:white}
.hero-inner{max-width:1200px;margin:auto;padding:90px 24px;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.badge{display:inline-block;background:rgba(245,210,138,.18);border:1px solid rgba(245,210,138,.45);color:#ffe9ae;padding:8px 14px;border-radius:999px;font-weight:900}
h1{font-size:56px;line-height:1.05;margin:18px 0}h2{font-size:38px;margin:0 0 10px}h3{margin-top:0}
.hero p{font-size:20px;color:#f6ead1}
.card{background:white;border-radius:24px;padding:26px;box-shadow:0 14px 38px rgba(20,32,22,.12);border:1px solid #f0e3c2}
.donate-card{background:white;color:#172014;border-radius:32px;padding:28px;box-shadow:0 30px 90px #0007}
.amounts{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.amount{border:1px solid #e8d8b1;border-radius:16px;padding:14px;text-align:center;font-weight:900;cursor:pointer}.amount:hover{background:#fff4d5}
.input{width:100%;padding:14px;border:1px solid #d6c8a5;border-radius:14px;margin:8px 0 14px;background:white}
.section{max-width:1200px;margin:auto;padding:76px 24px}
.title{text-align:center;margin-bottom:46px}.title p{color:var(--muted);font-size:18px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.stat{text-align:center}.stat b{font-size:34px;color:var(--green)}
.icon{font-size:40px;margin-bottom:10px}
.dark-section{background:var(--dark);color:white}.dark-section .section{max-width:1200px}.dark-section .card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:white}.dark-section p{color:#eadfbd}
.project-img{height:180px;border-radius:22px;background:linear-gradient(135deg,var(--green),var(--earth));display:flex;align-items:end;color:white;padding:24px;font-size:25px;font-weight:900;margin-bottom:18px}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.photo{position:relative;height:160px;border-radius:20px;background:linear-gradient(135deg,#d9b36c,#1f6b3a);display:flex;align-items:center;justify-content:center;color:white;font-weight:900;overflow:hidden}.photo img{width:100%;height:100%;object-fit:cover;display:block}.photo-caption{position:absolute;left:0;right:0;bottom:0;padding:10px 12px;background:rgba(0,0,0,0.45);color:white;font-size:0.95rem;text-align:center}.footer{background:#0b120c;color:white;text-align:center;padding:40px 24px}.footer p{color:#b8c5b2}
.table{width:100%;border-collapse:collapse}.table th,.table td{padding:14px;border-bottom:1px solid #eadfbd;text-align:left}
@media(max-width:900px){.hero-inner,.grid2,.grid3,.grid4,.gallery{grid-template-columns:1fr}.menu{display:none}h1{font-size:38px}h2{font-size:30px}}
.social-container {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
    }

    .social-btn {
        padding: 10px 20px;
        text-decoration: none;
        color: white;
        border-radius: 5px;
        font-family: Arial, sans-serif;
        font-weight: bold;
        transition: opacity 0.3s;
    }

    .social-btn:hover { opacity: 0.8; }

    /* Brand Colors */
    .fb { background-color: #1877f2; }
    .yt { background-color: #ff0000; }
    .ig { background-color: #e1306c; }
    .tt { background-color: #000000; }
    .x { background-color: #000000; }