@font-face{font-family:"Bricolage Grotesque";src:url("../fonts/bricolage-grotesque-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Bricolage Grotesque";src:url("../fonts/bricolage-grotesque-latin-800-normal.woff2") format("woff2");font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible";src:url("../fonts/atkinson-hyperlegible-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible";src:url("../fonts/atkinson-hyperlegible-latin-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Atkinson Hyperlegible";src:url("../fonts/atkinson-hyperlegible-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
:root{
  --baobab:#0E4A2F; --nuit:#0A3A24; --feuille:#166C45; --soleil:#EACB16; --hibiscus:#D3353B; --ecorce:#5A3516;
  --encre:#1F2622; --doux:#4A5650; --brume:#EEF4EF; --trait:#D5E1D8;
  --titre:"Bricolage Grotesque","Atkinson Hyperlegible",system-ui,sans-serif;
  --texte:"Atkinson Hyperlegible",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;font-family:var(--texte);font-size:1.125rem;line-height:1.65;color:var(--encre);background:#fff}
[hidden]{display:none !important}
img{max-width:100%;display:block}
a{color:var(--feuille);text-underline-offset:3px}
a:hover{color:var(--baobab)}
:focus-visible{outline:3px solid var(--soleil);outline-offset:3px}
.visuellement-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.evitement{position:absolute;left:12px;top:-60px;background:var(--baobab);color:#fff;padding:10px 16px;border-radius:8px;z-index:50}
.evitement:focus{top:12px}
.conteneur{max-width:1160px;margin:0 auto;padding:0 24px}
.bande{display:grid;grid-template-columns:repeat(3,1fr);height:6px}
.bande i:nth-child(1){background:var(--feuille)}.bande i:nth-child(2){background:var(--soleil)}.bande i:nth-child(3){background:var(--hibiscus)}

/* En-tête */
header.site{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.97);border-bottom:1px solid var(--trait)}
.barre-site{display:flex;align-items:center;gap:20px;min-height:76px;position:relative}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--baobab)}
.logo svg{width:52px;height:43px;flex:none}
.logo span{font-family:var(--titre);font-weight:800;font-size:1.35rem;letter-spacing:-.01em;line-height:1}
.logo:hover{color:var(--baobab)}
nav.principale{margin-left:auto;display:flex;gap:2px;align-items:center}
nav.principale a{color:var(--encre);text-decoration:none;font-weight:700;padding:8px 12px;border-radius:8px}
nav.principale a:hover{background:var(--brume);color:var(--baobab)}
.menu-mobile{display:none;margin-left:auto}
.menu-mobile summary{list-style:none;cursor:pointer;font-weight:700;padding:10px 16px;border:2px solid var(--trait);border-radius:999px;color:var(--baobab)}
.menu-mobile summary::-webkit-details-marker{display:none}
.menu-mobile nav{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--trait);padding:8px 24px 18px;display:flex;flex-direction:column;box-shadow:0 14px 30px rgba(14,74,47,.12)}
.menu-mobile nav a{padding:12px 0;font-weight:700;color:var(--encre);text-decoration:none;border-bottom:1px solid var(--trait)}
.menu-mobile nav a:last-child{border-bottom:0}

/* Boutons */
.bouton{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:700 1.05rem/1.2 var(--texte);padding:14px 24px;border-radius:999px;text-decoration:none;border:2px solid transparent;min-height:50px;cursor:pointer;text-align:center}
.bouton.vert{background:var(--feuille);color:#fff}.bouton.vert:hover{background:var(--baobab);color:#fff}
.bouton.soleil{background:var(--soleil);color:var(--encre)}.bouton.soleil:hover{background:#F4D838;color:var(--encre)}
.bouton.ligne{border-color:var(--baobab);color:var(--baobab);background:transparent}.bouton.ligne:hover{background:var(--brume)}
.bouton.ligne-claire{border-color:rgba(255,255,255,.75);color:#fff;background:transparent}.bouton.ligne-claire:hover{background:rgba(255,255,255,.1);color:#fff}
.bouton.compact{padding:10px 18px;min-height:44px;font-size:1rem}

/* Accueil */
.hero{padding:56px 0 80px;overflow:hidden}
.hero .grille{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:40px;align-items:center}
.hero h1{font-family:var(--titre);font-weight:800;font-size:clamp(2.5rem,5.4vw,4.5rem);line-height:1.02;letter-spacing:-.03em;color:var(--baobab);margin:0 0 24px;text-wrap:balance}
.chapo{font-size:1.25rem;line-height:1.6;max-width:32em;color:var(--doux);margin:0 0 32px}
.actions-hero{display:flex;flex-wrap:wrap;gap:12px}
.canopee{margin:0;width:100%;max-width:580px;justify-self:end}
.canopee svg{width:100%;height:auto;display:block}
.canopee .teinte{display:none}
.canopee.avec-photo .teinte{display:inline}
@media (prefers-reduced-motion:no-preference){
  .canopee .feuillage{transform-box:view-box;transform-origin:266px 300px;animation:pousse .9s cubic-bezier(.2,.8,.2,1) both .15s}
  @keyframes pousse{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:none}}
}

/* Sections */
.section{padding:88px 0}
.titre-section{font-family:var(--titre);font-weight:800;font-size:clamp(2rem,3.6vw,2.9rem);line-height:1.08;letter-spacing:-.02em;color:var(--baobab);margin:0 0 20px;text-wrap:balance}
.intro-section{max-width:40em;color:var(--doux);margin:0 0 44px;font-size:1.2rem}
.illustration{margin:0;border-radius:28px 28px 28px 6px;overflow:hidden;aspect-ratio:3/2;background:var(--brume)}
.illustration img{width:100%;height:100%;object-fit:cover}
.illustration.sans-image{display:grid;place-items:center}
.illustration.sans-image::after{content:"";width:26%;aspect-ratio:420/346;background:url("../logo/logo-arbre.svg") center/contain no-repeat;opacity:.9}

.mission .grille{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
.mission p{max-width:34em;margin:0 0 18px}
.faits{display:grid;grid-template-columns:1fr 1fr;gap:20px 32px;margin:32px 0 0;padding:26px 0 0;border-top:3px solid var(--baobab)}
.faits dt{font-weight:700;color:var(--baobab)}
.faits dd{margin:2px 0 0;color:var(--doux)}

.actions-section{background:var(--brume)}
.axes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 44px;margin:0;padding:0;list-style:none}
.axe .illustration{border-radius:22px;border-bottom:7px solid var(--c);margin-bottom:20px;background:#fff}
.axe h3{font-family:var(--titre);font-weight:700;font-size:1.55rem;line-height:1.2;color:var(--baobab);margin:0 0 8px}
.axe p{margin:0;color:var(--doux);max-width:32em}
.note-projets{margin:48px 0 0;font-weight:700;color:var(--baobab);font-size:1.15rem}

.rejoindre{background:var(--baobab);color:#E3EEE6}
.rejoindre .titre-section{color:#fff}
.rejoindre .intro-section{color:#C9DDCF}
.voies{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.voie{padding:0 34px;border-left:1px solid rgba(255,255,255,.22);display:flex;flex-direction:column}
.voie:first-child{padding-left:0;border-left:0}
.voie:last-child{padding-right:0}
.voie h3{font-family:var(--titre);font-weight:700;font-size:1.7rem;line-height:1.15;color:var(--soleil);margin:0 0 14px}
.voie p{margin:0 0 14px}
.voie .liens{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:auto;padding-top:12px}
.rejoindre a:not(.bouton){color:#fff}
.cotisation{font-weight:700;color:#fff}
.mention-fiscale{font-size:1rem;border-left:3px solid var(--soleil);padding-left:14px}
.adresse-cheque{font-size:1rem;color:#C9DDCF}

.bureau{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px;margin:12px 0 0;padding:0;list-style:none}
.bureau li{border-top:5px solid var(--c);padding-top:16px}
.bureau strong{display:block;font-family:var(--titre);font-weight:700;font-size:1.35rem;line-height:1.2;color:var(--baobab)}
.bureau span{color:var(--doux)}

.faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 48px;margin-top:12px}
.faq > div{border-top:4px solid var(--c);padding-top:16px}
.faq h3{font-family:var(--titre);font-weight:700;font-size:1.3rem;line-height:1.25;color:var(--baobab);margin:0 0 8px}
.faq p{margin:0;color:var(--doux);max-width:36em}
.contact{background:var(--brume)}
.contact .grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:8px}
.contact h3{font-size:1rem;margin:0 0 6px;color:var(--doux);font-weight:700}
.contact p{margin:0;font-size:1.2rem;line-height:1.5}
.contact a{font-weight:700}
.reseaux{display:flex;gap:16px;flex-wrap:wrap}

/* Pied de page */
footer.site{background:var(--nuit);color:#CFE0D4;padding:56px 0 36px;font-size:1rem}
footer .haut-pied{display:flex;gap:24px 48px;justify-content:space-between;flex-wrap:wrap;align-items:flex-start;margin-bottom:28px}
footer .logo{color:#fff}
footer .logo:hover{color:#fff}
footer .devise{margin:10px 0 0;color:#CFE0D4}
footer .identite{margin:0;text-align:right}
footer details{border-top:1px solid rgba(255,255,255,.18);padding:16px 0}
footer summary{cursor:pointer;font-weight:700;color:#fff}
footer details p{margin:12px 0 0;max-width:60em}
footer a{color:#fff}
footer .copyright{margin:24px 0 0;font-size:.92rem;color:#A9C4B1}

@media (max-width:1100px){
  nav.principale{display:none}
  .menu-mobile{display:block}
  .barre-site .espace-btn{display:none}
}
@media (max-width:600px){
  .barre-site .bouton.soleil{display:none}
}
@media (max-width:900px){
  .hero{padding:32px 0 56px}
  .hero .grille,.mission .grille{grid-template-columns:minmax(0,1fr);gap:32px}
  .canopee{justify-self:center;max-width:420px;order:-1}
  .section{padding:64px 0}
  .axes{grid-template-columns:minmax(0,1fr);gap:40px}
  .voies{grid-template-columns:minmax(0,1fr);gap:36px}
  .voie,.voie:first-child,.voie:last-child{padding:28px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.22)}
  .voie:first-child{border-top:0;padding-top:0}
  .bureau{grid-template-columns:repeat(2,minmax(0,1fr))}
  .contact .grille,.faits,.faq{grid-template-columns:minmax(0,1fr)}
  footer .identite{text-align:left}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ----- Mentions « à venir » ----- */
.badge{display:inline-block;background:var(--soleil);color:var(--encre);font-weight:700;font-size:.8rem;line-height:1;padding:6px 11px;border-radius:999px;white-space:nowrap}
.a-venir{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:1rem;margin:0 0 12px}
nav.principale a[aria-current="page"]{background:var(--brume);color:var(--baobab)}
.barre-site .espace-btn{margin-left:4px}

/* ----- Simulateur de réduction d'impôt ----- */
.grille-sim{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
.titre-avec-badge{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:0 0 20px}
.titre-avec-badge .titre-section{margin:0}
.note-a-venir{background:#FBF3C6;border-radius:16px;padding:16px 20px;color:#3D3500;max-width:34em;margin:0 0 18px}
.calculette{background:var(--brume);border-radius:28px 28px 28px 6px;padding:32px}
.calculette label{display:block;font-weight:700;margin:0 0 6px}
.calculette label span{font-weight:400;color:var(--doux)}
.champ-euro{display:flex;align-items:center;background:#fff;border:2px solid var(--trait);border-radius:14px;padding:0 16px;margin:0 0 16px}
.champ-euro:focus-within{border-color:var(--feuille)}
.champ-euro input{flex:1;border:0;font:700 1.4rem/1.2 var(--texte);padding:12px 0;background:transparent;color:var(--encre);min-width:0}
.champ-euro input:focus{outline:none}
.champ-euro span{font-weight:700;color:var(--doux)}
.choix{display:flex;flex-wrap:wrap;gap:8px;margin:-4px 0 20px}
.choix button{font:700 1rem/1 var(--texte);border:2px solid var(--feuille);background:#fff;color:var(--feuille);border-radius:999px;padding:10px 16px;cursor:pointer;min-height:44px}
.choix button[aria-pressed="true"]{background:var(--feuille);color:#fff}
.resultat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:8px 0 12px}
.resultat div{background:#fff;border-radius:16px;padding:16px 18px}
.resultat dt{font-size:.95rem;color:var(--doux);line-height:1.35}
.resultat dd{margin:6px 0 0;font-family:var(--titre);font-weight:800;font-size:2rem;line-height:1;color:var(--baobab)}
.petite-note{font-size:.95rem;color:var(--doux);margin:10px 0 0}

/* ----- Pages intérieures ----- */
.page-tete{padding:56px 0 8px}
.page-tete h1{font-family:var(--titre);font-weight:800;font-size:clamp(2.3rem,4.6vw,3.6rem);line-height:1.04;letter-spacing:-.03em;color:var(--baobab);margin:0 0 16px;text-wrap:balance}
.page-tete .chapo{margin-bottom:8px}
.fond-brume{background:var(--brume)}

/* ----- Projets ----- */
.projets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;list-style:none;margin:0;padding:0}
.projet{background:#fff;border-radius:22px;overflow:hidden;display:flex;flex-direction:column}
.projet .illustration{border-radius:0;border-bottom:7px solid var(--c);aspect-ratio:3/2}
.projet .corps{padding:24px 26px 28px;display:flex;flex-direction:column;gap:10px;flex:1}
.projet h2{font-family:var(--titre);font-weight:700;font-size:1.55rem;line-height:1.2;color:var(--baobab);margin:0}
.projet p{margin:0}
.etiquettes{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.statut{display:inline-block;font-weight:700;font-size:.82rem;line-height:1;padding:6px 11px;border-radius:999px}
.statut.en-cours{background:var(--feuille);color:#fff}
.statut.en-preparation{background:var(--soleil);color:var(--encre)}
.statut.termine{background:#E3E8E5;color:var(--doux)}
.meta-projet{color:var(--doux);font-size:.98rem}
.jauge{height:10px;background:var(--brume);border-radius:999px;overflow:hidden;margin-top:4px}
.jauge i{display:block;height:100%;background:var(--feuille);border-radius:999px}
.projet details summary{cursor:pointer;font-weight:700;color:var(--feuille)}
.projet details p{margin-top:8px;color:var(--doux)}
.projet .actions-projet{margin-top:auto;padding-top:10px}
.projets-vide{background:#fff;border-radius:22px;padding:40px 32px;text-align:center;max-width:46em;margin:0 auto}
.projets-vide h2{font-family:var(--titre);font-weight:700;font-size:1.6rem;color:var(--baobab);margin:0 0 8px}

/* ----- Espace adhérents ----- */
.cartes-espace{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;list-style:none;margin:0;padding:0}
.carte-espace{background:#fff;border-radius:22px;padding:28px;border-top:6px solid var(--c);display:flex;flex-direction:column;gap:12px}
.carte-espace h2{font-family:var(--titre);font-weight:700;font-size:1.45rem;line-height:1.2;color:var(--baobab);margin:0}
.carte-espace p{margin:0;color:var(--doux)}
.carte-espace .bas{margin-top:auto;padding-top:8px}
.encart{background:#fff;border-radius:22px;padding:24px 28px;margin-top:32px;max-width:52em}
.encart p{margin:0 0 8px}.encart p:last-child{margin:0}

@media (max-width:900px){
  .grille-sim,.projets,.cartes-espace,.resultat{grid-template-columns:minmax(0,1fr)}
  .calculette{padding:24px}
}
