:root{--g1:#0b4a2c;--g2:#166a3b;--g3:#2e9e4f;--gl:#e3f4dc;--o:#f57c10;--o2:#e06a05;--ink:#1d2b24;--bg:#fff;--r:14px}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{font:16px/1.6 "Segoe UI",system-ui,Roboto,"Helvetica Neue",Arial,sans-serif;color:var(--ink);background:var(--bg);padding-bottom:env(safe-area-inset-bottom)}
img{max-width:100%}
a{color:inherit}
.wrap{width:min(1160px,100% - 32px);margin-inline:auto}
.ic{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ic.fill{fill:currentColor}
:focus-visible{outline:3px solid var(--o);outline-offset:2px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:40px;font-weight:700;text-decoration:none;border:2px solid transparent;cursor:pointer;font-size:15px;font-family:inherit}
.btn.orange{background:var(--o);color:#fff}.btn.orange:hover{background:var(--o2)}
.btn.green{background:var(--g2);color:#fff}.btn.green:hover{background:var(--g1)}
.btn.ghost{border-color:#fff;color:#fff;background:rgba(0,0,0,.15)}
.row{display:flex;flex-wrap:wrap;gap:12px}
.topbar{background:var(--g1);color:#fff;font-size:13px}
.topbar .wrap{display:flex;gap:6px 20px;flex-wrap:wrap;padding:7px 0}
.topbar a,.topbar span{display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.head{position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.08)}
.bar{display:flex;align-items:center;justify-content:space-between;padding:8px 0}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand span{display:flex;flex-direction:column;line-height:1.1}
.brand b{font-size:15px;letter-spacing:.5px}
.brand strong{font-size:22px;color:var(--g2)}
.brand em{font:italic 11px Georgia,serif}
.burger{display:grid;gap:5px;background:none;border:0;padding:10px;cursor:pointer}
.burger i{width:26px;height:3px;background:var(--g1);border-radius:3px;transition:.2s}
nav{position:absolute;left:0;right:0;top:100%;background:#fff;display:none;flex-direction:column;padding:8px 16px 16px;box-shadow:0 12px 20px rgba(0,0,0,.12)}
nav.open{display:flex}
nav a{padding:12px 14px;text-decoration:none;font-weight:600;border-radius:30px}
nav a.on{background:var(--g1);color:#fff}
nav .nav-don{margin-top:8px;justify-content:center;color:#fff}
.hero{background:linear-gradient(90deg,rgba(11,74,44,.92) 35%,rgba(11,74,44,.45)),url(../images/hero.jpg) 70% center/cover,linear-gradient(135deg,var(--g1),var(--g3));color:#fff;padding:64px 0 90px;border-radius:0 0 50% 50%/0 0 28px 28px}
.hero h1{font-size:clamp(34px,8vw,66px);line-height:1.05;max-width:620px;font-weight:800}
.hero h1 span{color:var(--o)}
.hero p{font-size:clamp(17px,2.4vw,21px);font-weight:600;max-width:460px;margin:18px 0 26px}
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:18px 12px;padding:26px 0}
.pillars div{display:flex;gap:10px;align-items:center}
.pillars p{font-size:12.5px;line-height:1.3}.pillars b{display:block;font-size:14px}
.dot{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;flex:none}
.dot .ic{width:24px;height:24px}.dot.g{background:var(--g2)}.dot.o{background:var(--o)}
.about{display:grid;gap:20px;padding:10px 0 30px}
.ph{min-height:240px;border-radius:var(--r)}
.ph-apropos{background:url(../images/apropos.jpg) center/cover,linear-gradient(135deg,var(--g3),var(--g1))}
.who h2,.mission h2{color:var(--g2);font-size:26px;margin-bottom:10px}
.who p{margin-bottom:12px;max-width:62ch}
.mission{background:var(--gl);border-radius:var(--r);padding:24px;border-left:6px solid var(--g3)}
.mission p{font-size:18px;line-height:1.7;color:var(--g1)}
.line{display:flex;align-items:center;gap:16px;color:var(--g2);font-size:26px;margin:10px 0 18px}
.line::before,.line::after{content:"";flex:1;height:2px;background:var(--g3)}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.card{position:relative;min-height:190px;border-radius:var(--r);overflow:hidden;color:#fff;display:flex;align-items:flex-end;background-size:cover;background-position:center}
.card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(0,0,0,.75))}
.card div{position:relative;z-index:1;padding:12px}
.card h3{font-size:18px}.card p{font-size:12.5px}.card .ic{width:26px;height:26px;color:#ffc531;margin-bottom:4px}
.ph-education{background-image:url(../images/education.jpg),linear-gradient(135deg,#2b6cb0,var(--g1))}
.ph-sante{background-image:url(../images/sante.jpg),linear-gradient(135deg,#5aa9c9,var(--g2))}
.ph-environnement{background-image:url(../images/environnement.jpg),linear-gradient(135deg,var(--g3),#0f3d22)}
.ph-solidarite{background-image:url(../images/solidarite.jpg),linear-gradient(135deg,#c98a3d,var(--g1))}
.stats{background:var(--g1);color:#fff;margin-top:26px;padding:22px 0}
.stats .wrap{display:grid;gap:18px;justify-items:center}
.stats ul{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:16px 24px;width:100%}
.stats li{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center}
.stats .ic{grid-row:span 2;width:34px;height:34px}.stats b{font-size:22px;line-height:1.1}.stats span{font-size:13px}
.sec{padding:34px 0 6px}
.news{display:grid;gap:14px}
.news article{border:1px solid #d7e6d9;border-radius:var(--r);padding:18px;border-top:4px solid var(--o)}
.news time{font-size:13px;color:var(--g2);font-weight:600}.news h3{margin:4px 0 6px;font-size:18px;color:var(--g1)}
.note{font-size:12px;color:#6b7a72;margin-top:10px}
.gal{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gal a{aspect-ratio:1;border-radius:10px;background-size:cover;background-position:center}
.g1{background-image:url(../images/galerie1.jpg),linear-gradient(135deg,var(--g3),var(--g1))}.g2{background-image:url(../images/galerie2.jpg),linear-gradient(135deg,#f5a04a,var(--o))}
.g3{background-image:url(../images/galerie3.jpg),linear-gradient(135deg,var(--g1),var(--g3))}.g4{background-image:url(../images/galerie4.jpg),linear-gradient(135deg,var(--o),var(--g2))}
.g5{background-image:url(../images/galerie5.jpg),linear-gradient(135deg,var(--g2),#a8d68a)}.g6{background-image:url(../images/galerie6.jpg),linear-gradient(135deg,#0f3d22,var(--o))}
.support{background:linear-gradient(135deg,var(--g1),var(--g2));color:#fff;padding:44px 0;margin-top:40px;text-align:center}
.support h2{font-size:30px;margin-bottom:8px}.support p{max-width:56ch;margin:0 auto 20px}.support .row{justify-content:center}
.form{display:grid;gap:14px;max-width:560px;margin-bottom:40px}
.form label{display:grid;gap:4px;font-weight:600;font-size:14px}
input,textarea{font:inherit;padding:12px 14px;border:1.5px solid #b9cfbf;border-radius:10px;width:100%}
.form .btn{justify-self:start}
#cmsg,#nmsg{font-size:14px;color:var(--g2);font-weight:600}
footer{background:#08331f;color:#fff}
.fgrid{display:grid;gap:26px;padding:30px 0}
footer h4{margin-bottom:8px}footer .fgrid a{display:block;text-decoration:none;font-size:14px;padding:2px 0}
footer .brand strong{color:#fff}
.soc{display:flex;gap:10px}.soc a{width:40px;height:40px;border-radius:50%;display:grid!important;place-items:center;font-weight:800;color:#fff}
.fb{background:#1877f2}.yt{background:#e11}.in{background:#0a66c2}.wa{background:#25d366}
.news-f{display:flex;margin-top:8px}.news-f input{border-radius:30px 0 0 30px;border:0}.news-f .btn{border-radius:0 30px 30px 0;white-space:nowrap}
.copy{background:#052416;font-size:13px;padding:14px 0}.copy .wrap{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
#install{position:fixed;right:14px;bottom:calc(14px + env(safe-area-inset-bottom));z-index:60;box-shadow:0 6px 18px rgba(0,0,0,.3)}
@media(min-width:900px){
 .burger{display:none}
 nav{position:static;display:flex;flex-direction:row;align-items:center;gap:2px;padding:0;box-shadow:none;background:none}
 nav a{padding:9px 14px;font-size:15px}nav .nav-don{margin:0 0 0 14px}
 .hero{padding:110px 0 130px}
 .pillars{grid-template-columns:repeat(4,1fr)}
 .about{grid-template-columns:1.1fr 1.3fr 1.1fr;align-items:center}
 .cards{grid-template-columns:repeat(4,1fr)}.card{min-height:230px}
 .stats .wrap{grid-template-columns:1fr auto;justify-items:stretch;align-items:center}.stats ul{grid-template-columns:repeat(4,1fr)}
 .news{grid-template-columns:repeat(3,1fr)}
 .gal{grid-template-columns:repeat(3,1fr)}
 .fgrid{grid-template-columns:1.3fr 1fr 1fr 1.4fr}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}