/* ==========================================================================
   JLV Immobilier — version 2 — feuille commune (base, en-tête, pied de page, accueil)
   Les couleurs or sont mesurées sur le nouveau logo.
   Titres et textes : Montserrat (la police du logo). Le Cinzel ne sert plus que
   par touches : numéros d'étapes, citation, bandeau final et pied de page.
   ========================================================================== */
:root{
  --noir:#070707; --noir-2:#0c0c0d; --noir-3:#131314; --noir-4:#1b1b1d; --noir-5:#2a2a2d;
  --blanc:#f7f3ea; --gris:#beb8a9; --gris-2:#8f897c;
  --or-1:#fdfab3; --or-2:#fde87b; --or-3:#f7cc56; --or-4:#e8b03b; --or-5:#c37d16; --or-6:#955311;
  --ivoire:#f6f1e6; --sable:#ece3d2; --papier:#fffdf8; --encre:#15120e; --encre-2:#4a443a; --or-sombre:#8a5a06;
  --metal:linear-gradient(100deg,#c37d16 0%,#e8b03b 16%,#fde87b 34%,#fdfab3 46%,#f7cc56 58%,#e8b03b 76%,#c37d16 100%);
  --metal-sombre:linear-gradient(100deg,#8a5a06 0%,#b8821a 45%,#8a5a06 100%);
  --trait:rgba(232,176,59,.24); --trait-fort:rgba(232,176,59,.55); --trait-clair:rgba(21,18,14,.14);
  --texte:"Montserrat","Helvetica Neue",Arial,sans-serif;
  --titre:var(--texte);
  --serif:"Cinzel","Trajan Pro","Times New Roman",serif;
  --script:"Allura","Snell Roundhand",cursive;
  --marge:clamp(18px,4vw,56px); --large:1320px;
  --barre:36px; --entete:72px; --tete:calc(var(--barre) + var(--entete) + 10px);
  --doux:cubic-bezier(.2,.7,.1,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--noir);color:var(--blanc);font:400 16.5px/1.72 var(--texte);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{max-width:100%}
img{display:block;height:auto}
a{color:var(--or-3)}
p{margin:0 0 1.1em}
h1,h2,h3,h4{margin:0;font-weight:700}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--or-2);outline-offset:3px}
::selection{background:var(--or-4);color:#070707}
[hidden]{display:none!important}
.reserve{position:absolute;width:0;height:0;overflow:hidden}
.invisible{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.evitement{position:fixed;left:16px;top:-80px;z-index:200;background:var(--or-3);color:#070707;padding:12px 18px;font-weight:700;text-decoration:none}
.evitement:focus{top:16px}
.wrap{width:100%;max-width:calc(var(--large) + 2 * var(--marge));margin-inline:auto;padding-inline:var(--marge)}
.centre{text-align:center}
.ico{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* ---------- typographie ---------- */
.t1,.t2,.t3{font-family:var(--titre);font-weight:700;letter-spacing:-.028em;line-height:1.12;text-wrap:balance}
.t1{font-size:clamp(30px,3.7vw,52px);font-weight:800}
.t2{font-size:clamp(27px,3.1vw,44px)}
.t3{font-size:clamp(20px,1.9vw,26px);letter-spacing:-.018em;line-height:1.2}
.t4{font:700 13px/1.4 var(--texte);letter-spacing:.16em;text-transform:uppercase;color:var(--or-4);margin:2em 0 .7em}
.or{background:var(--metal);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:reflet 9s ease-in-out infinite alternate}
@keyframes reflet{from{background-position:0 0}to{background-position:100% 0}}
.or-sombre{color:var(--or-sombre)}
.script{font-family:var(--script);font-weight:400;text-transform:none;letter-spacing:0}
.sur{display:flex;align-items:center;gap:12px;margin:0 0 16px;font:700 11.5px/1.4 var(--texte);letter-spacing:.28em;text-transform:uppercase;color:var(--or-4)}
.sur::before{content:"";width:7px;height:7px;flex:none;background:var(--or-4);transform:rotate(45deg)}
.chapo{font-size:clamp(16.5px,1.3vw,18.5px);line-height:1.65;color:var(--gris);max-width:62ch}
.note{font-size:13px;color:var(--gris-2)}

/* ---------- boutons ---------- */
.btn{--coupe:11px;position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 28px;border:0;cursor:pointer;
  font:700 12.5px/1.1 var(--texte);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;text-align:center;color:#070707;
  clip-path:polygon(var(--coupe) 0,100% 0,100% calc(100% - var(--coupe)),calc(100% - var(--coupe)) 100%,0 100%,0 var(--coupe));
  transition:background-position .7s var(--doux),color .3s,transform .3s var(--doux)}
.btn-or{background:var(--metal);background-size:230% 100%}
.btn-or:hover{background-position:100% 0}
.btn-ligne{background:var(--or-4);color:var(--or-2)}
.btn-ligne::before{content:"";position:absolute;inset:1.5px;z-index:-1;background:#0a0a0a;transition:background .35s;
  clip-path:polygon(calc(var(--coupe) - .6px) 0,100% 0,100% calc(100% - var(--coupe) + .6px),calc(100% - var(--coupe) + .6px) 100%,0 100%,0 calc(var(--coupe) - .6px))}
.btn-ligne:hover{color:#070707}
.btn-ligne:hover::before{background:transparent}
.btn:active{transform:translateY(1px)}
.btn-petit{min-height:46px;padding:0 22px;font-size:11.5px;--coupe:9px}
.btn .ico{width:18px;height:18px}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:28px}
.lien-fleche{display:inline-flex;align-items:center;gap:10px;font:700 12px/1.3 var(--texte);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--or-3);padding-bottom:6px;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1px no-repeat}
.lien-fleche .ico{width:17px;height:17px;transition:transform .4s var(--doux)}
.lien-fleche:hover .ico,a:hover>.lien-fleche .ico,a:hover .lien-fleche .ico{transform:translateX(6px)}

/* ---------- sections sombres et claires ---------- */
.section{padding-block:clamp(68px,8.4vw,128px);position:relative}
.section-nuit{background:var(--noir-2);border-block:1px solid rgba(255,255,255,.05)}
.section-ivoire{background:var(--ivoire);color:var(--encre)}
.section-sable{background:var(--sable);color:var(--encre)}
.section-ivoire .sur,.section-sable .sur{color:var(--or-sombre)}
.section-ivoire .sur::before,.section-sable .sur::before{background:var(--or-sombre)}
.section-ivoire a:not(.btn),.section-sable a:not(.btn){color:var(--or-sombre)}
.section-ivoire .t4,.section-sable .t4{color:var(--or-sombre)}
.section-ivoire .chapo,.section-ivoire p,.section-sable .chapo,.section-sable p{color:var(--encre-2)}
.section-ivoire .or,.section-sable .or,.mot-lettre .or{background-image:var(--metal-sombre);animation:none}
.section-ivoire .btn-ligne,.section-sable .btn-ligne{background:var(--or-sombre);color:var(--or-sombre)}
.section-ivoire .btn-ligne::before{background:var(--ivoire)}
.section-sable .btn-ligne::before{background:var(--sable)}
.section-ivoire .btn-ligne:hover,.section-sable .btn-ligne:hover{color:var(--papier)}
.section-ivoire .tete-texte,.section-sable .tete-texte{color:var(--encre-2)}
.tete{margin-bottom:clamp(34px,4.6vw,64px)}
.tete-centre{text-align:center;display:grid;justify-items:center}
.tete-centre .chapo{margin:20px auto 0}
.tete-ligne{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:22px 60px}
.tete-liens{display:flex;flex-wrap:wrap;gap:16px 34px;margin:0}
.tete-texte{max-width:46ch;margin:0;color:var(--gris)}
.js .apparait{opacity:0;transform:translateY(30px);transition:opacity 1s var(--doux),transform 1s var(--doux)}
.js .apparait.vu{opacity:1;transform:none}

/* ==========================================================================
   EN-TÊTE : une barre d'infos, puis le menu dans un cadre détaché du reste
   ========================================================================== */
.entete{position:fixed;inset:0 0 auto 0;z-index:60;pointer-events:none}
/* dès qu'on fait défiler : bande noire pleine largeur, le cadre du menu s'efface */
.entete::before{content:"";position:absolute;inset:0;z-index:-1;background:#040404;border-bottom:1px solid var(--trait-fort);opacity:0;transition:opacity .3s}
.entete.compact{pointer-events:auto}
.entete.compact::before{opacity:1}
.barre{pointer-events:auto;height:var(--barre);overflow:hidden;background:#040404;border-bottom:1px solid rgba(255,255,255,.08);font-size:12.5px;transition:height .4s var(--doux),opacity .3s}
.barre-in{display:flex;align-items:center;justify-content:space-between;gap:20px;height:var(--barre)}
.barre p{margin:0}
.barre-etat,.etat{display:inline-flex;align-items:center;gap:10px;color:var(--gris)}
.barre-etat i,.etat i{width:8px;height:8px;border-radius:50%;background:var(--gris-2);flex:none}
.ouvert i{background:#62d28d;box-shadow:0 0 0 4px rgba(98,210,141,.18)}
.ferme i{background:#e0705c}
.barre-tels{display:flex;gap:26px}
.barre-tels a{color:var(--blanc);text-decoration:none;font-weight:600;letter-spacing:.04em;white-space:nowrap}
.barre-tels span{color:var(--or-4);font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:11px;margin-right:8px}
.barre-tels a:hover{color:var(--or-2)}
.entete.compact .barre{height:0;opacity:0}
.entete-in{padding-top:10px;transition:padding .4s var(--doux)}
.entete.compact .entete-in{padding-block:4px}
.entete-cadre{pointer-events:auto;position:relative;isolation:isolate;display:flex;align-items:center;justify-content:space-between;gap:20px;height:var(--entete);padding:0 12px 0 22px;transition:height .4s var(--doux)}
.entete-cadre::before,.entete-cadre::after{content:"";position:absolute;z-index:-1;clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);transition:opacity .3s}
.entete.compact .entete-cadre::before,.entete.compact .entete-cadre::after{opacity:0}
.entete-cadre::before{inset:0;background:linear-gradient(100deg,rgba(247,204,86,.9),rgba(232,176,59,.3) 28%,rgba(232,176,59,.3) 72%,rgba(247,204,86,.9))}
.entete-cadre::after{inset:1px;background:rgba(13,13,14,.96)}
.entete.compact .entete-cadre{height:62px}
.marque{display:inline-flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.marque-signe{width:46px;height:43px;display:block;transition:width .4s var(--doux),height .4s var(--doux)}
.marque-nom{display:grid;line-height:1}
.marque-nom b{font:800 28px/.86 "Montserrat",sans-serif;letter-spacing:.01em;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.marque-nom i{font:700 10.5px/1 "Montserrat",sans-serif;font-style:normal;letter-spacing:.31em;text-transform:uppercase;color:var(--blanc);margin-top:6px}
.entete.compact .marque-signe{width:40px;height:37px}
.nav ul{display:flex;gap:clamp(16px,2.2vw,36px);list-style:none;margin:0;padding:0}
.nav a{position:relative;display:block;padding:12px 0;font:600 12.5px/1 var(--texte);letter-spacing:.11em;text-transform:uppercase;text-decoration:none;color:var(--blanc);white-space:nowrap;transition:color .3s}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1.5px;background:var(--metal);transform:scaleX(0);transform-origin:0 50%;transition:transform .45s var(--doux)}
.nav a:hover,.nav a[aria-current]{color:var(--or-2)}
/* « Accueil » : une petite maison à la place du mot */
.nav ul{align-items:center}
.nav .nav-accueil{padding:9px 1px 10px}
.nav .nav-accueil .ico{display:block;width:19px;height:19px;stroke-width:1.7}
.nav a:hover::after,.nav a[aria-current]::after{transform:scaleX(1)}
.outils{display:flex;align-items:center;gap:10px;flex:none}
.outil-selection{position:relative;width:44px;height:44px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.22);border-radius:50%;color:var(--blanc);transition:border-color .3s,color .3s}
.outil-selection:hover{border-color:var(--or-4);color:var(--or-2)}
.outil-recherche{border-color:var(--or-4);color:var(--or-2)}
.outil-recherche:hover{background:var(--or-3);border-color:var(--or-3);color:#070707}
/* sept rubriques dans le menu : il se resserre sur les écrans de portable, puis laisse la place au menu déroulant sous 1220 px */
@media (max-width:1380px){.nav ul{gap:17px}.nav a{letter-spacing:.07em}.outil-estimer{padding:0 14px}}
/* sur téléphone, la recherche est dans la barre du bas et sur l'accueil : la loupe du menu laisserait trop peu de place */
@media (max-width:760px){.outil-recherche{display:none}}
.outil-selection span{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--metal);color:#070707;font:700 11px/20px var(--texte);text-align:center}
.burger{display:none;width:44px;height:44px;padding:0;border:1px solid rgba(255,255,255,.22);border-radius:50%;background:none;cursor:pointer;place-items:center;align-content:center;gap:5px}
.burger i{display:block;width:18px;height:1.5px;background:var(--blanc);transition:transform .35s var(--doux),opacity .2s}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.menu-mobile{position:fixed;inset:0;z-index:55;background:#070707;padding:calc(var(--tete) + 26px) var(--marge) 34px;display:flex;flex-direction:column;justify-content:space-between;gap:26px;overflow-y:auto;animation:fondu .35s ease}
@keyframes fondu{from{opacity:0}to{opacity:1}}
.menu-mobile ul{list-style:none;margin:0;padding:0}
.menu-mobile li{border-bottom:1px solid var(--trait)}
.menu-mobile nav a{display:block;padding:15px 0;font:700 clamp(20px,5.2vw,26px)/1.2 var(--titre);letter-spacing:-.02em;text-decoration:none;color:var(--blanc)}
.menu-mobile nav a[aria-current]{color:var(--or-3)}
.menu-mobile-bas{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.menu-mobile-bas a{display:grid;gap:4px;padding:14px;border:1px solid var(--trait);text-decoration:none;color:var(--blanc);font-weight:600}
.menu-mobile-bas span{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--or-4)}
@media (max-width:1220px){
  .nav{display:none}
  .burger{display:grid}
}
@media (max-width:760px){
  :root{--barre:0px;--entete:60px;--tete:calc(var(--entete) + 8px)}
  .barre{display:none}
  .entete-in{padding-top:8px;padding-inline:10px}
  .entete-cadre{padding:0 8px 0 14px}
  .marque-signe{width:40px;height:37px}
  .marque-nom b{font-size:24px}
  .marque-nom i{font-size:9.5px}
  .outil-estimer{display:none}
}

/* ==========================================================================
   OUVERTURE — la serrure
   ========================================================================== */
.ouverture{position:relative;height:250vh}
.ouv-scene{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--noir)}
.ouv-photos{position:absolute;inset:0;transform-origin:50% 50%}
.ouv-photos img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 36%;opacity:0;transition:opacity 1.5s ease}
.ouv-photos img.actif{opacity:1}
.ouv-voile{position:absolute;inset:0;opacity:0;background:linear-gradient(to top,rgba(7,7,7,.95) 0%,rgba(7,7,7,.6) 34%,rgba(7,7,7,.12) 60%,rgba(7,7,7,.5) 100%)}
.ouv-porte{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.porte-plein{fill:var(--noir)}
/* habillage de la porte : motif de petites serrures, lueur qui sort du trou, ondes dorées.
   Pour revenir au noir uni : ajouter « .porte-motif,.porte-lumiere,.porte-onde{display:none} ». Pour doser le motif : son « opacity ». */
.porte-motif{fill:url(#porte-motif);opacity:.2}
.porte-lumiere{fill:url(#porte-lumiere)}
.porte-onde{fill:none;stroke:#e8b03b;stroke-width:1.2;opacity:.24}
.porte-onde-2{opacity:.15}
.porte-onde-3{opacity:.08}
@media (max-width:900px){.porte-onde-3{display:none}}
.porte-halo{fill:none;stroke:rgba(247,204,86,.16);stroke-width:16}
.porte-trait{fill:none;stroke:url(#or-serrure);stroke-width:3.5}
.ouv-grille{position:relative;height:100%;display:grid;grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr);align-items:center;gap:clamp(20px,4vw,64px);padding-top:calc(var(--tete) + 10px);padding-bottom:50px}
.ouv-trou{height:min(90%,640px);align-self:center}
.ouv-titre{margin:0 0 20px}
/* la taille du titre suit la largeur ET la hauteur de l'écran : tout tient sans faire défiler, même sur un portable 13 pouces */
.ouv-l{display:block;font:800 clamp(28px,min(3.7vw,6.9vh),56px)/1.1 var(--titre);letter-spacing:-.012em;text-transform:uppercase;animation:monte 1.1s var(--doux) both}
.ouv-l+.ouv-l{animation-delay:.12s}
.ouv-l em{font-style:normal}
@keyframes monte{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
.ouv-chapo{max-width:50ch;font-size:clamp(15.5px,1.2vw,17.5px);line-height:1.6;color:var(--gris);margin:0}
.ouv-actions{margin-top:clamp(18px,3vh,30px)}
.ouv-actions .btn .ico{width:17px;height:17px}
.ouv-invite{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);margin:0;padding:10px 16px;display:flex;justify-content:center;align-items:center;gap:12px;white-space:nowrap;font:600 11px/1 var(--texte);letter-spacing:.26em;text-transform:uppercase;color:var(--gris);text-decoration:none;transition:color .3s}
.ouv-invite:hover{color:var(--or-2)}
.ouv-invite .ico{color:var(--or-3);animation:tourne 2.6s ease-in-out infinite}
@keyframes tourne{0%,100%{transform:rotate(0)}50%{transform:rotate(-38deg)}}
.ouv-final{position:absolute;inset:0;display:flex;align-items:flex-end;padding-bottom:clamp(24px,6vh,72px);opacity:0;pointer-events:none}
.ouv-scene.ouverte .ouv-final{pointer-events:auto}
.ouv-final-titre{margin:0 0 22px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 20px}
.ouv-final-titre b{font:800 clamp(30px,min(4.4vw,8vh),64px)/1 var(--titre);letter-spacing:-.035em}
.ouv-final-titre .script{font-size:clamp(42px,min(5.6vw,10vh),84px);line-height:.9;padding:0 .12em .1em 0}
.recherche{position:relative}
.recherche-barre{position:relative;display:grid;grid-template-columns:auto minmax(0,1.75fr) minmax(0,1fr) minmax(0,.84fr) minmax(0,1fr) auto;align-items:stretch;border:1px solid var(--trait-fort);background:rgba(11,11,11,.92);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.champ{display:grid;gap:2px;padding:12px 20px 10px;border-right:1px solid var(--trait);min-width:0}
.champ>span{font:700 10px/1.2 var(--texte);letter-spacing:.22em;text-transform:uppercase;color:var(--or-4)}
.champ select,.champ input{width:100%;border:0;background:transparent;color:var(--blanc);font:500 15.5px/1.5 var(--texte);padding:2px 0;-webkit-appearance:none;appearance:none;cursor:pointer;text-overflow:ellipsis;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e8b03b' stroke-width='2'%3E%3Cpath d='M7 10l5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 0 center;background-size:18px;padding-right:22px}
.champ select option{color:#111;background:#fff}
.recherche .btn{min-height:66px;clip-path:none;padding:0 34px}
/* le projet : acheter ou louer, deux boutons dans la barre */
.champ-projet{align-content:center}
.projet{display:flex;margin-top:4px;border:1px solid var(--trait-fort)}
.projet label{flex:1;cursor:pointer}
.projet input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;background:none;padding:0}
.projet span{display:block;padding:8px 18px;font:700 11.5px/1 var(--texte);letter-spacing:.12em;text-transform:uppercase;text-align:center;white-space:nowrap;color:var(--gris);transition:color .3s,background .3s}
.projet label:hover span{color:var(--blanc)}
.projet input:checked+span{background:var(--metal);color:#070707}
.projet input:focus-visible+span{outline:2px solid var(--or-1);outline-offset:2px}
/* « Où ? » : une ou plusieurs communes à cocher ; à côté, la recherche autour d'un point sur la carte */
.champ-lieu{position:relative}
.ou-ligne{display:flex;align-items:center;gap:10px;min-width:0}
.ou-bouton{flex:1 1 0;min-width:0;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 0;border:0;background:none;color:var(--blanc);font:500 15.5px/1.5 var(--texte);text-align:left;cursor:pointer}
.ou-bouton span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ou-bouton .ico{flex:none;width:18px;height:18px;color:var(--or-3);stroke-width:2;transition:transform .3s}
.champ-lieu.ouvert .ou-bouton .ico{transform:rotate(180deg)}
.champ-lieu.choisi .ou-bouton{color:var(--or-2);font-weight:600}
.ou-retirer{flex:none;width:24px;height:24px;display:grid;place-items:center;padding:0;border:1px solid var(--trait);border-radius:50%;background:none;color:var(--gris);cursor:pointer}
.ou-retirer[hidden]{display:none}
.ou-retirer:hover{border-color:var(--or-3);color:var(--or-2)}
.ou-retirer .ico{width:11px;height:11px;stroke-width:2.4}
.ou-carte{flex:none;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--trait);background:none;color:var(--gris);font:700 10px/1 var(--texte);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;cursor:pointer;transition:border-color .3s,color .3s}
.ou-carte:hover,.champ-lieu.sur-carte .ou-carte{border-color:var(--or-3);color:var(--or-2)}
.ou-carte .ico{width:14px;height:14px}
.ou-panneau{position:absolute;z-index:30;left:-1px;top:calc(100% + 8px);width:max(100%,540px);max-width:calc(100vw - 28px);padding:18px 20px 16px;border:1px solid var(--trait-fort);background:#0b0b0b;box-shadow:0 26px 70px rgba(0,0,0,.75)}
.ou-panneau[hidden]{display:none}
.recherche .ou-panneau{top:auto;bottom:calc(100% + 10px)}
.ou-tete{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 10px;font:700 10.5px/1.3 var(--texte);letter-spacing:.2em;text-transform:uppercase;color:var(--or-4)}
.ou-tete b{font-weight:700}
.ou-vider,.ou-vers-carte{display:inline-flex;align-items:center;gap:8px;padding:0;border:0;background:none;color:var(--gris);font:500 13px/1.3 var(--texte);letter-spacing:0;text-transform:none;text-align:left;cursor:pointer}
.ou-vider:hover,.ou-vers-carte:hover{color:var(--or-2)}
.ou-vers-carte .ico{flex:none;width:15px;height:15px;color:var(--or-3)}
/* deux colonnes qui se lisent de haut en bas ; --rangs = nombre de lignes, réglé par le script */
.ou-communes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:repeat(var(--rangs,8),auto);grid-auto-flow:column;gap:0 26px;max-height:min(300px,42vh);overflow:auto;overscroll-behavior:contain}
.ou-communes label{display:flex;align-items:center;gap:10px;padding:7px 4px;cursor:pointer;font:500 14.5px/1.3 var(--texte);color:var(--blanc)}
.ou-communes label:hover{background:rgba(232,176,59,.08)}
.ou-communes input{flex:none;width:18px;height:18px;margin:0;padding:0;border:1px solid var(--or-4);background:none;-webkit-appearance:none;appearance:none;cursor:pointer}
.ou-communes input:checked{border-color:var(--or-2);background:var(--or-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23070707' stroke-width='3.4'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/14px no-repeat}
.ou-communes input:focus-visible{outline:2px solid var(--or-1);outline-offset:2px}
.ou-communes span{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ou-communes small{flex:none;font:600 11.5px/1 var(--texte);color:var(--gris-2)}
.ou-communes li[hidden]{display:none}
.ou-pied{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:12px 0 0;padding-top:12px;border-top:1px solid var(--trait)}
.ou-pied .btn{flex:none;min-height:40px;padding:0 20px;clip-path:none}
/* écrans de portable : la barre se resserre ; en dessous, elle passe sur deux lignes */
@media (max-width:1380px){
  .recherche-barre .champ{padding-inline:16px}
  .recherche-barre>.btn{padding:0 26px}
  .recherche .ou-carte{padding:6px 8px}
  .recherche .ou-carte span{display:none}
}
@media (min-width:901px) and (max-width:1180px){
  .recherche-barre{grid-template-columns:auto minmax(0,1fr) minmax(0,1fr) auto}
  .recherche-barre .champ-projet{grid-column:1;border-bottom:1px solid var(--trait)}
  .recherche-barre .champ-lieu{grid-column:2/4;border-bottom:1px solid var(--trait)}
  .recherche-barre>.btn{grid-column:4;grid-row:1/3}
}
/* la fenêtre « Par carte » */
.carte-modale{position:fixed;inset:0;z-index:130;display:grid;place-items:center;padding:clamp(10px,3vw,40px);background:rgba(4,4,4,.84)}
.carte-fenetre{width:min(840px,100%);max-height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto;background:#0b0b0b;border:1px solid var(--trait-fort);box-shadow:0 40px 100px rgba(0,0,0,.8)}
.carte-fenetre header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 22px;border-bottom:1px solid var(--trait)}
.carte-fenetre header .sur{margin:0 0 6px}
.carte-fermer{flex:none;width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid var(--trait-fort);border-radius:50%;background:none;color:var(--or-2);cursor:pointer;transition:background .3s,color .3s}
.carte-fermer:hover{background:var(--or-3);color:#070707}
.carte-plan{position:relative;height:min(54vh,440px);background:#111;cursor:crosshair}
.carte-attente{position:absolute;inset:0;display:grid;place-items:center;margin:0;padding:20px;text-align:center;font-size:14px;color:var(--gris)}
.carte-fenetre footer{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;padding:16px 22px;border-top:1px solid var(--trait)}
.carte-info{flex:1 1 220px;margin:0;font-size:14px;line-height:1.5;color:var(--gris)}
.carte-info strong{color:var(--or-2)}
.carte-rayon{display:flex;align-items:center;gap:12px;font:700 10.5px/1 var(--texte);letter-spacing:.18em;text-transform:uppercase;color:var(--or-4)}
.carte-rayon input{width:150px;accent-color:#e8b03b}
.carte-rayon b{min-width:56px;font:700 16px/1 var(--titre);letter-spacing:-.01em;text-transform:none;color:var(--blanc)}
.carte-modale .leaflet-container{background:#111;font-family:var(--texte)}
.carte-modale .leaflet-control-attribution{background:rgba(7,7,7,.78);color:var(--gris-2)}
.carte-modale .leaflet-control-attribution a{color:var(--gris)}
.carte-modale .leaflet-bar a{background:#0b0b0b;color:var(--or-2);border-color:var(--trait)}
.ouv-legende{margin:14px 0 0;font-size:13px;color:var(--gris);display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.ouv-legende strong{color:var(--blanc);font-weight:600}
.ouv-legende small{font-size:11.5px;color:var(--gris-2)}
/* sans animation (pas de script, ou « réduire les animations ») : tout est affiché à la suite */
.sans-js .ouverture,.ouverture.fixe{height:auto}
.sans-js .ouv-scene,.fixe .ouv-scene{position:relative;height:auto;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end}
.sans-js .ouv-porte,.fixe .ouv-porte,.sans-js .ouv-invite,.fixe .ouv-invite,.sans-js .ouv-trou,.fixe .ouv-trou{display:none}
.sans-js .ouv-voile,.fixe .ouv-voile{opacity:1}
.sans-js .ouv-grille,.fixe .ouv-grille{height:auto;grid-template-columns:1fr;padding-top:calc(var(--tete) + 40px);padding-bottom:40px}
.sans-js .ouv-final,.fixe .ouv-final{position:relative;opacity:1;pointer-events:auto;padding-bottom:48px}
.sans-js .ouv-final-titre,.fixe .ouv-final-titre{display:none}
@media (max-width:900px){
  .ouverture{height:230vh}
  .ouv-grille{grid-template-columns:1fr;grid-template-rows:auto auto minmax(0,1fr) auto;align-items:stretch;gap:12px;padding-top:calc(var(--tete) + 14px);padding-bottom:20px}
  .ouv-texte{display:contents}
  .ouv-grille .sur{order:1;margin:0;font-size:10.5px;letter-spacing:.2em}
  .ouv-titre{order:2;margin:0}
  .ouv-l{font-size:clamp(23px,7.9vw,50px)}
  .ouv-chapo{display:none}
  .ouv-trou{order:3;height:auto;min-height:120px;align-self:stretch}
  .ouv-actions{order:4;margin:0;gap:10px;flex-wrap:nowrap}
  .ouv-actions .btn{flex:1;min-height:50px;padding:0 10px;font-size:10.5px;letter-spacing:.1em}
  .ouv-invite{display:none}
  .recherche-barre{grid-template-columns:1fr 1fr}
  .champ{border-bottom:1px solid var(--trait);padding:9px 14px 7px}
  .recherche-barre .champ-projet{grid-column:1/-1;border-right:0;grid-template-columns:auto 1fr;align-items:center;gap:14px;padding-block:8px}
  .recherche-barre .champ-projet .projet{margin:0}
  .recherche-barre .champ-lieu{grid-column:1/-1;border-right:0}
  .recherche-barre label.champ:nth-of-type(2){border-right:0}
  .recherche-barre label.champ:nth-of-type(3){grid-column:1/-1;border-right:0}
  .recherche .btn{grid-column:1/-1;min-height:52px}
  .champ-lieu{position:static}
  /* sur petit écran, le panneau des communes recouvre le formulaire */
  .ou-panneau{left:-1px;right:-1px;top:-1px;bottom:auto;width:auto;max-width:none}
  .recherche .ou-panneau{top:auto;bottom:-1px}
  .ouv-final{padding-bottom:86px}
  .ouv-final-titre{margin-bottom:12px}
  .ouv-legende{display:none}
  .sans-js .ouv-texte,.fixe .ouv-texte{display:block}
  .sans-js .ouv-actions,.fixe .ouv-actions{margin-top:22px}
}
@media (max-width:760px){
  .recherche-barre .champ{padding-inline:11px}
  .recherche-barre .champ>span{letter-spacing:.1em;white-space:nowrap}
  .recherche-barre .champ select{font-size:14px}
  .ou-communes{grid-template-columns:1fr;grid-template-rows:none;grid-auto-flow:row;max-height:min(260px,38vh)}
  .ou-pied{flex-wrap:wrap}
  .carte-rayon input{width:110px}
  .ouv-grille{padding-bottom:84px}
  .sans-js .ouv-grille,.fixe .ouv-grille{padding-bottom:30px}
}

/* ==========================================================================
   LES CHIFFRES — cartes claires
   ========================================================================== */
.chiffres{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(28px,6vw,96px);align-items:center}
.chiffres-texte .t2{margin-bottom:20px}
.chiffres-texte .lien-fleche{margin-top:10px}
.chiffres-cartes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.6vw,22px)}
.chiffres-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.chiffre-carte{position:relative;display:grid;gap:4px;align-content:start;padding:clamp(20px,2.4vw,32px);background:var(--papier);border:1px solid var(--trait-clair);transition:transform .5s var(--doux),box-shadow .5s}
.chiffre-carte::before{content:"";position:absolute;left:-1px;top:-1px;width:42px;height:42px;border-top:3px solid var(--or-4);border-left:3px solid var(--or-4)}
.chiffre-carte:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(21,18,14,.12)}
.chiffre-carte .ico{width:30px;height:30px;color:var(--or-sombre);stroke-width:1.4}
.chiffre{margin:14px 0 0;font:800 clamp(36px,4.2vw,60px)/1 var(--titre);letter-spacing:-.045em;color:var(--encre);white-space:nowrap}
.chiffre small{font-size:.5em;font-weight:700;color:var(--or-sombre);margin-left:.06em;vertical-align:.42em;letter-spacing:0}
.chiffre-lib{margin:4px 0 0!important;font-size:14.5px;line-height:1.45;color:var(--encre-2)}
.chiffres-bande{padding-block:clamp(30px,4vw,54px)}
.chiffres-note{margin:16px 0 0;text-align:right}
.section-ivoire .chiffres-note{color:#7a7366}
@media (max-width:980px){
  .chiffres{grid-template-columns:1fr}
  .chiffres-4{grid-template-columns:1fr 1fr}
}

/* ==========================================================================
   LES QUATRE MÉTIERS
   ========================================================================== */
.services{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(12px,1.6vw,22px)}
.service{grid-column:span 5}
.service:nth-child(1),.service:nth-child(4){grid-column:span 7}
.service a{position:relative;display:block;height:clamp(280px,29vw,390px);overflow:hidden;background:var(--noir-3);color:var(--blanc);text-decoration:none}
.service img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.5s var(--doux)}
.service a::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(7,7,7,.95) 0%,rgba(7,7,7,.55) 42%,rgba(7,7,7,.08) 78%)}
.service a::after{content:"";position:absolute;inset:14px;z-index:2;border:1px solid var(--or-3);opacity:0;transform:scale(1.04);transition:opacity .5s,transform .7s var(--doux);pointer-events:none}
.service a:hover img,.service a:focus-visible img{transform:scale(1.07)}
.service a:hover::after,.service a:focus-visible::after{opacity:1;transform:none}
.service-n{position:absolute;left:clamp(22px,2.6vw,36px);top:clamp(20px,2.4vw,32px);z-index:3;font:500 15px/1 var(--serif);letter-spacing:.22em;color:var(--or-3)}
.service-corps{position:absolute;inset:auto 0 0 0;z-index:3;display:grid;gap:8px;justify-items:start;padding:clamp(22px,2.6vw,36px)}
.service-corps strong{font:800 clamp(24px,2.6vw,36px)/1.1 var(--titre);letter-spacing:-.03em}
.service-corps>span:nth-child(2){max-width:44ch;font-size:15px;line-height:1.55;color:#e4dfd3}
.service-corps .lien-fleche{margin-top:8px;font-size:11px}
@media (max-width:860px){
  .service,.service:nth-child(1),.service:nth-child(4){grid-column:1/-1}
  .service a{height:260px}
}

/* ==========================================================================
   LA VITRINE
   ========================================================================== */
.vitrine{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(280px,1fr);gap:clamp(18px,2.6vw,46px);align-items:start}
.vit-scene{position:relative;width:100%;aspect-ratio:3/2;overflow:hidden;background:var(--noir-3)}
.vit-scene::before,.vit-scene::after{content:"";position:absolute;z-index:3;width:54px;height:54px;pointer-events:none;border:2px solid var(--or-3)}
.vit-scene::before{left:14px;top:14px;border-right:0;border-bottom:0}
.vit-scene::after{right:14px;bottom:14px;border-left:0;border-top:0}
.vit-vue{position:absolute;inset:0;display:block;color:var(--blanc);text-decoration:none;opacity:0;visibility:hidden;transition:opacity .9s ease,visibility 0s .9s}
.vit-vue.actif{opacity:1;visibility:visible;transition:opacity .9s ease}
.vit-vue img{width:100%;height:100%;object-fit:cover}
.vit-vue::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(7,7,7,.94) 0%,rgba(7,7,7,.4) 42%,rgba(7,7,7,0) 66%)}
.vit-infos{position:absolute;inset:auto 0 0 0;z-index:2;display:grid;gap:4px;justify-items:start;padding:clamp(18px,3vw,44px)}
.vit-lieu{font:700 11.5px/1.4 var(--texte);letter-spacing:.26em;text-transform:uppercase;color:var(--or-3)}
.vit-titre{font:700 clamp(19px,2.1vw,29px)/1.2 var(--titre);letter-spacing:-.02em}
.vit-prix{font-size:13px;color:var(--gris);letter-spacing:.08em}
.vit-prix strong{font:800 clamp(28px,3.3vw,46px)/1.15 var(--titre);letter-spacing:-.035em;margin-right:6px}
.vit-infos .lien-fleche{margin-top:12px}
.etiquette{position:absolute;left:16px;top:16px;z-index:2;padding:8px 12px;font:700 10.5px/1 var(--texte);letter-spacing:.17em;text-transform:uppercase;background:var(--metal);color:#070707}
.vit-scene .etiquette{left:34px;top:34px}
.etiquette-marche{background:rgba(7,7,7,.8);color:var(--blanc)}
.etiquette-compromis{background:#070707;color:var(--or-3);box-shadow:inset 0 0 0 1px var(--or-4)}
.vit-cote{align-self:stretch;display:grid;grid-template-rows:1fr auto;gap:14px}
.vit-liste{list-style:none;margin:0;padding:0;display:grid;grid-auto-rows:1fr;border-top:1px solid var(--trait)}
.vit-liste li{border-bottom:1px solid var(--trait);display:grid}
.vit-choix{position:relative;width:100%;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;padding:10px 4px;border:0;background:none;text-align:left;cursor:pointer;color:var(--gris);transition:color .3s,padding .4s var(--doux)}
.vit-n{font:500 13px/1 var(--serif);color:var(--or-5);letter-spacing:.1em}
.vit-l{font:600 15.5px/1.3 var(--texte);color:inherit}
.vit-l small{display:block;font-weight:400;font-size:12.5px;color:var(--gris-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vit-p{font:700 16px/1 var(--titre);color:var(--or-5);white-space:nowrap}
.vit-choix:hover,.vit-choix.actif{color:var(--blanc);padding-left:12px}
.vit-choix.actif .vit-p,.vit-choix.actif .vit-n{color:var(--or-2)}
.vit-barre{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--metal);transform:scaleX(0);transform-origin:0 50%}
.vit-pause{justify-self:start;display:inline-flex;align-items:center;gap:8px;border:0;background:none;padding:6px 0;cursor:pointer;font:600 11px/1 var(--texte);letter-spacing:.18em;text-transform:uppercase;color:var(--gris-2)}
.vit-pause:hover{color:var(--or-3)}
.vit-pause .ico{width:16px;height:16px}
@media (max-width:980px){
  .vitrine{grid-template-columns:1fr}
  .vit-scene{aspect-ratio:4/3.4}
}

/* ==========================================================================
   LA MÉTHODE
   ========================================================================== */
.methode{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(34px,7vw,120px);align-items:start}
.methode-gauche{position:sticky;top:120px}
.methode-gauche .t2{margin-bottom:20px}
.rapport{margin:clamp(34px,5vw,56px) 0 0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:26px;align-items:center}
.rapport-feuilles{position:relative;width:250px;height:230px}
.feuille{position:absolute;width:148px;border:1px solid var(--trait);box-shadow:0 20px 44px rgba(0,0,0,.7);transition:transform .7s var(--doux)}
.feuille-1{left:0;top:12px;z-index:3;transform:rotate(-6deg)}
.feuille-2{left:50px;top:4px;z-index:2;transform:rotate(3deg)}
.feuille-3{left:98px;top:16px;transform:rotate(11deg)}
.rapport:hover .feuille-1{transform:rotate(-10deg) translateX(-8px)}
.rapport:hover .feuille-3{transform:rotate(15deg) translateX(10px)}
.rapport figcaption{font-size:14.5px;color:var(--gris);max-width:24ch}
.rapport figcaption strong{display:block;margin-bottom:6px;font:700 18px/1.25 var(--titre);letter-spacing:-.015em;color:var(--or-2)}
.etapes{position:relative;padding-left:46px}
.etapes ol{list-style:none;margin:0;padding:0;display:grid;gap:clamp(24px,3.4vw,46px)}
.etapes-rail{position:absolute;left:12px;top:6px;bottom:6px;width:1px;background:var(--trait)}
.etapes-rail i{position:absolute;left:-.5px;top:0;width:2px;height:0;background:linear-gradient(to bottom,var(--or-5),var(--or-2))}
.etapes-cle{position:absolute;left:12px;top:6px;z-index:2;width:36px;height:36px;margin:-18px 0 0 -18px;display:grid;place-items:center;border-radius:50%;background:var(--metal);color:#070707;box-shadow:0 0 0 6px var(--noir),0 0 26px rgba(247,204,86,.45)}
.section-nuit .etapes-cle{box-shadow:0 0 0 6px var(--noir-2),0 0 26px rgba(247,204,86,.45)}
.etapes-cle .ico{width:18px;height:18px;stroke-width:2}
.etape{display:grid;grid-template-columns:58px minmax(0,1fr);gap:22px;align-items:start;opacity:.38;transition:opacity .6s}
.etape.atteinte,.sans-js .etape{opacity:1}
.etape-n{width:58px;height:58px;display:grid;place-items:center;border:1px solid var(--trait-fort);border-radius:50%;font:500 17px/1 var(--serif);color:var(--or-3);transition:background .5s,color .5s}
.etape.atteinte .etape-n{background:var(--metal);color:#070707;border-color:transparent}
.etape h3{margin:13px 0 8px;font:700 clamp(17.5px,1.55vw,21px)/1.25 var(--titre);letter-spacing:-.015em}
.etape p{margin:0;color:var(--gris)}
@media (max-width:900px){
  .methode{grid-template-columns:1fr}
  .methode-gauche{position:static}
}
@media (max-width:480px){
  .rapport{grid-template-columns:1fr}
  .etape{grid-template-columns:46px minmax(0,1fr);gap:16px}
  .etape-n{width:46px;height:46px;font-size:15px}
  .etape h3{margin-top:8px}
}

/* ==========================================================================
   LE MOT DU DIRIGEANT
   ========================================================================== */
.mot{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);background:var(--ivoire);color:var(--encre)}
.mot-portrait{position:relative;min-height:640px;background:var(--metal);clip-path:polygon(0 0,100% 0,86% 100%,0 100%)}
.mot-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 10%;clip-path:polygon(0 0,calc(100% - 5px) 0,calc(86% - 5px) 100%,0 100%)}
.mot-citation{position:absolute;left:clamp(16px,4vw,56px);right:24%;bottom:clamp(18px,4vw,54px);margin:0;padding:22px 26px;background:rgba(7,7,7,.84);border:1px solid var(--trait-fort);color:var(--blanc);font-size:16px;line-height:1.6}
.mot-citation::before{content:"“";display:block;height:28px;font:700 60px/1 Georgia,serif;color:var(--or-3)}
.mot-citation p{margin:0}
.mot-lettre{padding:clamp(54px,7.4vw,110px) var(--marge) clamp(54px,7.4vw,110px) clamp(22px,4vw,70px);max-width:790px}
.mot-lettre .sur{color:var(--or-sombre)}
.mot-lettre .sur::before{background:var(--or-sombre)}
.mot-lettre .t2{margin-bottom:26px;font-size:clamp(26px,2.9vw,40px)}
.mot-lettre p{color:var(--encre-2)}
.mot-lettre .lien-fleche{color:var(--or-sombre)}
.mot-signature{display:grid;gap:2px;margin:26px 0 30px!important;font-size:14px}
.mot-signature .script{font-size:60px;line-height:1;color:var(--encre)}
.mot-signature strong{color:var(--or-sombre)}
@media (max-width:900px){
  .mot{grid-template-columns:1fr}
  .mot-portrait{min-height:0;aspect-ratio:4/4.6;clip-path:polygon(0 0,100% 0,100% 92%,0 100%)}
  .mot-portrait img{clip-path:polygon(0 0,100% 0,100% calc(92% - 5px),0 calc(100% - 5px))}
  .mot-citation{display:none}
  .mot-lettre{padding:44px var(--marge) 64px}
}

/* ==========================================================================
   L'ÉQUIPE — des portraits encadrés, un nom sous chacun
   ========================================================================== */
.equipe{--g:clamp(20px,2.6vw,40px);list-style:none;margin:0;padding:0 10px 10px 0;display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(30px,3.4vw,48px) var(--g)}
.membre{flex:0 0 calc((100% - 3 * var(--g)) / 4);display:grid;gap:20px;align-content:start}
.equipe[data-n="9"] .membre,.equipe[data-n="10"] .membre{flex-basis:calc((100% - 4 * var(--g)) / 5)}
.membre-photo{position:relative;aspect-ratio:4/5;background:#0a0a0a}
.membre-photo::after{content:"";position:absolute;inset:10px -10px -10px 10px;border:1px solid var(--or-5);transition:inset .5s var(--doux)}
.membre:hover .membre-photo::after{inset:0}
.membre-photo img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;object-position:50% 14%}
.membre-sans .membre-photo{display:grid;place-items:center;background:linear-gradient(135deg,#1c1c1d,#070707)}
.membre-sans .membre-photo span{position:relative;z-index:1;font:800 clamp(34px,3.6vw,52px)/1 var(--titre);letter-spacing:.02em;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.membre-nom{margin:0;font:700 18px/1.25 var(--titre);letter-spacing:-.015em}
.membre-role{margin:4px 0 0!important;font:700 10.5px/1.4 var(--texte);letter-spacing:.18em;text-transform:uppercase;color:var(--or-4)}
.section-ivoire .membre-nom{color:var(--encre)}
.section-ivoire .membre-role{color:var(--or-sombre)}
.section-ivoire .membre-photo::after{border-color:var(--or-sombre)}
.equipe-noms{margin:34px 0 0;font-size:14.5px;max-width:90ch}
@media (max-width:1100px){
  .membre,.equipe[data-n="9"] .membre,.equipe[data-n="10"] .membre{flex-basis:calc((100% - 2 * var(--g)) / 3)}
}
@media (max-width:620px){
  .equipe{--g:18px;gap:26px var(--g)}
  .membre,.equipe[data-n="9"] .membre,.equipe[data-n="10"] .membre{flex-basis:calc((100% - var(--g)) / 2);gap:14px}
}

/* ==========================================================================
   LES AGENCES
   ========================================================================== */
.agences{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.6vw,44px)}
.agence{display:grid;grid-template-rows:auto 1fr;border:1px solid var(--trait);background:var(--noir-3)}
.agence-photo{aspect-ratio:16/9;overflow:hidden;background:#050505}
.agence-photo img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--doux)}
.agence:hover .agence-photo img{transform:scale(1.04)}
.agence-corps{display:grid;gap:18px;align-content:start;padding:clamp(22px,3vw,42px)}
.agence-corps .sur{margin:0}
.agence .t3 small{display:block;margin-top:8px;font:700 11px/1 var(--texte);letter-spacing:.26em;text-transform:uppercase;color:var(--gris-2)}
.coord{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.coord li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:14px;align-items:start}
.coord .ico{color:var(--or-4);margin-top:3px}
.coord a{color:var(--blanc);text-decoration:none;font-weight:600}
.coord a:hover{color:var(--or-2)}
.agence .etat{font-size:13.5px}
.agence .actions{margin-top:4px}
@media (max-width:820px){.agences{grid-template-columns:1fr}}

/* ==========================================================================
   TEXTE DE FOND, QUESTIONS, SECTEURS
   ========================================================================== */
.edito{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(34px,7vw,110px);align-items:start}
.edito-texte .t2{margin-bottom:26px;font-size:clamp(26px,2.9vw,40px)}
.edito-questions{position:sticky;top:120px}
.edito-questions .t3{margin-bottom:14px}
.question{border-bottom:1px solid var(--trait)}
.section-ivoire .question,.section-sable .question{border-color:rgba(21,18,14,.18)}
.question summary{position:relative;list-style:none;cursor:pointer;padding:20px 44px 20px 0;font:600 16px/1.45 var(--texte)}
.question summary::-webkit-details-marker{display:none}
.question summary::before,.question summary::after{content:"";position:absolute;right:6px;top:50%;width:15px;height:1.5px;background:currentColor;transition:transform .4s var(--doux)}
.question summary::after{transform:rotate(90deg)}
.question[open] summary::after{transform:rotate(0)}
.question[open] summary{color:var(--or-3)}
.section-ivoire .question[open] summary,.section-sable .question[open] summary{color:var(--or-sombre)}
.reponse{padding:0 30px 22px 0;color:var(--gris);font-size:15.5px}
.reponse p:last-child{margin-bottom:0}
.secteurs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--trait);border-left:1px solid var(--trait)}
.secteurs li{border-right:1px solid var(--trait);border-bottom:1px solid var(--trait)}
.secteurs a{position:relative;display:grid;gap:4px;padding:clamp(18px,2.2vw,28px);padding-right:54px;text-decoration:none;color:var(--blanc);font:700 clamp(16.5px,1.5vw,20px)/1.25 var(--titre);letter-spacing:-.015em;transition:background .4s,color .3s}
.secteurs a span{font:700 10.5px/1.4 var(--texte);letter-spacing:.2em;text-transform:uppercase;color:var(--or-4)}
.secteurs a .ico{position:absolute;right:20px;top:50%;margin-top:-10px;color:var(--or-4);transition:transform .4s var(--doux)}
.secteurs a:hover{background:var(--noir-3);color:var(--or-2)}
.secteurs a:hover .ico{transform:translateX(6px)}
@media (max-width:980px){
  .edito{grid-template-columns:1fr}
  .edito-questions{position:static}
  .secteurs{grid-template-columns:1fr 1fr}
}
@media (max-width:480px){.secteurs{grid-template-columns:1fr}}

/* ==========================================================================
   CARTE D'UN BIEN (annonces)
   ========================================================================== */
.grille-biens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.1vw,32px)}
.bien{position:relative;display:grid;grid-template-rows:auto 1fr;background:var(--noir-3);border:1px solid rgba(255,255,255,.07);transition:border-color .4s,transform .6s var(--doux)}
.bien:hover{border-color:var(--trait-fort);transform:translateY(-5px)}
.bien-photo{position:relative;display:block;aspect-ratio:3/2;overflow:hidden;background:#050505}
.bien-photo img{width:100%;height:100%;object-fit:cover;transition:transform 1.3s var(--doux)}
.bien:hover .bien-photo img{transform:scale(1.07)}
.dpe{position:absolute;right:12px;bottom:12px;width:30px;height:30px;display:grid;place-items:center;border-radius:4px;font:700 13px/1 var(--texte);color:#fff}
.dpe-A{background:#2f9e5a}.dpe-B{background:#54b24a}.dpe-C{background:#a5cc3d;color:#111}.dpe-D{background:#f2e31a;color:#111}.dpe-E{background:#f0b316;color:#111}.dpe-F{background:#eb8235}.dpe-G{background:#d7221f}
.coeur{position:absolute;right:12px;top:12px;z-index:3;width:44px;height:44px;padding:0;display:grid;place-items:center;border-radius:50%;border:1px solid rgba(255,255,255,.4);background:rgba(7,7,7,.55);color:#fff;cursor:pointer;transition:background .3s,transform .3s var(--doux)}
.coeur:hover{transform:scale(1.08);border-color:var(--or-3)}
.coeur[aria-pressed="true"]{background:var(--metal);border-color:transparent;color:#070707}
.coeur[aria-pressed="true"] .ico{fill:currentColor}
.bien-corps{display:grid;gap:6px;align-content:start;padding:20px 22px 22px}
.bien-corps p{margin:0}
.bien-lieu{font:700 11px/1.4 var(--texte);letter-spacing:.24em;text-transform:uppercase;color:var(--or-4)}
.bien-titre{font:600 17px/1.35 var(--texte)}
.bien-titre a{color:var(--blanc);text-decoration:none}
.bien-titre a::after{content:"";position:absolute;inset:0;z-index:1}
.bien-prix{margin-top:6px!important}
.bien-prix strong{font:800 25px/1.1 var(--titre);letter-spacing:-.03em;background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.bien-prix span{font-size:12px;letter-spacing:.08em;color:var(--gris)}
.bien-hono{font-size:11px;line-height:1.4;color:var(--gris-2)}
.bien-ref{margin-top:6px!important;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gris-2)}
@media (max-width:1020px){.grille-biens{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.grille-biens{grid-template-columns:1fr}}

/* ==========================================================================
   APPEL FINAL, PIED DE PAGE — inchangés depuis la version 1 (capitales romaines comprises)
   ========================================================================== */
.appel{position:relative;overflow:hidden;padding:clamp(84px,11vw,170px) 0;text-align:center;border-top:1px solid var(--trait);background:#050505}
.appel-fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9}
.appel::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,rgba(7,7,7,.38),rgba(7,7,7,.86) 80%)}
.appel-in{position:relative;z-index:1;display:grid;justify-items:center}
.appel-script{margin:0 0 6px;font-size:clamp(42px,5.6vw,82px);line-height:1}
.appel-script span{padding:0 .15em .12em}
.appel .t2{font:500 clamp(29px,4vw,56px)/1.08 var(--serif);text-transform:uppercase;letter-spacing:.015em}
.appel-texte{max-width:56ch;margin:22px 0 0;font-size:18px;color:var(--blanc)}
.appel .btn{min-height:56px;padding:0 30px;letter-spacing:.17em}
.appel .actions{justify-content:center;margin-top:34px}
.pied{position:relative;background:#040404;font-size:14.5px;color:var(--gris)}
.pied-toits{color:var(--or-5);padding-top:44px;border-bottom:1px solid var(--trait)}
.skyline{display:block;width:100%;height:auto;max-height:170px;margin-bottom:-1px}
.skyline path{fill:none;stroke:currentColor;stroke-width:1.15;stroke-linejoin:round;stroke-linecap:round;vector-effect:non-scaling-stroke}
.pied-grille{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr;gap:clamp(26px,4vw,70px);padding-block:clamp(44px,5.6vw,80px)}
.marque-grande{gap:13px}
.marque-grande .marque-signe{width:76px;height:70px}
.marque-grande .marque-nom b{font-size:46px}
.marque-grande .marque-nom i{font-size:16px;margin-top:8px}
.pied-depuis{display:flex;align-items:center;gap:14px;margin:20px 0 16px;max-width:250px;font:600 12px/1 var(--texte);letter-spacing:.34em;text-transform:uppercase;color:var(--or-3)}
.pied-depuis::before,.pied-depuis::after{content:"";flex:1;height:1px;background:var(--trait-fort)}
.pied-devise{max-width:34ch}
.pied-reseaux{display:flex;gap:10px;margin:22px 0 0}
.pied-reseaux a{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--trait);border-radius:50%;color:var(--or-3);transition:background .3s,color .3s}
.pied-reseaux a:hover{background:var(--or-3);color:#070707}
.pied-col h2{margin:0 0 14px;font:700 11.5px/1.4 var(--texte);letter-spacing:.22em;text-transform:uppercase;color:var(--or-4)}
.pied-col h2:not(:first-child){margin-top:28px}
.pied-col p{margin:0 0 6px}
.pied-col ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.pied-col a{color:var(--blanc);text-decoration:none}
.pied-col a:hover{color:var(--or-2)}
.pied-tel{font:500 21px/1.2 var(--serif);letter-spacing:.04em}
.pied-secteurs a{display:block}
.pied-secteurs span{color:var(--gris-2)}
.pied-secteurs .ico{display:none}
.pied-legal{border-top:1px solid rgba(255,255,255,.08);padding-block:26px 34px;font-size:12.5px;color:var(--gris-2);display:grid;gap:12px}
.pied-legal p{margin:0;max-width:110ch}
.pied-legal ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 26px}
.pied-legal a,.pied-legal button{color:var(--gris);text-decoration:underline;text-underline-offset:3px;background:none;border:0;padding:0;cursor:pointer;font-size:inherit}
.pied-legal a:hover,.pied-legal button:hover{color:var(--or-2)}
@media (max-width:980px){.pied-grille{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.pied-grille{grid-template-columns:1fr}}

/* ---------- barre d'actions (téléphone) ---------- */
.barre-mobile{display:none}
@media (max-width:760px){
  body{padding-bottom:64px}
  .barre-mobile{position:fixed;inset:auto 0 0 0;z-index:50;display:grid;grid-template-columns:1fr 1fr 1.15fr;height:64px;background:rgba(7,7,7,.96);border-top:1px solid var(--trait-fort);padding-bottom:env(safe-area-inset-bottom)}
  .barre-mobile a{display:flex;align-items:center;justify-content:center;gap:8px;font:700 11px/1 var(--texte);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:var(--blanc);border-right:1px solid var(--trait)}
  .barre-mobile a.fort{background:var(--metal);color:#070707;border:0}
  .barre-mobile .ico{width:18px;height:18px}
}

/* ---------- cookies ---------- */
.cookies{position:fixed;left:18px;bottom:18px;z-index:90;width:min(460px,calc(100vw - 36px));background:#0b0b0b;border:1px solid var(--trait-fort);box-shadow:0 24px 70px rgba(0,0,0,.7);animation:fondu .5s ease}
.cookies-in{padding:22px 24px;font-size:13.5px;line-height:1.6;color:var(--gris)}
.cookies-titre{margin:0 0 8px;font:700 18px/1.25 var(--titre);letter-spacing:-.015em;color:var(--or-2)}
.cookies-reglages{display:grid;gap:10px;margin:0 0 16px}
.cookies-reglages label{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:start;cursor:pointer}
.cookies-reglages input{width:18px;height:18px;margin-top:2px;accent-color:var(--or-4)}
.cookies-reglages strong{color:var(--blanc)}
.cookies-actions{display:flex;flex-wrap:wrap;gap:8px}
.cookies-actions .btn{flex:1;min-height:42px;padding:0 12px;font-size:10.5px;letter-spacing:.1em;white-space:nowrap}
@media (max-width:760px){.cookies{bottom:76px}}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  .js .apparait{opacity:1;transform:none}
}
@media print{
  .entete,.barre-mobile,.cookies,.appel,.menu-mobile{display:none!important}
  body{background:#fff;color:#000}
}