/* ==========================================================================
   Pages internes — s'appuie sur les jetons et composants de main.css
   ========================================================================== */

.sr--focus:focus{position:fixed;top:8px;left:8px;z-index:100;width:auto;height:auto;clip:auto;padding:12px 16px;background:var(--or);color:var(--noir);border-radius:var(--r)}
.champ-piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.admin-bar .header{top:32px}
.nav__item.is-actif>.nav__lien{color:var(--or)}

/* Méga-menu pleine largeur ------------------------------------------------ */
.nav{align-self:stretch;display:flex}
.nav__liste{height:100%}
.nav__item{display:flex;align-items:center}
.nav__item--mega{position:static}
.mega{position:absolute;left:0;right:0;top:100%;z-index:40;border-top:3px solid var(--or);background:var(--blanc);color:var(--encre);box-shadow:0 26px 50px rgba(23,21,15,.22);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility .2s}
.nav__item--mega:hover .mega,.nav__item--mega:focus-within .mega{opacity:1;visibility:visible;transform:none}
.nav__item--mega:hover .nav__lien svg,.nav__item--mega:focus-within .nav__lien svg{transform:rotate(180deg)}
.mega__grille{display:grid;grid-template-columns:minmax(0,1.25fr) repeat(var(--cols,3),minmax(0,1fr)) minmax(0,1.3fr);gap:40px;padding-block:40px 44px}
.mega__intro{display:flex;flex-direction:column;align-items:flex-start}
.mega__titre{font:400 22px/1.15 var(--display);text-transform:uppercase;text-decoration:none;color:var(--noir)!important}
.mega__intro p{margin:12px 0 22px;font-size:14px;line-height:1.6;color:var(--gris)}
.mega__col-titre{display:block;margin-bottom:10px;padding-bottom:10px;border-bottom:1.5px solid var(--or);font:500 12px/1.3 var(--display);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--noir)!important}
.mega__col-titre:hover{color:var(--or-texte)!important}
.mega__col:not(:has(.mega__col-titre)){padding-top:0}
.mega__liste{display:grid;gap:0;margin:0;padding:0;list-style:none}
.mega__liste a{display:block;padding:7px 0;font:400 14px/1.4 var(--texte);text-decoration:none;color:var(--encre)!important;transition:color .2s,padding-left .2s}
.mega__liste a:hover{padding-left:6px;color:var(--or-texte)!important}
.mega__visuel{position:relative;display:block;min-height:230px;overflow:hidden;border-radius:var(--r);background:var(--noir);text-decoration:none}
.mega__visuel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,.61,.36,1)}
.mega__visuel:hover img{transform:scale(1.05)}
.mega__visuel span{position:absolute;left:14px;right:14px;bottom:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;border-radius:var(--r);background:var(--or);font:500 12px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--noir)}
.mega__visuel span svg{width:14px;height:14px}
@media (max-width:1280px){
  .mega__visuel{display:none}
  .mega__grille{grid-template-columns:minmax(0,1.2fr) repeat(var(--cols,3),minmax(0,1fr));gap:32px}
}
@media (max-width:1024px){
  .nav{display:none}
  .nav__liste{height:auto}
  .nav__item{display:block}
  .nav__item--mega{position:relative}
  .mega{position:static;border:0;background:none;box-shadow:none;opacity:1;visibility:visible;transform:none}
  .mega__grille{display:block;padding:0 0 12px}
  .mega__intro,.mega__visuel{display:none}
  .mega__col-titre{margin:10px 0 2px;padding:0 0 0 16px;border:0;color:var(--or)!important}
  .mega__liste a{padding:5px 0 5px 16px;color:rgba(255,255,255,.72)!important}
  .mega__col-titre+.mega__liste a{padding-left:30px}
}
.clients a{display:block}

/* Menu — même style que le site en ligne (JetMenu) : en-tête blanc, rubriques LEMONMILK noires
   séparées par un filet, listes déroulantes blanches, sous-rubriques ouvertes sur le côté.
   Remplace le méga-menu pleine largeur (classes .mega* devenues inutilisées). */
.header,.header.is-solid{background:var(--blanc);color:var(--noir);box-shadow:0 1px 0 rgba(23,21,15,.08)}
.header.is-solid{box-shadow:0 8px 24px rgba(23,21,15,.1)}
.nav{align-self:stretch;display:flex}
.nav__liste{height:100%}
.nav__item{position:relative;display:flex;align-items:center}
.nav__item+.nav__item::before{content:"";width:1px;height:18px;background:rgba(23,21,15,.2)}
.nav__lien{gap:6px;padding:12px 14px;font:400 13px/1 var(--display);letter-spacing:.02em;text-transform:uppercase;color:var(--noir)}
.nav__lien svg{width:9px;height:9px;opacity:1}
.nav__lien:hover,.nav__item:hover>.nav__lien,.nav__item:focus-within>.nav__lien,.nav__item.is-actif>.nav__lien{color:var(--or)}
.header__cta.btn{height:46px;padding:0 18px;border:1px solid var(--noir);border-radius:3px;background:transparent;color:var(--noir);font-size:12px}
.header__cta.btn:hover{background:var(--noir);color:var(--blanc)}
.burger{border-color:rgba(23,21,15,.25);color:var(--noir)}

.deroulant,.panneau{position:absolute;top:100%;left:4px;z-index:40;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .18s,transform .18s,visibility .18s}
.deroulant{min-width:290px;margin:0;padding:8px 0;list-style:none;background:var(--blanc);border-radius:5px;box-shadow:0 14px 34px rgba(23,21,15,.14)}
.nav__item:hover>.deroulant,.nav__item:focus-within>.deroulant,.nav__item:hover>.panneau,.nav__item:focus-within>.panneau,
.deroulant__item:hover>.deroulant,.deroulant__item:focus-within>.deroulant,.deroulant__item:hover>.panneau,.deroulant__item:focus-within>.panneau{opacity:1;visibility:visible;transform:none}
.deroulant__item{position:relative}
.deroulant__lien{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 20px;font:400 11.5px/1.3 var(--display);letter-spacing:.02em;text-transform:uppercase;text-decoration:none;white-space:nowrap;color:var(--noir)!important}
.deroulant__lien:hover,.deroulant__item:hover>.deroulant__lien,.deroulant__item:focus-within>.deroulant__lien{background:var(--papier);color:var(--or)!important}
.deroulant__fleche{width:9px;height:9px;transform:rotate(-90deg)}
.deroulant--cote,.panneau--cote{top:-8px;left:100%}
.panneau{padding:26px 30px;background:var(--blanc);border-radius:5px;box-shadow:0 14px 34px rgba(23,21,15,.14)}
.panneau__grille{display:grid;grid-template-columns:repeat(var(--cols,2),minmax(150px,auto));gap:10px 36px}
.panneau__titre{display:block;margin-bottom:10px;font:300 15px/1.2 var(--display);text-transform:uppercase;text-decoration:none;white-space:nowrap;color:var(--noir)!important}
.panneau__titre:hover{color:var(--or)!important}
.panneau__liste{display:grid;gap:0;margin:0;padding:0;list-style:none}
.panneau__liste a{display:block;padding:6px 0;font:400 12px/1.4 var(--display);text-decoration:none;white-space:nowrap;color:var(--noir)!important}
.panneau__liste a:hover{color:var(--or)!important}
.nav__item:nth-last-child(-n+2)>.panneau,.nav__item:nth-last-child(-n+2)>.deroulant{left:auto;right:4px}
@media (max-width:1280px){.nav__lien{padding:12px 9px;font-size:12px}}
@media (max-width:1024px){
  .nav{display:none}
  .header.is-open,.header.is-open .nav{background:var(--blanc)}
  .nav__liste{height:auto}
  .nav__item{display:block;border-bottom:1px solid var(--ligne)}
  .nav__item+.nav__item::before{display:none}
  .nav__lien{padding:18px 0;font-size:14px;color:var(--noir)}
  .deroulant,.panneau,.deroulant--cote,.panneau--cote{position:static;min-width:0;margin:0 0 12px;padding:0;border-radius:0;background:none;box-shadow:none;opacity:1;visibility:visible;transform:none}
  .deroulant__lien{padding:8px 0 8px 14px;font-size:12px;white-space:normal}
  .deroulant__lien:hover,.deroulant__item:hover>.deroulant__lien{background:none}
  .deroulant__fleche{display:none}
  .deroulant--cote .deroulant__lien{padding-left:28px}
  .panneau--cote{padding-left:28px}
  .panneau__grille{display:block}
  .panneau__titre{margin:10px 0 4px;font-size:12px;color:var(--or-texte)!important;white-space:normal}
  .panneau__liste a{padding:5px 0 5px 14px;white-space:normal}
}

/* Méga-menu pleine largeur (présentation + colonnes + photo), préféré par le client,
   dans l'en-tête blanc. L'élément doit rester statique pour que le panneau prenne toute la largeur. */
.nav__item--mega{position:static}
.nav__item--mega:hover>.nav__lien,.nav__item--mega:focus-within>.nav__lien{color:var(--or)}
.mega{top:100%}
@media (max-width:1024px){
  .nav__item--mega{position:relative}
  .mega__col-titre{color:var(--or-texte)!important}
  .mega__liste a{color:var(--encre)!important}
}

/* Bandeau interne ------------------------------------------------------- */
.phero{position:relative;overflow:hidden;padding-top:160px}
.phero__grille{align-items:center;padding-bottom:96px}
.phero__texte{grid-column:1/8;position:relative;z-index:1}
.phero__titre{margin:0 0 24px;font-size:clamp(30px,3.4vw,50px);line-height:1.1}
.phero__accroche{max-width:620px;margin-bottom:40px;font-size:18px;line-height:1.65;color:rgba(255,255,255,.82)}
.phero__visuel{grid-column:8/13;position:relative;display:grid;place-items:center;min-height:380px}
.phero__splash{position:absolute;left:-14%;top:50%;width:128%;height:auto;transform:translateY(-50%)}
.phero__photo{position:relative;z-index:1;width:84%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r);box-shadow:0 30px 60px rgba(0,0,0,.45)}
.phero__logo{position:relative;z-index:1;width:44%;height:auto;filter:drop-shadow(0 18px 30px rgba(0,0,0,.35))}

.ariane{margin-bottom:32px;font-size:13px;line-height:1.5;color:rgba(255,255,255,.6)}
.ariane a{color:rgba(255,255,255,.8);text-decoration:none}
.ariane a:hover{color:var(--or)}
.ariane .breadcrumb_last,.ariane [aria-current]{color:var(--blanc)}
.ariane__sep{margin:0 6px;color:var(--or)}

/* Bande « flocage » */
.bande{position:relative;z-index:1;overflow:hidden;background:var(--or);color:var(--noir)}
.bande__piste{display:flex;width:max-content;animation:bande 38s linear infinite}
.bande:hover .bande__piste{animation-play-state:paused}
.bande span{display:inline-flex;align-items:center;gap:28px;padding:16px 0 16px 28px;font:500 14px/1 var(--display);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap}
.bande span::after{content:"";width:7px;height:7px;background:var(--noir)}
@keyframes bande{to{transform:translateX(-50%)}}

/* Présentation + encart ------------------------------------------------- */
.intro__grille{align-items:start}
.intro__texte{grid-column:1/8}
.intro__texte .t-h2{margin-bottom:32px}
.encart{grid-column:9/13;position:sticky;top:104px;padding:40px;border-radius:var(--r);background:var(--noir);color:var(--blanc)}
.encart__titre{margin-bottom:20px;font:400 18px/1.3 var(--display);text-transform:uppercase;color:var(--or)}
.encart__texte{margin-bottom:8px;font-size:15px;color:rgba(255,255,255,.75)}
.encart__liste div{display:grid;gap:4px;padding:14px 0;border-top:1px solid var(--ligne-sombre)}
.encart__liste dt{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.encart__liste dd{font-size:15px;line-height:1.5}
.encart__liste a{text-decoration:none}
.encart__chiffre{font:400 34px/1 var(--display)!important;color:var(--or);font-variant-numeric:tabular-nums}
.encart--chiffres .encart__liste div{display:flex;flex-direction:column-reverse;gap:8px}
.encart__actions{display:grid;gap:14px;margin-top:24px}
.encart__actions .btn{width:100%}
.encart__tel,.encart__ligne{display:flex;align-items:flex-start;gap:12px;margin-top:10px;font-size:15px;text-decoration:none;color:var(--blanc)}
.encart__tel{justify-content:center;margin:0}
.encart svg{width:16px;height:16px;margin-top:4px;flex:none;color:var(--or)}
.encart__tel:hover,.encart__ligne:hover{color:var(--or)}

/* Texte riche */
.prose--large{font-size:17px}
.prose--article{max-width:720px;font-size:17px;line-height:1.75}
.prose h2{margin-top:32px;font:400 clamp(22px,2vw,28px)/1.25 var(--display);text-transform:uppercase;text-wrap:balance;color:var(--noir)}
.prose h3{margin-top:16px;font:400 19px/1.3 var(--display);text-transform:uppercase;color:var(--noir)}
.prose ul,.prose ol{display:grid;gap:8px;padding-left:1.2em;list-style:disc}
.prose ol{list-style:decimal}
.prose li::marker{color:var(--or)}
.prose a{color:var(--or-texte);text-underline-offset:3px}
.prose img{height:auto;border-radius:var(--r)}
.prose blockquote{margin:0;padding-left:20px;border-left:3px solid var(--or);font-size:18px}
.on-dark .prose h2,.on-dark .prose h3{color:var(--blanc)}

/* Atouts ---------------------------------------------------------------- */
.atouts{display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));gap:1px;overflow:hidden;border:1px solid var(--ligne);border-radius:var(--r);background:var(--ligne)}
.atout{padding:32px;background:var(--blanc)}
.atout::before{content:"";display:block;width:8px;height:8px;margin-bottom:20px;background:var(--or)}
.atout__titre{margin-bottom:10px;font:400 16px/1.35 var(--display);text-transform:uppercase;color:var(--noir)}
.atout p{font-size:15px;line-height:1.6;color:var(--gris)}

/* Étapes ---------------------------------------------------------------- */
.etapes{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));gap:var(--gap)}
.etape{padding-top:24px;border-top:2px solid var(--or)}
.etape__num{display:block;font:400 40px/1 var(--display);color:var(--or);font-variant-numeric:tabular-nums}
.etape__titre{margin:18px 0 8px;font:400 16px/1.35 var(--display);text-transform:uppercase;color:var(--blanc)}
.etape p{font-size:14px;line-height:1.6;color:rgba(255,255,255,.72)}

/* Cartes ---------------------------------------------------------------- */
.cartes{display:grid;gap:24px}
.cartes--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cartes--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.carte{overflow:hidden;border:1px solid var(--ligne);border-radius:var(--r);background:var(--blanc);transition:border-color .2s,box-shadow .2s}
.carte:hover{border-color:var(--noir);box-shadow:0 14px 30px rgba(23,21,15,.08)}
.carte__lien{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}
.carte__img{margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--papier)}
.carte__img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.carte:hover .carte__img img{transform:scale(1.04)}
.carte__logo{display:grid;place-items:center;height:100%;padding:28px;background:var(--blanc)}
.carte__logo img{object-fit:contain}
.carte__vide{display:grid;place-items:center;height:100%;background:var(--noir)}
.carte__vide .splash{width:72%;height:auto}
.carte__corps{display:flex;flex:1;flex-direction:column;gap:10px;padding:24px}
.carte__cat{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--or-texte)}
.carte__titre{font:400 16px/1.35 var(--display);text-transform:uppercase;text-wrap:balance;color:var(--noir)}
.carte__extrait{font-size:14px;line-height:1.6;color:var(--gris)}
.carte .lien{align-self:flex-start;margin-top:auto;padding-top:8px}

/* Liens vers les autres prestations ------------------------------------ */
.liens-services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--gap)}
.liens-services a{display:flex;align-items:center;justify-content:space-between;gap:16px;height:100%;padding:22px 0;border-top:1.5px solid var(--ligne);color:var(--noir);text-decoration:none;transition:border-color .2s,color .2s}
.liens-services__titre{font:400 17px/1.3 var(--display);text-transform:uppercase}
.liens-services svg{width:20px;height:20px;flex:none;transition:transform .2s}
.liens-services a:hover{border-top-color:var(--noir);color:var(--or-texte)}
.liens-services a:hover svg{transform:translateX(4px)}

/* FAQ -------------------------------------------------------------------- */
.faq__grille{align-items:start}
.faq__tete{grid-column:1/5;position:sticky;top:104px}
.faq{grid-column:6/13;border-bottom:1.5px solid var(--ligne)}
.faq__item{border-top:1.5px solid var(--ligne)}
.faq__item summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0;cursor:pointer;list-style:none;font:400 17px/1.35 var(--display);text-transform:uppercase;color:var(--noir)}
.faq__item summary::-webkit-details-marker{display:none}
.faq__signe{position:relative;width:20px;height:20px;flex:none}
.faq__signe::before,.faq__signe::after{content:"";position:absolute;left:2px;right:2px;top:9px;height:2px;background:var(--or);transition:transform .2s}
.faq__signe::after{transform:rotate(90deg)}
.faq__item[open] .faq__signe::after{transform:rotate(0)}
.faq__reponse{max-width:65ch;padding-bottom:24px;color:var(--gris)}
.faq__reponse p+p{margin-top:12px}

/* Équipe ----------------------------------------------------------------- */
.membres{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px var(--gap)}
.membre__photo{position:relative;margin:0 0 18px;aspect-ratio:1/1;overflow:hidden;border-radius:var(--r);background:var(--noir)}
.membre__photo img{width:100%;height:100%;object-fit:cover}
.membre__splash{position:absolute;inset:14% 6%;width:88%;height:72%}
.membre__initiale{position:absolute;inset:0;display:grid;place-items:center;font:500 72px/1 var(--display);color:var(--noir)}
.membre__nom{font:400 18px/1.3 var(--display);text-transform:uppercase;color:var(--noir)}
.membre__poste{margin-top:4px;font-size:14px;color:var(--or-texte);font-weight:500}
.membre__bio{margin-top:10px;font-size:14px;line-height:1.6;color:var(--gris)}

.histoire__grille{align-items:start}
.histoire{grid-column:1/7}
.valeurs{grid-column:8/13}
.frise{display:grid;margin-top:40px;padding-left:32px;border-left:2px solid var(--or);list-style:none}
.frise li{position:relative;padding-bottom:32px}
.frise li:last-child{padding-bottom:0}
.frise li::before{content:"";position:absolute;left:-39px;top:8px;width:12px;height:12px;background:var(--or)}
.frise__annee{display:block;margin-bottom:6px;font:400 28px/1 var(--display);color:var(--or);font-variant-numeric:tabular-nums}
.frise p{color:rgba(255,255,255,.8)}
.valeurs__liste{display:grid;gap:1px;margin:8px 0 40px;background:var(--ligne-sombre)}
.valeurs__liste li{padding:20px 0;background:var(--noir)}
.valeurs__liste h3{margin-bottom:6px;font:400 18px/1.3 var(--display);text-transform:uppercase;color:var(--blanc)}
.valeurs__liste p{font-size:15px;color:rgba(255,255,255,.72)}

/* Agences ---------------------------------------------------------------- */
.fiches-agences{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.fiche-agence{display:flex;flex-direction:column;gap:10px;padding:32px;border:1px solid var(--ligne);border-radius:var(--r);background:var(--blanc)}
.fiche-agence .eyebrow{margin-bottom:4px}
.fiche-agence .t-h3{margin-bottom:8px;font-size:20px}
.fiche-agence__ligne{display:flex;align-items:flex-start;gap:12px;font-size:15px;text-decoration:none;color:var(--encre)}
.fiche-agence__ligne svg{width:16px;height:16px;margin-top:4px;flex:none;color:var(--or-texte)}
a.fiche-agence__ligne:hover{color:var(--or-texte)}
.fiche-agence__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:auto;padding-top:16px}
.horaires{margin:12px 0 0}
.horaires div{display:flex;justify-content:space-between;gap:16px;padding:8px 0;border-top:1px solid var(--ligne);font-size:14px}
.horaires dt{font-weight:500}
.horaires dd{color:var(--gris);font-variant-numeric:tabular-nums;text-align:right}
.encart .horaires div{border-top-color:var(--ligne-sombre)}
.encart .horaires dd{color:rgba(255,255,255,.75)}

/* Filtres & pagination --------------------------------------------------- */
.filtres{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:48px}
.filtre{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border:1.5px solid var(--ligne);border-radius:var(--r);font-size:13px;font-weight:500;text-decoration:none;color:var(--noir);white-space:nowrap;transition:border-color .2s,background-color .2s,color .2s}
.filtre span{color:var(--gris);font-variant-numeric:tabular-nums}
.filtre:hover{border-color:var(--noir)}
.filtre.is-actif{background:var(--noir);border-color:var(--noir);color:var(--or)}
.filtre.is-actif span{color:rgba(255,255,255,.6)}
.pagination{margin-top:56px}
.pagination ul{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.pagination a,.pagination span{display:grid;place-items:center;min-width:44px;height:44px;padding:0 14px;border:1.5px solid var(--ligne);border-radius:var(--r);font-size:14px;text-decoration:none;color:var(--noir)}
.pagination a:hover{border-color:var(--noir)}
.pagination .current{background:var(--noir);border-color:var(--noir);color:var(--or)}
.vide{padding:48px 0;color:var(--gris)}

/* Article ---------------------------------------------------------------- */
.article__grille{align-items:start}
.article__corps{grid-column:1/9}
.article__aside{grid-column:9/13;align-self:stretch}
.article__aside .encart{position:sticky;top:104px}

/* Produit ---------------------------------------------------------------- */
.produit__grille{align-items:start}
.produit__galerie{grid-column:1/7}
.produit__texte{grid-column:7/13}
.produit__texte .t-h2{margin-bottom:24px}
.produit__texte .actions{margin-top:32px}
.produit__principale{margin:0;overflow:hidden;border-radius:var(--r);background:var(--papier)}
.produit__principale img{width:100%;aspect-ratio:1/1;object-fit:contain}
.produit__vignettes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:12px}
.produit__vignettes img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--r)}
.caracteristiques{margin-top:32px;border-bottom:1px solid var(--ligne)}
.caracteristiques div{display:flex;justify-content:space-between;gap:24px;padding:12px 0;border-top:1px solid var(--ligne);font-size:15px}
.caracteristiques dt{font-weight:500;color:var(--noir)}
.caracteristiques dd{color:var(--gris);text-align:right}

/* Réalisation ------------------------------------------------------------ */
.projet__grille{align-items:start}
.projet__texte{grid-column:1/6}
.projet__galerie{grid-column:7/13}
.galerie{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.galerie__une{grid-column:1/-1}
.galerie img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r)}
.puces{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.puces li{padding:8px 14px;border-radius:var(--r);background:var(--papier);font-size:13px;font-weight:500;color:var(--noir)}
.citation{margin:32px 0 0;padding:28px 32px;border-radius:var(--r);background:var(--noir);color:var(--blanc);font-size:17px;line-height:1.65}
.citation::before{content:"“";display:block;height:28px;font:500 56px/1 var(--display);color:var(--or)}

/* Zones & villes --------------------------------------------------------- */
.departements{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:48px var(--gap)}
.departement__nom{display:flex;justify-content:space-between;gap:12px;margin-bottom:16px;padding-bottom:12px;border-bottom:2px solid var(--or);font:400 16px/1.3 var(--display);text-transform:uppercase;color:var(--noir)}
.departement__nom span{font:500 13px/1.3 var(--texte);color:var(--gris);font-variant-numeric:tabular-nums}
.departement ul{display:grid;gap:8px}
.departement a{font-size:15px;text-decoration:none;color:var(--encre)}
.departement a:hover{color:var(--or-texte)}
.nuage{display:flex;flex-wrap:wrap;gap:8px}
.nuage a{display:block;padding:10px 16px;border:1.5px solid var(--ligne);border-radius:var(--r);font-size:14px;text-decoration:none;color:var(--noir);transition:background-color .2s,border-color .2s,color .2s}
.nuage a:hover{background:var(--noir);border-color:var(--noir);color:var(--or)}

.apercu--court .apercu__haut{border-bottom:0}

/* Pied de page : lien « Toutes nos zones » ; icônes des réseaux toujours visibles au survol */
.footer__tout{display:inline-flex;align-items:center;gap:8px;margin-top:4px;font-weight:500;color:var(--or)!important}
.footer__tout svg{width:14px;height:14px;transition:transform .2s}
.footer__tout:hover svg{transform:translateX(4px)}
.reseaux a svg{color:inherit}
.reseaux--sombre a:hover,.reseaux--sombre a:focus-visible{color:var(--noir)!important}
.reseaux--sombre a:hover svg,.reseaux--sombre a:focus-visible svg{color:var(--noir)}

/* Signature du pied de page : « Un site fait avec ❤ par L&A Communication » */
.footer__signature{display:inline-flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px}
.footer__signature strong{font:500 12px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;color:var(--blanc)}
.coeur{display:inline-block;font-size:15px;line-height:1;color:var(--or);animation:la-battement 1.6s ease-in-out infinite}
@keyframes la-battement{0%,60%,100%{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(1)}45%{transform:scale(1.15)}}

/* Chiffres de l'agence : toujours au-dessus de la photo qu'ils chevauchent.
   Sur mobile main.css les remet en position statique avec une marge négative :
   sans position ni z-index, la photo était peinte par-dessus et coupait les nombres. */
.chiffres{z-index:1}

/* Formulaire de devis : titre lisible sur le panneau noir ; un menu déroulant aux options
   longues ne doit jamais élargir sa colonne (minmax(0,1fr) + min-width:0). */
.formulaire .t-h3{color:var(--blanc)}
.champ{min-width:0}
.champ select{max-width:100%;text-overflow:ellipsis}
@media (max-width:767px){.chiffres{position:relative;margin-top:-32px}}

/* Logos (références, partenaires, territoire) : un seul rang qui défile en boucle.
   Le script enveloppe la liste dans .defile-cadre et la double pour boucler sans saut. */
.defile-cadre{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.defile{display:flex!important;gap:16px!important;width:max-content;overflow:visible!important;padding:0!important;animation:la-defile var(--duree,40s) linear infinite}
.defile-cadre:hover .defile,.defile-cadre:focus-within .defile{animation-play-state:paused}
.defile>li{flex:none}
.clients.defile>li{width:150px}
.logos.defile>li,.adhesions__logos.defile>li{width:170px}
@keyframes la-defile{to{transform:translateX(calc(-50% - 8px))}}
.partenaires__grille .defile-cadre,.adhesions .defile-cadre{grid-column:6/13}
@media (max-width:1024px){
  .partenaires__grille .defile-cadre{grid-column:1/-1;margin-top:48px}
  .adhesions .defile-cadre{grid-column:1/-1;margin-top:32px}
}
@media (max-width:767px){
  .clients.defile>li{width:118px}
  .logos.defile>li,.adhesions__logos.defile>li{width:140px}
}
@media (prefers-reduced-motion:reduce){
  .defile-cadre{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
}

/* Labels du pied de page (Origin'Ain, CCI) : cases identiques, logo centré et contenu */
.labels{display:grid;grid-template-columns:repeat(2,132px);gap:12px}
.labels li{display:flex;align-items:center;justify-content:center;width:132px;height:84px;padding:10px 12px;overflow:hidden;border-radius:var(--r);background:var(--blanc)}
.labels img{width:auto;height:auto;max-width:100%;max-height:64px;object-fit:contain}
/* Même contrainte pour les logos « Territoire » de la page équipe */
.adhesions__logos li{display:flex;align-items:center;justify-content:center;overflow:hidden}
.adhesions__logos img{width:auto;height:auto;max-width:100%;max-height:100%;padding:14px}
.adhesions__logos li.is-photo img{width:100%;height:100%;max-height:none;padding:0;object-fit:cover}

/* Contact rapide : barre mobile, bouton flottant, « Être rappelé » ------- */
.barre-mobile{display:none}
.rappel-flottant{position:fixed;right:24px;bottom:24px;z-index:60;display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 20px 0 16px;border-radius:var(--r);background:var(--or);color:var(--noir);font:500 12px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;box-shadow:0 14px 30px rgba(23,21,15,.32);opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .3s,transform .3s,visibility .3s,background-color .2s}
.rappel-flottant.is-visible{opacity:1;visibility:visible;transform:none}
.rappel-flottant:hover{background:var(--or-clair)}
.rappel-flottant svg{width:18px;height:18px}
.encart__rappel{display:flex;align-items:center;justify-content:center;gap:10px;font-size:14px;font-weight:500;color:var(--or);text-decoration:underline;text-underline-offset:3px}
.encart__rappel:hover{color:var(--or-clair)}

.rappel{width:min(460px,calc(100% - 32px));max-height:calc(100% - 32px);margin:auto;padding:0;border:0;border-radius:var(--r);background:var(--blanc);color:var(--encre);box-shadow:0 40px 80px rgba(0,0,0,.45)}
.rappel::backdrop{background:rgba(23,21,15,.74);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.rappel[open]{animation:la-monte .35s cubic-bezier(.22,.61,.36,1)}
.rappel__carte{position:relative;display:grid;gap:14px;padding:36px}
.rappel__carte .eyebrow{margin:0}
.rappel__corps{display:grid;gap:14px}
.rappel__titre{margin:-4px 0 0;font:400 26px/1.15 var(--display);text-transform:uppercase;color:var(--noir)}
.rappel__texte,.rappel__alt{font-size:14px;line-height:1.6;color:var(--gris)}
.rappel__alt{text-align:center}
.rappel__alt a{font-weight:500;color:var(--or-texte)}
.rappel__ok{padding:16px 18px;border-radius:var(--r);background:var(--papier);font-weight:500;color:var(--noir)}
.rappel__erreur{padding:12px 14px;border-left:3px solid #B3261E;background:#FBEDEC;font-size:14px;color:#8C1D18}
.rappel__champ{display:grid;gap:6px}
.rappel__champ span{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--gris)}
.rappel__champ input{width:100%;height:52px;padding:0 16px;border:1.5px solid var(--ligne);border-radius:var(--r);font:400 16px/1 var(--texte);color:var(--noir);background:var(--blanc)}
.rappel__champ input:focus{outline:none;border-color:var(--or)}
.rappel .accord{color:var(--gris)}
.rappel .accord a{color:var(--or-texte)}
.rappel .btn{width:100%}
.rappel__fermer{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:40px;height:40px;border-radius:var(--r);font-size:26px;line-height:1;color:var(--noir)}
.rappel__fermer:hover{background:var(--papier)}

@media (max-width:767px){
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .barre-mobile{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding-bottom:env(safe-area-inset-bottom);border-top:1px solid var(--ligne-sombre);background:var(--noir)}
  .barre-mobile__btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;height:64px;font:500 10.5px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--blanc)}
  .barre-mobile__btn+.barre-mobile__btn{border-left:1px solid var(--ligne-sombre)}
  .barre-mobile__btn svg{width:20px;height:20px;color:var(--or)}
  .barre-mobile__btn--or{background:var(--or);color:var(--noir)}
  .barre-mobile__btn--or svg{color:var(--noir)}
  .rappel-flottant{display:none}
  .rappel{width:100%;max-width:none;margin:auto 0 0;border-radius:var(--r) var(--r) 0 0}
  .rappel__carte{padding:28px 20px calc(24px + env(safe-area-inset-bottom))}
}

/* Qui sommes-nous : fondateur, pôles, adhésions, rejoindre --------------- */
.fondateur{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center}
.fondateur__visuel{grid-column:1/6;position:relative;display:grid;place-items:center;min-height:440px}
.fondateur__visuel .splash{position:absolute;left:-12%;top:50%;width:124%;height:auto;transform:translateY(-50%)}
.fondateur__photo{position:relative;z-index:1;width:72%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r);box-shadow:0 30px 60px rgba(0,0,0,.4)}
.fondateur__initiale{position:relative;z-index:1;font:500 150px/1 var(--display);color:var(--noir)}
.fondateur__texte{grid-column:7/13}
.fondateur__citation{margin:0 0 28px;font:400 clamp(22px,2.3vw,31px)/1.28 var(--display);text-transform:uppercase;text-wrap:balance;color:var(--blanc)}
.fondateur__citation::before{content:"“";display:block;height:.62em;font-size:2.6em;line-height:1;color:var(--or)}
.fondateur__prose p{color:rgba(255,255,255,.78)}
.fondateur__prose strong{color:var(--blanc)}
.fondateur__signature{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-top:32px;padding-top:24px;border-top:1px solid var(--ligne-sombre)}
.fondateur__signature strong{font:500 17px/1.2 var(--display);text-transform:uppercase;color:var(--or)}
.fondateur__signature span{font-size:14px;color:rgba(255,255,255,.66)}

.poles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.pole{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--ligne);border-radius:var(--r);background:var(--blanc)}
.pole__img{margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--noir)}
.pole__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,.61,.36,1)}
.pole:hover .pole__img img{transform:scale(1.05)}
.pole__corps{display:flex;flex-direction:column;gap:10px;padding:24px}
.pole__titre{font:400 17px/1.3 var(--display);text-transform:uppercase;text-wrap:balance;color:var(--noir)}
.pole__corps p{font-size:14.5px;line-height:1.6;color:var(--gris)}

.adhesions{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:center}
.adhesions__texte{grid-column:1/5}
.adhesions__texte p:last-child{margin-top:20px;color:var(--gris)}
.adhesions__logos{grid-column:6/13;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.adhesions__logos li{display:grid;place-items:center;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--ligne);border-radius:var(--r);background:var(--blanc)}
.adhesions__logos img{width:100%;height:100%;object-fit:contain;padding:14px}
.adhesions__logos li.is-photo img{object-fit:cover;padding:0}

.rejoindre{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.rejoindre__carte{position:relative;display:flex;flex-direction:column;gap:14px;overflow:hidden;padding:44px;border-radius:var(--r);background:var(--noir);color:var(--blanc)}
.rejoindre__carte--or{background:var(--or);color:var(--noir)}
.rejoindre__carte--or .eyebrow{color:var(--noir)}
.rejoindre__carte--or .eyebrow::before{background:var(--noir)}
.rejoindre__carte .eyebrow{margin:0}
.rejoindre__titre{font:400 clamp(22px,2.2vw,30px)/1.2 var(--display);text-transform:uppercase;text-wrap:balance}
.rejoindre__carte p{max-width:54ch;font-size:15px;line-height:1.65}
.rejoindre__carte .actions{margin-top:auto;padding-top:14px}
.rejoindre__mention{font-size:12px!important;opacity:.72}
.rejoindre__carte .splash{position:absolute;right:-90px;bottom:-70px;width:280px;height:auto;opacity:.16;pointer-events:none}
.rejoindre__carte--or .splash{opacity:.14;color:var(--noir)}
.splash{color:var(--or);overflow:visible}

@media (max-width:1024px){
  .fondateur__visuel,.fondateur__texte,.adhesions__texte,.adhesions__logos{grid-column:1/-1}
  .fondateur__visuel{width:100%;max-width:480px;min-height:340px;margin:0 auto 48px}
  .adhesions__logos{margin-top:32px}
  .poles{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:767px){
  .poles,.rejoindre{grid-template-columns:1fr}
  .rejoindre__carte{padding:32px 24px}
  .fondateur__initiale{font-size:110px}
}

/* ==========================================================================
   Animations
   Signature : la tache de peinture « éclabousse » et le réveil sonne à l'ouverture
   de chaque page ; le reste apparaît au défilement (voir laAnimer dans main.js).
   ========================================================================== */
@keyframes la-monte{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes la-splat{0%{opacity:0;transform:translateY(-50%) scale(.3) rotate(-14deg)}55%{opacity:1;transform:translateY(-50%) scale(1.06) rotate(2deg)}78%{transform:translateY(-50%) scale(.98) rotate(-1deg)}100%{opacity:1;transform:translateY(-50%) scale(1) rotate(0)}}
@keyframes la-sonne{0%,100%{transform:rotate(0)}8%{transform:rotate(-13deg)}16%{transform:rotate(11deg)}24%{transform:rotate(-9deg)}32%{transform:rotate(7deg)}40%{transform:rotate(-5deg)}48%{transform:rotate(3deg)}56%{transform:rotate(-1deg)}64%{transform:rotate(0)}}
@keyframes la-trait{from{background-size:0 .09em}to{background-size:100% .09em}}

/* Ouverture des pages internes */
.phero__texte>*{animation:la-monte .75s cubic-bezier(.22,.61,.36,1) both}
.phero__texte>*:nth-child(2){animation-delay:.07s}
.phero__texte>*:nth-child(3){animation-delay:.14s}
.phero__texte>*:nth-child(4){animation-delay:.21s}
.phero__texte>*:nth-child(5){animation-delay:.28s}
.phero__texte>*:nth-child(6){animation-delay:.35s}
.phero__splash{animation:la-splat 1s cubic-bezier(.34,1.4,.64,1) .12s both}
.phero__photo{animation:la-monte .8s cubic-bezier(.22,.61,.36,1) .35s both}
.phero__logo{transform-origin:50% 62%;animation:la-monte .6s cubic-bezier(.22,.61,.36,1) .3s both,la-sonne 1.1s ease-in-out 1s}
.phero__visuel:hover .phero__logo,.fondateur__visuel:hover .fondateur__initiale{animation:la-sonne 1s ease-in-out}
.brand img{transform-origin:50% 62%}
.brand:hover img{animation:la-sonne 1s ease-in-out}

/* Accueil : le texte de chaque diapositive monte à son arrivée */
.slide.is-active .slide__contenu>*{animation:la-monte .8s cubic-bezier(.22,.61,.36,1) both}
.slide.is-active .slide__contenu>*:nth-child(2){animation-delay:.1s}
.slide.is-active .slide__contenu>*:nth-child(3){animation-delay:.2s}
.slide.is-active .slide__contenu>*:nth-child(4){animation-delay:.3s}

/* Apparition au défilement — état posé par le script uniquement */
.anim-pret{opacity:0;transform:translateY(28px);transition:opacity .75s cubic-bezier(.22,.61,.36,1),transform .75s cubic-bezier(.22,.61,.36,1);transition-delay:calc(var(--i,0) * 70ms)}
.anim-pret.anim-vu{opacity:1;transform:none}

/* « réveiller » se souligne au pinceau dans le pied de page */
.footer__slogan em{background:linear-gradient(var(--or),var(--or)) no-repeat 0 94%/100% .09em;padding-bottom:.05em}
.footer__slogan.anim-vu em{animation:la-trait 1s cubic-bezier(.22,.61,.36,1) .45s both}

/* Petites respirations */
.faq__item[open] .faq__reponse{animation:la-monte .4s ease both}
.membre__photo img{transition:transform .6s cubic-bezier(.22,.61,.36,1)}
.membre:hover .membre__photo img{transform:scale(1.05)}
.membre__splash{transition:transform .6s cubic-bezier(.34,1.4,.64,1)}
.membre:hover .membre__splash{transform:scale(1.08) rotate(-3deg)}
.etape__num{transition:color .3s}
.etape:hover .etape__num{color:var(--or-clair)}

/* Bandeau interne : photo du bureau en fond, texte pleine largeur (plus de visuel à droite) */
.phero{isolation:isolate}
.phero__fond{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;animation:la-recul 14s cubic-bezier(.22,.61,.36,1) both}
.phero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(23,21,15,.94) 0%,rgba(23,21,15,.84) 45%,rgba(23,21,15,.58) 100%)}
.phero__grille{display:block;padding-bottom:112px}
.phero__texte{max-width:880px}
.phero__titre{font-size:clamp(32px,3.9vw,58px)}
@keyframes la-recul{from{transform:scale(1.08)}to{transform:scale(1)}}
@media (max-width:1024px){.phero__grille{padding-bottom:80px}}
@media (max-width:767px){
  .phero::before{background:rgba(23,21,15,.86)}
  .phero__texte{margin-inline:auto}
}

/* Logo : exactement le fichier de l'en-tête du site en ligne (« Depuis 2017 » inclus),
   sans contour, en grand. L'en-tête et les bandeaux s'agrandissent en conséquence. */
.header__bar{height:128px}
.header.is-solid .header__bar{height:92px}
.brand img{height:112px;filter:none}
.header.is-solid .brand img{height:76px}
.footer__marque img.logo{height:112px;filter:none}
.phero{padding-top:196px}
.slide{padding-top:208px}
@media (max-width:1024px){
  .header__bar,.header.is-solid .header__bar,.header.is-open .header__bar{height:92px}
  .brand img,.header.is-solid .brand img{height:76px}
  .header.is-open .nav{inset:92px 0 0}
  .phero{padding-top:150px}
  .slide{padding-top:160px}
}

/* ==========================================================================
   Mobile : tout est centré (demande client). Exceptions : champs de saisie
   et case de consentement, qui restent alignés à gauche pour rester lisibles.
   ========================================================================== */
@media (max-width:767px){
  /* Têtes de section, bandeaux, accueil */
  .head,.hero__barre .wrap{align-items:center}
  .head,.head__titres,.phero__texte,.slide__contenu,.agence__texte,.metier__texte,.intro__texte,.partenaires__texte,.contact__texte,.adhesions__texte,.faq__tete,.histoire,.valeurs,.produit__texte,.projet__texte,.fondateur__texte,.footer__slogan{text-align:center}
  .ariane,.phero__accroche,.slide__lead{margin-inline:auto;text-align:center}
  .actions,.head__outils,.reseaux,.labels,.puces,.nuage,.fiche-agence__actions,.fondateur__signature,.footer__bas ul{justify-content:center}
  .hero__ctrl{justify-content:center;gap:16px}
  .gbadge{margin-inline:auto}

  /* Textes */
  .prose,.prose--article,.article__corps{text-align:center}
  .prose ul,.prose ol{padding-left:0;list-style-position:inside}
  .prose blockquote{padding:12px 0 0;border-left:0;border-top:3px solid var(--or)}
  .citation{text-align:center}

  /* Encarts */
  .encart,.encart__titre,.encart__liste div{text-align:center}
  .encart__ligne,.encart__tel,.encart__rappel{justify-content:center}

  /* Blocs répétés */
  .atout,.etape,.membre,.pole__corps,.departement,.fiche-agence,.valeurs__liste li,.rejoindre__carte,.chiffres div{text-align:center}
  .atout::before{margin-inline:auto}
  .carte__corps,.pole__corps,.fiche-agence,.rejoindre__carte{align-items:center;text-align:center}
  .carte .lien{align-self:center}
  .rejoindre__carte p{margin-inline:auto}
  .liens-services a{justify-content:center;text-align:center}
  .departement__nom{justify-content:center;gap:10px}
  .fiche-agence__ligne,.agence p,.agence a{justify-content:center;text-align:center}
  .agence h3{text-align:center}
  .post{grid-template-columns:1fr;text-align:center}
  .post-une{text-align:center}
  .apercu__haut{align-items:center;text-align:center}
  .apercu__note{flex-wrap:wrap;justify-content:center}

  /* FAQ : question centrée, signe à la suite */
  .faq__item summary{justify-content:center;text-align:center}

  /* Frise des dates : verticale et centrée */
  .frise{padding-left:0;border-left:0;text-align:center}
  .frise li::before{position:static;display:block;margin:0 auto 12px}

  /* Formulaire : reste aligné à gauche (demande client), sans débordement */
  .formulaire,.formulaire .t-h3,.formulaire__intro,.statut,.champ label{text-align:left}
  .champs{grid-template-columns:minmax(0,1fr)}
  .envoi .btn{flex:none;width:100%;height:52px}
  .rappel__carte .eyebrow,.rappel__titre,.rappel__texte{text-align:center;justify-self:center}

  /* Pied de page */
  .footer__marque,.footer__col{justify-items:center;text-align:center}
  .footer__marque p{margin-inline:auto}
  .footer__bas{align-items:center;text-align:center}

  /* Pied de page resserré sur mobile */
  .footer{padding-top:48px}
  .footer__slogan{padding-bottom:32px;font-size:28px}
  .footer__grille{padding-block:32px;row-gap:28px}
  .footer__marque{margin-bottom:0;gap:14px}
  .footer__marque img.logo{height:80px}
  .footer__col:nth-child(n){margin-bottom:0}
  .footer__col{gap:6px}
  .footer__col h2{margin-bottom:6px}
  .footer__bas{padding-block:18px;gap:8px}
  .footer__bas ul{gap:6px 18px}
}

/* Tablette --------------------------------------------------------------- */
@media (max-width:1024px){
  .phero{padding-top:128px}
  .phero__texte,.phero__visuel,.intro__texte,.encart,.faq__tete,.faq,.histoire,.valeurs,.article__corps,.article__aside,.produit__galerie,.produit__texte,.projet__texte,.projet__galerie{grid-column:1/-1}
  .phero__grille{padding-bottom:64px}
  .phero__visuel{width:100%;max-width:520px;min-height:300px;margin:48px auto 0}
  .encart,.faq__tete,.article__aside .encart{position:static}
  .encart,.article__aside,.valeurs,.produit__texte,.projet__galerie{margin-top:48px}
  .faq{margin-top:32px}
  .atouts,.etapes,.cartes--3,.cartes--4,.liens-services,.departements{grid-template-columns:repeat(2,minmax(0,1fr))}
  .membres,.fiches-agences{grid-template-columns:repeat(2,minmax(0,1fr))}
  .admin-bar .header{top:46px}
}
/* Mobile ----------------------------------------------------------------- */
@media (max-width:767px){
  .phero{padding-top:112px}
  .phero__accroche{font-size:16px}
  .phero__visuel{min-height:240px}
  .encart{padding:28px 24px}
  .atouts,.etapes,.cartes--3,.cartes--4,.liens-services,.fiches-agences,.departements{grid-template-columns:1fr}
  .membres{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 16px}
  .membre__initiale{font-size:48px}
  .filtres{flex-wrap:nowrap;overflow-x:auto;margin-inline:calc(var(--pad) * -1);padding-inline:var(--pad);padding-bottom:4px}
  .faq__item summary{font-size:15px}
  .caracteristiques div{flex-direction:column;gap:2px}
  .caracteristiques dd{text-align:left}
  .admin-bar .header{top:0}
}
