/* REXER ENERGIES - Refonte v2
   Design system original Wattlift. Discipline visuelle heritee de la V3 Auver Sol Avenir
   (sections plein ecran, un message et un CTA par ecran, navigation minimale, motion sobre),
   rehabille integralement a la charte Rexer et nourri de l'ADN du site rexer-energies.fr.

   Charte : rouge #ee2b49 (accent dominant, CTA) | bleu nuit #012d48 (fonds forts, titres)
            bleu moyen #0e4e96 (liens, accents secondaires) | blanc.
   Dore interdit. La variable --etoile (#fbbc05) est RESERVEE aux etoiles d'avis Google. */

:root{
  --rouge:#ee2b49;
  --rouge-fonce:#d21f3c;
  --navy:#012d48;
  --navy-2:#023a5c;
  --navy-clair:#043f61;
  --bleu:#0e4e96;
  --blanc:#ffffff;
  --creme:#eef2f6;
  --mist:#f4f6fa;
  --texte:#012d48;
  --texte-sec:#5b6b85;
  --texte-ter:#9fb0c4;
  --ligne:#d9e0ea;
  --etoile:#fbbc05;
  --vert:#12b76a;
  --nav-h:66px;
  --ease:cubic-bezier(.16,1,.3,1);
  --max:1180px;
  --font:'Poppins',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
/* scroll-padding : la barre de navigation est fixe, sans cette marge les ancres
   internes (#devis-form notamment) arrivent masquees sous la navigation. */
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 10px)}
body{
  font-family:var(--font);
  color:var(--texte);
  background:var(--blanc);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,video,svg{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
ul{list-style:none}
:focus-visible{outline:3px solid var(--rouge);outline-offset:3px;border-radius:4px}
.saut{position:absolute;left:-9999px;top:0;background:var(--rouge);color:#fff;padding:10px 18px;border-radius:0 0 8px 0;z-index:200;font-weight:700;font-size:14px}
.saut:focus{left:0}

/* ============ NAVIGATION ============ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:var(--nav-h);
  display:flex;align-items:center;justify-content:space-between;
  gap:18px;padding:0 30px;
  transition:background .45s var(--ease),box-shadow .45s var(--ease),color .45s var(--ease);
}
.nav.solide{background:rgba(255,255,255,.95);backdrop-filter:blur(14px);box-shadow:0 1px 0 rgba(1,45,72,.1);color:var(--texte)}
.nav.sur-sombre:not(.solide){color:var(--blanc)}
.nav-logo{display:flex;align-items:center;flex:none;border-radius:9px;padding:5px 9px;transition:background .45s var(--ease)}
.nav.sur-sombre:not(.solide) .nav-logo{background:rgba(255,255,255,.94)}
.nav-logo img{height:26px;width:auto}

.nav-liens{display:flex;gap:2px;align-items:center}
.nav-liens>li{position:relative}
.nav-liens a{
  display:block;font-size:13.5px;font-weight:500;letter-spacing:.01em;
  padding:9px 13px;border-radius:8px;transition:background .15s linear;white-space:nowrap;
}
.nav-liens a:hover{background:rgba(1,45,72,.07)}
.nav.sur-sombre:not(.solide) .nav-liens a:hover{background:rgba(255,255,255,.15)}
.nav-liens a[aria-current="page"]{font-weight:700}
.nav-sous{
  position:absolute;top:100%;left:0;min-width:280px;background:var(--blanc);color:var(--texte);
  border-radius:12px;box-shadow:0 22px 46px rgba(1,45,72,.19);padding:8px;display:none;
}
.nav-liens>li:hover .nav-sous,.nav-liens>li:focus-within .nav-sous{display:block}
.nav-sous a{font-size:13.5px;padding:11px 13px;font-weight:500}
.nav-sous a:hover{background:var(--mist)}

.nav-droite{display:flex;align-items:center;gap:10px;flex:none}
.nav-tel{font-size:13.5px;font-weight:600;letter-spacing:.01em;padding:9px 12px;border-radius:8px;white-space:nowrap}
.nav-tel:hover{background:rgba(1,45,72,.07)}
.nav.sur-sombre:not(.solide) .nav-tel:hover{background:rgba(255,255,255,.15)}
.nav-cta{
  display:inline-flex;align-items:center;height:40px;padding:0 20px;
  background:var(--rouge);color:var(--blanc);
  font-size:13.5px;font-weight:700;border-radius:100px;white-space:nowrap;
  transition:background .15s linear;
}
.nav-cta:hover{background:var(--rouge-fonce)}
.nav-burger{
  display:none;width:40px;height:40px;border:0;background:none;cursor:pointer;
  color:inherit;position:relative;border-radius:8px;
}
.nav-burger span,.nav-burger::before,.nav-burger::after{
  content:"";position:absolute;left:10px;width:20px;height:1.8px;background:currentColor;border-radius:2px;
  transition:transform .3s var(--ease),opacity .2s linear;
}
.nav-burger::before{top:14px}
.nav-burger span{top:19.2px}
.nav-burger::after{top:24.4px}
.nav-burger.ouvert::before{transform:translateY(5.2px) rotate(45deg)}
.nav-burger.ouvert span{opacity:0}
.nav-burger.ouvert::after{transform:translateY(-5.2px) rotate(-45deg)}

/* ============ SECTIONS PLEIN ECRAN ============ */
.ecran{
  position:relative;
  min-height:100vh;min-height:100svh;
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  overflow:hidden;padding:calc(var(--nav-h) + 54px) 24px 64px;text-align:center;
}
.ecran.sombre{background:var(--navy);color:var(--blanc)}
.ecran.claire{background:var(--blanc)}
.ecran.grise{background:var(--creme)}
.ecran.auto{min-height:0}
.ecran-centre{justify-content:center}
.ecran-media{position:absolute;inset:0;z-index:0;background:var(--navy)}
.ecran-media img{width:100%;height:100%;object-fit:cover;filter:contrast(1.04) saturate(1.03)}
.ecran-contenu{position:relative;z-index:2;width:100%;max-width:var(--max);margin:0 auto}
.ecran-haut{margin-top:2vh}
.ecran-bas{margin-bottom:1vh}
.voile{position:absolute;inset:0;z-index:1;
  background:linear-gradient(0deg,rgba(1,45,72,.88) 0%,rgba(1,45,72,.42) 44%,rgba(1,45,72,.58) 100%)}
.voile.leger{background:linear-gradient(0deg,rgba(1,45,72,.76) 0%,rgba(1,45,72,.22) 50%,rgba(1,45,72,.38) 100%)}

/* Bandeau d'entete des pages interieures (heritier des headers du site actuel) */
.entete{
  position:relative;min-height:clamp(320px,42vh,430px);display:flex;align-items:flex-end;
  padding:calc(var(--nav-h) + 60px) 24px 52px;overflow:hidden;background:var(--navy);color:var(--blanc);text-align:left;
}
.entete-media{position:absolute;inset:0;z-index:0}
.entete-media img{width:100%;height:100%;object-fit:cover}
.entete .voile{background:linear-gradient(0deg,rgba(1,45,72,.95) 0%,rgba(1,45,72,.74) 58%,rgba(1,45,72,.84) 100%)}
.entete-int{position:relative;z-index:2;max-width:var(--max);margin:0 auto;width:100%}
.fil{font-size:12.5px;opacity:.72;margin-bottom:22px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.fil a:hover{text-decoration:underline}
.fil span{opacity:.55}

/* ============ TYPOGRAPHIE ============ */
.titre-hero{font-size:clamp(40px,5.6vw,74px);font-weight:700;letter-spacing:-.035em;line-height:1.03;max-width:17ch;margin:0 auto}
.titre-ecran{font-size:clamp(31px,4vw,56px);font-weight:700;letter-spacing:-.03em;line-height:1.07;max-width:19ch;margin:0 auto}
.titre-page{font-size:clamp(32px,4.4vw,58px);font-weight:700;letter-spacing:-.03em;line-height:1.06;max-width:22ch}
.titre-bloc{font-size:clamp(24px,2.6vw,37px);font-weight:700;letter-spacing:-.022em;line-height:1.14}
.sous-titre{font-size:clamp(15px,1.2vw,18.5px);font-weight:400;line-height:1.6;margin:18px auto 0;max-width:58ch;opacity:.85}
.entete .sous-titre{margin-left:0;margin-right:0}
.eyebrow{font-size:11.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;opacity:.66;margin-bottom:16px;color:var(--rouge)}
.sombre .eyebrow,.entete .eyebrow{color:#ff8296;opacity:1}
.texte{font-size:16px;line-height:1.75;color:var(--texte-sec)}
.sombre .texte{color:rgba(255,255,255,.76)}
.mesure{max-width:64ch;margin-left:auto;margin-right:auto}
.hl{color:var(--rouge)}
.sombre .hl{color:#ff8296}

/* ============ BOUTONS : deux variantes ============ */
.cta-rangee{display:flex;gap:13px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.cta-rangee.gauche{justify-content:flex-start}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  min-width:228px;height:50px;padding:0 26px;
  border-radius:100px;font-size:14.5px;font-weight:700;letter-spacing:.01em;
  cursor:pointer;border:1.6px solid transparent;font-family:inherit;
  transition:background .15s linear,color .15s linear,border-color .15s linear,transform .15s var(--ease);
}
.btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.btn-plein{background:var(--rouge);color:var(--blanc);border-color:var(--rouge)}
.btn-plein:hover{background:var(--rouge-fonce);border-color:var(--rouge-fonce);transform:translateY(-2px)}
.btn-ligne{background:transparent;color:currentColor;border-color:currentColor}
.sombre .btn-ligne:hover,.entete .btn-ligne:hover,.ecran-media~* .btn-ligne:hover{background:rgba(255,255,255,.14)}
.claire .btn-ligne:hover,.grise .btn-ligne:hover{background:rgba(1,45,72,.06)}
.btn-large{width:100%;min-width:0}

/* ============ BANDEAU PREUVE ============ */
.bandeau{padding:44px 24px;background:var(--navy);color:var(--blanc)}
.bandeau.claire{background:var(--creme);color:var(--texte)}
.bandeau-int{max-width:var(--max);margin:0 auto;display:flex;align-items:center;justify-content:center;gap:16px 34px;flex-wrap:wrap}
.badge{background:var(--blanc);border-radius:10px;padding:12px 18px;display:flex;align-items:center;justify-content:center;height:66px;flex:none}
.badge img{height:100%;width:auto;object-fit:contain}
.bandeau-txt{font-size:13px;line-height:1.65;opacity:.78;max-width:36ch;text-align:left}
/* Badge De Dietrich isole, hors rangee de credibilite (addendum 27/08/2026) :
   meme gabarit que .badge, simplement pose en ligne dans le flux du bloc. */
.badge-seul{background:var(--blanc);border-radius:10px;padding:10px 16px;display:inline-flex;align-items:center;justify-content:center;height:62px;margin:20px 0 0}
.badge-seul img{height:100%;width:auto;object-fit:contain}
/* Etoiles Google : trace SVG originale. Seul endroit du site ou --etoile est utilisee. */
.etoiles{display:inline-flex;gap:3px;align-items:center}
.etoiles svg{width:18px;height:18px;fill:var(--etoile)}
/* Libelle avis : structure et proportions reprises de .cred-google des landing
   pages (etoiles, gap 12px, libelle en gras). M22 31/07/2026. */
.note-google{display:inline-flex;align-items:center;gap:12px;font-size:14px;font-weight:600;flex-wrap:wrap}
.note-google-txt{font-weight:700;font-size:15px}
/* M22 31/07/2026 : les regles .note-google .bat (badge de recette interne) ont ete retirees en meme temps que le badge lui-meme. */

/* ============ CHIFFRES ============ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;width:100%;max-width:var(--max);margin:42px auto 0;background:rgba(255,255,255,.14)}
.claire .stats,.grise .stats{background:var(--ligne)}
.stat{padding:32px 18px;background:var(--navy)}
.claire .stat{background:var(--blanc)}
.grise .stat{background:var(--creme)}
.stat-valeur{font-size:clamp(29px,3.2vw,45px);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--rouge)}
.sombre .stat-valeur{color:#ff8296}
.stat-label{font-size:12.5px;margin-top:11px;opacity:.68;line-height:1.5}

/* ============ GRILLES DE REALISATIONS ============ */
.grille-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;width:100%;max-width:var(--max);margin:38px auto 0}
.grille-real{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;width:100%;max-width:var(--max);margin:0 auto}
.carte-real{position:relative;aspect-ratio:3/2;border-radius:12px;overflow:hidden;background:var(--navy);text-align:left;display:block}
.carte-real img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.carte-real:hover img{transform:scale(1.04)}
.carte-legende{position:absolute;left:0;right:0;bottom:0;padding:44px 18px 15px;color:var(--blanc);
  background:linear-gradient(0deg,rgba(1,45,72,.94) 0%,rgba(1,45,72,.55) 55%,rgba(1,45,72,0) 100%)}
.carte-legende strong{display:block;font-size:14.5px;font-weight:700;letter-spacing:-.01em}
.carte-legende span{display:block;font-size:11.5px;margin-top:5px;opacity:.8;line-height:1.5}
.carte-dept{position:absolute;top:12px;left:12px;z-index:2;background:var(--rouge);color:#fff;
  font-size:12px;font-weight:700;padding:5px 10px;border-radius:6px;letter-spacing:.02em}
.carte-tag{position:absolute;top:12px;right:12px;z-index:2;background:rgba(255,255,255,.94);color:var(--navy);
  font-size:10.5px;font-weight:700;padding:5px 9px;border-radius:6px;letter-spacing:.03em;text-transform:uppercase}

/* ============ BLOCS DEUX COLONNES ============ */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;max-width:var(--max);margin:0 auto;text-align:left}
.duo.inverse .duo-media{order:-1}
.duo-media{border-radius:14px;overflow:hidden;aspect-ratio:4/3;background:var(--navy)}
.duo-media img{width:100%;height:100%;object-fit:cover}
.duo-media.portrait{aspect-ratio:3/4}
.duo h2,.duo h3{margin-bottom:15px}
.section{padding:clamp(66px,9vh,116px) 24px}
.section-tete{max-width:var(--max);margin:0 auto clamp(34px,5vh,58px);text-align:center}
.liste-check{margin-top:22px;display:grid;gap:12px}
.liste-check li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;line-height:1.6}
.liste-check .ic{flex:none;width:23px;height:23px;border-radius:50%;background:var(--rouge);display:flex;align-items:center;justify-content:center;margin-top:1px}
.liste-check .ic svg{width:13px;height:13px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}

/* ============ PROCESS ============ */
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;max-width:var(--max);margin:0 auto;background:var(--ligne)}
.sombre .process{background:rgba(255,255,255,.14)}
.etape{background:var(--blanc);padding:32px 24px;text-align:left}
.sombre .etape{background:var(--navy)}
.grise .etape{background:var(--creme)}
.etape-num{font-size:12px;font-weight:700;letter-spacing:.2em;color:var(--rouge);margin-bottom:14px}
.etape h3{font-size:17.5px;font-weight:700;letter-spacing:-.015em;margin-bottom:9px}
.etape p{font-size:14px;line-height:1.65;color:var(--texte-sec)}
.sombre .etape p{color:rgba(255,255,255,.74)}

/* ============ PILIERS ============ */
.piliers{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:var(--max);margin:0 auto}
.pilier{border:1px solid var(--ligne);border-radius:14px;padding:28px 24px;text-align:left;background:var(--blanc)}
.sombre .pilier{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.15)}
.pilier-ic{width:44px;height:44px;border-radius:11px;background:rgba(238,43,73,.1);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.pilier-ic svg{width:22px;height:22px;fill:none;stroke:var(--rouge);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.pilier h3{font-size:17px;font-weight:700;letter-spacing:-.015em;margin-bottom:8px}
.pilier p{font-size:14px;line-height:1.65;color:var(--texte-sec)}
.sombre .pilier p{color:rgba(255,255,255,.74)}

/* ============ TABLEAU ============ */
.tableau{width:100%;max-width:var(--max);margin:0 auto;border-collapse:collapse;text-align:left;font-size:14.5px}
.tableau th,.tableau td{padding:17px 15px;border-bottom:1px solid var(--ligne);vertical-align:top}
.sombre .tableau th,.sombre .tableau td{border-color:rgba(255,255,255,.14)}
.tableau th{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--texte-sec)}
.sombre .tableau th{color:rgba(255,255,255,.58)}
.tableau td:first-child{font-weight:600}
.tableau td p{font-size:13px;color:var(--texte-sec);margin-top:6px;line-height:1.6}
.sombre .tableau td p{color:rgba(255,255,255,.68)}

/* ============ FAQ ============ */
.faq{max-width:840px;margin:0 auto;text-align:left}
.faq details{border-bottom:1px solid var(--ligne)}
.sombre .faq details{border-color:rgba(255,255,255,.15)}
.faq summary{list-style:none;cursor:pointer;padding:23px 46px 23px 0;position:relative;
  font-size:clamp(15.5px,1.4vw,18px);font-weight:600;letter-spacing:-.012em;line-height:1.45}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:50%;width:10px;height:10px;
  border-right:1.7px solid var(--rouge);border-bottom:1.7px solid var(--rouge);
  transform:translateY(-70%) rotate(45deg);transition:transform .3s var(--ease)}
.faq details[open] summary::after{transform:translateY(-25%) rotate(225deg)}
.faq-rep{font-size:15px;line-height:1.78;color:var(--texte-sec);padding:0 46px 24px 0}
.sombre .faq-rep{color:rgba(255,255,255,.76)}
.faq-sign{display:block;margin-top:12px;font-size:12.5px;color:var(--texte-ter);font-style:normal}

/* ============ AVIS ============ */
/* align-items:start (addendum 27/08/2026) : depuis l'integration des avis
   Google, les longueurs vont de 2 lignes a 25 lignes. Sans cette regle, toutes
   les cartes d'une rangee sont etirees a la hauteur de la plus longue et
   laissent de grands blocs vides. */
.avis-grille{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:var(--max);margin:0 auto;align-items:start}
.avis{border:1px solid var(--ligne);border-radius:14px;padding:26px 24px;text-align:left;background:var(--blanc);display:flex;flex-direction:column}
.sombre .avis{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.15)}
.avis .etoiles{margin-bottom:16px}
.avis-texte{font-size:14.8px;line-height:1.72;flex:1}
.avis-auteur{font-size:13.5px;font-weight:700;margin-top:20px;padding-top:15px;border-top:1px solid var(--ligne)}
.sombre .avis-auteur{border-color:rgba(255,255,255,.15)}
.avis-source{font-size:11.5px;font-weight:400;opacity:.6;display:block;margin-top:4px}
/* Mur d'avis (addendum 27/08/2026) : les pages "tous les avis" affichent 43
   temoignages Google de 2 a 25 lignes. En grille, une seule rangee suffit a
   creuser 500 px de blanc. Mise en colonnes : chaque carte prend sa hauteur
   reelle et les colonnes se remplissent au fil de l'eau. */
.avis-mur{display:block;column-count:3;column-gap:14px}
.avis-mur .avis{break-inside:avoid;-webkit-column-break-inside:avoid;margin:0 0 14px}

/* ============ ACTUALITES / QUESTIONS (cartes) ============ */
.cartes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:var(--max);margin:0 auto}
.carte{border:1px solid var(--ligne);border-radius:14px;overflow:hidden;background:var(--blanc);display:flex;flex-direction:column;text-align:left}
.sombre .carte{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.15)}
.carte-img{aspect-ratio:16/10;overflow:hidden;background:var(--creme);position:relative}
.carte-img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.carte:hover .carte-img img{transform:scale(1.04)}
.carte-corps{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1}
.carte-corps h3{font-size:16.5px;font-weight:700;letter-spacing:-.015em;line-height:1.35;margin-bottom:10px}
.carte-corps p{font-size:14px;line-height:1.65;color:var(--texte-sec);flex:1}
.sombre .carte-corps p{color:rgba(255,255,255,.74)}
.carte-meta{font-size:11.5px;color:var(--texte-ter);margin-top:16px;letter-spacing:.02em}
.carte-lien{margin-top:16px;font-size:13.5px;font-weight:700;color:var(--rouge);display:inline-flex;align-items:center;gap:7px}
.carte-lien svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
.carte-lien:hover{gap:11px}
.carte-pays{position:absolute;top:10px;left:10px;background:var(--navy);color:#fff;font-size:11px;font-weight:700;padding:4px 9px;border-radius:5px;letter-spacing:.06em}

/* ============ QUESTION (carte texte) ============ */
.q-carte{border:1px solid var(--ligne);border-radius:14px;padding:24px 22px;background:var(--blanc);display:flex;flex-direction:column;text-align:left}
.sombre .q-carte{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.15)}
.q-meta{font-size:11.5px;font-weight:700;letter-spacing:.06em;color:var(--rouge);text-transform:uppercase;margin-bottom:12px}
.q-texte{font-size:14.8px;line-height:1.7;color:var(--texte-sec);flex:1}
.sombre .q-texte{color:rgba(255,255,255,.76)}

/* ============ ZONE D'INTERVENTION ============ */
.zones{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:var(--max);margin:0 auto}
.zone{border:1px solid rgba(255,255,255,.16);border-radius:16px;padding:clamp(24px,3vw,38px);text-align:left;background:rgba(255,255,255,.05)}
.claire .zone,.grise .zone{border-color:var(--ligne);background:var(--blanc)}
.zone h3{font-size:22px;font-weight:700;letter-spacing:-.02em;margin-bottom:6px}
.zone .zone-nb{font-size:11.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--rouge);margin-bottom:18px}
.sombre .zone .zone-nb{color:#ff8296}
.depts{display:flex;flex-wrap:wrap;gap:7px;margin:18px 0 22px}
.dept{font-size:12.5px;font-weight:600;padding:6px 11px;border-radius:100px;border:1px solid rgba(255,255,255,.24)}
.claire .dept,.grise .dept{border-color:var(--ligne)}

/* ============ GALERIE PHOTOS (page installation) ============ */
.galerie{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;max-width:var(--max);margin:0 auto}
.galerie a{display:block;border-radius:12px;overflow:hidden;aspect-ratio:3/2;background:var(--creme)}
.galerie img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.galerie a:hover img{transform:scale(1.04)}
.photo-large{max-width:var(--max);margin:0 auto;border-radius:16px;overflow:hidden;aspect-ratio:3/2;background:var(--creme)}
.photo-large img{width:100%;height:100%;object-fit:cover}

/* ============ FORMULAIRE (encart) ============ */
.form-encart{
  max-width:560px;margin:0 auto;background:var(--blanc);color:var(--texte);
  border-radius:20px;box-shadow:0 34px 74px -28px rgba(1,45,72,.6);overflow:hidden;text-align:left;
}
.form-encart-tete{background:var(--navy);color:var(--blanc);padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.form-encart-tete strong{font-size:14.5px;font-weight:700;letter-spacing:-.01em}
.form-encart-tete .gratuit{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;background:var(--rouge);padding:5px 10px;border-radius:100px;white-space:nowrap}
.form-page{background:var(--creme);padding:calc(var(--nav-h) + 54px) 20px 76px;min-height:100vh}

/* ============ DOCUMENT (mentions, textes longs) ============ */
.doc{max-width:800px;margin:0 auto;text-align:left}
.doc h2{font-size:22px;font-weight:700;letter-spacing:-.02em;margin:46px 0 13px;color:var(--navy)}
.doc h2:first-child{margin-top:0}
.doc h3{font-size:17px;font-weight:700;margin:28px 0 10px}
.doc p,.doc li{font-size:15px;line-height:1.82;color:var(--texte-sec)}
.doc p+p{margin-top:14px}
.doc ul{margin:12px 0 0 20px;list-style:disc}
.doc li{margin-bottom:8px}
.doc a{color:var(--bleu);text-decoration:underline}

/* ============ FOOTER ============ */
.footer{background:var(--navy);color:var(--blanc);padding:68px 30px 40px;font-size:13.5px}
.footer-grille{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:38px;max-width:var(--max);margin:0 auto}
.footer-logo{display:inline-block;background:#fff;border-radius:9px;padding:8px 11px;margin-bottom:18px}
.footer-logo img{height:28px;width:auto}
.footer h4{font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.55;margin-bottom:15px;font-weight:700}
.footer a{display:block;padding:6px 0;opacity:.82;transition:opacity .15s linear}
.footer a:hover{opacity:1;text-decoration:underline}
.footer p{opacity:.76;line-height:1.85}
.footer-badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.footer-badges img{height:38px;width:auto;background:#fff;border-radius:7px;padding:5px 8px}
.footer-legal{max-width:var(--max);margin:44px auto 0;padding-top:22px;border-top:1px solid rgba(255,255,255,.14);opacity:.55;line-height:1.75;font-size:12.5px}
.footer-legal a{display:inline;padding:0;text-decoration:underline}

/* ============ MOTION ============ */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.reveal.d1{transition-delay:.08s}
.reveal.d2{transition-delay:.16s}
.reveal.d3{transition-delay:.24s}
.reveal.d4{transition-delay:.32s}
.visible .reveal{opacity:1;transform:none}
.indice-scroll{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);z-index:3;
  width:34px;height:34px;display:flex;align-items:center;justify-content:center;opacity:.7;
  animation:flotte 2.6s var(--ease) infinite}
.indice-scroll::after{content:"";width:11px;height:11px;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:translateY(-3px) rotate(45deg)}
@keyframes flotte{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,7px)}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .reveal{opacity:1;transform:none}
  .indice-scroll{animation:none}
  html{scroll-behavior:auto}
}

/* ============ RESPONSIVE ============ */
@media (max-width:1080px){
  .nav-liens a{padding:9px 10px;font-size:13px}
  .nav-tel{display:none}
}
@media (max-width:1000px){
  .duo{grid-template-columns:1fr;gap:32px}
  .duo.inverse .duo-media{order:0}
  .process,.piliers{grid-template-columns:1fr 1fr}
  .avis-grille,.grille-3,.grille-real,.cartes{grid-template-columns:1fr 1fr}
  .avis-mur{column-count:2}
  .stats{grid-template-columns:1fr 1fr}
  .footer-grille{grid-template-columns:1fr 1fr;gap:30px}
}
@media (max-width:860px){
  .nav{padding:0 16px}
  .nav-liens{
    display:none;position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;
    flex-direction:column;gap:0;background:var(--blanc);color:var(--texte);
    padding:10px 14px 30px;box-shadow:0 20px 40px rgba(1,45,72,.2);overflow-y:auto;align-items:stretch;
  }
  .nav-liens.ouvert{display:flex}
  .nav-liens a{padding:15px 12px;font-size:16px;border-bottom:1px solid var(--ligne);border-radius:0}
  .nav-sous{position:static;display:block;box-shadow:none;padding:0 0 0 14px;min-width:0;border-radius:0}
  .nav-sous a{font-size:14.5px;padding:12px}
  .nav-burger{display:block}
  .nav-cta{padding:0 16px;font-size:12.5px;height:38px}
  .ecran{padding:calc(var(--nav-h) + 34px) 18px 48px}
  .entete{padding:calc(var(--nav-h) + 44px) 18px 40px;min-height:280px}
  .grille-3,.grille-real,.avis-grille,.cartes,.zones{grid-template-columns:1fr}
  .avis-mur{column-count:1}
  .process,.piliers{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .btn{min-width:0;width:100%;max-width:360px}
  .cta-rangee{flex-direction:column;align-items:center;width:100%}
  .cta-rangee.gauche{align-items:stretch}
  .bandeau-txt{text-align:center;max-width:none}
  .section{padding:58px 18px}
  .tableau{font-size:13.5px}
  .tableau th,.tableau td{padding:13px 9px}
  .footer{padding:52px 18px 34px}
  .footer-grille{grid-template-columns:1fr;gap:26px}
}
@media (max-width:430px){
  .titre-hero{font-size:clamp(31px,8.6vw,40px)}
  .titre-ecran,.titre-page{font-size:clamp(26px,7.4vw,34px)}
  .badge{height:54px;padding:9px 13px}
  .stats{grid-template-columns:1fr}
  .form-encart{border-radius:16px}
}

/* ============ HERO DUO (accroche + formulaire) ============ */
.hero-duo{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);
  gap:clamp(28px,4vw,64px);align-items:center;text-align:left;width:100%;
  max-width:1220px;margin:0 auto;
}
.hero-duo .titre-hero{margin:0;max-width:15ch}
.hero-duo .sous-titre{margin:18px 0 0;max-width:46ch}
.hero-duo .cta-rangee{justify-content:flex-start}
.hero-preuve{display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;margin-top:26px;font-size:13.5px}
.hero-preuve .item{display:flex;align-items:center;gap:8px;opacity:.9}
.hero-preuve .item svg{width:17px;height:17px;fill:none;stroke:#ff8296;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;flex:none}
.ecran.hero{justify-content:center;padding-top:calc(var(--nav-h) + 40px);padding-bottom:52px}
@media (max-width:1080px){
  .hero-duo{grid-template-columns:1fr;text-align:center;gap:34px}
  .hero-duo .titre-hero,.hero-duo .sous-titre{margin-left:auto;margin-right:auto}
  .hero-duo .cta-rangee,.hero-preuve{justify-content:center}
  .ecran.hero{min-height:0;padding-top:calc(var(--nav-h) + 44px);padding-bottom:56px}
}

/* ============ HERO SOLO (accroche + un seul bouton primaire) ============
   M22 31/07/2026. Le formulaire complet a quitte le hero : la colonne de droite
   disparait, le hero passe en une colonne centree. .hero-duo est conserve pour
   ne pas casser d'eventuelles pages qui l'utiliseraient encore. */
.hero-solo{
  width:100%;max-width:860px;margin:0 auto;text-align:center;
}
.hero-solo .titre-hero{margin:0 auto;max-width:18ch}
.hero-solo .sous-titre{margin:18px auto 0;max-width:56ch}
.hero-solo .hero-preuve{justify-content:center}
.hero-solo .cta-rangee{justify-content:center;margin-top:30px}

/* ============ EQUIPE / DIRIGEANTS ============
   Regles reprises telles quelles de la section .team des landing pages
   rexer-offre1 / rexer-offre2, avec les jetons de couleur du site
   (--cream devient --creme, --ink devient --texte, --gray devient --texte-sec,
   --line devient --ligne). */
.team-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:48px;max-width:var(--max);margin:0 auto}
.team-card{text-align:center;margin:0;width:250px;max-width:80vw}
.team-ph{aspect-ratio:1/1;border-radius:20px;overflow:hidden;background:var(--mist);
  border:1px solid var(--ligne)}
.team-ph img{width:100%;height:100%;object-fit:cover}
.team-card figcaption{margin-top:14px;font-weight:600;font-size:1.12rem;color:var(--texte)}
.team-card .role{font-size:.9rem;color:var(--texte-sec);font-weight:500}
@media (max-width:560px){.team-grid{gap:32px}}

/* ============ BARRE CTA FIXE MOBILE ============
   M22 31/07/2026. Masquee au-dessus de 860px : au-dela, le bouton CTA
   persistant de la barre de navigation suffit. .cta-mobile-espace reserve la
   hauteur de la barre pour que le pied de page ne soit jamais recouvert. */
.cta-mobile,.cta-mobile-espace{display:none}
@media (max-width:860px){
  .cta-mobile-espace{display:block;height:calc(64px + env(safe-area-inset-bottom,0px))}
  .cta-mobile{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:99;
    gap:10px;align-items:center;
    padding:10px 14px calc(10px + env(safe-area-inset-bottom,0px));
    background:rgba(255,255,255,.97);backdrop-filter:blur(14px);
    box-shadow:0 -1px 0 var(--ligne),0 -12px 28px rgba(1,45,72,.12);
  }
  .cta-mobile-tel,.cta-mobile-btn{
    display:inline-flex;align-items:center;justify-content:center;
    height:44px;border-radius:100px;font-size:14px;font-weight:700;
    white-space:nowrap;transition:background .15s linear;
  }
  .cta-mobile-tel{flex:0 1 auto;padding:0 16px;color:var(--texte);border:1.5px solid var(--ligne)}
  .cta-mobile-tel:hover{background:var(--mist)}
  .cta-mobile-btn{flex:1 1 auto;padding:0 18px;background:var(--rouge);color:var(--blanc)}
  .cta-mobile-btn:hover{background:var(--rouge-fonce)}
}
@media (max-width:360px){
  .cta-mobile-tel{padding:0 12px;font-size:13px}
  .cta-mobile-btn{padding:0 12px;font-size:13px}
}