
: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}
.gallery-categories{display:grid;gap:24px;grid-template-columns:repeat(4,1fr);align-items:start}
 .gallery-category{border:1px solid #d8d1b0;padding:22px;border-radius:26px;background:white;box-shadow:0 14px 36px rgba(20,32,22,.08)}
 .category-header{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px}
 .category-header h3{margin:0;font-size:24px}
 .category-count{color:var(--muted);font-weight:700}
 .carousel{position:relative}
.carousel-track{display:grid;grid-template-columns:1fr;gap:14px;min-height:180px}
.carousel-item{display:none;border-radius:12px;overflow:hidden;box-shadow:0 8px 20px rgba(0,0,0,.08)}
.carousel-item.active{display:block}
.carousel-item img{width:100%;height:180px;object-fit:cover;display:block;transition:transform .28s ease}
.carousel-item img:hover{transform:scale(1.06)}
/* Also scale when hovering the carousel item (more reliable) */
.carousel-item:hover img{transform:scale(1.06)}
 .carousel-caption{padding:18px 14px;background:#faf4e5;color:#172014}
 .carousel-caption p{margin:0 0 8px;line-height:1.6}
 .carousel-meta{color:var(--muted);font-size:0.95rem}
 .carousel-controls{display:flex;justify-content:center;gap:12px;margin-top:14px}
 .carousel-button{border:1px solid rgba(20,32,22,.15);background:white;color:#172014;font-size:22px;width:48px;height:48px;border-radius:16px;cursor:pointer;transition:all .2s}
 .carousel-button:hover{transform:translateY(-1px);border-color:rgba(20,32,22,.3)}
 .carousel-info{margin-top:8px;text-align:center;color:var(--muted);font-weight:700}
.table{width:100%;border-collapse:collapse}.table th,.table td{padding:14px;border-bottom:1px solid #eadfbd;text-align:left}
@media(max-width:1100px){.gallery-categories{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.hero-inner,.grid2,.grid3,.grid4,.gallery{grid-template-columns:1fr}.menu{display:none}h1{font-size:38px}h2{font-size:30px}}
