:root{--navy:#16354A;--teal:#238A83;--gold:#C8A45D;--white:#F7F7F3;--ink:#1d2b36;--tint:#E9F3F1;--max:1080px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Montserrat,"Segoe UI",system-ui,sans-serif;color:var(--ink);background:var(--white);line-height:1.65}
h1,h2,h3{font-family:"Playfair Display",Georgia,serif;color:var(--navy);line-height:1.2;margin:0 0 .5em}
h1{font-size:clamp(2rem,5vw,3.2rem)}h2{font-size:clamp(1.6rem,3.5vw,2.2rem)}h3{font-size:1.25rem}
a{color:var(--teal)}img{max-width:100%;height:auto;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding:0 16px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:20}
header.site{background:#fff;border-bottom:3px solid var(--gold);position:sticky;top:0;z-index:10}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:8px;padding-bottom:8px}
header.site img{height:56px;width:auto}
nav ul{list-style:none;display:flex;gap:20px;margin:0;padding:0;flex-wrap:wrap}
nav a{text-decoration:none;color:var(--navy);font-weight:600;font-size:.92rem}
nav a:hover,nav a[aria-current]{color:var(--teal)}
.btn{display:inline-block;background:var(--gold);color:var(--navy);padding:.7em 1.4em;border-radius:4px;font-weight:700;text-decoration:none;border:0;cursor:pointer;font:inherit;font-weight:700}
.btn:hover{background:#d8b570}.btn.alt{background:transparent;border:2px solid #fff;color:#fff}
.hero{position:relative;color:#fff;background:var(--navy) url(../img/hero.jpg) center/cover}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,53,74,.92),rgba(22,53,74,.55))}
.hero .wrap{position:relative;padding-top:96px;padding-bottom:96px;max-width:var(--max)}
.hero h1{color:#fff;max-width:14em}.hero p{max-width:34em;font-size:1.1rem}
.hero .tag{color:var(--gold);font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.85rem}
section{padding:64px 0}section.tint{background:var(--tint)}section.navy{background:var(--navy);color:#fff}section.navy h2{color:#fff}
.grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:#fff;border-top:4px solid var(--teal);border-radius:4px;padding:24px;box-shadow:0 2px 10px rgba(22,53,74,.08)}
.card.water{border-color:var(--navy)}.card.women{border-color:var(--gold)}
.card a.more{font-weight:700}
.page-title{background:var(--navy);color:#fff;padding:48px 0}.page-title h1{color:#fff;margin:0}.page-title p{margin:.5em 0 0;color:var(--gold)}
table.facts{width:100%;border-collapse:collapse;background:#fff;margin:1em 0}
table.facts th,table.facts td{text-align:left;padding:12px 14px;border:1px solid #d9e3e1;vertical-align:top}
table.facts th{background:var(--tint);width:30%;color:var(--navy)}
blockquote{font-family:"Playfair Display",Georgia,serif;font-style:italic;font-size:1.4rem;color:var(--navy);border-left:4px solid var(--gold);margin:1em 0;padding:.2em 1em}
.note{font-size:.88rem;color:#51606b;border-left:4px solid var(--gold);padding-left:12px}
form label{display:block;font-weight:600;margin:14px 0 4px}
form input,form select,form textarea{width:100%;padding:10px;border:1px solid #b9c7c5;border-radius:4px;font:inherit;background:#fff}
footer.site{background:var(--navy);color:#cfdbe0;padding:40px 0;font-size:.9rem}
footer.site a{color:var(--gold)}footer.site .tagline{font-family:"Playfair Display",Georgia,serif;font-style:italic;color:#fff;font-size:1.1rem}
footer.site .cols{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
@media(max-width:640px){header.site .wrap{flex-direction:column}.hero .wrap{padding-top:64px;padding-bottom:64px}}

.socials{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:10px}
nav a.nav-donate{color:var(--navy);padding:.45em 1em}nav a.nav-donate:hover{color:var(--navy)}

.board{display:grid;gap:40px 24px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:40px}
.member{text-align:center}
.member img{width:160px;height:160px;border-radius:50%;object-fit:cover;margin:0 auto 16px;border:4px solid var(--gold);background:var(--tint)}
.member h3{margin-bottom:.1em}.member .role{color:var(--teal);font-weight:700;margin:0 0 .6em;font-size:.9rem;text-transform:uppercase;letter-spacing:.06em}
.member p{text-align:left}
.member .role{text-align:center}

.picon{width:72px;height:72px;border-radius:50%;margin-bottom:12px}
.ph{display:flex;align-items:center;gap:16px;margin-bottom:.6em}.ph .picon{margin:0;flex:none}.ph h2{margin:0}