/* ==========================================================================
   Simply Home Conciergerie
   Direction artistique dérivée du logo de la marque :
   or #A88424, anthracite #484848, noir — sur fond craie chaud.
   Typographie : Playfair Display (serif à fort contraste du logotype)
   + Montserrat (sans géométrique large du sous-titre « CONCIERGERIE »).
   ========================================================================== */

/* ---------- 1. Tokens ---------- */
:root{
  /* Palette analogue : une seule famille froide (vert → sauge) et une seule
     chaleur (le laiton du logo). C'est ce qui fait l'harmonie — deux teintes
     chaudes saturées se seraient battues entre elles. */

  /* Laiton : relevé au pixel sur le logo de la marque */
  --or:        #A88424;
  --or-fonce:  #856919;   /* variante lisible en petit corps sur fond clair */
  --or-clair:  #C9A757;
  --or-pale:   #EBDFC4;

  /* Verts : surfaces profondes et demi-teinte */
  --foret:      #22362B;
  --foret-2:    #2E4A3A;
  --foret-clair:#3A5C49;
  --sauge:      #7E9483;

  /* Neutres chauds */
  --encre:     #13201A;
  --graphite:  #3C4741;
  --gris:      #56655C;
  --craie:     #FBF9F5;
  --pierre:    #F3EDE3;
  --sable:     #E4D9C7;
  --argile:    #C9B79C;
  --ligne:     #E4D9C7;
  --ligne-fine:#EDE6DA;
  --blanc:     #FFFFFF;

  --bg:var(--craie); --bg-alt:var(--pierre); --surface:var(--blanc);
  --fg:var(--encre); --fg-doux:var(--gris); --accent:var(--or);

  --serif:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  --t--1:clamp(.78rem,.76rem + .1vw,.84rem);
  --t-0: clamp(.95rem,.92rem + .16vw,1.04rem);
  --t-1: clamp(1.12rem,1.06rem + .3vw,1.32rem);
  --t-2: clamp(1.35rem,1.22rem + .62vw,1.75rem);
  --t-3: clamp(1.62rem,1.4rem + 1.05vw,2.3rem);
  --t-4: clamp(1.95rem,1.6rem + 1.7vw,3.05rem);
  --t-5: clamp(2.3rem,1.75rem + 2.7vw,4rem);
  --t-6: clamp(2.7rem,1.85rem + 4.2vw,5.2rem);

  --page:80rem; --page-etroit:44rem;
  --marge:clamp(1.25rem,5vw,4.5rem);
  --r-s:2px; --r-m:6px; --r-l:14px; --r-pilule:999px;

  --ombre-1:0 1px 2px rgba(22,22,26,.04),0 3px 10px rgba(22,22,26,.045);
  --ombre-2:0 3px 8px rgba(22,22,26,.05),0 16px 40px rgba(22,22,26,.08);
  --ombre-3:0 10px 24px rgba(22,22,26,.08),0 40px 72px rgba(22,22,26,.11);

  --sortie:cubic-bezier(.22,1,.36,1);
  --duo:cubic-bezier(.65,0,.35,1);
  --v-court:170ms; --v:300ms; --v-long:680ms;

  --haut-entete:88px;
}

/* ---------- 2. Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--haut-entete) + 1rem)}
body{
  font-family:var(--sans);font-size:var(--t-0);line-height:1.7;font-weight:400;
  color:var(--fg);background:var(--bg);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;
}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none;padding:0}
:focus-visible{outline:2px solid var(--or-fonce);outline-offset:3px;border-radius:2px}
::selection{background:var(--or);color:#fff}
.saut{position:absolute;left:-9999px;top:0;z-index:200;background:var(--encre);color:#fff;padding:.8rem 1.3rem}
.saut:focus{left:1rem;top:1rem}
.lecteur{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- 3. Typographie ---------- */
.tt{font-family:var(--serif);font-weight:400;line-height:1.06;letter-spacing:-.018em}
.tt-1{font-size:var(--t-6)}
.tt-2{font-size:var(--t-4)}
.tt-3{font-size:var(--t-2)}
.tt em{font-style:italic;color:var(--or)}
.chapo{font-size:var(--t-1);line-height:1.62;color:var(--fg-doux);font-weight:300}
.centre{text-align:center}
p{max-width:64ch}
.centre p{margin-inline:auto}

/* Surtitre : reprend le lettrage « CONCIERGERIE » du logo */
.surtitre{
  display:flex;align-items:center;gap:.9rem;
  font-size:.68rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;
  color:var(--or-fonce);margin-bottom:1.5rem;max-width:none;
}
.surtitre--clair{color:#DCC28A}   /* or éclairci : marge de contraste sur photo */
.surtitre--centre{justify-content:center}
.surtitre i{display:block;width:2rem;height:1px;background:currentColor;opacity:.7;flex:none}

.fleche{display:inline-block;transition:transform var(--v) var(--sortie)}
a:hover .fleche{transform:translateX(5px)}

/* ---------- 4. Mise en page ---------- */
.page{width:min(100% - var(--marge) * 2,var(--page));margin-inline:auto}
.page--etroit{width:min(100% - var(--marge) * 2,var(--page-etroit))}
.bloc{padding-block:clamp(4.5rem,10vw,9.5rem)}
.bloc--alt{background:var(--bg-alt)}
.bloc--doux{background:var(--pierre)}
.bloc--doux .avis__c{border-color:var(--sable)}
.bloc--sombre{background:var(--foret);color:var(--craie)}
.entete-bloc{margin-bottom:clamp(3rem,6vw,5rem);max-width:46rem}
.entete-bloc--centre{margin-inline:auto;text-align:center}
.duo{display:grid;gap:2rem clamp(2rem,6vw,5rem);grid-template-columns:1fr}
@media(min-width:900px){.duo{grid-template-columns:1.1fr .9fr;align-items:end}}
.aparte{color:var(--fg-doux);font-weight:300}

/* ---------- 5. Boutons ---------- */
.bt{
  --f:var(--encre);--fond:transparent;--bord:transparent;
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.65rem;
  padding:1rem 1.9rem;border:1px solid var(--bord);background:var(--fond);color:var(--f);
  font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  border-radius:var(--r-s);cursor:pointer;overflow:hidden;
  transition:background-color var(--v) var(--sortie),color var(--v) var(--sortie),
             border-color var(--v) var(--sortie),transform var(--v) var(--sortie),
             box-shadow var(--v) var(--sortie);
}
.bt:hover{transform:translateY(-2px)}
.bt:active{transform:none}
.bt--or{--fond:var(--or);--f:#fff;box-shadow:0 4px 14px rgba(168,132,36,.26)}
.bt--or:hover{--fond:var(--or-fonce);box-shadow:0 10px 26px rgba(168,132,36,.34)}
.bt--encre{--fond:var(--encre);--f:var(--craie)}
.bt--encre:hover{--fond:var(--graphite)}
.bt--trait{--bord:var(--ligne);--f:var(--encre)}
.bt--trait:hover{--bord:var(--encre);--fond:var(--encre);--f:var(--craie)}
.bt--fantome{--bord:rgba(250,248,244,.5);--f:var(--craie)}
.bt--fantome:hover{--bord:var(--craie);--fond:rgba(250,248,244,.13)}
.bts{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:2.4rem}
.bts--centre{justify-content:center}

.lien{
  display:inline-flex;align-items:center;gap:.6rem;margin-top:2rem;
  font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--or-fonce);
  padding-bottom:.45rem;background-image:linear-gradient(currentColor,currentColor);
  background-size:100% 1px;background-position:0 100%;background-repeat:no-repeat;
  transition:background-size var(--v) var(--sortie),color var(--v) var(--sortie);
}
.lien:hover{color:var(--encre);background-size:30% 1px}

/* ---------- 6. En-tête (clair et plein : le logotype exige un fond blanc) ---------- */
.entete{position:fixed;inset:0 0 auto;z-index:100;background:transparent;border-bottom:1px solid transparent;
  transition:background-color 420ms var(--sortie),border-color 380ms var(--sortie),
             box-shadow 380ms var(--sortie),transform 420ms var(--sortie)}
.entete.est-fixe{background:rgba(250,247,241,.94);backdrop-filter:saturate(1.3) blur(12px);
  border-bottom-color:var(--ligne-fine);box-shadow:0 1px 20px rgba(20,32,27,.06)}
/* Deux versions du logotype : sombre sur crème, claire sur l'image */
.logo__clair{display:block}
.logo__sombre{display:none}
.entete.est-fixe .logo__clair{display:none}
.entete.est-fixe .logo__sombre{display:block}
.entete.est-cachee{transform:translateY(-101%)}
.entete__in{width:min(100% - var(--marge) * 2,var(--page));margin-inline:auto;
  min-height:var(--haut-entete);display:flex;align-items:center;gap:clamp(1rem,3vw,2.5rem)}
.logo{display:flex;align-items:center;margin-right:auto;flex:none}
.logo img{width:auto;height:clamp(46px,4.4vw,60px)}
.menu{display:none;gap:clamp(.9rem,2vw,1.8rem)}
.menu a{position:relative;font-size:.78rem;font-weight:500;letter-spacing:.06em;padding-block:.35rem;
  white-space:nowrap;color:rgba(250,247,241,.86);transition:color var(--v) var(--sortie)}
.menu a:hover,.menu a[aria-current]{color:var(--craie)}
.entete.est-fixe .menu a{color:var(--graphite)}
.entete.est-fixe .menu a:hover,.entete.est-fixe .menu a[aria-current]{color:var(--encre)}
.menu a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--or);
  transform:scaleX(0);transform-origin:right;transition:transform 320ms var(--sortie)}
.menu a:hover::after,.menu a[aria-current]::after{transform:scaleX(1);transform-origin:left}
.entete__bt{display:none;white-space:nowrap}
@media(min-width:1160px){.menu{display:flex}.entete__bt{display:inline-flex}}
.hamb{width:44px;height:44px;display:grid;place-content:center;gap:6px;margin-right:-8px}
.hamb span{display:block;width:24px;height:1.5px;background:var(--craie);transition:transform 320ms var(--sortie),opacity 200ms,background-color 420ms var(--sortie)}
.entete.est-fixe .hamb span{background:var(--encre)}
.tiroir-ouvert .hamb span{background:var(--encre)}
.hamb[aria-expanded="true"] span:first-child{transform:translateY(3.75px) rotate(45deg)}
.hamb[aria-expanded="true"] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
@media(min-width:1160px){.hamb{display:none}}

.tiroir{position:fixed;inset:var(--haut-entete) 0 0;z-index:99;background:var(--craie);
  padding:2.5rem var(--marge) 3rem;overflow-y:auto;opacity:0;transform:translateY(-8px);
  transition:opacity 280ms var(--sortie),transform 280ms var(--sortie)}
.tiroir.est-ouvert{opacity:1;transform:none}
.tiroir__menu{display:grid}
.tiroir__menu a{font-family:var(--serif);font-size:var(--t-2);padding:.7rem 0;
  border-bottom:1px solid var(--ligne-fine);opacity:0;transform:translateY(14px)}
.tiroir.est-ouvert .tiroir__menu a{animation:tiroirIn 440ms var(--sortie) forwards;animation-delay:calc(var(--i,0) * 45ms + 60ms)}
@keyframes tiroirIn{to{opacity:1;transform:none}}
.tiroir__pied{margin-top:2.5rem;display:grid;gap:.5rem;color:var(--fg-doux);font-size:.95rem}

/* ---------- 7. Hero en diptyque asymétrique ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;isolation:isolate}
.hero__fond{position:absolute;inset:0;z-index:-1}
.hero__fond img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);
  animation:heroZoom 2400ms var(--sortie) 100ms forwards;will-change:transform}
@keyframes heroZoom{to{transform:scale(1)}}
/* Voile teinté forêt : la couleur imprègne la photo au lieu d'un simple noir */
.hero__voile{position:absolute;inset:0;
  background:
    /* voile de base : garantit la lisibilité quelle que soit la photo */
    linear-gradient(rgba(10,14,12,.34),rgba(10,14,12,.34)),
    /* dégradé latéral : le texte est à gauche, l'image respire à droite */
    linear-gradient(100deg,rgba(10,14,12,.88) 0%,rgba(10,14,12,.7) 38%,rgba(10,14,12,.3) 70%,rgba(10,14,12,.5) 100%),
    linear-gradient(to bottom,rgba(10,14,12,.55) 0%,transparent 24%,transparent 64%,rgba(10,14,12,.6) 100%)}
.hero__texte{position:relative;color:var(--craie);
  padding-block:calc(var(--haut-entete) + clamp(2.5rem,6vw,4.5rem)) clamp(3rem,7vw,5rem)}
/* Hero en deux colonnes : discours à gauche, formulaire à droite */
.hero--capte{min-height:auto}
.hero--capte .hero__texte{display:grid;gap:clamp(2.5rem,5vw,4rem);grid-template-columns:1fr;align-items:center}
@media(min-width:1040px){
  .hero--capte .hero__texte{grid-template-columns:1.06fr .94fr;gap:clamp(3rem,5vw,5rem)}
  .hero--capte{min-height:100svh}
}
.hero__col{min-width:0}
.hero--capte .hero__t{font-size:var(--t-5)}
.hero--capte .hero__chapo{max-width:42ch;font-size:var(--t-0);line-height:1.65}
.hero--capte .hero__chiffres{grid-template-columns:repeat(2,1fr);gap:1.25rem;margin-top:2rem;padding-top:1.6rem}
@media(min-width:520px){.hero--capte .hero__chiffres{grid-template-columns:repeat(4,1fr)}}
.hero--capte .hero__chiffres dt{font-size:var(--t-2)}
.hero__lien{display:inline-flex;align-items:center;gap:.55rem;margin-top:1.8rem;
  font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--or-clair);
  padding-bottom:.4rem;background-image:linear-gradient(currentColor,currentColor);
  background-size:100% 1px;background-position:0 100%;background-repeat:no-repeat;
  transition:background-size var(--v) var(--sortie),color var(--v) var(--sortie)}
.hero__lien:hover{color:var(--craie);background-size:30% 1px}

.hero__t{margin-bottom:1.8rem;max-width:15ch;text-wrap:balance}
.hero__t .l{display:block;overflow:hidden;padding-bottom:.08em}
.hero__t .l > span{display:block;transform:translateY(108%);opacity:0}
.est-prete .hero__t .l > span{animation:monte 1000ms var(--sortie) forwards}
.est-prete .hero__t .l:nth-child(1) > span{animation-delay:140ms}
.est-prete .hero__t .l:nth-child(2) > span{animation-delay:250ms}
.est-prete .hero__t .l:nth-child(3) > span{animation-delay:360ms}
@keyframes monte{to{transform:none;opacity:1}}
.hero__chapo{max-width:46ch;color:rgba(250,247,241,.87)}
/* Chiffres intégrés au hero, sur un filet clair */
.hero__chiffres{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6rem 1.25rem;
  margin-top:clamp(2.5rem,5vw,3.5rem);padding-top:clamp(1.6rem,3.5vw,2.4rem);
  border-top:1px solid rgba(250,247,241,.24);max-width:48rem}
@media(min-width:760px){.hero__chiffres{grid-template-columns:repeat(4,1fr)}}
.hero__chiffres dt{font-family:var(--serif);font-size:var(--t-3);line-height:1;font-variant-numeric:tabular-nums}
.hero__chiffres dd{font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;
  color:rgba(250,247,241,.66);margin-top:.6rem;line-height:1.45;font-weight:500}
.hero__fleche{position:absolute;left:50%;bottom:1.6rem;translate:-50% 0;width:1px;height:44px;
  background:rgba(250,247,241,.24);overflow:hidden}
.hero__fleche span{display:block;width:100%;height:40%;background:var(--or-clair);
  animation:goutte 2.4s var(--duo) infinite}
@keyframes goutte{0%{transform:translateY(-100%)}60%,100%{transform:translateY(250%)}}

/* Chiffres sous le hero */
.chiffres{border-top:1px solid var(--ligne-fine);background:var(--craie)}
.chiffres__l{display:grid;grid-template-columns:repeat(2,1fr)}
@media(min-width:820px){.chiffres__l{grid-template-columns:repeat(4,1fr)}}
.chiffre{padding:clamp(1.75rem,4vw,2.6rem) clamp(1rem,2.5vw,2rem);border-right:1px solid var(--ligne-fine);border-bottom:1px solid var(--ligne-fine)}
@media(min-width:820px){.chiffre{border-bottom:0}.chiffre:last-child{border-right:0}}
@media(max-width:819px){.chiffre:nth-child(2n){border-right:0}}
.chiffre dt{font-family:var(--serif);font-size:var(--t-3);line-height:1;font-variant-numeric:tabular-nums}
.chiffre dd{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-doux);margin-top:.7rem;line-height:1.45;font-weight:500}

/* ---------- 8. Bandeau presse ---------- */
.presse{background:var(--foret);color:var(--craie);padding-block:clamp(2.5rem,5vw,3.5rem)}
.presse__in{display:grid;gap:1.5rem clamp(2rem,5vw,4rem);align-items:center;grid-template-columns:1fr;text-align:center}
@media(min-width:800px){.presse__in{grid-template-columns:auto 1fr;text-align:left}}
.presse__logo{height:34px;width:auto;filter:invert(1) brightness(1.6);opacity:.92;margin-inline:auto}
.presse__cit{font-family:var(--serif);font-size:var(--t-2);font-style:italic;line-height:1.3;max-width:none}

/* ---------- 8 bis. Bandeau défilant ---------- */
.bandeau{background:var(--craie);border-block:1px solid var(--ligne-fine);
  padding-block:1.15rem;overflow:hidden;
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.bandeau__piste{display:flex;width:max-content;animation:glisse 48s linear infinite}
.bandeau:hover .bandeau__piste{animation-play-state:paused}
.bandeau__g{display:flex;align-items:center}
.bandeau__g li{display:flex;align-items:center;white-space:nowrap;padding-inline:1.8rem;
  font-size:.68rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gris)}
.bandeau__g li::after{content:"";width:4px;height:4px;border-radius:50%;background:var(--argile);margin-left:1.8rem}
@keyframes glisse{to{transform:translateX(-50%)}}

/* ---------- 8 ter. Services en cartes ---------- */
.cartes{display:grid;gap:1.15rem;grid-template-columns:1fr}
@media(min-width:640px){.cartes{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.cartes{grid-template-columns:repeat(3,1fr)}}
.carte{position:relative;background:var(--surface);border:1px solid var(--ligne-fine);
  border-radius:var(--r-l);padding:clamp(1.6rem,3vw,2.1rem);overflow:hidden;
  transition:transform 420ms var(--sortie),box-shadow 420ms var(--sortie),border-color 420ms var(--sortie)}
.carte::after{content:"";position:absolute;left:0;top:0;width:100%;height:2px;background:var(--or);
  transform:scaleX(0);transform-origin:left;transition:transform 520ms var(--sortie)}
.carte:hover{transform:translateY(-6px);box-shadow:var(--ombre-3);border-color:var(--sable)}
.carte:hover::after{transform:scaleX(1)}
.carte__ico{display:grid;place-content:center;width:2.9rem;height:2.9rem;border-radius:var(--r-m);
  background:var(--pierre);color:var(--or-fonce);margin-bottom:1.35rem;
  transition:background-color 420ms var(--sortie),transform 520ms var(--sortie)}
.carte:hover .carte__ico{background:var(--sable);transform:rotate(-6deg) scale(1.06)}
.carte__ico svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.carte h3{font-family:var(--serif);font-size:var(--t-1);font-weight:500;line-height:1.2;
  margin-bottom:.7rem;letter-spacing:-.01em}
.carte p{font-size:.94rem;color:var(--fg-doux);font-weight:300}

/* ---------- 9. Services en liste éditoriale numérotée ---------- */
.offres{border-top:1px solid var(--ligne)}
.offre{display:grid;grid-template-columns:1fr;gap:.6rem 2.5rem;padding-block:clamp(2rem,4vw,3rem);
  border-bottom:1px solid var(--ligne);transition:background-color 420ms var(--sortie),padding-inline 420ms var(--sortie)}
@media(min-width:860px){
  .offre{grid-template-columns:5.5rem 17rem 1fr;gap:3rem;align-items:baseline}
  .offre:hover{background:rgba(226,220,209,.3);padding-inline:1.25rem}
}
.offre__n{font-family:var(--serif);font-size:var(--t-1);color:var(--or-fonce);line-height:1}
.offre__t{font-family:var(--serif);font-size:var(--t-2);font-weight:400;line-height:1.15;letter-spacing:-.012em}
.offre__d{color:var(--fg-doux);font-weight:300;max-width:56ch}

/* ---------- 10. Étapes verticales ---------- */
.etapes{position:relative;padding-left:2.75rem}
.etapes::before{content:"";position:absolute;left:7px;top:.6rem;bottom:.6rem;width:1px;background:var(--ligne)}
.etapes::after{content:"";position:absolute;left:7px;top:.6rem;width:1px;background:var(--or);
  height:calc((100% - 1.2rem) * var(--avance,0));transition:height 140ms linear}
.etape{position:relative;padding-bottom:clamp(2rem,4vw,3rem)}
.etape:last-child{padding-bottom:0}
.etape::before{content:"";position:absolute;left:-2.75rem;top:.55rem;width:15px;height:15px;border-radius:50%;
  background:var(--craie);border:1px solid var(--ligne);transition:background-color 420ms var(--sortie),border-color 420ms var(--sortie),transform 420ms var(--sortie)}
.etape.est-vue::before{background:var(--or);border-color:var(--or);transform:scale(1.14)}
.bloc--alt .etape::before{background:var(--pierre)}
.bloc--alt .etape.est-vue::before{background:var(--or)}
.etape__n{font-size:.68rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--or-fonce)}
.etape__t{font-family:var(--serif);font-size:var(--t-2);font-weight:400;line-height:1.18;margin:.5rem 0 .6rem}
.etape__d{color:var(--fg-doux);font-weight:300;max-width:56ch}

/* ---------- 11. Équipe ---------- */
.equipe{display:grid;gap:1.5rem;grid-template-columns:1fr}
@media(min-width:640px){.equipe{grid-template-columns:repeat(3,1fr)}}
.membre figure{position:relative;overflow:hidden;border-radius:var(--r-m);aspect-ratio:3/4;background:var(--pierre)}
.membre img{width:100%;height:100%;object-fit:cover;transition:transform 900ms var(--sortie);filter:grayscale(.18)}
.membre:hover img{transform:scale(1.05);filter:grayscale(0)}
.membre__n{font-family:var(--serif);font-size:var(--t-1);margin-top:1.15rem}
.membre__r{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--or-fonce);margin-top:.4rem;font-weight:600}

/* Photo d'équipe : vue d'ensemble avant les portraits individuels */
.equipe__photo{margin:0 0 clamp(1.75rem,3.5vw,2.5rem);border-radius:var(--r-l);overflow:hidden;
  background:var(--pierre)}
.equipe__photo img{width:100%;height:auto;display:block;aspect-ratio:3/2;object-fit:cover}
.equipe__photo figcaption{padding:1rem 1.25rem 0;font-size:.86rem;color:var(--fg-doux);font-weight:300}

/* ---------- 12. Communes ---------- */
.comms{display:grid;gap:1.25rem;grid-template-columns:1fr}
@media(min-width:620px){.comms{grid-template-columns:repeat(2,1fr)}}
.comm{position:relative;display:block;overflow:hidden;border-radius:var(--r-m);aspect-ratio:16/10;isolation:isolate;
  transition:transform 520ms var(--sortie),box-shadow 520ms var(--sortie)}
.comm:hover{transform:translateY(-5px);box-shadow:var(--ombre-3)}
.comm img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform 900ms var(--sortie)}
.comm:hover img{transform:scale(1.06)}
.comm::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(to top,rgba(22,22,26,.9),rgba(22,22,26,.4) 46%,rgba(22,22,26,.06))}
.comm__c{position:absolute;inset:auto 0 0;padding:1.6rem 1.5rem;color:var(--craie)}
.comm__t{display:block;font-family:var(--serif);font-size:clamp(1.25rem,1.05rem + .8vw,1.65rem);line-height:1.14;letter-spacing:-.015em;overflow-wrap:break-word;hyphens:auto}
.comm__d{display:block;font-size:.88rem;color:rgba(251,249,245,.82);font-weight:300;margin-top:.55rem;line-height:1.5;max-width:42ch}
.comm__l{display:inline-flex;align-items:center;gap:.5rem;margin-top:1rem;font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--or-clair)}

/* ---------- 13. Avis ---------- */
.avis{display:grid;gap:1.25rem;grid-template-columns:1fr}
@media(min-width:900px){.avis{grid-template-columns:repeat(2,1fr)}}
.avis__c{background:var(--surface);border:1px solid var(--ligne-fine);border-radius:var(--r-m);
  padding:clamp(1.75rem,3.5vw,2.4rem);display:flex;flex-direction:column;
  transition:transform 420ms var(--sortie),box-shadow 420ms var(--sortie)}
.avis__c:hover{transform:translateY(-4px);box-shadow:var(--ombre-2)}
.etoiles{color:var(--or);letter-spacing:.3em;font-size:.8rem}
.avis__c blockquote{font-family:var(--serif);font-size:var(--t-1);line-height:1.5;margin:1.2rem 0 auto;max-width:none}
.avis__c footer{margin-top:1.8rem;padding-top:1.2rem;border-top:1px solid var(--ligne-fine);font-size:.82rem}
.avis__c footer strong{display:block;font-weight:600}
.avis__c footer span{color:var(--fg-doux)}

/* ---------- 14. FAQ ---------- */
.faq{border-top:1px solid var(--ligne)}
.faq__i{border-bottom:1px solid var(--ligne)}
.faq__i summary{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  padding-block:1.6rem;cursor:pointer;list-style:none;
  font-family:var(--serif);font-size:var(--t-1);line-height:1.3;transition:color var(--v) var(--sortie)}
.faq__i summary::-webkit-details-marker{display:none}
.faq__i summary:hover{color:var(--or-fonce)}
.faq__p-ico{position:relative;flex:none;width:18px;height:18px}
.faq__p-ico::before,.faq__p-ico::after{content:"";position:absolute;left:50%;top:50%;background:var(--or);
  translate:-50% -50%;transition:transform 360ms var(--sortie),opacity 260ms var(--sortie)}
.faq__p-ico::before{width:15px;height:1.5px}
.faq__p-ico::after{width:1.5px;height:15px}
.faq__i[open] .faq__p-ico::after{transform:rotate(90deg);opacity:0}
.faq__r{overflow:hidden}
.faq__r p{padding-bottom:1.7rem;color:var(--fg-doux);font-weight:300}

/* ---------- 15. Appel final ---------- */
.final{position:relative;padding-block:clamp(5rem,11vw,9rem);overflow:hidden;isolation:isolate;text-align:center}
.final__media{position:absolute;inset:0;z-index:-1}
.final__media img{width:100%;height:124%;object-fit:cover;object-position:center 32%;
  transform:translate3d(0,var(--py,0px),0);will-change:transform}
.final__voile{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(10,14,12,.78),rgba(10,14,12,.86))}
.final__in{position:relative;max-width:42rem}

/* ---------- 16. Pied de page ---------- */
.pied{background:var(--foret);color:rgba(250,247,241,.74);padding-block:clamp(3.5rem,8vw,5.5rem) 0;font-size:.9rem}
.pied__g{display:grid;gap:2.75rem clamp(1.5rem,4vw,3rem);grid-template-columns:1fr}
@media(min-width:640px){.pied__g{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.pied__g{grid-template-columns:1.5fr 1fr 1fr 1fr}}
.pied__logo{height:68px;width:auto;opacity:.95;margin-bottom:1.4rem}
.pied__m p{max-width:34ch;font-weight:300;line-height:1.65}
.pied__c{display:flex;flex-direction:column;gap:.6rem;align-items:flex-start}
.pied__c h3{font-size:.66rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--or-clair);margin-bottom:.6rem}
.pied__c a{background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;
  background-position:0 100%;background-repeat:no-repeat;
  transition:color var(--v) var(--sortie),background-size var(--v) var(--sortie)}
.pied__c a:hover{color:var(--craie);background-size:100% 1px}
.pied__adr{margin-top:.5rem;font-weight:300;line-height:1.65;color:rgba(250,248,244,.55)}
.pied__bas{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;justify-content:space-between;
  margin-top:clamp(3rem,6vw,4.5rem);padding-block:1.8rem;
  border-top:1px solid rgba(250,248,244,.13);font-size:.78rem;color:rgba(250,248,244,.5)}
.pied__bas a:hover{color:var(--craie)}

/* ---------- 17. Barre mobile ---------- */
.barre{position:fixed;inset:auto 0 0;z-index:90;display:grid;grid-template-columns:1fr 1fr;gap:.6rem;
  padding:.7rem var(--marge) calc(.7rem + env(safe-area-inset-bottom));
  background:rgba(250,248,244,.95);backdrop-filter:blur(12px);border-top:1px solid var(--ligne-fine);
  transform:translateY(110%);transition:transform 420ms var(--sortie)}
.barre.est-on{transform:none}
.barre a{display:grid;place-content:center;padding:.85rem;border-radius:var(--r-s);border:1px solid var(--ligne);
  font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.barre a.p{background:var(--or);border-color:var(--or);color:#fff}
@media(min-width:1160px){.barre{display:none}}
@media(max-width:1159px){.pied__bas{padding-bottom:5.5rem}}

/* ---------- 17 bis. Hero de page intérieure ---------- */
.phero{position:relative;display:flex;align-items:flex-end;min-height:min(62svh,600px);overflow:hidden;isolation:isolate}
.phero__fond{position:absolute;inset:0;z-index:-1}
.phero__fond img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);
  animation:heroZoom 2200ms var(--sortie) 100ms forwards}
.phero__voile{position:absolute;inset:0;
  background:
    linear-gradient(rgba(10,14,12,.36),rgba(10,14,12,.36)),
    linear-gradient(100deg,rgba(10,14,12,.88) 0%,rgba(10,14,12,.66) 42%,rgba(10,14,12,.3) 100%),
    linear-gradient(to bottom,rgba(10,14,12,.55),transparent 32%)}
.phero__in{position:relative;color:var(--craie);
  padding-block:calc(var(--haut-entete) + 3rem) clamp(3rem,7vw,4.5rem)}
.phero__t{font-family:var(--serif);font-weight:400;font-size:var(--t-5);line-height:1.05;
  letter-spacing:-.022em;max-width:16ch;margin-bottom:1.5rem}
.phero__t .l{display:block;overflow:hidden;padding-bottom:.08em}
.phero__t .l > span{display:block;transform:translateY(108%);opacity:0}
.phero__t em{font-style:italic;color:var(--or-clair)}
.est-prete .phero__t .l > span{animation:monte 980ms var(--sortie) forwards}
.est-prete .phero__t .l:nth-child(1) > span{animation-delay:140ms}
.est-prete .phero__t .l:nth-child(2) > span{animation-delay:250ms}
.est-prete .phero__t .l:nth-child(3) > span{animation-delay:360ms}
.phero__chapo{max-width:48ch;color:rgba(251,249,245,.87);font-weight:300;font-size:var(--t-1);line-height:1.6}
.fil{display:flex;flex-wrap:wrap;gap:.5rem;font-size:.78rem;color:rgba(251,249,245,.62);margin-bottom:1.5rem}
.fil li:not(:last-child)::after{content:"/";margin-left:.5rem;opacity:.55}
.fil a:hover{color:var(--craie);text-decoration:underline;text-underline-offset:3px}

/* ---------- 17 ter. Simulateur ---------- */
.simu{display:grid;gap:1.25rem;grid-template-columns:1fr;align-items:start}
@media(min-width:1020px){.simu{grid-template-columns:1fr 1.04fr;gap:1.5rem}}

.pan{background:var(--surface);border:1px solid var(--ligne-fine);border-radius:var(--r-l);
  padding:clamp(1.5rem,3.5vw,2.4rem);box-shadow:var(--ombre-1)}
.pan__t{font-family:var(--serif);font-size:var(--t-2);font-weight:400;line-height:1.15}
.pan__s{font-size:.88rem;color:var(--fg-doux);margin-top:.5rem}

.champ{border:0;padding:0;margin:2rem 0 0;min-width:0}
.champ > legend{font-size:.88rem;font-weight:600;margin-bottom:.9rem;padding:0}
.champ__aide{font-size:.8rem;color:var(--fg-doux);margin-top:.75rem;font-weight:300;max-width:none}

.puces{display:flex;flex-wrap:wrap;gap:.55rem}
.puce{position:relative}
.puce input{position:absolute;opacity:0;width:0;height:0}
.puce span{display:block;padding:.62rem 1.15rem;border-radius:var(--r-pilule);border:1px solid var(--ligne);
  background:var(--craie);font-size:.88rem;cursor:pointer;
  transition:background-color var(--v) var(--sortie),color var(--v) var(--sortie),
             border-color var(--v) var(--sortie),transform var(--v) var(--sortie)}
.puce span:hover{border-color:var(--argile);transform:translateY(-1px)}
.puce input:checked + span{background:var(--foret);border-color:var(--foret);color:var(--craie)}
.puce input:focus-visible + span{outline:2px solid var(--or-fonce);outline-offset:3px}

.curseurRang{display:flex;align-items:center;gap:1.25rem}
.curseur{-webkit-appearance:none;appearance:none;flex:1;height:22px;background:transparent;cursor:pointer;min-width:0}
.curseur::-webkit-slider-runnable-track{height:3px;border-radius:3px;
  background:linear-gradient(to right,var(--or) 0 var(--rempli,50%),var(--sable) var(--rempli,50%) 100%)}
.curseur::-moz-range-track{height:3px;border-radius:3px;background:var(--sable)}
.curseur::-moz-range-progress{height:3px;border-radius:3px;background:var(--or)}
.curseur::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;
  background:var(--foret);border:3px solid var(--craie);box-shadow:var(--ombre-1);margin-top:-8.5px;
  transition:transform var(--v) var(--sortie)}
.curseur::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--foret);border:3px solid var(--craie)}
.curseur:hover::-webkit-slider-thumb{transform:scale(1.14)}
.curseurVal{font-family:var(--serif);font-size:var(--t-2);min-width:2ch;text-align:right;line-height:1}

.res{background:var(--foret);color:var(--craie);border-radius:var(--r-l);
  padding:clamp(1.5rem,3.5vw,2.4rem);position:relative;overflow:hidden}
.res::before{content:"";position:absolute;right:-30%;top:-25%;width:34rem;height:34rem;
  background:radial-gradient(circle,rgba(126,148,131,.22),transparent 62%);pointer-events:none}
.res > *{position:relative}
.res__gros{font-family:var(--serif);font-size:var(--t-6);font-weight:400;line-height:1;
  letter-spacing:-.02em;margin:.35rem 0 .9rem;font-variant-numeric:tabular-nums}
.res__note{font-size:.86rem;color:rgba(251,249,245,.72);font-weight:300;line-height:1.55;max-width:44ch}
.res__lignes{margin-top:1.9rem;border-top:1px solid rgba(251,249,245,.16)}
.res__l{display:flex;align-items:baseline;justify-content:space-between;gap:1.25rem;
  padding-block:.85rem;border-bottom:1px solid rgba(251,249,245,.12);font-size:.9rem}
.res__l dt{color:rgba(251,249,245,.74);font-weight:300}
.res__l dd{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.res__l--tot dd{font-family:var(--serif);font-size:var(--t-1);font-weight:400}
/* Ligne informative : ce montant n'est pas déduit du net. */
.res__l--info dt em{display:block;font-style:normal;font-size:.76rem;color:rgba(251,249,245,.5);margin-top:.15rem}
.res__l--info dd{font-weight:400;color:rgba(251,249,245,.8)}
.res__l--info2 dt em{display:block;font-style:normal;font-size:.74rem;color:rgba(251,249,245,.48);margin-top:.15rem}

.comp{margin-top:2rem}
.comp__t{font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--or-clair);margin-bottom:1.15rem}
.comp__r + .comp__r{margin-top:1.1rem}
.comp__h{display:flex;justify-content:space-between;gap:1rem;font-size:.88rem;margin-bottom:.5rem}
.comp__h b{font-weight:600;font-variant-numeric:tabular-nums}
.comp__b{height:6px;border-radius:3px;background:rgba(251,249,245,.14);overflow:hidden}
.comp__f{display:block;height:100%;border-radius:3px;background:var(--or-clair);width:0;
  transition:width 700ms var(--sortie)}
.comp__f--b{background:var(--sauge)}
.comp__d{margin-top:1.4rem;font-size:.93rem;color:rgba(251,249,245,.84);font-weight:300}
.comp__d b{font-family:var(--serif);font-size:var(--t-1);font-weight:400;color:var(--craie);font-variant-numeric:tabular-nums}
.avert{margin-top:1.9rem;padding-left:1.1rem;border-left:2px solid rgba(201,183,156,.55);
  font-size:.83rem;color:rgba(251,249,245,.68);font-weight:300;line-height:1.6;max-width:none}
.res .bt{margin-top:1.9rem;width:100%}

/* ---------- 17 quater. Formulaire ---------- */
.form{display:grid;gap:1.15rem}
.f{display:grid;gap:.45rem}
.f > label{font-size:.85rem;font-weight:600}
.oblig{color:#A33A2B}
.f input,.f select,.f textarea{width:100%;font:inherit;font-size:.94rem;color:var(--fg);
  padding:.8rem .95rem;border:1px solid var(--ligne);border-radius:var(--r-m);background:var(--craie);
  transition:border-color var(--v) var(--sortie),box-shadow var(--v) var(--sortie),background-color var(--v) var(--sortie)}
.f textarea{min-height:7.5rem;resize:vertical}
.f select{appearance:none;cursor:pointer;padding-right:2.5rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%2356655C' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1rem center;background-size:12px}
.f input:hover,.f select:hover,.f textarea:hover{border-color:var(--argile)}
.f input:focus,.f select:focus,.f textarea:focus{outline:0;border-color:var(--foret);background:var(--surface);
  box-shadow:0 0 0 3px rgba(46,74,58,.13)}
.f__aide{font-size:.79rem;color:var(--fg-doux);font-weight:300;max-width:none}
.f__err{font-size:.79rem;color:#A33A2B;display:none}
.f.est-ko input,.f.est-ko select{border-color:#A33A2B}
.f.est-ko .f__err{display:block}
.piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form .bt{width:100%;margin-top:.35rem}
.form__legal{font-size:.79rem;color:var(--fg-doux);font-weight:300;max-width:none}
.form__legal a{text-decoration:underline;text-underline-offset:3px}
.form__ok{display:none;padding:1.1rem 1.25rem;border-radius:var(--r-m);
  background:rgba(47,107,74,.09);border:1px solid rgba(47,107,74,.28);color:#2F6B4A;font-size:.91rem}
.form.est-envoye .form__ok{display:block}

/* ---------- 17 quinquies. Cartes numérotées ---------- */
.nums{display:grid;gap:1.15rem;grid-template-columns:1fr}
@media(min-width:760px){.nums{grid-template-columns:repeat(3,1fr)}}
.num{background:var(--surface);border:1px solid var(--ligne-fine);border-radius:var(--r-l);
  padding:clamp(1.5rem,3vw,2rem);transition:transform 420ms var(--sortie),box-shadow 420ms var(--sortie)}
.num:hover{transform:translateY(-4px);box-shadow:var(--ombre-2)}
.num__n{display:block;font-family:var(--serif);font-size:.95rem;color:var(--argile);
  letter-spacing:.06em;margin-bottom:1.15rem}
.num h3{font-family:var(--serif);font-size:var(--t-1);font-weight:500;line-height:1.2;margin-bottom:.65rem}
.num p{font-size:.93rem;color:var(--fg-doux);font-weight:300}
.encart{margin-top:clamp(2rem,4vw,3rem);padding:1.35rem 0 1.35rem 1.35rem;border-left:2px solid var(--argile);
  color:var(--fg-doux);font-weight:300;font-size:.94rem;line-height:1.65;max-width:none}

.deux{display:grid;gap:clamp(2.5rem,6vw,4rem);grid-template-columns:1fr;align-items:start}
@media(min-width:980px){.deux{grid-template-columns:1fr 1fr}}
.deux > div > p + p{margin-top:1.15rem}

/* ---------- 17 sexies. Repères locaux ---------- */
.faits{display:grid;gap:0;border-top:1px solid var(--ligne)}
.faits li{position:relative;padding:.95rem 0 .95rem 2.1rem;border-bottom:1px solid var(--ligne-fine);
  font-size:.96rem;font-weight:400}
.faits li::before{content:"";position:absolute;left:0;top:1.42em;width:.8rem;height:.44rem;
  border-left:1.5px solid var(--or);border-bottom:1.5px solid var(--or);
  transform:rotate(-45deg);transform-origin:center}

/* ---------- 17 septies. Blog ---------- */
.arts{display:grid;gap:1.25rem;grid-template-columns:1fr}
@media(min-width:700px){.arts{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1080px){.arts{grid-template-columns:repeat(3,1fr)}}
.art{display:flex;flex-direction:column;height:100%;background:var(--surface);
  border:1px solid var(--ligne-fine);border-radius:var(--r-l);padding:clamp(1.5rem,3vw,2rem);
  transition:transform 420ms var(--sortie),box-shadow 420ms var(--sortie),border-color 420ms var(--sortie)}
.art:hover{transform:translateY(-5px);box-shadow:var(--ombre-2);border-color:var(--sable)}
.art__meta{font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--or-fonce);margin-bottom:1rem}
.art__t{font-family:var(--serif);font-size:var(--t-1);font-weight:500;line-height:1.24;
  letter-spacing:-.01em;margin-bottom:.75rem}
.art__x{font-size:.92rem;color:var(--fg-doux);font-weight:300;margin-bottom:1.5rem}
.art__l{margin-top:auto;font-size:.68rem;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--or-fonce);display:inline-flex;align-items:center;gap:.5rem}

.prose{max-width:44rem}
.prose > *{max-width:none}
.prose p{font-size:1.02rem;line-height:1.78;color:var(--graphite);margin-bottom:1.35rem}
.prose h2{font-family:var(--serif);font-size:var(--t-2);font-weight:500;line-height:1.22;
  letter-spacing:-.012em;color:var(--fg);margin:2.75rem 0 1rem}
.prose h3{font-family:var(--serif);font-size:var(--t-1);font-weight:500;line-height:1.28;
  color:var(--fg);margin:2rem 0 .8rem}
.prose ul,.prose ol{margin:0 0 1.35rem;padding-left:0}
.prose li{position:relative;padding-left:1.75rem;margin-bottom:.6rem;line-height:1.7;color:var(--graphite)}
.prose ul > li::before{content:"";position:absolute;left:.15rem;top:.72em;width:5px;height:5px;
  border-radius:50%;background:var(--or)}
.prose ol{counter-reset:n}
.prose ol > li{counter-increment:n}
.prose ol > li::before{content:counter(n,decimal-leading-zero);position:absolute;left:0;top:.05em;
  font-family:var(--serif);font-size:.9rem;color:var(--or)}
.prose blockquote{margin:2rem 0;padding-left:1.4rem;border-left:2px solid var(--or);
  font-family:var(--serif);font-size:var(--t-1);font-style:italic;line-height:1.5;color:var(--fg)}
.prose strong{font-weight:600;color:var(--fg)}
.prose a{color:var(--or-fonce);text-decoration:underline;text-underline-offset:3px}
.prose table{width:100%;border-collapse:collapse;margin:0 0 1.75rem;font-size:.95rem}
.prose th,.prose td{text-align:left;padding:.75rem 1rem;border-bottom:1px solid var(--ligne-fine)}
.prose th{font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
  color:var(--or-fonce);border-bottom-color:var(--ligne)}
.prose td:last-child{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}

.postmeta{display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;align-items:center;
  font-size:.82rem;color:var(--fg-doux);margin-bottom:2.5rem;
  padding-bottom:1.5rem;border-bottom:1px solid var(--ligne-fine)}
.postmeta b{font-weight:600;color:var(--fg)}
.motscles{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:3rem;padding-top:1.75rem;
  border-top:1px solid var(--ligne-fine)}
.motscles li{font-size:.7rem;letter-spacing:.06em;color:var(--fg-doux);
  border:1px solid var(--ligne);border-radius:var(--r-pilule);padding:.3rem .8rem}
.suite{margin-top:clamp(3rem,6vw,4.5rem);padding-top:clamp(2rem,4vw,3rem);border-top:1px solid var(--ligne)}

/* ---------- 17 octies. Crédits ---------- */
.credit{padding:1.35rem 0;border-bottom:1px solid var(--ligne-fine)}
.credit h3{font-family:var(--serif);font-size:var(--t-1);font-weight:500;margin-bottom:.5rem}
.credit p{font-size:.94rem;color:var(--fg-doux);font-weight:300;line-height:1.7;max-width:none}
.credit a{color:var(--or-fonce);text-decoration:underline;text-underline-offset:3px}
.credit__x{display:inline-block;margin-top:.35rem;font-size:.86rem;color:var(--gris)}

/* ---------- 17 nonies. Bloc de conversion ---------- */
.capte{background:var(--foret);color:var(--craie);padding-block:clamp(3.5rem,8vw,6rem);
  position:relative;overflow:hidden}
.capte::before{content:"";position:absolute;left:-20%;top:-40%;width:46rem;height:46rem;
  background:radial-gradient(circle,rgba(126,148,131,.2),transparent 62%);pointer-events:none}
.capte__g{position:relative;display:grid;gap:clamp(2.5rem,5vw,4rem);grid-template-columns:1fr;align-items:center}
@media(min-width:960px){.capte__g{grid-template-columns:1fr 1fr}}
.capte__t{font-family:var(--serif);font-size:var(--t-4);font-weight:400;line-height:1.08;
  letter-spacing:-.018em;color:var(--craie)}
.capte__x{color:rgba(251,249,245,.8);font-weight:300;font-size:var(--t-1);line-height:1.6;margin-top:1.3rem}
.capte__pts{display:grid;gap:.85rem;margin-top:2rem}
.capte__pts li{position:relative;padding-left:1.9rem;color:rgba(251,249,245,.86);font-weight:300;font-size:.96rem}
.capte__pts li::before{content:"";position:absolute;left:0;top:.5em;width:.8rem;height:.45rem;
  border-left:1.5px solid var(--or-clair);border-bottom:1.5px solid var(--or-clair);transform:rotate(-45deg)}

.capte__carte{background:var(--craie);border-radius:var(--r-l);padding:clamp(1.6rem,3.5vw,2.4rem);
  box-shadow:var(--ombre-3);color:var(--fg)}
.capte__h{font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--or-fonce);margin-bottom:.5rem}
.capte__st{font-family:var(--serif);font-size:var(--t-2);font-weight:400;line-height:1.15;margin-bottom:1.6rem}
.capte__carte .form{gap:.95rem}
.capte__carte .bt{width:100%}
.capte__legal{font-size:.76rem;color:var(--fg-doux);font-weight:300;max-width:none;text-align:center;margin-top:.2rem}

/* ---------- 17 decies. Points de service, avec icône ---------- */
.pts{display:grid;gap:0;border-top:1px solid var(--ligne)}
.pts li{display:flex;align-items:flex-start;gap:1rem;padding:1rem 0;
  border-bottom:1px solid var(--ligne-fine);font-size:.97rem;line-height:1.5}
.pts__ico{flex:none;display:grid;place-content:center;width:2.35rem;height:2.35rem;
  border-radius:var(--r-m);background:var(--pierre);color:var(--or-fonce);margin-top:-.1rem;
  transition:background-color 380ms var(--sortie),color 380ms var(--sortie)}
.pts li:hover .pts__ico{background:var(--sable);color:var(--encre)}
.pts__ico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;
  stroke-linecap:round;stroke-linejoin:round}

/* ---------- 17 undecies. Services en diptyques alternés ---------- */
.serv{padding-block:clamp(2.5rem,6vw,4.5rem)}
.serv:nth-child(even){background:var(--bg-alt)}
.serv__g{display:grid;gap:clamp(2rem,5vw,4rem);grid-template-columns:1fr;align-items:center}
@media(min-width:900px){
  .serv__g{grid-template-columns:.85fr 1.15fr}
  .serv--inv .serv__img{order:2}
}
.serv__img{margin:0;border-radius:var(--r-l);overflow:hidden;background:var(--pierre)}
.serv__img img{width:100%;height:100%;display:block;aspect-ratio:4/3;object-fit:cover;
  transition:transform 900ms var(--sortie)}
.serv:hover .serv__img img{transform:scale(1.03)}
@media(min-width:900px){.serv__img img{aspect-ratio:3/4}}
.serv__txt{min-width:0}
.serv__ph{font-size:var(--t-1);line-height:1.5;color:var(--fg-doux);font-weight:300;
  margin:.9rem 0 1.75rem;max-width:38ch}
.serv .pts{border-top-color:var(--ligne-fine)}

/* ---------- 17 duodecies. Verrou de l'estimation ---------- */
.res{position:relative}
/* Tant que le verrou est actif, le détail chiffré reste illisible ET absent du DOM */
.res.est-verrouille .res__rows,
.res.est-verrouille .comp,
.res.est-verrouille .avert,
.res.est-verrouille > .bt{filter:blur(7px);opacity:.5;pointer-events:none;user-select:none}
.res.est-verrouille .res__gros{filter:blur(9px);opacity:.6;user-select:none}

/* État vierge : aucun verrou, seulement une invitation à renseigner le bien */
.res__invite{display:none;font-size:.92rem;color:var(--or-clair);font-weight:300;
  line-height:1.55;margin-bottom:.9rem;max-width:40ch}
.res.est-vierge .res__invite{display:block}
.res.est-vierge .res__note{display:none}
.res.est-vierge .res__rows,
.res.est-vierge .comp{opacity:1}
.res.est-vierge .avert,
.res.est-vierge > .bt{opacity:.55}
/* Les montants défilent : on les laisse lisibles mais on signale qu'ils bougent */
.res.est-vierge [data-sortie],
.res.est-verrouille [data-sortie]{font-variant-numeric:tabular-nums}

.verrou{position:absolute;inset:0;z-index:3;display:grid;place-items:center;
  padding:clamp(1rem,3vw,2rem);border-radius:var(--r-l);
  background:linear-gradient(rgba(20,32,27,.55),rgba(20,32,27,.82));
  backdrop-filter:blur(2px)}
.res:not(.est-verrouille) .verrou{display:none}
.verrou__c{width:min(100%,25rem);background:var(--craie);color:var(--fg);
  border-radius:var(--r-l);padding:clamp(1.5rem,3.5vw,2.1rem);box-shadow:var(--ombre-3);
  max-height:100%;overflow-y:auto}
.verrou__h{font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--or-fonce);margin-bottom:.5rem}
.verrou__t{font-family:var(--serif);font-size:var(--t-2);line-height:1.14;margin-bottom:.8rem}
.verrou__x{font-size:.9rem;color:var(--fg-doux);font-weight:300;line-height:1.55;margin-bottom:1.4rem}
.verrou__c .form{gap:.9rem}
.verrou__c .bt{width:100%}
@media(max-width:600px){
  .verrou{position:static;background:none;backdrop-filter:none;padding:0;margin-top:1.5rem}
  .verrou__c{width:100%}
  .res.est-verrouille .res__rows,.res.est-verrouille .comp,
  .res.est-verrouille .avert,.res.est-verrouille > .bt{display:none}
}

/* ---------- 18. Apparitions au défilement ---------- */
[data-ap]{opacity:0;will-change:opacity,transform}
[data-ap="f"]{transform:translateY(16px)}
[data-ap="m"]{transform:translateY(30px)}
[data-ap="s"]{opacity:1;transform:none}
[data-ap="s"] > *{opacity:0;transform:translateY(26px);will-change:opacity,transform}
[data-ap].est-la,[data-ap="s"].est-la > *{
  opacity:1;transform:none;
  transition:opacity 800ms var(--sortie),transform 800ms var(--sortie);
  transition-delay:var(--d,0ms);
}
[data-ap="s"].est-la > *{transition-delay:calc(var(--i,0) * 85ms)}
[data-ap].est-la{will-change:auto}

/* ---------- 19. Mouvement réduit ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important}
  [data-ap],[data-ap="s"] > *,.hero__t .l > span,.phero__t .l > span{opacity:1 !important;transform:none !important}
  .bandeau__piste{animation:none}
  .hero__fleche{display:none}
  .final__media img{transform:none !important;height:100%}
}
