/* ============================================================
   B.G.N INVEST — Feuille de style globale
   Noir + doré, premium et professionnel
   ============================================================ */

:root{
  --noir:#0c0a07;
  --noir-warm:#100d08;
  --anthracite:#15110b;
  --anthracite-2:#1d1810;
  --or:#c9a24b;
  --or-clair:#e8c874;
  --or-fonce:#a8843a;
  --or-deep:#8a6a2c;
  --blanc-casse:#f5f1e8;
  --parchment:#ebe1cf;
  --texte-doux:rgba(245,241,232,.72);
  --texte-faible:rgba(245,241,232,.46);
  --grad-or:linear-gradient(135deg,#e8c874,#c9a24b 60%,#a8843a);
  --serif:"Cormorant Garamond","Playfair Display",Georgia,serif;
  --serif-alt:"Playfair Display",Georgia,serif;
  --sans:"Inter",system-ui,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,monospace;
  --script:"Pinyon Script",cursive;
  --liseré:1px solid rgba(201,162,75,.22);
  --r:6px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);background:var(--noir);color:var(--blanc-casse);
  line-height:1.7;font-weight:300;-webkit-font-smoothing:antialiased;overflow-x:hidden;
  position:relative
}
/* Subtle film grain over everything */
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:200;
  opacity:.035;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .85  0 0 0 0 .5  0 0 0 .55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")
}
@media(prefers-reduced-motion:reduce){body::after{display:none}}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;line-height:1.08;letter-spacing:-.01em}
h1 em, h2 em, h3 em{font-style:italic;color:var(--or-clair);font-weight:400}
.wrap{width:min(1200px,90vw);margin-inline:auto}

.kicker{
  font-family:var(--sans);font-weight:600;letter-spacing:.28em;text-transform:uppercase;
  font-size:.7rem;color:var(--or);display:inline-flex;align-items:center;gap:.7em
}
.kicker::before{content:"";width:18px;height:1px;background:currentColor;opacity:.7}

/* ============================================================
   ÉDITORIAL — Chapitres numérotés
   ============================================================ */
.chapter{
  display:flex;align-items:baseline;gap:1.2rem;
  font-family:var(--serif);color:var(--or);
  margin-bottom:1rem;
  font-feature-settings:"lnum","tnum"
}
.chapter .num{
  font-size:.95rem;font-style:italic;letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:.45rem
}
.chapter .num::before{
  content:"";width:36px;height:1px;background:currentColor;opacity:.55
}
.chapter .label{
  font-family:var(--sans);font-size:.7rem;font-weight:600;
  letter-spacing:.28em;text-transform:uppercase;color:var(--or)
}

/* ============================================================
   ÉDITORIAL — Diviseur diamant
   ============================================================ */
.diamond-rule{
  display:flex;align-items:center;justify-content:center;gap:1.4rem;
  margin:0 auto;max-width:520px;color:var(--or)
}
.diamond-rule::before, .diamond-rule::after{
  content:"";flex:1;height:1px;
  background:linear-gradient(90deg, transparent, rgba(201,162,75,.5))
}
.diamond-rule::after{background:linear-gradient(90deg, rgba(201,162,75,.5), transparent)}
.diamond-rule .sym{
  font-family:var(--serif);font-size:.95rem;letter-spacing:.5em;
  color:var(--or);transform:translateX(.25em)
}
.diamond-rule.tight{margin:2.2rem auto}

/* Seal — Maison fondée à */
.seal{
  display:inline-flex;align-items:center;gap:.7rem;
  padding:.45rem 1.1rem;border:1px solid rgba(201,162,75,.32);
  border-radius:999px;font-family:var(--serif);font-style:italic;
  color:var(--or-clair);font-size:.86rem;letter-spacing:.04em
}
.seal::before{content:"※";font-style:normal;color:var(--or)}

/* ============================================================
   BOUTONS — Éditorial, angles nets
   ============================================================ */
.btn-or{
  display:inline-flex;align-items:center;gap:.7em;font-family:var(--sans);
  font-weight:600;letter-spacing:.14em;background:var(--grad-or);color:#1a1408;
  padding:1.05rem 2rem;border-radius:2px;font-size:.78rem;text-transform:uppercase;
  box-shadow:0 14px 34px -16px rgba(201,162,75,.7);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;
  border:none;cursor:pointer
}
.btn-or:hover{transform:translateY(-3px);box-shadow:0 22px 46px -16px rgba(232,200,116,.85)}
.btn-soft{
  display:inline-flex;align-items:center;gap:.7em;font-weight:500;color:var(--or-clair);
  padding:1rem 1.8rem;border:1px solid rgba(201,162,75,.4);border-radius:2px;
  transition:background .35s,border-color .35s;background:transparent;cursor:pointer;
  font-family:var(--sans);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase
}
.btn-soft:hover{background:rgba(201,162,75,.08);border-color:var(--or)}

/* ============================================================
   REVEAL au scroll
   ============================================================ */
.reveal{opacity:1;transform:none}
.js .reveal{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.js .reveal.in{opacity:1;transform:none}

/* ============================================================
   TOPBAR-TOP (bandeau infos contact)
   ============================================================ */
.topbar-top{
  position:relative;z-index:51;
  background:#0c0a07;
  border-bottom:1px solid rgba(201,162,75,.14);
  font-size:.78rem;color:var(--texte-doux);
  letter-spacing:.02em
}
.topbar-top .wrap{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.5rem 0;flex-wrap:wrap}
.topbar-top-info{display:flex;gap:1.4rem;flex-wrap:wrap;align-items:center}
.topbar-top-info a, .topbar-top-info .topbar-top-meta{
  color:var(--texte-doux);display:inline-flex;align-items:center;gap:.45em;
  transition:color .25s
}
.topbar-top-info a:hover{color:var(--or-clair)}
.topbar-top-info .ico{color:var(--or-clair);font-size:.92em}
.topbar-top-social{display:flex;gap:.5rem;align-items:center}
.topbar-top-social a{
  width:28px;height:28px;border-radius:50%;
  display:grid;place-items:center;
  border:1px solid rgba(201,162,75,.3);color:var(--or-clair);
  font-size:.85rem;font-weight:600;
  transition:background .25s,border-color .25s,color .25s
}
.topbar-top-social a:hover{background:rgba(201,162,75,.14);border-color:var(--or)}
@media(max-width:760px){
  .topbar-top{font-size:.72rem}
  .topbar-top .wrap{padding:.45rem 0;justify-content:center}
  .topbar-top-info{gap:.8rem;justify-content:center}
  .topbar-top-info .topbar-top-meta{display:none}
  .topbar-top-social{display:none}
}

/* ============================================================
   TOPBAR & MEGA-MENU
   ============================================================ */
.topbar{
  position:sticky;top:0;z-index:50;
  background:rgba(16,14,10,.84);backdrop-filter:blur(12px);
  border-bottom:var(--liseré)
}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;padding:.85rem 0;flex-wrap:wrap}
.brand-link{display:flex;align-items:center;gap:.8rem}
.logo{display:block;height:72px;width:auto}
.brand-name{display:none;flex-direction:column;line-height:1}
.brand-name b{font-family:var(--serif);font-size:1.05rem;letter-spacing:.14em;color:var(--blanc-casse);font-weight:500}
.brand-name small{font-family:var(--script);font-size:1rem;color:var(--or);margin-top:.1rem}
@media(min-width:1000px){.brand-name{display:flex}}

.topbar-tel{display:flex;align-items:center;gap:.9rem;order:3}
.topbar-tel .num{display:none;font-weight:600;color:var(--blanc-casse);text-align:right}
.topbar-tel .num small{display:block;font-weight:400;font-size:.66rem;letter-spacing:.2em;color:var(--texte-faible);text-transform:uppercase}
.btn-appel-mini{display:inline-flex;align-items:center;gap:.5em;background:var(--grad-or);color:#1a1408;font-weight:600;font-size:.7rem;padding:.7rem 1.2rem;border-radius:2px;box-shadow:0 10px 24px -12px rgba(201,162,75,.7);transition:transform .3s,box-shadow .3s;letter-spacing:.16em;text-transform:uppercase}
.btn-appel-mini:hover{transform:translateY(-2px);box-shadow:0 16px 30px -12px rgba(232,200,116,.85)}
@media(min-width:1100px){.topbar-tel .num{display:block}}

/* Mega-menu desktop */
.nav-menu{display:flex;align-items:center;gap:1.8rem;order:2}
.nav-menu > li{position:relative;list-style:none}
.nav-menu > li > a, .nav-menu > li > button{
  font-size:.86rem;font-weight:500;letter-spacing:.04em;color:var(--texte-doux);
  transition:color .3s;background:transparent;border:none;cursor:pointer;font-family:var(--sans);
  display:inline-flex;align-items:center;gap:.4em;padding:.4rem 0
}
.nav-menu > li > a.active,
.nav-menu > li > a:hover,
.nav-menu > li > button:hover{color:var(--or-clair)}
.nav-menu .has-mega > button::after{
  content:"";width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:rotate(45deg);transition:transform .3s;margin-bottom:3px
}
.nav-menu .has-mega.open > button::after{transform:rotate(-135deg);margin-bottom:-2px}

.mega{
  position:absolute;left:50%;top:calc(100% + .9rem);transform:translateX(-50%) translateY(-6px);
  min-width:560px;background:rgba(26,23,18,.98);backdrop-filter:blur(14px);
  border:var(--liseré);border-radius:18px;padding:1.5rem;
  box-shadow:0 30px 60px -20px rgba(0,0,0,.8);
  opacity:0;visibility:hidden;transition:opacity .25s,transform .25s,visibility .25s;
  display:grid;gap:.6rem;grid-template-columns:repeat(2,1fr);z-index:60
}
.has-mega.open .mega{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.mega::before{
  content:"";position:absolute;top:-8px;left:50%;transform:translateX(-50%) rotate(45deg);
  width:14px;height:14px;background:rgba(26,23,18,.98);
  border-left:var(--liseré);border-top:var(--liseré)
}
.mega-item{
  display:flex;gap:.9rem;padding:.85rem;border-radius:12px;align-items:flex-start;
  transition:background .25s
}
.mega-item:hover{background:rgba(201,162,75,.08)}
.mega-item .ico{
  flex:0 0 auto;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;
  background:rgba(201,162,75,.12);border:1px solid rgba(201,162,75,.3);
  color:var(--or-clair);font-family:var(--serif);font-size:1rem
}
.mega-item .txt b{display:block;font-family:var(--sans);font-weight:600;font-size:.92rem;color:var(--blanc-casse);letter-spacing:.02em}
.mega-item .txt span{display:block;font-size:.78rem;color:var(--texte-doux);margin-top:.18rem;line-height:1.4}

.nav-toggle{
  display:none;width:42px;height:42px;flex:0 0 auto;border-radius:10px;
  border:var(--liseré);background:var(--anthracite);color:var(--blanc-casse);
  font-size:1.2rem;cursor:pointer
}

@media(max-width:999px){
  /* Header compact : on retire le blur (sinon il piège le position:fixed du drawer)
     et on réduit le logo pour gagner de la hauteur à chaque écran */
  .topbar{backdrop-filter:none;background:rgba(16,14,10,.97)}
  .logo{height:52px}
  .nav-toggle{display:grid;place-items:center;order:3}
  .topbar-tel{order:4}
  .topbar-tel .num{display:none !important}
  .btn-appel-mini{padding:.62rem 1rem;font-size:.66rem}

  /* Menu = panneau (drawer) plein écran, scrollable, par-dessus la page */
  .nav-menu{
    position:fixed;inset:0;z-index:90;width:100%;
    flex-direction:column;align-items:stretch;gap:0;
    padding:5rem 7vw 2.5rem;
    background:#100e0a;
    overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    opacity:0;visibility:hidden;transform:translateY(-10px);
    transition:opacity .28s ease,transform .28s ease,visibility .28s
  }
  .nav-menu.open{opacity:1;visibility:visible;transform:none}
  /* Le ✕ reste épinglé en haut à droite, au-dessus du drawer */
  .nav-menu.open ~ .nav-toggle{position:fixed;top:1rem;right:7vw;z-index:95}
  /* Le drawer prend toute la priorité : header au-dessus du bandeau (.topbar-top z-51)
     pour que le drawer le recouvre et que le ✕ reste cliquable ; fabs masqués */
  body.menu-open .topbar{z-index:130}
  body.menu-open .fab-stack{display:none}

  .nav-menu > li{width:100%}
  .nav-menu > li > a, .nav-menu > li > button{
    display:block;width:100%;padding:1.05rem 0;font-size:1.08rem;
    border-top:1px solid rgba(201,162,75,.14);text-align:left
  }
  .nav-menu > li:first-child > a{border-top:none}

  .mega{
    position:static;transform:none;min-width:0;background:transparent;border:none;
    box-shadow:none;padding:.2rem 0 .7rem .9rem;opacity:1;visibility:visible;
    display:none;grid-template-columns:1fr;border-radius:0
  }
  .mega::before{display:none}
  /* transform:none indispensable : sinon la règle desktop .has-mega.open .mega
     (translateX(-50%), spécificité supérieure) décale le sous-menu hors écran */
  .has-mega.open .mega{display:grid;transform:none}
  .mega-item{padding:.6rem 0}
  .mega-item:hover{background:transparent}
}

/* ============================================================
   HERO réutilisable
   ============================================================ */
.hero{position:relative;display:flex;align-items:center;overflow:hidden}
.hero-home{min-height:92vh;padding:7rem 0 6rem}
.hero-page{min-height:62vh;padding:6rem 0 4.5rem}
.hero-slider{position:absolute;inset:0;z-index:0}
.hero-slider img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;animation:heroFade 15s infinite;animation-fill-mode:both}
.hero-slider img:nth-child(1){animation-delay:0s}
.hero-slider img:nth-child(2){animation-delay:5s}
.hero-slider img:nth-child(3){animation-delay:10s}
@keyframes heroFade{
  0%{opacity:0;transform:scale(1.05)}
  6.7%{opacity:1}
  33.3%{opacity:1}
  40%{opacity:0}
  100%{opacity:0;transform:scale(1.16)}
}
.hero-static{position:absolute;inset:0;z-index:0}
.hero-static img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 8s ease-out;transform:scale(1.06)}
.hero.in-view .hero-static img{transform:scale(1)}
@media(prefers-reduced-motion:reduce){
  .hero-slider img{animation:none;opacity:0}
  .hero-slider img:first-child{opacity:1}
  .hero-static img{transform:none}
}
.hero-slider::after, .hero-static::after{
  content:"";position:absolute;inset:0;z-index:1;background:
    linear-gradient(100deg,rgba(16,14,10,.95) 0%,rgba(16,14,10,.82) 38%,rgba(16,14,10,.4) 70%,rgba(16,14,10,.62) 100%),
    linear-gradient(0deg,rgba(16,14,10,.75) 0%,rgba(16,14,10,.15) 45%)
}
.hero .wrap{position:relative;z-index:2}
.hero-grid{max-width:46rem}
@media(min-width:1100px){.hero-grid{max-width:56rem}}
.hero-rassure{
  display:inline-flex;align-items:center;gap:.7rem;background:transparent;
  border:1px solid rgba(201,162,75,.32);border-radius:2px;padding:.55rem 1.1rem;
  font-size:.7rem;letter-spacing:.22em;color:var(--or-clair);margin-bottom:1.8rem;
  text-transform:uppercase;font-weight:500
}
.hero-rassure .dot{width:6px;height:6px;border-radius:50%;background:var(--or-clair);box-shadow:0 0 0 3px rgba(232,200,116,.18)}
.hero h1{font-size:clamp(2.6rem,7.4vw,5.6rem);font-weight:400;text-wrap:balance;letter-spacing:-.018em;line-height:1.04}
.hero h1 em{font-style:italic;color:var(--or-clair);font-weight:400}
.hero .sub{color:var(--texte-doux);font-size:clamp(1.02rem,2.3vw,1.18rem);margin-top:1.8rem;max-width:54ch;text-wrap:pretty;line-height:1.65}
.hero-cta{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2.2rem;align-items:center}
.hero-badges{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2.2rem}
.hero-badges span{
  font-size:.7rem;font-weight:500;letter-spacing:.18em;color:var(--blanc-casse);
  padding:.45rem 1rem;border-radius:2px;background:rgba(12,10,7,.55);
  backdrop-filter:blur(6px);border:1px solid rgba(201,162,75,.25);text-transform:uppercase
}
.fil{
  display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;
  color:var(--texte-faible);font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;
  margin-bottom:1.4rem;font-weight:500
}
.fil a{color:var(--texte-doux);transition:color .25s}
.fil a:hover{color:var(--or-clair)}
.fil span.sep{opacity:.5}

/* ============================================================
   SECTIONS — Rythme éditorial
   ============================================================ */
section{padding:6rem 0}
.sec-head{max-width:720px;margin-bottom:3.4rem}
.sec-head.c{margin-inline:auto;text-align:center}
.sec-head h2{font-size:clamp(2.2rem,5.6vw,3.8rem);margin-top:1.1rem;font-weight:400;letter-spacing:-.02em;line-height:1.04}
.sec-head p{color:var(--texte-doux);margin-top:1.2rem;font-size:1.02rem;max-width:54ch;line-height:1.65}
.sec-head.c p{margin-inline:auto}
.bande{background:var(--anthracite);position:relative}
.bande::before, .bande::after{
  content:"";position:absolute;left:50%;transform:translateX(-50%);
  width:min(900px,80vw);height:1px;
  background:linear-gradient(90deg, transparent, rgba(201,162,75,.32), transparent)
}
.bande::before{top:0}
.bande::after{bottom:0}

/* ============================================================
   SERVICES CARDS — éditorial, angles nets
   ============================================================ */
.svc-grid{display:grid;gap:1.3rem;grid-template-columns:1fr}
.svc-card{
  background:linear-gradient(180deg,var(--anthracite-2),var(--anthracite));
  border:var(--liseré);border-radius:4px;padding:2.2rem 1.9rem 2rem;
  transition:transform .4s,box-shadow .4s,border-color .4s;
  display:flex;flex-direction:column;position:relative;overflow:hidden
}
.svc-card::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg, transparent, rgba(201,162,75,.55), transparent);
  opacity:0;transition:opacity .4s
}
.svc-card:hover{transform:translateY(-4px);border-color:rgba(201,162,75,.45);box-shadow:0 28px 54px -30px #000}
.svc-card:hover::before{opacity:1}
.svc-ico{
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:transparent;border:1px solid rgba(201,162,75,.42);
  color:var(--or-clair);font-family:var(--serif);font-style:italic;font-size:1.1rem;
  margin-bottom:1.4rem;font-feature-settings:"lnum","tnum"
}
.svc-card h3{font-size:1.45rem;font-weight:500;letter-spacing:-.005em}
.svc-card p{color:var(--texte-doux);font-size:.94rem;margin-top:.7rem;flex:1;line-height:1.65}
.svc-card .more{margin-top:1.5rem;font-family:var(--sans);font-weight:600;color:var(--or-clair);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;display:inline-flex;align-items:center;gap:.6em;transition:gap .25s}
.svc-card .more:hover{gap:1em}
@media(min-width:680px){.svc-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.svc-grid{grid-template-columns:repeat(4,1fr)}}
.svc-grid.three{grid-template-columns:1fr}
@media(min-width:680px){.svc-grid.three{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.svc-grid.three{grid-template-columns:repeat(3,1fr)}}
.svc-grid.five{grid-template-columns:1fr}
@media(min-width:680px){.svc-grid.five{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.svc-grid.five{grid-template-columns:repeat(5,1fr)}}

/* ============================================================
   CHIFFRES CLÉS — ledger numérique
   ============================================================ */
.stats{
  display:grid;gap:0;grid-template-columns:repeat(2,1fr);
  border-top:1px solid rgba(201,162,75,.32);
  border-bottom:1px solid rgba(201,162,75,.32);
  background:transparent;
  padding:0
}
@media(min-width:780px){.stats{grid-template-columns:repeat(4,1fr)}}
.stat{text-align:center;padding:2.4rem 1rem;position:relative}
.stat:not(:last-child)::after{
  content:"";position:absolute;right:0;top:25%;bottom:25%;width:1px;
  background:rgba(201,162,75,.18)
}
@media(max-width:779px){.stat:nth-child(2)::after{display:none}}
.stat .num{font-family:var(--serif);font-size:clamp(2.8rem,5.6vw,4.2rem);color:var(--or-clair);line-height:1;font-weight:400;font-feature-settings:"lnum","tnum";letter-spacing:-.02em}
.stat .num small{font-size:.45em;color:var(--or);font-style:italic}
.stat .lab{margin-top:.9rem;color:var(--texte-doux);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;font-family:var(--sans);font-weight:500}

/* ============================================================
   POURQUOI NOUS
   ============================================================ */
.why-wrap{display:grid;grid-template-columns:1fr;gap:2.8rem;align-items:start}
.why-list{display:flex;flex-direction:column;gap:0;border-top:1px solid rgba(201,162,75,.18)}
.why-row{display:flex;gap:1.2rem;align-items:flex-start;background:transparent;border:none;border-bottom:1px solid rgba(201,162,75,.18);border-radius:0;padding:1.5rem .2rem}
.check{flex:0 0 auto;width:32px;height:32px;border-radius:50%;background:transparent;border:1px solid rgba(201,162,75,.5);color:var(--or-clair);display:grid;place-items:center;font-weight:400;font-size:.85rem;font-family:var(--serif);font-style:italic}
.why-row h4{font-family:var(--serif);font-weight:500;font-size:1.2rem;letter-spacing:-.005em}
.why-row p{color:var(--texte-doux);font-size:.92rem;margin-top:.35rem;line-height:1.6}
.why-img{display:block;width:100%;height:100%;min-height:420px;object-fit:cover;border-radius:4px;border:var(--liseré)}
@media(min-width:900px){.why-wrap{grid-template-columns:1fr 1fr}}

/* ============================================================
   PARCOURS / ÉTAPES — numéraux Cormorant
   ============================================================ */
.parcours{display:grid;gap:1.3rem;grid-template-columns:1fr}
.pas{position:relative;background:transparent;border:1px solid rgba(201,162,75,.18);border-radius:4px;padding:2.4rem 1.8rem 2rem;text-align:center;transition:border-color .35s}
.pas:hover{border-color:rgba(201,162,75,.4)}
.pas .rond{
  width:auto;height:auto;border-radius:0;margin:0 auto .9rem;display:block;border:none;
  font-family:var(--serif);font-style:italic;font-size:clamp(3rem,5vw,4rem);font-weight:400;
  color:var(--or-clair);background:transparent;line-height:1;letter-spacing:-.02em
}
.pas h3{font-size:1.35rem;font-weight:500;letter-spacing:-.005em}
.pas p{color:var(--texte-doux);font-size:.92rem;margin-top:.7rem;line-height:1.65;max-width:30ch;margin-inline:auto}
@media(min-width:780px){
  .parcours{grid-template-columns:repeat(3,1fr)}
  .parcours.four{grid-template-columns:repeat(4,1fr)}
  .parcours .pas:not(:last-child)::after{content:"›";position:absolute;right:-1.2rem;top:50%;transform:translateY(-50%);color:var(--or);font-size:1.6rem;z-index:2;font-family:var(--serif);font-weight:300}
}

/* ============================================================
   AVIS — témoignages éditoriaux
   ============================================================ */
.avis-band{
  background:radial-gradient(100% 120% at 50% 0%,rgba(201,162,75,.1),transparent 55%),var(--anthracite);
  border-block:1px solid rgba(201,162,75,.22)
}
.avis-stat{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:1.4rem;margin-bottom:3.2rem;text-align:center}
.avis-stat .note{font-family:var(--serif);font-size:clamp(3rem,5vw,4rem);color:var(--or-clair);line-height:1;font-weight:400;font-feature-settings:"lnum";letter-spacing:-.02em}
.avis-stat .etoiles{color:var(--or-clair);letter-spacing:.2em;font-size:1.2rem}
.avis-stat .txt{color:var(--texte-doux);font-size:.88rem;letter-spacing:.04em}
.avis-track{
  display:flex;gap:1.6rem;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;padding:1rem .2rem;-webkit-overflow-scrolling:touch;
  scrollbar-width:thin;scrollbar-color:rgba(201,162,75,.45) transparent
}
.avis-track::-webkit-scrollbar{height:6px}
.avis-track::-webkit-scrollbar-thumb{background:rgba(201,162,75,.45);border-radius:999px}
.avis{
  flex:0 0 min(380px,82vw);scroll-snap-align:start;background:var(--noir);
  border:1px solid rgba(201,162,75,.18);border-radius:4px;padding:2.2rem 1.9rem 1.9rem;
  position:relative
}
.avis::before{
  content:"“";position:absolute;top:-.4rem;left:.8rem;
  font-family:var(--serif);font-style:italic;font-size:6rem;font-weight:400;
  color:var(--or);opacity:.32;line-height:1;pointer-events:none
}
.avis .etoiles{color:var(--or-clair);letter-spacing:.22em;font-size:.85rem;position:relative;z-index:1}
.avis blockquote{margin:1.4rem 0 1.6rem;font-family:var(--serif);font-style:italic;font-size:1.18rem;color:var(--blanc-casse);line-height:1.55;font-weight:400;position:relative;z-index:1}
.avis .auteur{display:flex;align-items:center;gap:.9rem;margin-top:1.2rem;padding-top:1.2rem;border-top:1px solid rgba(201,162,75,.16)}
.avis .pastille{
  width:38px;height:38px;border-radius:50%;background:transparent;
  border:1px solid rgba(201,162,75,.42);display:grid;place-items:center;
  color:var(--or-clair);font-family:var(--serif);font-style:italic;font-size:1.05rem
}
.avis .meta b{font-family:var(--sans);font-weight:600;font-size:.88rem;display:block;letter-spacing:.02em}
.avis .meta span{font-size:.72rem;color:var(--texte-faible);letter-spacing:.12em;text-transform:uppercase;margin-top:.2rem;display:block}
.avis-nav{display:flex;gap:.8rem;justify-content:center;margin-top:2rem}
.avis-nav button{
  width:46px;height:46px;border-radius:50%;border:1px solid rgba(201,162,75,.4);
  background:transparent;color:var(--or-clair);font-size:1.3rem;line-height:1;
  cursor:pointer;transition:background .3s,border-color .3s,transform .3s
}
.avis-nav button:hover{background:rgba(201,162,75,.1);border-color:var(--or);transform:translateY(-2px)}

/* ============================================================
   ZONE D'INTERVENTION — épurée
   ============================================================ */
.zone-card{display:grid;grid-template-columns:1fr;gap:0;border:1px solid rgba(201,162,75,.22);border-radius:4px;overflow:hidden;background:var(--anthracite)}
.zone-txt{padding:3rem 2.6rem}
.zone-txt h2{font-size:clamp(1.9rem,4.6vw,2.8rem);font-weight:400;letter-spacing:-.015em;line-height:1.08}
.zone-txt h2 em{font-style:italic;color:var(--or-clair)}
.zone-txt p{color:var(--texte-doux);margin-top:1.1rem;line-height:1.65}
.zone-txt .villes{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.4rem}
.zone-txt .villes span{font-size:.74rem;padding:.45rem 1rem;border-radius:2px;border:1px solid rgba(201,162,75,.28);color:var(--texte-doux);letter-spacing:.06em;text-transform:uppercase}
.zone-img{display:block;width:100%;height:100%;min-height:380px;object-fit:cover}
@media(min-width:860px){.zone-card{grid-template-columns:1.05fr .95fr}}
.zone-map{position:relative;min-height:380px}
.zone-map iframe{display:block;width:100%;height:100%;min-height:380px;border:0;filter:saturate(.8) brightness(.85) contrast(1.05)}
.zone-radius-badge{
  position:absolute;left:1rem;bottom:1rem;background:rgba(12,10,7,.85);
  backdrop-filter:blur(6px);border:1px solid rgba(201,162,75,.4);border-radius:2px;
  padding:.55rem 1.1rem;font-size:.7rem;color:var(--blanc-casse);font-weight:500;
  letter-spacing:.16em;text-transform:uppercase
}

.highlight-band{background:radial-gradient(120% 100% at 50% 0%,rgba(201,162,75,.14),transparent 60%),var(--anthracite);border-block:1px solid rgba(201,162,75,.22)}
.highlight-band .zone-card{background:var(--anthracite-2);border-color:rgba(201,162,75,.4)}

/* ============================================================
   PRESSE
   ============================================================ */
.presse{padding:3rem 0 3.5rem}
.presse .sec-head{margin-bottom:1.8rem}
.presse .sec-head h2{font-size:clamp(1.6rem,3.6vw,2.2rem)}
.logos-band{
  overflow:hidden;position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)
}
.logos-track{display:flex;align-items:center;gap:2.4rem;width:max-content;animation:logosScroll 34s linear infinite}
.js .logos-band:hover .logos-track{animation-play-state:paused}
@keyframes logosScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.logo-slot{
  flex:0 0 auto;width:190px;height:100px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:#fff;padding:.4rem .6rem;opacity:.92;
  transition:opacity .35s,transform .35s
}
.logo-slot:hover{opacity:1;transform:translateY(-3px)}
.logo-slot img{max-width:100%;max-height:100%;object-fit:contain}
@media(prefers-reduced-motion:reduce){.logos-track{animation:none}}

/* ============================================================
   CTA FINAL — épuré, lignes
   ============================================================ */
.cta{text-align:center;padding:7rem 0}
.cta-inner{
  background:transparent;
  border:1px solid rgba(201,162,75,.32);border-top:1px solid rgba(201,162,75,.5);border-bottom:1px solid rgba(201,162,75,.5);
  border-left:none;border-right:none;
  padding:clamp(3rem,7vw,5rem) 1.5rem;
  position:relative
}
.cta-inner::before, .cta-inner::after{
  content:"◇";position:absolute;left:50%;transform:translateX(-50%);
  color:var(--or);font-size:.8rem;background:var(--noir);padding:0 1rem
}
.cta-inner::before{top:-.45rem}
.cta-inner::after{bottom:-.45rem}
.cta h2{font-size:clamp(2.2rem,5.4vw,3.8rem);max-width:22ch;margin:1.2rem auto 1.2rem;text-wrap:balance;font-weight:400;letter-spacing:-.02em;line-height:1.04}
.cta p{color:var(--texte-doux);max-width:50ch;margin:0 auto 2.4rem;font-size:1.02rem;line-height:1.65}
.cta-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}

/* ============================================================
   FOOTER — éditorial
   ============================================================ */
footer{background:var(--noir);border-top:1px solid rgba(201,162,75,.22);padding:5rem 0 4rem;position:relative}
footer::before{
  content:"◇";position:absolute;top:-.55rem;left:50%;transform:translateX(-50%);
  color:var(--or);font-size:.85rem;background:var(--noir);padding:0 1rem
}
.foot-grid{display:grid;gap:2.6rem;grid-template-columns:1fr;margin-bottom:3rem}
@media(min-width:780px){.foot-grid{grid-template-columns:1.4fr 1fr 1fr 1fr}}
.foot-col h5{font-family:var(--sans);font-weight:600;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--or-clair);margin-bottom:1.3rem}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:.6rem}
.foot-col a{color:var(--texte-doux);font-size:.88rem;transition:color .25s;line-height:1.6}
.foot-col a:hover{color:var(--or-clair)}
.foot-brand .logo-footer{height:125px;width:auto;margin-bottom:1.2rem}
.foot-brand p{color:var(--texte-doux);font-size:.88rem;max-width:32ch;line-height:1.65}
.foot-bottom{padding-top:2.2rem;border-top:1px solid rgba(201,162,75,.14);display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;color:var(--texte-faible);font-size:.74rem;letter-spacing:.06em}

/* ============================================================
   GALERIE RÉALISATIONS + LIGHTBOX
   ============================================================ */
.real-carousel{position:relative}
.real-track{
  display:flex;gap:1.3rem;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;padding-bottom:.6rem;-webkit-overflow-scrolling:touch;
  scrollbar-width:thin;scrollbar-color:rgba(201,162,75,.45) transparent
}
.real-track::-webkit-scrollbar{height:6px}
.real-track::-webkit-scrollbar-thumb{background:rgba(201,162,75,.45);border-radius:999px}
.real-track figure{
  flex:0 0 min(360px,80vw);scroll-snap-align:start;margin:0;border-radius:var(--r);
  overflow:hidden;border:var(--liseré);background:var(--anthracite);cursor:pointer
}
.real-track img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.real-track figure:hover img{transform:scale(1.05)}
.real-track figcaption{padding:.95rem 1.2rem;font-size:.88rem;color:var(--blanc-casse);display:flex;align-items:center;gap:.6rem;border-top:var(--liseré)}
.real-track figcaption::before{content:"✓";color:var(--or-clair);font-weight:700}
.real-nav{display:flex;gap:.8rem;justify-content:center;margin-top:1.6rem}
.real-nav button{
  width:46px;height:46px;border-radius:50%;border:1px solid rgba(201,162,75,.4);
  background:var(--anthracite);color:var(--or-clair);font-size:1.3rem;line-height:1;
  cursor:pointer;transition:background .3s,border-color .3s,transform .3s
}
.real-nav button:hover{background:rgba(201,162,75,.12);border-color:var(--or);transform:translateY(-2px)}

.gallery-grid{
  display:grid;gap:1.1rem;grid-template-columns:repeat(2,1fr)
}
@media(min-width:780px){.gallery-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1100px){.gallery-grid{grid-template-columns:repeat(4,1fr)}}
.gallery-grid figure{
  margin:0;border-radius:var(--r);overflow:hidden;cursor:pointer;
  border:var(--liseré);background:var(--anthracite);position:relative
}
.gallery-grid img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.gallery-grid figure:hover img{transform:scale(1.06)}
.gallery-grid figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:.7rem .9rem;
  font-size:.78rem;color:var(--blanc-casse);
  background:linear-gradient(0deg,rgba(16,14,10,.85),transparent);
  opacity:0;transition:opacity .3s
}
.gallery-grid figure:hover figcaption{opacity:1}

/* ---- Vidéo vitrine ---- */
.video-vitrine{
  max-width:880px;margin:0 auto;border-radius:var(--r);overflow:hidden;
  border:var(--liseré);background:var(--anthracite);position:relative;
  box-shadow:0 30px 60px -28px rgba(0,0,0,.8)
}
.video-vitrine video{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;display:block}

/* ---- Bouton vidéo dans le hero ---- */
.hero-video-btn{
  position:absolute;top:0;right:0;z-index:3;
  display:inline-flex;align-items:center;gap:.7em;cursor:pointer;
  font-family:var(--sans);font-weight:600;font-size:.74rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--or-clair);
  padding:.8rem 1.3rem;border:1px solid rgba(201,162,75,.45);border-radius:2px;
  background:rgba(16,14,10,.55);backdrop-filter:blur(6px);
  transition:background .35s,border-color .35s,transform .35s
}
.hero-video-btn:hover{background:rgba(201,162,75,.12);border-color:var(--or);transform:translateY(-2px)}
.hero-video-btn .hvb-play{
  display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;
  background:var(--grad-or);color:#1a1408;font-size:.6rem;padding-left:2px
}
@media(max-width:760px){
  .hero-video-btn{font-size:.66rem;padding:.6rem 1rem;top:-.5rem}
  .hero-video-btn .hvb-play{width:18px;height:18px}
}

/* ---- Modale vidéo ---- */
.video-modal{
  position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;
  padding:2vw;background:rgba(8,6,4,.92);backdrop-filter:blur(8px);
  opacity:0;visibility:hidden;transition:opacity .4s ease,visibility .4s
}
.video-modal.open{opacity:1;visibility:visible}
.video-modal .vm-inner{
  width:min(1600px,96vw);border-radius:var(--r);overflow:hidden;
  border:var(--liseré);box-shadow:0 40px 90px -30px rgba(0,0,0,.9);
  transform:scale(.96);transition:transform .4s cubic-bezier(.2,.7,.2,1)
}
.video-modal.open .vm-inner{transform:scale(1)}
.video-modal video{width:100%;height:auto;max-height:92vh;display:block;background:#000}
.vm-close{
  position:absolute;top:1.4rem;right:1.6rem;z-index:1;cursor:pointer;
  width:44px;height:44px;border-radius:50%;border:1px solid rgba(201,162,75,.4);
  background:rgba(16,14,10,.7);color:var(--or-clair);font-size:1.6rem;line-height:1;
  display:grid;place-items:center;transition:background .3s,border-color .3s
}
.vm-close:hover{background:rgba(201,162,75,.16);border-color:var(--or)}

/* ---- En-tête de catégorie ---- */
.real-cat{margin-bottom:2.6rem}
.real-cat .kicker{display:block;margin-bottom:.7rem}
.real-cat h2{font-size:clamp(1.8rem,4.4vw,2.8rem);font-weight:400;letter-spacing:-.02em;line-height:1.06;margin:0}
.real-cat p{color:var(--texte-doux);margin-top:.9rem;font-size:.98rem;max-width:60ch;line-height:1.6}
.real-block{margin-bottom:5.5rem}

/* ---- Hub réalisations : 2 cartes-choix ---- */
.real-choice{display:grid;gap:1.6rem;grid-template-columns:1fr}
@media(min-width:760px){.real-choice{grid-template-columns:1fr 1fr}}
.choice-card{
  position:relative;display:block;border-radius:var(--r);overflow:hidden;
  border:var(--liseré);background:var(--anthracite);min-height:360px;isolation:isolate
}
.choice-card img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;
  transition:transform .7s cubic-bezier(.2,.7,.2,1)
}
.choice-card::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(12,10,7,.2) 0%,rgba(12,10,7,.55) 52%,rgba(12,10,7,.92) 100%)
}
.choice-card:hover img{transform:scale(1.05)}
.choice-card .cc-body{position:absolute;left:0;right:0;bottom:0;padding:2.1rem 1.9rem}
.choice-card .kicker{display:block;margin-bottom:.7rem}
.choice-card h2{font-size:clamp(1.7rem,4vw,2.4rem);font-weight:400;letter-spacing:-.02em;margin:0}
.choice-card p{color:var(--texte-doux);margin-top:.6rem;font-size:.92rem;max-width:34ch;line-height:1.55}
.choice-card .cc-go{
  display:inline-flex;align-items:center;gap:.6em;margin-top:1.3rem;color:var(--or-clair);
  font-size:.76rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;transition:gap .3s
}
.choice-card:hover .cc-go{gap:1.1em}

/* ---- Slider Avant / Après ---- */
.ba-grid{display:grid;gap:1.8rem 1.6rem;grid-template-columns:1fr}
@media(min-width:820px){.ba-grid{grid-template-columns:1fr 1fr}}
.ba-item{margin:0}
.ba{
  position:relative;overflow:hidden;border-radius:var(--r);border:var(--liseré);
  background:var(--anthracite);aspect-ratio:4/3;user-select:none;touch-action:pan-y;cursor:ew-resize
}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.ba-after{clip-path:inset(0 0 0 var(--pos,50%))}
.ba-range{
  position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;
  opacity:0;cursor:ew-resize;z-index:5;-webkit-appearance:none;appearance:none;background:transparent
}
.ba-range::-webkit-slider-thumb{-webkit-appearance:none;width:44px;height:100%;cursor:ew-resize}
.ba-range::-moz-range-thumb{width:44px;height:100%;border:0;background:transparent;cursor:ew-resize}
.ba-handle{
  position:absolute;top:0;bottom:0;left:var(--pos,50%);width:2px;
  background:var(--or-clair);transform:translateX(-50%);z-index:4;pointer-events:none
}
.ba-handle::after{
  content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:44px;height:44px;border-radius:50%;background:var(--grad-or);
  box-shadow:0 4px 16px rgba(0,0,0,.45)
}
.ba-handle::before{
  content:"‹ ›";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  z-index:1;color:var(--noir);font-size:1.15rem;font-weight:700;letter-spacing:-.05em;pointer-events:none
}
.ba-tag{
  position:absolute;top:.7rem;z-index:4;padding:.28rem .75rem;font-size:.66rem;
  letter-spacing:.14em;text-transform:uppercase;border-radius:999px;
  background:rgba(12,10,7,.74);color:var(--blanc-casse);border:var(--liseré);
  pointer-events:none;backdrop-filter:blur(2px)
}
.ba-tag-before{left:.7rem}
.ba-tag-after{right:.7rem;color:var(--or-clair)}
.ba-item figcaption{
  padding:.85rem .2rem 0;font-size:.86rem;color:var(--blanc-casse);
  display:flex;align-items:center;gap:.55rem
}
.ba-item figcaption::before{content:"✓";color:var(--or-clair);font-weight:700}

/* Carrousel avant/après (page accueil — Pourquoi nous) */
.ba-carousel{position:relative}
.ba-slide{display:none}
.ba-slide.is-active{display:block}
.ba-nav{
  position:absolute;top:calc(50% - 1.4rem);transform:translateY(-50%);z-index:6;
  width:42px;height:42px;border-radius:50%;border:var(--liseré);
  background:rgba(12,10,7,.74);color:var(--blanc-casse);
  font-size:1.5rem;line-height:1;cursor:pointer;backdrop-filter:blur(2px);
  display:flex;align-items:center;justify-content:center;transition:background .2s,color .2s
}
.ba-nav:hover{background:var(--grad-or);color:var(--noir)}
.ba-prev{left:.7rem}
.ba-next{right:.7rem}
.ba-dots{display:flex;justify-content:center;gap:.5rem;margin-top:1rem}
.ba-dot{
  width:9px;height:9px;border-radius:50%;border:0;padding:0;cursor:pointer;
  background:rgba(255,255,255,.28);transition:background .2s,transform .2s
}
.ba-dot.is-active{background:var(--or-clair);transform:scale(1.2)}
@media(min-width:900px){
  .why-wrap{align-items:stretch}
  .why-media{height:100%}
  .why-media .ba-carousel{height:100%;display:flex;flex-direction:column}
  .why-media .ba-carousel-track{flex:1;min-height:0}
  .why-media .ba-slide.is-active{height:100%;display:flex;flex-direction:column}
  .why-media .ba{flex:1;min-height:0;aspect-ratio:auto}
}

.lightbox{
  position:fixed;inset:0;z-index:90;background:rgba(8,7,5,.95);
  display:none;align-items:center;justify-content:center;padding:2rem
}
.lightbox.open{display:flex}
.lightbox img{max-width:92vw;max-height:88vh;object-fit:contain;border-radius:6px;box-shadow:0 30px 60px -20px #000}
.lightbox .lb-close,.lightbox .lb-prev,.lightbox .lb-next{
  position:absolute;background:rgba(26,23,18,.85);border:var(--liseré);
  color:var(--or-clair);width:54px;height:54px;border-radius:50%;
  display:grid;place-items:center;font-size:1.5rem;cursor:pointer;
  transition:background .25s,border-color .25s
}
.lightbox .lb-close:hover,.lightbox .lb-prev:hover,.lightbox .lb-next:hover{background:rgba(201,162,75,.18);border-color:var(--or)}
.lightbox .lb-close{top:1.5rem;right:1.5rem}
.lightbox .lb-prev{left:1.5rem;top:50%;transform:translateY(-50%)}
.lightbox .lb-next{right:1.5rem;top:50%;transform:translateY(-50%)}
.lightbox .lb-caption{
  position:absolute;left:0;right:0;bottom:1.5rem;text-align:center;
  color:var(--texte-doux);font-size:.9rem
}

/* ============================================================
   FAQ ACCORDÉON
   ============================================================ */
.faq{display:flex;flex-direction:column;gap:.8rem}
.faq-item{background:var(--anthracite);border:var(--liseré);border-radius:var(--r);overflow:hidden;transition:border-color .3s}
.faq-item.open{border-color:rgba(201,162,75,.55)}
.faq-q{
  width:100%;text-align:left;background:transparent;border:none;color:var(--blanc-casse);
  font-family:var(--sans);font-weight:500;font-size:1rem;letter-spacing:.01em;
  padding:1.3rem 1.6rem;cursor:pointer;
  display:flex;justify-content:space-between;align-items:center;gap:1rem
}
.faq-q .plus{
  flex:0 0 auto;width:32px;height:32px;border-radius:50%;
  background:rgba(201,162,75,.12);border:1px solid rgba(201,162,75,.3);
  color:var(--or-clair);position:relative;transition:transform .3s,background .3s
}
.faq-q .plus::before,.faq-q .plus::after{
  content:"";position:absolute;left:50%;top:50%;background:currentColor;
  transition:transform .3s
}
.faq-q .plus::before{width:12px;height:1.5px;transform:translate(-50%,-50%)}
.faq-q .plus::after{width:1.5px;height:12px;transform:translate(-50%,-50%)}
.faq-item.open .plus{background:rgba(201,162,75,.25)}
.faq-item.open .plus::after{transform:translate(-50%,-50%) scaleY(0)}
.faq-a{padding:0 1.6rem;max-height:0;overflow:hidden;color:var(--texte-doux);font-size:.94rem;line-height:1.7;transition:max-height .4s ease,padding .3s ease}
.faq-item.open .faq-a{padding:0 1.6rem 1.4rem;max-height:600px}
.faq-cat{
  display:inline-block;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--or);border:1px solid rgba(201,162,75,.3);
  border-radius:999px;padding:.3rem .8rem;margin-bottom:1.2rem
}

/* ============================================================
   CALCULATEUR D'ESTIMATION
   ============================================================ */
.calc{
  background:linear-gradient(160deg,var(--anthracite-2),var(--anthracite));
  border:var(--liseré);border-radius:20px;padding:clamp(1.8rem,4vw,2.6rem);
  display:grid;gap:1.6rem;grid-template-columns:1fr
}
@media(min-width:900px){.calc{grid-template-columns:1.1fr .9fr;gap:2.4rem}}
.calc h3{font-size:1.6rem}
.calc-field{display:flex;flex-direction:column;gap:.6rem;margin-bottom:1.2rem}
.calc-field label{font-size:.78rem;color:var(--texte-doux);letter-spacing:.06em;text-transform:uppercase}
.calc-options{display:flex;flex-wrap:wrap;gap:.5rem}
.calc-options input[type=radio]{position:absolute;opacity:0;pointer-events:none}
.calc-options label{
  cursor:pointer;background:rgba(16,14,10,.6);border:var(--liseré);
  padding:.65rem 1.1rem;border-radius:999px;font-size:.88rem;color:var(--blanc-casse);
  letter-spacing:0;text-transform:none;transition:background .25s,border-color .25s,color .25s
}
.calc-options input[type=radio]:checked + label{
  background:rgba(201,162,75,.18);border-color:var(--or);color:var(--or-clair)
}
.calc-slider{appearance:none;width:100%;height:4px;border-radius:999px;background:rgba(201,162,75,.2);outline:none}
.calc-slider::-webkit-slider-thumb{
  appearance:none;width:22px;height:22px;border-radius:50%;
  background:var(--grad-or);box-shadow:0 6px 16px -6px rgba(201,162,75,.7);cursor:pointer
}
.calc-slider::-moz-range-thumb{
  width:22px;height:22px;border-radius:50%;border:none;
  background:var(--or);box-shadow:0 6px 16px -6px rgba(201,162,75,.7);cursor:pointer
}
.calc-slider-val{display:flex;justify-content:space-between;color:var(--texte-faible);font-size:.74rem;letter-spacing:.06em;margin-top:.5rem}
.calc-result{
  background:rgba(16,14,10,.65);border:1px solid rgba(201,162,75,.3);
  border-radius:16px;padding:1.6rem;display:flex;flex-direction:column;gap:.8rem;justify-content:center
}
.calc-result .label{font-size:.78rem;color:var(--texte-doux);letter-spacing:.1em;text-transform:uppercase}
.calc-result .montant{font-family:var(--serif);font-size:clamp(2.2rem,4vw,3rem);color:var(--or-clair);line-height:1}
.calc-result .montant small{font-size:.5em;color:var(--or)}
.calc-result .precis{color:var(--texte-doux);font-size:.84rem}
.calc-result .actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.4rem}
.calc-result .actions .btn-or,.calc-result .actions .btn-soft{padding:.75rem 1.2rem;font-size:.85rem}

/* ============================================================
   BLOCS CONTENU (pour pages services)
   ============================================================ */
.split{display:grid;grid-template-columns:1fr;gap:2.4rem;align-items:center}
@media(min-width:900px){.split{grid-template-columns:1fr 1fr;gap:3.4rem}}
.split.reverse{direction:rtl}
.split.reverse > *{direction:ltr}
.split-img{border-radius:var(--r);overflow:hidden;border:var(--liseré);background:var(--anthracite);min-height:340px}
.split-img img{width:100%;height:100%;min-height:340px;object-fit:cover;display:block}
.split-txt h2{font-size:clamp(1.8rem,4vw,2.6rem)}
.split-txt h2 em{font-style:italic;color:var(--or-clair)}
.split-txt p{color:var(--texte-doux);margin-top:1rem}
.split-txt ul{list-style:none;display:flex;flex-direction:column;gap:.7rem;margin-top:1.4rem}
.split-txt ul li{display:flex;gap:.7rem;align-items:flex-start;color:var(--blanc-casse);font-size:.94rem}
.split-txt ul li::before{content:"✓";color:var(--or-clair);font-weight:700;flex:0 0 auto}
.split-txt .cta-actions{margin-top:1.8rem;justify-content:flex-start}

/* Encadrés "infos" */
.info-box{
  background:var(--anthracite-2);border:var(--liseré);border-radius:var(--r);
  padding:1.6rem 1.8rem;display:flex;gap:1.1rem;align-items:flex-start
}
.info-box .ico{
  flex:0 0 auto;width:42px;height:42px;border-radius:11px;display:grid;place-items:center;
  background:rgba(201,162,75,.14);border:1px solid rgba(201,162,75,.35);
  color:var(--or-clair);font-family:var(--serif);font-style:italic;font-size:1.2rem
}
.info-box h4{font-family:var(--sans);font-weight:600;font-size:1rem}
.info-box p{color:var(--texte-doux);font-size:.9rem;margin-top:.2rem}

/* ============================================================
   FAB FLOTTANTS + WHATSAPP
   ============================================================ */
.fab-stack{position:fixed;right:1.1rem;bottom:1.1rem;z-index:70;display:flex;flex-direction:column;gap:.7rem}
.fab{
  width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  font-size:1.4rem;box-shadow:0 16px 32px -14px rgba(0,0,0,.75);
  transition:transform .3s,box-shadow .3s;border:none;cursor:pointer
}
.fab:hover{transform:translateY(-3px) scale(1.06)}
.fab-appel{background:var(--grad-or);color:#1a1408}
.fab-mail{background:var(--anthracite);color:var(--or-clair);border:1px solid rgba(201,162,75,.4)}
.fab-wa{background:#25d366;color:#0d2818}
.fab-wa svg{width:28px;height:28px}

.fab-pulse{position:relative}
.fab-pulse::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  border:2px solid #25d366;animation:waPulse 2s infinite;pointer-events:none
}
@keyframes waPulse{
  0%{transform:scale(1);opacity:.8}
  100%{transform:scale(1.5);opacity:0}
}

/* ============================================================
   POPUP DEVIS
   ============================================================ */
.devis-overlay{
  position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;
  padding:1rem;background:rgba(16,14,10,.78);backdrop-filter:blur(6px)
}
.devis-overlay.open{display:flex}
.devis-box{
  position:relative;background:var(--anthracite-2);border:var(--liseré);
  border-radius:var(--r);padding:2rem;max-width:580px;width:100%;max-height:90vh;
  overflow-y:auto;box-shadow:0 30px 70px -30px #000
}
.devis-box .kicker{display:block;margin-bottom:.5rem}
.devis-box h3{font-size:1.7rem}
.devis-box .lead{color:var(--texte-doux);font-size:.92rem;margin-top:.5rem}
.devis-close{
  position:absolute;top:1rem;right:1rem;width:38px;height:38px;border-radius:50%;
  border:var(--liseré);background:var(--anthracite);color:var(--blanc-casse);
  font-size:1.1rem;line-height:1;cursor:pointer;transition:border-color .3s,color .3s
}
.devis-close:hover{border-color:var(--or);color:var(--or-clair)}
.devis-form{display:grid;gap:.9rem;margin-top:1.5rem}
.devis-form .row2{display:grid;gap:.9rem}
@media(min-width:520px){.devis-form .row2{grid-template-columns:1fr 1fr}}
.devis-form label{font-size:.78rem;color:var(--texte-doux);display:flex;flex-direction:column;gap:.4rem;letter-spacing:.03em}
.devis-form input,.devis-form select,.devis-form textarea{
  background:var(--noir);border:var(--liseré);border-radius:8px;
  padding:.75rem .9rem;color:var(--blanc-casse);font-family:var(--sans);font-size:.92rem
}
.devis-form input:focus,.devis-form select:focus,.devis-form textarea:focus{outline:1px solid var(--or)}
.devis-form textarea{resize:vertical;min-height:90px}
.devis-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:.6rem}
.devis-actions a{flex:1 1 150px;justify-content:center;text-align:center;font-size:.86rem;padding:.85rem 1rem}
.devis-note{font-size:.74rem;color:var(--texte-faible);margin-top:1rem;text-align:center}

/* Formulaire détaillé (multi-étapes) */
.devis-detail{
  background:linear-gradient(160deg,var(--anthracite-2),var(--anthracite));
  border:var(--liseré);border-radius:20px;
  padding:clamp(1.8rem,4vw,2.8rem)
}
.devis-detail .steps{display:flex;gap:.6rem;justify-content:center;margin-bottom:2rem;flex-wrap:wrap}
.devis-detail .step-pill{
  font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--texte-faible);padding:.4rem .9rem;border-radius:999px;
  border:1px solid rgba(201,162,75,.18)
}
.devis-detail .step-pill.active{color:var(--or-clair);border-color:var(--or)}
.devis-detail .step-pill.done{color:var(--or);border-color:rgba(201,162,75,.35)}

/* ============================================================
   SÉLECTEUR DE SERVICE + FORMULAIRES MULTIPLES
   ============================================================ */
.service-picker{display:grid;gap:1rem;grid-template-columns:1fr;margin-bottom:2.4rem}
@media(min-width:680px){.service-picker{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.service-picker{grid-template-columns:repeat(3,1fr)}}
.svc-pick{
  background:linear-gradient(180deg,var(--anthracite-2),var(--anthracite));
  border:var(--liseré);border-radius:var(--r);padding:1.7rem 1.7rem 1.5rem;
  cursor:pointer;text-align:left;font-family:var(--sans);color:var(--blanc-casse);
  display:flex;flex-direction:column;gap:.7rem;position:relative;
  transition:transform .35s,border-color .35s,box-shadow .35s,background .35s
}
.svc-pick:hover{transform:translateY(-4px);border-color:rgba(201,162,75,.5);box-shadow:0 24px 50px -28px #000}
.svc-pick.selected{
  border-color:var(--or);
  background:linear-gradient(160deg,rgba(201,162,75,.18),var(--anthracite));
  box-shadow:0 24px 50px -28px rgba(201,162,75,.5)
}
.svc-pick .ico{
  width:46px;height:46px;border-radius:12px;display:grid;place-items:center;
  background:rgba(201,162,75,.14);border:1px solid rgba(201,162,75,.34);
  color:var(--or-clair);font-family:var(--serif);font-style:italic;font-size:1.25rem
}
.svc-pick.selected .ico{background:rgba(201,162,75,.28);color:var(--or-clair)}
.svc-pick h3{font-family:var(--serif);font-weight:500;font-size:1.2rem;line-height:1.2}
.svc-pick p{color:var(--texte-doux);font-size:.86rem;margin-top:-.2rem;line-height:1.5}
.svc-pick .check{
  position:absolute;top:1rem;right:1rem;
  width:24px;height:24px;border-radius:50%;
  border:1px solid rgba(201,162,75,.4);display:grid;place-items:center;
  color:var(--or-clair);font-size:.8rem;opacity:0;transition:opacity .25s
}
.svc-pick.selected .check{opacity:1;background:var(--grad-or);color:#1a1408;border-color:var(--or)}

.service-form{
  display:none;animation:formIn .45s cubic-bezier(.2,.7,.2,1) both
}
.service-form.open{display:block}
@keyframes formIn{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}
.service-form-inner{
  background:linear-gradient(160deg,var(--anthracite-2),var(--anthracite));
  border:var(--liseré);border-radius:20px;
  padding:clamp(1.8rem,4vw,2.6rem);margin-top:.4rem
}
.service-form h3.form-title{
  font-family:var(--sans);font-weight:600;font-size:.86rem;
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--or-clair);margin-top:.4rem
}
.service-form h3.form-title:first-of-type{margin-top:0}
.service-form label{
  font-size:.78rem;color:var(--texte-doux);display:flex;flex-direction:column;
  gap:.45rem;letter-spacing:.03em
}
.service-form input,.service-form select,.service-form textarea{
  background:rgba(12,10,7,.7);border:var(--liseré);border-radius:8px;
  padding:.75rem .9rem;color:var(--blanc-casse);font-family:var(--sans);
  font-size:.92rem;width:100%;outline:none;
  transition:border-color .2s,box-shadow .2s
}
.service-form input:focus,.service-form select:focus,.service-form textarea:focus{
  border-color:var(--or);box-shadow:0 0 0 3px rgba(201,162,75,.13)
}
.service-form select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%23c9a24b' stroke-width='1.5' fill='none' stroke-linecap='round'/></svg>");background-repeat:no-repeat;background-position:right .9rem center;padding-right:2.4rem}
.service-form textarea{resize:vertical;min-height:100px}
.service-form input::placeholder,.service-form textarea::placeholder{color:var(--texte-faible)}
.form-group{display:grid;gap:1rem;margin:.8rem 0 1.4rem}
.form-group.row2{grid-template-columns:1fr}
@media(min-width:520px){.form-group.row2{grid-template-columns:1fr 1fr}}
.form-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:.6rem}
.form-actions .btn-or, .form-actions .btn-soft{flex:1 1 200px;justify-content:center;text-align:center}
.form-note{font-size:.78rem;color:var(--texte-faible);margin-top:1rem;text-align:center}
.form-note strong{color:var(--or-clair);font-weight:600}

/* Encart confidentiel (Diogène) */
.discret-note{
  background:rgba(201,162,75,.08);border:1px dashed rgba(201,162,75,.35);
  border-radius:12px;padding:1.1rem 1.3rem;display:flex;gap:1rem;
  align-items:flex-start;margin-top:1.6rem
}
.discret-note .ico{
  flex:0 0 auto;width:34px;height:34px;border-radius:50%;
  background:rgba(201,162,75,.14);border:1px solid rgba(201,162,75,.35);
  color:var(--or-clair);display:grid;place-items:center;font-size:.95rem
}
.discret-note p{color:var(--texte-doux);font-size:.86rem;line-height:1.6}
.discret-note p strong{color:var(--or-clair);font-weight:600}

/* ============================================================
   ZONE COULEUR (pages services)
   ============================================================ */
.tag-list{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.2rem}
.tag-list span{
  font-size:.78rem;padding:.45rem 1rem;border-radius:999px;
  border:var(--liseré);color:var(--texte-doux)
}
.tag-list span.or{
  background:rgba(201,162,75,.12);border-color:rgba(201,162,75,.4);color:var(--or-clair)
}
.tag-list a{
  font-size:.82rem;padding:.5rem 1.05rem;border-radius:999px;
  border:var(--liseré);color:var(--texte-doux);transition:background .2s,border-color .2s,color .2s
}
.tag-list a:hover{background:rgba(201,162,75,.12);border-color:rgba(201,162,75,.4);color:var(--or-clair)}
.check-list{list-style:none;display:grid;gap:.6rem;margin:1.3rem 0 0;padding:0}
.check-list li{position:relative;padding-left:1.7rem;color:var(--texte-doux);line-height:1.6}
.check-list li::before{content:"✓";position:absolute;left:0;color:var(--or-clair);font-weight:700}

/* Page header (sans diaporama) — utilisé sur petites pages */
.page-head{
  position:relative;padding:7rem 0 4.5rem;
  background:
    radial-gradient(140% 80% at 50% 0%,rgba(201,162,75,.14),transparent 55%),
    var(--anthracite);
  border-bottom:1px solid rgba(201,162,75,.22)
}
.page-head h1{font-size:clamp(2.4rem,6.5vw,4.4rem);font-weight:400;text-wrap:balance;letter-spacing:-.02em;line-height:1.05;margin-top:.8rem}
.page-head h1 em{font-style:italic;color:var(--or-clair);font-weight:400}
.page-head .lead{color:var(--texte-doux);font-size:clamp(1rem,2vw,1.15rem);margin-top:1.4rem;max-width:60ch;line-height:1.65}


/* ============================================================
   BLOG (liste + articles) + message calculateur "sur devis"
   ============================================================ */

/* --- Liste blog --- */
.blog-grid{display:grid;grid-template-columns:1fr;gap:2rem}
@media(min-width:680px){.blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.blog-grid{grid-template-columns:repeat(3,1fr)}}
.blog-card{display:flex;flex-direction:column;background:var(--anthracite-2);border:var(--liseré);border-radius:var(--r);overflow:hidden;transition:transform .35s ease,border-color .35s ease}
.blog-card:hover{transform:translateY(-4px);border-color:rgba(201,162,75,.5)}
.blog-card-media{display:block;aspect-ratio:16/10;overflow:hidden}
.blog-card-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease}
.blog-card:hover .blog-card-media img{transform:scale(1.05)}
.blog-card-body{display:flex;flex-direction:column;gap:.7rem;padding:1.5rem 1.6rem 1.7rem;flex:1}
.blog-card-cat{align-self:flex-start;font-family:var(--sans);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--or-clair);border:1px solid rgba(201,162,75,.35);border-radius:999px;padding:.25rem .7rem}
.blog-card h2{font-family:var(--serif);font-size:1.4rem;line-height:1.25;margin:0}
.blog-card h2 a{color:var(--blanc-casse);text-decoration:none;transition:color .3s}
.blog-card:hover h2 a{color:var(--or-clair)}
.blog-card p{color:var(--texte-doux);font-size:.92rem;line-height:1.6;margin:0;flex:1}
.blog-card-link{font-family:var(--sans);font-size:.86rem;font-weight:600;color:var(--or-clair);text-decoration:none;margin-top:.3rem}
.blog-card-link span{transition:transform .3s;display:inline-block}
.blog-card:hover .blog-card-link span{transform:translateX(4px)}

/* --- Article --- */
.post .post-wrap{max-width:820px;margin-inline:auto}
.post-hero{border-radius:var(--r);overflow:hidden;border:var(--liseré);margin:0 0 2.4rem;aspect-ratio:16/9;background:var(--anthracite)}
.post-hero img{width:100%;height:100%;object-fit:cover;display:block}
.post-body{font-family:var(--sans);color:var(--blanc-casse);font-size:1.04rem;line-height:1.8}
.post-body > p{color:var(--texte-doux);margin:0 0 1.3rem}
.post-body h2{font-family:var(--serif);font-size:clamp(1.6rem,3.4vw,2.1rem);color:var(--blanc-casse);line-height:1.25;margin:2.6rem 0 1rem}
.post-body h2 em{font-style:italic;color:var(--or-clair)}
.post-body h3{font-family:var(--serif);font-size:1.3rem;color:var(--parchment);margin:1.8rem 0 .7rem}
.post-body p{margin:0 0 1.2rem;color:var(--texte-doux)}
.post-body a{color:var(--or-clair);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(201,162,75,.4);transition:text-decoration-color .3s}
.post-body a:hover{text-decoration-color:var(--or-clair)}
.post-body strong{color:var(--blanc-casse);font-weight:600}
.post-body ul,.post-body ol{margin:0 0 1.4rem;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:.6rem}
.post-body ul li,.post-body ol li{position:relative;padding-left:1.6rem;color:var(--texte-doux)}
.post-body ul li::before{content:"✓";position:absolute;left:0;color:var(--or-clair);font-weight:700}
.post-body ol{counter-reset:li}
.post-body ol li{counter-increment:li}
.post-body ol li::before{content:counter(li);position:absolute;left:0;color:var(--or-clair);font-weight:700;font-family:var(--serif)}
.post-body blockquote{margin:1.6rem 0;padding:1rem 1.4rem;border-left:3px solid var(--or);background:var(--anthracite-2);border-radius:var(--r);color:var(--parchment);font-family:var(--serif);font-size:1.2rem;font-style:italic}

/* Encadré points clés */
.post-keypoints{background:var(--anthracite-2);border:var(--liseré);border-left:3px solid var(--or);border-radius:var(--r);padding:1.4rem 1.6rem;margin:0 0 2.2rem}
.post-keypoints h2{font-family:var(--serif);font-size:1.15rem;margin:0 0 .8rem;color:var(--or-clair)}
.post-keypoints ul{margin:0;list-style:none;padding:0;display:flex;flex-direction:column;gap:.55rem}
.post-keypoints li{position:relative;padding-left:1.6rem;color:var(--texte-doux);font-size:.95rem}
.post-keypoints li::before{content:"✦";position:absolute;left:0;color:var(--or)}

/* FAQ article (natif <details>) */
.post-faq{margin:2.6rem 0 1rem}
.post-faq > h2{font-family:var(--serif);font-size:clamp(1.6rem,3.4vw,2.1rem);margin:0 0 1.2rem}
.post-faq-item{border:var(--liseré);border-radius:var(--r);background:var(--anthracite);margin-bottom:.7rem;overflow:hidden}
.post-faq-item summary{cursor:pointer;list-style:none;padding:1.05rem 1.3rem;font-family:var(--sans);font-weight:600;color:var(--blanc-casse);display:flex;justify-content:space-between;align-items:center;gap:1rem}
.post-faq-item summary::-webkit-details-marker{display:none}
.post-faq-item summary::after{content:"+";color:var(--or-clair);font-size:1.4rem;font-weight:400;transition:transform .3s;flex:0 0 auto}
.post-faq-item[open] summary::after{transform:rotate(45deg)}
.post-faq-a{padding:0 1.3rem 1.15rem;color:var(--texte-doux);line-height:1.7}
.post-faq-a p{margin:0}

/* Pour aller plus loin */
.post-more{margin:2.4rem 0 0;padding:1.5rem 1.6rem;background:var(--anthracite-2);border:var(--liseré);border-radius:var(--r)}
.post-more h2{font-family:var(--serif);font-size:1.25rem;margin:0 0 .8rem;color:var(--or-clair)}
.post-more ul{margin:0;list-style:none;padding:0;display:flex;flex-direction:column;gap:.5rem}
.post-more li{position:relative;padding-left:1.4rem}
.post-more li::before{content:"→";position:absolute;left:0;color:var(--or)}

/* ==== BLOG digeste (BE WEB) : sommaire · exergue · encadré réalisations · zones · programmation ==== */
.post-toc{margin:1.8rem 0 2.2rem;padding:1.15rem 1.5rem;border:var(--liseré);border-radius:var(--r);background:var(--anthracite)}
.post-toc h2{font-family:var(--sans);font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--or-clair);margin:0 0 .6rem}
.post-toc ol{margin:0;padding-left:1.3rem;color:var(--texte-doux);display:flex;flex-direction:column;gap:.35rem}
.post-toc a{color:var(--texte-doux);text-decoration:none;transition:color .2s}
.post-toc a:hover{color:var(--or-clair)}

.post-quote{margin:2.2rem 0;padding:.3rem 0 .3rem 1.4rem;border-left:4px solid var(--or);font-family:var(--serif);font-size:clamp(1.25rem,2.6vw,1.5rem);line-height:1.45;color:var(--blanc-casse)}

.post-realisations{margin:2.8rem 0;padding:2.4rem 1.8rem;text-align:center;background:linear-gradient(160deg,rgba(201,162,75,.12),rgba(201,162,75,.03));border:1px solid rgba(201,162,75,.30);border-radius:calc(var(--r)*1.4)}
.post-realisations .reno-eyebrow{display:inline-block;margin-bottom:.5rem;font-family:var(--sans);font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--or-clair)}
.post-realisations h3{font-family:var(--serif);margin:0 0 .5rem;font-size:clamp(1.4rem,3vw,1.7rem);color:var(--blanc-casse)}
.post-realisations .reno-sub{margin:0 auto 1.4rem;max-width:460px;color:var(--texte-doux);font-size:.95rem}
.post-realisations .reno-buttons{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center}
.post-realisations a.reno-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.4rem;background:var(--or);color:var(--noir);text-decoration:none;font-weight:600;font-size:.95rem;border-radius:999px;transition:transform .18s,box-shadow .18s,background .18s}
.post-realisations a.reno-btn:hover{background:var(--or-clair);color:var(--noir);transform:translateY(-2px);box-shadow:0 8px 22px rgba(201,162,75,.35)}
.post-realisations a.reno-btn span{transition:transform .18s}
.post-realisations a.reno-btn:hover span{transform:translateX(4px)}

.post-zones{margin:2.4rem 0;padding:1.1rem 1.6rem;border-left:3px solid var(--or);background:var(--anthracite-2);border-radius:0 var(--r) var(--r) 0}
.post-zones h3{font-family:var(--serif);margin:0 0 .4rem;font-size:1.15rem;color:var(--or-clair)}
.post-zones p{margin:0;color:var(--texte-doux)}

.publish-gate__locked{margin:2rem 0;padding:1.6rem;text-align:center;border:1px dashed rgba(201,162,75,.4);border-radius:var(--r);color:var(--texte-doux)}
.publish-gate__locked p{margin:0}
.post-more a{color:var(--blanc-casse);text-decoration:none;transition:color .3s}
.post-more a:hover{color:var(--or-clair)}

/* --- Calculateur : message "sur devis" (encombrement lourd / Diogène) --- */
#calc-montant[hidden],#calc-contact[hidden]{display:none}
.calc-result .calc-contact{font-family:var(--serif);font-size:clamp(1.5rem,4vw,2rem);line-height:1.2;color:var(--or-clair);font-weight:600;margin:.2rem 0 .4rem}
.calc-result .calc-contact small{display:block;font-family:var(--sans);font-size:.82rem;font-weight:400;line-height:1.55;color:var(--texte-doux);margin-top:.6rem}

/* ==== DURCISSEMENT MOBILE ==== */
/* Bloc purement additif — colle en fin de styles.css. Conservateur, n'altere pas le desktop. */

/* 1) Garde-fou global anti-debordement : aucun media ne casse la largeur */
img, video, iframe, svg, canvas, .video-vitrine, .video-vitrine video,
.zone-map iframe, .hero-slider img, .hero-static img {
  max-width: 100%;
}
*, *::before, *::after { min-width: 0; } /* evite que les enfants flex/grid forcent un overflow */

/* 2) Longues chaines (emails, tel, URLs) : jamais de depassement */
.topbar-top-info a, .topbar-top-info, .foot-col a, .foot-col ul,
.avis blockquote, .info-box p, .discret-note p, .calc-result .precis {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* 3) Neutralise le risque RTL de .split.reverse une fois en colonne unique */
@media (max-width: 899px){
  .split.reverse{ direction: ltr; }
  .split.reverse > *{ direction: ltr; }
}

/* 4) Cibles tactiles >= 44px (pointeurs grossiers uniquement, desktop intact) */
@media (hover: none) and (pointer: coarse){
  .nav-toggle{ width: 44px; height: 44px; }
  .devis-close{ width: 44px; height: 44px; }
  .ba-nav{ width: 44px; height: 44px; }
  .topbar-top-social a{ width: 36px; height: 36px; } /* masque <760px, mais sur de toute facon */
  /* Dots du carrousel : zone tactile 44px, point visuel inchange */
  .ba-dots{ gap: .25rem; }
  .ba-dot{ position: relative; }
  .ba-dot::after{
    content: ""; position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 44px; height: 44px; border-radius: 50%;
  }
  /* Liens de navigation/footer plus aerés au doigt */
  .foot-col ul{ gap: .9rem; }
  .foot-col a{ display: inline-block; padding: .15rem 0; }
}

/* 5) Palier tablette/grand mobile : on resserre le rythme vertical */
@media (max-width: 760px){
  section{ padding: 3.4rem 0; }
  .cta{ padding: 3.6rem 0; }
  .hero-home{ min-height: 62vh; padding: 4rem 0 3rem; }
  .hero-page{ min-height: 46vh; padding: 3.4rem 0 2.6rem; }
  .page-head{ padding: 4rem 0 2.6rem; }
  .sec-head{ margin-bottom: 2.4rem; }
  .zone-txt{ padding: 2.2rem 1.5rem; }
  .devis-box{ padding: 1.5rem; }
  .footer, footer{ padding: 3.5rem 0 3rem; }
  /* Maps : hauteur correcte sans monopoliser l'ecran */
  .zone-map, .zone-map iframe{ min-height: 300px; }
  .zone-img, .split-img, .split-img img, .why-img{ min-height: 280px; }
  /* Carrousels horizontaux : on garde le snap, on borne les cartes */
  .avis{ flex-basis: min(340px, 86vw); }
  .real-track figure{ flex-basis: min(320px, 84vw); }
}

/* 6) Palier smartphone : typo et paddings fins, actions pleine largeur */
@media (max-width: 480px){
  .wrap{ width: min(1200px, 92vw); }
  section{ padding: 3rem 0; }
  .cta{ padding: 3.2rem 0; }
  .zone-txt{ padding: 1.8rem 1.2rem; }
  .devis-box{ padding: 1.25rem; }
  .svc-card{ padding: 1.8rem 1.4rem 1.6rem; }
  .pas{ padding: 2rem 1.3rem 1.6rem; }
  .avis{ padding: 1.8rem 1.4rem 1.5rem; }

  /* Lisibilite : on detend les letter-spacing les plus serres */
  .kicker{ letter-spacing: .2em; }
  .hero-rassure{ letter-spacing: .16em; }
  .hero-badges span, .fil{ letter-spacing: .14em; }

  /* Formulaires : champs et actions pleine largeur, plus aucun chevauchement */
  .devis-form input, .devis-form select, .devis-form textarea{ width: 100%; }
  .devis-actions a, .form-actions .btn-or, .form-actions .btn-soft,
  .calc-result .actions .btn-or, .calc-result .actions .btn-soft,
  .cta-actions .btn-or, .cta-actions .btn-soft{
    flex: 1 1 100%;
  }
  .hero-cta{ width: 100%; }
  .hero-cta .btn-or, .hero-cta .btn-soft{ flex: 1 1 100%; justify-content: center; text-align: center; }

  /* Boutons un poil plus compacts pour eviter le retour a la ligne du libelle */
  .btn-or, .btn-soft{ padding: .95rem 1.4rem; letter-spacing: .1em; }

  /* Slider avant/apres : un peu plus haut = prise plus facile au doigt */
  .ba{ aspect-ratio: 3/2; }

  /* Topbar : le bandeau infos ne deborde jamais */
  .topbar-top-info{ flex-direction: column; gap: .35rem; }
}

/* 7) Nav mobile : le drawer plein écran (plus haut) gère désormais le scroll interne. */

/* 7bis) "Voir plus" : replie les listes longues sur mobile (data-collapse-mobile).
   Le bouton est injecté par script.js ; tout reste visible au clic. Desktop intact. */
.is-collapsed{display:none !important}
.collapse-more{
  display:none;margin:1.6rem auto 0;width:fit-content;cursor:pointer;
  align-items:center;gap:.5em
}
.collapse-more.show{display:inline-flex}
@media(min-width:761px){ .collapse-more{display:none !important} .is-collapsed{display:revert !important} }

/* 8) Slider/carrousel tactile : confirme le bon comportement au toucher */
.ba{ touch-action: pan-y; }
.avis-track, .real-track{ overscroll-behavior-x: contain; }

/* Ajustement tactile des dots du carrousel (evite le chevauchement des zones de tap) */
@media (hover: none) and (pointer: coarse){
  .ba-dots{ gap: 1.1rem; }
  .ba-dot::after{ width: 40px; height: 40px; }
}