/* ==========================================================================
   Altèro — feuille de style unique du site
   Pour changer les couleurs de tout le site : modifier le bloc :root ci-dessous.
   Chaque rubrique a sa couleur (variables --c-…).
   ========================================================================== */

@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:600;font-display:swap;
  src:url("../fonts/barlow-condensed-latin-600-normal.woff2") format("woff2");}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;
  src:url("../fonts/barlow-condensed-latin-700-normal.woff2") format("woff2");}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:800;font-display:swap;
  src:url("../fonts/barlow-condensed-latin-800-normal.woff2") format("woff2");}
@font-face{font-family:"Atkinson Hyperlegible";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/atkinson-hyperlegible-latin-400-normal.woff2") format("woff2");}
@font-face{font-family:"Atkinson Hyperlegible";font-style:italic;font-weight:400;font-display:swap;
  src:url("../fonts/atkinson-hyperlegible-latin-400-italic.woff2") format("woff2");}
@font-face{font-family:"Atkinson Hyperlegible";font-style:normal;font-weight:700;font-display:swap;
  src:url("../fonts/atkinson-hyperlegible-latin-700-normal.woff2") format("woff2");}
@font-face{font-family:"Atkinson Hyperlegible";font-style:italic;font-weight:700;font-display:swap;
  src:url("../fonts/atkinson-hyperlegible-latin-700-italic.woff2") format("woff2");}

:root{
  /* Fonds et texte */
  --encre:#161412;
  --sable:#f8e6d0;
  --creme:#fdf7ee;
  --blanc:#ffffff;
  --texte-doux:#51483b;
  --filet:#dcc4a4;
  --eclat:#ee4f9c;
  --erreur:#a8231b;
  --succes:#17694f;

  /* Code couleur des rubriques */
  --c-association:#1e5646;   /* L’association : vert sapin */
  --c-domaines:#f6c63c;      /* Domaines d’action : jaune soleil */
  --c-programmes:#e07b45;    /* Programmes : orange */
  --c-entreprises:#b7a5ec;   /* Entreprises et organisations : lilas */
  --c-actualites:#c6a47e;    /* Actualités : caramel */
  --c-agir:#9fc8e4;          /* Agir avec nous : bleu ciel */
  --c-contact:#161412;       /* Contact : noir */

  /* Couleur de la rubrique affichée (redéfinie par la classe du <body>) */
  --rubrique:var(--c-domaines);
  --sur-rubrique:var(--encre);

  --titre:"Barlow Condensed","Arial Narrow","Roboto Condensed",Impact,sans-serif;
  --corps:"Atkinson Hyperlegible","Verdana","Segoe UI",system-ui,sans-serif;
  --largeur:74rem;
  --marge:clamp(1.25rem,4vw,3rem);
  --bloc:clamp(3.5rem,8vw,6.5rem);
  --rayon:1.1rem;
}
.r-association{--rubrique:var(--c-association);--sur-rubrique:var(--blanc)}
.r-domaines{--rubrique:var(--c-domaines)}
.r-programmes{--rubrique:var(--c-programmes)}
.r-entreprises{--rubrique:var(--c-entreprises)}
.r-actualites{--rubrique:var(--c-actualites)}
.r-agir{--rubrique:var(--c-agir)}
.r-contact{--rubrique:var(--c-contact);--sur-rubrique:var(--blanc)}
.r-neutre{--rubrique:var(--sable)}

/* Couleurs utilisables sur une tuile, une carte ou un bandeau */
.t-sapin{--couleur:var(--c-association);--sur-couleur:var(--blanc)}
.t-jaune{--couleur:var(--c-domaines);--sur-couleur:var(--encre)}
.t-orange{--couleur:var(--c-programmes);--sur-couleur:var(--encre)}
.t-lilas{--couleur:var(--c-entreprises);--sur-couleur:var(--encre)}
.t-caramel{--couleur:var(--c-actualites);--sur-couleur:var(--encre)}
.t-ciel{--couleur:var(--c-agir);--sur-couleur:var(--encre)}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:6rem}
body{margin:0;background:var(--creme);color:var(--encre);font-family:var(--corps);font-size:1.0625rem;line-height:1.6}
img,svg{max-width:100%;height:auto}
h1,h2,h3,h4{font-family:var(--titre);font-weight:800;text-transform:uppercase;line-height:1;letter-spacing:0;margin:0 0 .55em;text-wrap:balance}
h1{font-size:clamp(2.75rem,6.4vw,4.75rem)}
h2{font-size:clamp(2.1rem,4.2vw,3.1rem)}
h3{font-size:clamp(1.45rem,2.2vw,1.75rem);font-weight:700;line-height:1.05}
h4{font-size:1.2rem;font-weight:700}
p{margin:0 0 1.1em;max-width:68ch}
ul,ol{margin:0 0 1.1em;padding-left:1.2em;max-width:68ch}
li{margin-bottom:.45em}
a{color:var(--encre);text-underline-offset:.2em;text-decoration-thickness:.09em}
a:hover{text-decoration-thickness:.18em}
:focus-visible{outline:3px solid var(--encre);outline-offset:3px;border-radius:3px}
.sur-fonce :focus-visible{outline-color:var(--c-domaines)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.surligne{background:var(--surlignage,var(--c-domaines));color:var(--sur-surlignage,var(--encre));padding:0 .12em;box-decoration-break:clone;-webkit-box-decoration-break:clone}

.evitement{position:absolute;left:1rem;top:-5rem;z-index:100;background:var(--encre);color:var(--blanc);padding:.75rem 1rem;font-weight:700;border-radius:.5rem}
.evitement:focus{top:1rem}

.conteneur{width:100%;max-width:var(--largeur);margin-inline:auto;padding-inline:var(--marge)}
.bloc{padding-block:var(--bloc)}
.bloc-sable{background:var(--sable)}
.centre{text-align:center}
.centre > p{margin-inline:auto}
.chapeau{font-size:clamp(1.12rem,1.6vw,1.3rem);line-height:1.5;max-width:58ch}
.doux{color:var(--texte-doux)}

/* ---------- En-tête ---------- */
.entete{position:sticky;top:0;z-index:50;background:var(--sable);border-bottom:1px solid var(--filet)}
.entete .conteneur{max-width:86rem;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:4.5rem}
.marque{font-family:var(--titre);font-weight:800;font-size:2.1rem;line-height:1;text-transform:uppercase;color:var(--encre);text-decoration:none;display:inline-flex;align-items:baseline;gap:.1em}
.marque{flex:none}
.marque img{height:2.1rem;width:auto;max-width:none;display:block}
.marque-point{width:.3em;height:.3em;border-radius:50%;background:var(--c-programmes);display:inline-block}
.nav-liste{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:clamp(.7rem,1.3vw,1.4rem);max-width:none}
.nav-liste li{margin:0}
.nav-liste a{--c:var(--encre);font-family:var(--titre);font-weight:700;text-transform:uppercase;font-size:1.12rem;letter-spacing:.01em;color:var(--encre);text-decoration:none;padding:.35rem 0;white-space:nowrap;background:linear-gradient(var(--c),var(--c)) left bottom/100% 4px no-repeat}
.nav-liste a:hover,.nav-liste a[aria-current="page"]{background-size:100% 100%;color:var(--sur-c,var(--encre));padding-inline:.35rem;margin-inline:-.35rem}
.nav-liste .n-association{--c:var(--c-association);--sur-c:var(--blanc)}
.nav-liste .n-domaines{--c:var(--c-domaines)}
.nav-liste .n-programmes{--c:var(--c-programmes)}
.nav-liste .n-entreprises{--c:var(--c-entreprises)}
.nav-liste .n-actualites{--c:var(--c-actualites)}
.nav-liste .n-agir{--c:var(--c-agir)}
.nav-liste a.bouton{background:var(--encre);color:var(--blanc);padding:.55rem 1.1rem;margin:0}
.nav-liste a.bouton:hover,.nav-liste a.bouton[aria-current="page"]{background:var(--blanc);color:var(--encre);padding:.55rem 1.1rem;margin:0}
.nav-bascule{display:none;align-items:center;gap:.5rem;background:var(--encre);border:2px solid var(--encre);color:var(--blanc);font:700 1.2rem var(--titre);text-transform:uppercase;padding:.45rem 1rem;border-radius:.7rem;cursor:pointer}
@media (max-width:80rem){
  .nav-bascule{display:inline-flex}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--sable);border-bottom:1px solid var(--filet);box-shadow:0 1.5rem 2rem -1.5rem rgba(22,20,18,.4);max-height:calc(100vh - 4.5rem);overflow:auto}
  .nav.ouvert{display:block}
  .nav-liste{flex-direction:column;align-items:stretch;gap:.5rem;padding:1rem var(--marge) 1.5rem}
  .nav-liste a{display:block;font-size:1.5rem;padding:.6rem .7rem;margin:0;border-radius:.6rem;background:var(--c);color:var(--sur-c,var(--encre))}
  .nav-liste a:hover,.nav-liste a[aria-current="page"]{padding:.6rem .7rem;margin:0;outline:3px solid var(--encre);outline-offset:-3px}
  .nav-liste a.bouton,.nav-liste a.bouton:hover{text-align:center;padding:.7rem 1.1rem}
}

/* ---------- Boutons ---------- */
.bouton{display:inline-block;background:var(--encre);color:var(--blanc);font:700 1.2rem/1.2 var(--titre);text-transform:uppercase;letter-spacing:.03em;padding:.85rem 1.6rem;border-radius:.8rem;text-decoration:none;border:2px solid var(--encre);cursor:pointer;transition:background-color .15s,color .15s}
.bouton:hover{background:var(--blanc);color:var(--encre)}
.bouton-contour{background:transparent;color:var(--encre)}
.bouton-contour:hover{background:var(--encre);color:var(--blanc)}
.sur-fonce .bouton{background:var(--blanc);border-color:var(--blanc);color:var(--encre)}
.sur-fonce .bouton:hover{background:var(--c-domaines);border-color:var(--c-domaines)}
.sur-fonce .bouton-contour{background:transparent;color:var(--blanc)}
.sur-fonce .bouton-contour:hover{background:var(--blanc);color:var(--encre)}
.actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2rem}
.centre .actions{justify-content:center}

/* ---------- Accueil : conviction ---------- */
.conviction{background:var(--sable);padding-block:clamp(2.5rem,6vw,4.5rem)}
.conviction .conteneur{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(1.5rem,3vw,3rem);align-items:center}
.conviction-texte{position:relative;z-index:2}
.conviction h1{font-size:clamp(2.7rem,6.3vw,5.1rem);line-height:1;margin:0 -5rem .55em 0}
.ligne{display:block;width:fit-content;background:var(--c-domaines);padding:.03em .16em .06em;white-space:nowrap}
.ligne + .ligne{margin-top:.07em}
.ligne-claire{background:var(--blanc)}
.eclat{display:block;width:3.4rem;height:auto;margin:0 0 .3rem 5.5rem;fill:none;stroke:var(--eclat);stroke-width:6;stroke-linecap:round}
.collage{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.collage img{display:block;width:100%;height:100%;object-fit:cover;border-radius:1.7rem}
.collage .grand{grid-column:1 / -1;aspect-ratio:16 / 11}
.collage .petit{aspect-ratio:10 / 9}
.p-diplome{object-position:58% 30%}
.p-agricultrice{object-position:74% 30%}
.p-ordinateur{object-position:78% 30%}
@media (max-width:56rem){
  .conviction .conteneur{grid-template-columns:1fr}
  .conviction h1{margin-right:0;font-size:clamp(2.5rem,12.5vw,4.4rem)}
  .eclat{margin-left:3.5rem}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .bouton{transition:none}
}

/* ---------- Constats ---------- */
.constats{margin:2.5rem 0 0;padding:0;max-width:none;display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.constats div{background:var(--blanc);border:1.5px solid var(--encre);border-radius:var(--rayon);padding:1.4rem 1.4rem 1.5rem}
.constats dt{font-family:var(--titre);font-weight:700;text-transform:uppercase;font-size:1.5rem;line-height:1.05;margin-bottom:.5rem}
.constats dd{margin:0;color:var(--texte-doux)}

/* ---------- Tuiles de couleur ---------- */
.tuiles{list-style:none;margin:2.5rem 0 0;padding:0;max-width:none;display:grid;gap:1rem;grid-template-columns:repeat(6,minmax(0,1fr))}
.tuiles > li{margin:0;grid-column:span 2;background:var(--couleur);color:var(--sur-couleur);border-radius:var(--rayon);padding:1.6rem 1.5rem 1.7rem;display:flex;flex-direction:column;justify-content:flex-end;min-height:13rem}
.tuiles > li:nth-child(-n+2){grid-column:span 3;min-height:15rem}
.tuiles strong{font-family:var(--titre);font-weight:800;text-transform:uppercase;font-size:clamp(2.2rem,4.4vw,3.3rem);line-height:.95;margin-bottom:.35em}
.tuiles span{max-width:44ch}
@media (max-width:56rem){.tuiles{grid-template-columns:1fr}.tuiles > li,.tuiles > li:nth-child(-n+2){grid-column:auto;min-height:0}}

/* ---------- Programmes ---------- */
.programmes{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));margin-top:2.5rem;text-align:left}
.programme{display:flex;flex-direction:column;background:var(--blanc);border-radius:var(--rayon);overflow:hidden;border:1.5px solid var(--encre)}
.programme-tete{background:var(--couleur,var(--c-programmes));color:var(--sur-couleur,var(--encre));padding:2.2rem 1.5rem 1.4rem;min-height:11rem;display:flex;align-items:flex-end}
.programme-tete h3{font-size:clamp(2rem,3vw,2.5rem);font-weight:800;line-height:.95;margin:0}
.programme-corps{padding:1.3rem 1.5rem 1.6rem;display:flex;flex-direction:column;align-items:flex-start;gap:.9rem;flex:1}
.programme-corps p{margin:0}
.programme-corps a{margin-top:auto;font-weight:700}

/* ---------- Mention « à compléter » ---------- */
.provisoire{display:inline-block;font-size:.875rem;font-weight:700;color:var(--encre);background:#fff3d6;border:1.5px dashed #8a5a00;border-radius:.35rem;padding:.1rem .5rem;line-height:1.5}
.a-completer{border-left:4px dashed #8a5a00;background:#fff8e6;padding:1rem 1.2rem;margin:0 0 1.5rem;max-width:68ch;color:var(--encre)}
.a-completer p:last-child{margin-bottom:0}
.grille-3 + .a-completer{margin-top:2rem}

/* ---------- Carte encadrée ---------- */
.carte{background:var(--sable);border:1.5px solid var(--c-programmes);border-radius:var(--rayon);padding:clamp(1.8rem,4vw,3.5rem);max-width:60rem;margin-inline:auto}
.bloc-sable .carte{background:var(--creme)}
.carte > :last-child{margin-bottom:0}
.carte-photo{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(1.5rem,4vw,3rem);align-items:center;max-width:none}
.carte-photo img{display:block;width:100%;aspect-ratio:4 / 5;object-fit:cover;border-radius:var(--rayon)}
.carte-photo .acteurs{justify-content:flex-start}
@media (max-width:56rem){.carte-photo{grid-template-columns:1fr}.carte-photo img{aspect-ratio:3 / 2}}
.acteurs{list-style:none;padding:0;margin:1.8rem 0 0;max-width:none;display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem}
.acteurs li{margin:0;font-family:var(--titre);font-weight:700;text-transform:uppercase;font-size:clamp(1.2rem,2.2vw,1.6rem);line-height:1;padding:.5rem .9rem;border-radius:.6rem;background:var(--couleur);color:var(--sur-couleur)}

/* ---------- Actualités ---------- */
.fil{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));margin-top:2rem;text-align:left}
.fil-element{background:var(--blanc);border:1.5px solid var(--encre);border-top:.9rem solid var(--c-actualites);border-radius:var(--rayon);padding:1.3rem 1.5rem 1.6rem;display:flex;flex-direction:column;gap:.5rem}
.fil-element.est-evenement{border-top-color:var(--c-domaines)}
.fil-element h3{margin:0}
.fil-element p{margin:0}
.fil-meta{font-size:.95rem;color:var(--texte-doux);font-weight:700}
.fil-element .bouton{align-self:flex-start;margin-top:.8rem;padding:.55rem 1.1rem;font-size:1.1rem}
.fil-vide{border:2px dashed var(--encre);border-radius:var(--rayon);padding:1.8rem;max-width:44rem;background:var(--blanc);margin:2rem auto 0;text-align:left}
.section .fil-vide{margin-inline:0}
.fil-vide p:last-child{margin-bottom:0}

/* ---------- Appel final ---------- */
.mouvement{background:var(--c-association);position:relative;overflow:hidden}
.mouvement .fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.mouvement .conteneur{position:relative}
.mouvement .carte{background:var(--creme);border-color:var(--encre);text-align:center}
.mouvement .carte p{margin-inline:auto}
.mouvement .actions{justify-content:center}

/* ---------- Pages intérieures ---------- */
.titre-page{background:var(--rubrique);color:var(--sur-rubrique);padding-block:clamp(2.5rem,6vw,4.5rem)}
.titre-page h1{max-width:20ch}
.titre-page.avec-photo .conteneur{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.titre-photo{display:block;width:100%;aspect-ratio:3 / 2;object-fit:cover;border-radius:1.7rem}
@media (max-width:56rem){.titre-page.avec-photo .conteneur{grid-template-columns:1fr}}
.titre-page .chapeau{margin-bottom:0}
.titre-page a{color:inherit}
.titre-page.t-sapin,.titre-page.t-jaune,.titre-page.t-orange,.titre-page.t-lilas,.titre-page.t-caramel,.titre-page.t-ciel{background:var(--couleur);color:var(--sur-couleur)}
.r-association .titre-page :focus-visible,.r-contact .titre-page :focus-visible,.titre-page.t-sapin :focus-visible{outline-color:var(--c-domaines)}
.ariane{font-size:.95rem;margin:0 0 1.5rem;max-width:none}
.section{padding-block:clamp(2.5rem,5vw,4rem);border-top:1.5px solid var(--filet)}
.section:first-of-type{border-top:0}
.duo{display:grid;gap:clamp(1.5rem,5vw,5rem);grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:start}
@media (max-width:52rem){.duo{grid-template-columns:1fr}}
.section h2 .surligne,.fiche h2 .surligne{--surlignage:var(--rubrique);--sur-surlignage:var(--sur-rubrique)}
.grille-3{display:grid;gap:1.1rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));margin-top:2rem}
.grille-3 > *{background:var(--blanc);border:1.5px solid var(--encre);border-top:.9rem solid var(--rubrique);border-radius:var(--rayon);padding:1.2rem 1.4rem 1.5rem}
.grille-3 h3{margin-bottom:.4em}
.grille-3 p:last-child{margin-bottom:0}
.fiche{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:1rem clamp(1.5rem,5vw,5rem);padding:2.2rem 0;border-top:1.5px solid var(--filet)}
.fiche:first-of-type{border-top:0}
.fiche h2{font-size:clamp(1.7rem,2.6vw,2.1rem);margin:0}
.fiche > div > :last-child{margin-bottom:0}
.pastille{display:block;width:3.2rem;height:.9rem;border-radius:.45rem;background:var(--couleur);margin-bottom:.9rem}
@media (max-width:52rem){.fiche{grid-template-columns:1fr}}
.encart{background:var(--sable);border:1.5px solid var(--encre);border-radius:var(--rayon);padding:clamp(1.5rem,3vw,2.5rem);margin-top:2rem}
.encart > :last-child{margin-bottom:0}
.encart .actions{margin-top:1.2rem}
main > .conteneur{padding-bottom:var(--bloc)}
main:focus{outline:none}

/* ---------- Formulaire ---------- */
.formulaire{display:grid;gap:1.3rem;max-width:42rem}
.champ label{display:block;font-weight:700;margin-bottom:.35rem}
.champ .aide{display:block;font-size:.95rem;color:var(--texte-doux);margin-bottom:.35rem}
.champ input[type=text],.champ input[type=email],.champ input[type=tel],.champ select,.champ textarea{width:100%;font:inherit;color:var(--encre);background:var(--blanc);border:2px solid var(--encre);border-radius:.6rem;padding:.75rem .85rem}
.champ textarea{min-height:10rem;resize:vertical}
.champ [aria-invalid="true"]{border-color:var(--erreur);background:#fff6f5}
.champ .erreur{display:block;color:var(--erreur);font-weight:700;font-size:.95rem;margin-top:.35rem}
.champ .erreur:empty{display:none}
.champ-case{display:grid;grid-template-columns:auto 1fr;gap:.2rem .7rem;align-items:start}
.champ-case input{width:1.35rem;height:1.35rem;margin:.2rem 0 0;accent-color:var(--encre)}
.champ-case label{font-weight:400;margin:0}
.champ-case .erreur{grid-column:2}
.piege{position:absolute;left:-200vw}
.retour{border-radius:.7rem;padding:1.1rem 1.3rem;max-width:42rem;margin-bottom:1.5rem}
.retour:empty{display:none}
.retour.ok{background:#e3f4ee;border:2px solid var(--succes);color:#0e4635}
.retour.ko{background:#fdecea;border:2px solid var(--erreur);color:#7a1610}
.retour p{margin:0 0 .4em}
.retour p:last-child{margin:0}
.obligatoire{color:var(--erreur)}

/* ---------- Pied de page ---------- */
.pied{background:var(--sable);border-top:1.5px solid var(--encre);padding-block:3.5rem 2rem}
.pied-grille{display:grid;gap:2.5rem;grid-template-columns:minmax(0,5fr) minmax(0,3fr) minmax(0,3fr)}
@media (max-width:52rem){.pied-grille{grid-template-columns:1fr}}
.pied .marque{margin-bottom:1rem}
.pied .marque img{height:2.8rem}
.pied h2{font-size:1.4rem;font-weight:700;margin-bottom:.8rem}
.pied ul{list-style:none;padding:0;margin:0}
.pied li{margin-bottom:.5rem}
.pied-bas{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--filet);display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;font-size:.95rem}
.pied-bas p{margin:0}

@media print{.entete,.pied,.collage,.fond,.actions,.nav-bascule{display:none}body{font-size:11pt;background:#fff}}
.constats,.tuiles{text-align:left}