/* ============ Tokens : valeurs relevées sur la maquette ============ */
@font-face{font-family:"Bebas Neue";src:url("../assets/fonts/bebas-neue-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bebas Neue";src:url("../assets/fonts/bebas-neue-latin-ext-400-normal.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* Substituts libres : Montserrat ≈ Gotham (texte), Alegreya Sans ≈ Faune (sous-titres).
   Pour utiliser les polices d'origine, remplacer uniquement --font-text / --font-sub. */
@font-face{font-family:"Montserrat";src:url("../assets/fonts/montserrat-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Montserrat";src:url("../assets/fonts/montserrat-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Montserrat";src:url("../assets/fonts/montserrat-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Alegreya Sans";src:url("../assets/fonts/alegreya-sans-latin-800-normal.woff2") format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Alegreya Sans";src:url("../assets/fonts/alegreya-sans-latin-900-normal.woff2") format("woff2");font-weight:900;font-display:swap}

:root{
  /* couleurs */
  --blue:#0000c1;
  --pink:#ff589f;
  --yellow:#feec2a;
  --yellow-pale:#fff397;
  --lavender:#e5e5f9;
  --white:#fff;
  --ink:#0a0a1e;
  --grey-ph:#dedede;

  /* typographies */
  --font-title:"Bebas Neue","Arial Narrow",Impact,sans-serif;
  --font-sub:"Alegreya Sans","Trebuchet MS",sans-serif;
  --font-text:"Montserrat","Helvetica Neue",Arial,sans-serif;

  /* échelle (fluide) */
  --fs-hero:clamp(2rem,3.5vw + .6rem,3.7rem);
  --fs-h2:clamp(2.1rem,3vw + .6rem,3.2rem);
  --fs-kicker:clamp(1.15rem,1vw + .8rem,1.5rem);
  --fs-h3:clamp(1.55rem,1.2vw + 1rem,2.05rem);
  --fs-sub:clamp(1.35rem,.9vw + 1rem,1.75rem);
  --fs-body:1rem;
  --fs-small:.875rem;

  /* espacements / mise en page */
  --gutter:clamp(1.25rem,4vw,3rem);
  --container:1200px;
  --section-y:clamp(4rem,8vw,7rem);
  --header-h:clamp(76px,9.5vw,136px);

  /* cadres décalés */
  --frame-offset:clamp(12px,1.6vw,20px);

  /* mouvements */
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-pop:cubic-bezier(.34,1.56,.64,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 1rem)}
body{margin:0;font-family:var(--font-text);font-weight:500;font-size:var(--fs-body);line-height:1.55;color:var(--ink);background:var(--white);overflow-x:hidden}
img,svg{display:block;max-width:100%;height:auto}
h1,h2,h3,h4,p,figure,ul,ol,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
button,input,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--pink);outline-offset:3px}
.skip{position:absolute;left:-999px;top:0;background:var(--blue);color:#fff;padding:.75rem 1rem;z-index:100}
.skip:focus{left:0}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* titres : Bebas Neue (caps uniquement, on tape en casse normale dans le contenu) */
.h-hero,.h2,.h3,.kicker,.tag,.btn,.nav a,.num{font-family:var(--font-title);font-weight:400;text-transform:uppercase;letter-spacing:.01em}
.h-hero{font-size:var(--fs-hero);line-height:.98}
.h2{font-size:var(--fs-h2);line-height:1}
.h3{font-size:var(--fs-h3);line-height:1}
.kicker{font-size:var(--fs-kicker);line-height:1;margin-bottom:.15em}
.sub{font-family:var(--font-sub);font-weight:800;font-size:var(--fs-sub);line-height:1.08}
.lead{font-weight:700}
.prose p+p{margin-top:1.1em}
.c-yellow-pale{color:var(--yellow-pale)}.c-blue{color:var(--blue)}.c-pink{color:var(--pink)}.c-yellow{color:var(--yellow)}.c-white{color:#fff}
.center{text-align:center}

.container{width:min(var(--container),100% - 2*var(--gutter));margin-inline:auto}
.block{position:relative;padding-block:var(--section-y)}
.bg-blue{background:var(--blue);color:#fff}
.bg-pale{background:var(--yellow-pale);color:var(--ink)}
.bg-lav{background:var(--lavender)}
.bg-white{background:#fff}
.sec-head{text-align:center;margin-bottom:clamp(2rem,5vw,4rem)}
.sec-head .kicker{color:var(--blue)}
.sec-head .h2{color:var(--pink)}
.sec-head--blue .h2{color:var(--blue)}.sec-head--blue .kicker{color:var(--pink)}
.sec-head--onblue .h2{color:#fff}.sec-head--onblue .kicker{color:var(--yellow)}
.sec-head--pinkblue .kicker{color:var(--blue)}

/* ============ Composants réutilisables ============ */

/* --- Formes SVG recolorables : <i class="shape" style="--shape:…"> --- */
.shape{position:absolute;display:block;pointer-events:none;background:currentColor;
  -webkit-mask:var(--shape) center/contain no-repeat;mask:var(--shape) center/contain no-repeat}
.shape--hand{--shape:url("../assets/shapes/hand.svg")}
.shape--wave{--shape:url("../assets/shapes/wave-blue.svg")}
.shape--lens{--shape:url("../assets/shapes/lens.svg")}
.shape--quote{--shape:url("../assets/shapes/quote.svg")}
.shape--cross{--shape:url("../assets/shapes/cross.svg")}
.shape--arrow{--shape:url("../assets/shapes/arrow-big.svg")}
.shape--plus{--shape:url("../assets/shapes/plus.svg")}
.shape--circle{border-radius:50%;-webkit-mask:none;mask:none}
.shape--tri{-webkit-mask:none;mask:none;clip-path:polygon(0 0,100% 50%,0 100%)}

/* --- Cadre décalé derrière une photo : couleur + direction pilotées par variables --- */
.framed{--frame-color:var(--yellow-pale);--fx:1;--fy:1;position:relative;isolation:isolate}
.framed::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--frame-color);
  transform:translate(calc(var(--fx)*var(--frame-offset)),calc(var(--fy)*var(--frame-offset)))}
.framed--br{--fx:1;--fy:1}.framed--bl{--fx:-1;--fy:1}.framed--tr{--fx:1;--fy:-1}.framed--tl{--fx:-1;--fy:-1}
.framed--lg{--frame-offset:clamp(18px,2.4vw,30px)}
.framed--pale{--frame-color:var(--yellow-pale)}
.framed--yellow{--frame-color:var(--yellow)}
.framed--pink{--frame-color:var(--pink)}
.framed--blue{--frame-color:var(--blue)}
.ph{position:relative;overflow:hidden;background:var(--grey-ph)}
.ph>img{width:100%;height:100%;object-fit:cover;object-position:var(--focal,50% 50%)}
.ratio-3-2{aspect-ratio:3/2}.ratio-4-3{aspect-ratio:4/3}.ratio-4-5{aspect-ratio:4/5}.ratio-1{aspect-ratio:1}.ratio-16-10{aspect-ratio:16/10}

/* --- Étiquettes --- */
.tag{display:inline-block;padding:.12em .5em .08em;font-size:1.05rem;line-height:1.25;color:#fff;background:var(--pink)}
.tag--blue{background:var(--blue)}
.tag--yellow{background:var(--yellow);color:var(--blue)}
.tag-list{display:flex;flex-wrap:wrap;gap:.4rem .5rem}
.center .tag-list{justify-content:center}

/* --- Boutons --- */
.btn{display:inline-block;padding:.2em .7em .12em;font-size:1.15rem;line-height:1.3;background:var(--pink);color:#fff;border:0;cursor:pointer;transition:transform .25s var(--ease-out)}
.btn--blue{background:var(--blue)}
.btn--yellow{background:var(--yellow);color:var(--blue)}
.btn:hover{transform:translateY(-2px)}
.btn-plus{display:inline-grid;place-items:center;width:1.35rem;height:1.35rem;background:var(--yellow);color:var(--blue);font-family:var(--font-text);font-weight:700;font-size:.9rem;line-height:1}
.btn-plus--pink{background:var(--yellow)}

/* --- Bord ondulé : le motif se répète (jamais déformé en responsive) --- */
.edge-top::before{content:"";position:absolute;left:0;right:0;bottom:calc(100% - 1px);height:clamp(40px,6vw,90px);
  background:var(--edge,var(--yellow-pale));
  -webkit-mask:url("../assets/shapes/wave-edge.svg") left bottom/auto 100% repeat-x;mask:url("../assets/shapes/wave-edge.svg") left bottom/auto 100% repeat-x}

/* --- Colonnes séparées par un filet vertical --- */
.rules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.rules>*{padding-inline:clamp(1rem,2.5vw,2.5rem)}
.rules>*+*{border-left:2px solid var(--rule,var(--blue))}

/* --- Bulle de chiffre --- */
.bubble{display:grid;place-content:center;text-align:center;border-radius:50%;aspect-ratio:1;line-height:1}

/* ============ Mise en page des blocs ============ */
.block>.container{position:relative;z-index:1}
.block{overflow:hidden}
.block--contact{overflow:visible}

/* --- En-tête --- */
.site-header{position:sticky;top:0;z-index:50;background:#fff;view-transition-name:site-header}
.site-header__bar{width:min(1320px,100% - 2*var(--gutter));margin-inline:auto;min-height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:2rem}
.site-header__logo img{width:clamp(200px,31vw,440px);height:auto}
.nav ul{display:flex;align-items:center;gap:clamp(1.25rem,3.2vw,3.2rem)}
.nav a{font-size:clamp(1.15rem,1.3vw,1.4rem);color:var(--blue);line-height:1;transition:color .2s}
.nav a:hover,.nav a[aria-current="page"]{color:var(--pink)}
.nav__cta{display:grid;place-items:center;width:clamp(70px,7vw,98px);aspect-ratio:1;border-radius:50%;background:var(--pink);color:#fff!important;transition:transform .3s var(--ease-pop)}
.nav__cta:hover{transform:scale(1.07) rotate(-4deg)}
.burger{display:none}

/* --- Hero --- */
.block--hero{padding-block:clamp(3.5rem,8vw,6.5rem) clamp(7rem,13vw,11rem)}
.hero__grid{display:grid;grid-template-columns:1.12fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.hero__text{min-width:0;display:grid;gap:1.4rem;justify-items:start;max-width:40rem}
.hero__text .lead{font-size:clamp(.95rem,.5vw + .8rem,1.05rem);max-width:27rem}
.hero__lens{left:-5rem;top:2.2rem;width:clamp(150px,15vw,210px);aspect-ratio:2/1;transform:rotate(180deg) scaleX(-1)}
.hero__hand{right:-3rem;top:-2.5rem;width:clamp(130px,16vw,220px);aspect-ratio:182/192;transform:rotate(12deg)}
.hero__wave{left:0;bottom:-.5rem;width:clamp(260px,46vw,520px);aspect-ratio:278/86}
.hero__photo{margin-right:var(--frame-offset)}

/* --- Notre association --- */
.about__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,7vw,7rem);align-items:center}
.about__photo{margin:var(--frame-offset) 0 0 var(--frame-offset);max-width:36rem}
.about__text{position:relative;padding-top:clamp(5rem,9vw,7.5rem)}
.about__text .h2{margin-bottom:1.2rem}
.about__text .btn{margin-top:1.6rem}
.badge{position:absolute;top:0;right:clamp(0rem,2vw,2rem);width:clamp(150px,16vw,195px);background:var(--pink);color:#fff;padding:1.1rem;font-weight:700;font-size:clamp(.7rem,.45vw + .55rem,.82rem);line-height:1.25;transform:rotate(-2deg)}
.badge .h3{margin-bottom:.15rem}

/* --- Missions --- */
.block--missions{padding-bottom:clamp(8rem,16vw,14rem)}
.missions__hand{left:24%;bottom:-3rem;width:clamp(200px,32vw,400px);aspect-ratio:182/192;transform:rotate(8deg)}
.mission{display:flex;flex-direction:column;align-items:center;gap:1rem}
.mission .tag-list{margin-top:.5rem}
.mission p{font-size:.95rem;font-weight:600;max-width:24rem}

/* --- Objectifs --- */
.obj-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.obj{position:relative;padding:clamp(2rem,4vw,3.5rem) clamp(1rem,2.5vw,2.5rem);isolation:isolate;overflow:hidden}
.obj:not(:nth-child(3n+1)){border-left:2px solid var(--pink)}
.obj:nth-child(-n+3){border-bottom:2px solid var(--pink)}
.obj h3{margin-bottom:.7rem}
.obj p{font-size:.95rem;font-weight:600;max-width:23rem;margin-inline:auto}
.obj__shape{z-index:-1;color:var(--yellow-pale);left:50%;top:50%;width:min(260px,70%);aspect-ratio:1;transform:translate(-50%,-50%)}
.obj__shape--hand-a{transform:translate(-50%,-55%) rotate(-48deg);width:min(280px,76%);aspect-ratio:182/192}
.obj__shape--hand-b{transform:translate(-50%,-48%) rotate(8deg);width:min(260px,70%);aspect-ratio:182/192}
.obj__shape--cross{width:min(300px,82%)}
.obj__shape--cross-b{width:min(320px,86%);top:48%}
.obj__shape--circle{top:34%;width:min(210px,56%)}
.obj__shape--circle-low{top:20%;width:min(200px,54%)}

/* --- Publics --- */
.block--publics{padding-bottom:clamp(5rem,10vw,8rem)}
.publics__lens{left:-5rem;top:5.5rem;width:clamp(180px,24vw,330px);aspect-ratio:2/1;transform:scaleX(-1)}
.publics__lens2{left:20%;bottom:-1.5rem;width:clamp(220px,32vw,420px);aspect-ratio:2/1;transform:rotate(172deg)}
.publics__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
.publics__list{max-width:23rem;margin-inline:auto;display:grid;gap:1.6rem}
.public+.public{border-top:3px solid #fff;padding-top:1.6rem}
.public h3{margin-bottom:.6rem}
.public p{font-size:.95rem;font-weight:600}
.publics__photo{margin:var(--frame-offset) var(--frame-offset) 0 0;max-width:34rem;justify-self:center}
.publics__tri{left:calc(-1*clamp(55px,7vw,95px));top:7%;width:clamp(100px,15vw,190px);aspect-ratio:190/250;z-index:2}

/* --- Approche globale --- */
.approach__cards{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(1rem,3vw,3rem);align-items:start}
.acard{display:grid;gap:1.1rem;justify-items:start}
.acard .framed{width:100%;margin:var(--frame-offset) 0 0 var(--frame-offset);width:calc(100% - var(--frame-offset))}
.acard .h2{margin-top:.8rem}
.acard p{max-width:28rem;font-weight:600}
.approach__plus{position:static;width:clamp(48px,8vw,104px);aspect-ratio:1;margin-top:clamp(3rem,8vw,7rem);align-self:start}
.approach__benefits{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:center;margin-top:clamp(3rem,7vw,6rem)}
.approach__arrow{position:static;width:100%;max-width:520px;aspect-ratio:520/170}
.approach__benefits p{max-width:26rem;font-weight:600;margin-top:.8rem}

/* --- Étapes --- */
.block--steps{padding-block:0 var(--section-y)}
.steps__box{border:1px solid var(--blue);padding:clamp(1.25rem,3vw,2.25rem)}
.steps__head{display:flex;justify-content:space-between;gap:2rem;align-items:flex-start;margin-bottom:2rem}
.steps__head .h2{color:var(--blue)}
.steps__head p{max-width:20rem;font-weight:600;margin-right:12%}
.steps__list{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(.7rem,1.6vw,1.5rem)}
.step{position:relative;overflow:hidden;background:var(--lavender);padding:2.2rem 1rem 3.2rem;text-align:center;isolation:isolate;min-height:15rem}
.step .num{position:absolute;left:50%;bottom:-.28em;transform:translateX(-50%);z-index:-1;font-family:var(--font-text);font-weight:700;font-size:clamp(9rem,15vw,14rem);line-height:1;color:#fff;letter-spacing:0}
.step h3{margin-bottom:.5rem}
.step p{font-size:.92rem;font-weight:600}

/* --- Chiffres (bulles blanches) --- */
.stats__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,4vw,3.5rem);justify-items:center}
.stat{background:#fff;width:100%;max-width:360px;padding:clamp(1.6rem,2.4vw,2.2rem);gap:.35rem;align-content:center}
.stat__value{font-size:clamp(2.6rem,4vw,3.7rem);color:var(--blue);line-height:.9}
.stat .sub{font-size:clamp(1.25rem,1.1vw + .8rem,1.6rem)}
.stat p:last-child{font-size:.9rem;font-weight:600;line-height:1.35}
.stat__value span{font-variant-numeric:tabular-nums}

/* --- Témoignages --- */
.testi__q{z-index:0;aspect-ratio:1}
.testi__q--a{right:-4%;top:6%;width:clamp(150px,22vw,300px)}
.testi__q--b{left:-3%;bottom:2%;width:clamp(120px,17vw,230px);transform:rotate(180deg)}
.testi{display:flex;flex-direction:column;justify-content:space-between;gap:1.6rem;text-align:center}
.testi blockquote{font-size:.95rem;font-weight:600}
.testi figcaption{display:grid;justify-items:end;gap:.4rem;text-align:right}
.rules--pink{--rule:var(--pink)}
.testi__grid{row-gap:3rem}
.testi__grid>:nth-child(3n+1){border-left:0}

/* --- Partenaires --- */
.partners{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(1rem,3vw,2.6rem)}
.partner{--pad:7%;display:block;width:clamp(110px,13vw,152px);aspect-ratio:1;background:#fff}
.partner__in{display:grid;place-items:center;width:100%;height:100%;padding:var(--pad)}
.partner img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.partner--circle{border-radius:50%;--pad:13%}
.partner--diamond{--pad:24%;width:clamp(150px,17vw,190px);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.partner--tall{width:clamp(96px,10vw,120px);aspect-ratio:3/4;--pad:6%}

/* --- Galerie --- */
.gallery{position:relative;--sw:min(760px,76vw)}
.gallery__track{display:flex;gap:clamp(1rem,3vw,3rem);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-inline:calc(50% - var(--sw)/2);padding-block:1.5rem}
.gallery__track::-webkit-scrollbar{display:none}
.gallery__slide{flex:0 0 var(--sw);scroll-snap-align:center;padding:clamp(18px,2.4vw,30px) 0 0 clamp(18px,2.4vw,30px);transition:opacity .4s}
.gallery__cap{position:absolute;right:-.6rem;bottom:1rem;z-index:2}
.gallery__btn{position:absolute;top:50%;z-index:3;width:clamp(36px,5vw,62px);aspect-ratio:90/130;border:0;padding:0;cursor:pointer;background:var(--pink);transform:translateY(-50%);
  -webkit-mask:url("../assets/shapes/chevron.svg") center/contain no-repeat;mask:url("../assets/shapes/chevron.svg") center/contain no-repeat;transition:transform .25s var(--ease-out)}
.gallery__btn--prev{left:clamp(.5rem,6vw,6rem)}
.gallery__btn--next{right:clamp(.5rem,6vw,6rem);transform:translateY(-50%) scaleX(-1)}
.gallery__btn--prev:hover{transform:translateY(-50%) translateX(-4px)}
.gallery__btn--next:hover{transform:translateY(-50%) scaleX(-1) translateX(-4px)}

/* --- Actualités --- */
.block--news{padding-top:0}
.block--news .container{border-top:1px solid var(--blue);padding-top:var(--section-y)}
.block--news{padding-bottom:calc(var(--section-y) + 2rem)}
.news--norule .container{border-top:0}
.news--norule{padding-top:var(--section-y)}
.ncard{display:grid;gap:.9rem;align-content:start}
.ncard .sub{margin-top:.5rem}
.ncard .sub a:hover{color:var(--pink)}
.ncard__date{line-height:1}
.ncard p:last-child{font-size:.92rem;font-weight:600}
.news__grid{--p:clamp(.8rem,1.8vw,1.6rem);margin-inline:calc(-1*var(--p))}
.news__grid>*{padding-inline:var(--p)}
.ncard__date time{font-size:1.3rem}

/* --- Contact --- */
.block--contact{padding-top:clamp(4rem,7vw,6rem)}
.contact__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,3rem);align-items:start}
.contact__cards{position:relative;padding-bottom:clamp(3rem,6vw,5rem)}
.contact__card{padding:clamp(1.5rem,3vw,2.2rem)}
.contact__card--pink{background:var(--pink);min-height:clamp(20rem,32vw,27rem);margin-right:0;width:calc(100% - 2rem)}
.contact__card--pink .h2{text-align:center;margin-bottom:2rem}
.contact__card--pink .sub{padding-left:clamp(1rem,4vw,4rem);font-size:clamp(1.3rem,1.4vw + .8rem,1.9rem)}
.contact__card--blue{position:absolute;right:0;bottom:0;width:68%;min-height:clamp(12rem,18vw,16rem);background:var(--blue)}
.contact__card--blue .h2{text-align:center;margin-bottom:1.2rem}
.contact__card--blue .sub{padding-left:clamp(.6rem,2.5vw,3rem);font-size:clamp(1.3rem,1.2vw + .8rem,1.75rem)}
.contact__join{text-decoration:underline;text-underline-offset:.2em;text-decoration-thickness:2px}
.contact__form .h2{font-size:clamp(1.9rem,2.5vw + .5rem,2.7rem);text-wrap:balance}
.contact__form .sub{margin:1.2rem 0 1.8rem;max-width:28rem}
.contact__form form{display:grid;gap:1.1rem}
.contact__form input,.contact__form textarea{display:block;width:100%;background:#fff;border:0;border-radius:0;padding:1.15rem 1.25rem;font-weight:600;font-size:.9rem;resize:vertical}
.contact__form input::placeholder,.contact__form textarea::placeholder{color:var(--ink);opacity:1}
.contact__send{text-align:right}
.form-status{min-height:1.5em;font-weight:700;color:var(--blue)}

/* --- Pied de page --- */
.site-footer{background:#fff;padding-block:clamp(2rem,4vw,3.2rem)}
.site-footer__in{display:grid;grid-template-columns:1.4fr auto auto 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:center}
.site-footer__logo img{width:clamp(200px,28vw,400px)}
.site-footer__links{display:contents}
.site-footer__links a,.site-footer__legal{font-family:var(--font-title);color:var(--blue);text-transform:uppercase;font-size:1.2rem;line-height:1.1}
.site-footer__legal{font-size:1rem}
.site-footer__links a:hover{color:var(--pink)}

/* ============ Responsive ============ */
@media (max-width:980px){
  .burger{display:grid;gap:5px;width:46px;height:46px;place-content:center;background:var(--pink);border:0;border-radius:50%;cursor:pointer}
  .burger span{display:block;width:20px;height:2px;background:#fff;transition:transform .3s var(--ease-out),opacity .2s}
  .burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .burger[aria-expanded="true"] span:nth-child(2){opacity:0}
  .burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .nav{position:fixed;inset:var(--header-h) 0 auto 0;background:#fff;padding:1rem var(--gutter) 2rem;border-top:1px solid var(--lavender);display:none}
  .nav[data-open]{display:block}
  .nav ul{flex-direction:column;align-items:flex-start;gap:1.2rem}
  .nav a{font-size:1.8rem}
  .nav__cta{width:auto;aspect-ratio:auto;border-radius:0;padding:.3em .8em .2em}
  .hero__grid,.about__grid,.publics__grid,.contact__grid{grid-template-columns:1fr}
  .hero__photo{margin-right:var(--frame-offset)}
  .about__photo{max-width:none;margin-right:0}
  .about__text{padding-top:0}
  .badge{position:relative;top:auto;right:auto;margin:0 0 1.5rem auto}
  .contact__card--pink{min-height:0;padding-bottom:3.5rem}
  .rules{grid-template-columns:1fr;gap:2rem}
  .rules>*+*{border-left:0;border-top:2px solid var(--rule,var(--blue));padding-top:2rem}
  .news__grid{margin-inline:0}.news__grid>*{padding-inline:0}
  .obj-grid{grid-template-columns:1fr 1fr}
  .obj:not(:nth-child(3n+1)){border-left:0}.obj:nth-child(-n+3){border-bottom:0}
  .obj:nth-child(even){border-left:2px solid var(--pink)}.obj:nth-child(-n+4){border-bottom:2px solid var(--pink)}
  .publics__photo{max-width:none;margin-right:var(--frame-offset)}
  .approach__cards{grid-template-columns:1fr}
  .approach__plus{margin:0 auto}
  .approach__benefits{grid-template-columns:1fr}
  .steps__list{grid-template-columns:1fr 1fr}
  .steps__head{flex-direction:column;gap:1rem}.steps__head p{margin-right:0}
  .stats__grid{grid-template-columns:1fr;justify-items:center}
  .site-footer__in{grid-template-columns:1fr 1fr}
  .site-footer__logo{grid-column:1/-1}
}
@media (max-width:560px){
  .obj-grid{grid-template-columns:1fr}
  .obj{border-left:0!important;border-bottom:2px solid var(--pink)!important}
  .steps__list{grid-template-columns:1fr}
  .gallery__btn{display:none}
  .contact__card--blue{position:relative;width:calc(100% - 2rem);margin:-2rem 0 0 auto;right:auto;bottom:auto}
  .contact__cards{padding-bottom:0}
}
@media (max-width:700px){.hero__lens{width:84px;left:-2rem;top:-.4rem}}

/* ============ Pages : association, actions, actualités, utilitaires ============ */
.bg-pink{background:var(--pink);color:#fff}
.prose-sm{font-weight:600;font-size:.95rem;max-width:25rem}
.prose-sm p+p{margin-top:1em}

/* --- Sous-menu « Nos actions » --- */
.has-sub{position:relative}
.has-sub>a{display:inline-block;padding:.35rem .6rem;margin:-.35rem -.6rem}
.nav .subnav{position:absolute;top:calc(100% + .35rem - 2px);left:-.6rem;min-width:max-content;display:none;flex-direction:column;align-items:flex-start;gap:.35rem;background:#fff;border:2px solid var(--pink);border-top:0;padding:.2rem .6rem .7rem 1.4rem;z-index:5}
.nav .subnav a{font-size:1.05rem}
@media (hover:hover) and (min-width:981px){
  .nav .has-sub:hover>.subnav,.nav .has-sub:focus-within>.subnav{display:flex}
  .has-sub:hover>a,.has-sub:focus-within>a{outline:2px solid var(--pink);outline-offset:-2px;border-bottom-color:transparent;background:#fff;position:relative;z-index:6}
  .has-sub:hover>a::after,.has-sub:focus-within>a::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:4px;background:#fff}
}
@media (max-width:980px){.nav .subnav{display:flex;position:static;border:0;padding:.2rem 0 0 1rem;min-width:0;gap:.5rem}.nav .subnav a{font-size:1.3rem}.has-sub>a{margin:0;padding:0}}

/* --- En-tête de page simple --- */
.block--pageheader{padding-block:clamp(3rem,6vw,5rem)}
.pageheader__hand{right:6%;top:-1.5rem;width:clamp(100px,13vw,170px);aspect-ratio:182/192;transform:rotate(14deg)}
.block--pageheader .h2{font-size:clamp(2.4rem,4vw + .5rem,4rem)}

/* --- Qui sommes-nous --- */
.block--story{padding-block:clamp(3rem,5vw,4.5rem) clamp(3.5rem,6vw,5.5rem)}
.story__lens--a{left:6%;top:-1rem;width:clamp(180px,24vw,340px);aspect-ratio:2/1;transform:rotate(-58deg);transform-origin:center}
.story__lens--b{right:-4%;top:14%;width:clamp(240px,34vw,500px);aspect-ratio:2/1;transform:rotate(172deg)}
.story__grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(1.5rem,4vw,4rem);align-items:start}
.story__lead{font-size:clamp(1.3rem,1.3vw + .8rem,1.85rem);line-height:1.1;margin-top:1.8rem;max-width:34rem}
.story__bubbles{display:flex;flex-direction:column;padding-top:clamp(0rem,1vw,.8rem)}
.bub{--s:clamp(130px,12.5vw,172px);width:var(--s);padding:.6rem;gap:.05rem;margin-left:calc(var(--i)*(var(--s)*.95));margin-top:calc(var(--i)*-.3rem)}
.bub__num{font-size:clamp(2.2rem,2.8vw,3.1rem);line-height:.95}
.bub__pre{font-family:var(--font-sub);font-weight:800;font-size:.45em;text-transform:none}
.bub__label{font-size:clamp(1rem,.8vw + .55rem,1.3rem);line-height:1.02}
.bub--white{background:#fff;color:var(--blue)}.bub--blue{background:var(--blue);color:#fff}.bub--pink{background:var(--pink);color:var(--yellow-pale)}

/* --- Équipe / conseil / bénévoles / incubateur --- */
.block--team{padding-block:clamp(3rem,6vw,5rem) clamp(1.5rem,3vw,2.5rem)}
.team__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.9fr);gap:clamp(1.5rem,5vw,5rem);align-items:start}
.team__intro .h2{margin:.1em 0 1.1rem}
.team{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.6rem clamp(.7rem,1.6vw,1.4rem)}
.member{display:flex;flex-direction:column;align-items:center;gap:.5rem;text-align:center}
.member__photo{width:100%;border-radius:50%;background:#cfcfcf}
.member__photo--empty{aspect-ratio:1}
.member h3{font-size:clamp(1.1rem,.7vw + .8rem,1.4rem)}
.member .tag{font-size:.95rem;max-width:11rem}
.block--board{padding-block:clamp(1.5rem,3vw,2.5rem)}
.board__box{border-block:3px solid var(--yellow);padding-block:clamp(1.8rem,3vw,2.6rem)}
.board__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:clamp(1.5rem,4vw,4rem);align-items:start}
.board__intro .h2{margin-bottom:1rem}
.board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.6rem 1rem}
.bmember{display:flex;flex-direction:column;align-items:center;gap:.45rem;text-align:center}
.bmember h3{font-size:clamp(1.05rem,.6vw + .8rem,1.3rem)}
.bmember .tag{font-size:.95rem}
.bmember p:last-child{font-size:.9rem;font-weight:600;max-width:11rem}
.block--volunteers{padding-block:clamp(1.5rem,3vw,2.5rem) var(--section-y)}
.volunteers__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(1.5rem,4vw,4rem);align-items:start}
.volunteers__grid .h2{margin-bottom:1rem}.volunteers__grid .btn{margin-top:1.4rem}
.block--incubator{padding-block:clamp(3.5rem,7vw,6rem)}
.incubator__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,6rem);align-items:center}
.incubator__text{display:grid;gap:1.1rem;justify-items:start}
.incubator__text .prose-sm{max-width:28rem}
.incubator__grid .framed{margin:var(--frame-offset) 0 0;margin-right:var(--frame-offset)}

/* --- Nos actions : en-tête rose --- */
.block--actionshero{padding-block:clamp(2.5rem,4vw,3.5rem) clamp(4rem,8vw,6.5rem)}
.ahero__wave{left:-4%;bottom:0;width:70%;height:78%;-webkit-mask-size:100% 100%;mask-size:100% 100%;aspect-ratio:auto}
.ahero__hand{right:-5%;top:-3%;width:clamp(180px,24vw,340px);aspect-ratio:182/192;transform:rotate(-24deg)}
.ahero__head{margin-bottom:clamp(2rem,4vw,3.5rem)}
.ahero__head .h2{font-size:clamp(2.8rem,4.2vw + .6rem,4.4rem)}
.rules--yellow{--rule:var(--yellow)}
.ahero__grid{align-items:start}
.ahero__grid p{font-size:.95rem;font-weight:600;max-width:23rem;margin:.8rem auto 0}
.ahero__grid a:hover{text-decoration:underline;text-underline-offset:.15em}

/* --- Sections « fonctionnalité » --- */
.block--feature{padding-block:clamp(2.5rem,5vw,4rem)}
.feature--rule{padding-top:0}
.feature--rule>.container{border-top:3px solid var(--blue);padding-top:clamp(2rem,4vw,3.2rem)}
.feature__head{margin-bottom:clamp(1.8rem,3.5vw,3rem)}
.feature__head .h2{font-size:clamp(2.1rem,3.2vw + .6rem,3.5rem);line-height:.95}
.feature__grid{display:grid;gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.feature__grid--plain{grid-template-columns:minmax(0,.9fr) minmax(0,1.8fr)}
.feature__grid--stack{grid-template-columns:minmax(0,1fr) auto minmax(0,1.15fr)}
.feature__text{max-width:27rem}
.feature__text>.prose-sm{max-width:none}
.feature__sub{margin:1.8rem 0 1rem}
.feature__formats{display:grid;gap:.9rem;justify-items:start;margin-top:2.2rem}
.arrows{display:grid;gap:1.1rem}
.arrows li{position:relative;padding-left:1.6rem;font-size:.92rem;font-weight:600;line-height:1.35}
.arrows li::before{content:"";position:absolute;left:0;top:.18em;width:1rem;height:1.05rem;background:var(--blue);clip-path:polygon(0 0,100% 50%,0 100%)}
.arrows strong{display:block;font-size:1.2rem;line-height:1.1}
.places{display:grid;grid-template-columns:repeat(2,minmax(0,6.2rem));gap:1.1rem 1.1rem;margin-top:.5rem}
.place{display:grid;place-items:center;aspect-ratio:4/3;background:var(--blue);color:#fff;font-family:var(--font-title);text-transform:uppercase;font-size:.95rem;text-align:center}
.ph.feature-img--wide{aspect-ratio:16/10}.ph.feature-img--mid{aspect-ratio:4/3}.ph.feature-img--tall{aspect-ratio:4/5}.ph.feature-img--landscape{aspect-ratio:16/9}
.feature__media{min-width:0}
.fbubbles{display:flex;align-items:center}
.fbubbles--stack{flex-direction:column;--s:clamp(140px,13vw,176px)}
.fbubbles--stack .fb+.fb{margin-top:-.6rem}
.fbubbles--row{--s:clamp(150px,15.5vw,208px);margin-top:clamp(1.5rem,3vw,2.5rem);padding-left:clamp(0rem,1vw,.5rem)}
.fbubbles--row .fb+.fb{margin-left:calc(var(--s)*-.2)}
.fb{width:var(--s);padding:.7rem;gap:.1rem;align-content:center}
.fb .bub__num{font-size:clamp(2rem,2.4vw,2.9rem)}
.fb__txt{font-size:.78rem;font-weight:600;line-height:1.15;display:grid;justify-items:center}
.fb__txt strong{font-size:clamp(1.15rem,1vw + .7rem,1.55rem);line-height:1}
.fb--pale{background:var(--yellow-pale);color:var(--blue)}
.fb--pink{background:var(--pink);color:#fff}
.fb--blue{background:var(--blue);color:#fff}
.fb--white{background:#fff;color:var(--pink)}
.fbubbles--row .fb--pink{color:var(--yellow)}
.fbubbles--row .fb__txt{font-family:var(--font-sub);font-weight:800;font-size:clamp(1rem,.6vw + .6rem,1.25rem);line-height:1.02;max-width:80%}

/* --- Actualités, article, pages utilitaires --- */
.block--newslist{padding-block:clamp(3rem,6vw,5rem)}
.newslist{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(2rem,4vw,3.5rem) clamp(1.5rem,3vw,2.8rem)}
.article{width:min(52rem,100% - 2*var(--gutter));display:grid;gap:1.4rem}
.article__back{margin-bottom:.6rem}
.article .framed{margin:0 var(--frame-offset) var(--frame-offset) 0}
.article__body{font-weight:600;max-width:42rem}
.legal{width:min(46rem,100% - 2*var(--gutter));display:grid;gap:2.2rem}
.legal .h3{margin-bottom:.6rem}
.sitemap{display:grid;gap:1.2rem}
.sitemap ul{margin:.5rem 0 0 1.2rem;display:grid;gap:.35rem;font-weight:600}
.sitemap a:hover{color:var(--pink)}

/* --- Variantes de blocs existants --- */
.missions--assoc{padding-top:clamp(5rem,9vw,8rem)}
.missions__wave{left:-3rem;top:-4rem;width:clamp(260px,46vw,560px);aspect-ratio:278/86;transform:rotate(180deg)}
.missions--assoc .missions__hand{left:auto;right:-4%;bottom:-6rem;width:clamp(200px,30vw,380px);transform:rotate(-8deg)}
.contact--white{background:#fff;--edge:#fff}
.contact--white .contact__form{border-top:2px solid var(--pink);padding-top:1.4rem}
.contact--white .contact__form input,.contact--white .contact__form textarea{background:var(--yellow-pale)}

@media (max-width:980px){
  .story__grid,.team__grid,.board__grid,.volunteers__grid,.incubator__grid,.feature__grid--plain,.feature__grid--stack{grid-template-columns:minmax(0,1fr)}
  .story__bubbles{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:0}
  .bub{--s:clamp(120px,30vw,170px);margin:0 -.4rem}
  .team,.board{grid-template-columns:repeat(2,minmax(0,1fr))}
  .newslist{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fbubbles--stack{flex-direction:row}.fbubbles--stack .fb+.fb{margin:0 0 0 -.6rem}
  .feature__text{max-width:none}
  .feature--rule .ahero__grid{gap:1.5rem}
}
@media (max-width:560px){
  .newslist{grid-template-columns:minmax(0,1fr)}
  .team{gap:1.2rem .6rem}
  .fbubbles--row{flex-wrap:wrap;gap:.4rem}.fbubbles--row .fb+.fb{margin-left:0}
}

/* ============ Mouvement ============
   Principe : le contenu est TOUJOURS présent dans le HTML. Les animations s'activent seulement si
   <html class="js"> et si l'utilisateur n'a pas demandé de mouvement réduit. */

/* Transitions inter-pages (View Transitions API, Chrome/Safari récents ; ignorée ailleurs) */
@view-transition {
  navigation: auto
}

::view-transition-old(root) {
  animation: vt-out .22s ease both
}

::view-transition-new(root) {
  animation: vt-in .45s var(--ease-out) both
}

::view-transition-group(site-header) {
  animation: none
}

@keyframes vt-out {
  to {
    opacity: 0
  }
}

@keyframes vt-in {
  from {
    opacity: 0;
    transform: translateY(14px)
  }
}

@media (prefers-reduced-motion:no-preference) {

  /* Apparition douce, échelonnée par --i dans une même rangée */
  .js [data-anim="rise"] {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .7s var(--ease-out), transform .8s var(--ease-out);
    transition-delay: calc(var(--i, 0)*90ms)
  }

  .js [data-anim="rise"].is-in {
    opacity: 1;
    transform: none
  }

  /* Bulles et badge : pop avec léger dépassement */
  .js [data-anim="pop"] {
    opacity: 0;
    transform: scale(.7);
    transition: opacity .4s ease, transform .7s var(--ease-pop);
    transition-delay: calc(var(--i, 0)*110ms)
  }

  .js [data-anim="pop"].is-in {
    opacity: 1;
    transform: none
  }

  .js .badge[data-anim="pop"] {
    transform: scale(.7) rotate(-12deg)
  }

  .js .badge[data-anim="pop"].is-in {
    transform: rotate(-2deg)
  }

  /* Photos : l'image apparaît, puis le cadre coloré glisse à sa place (profondeur) */
  .js [data-anim="photo"] .ph {
    opacity: 0;
    transform: scale(1.03);
    transition: opacity .9s ease, transform 1.2s var(--ease-out)
  }

  .js [data-anim="photo"]::before {
    transform: translate(0, 0);
    transition: transform 1s var(--ease-out) .2s
  }

  .js [data-anim="photo"].is-in .ph {
    opacity: 1;
    transform: none
  }

  .js [data-anim="photo"].is-in::before {
    transform: translate(calc(var(--fx)*var(--frame-offset)), calc(var(--fy)*var(--frame-offset)))
  }

  /* Hero : entrée orchestrée au chargement (seul mouvement non déclenché par le scroll) */
  .js [data-anim="hero"]>* {
    opacity: 0;
    transform: translateY(20px);
    animation: hero-in .9s var(--ease-out) forwards
  }

  .js [data-anim="hero"]>:nth-child(1) {
    animation-delay: .1s
  }

  .js [data-anim="hero"]>:nth-child(2) {
    animation-delay: .28s
  }

  .js [data-anim="hero"]>:nth-child(3) {
    animation-delay: .42s
  }

  @keyframes hero-in {
    to {
      opacity: 1;
      transform: none
    }
  }

  /* Main du hero : rotation très lente, presque imperceptible */
  .hero__hand {
    animation: drift 40s ease-in-out infinite alternate
  }

  @keyframes drift {
    from {
      transform: rotate(8deg)
    }

    to {
      transform: rotate(18deg)
    }
  }

  .acard .btn-plus,
  .hero__text .btn-plus {
    transition: transform .3s var(--ease-pop)
  }

  .acard .btn-plus:hover,
  .hero__text .btn-plus:hover {
    transform: scale(1.25) rotate(90deg)
  }
}

@media (prefers-reduced-motion:reduce) {
  html {
    scroll-behavior: auto
  }

  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation: none !important
  }
}