/* ============================================================
   HARVEY LEGAL — Système de design v2
   Typo : DM Serif Display (titres) + Instrument Sans (texte)
   Palette du cabinet : vert sapin · vert sauge · beiges · bruns
   ============================================================ */

/* ---------- 1. Jetons ---------- */
:root{
  /* Palette du cabinet
     vert sauge #5A6E5F · vert sapin #1B3D2F · beige clair #EADFCF · beige naturel #D6C3A8
     beige naturel #D6C3A8 · brun #6B4F3A · brun foncé #3A2E24 */

  --ink:#3A2E24;          /* brun foncé — texte */
  --ink-2:#3D4B38;        /* vert pâle assombri */
  --ink-3:#4B3C2F;        /* brun foncé adouci */

  --forest:#5A6E5F;       /* VERT SAUGE de la charte — surfaces vertes */
  --forest-deep:#1B3D2F;  /* VERT SAPIN de la charte — bandes photo, bouton, chargement */
  --forest-2:#5A6E5F;     /* vert sauge — voiles sur les photos */
  --forest-3:#C9D1BE;     /* sauge très clair */
  --on-sage:#F5EFE4;      /* texte sur le sauge (clair : le sauge est un ton moyen) */
  --on-sage-2:#F2EADC;    /* texte secondaire sur le sauge */
  --sage-label:#F2EADC;   /* petites étiquettes sur le sauge */

  --paper:#EADFCF;        /* beige clair — fond courant */
  --paper-2:#E2D5C0;      /* intermédiaire */
  --paper-3:#D6C3A8;      /* beige naturel — bandes chaudes */

  --bronze:#6B4F3A;       /* brun — accents sur fond clair */
  --bronze-2:#7F684E;     /* bronze du logo */
  --bronze-3:#E6D9C3;     /* crème chaude — petites étiquettes sur fond vert */
  --bronze-4:#D6C3A8;     /* beige naturel — grands accents sur fond vert */
  --bronze-pale:#E3D6C2;

  --muted:#5C4E42;
  --muted-light:#7E6F60;
  --muted-2:#E0D7C7;

  --line:rgba(58,46,36,.18);
  --line-2:rgba(58,46,36,.09);
  --line-light:rgba(234,223,207,.22);

  --serif:"Libre Bodoni",'Times New Roman',Georgia,serif;   /* grands titres en capitales */
  --sans:"Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif; /* tout le reste */

  --e:cubic-bezier(.19,1,.22,1);
  --e2:cubic-bezier(.65,.05,.36,1);

  --pad:clamp(22px,5vw,84px);
  --gap:clamp(24px,3.2vw,48px);
  --sec:clamp(84px,11.5vw,200px);
  --r-pill:999px;
  --r-card:clamp(14px,1.5vw,22px);
  --r-soft:clamp(10px,1vw,16px);
  --maxw:1560px;
  --hdr:clamp(74px,7.6vw,110px);
}

/* ---------- 2. Base ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:400;
  font-size:clamp(16px,1.04vw,17.5px);
  line-height:1.66;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit;background:none;border:none}
button{cursor:pointer}
::selection{background:var(--bronze);color:var(--paper)}

/* grain imprimé */
body::after{
  content:"";position:fixed;inset:0;z-index:9998;pointer-events:none;
  opacity:.3;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)' opacity='.34'/%3E%3C/svg%3E");
}
@media (prefers-reduced-motion:reduce){body::after{display:none}}

/* ---------- 3. Structure ---------- */
.shell{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}
.sec{padding-block:var(--sec)}
.sec--tight{padding-block:clamp(52px,6.6vw,104px)}
.rule{height:1px;background:var(--line);border:0}
.dark{background:var(--forest);color:var(--on-sage)}
.dark .rule{background:var(--line-light)}
.tone{background:var(--paper-2)}
.sand{background:var(--paper-3)}

.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap) clamp(14px,1.7vw,26px)}
@media(max-width:900px){.grid{grid-template-columns:repeat(6,1fr)}}

/* ---------- 4. Typographie ---------- */
.d1,.d2,h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:-.004em}
.d3,.d4,h3{font-family:var(--sans);font-weight:500;letter-spacing:-.008em}
.d1{font-size:clamp(1.85rem,4.3vw,4.5rem);line-height:1.14;text-transform:uppercase;letter-spacing:.018em}
.d2{font-size:clamp(1.5rem,3.1vw,3rem);line-height:1.16;text-transform:uppercase;letter-spacing:.02em}
.d3{font-size:clamp(1.3rem,2vw,1.95rem);line-height:1.26}
.d4{font-size:clamp(1.05rem,1.3vw,1.25rem);line-height:1.34}
/* sur-titre en italique, à la manière des grands hôtels */
.over{font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:clamp(1.12rem,1.75vw,1.8rem);line-height:1.3;color:var(--muted-light);
  letter-spacing:.004em}
.cta .over{color:var(--bronze-4)}
.dark .over,.ph--dark .over{color:var(--bronze-4)}
em,.it{font-style:italic}
.accent{color:var(--bronze)}
.cta .accent{color:var(--bronze-3)}
.dark .accent,.ph--dark .accent{color:var(--sage-label)}

.eyebrow{
  font-family:var(--sans);
  font-size:clamp(12px,.82vw,13.4px);font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--bronze);display:inline-flex;align-items:center;gap:.85em;
}
.eyebrow::before{content:"";width:clamp(16px,2.2vw,30px);height:1px;background:currentColor;opacity:.8}
.eyebrow--plain::before{display:none}
.cta .eyebrow{color:var(--bronze-3)}
.dark .eyebrow,.ph--dark .eyebrow{color:var(--sage-label)}

.lead{font-family:var(--sans);font-size:clamp(1.06rem,1.26vw,1.34rem);line-height:1.56;color:var(--ink-3);max-width:58ch}
.cta .lead{color:rgba(234,223,207,.8)}
.dark .lead,.ph--dark .lead{color:var(--on-sage-2)}
p+p{margin-top:1em}
.muted{color:var(--muted)}
.dark .muted,.ph--dark .muted{color:var(--on-sage-2)}
.small{font-size:clamp(14.5px,.94vw,15.6px);line-height:1.6}
.num{font-family:var(--sans);font-size:clamp(12px,.8vw,13.2px);font-weight:600;letter-spacing:.1em;
  color:var(--bronze);font-variant-numeric:tabular-nums}
.dark .num,.ph--dark .num{color:var(--sage-label)}
.maxch{max-width:64ch}

/* ---------- 5. Boutons & liens ---------- */
.btn{
  font-family:var(--sans);
  position:relative;display:inline-flex;align-items:center;gap:.8em;overflow:hidden;
  padding:clamp(13px,1.05vw,16px) clamp(24px,2vw,34px);
  border-radius:var(--r-pill);
  border:1px solid rgba(58,46,36,.2);
  background:rgba(234,223,207,.5);
  -webkit-backdrop-filter:blur(14px) saturate(160%);
  backdrop-filter:blur(14px) saturate(160%);
  color:var(--ink);
  font-size:clamp(12.6px,.84vw,13.8px);font-weight:600;letter-spacing:.07em;text-transform:uppercase;
  transition:color .5s var(--e),border-color .5s var(--e),transform .5s var(--e),box-shadow .5s var(--e);
}
.btn span{position:relative;z-index:2;display:inline-flex;align-items:center;gap:.75em}
.btn::before{content:"";position:absolute;inset:0;background:var(--forest-deep);z-index:1;
  opacity:0;transition:opacity .45s var(--e)}
.btn:hover{color:var(--paper);border-color:transparent;transform:translateY(-2px);
  box-shadow:0 14px 34px -18px rgba(58,46,36,.6)}
.btn:hover::before{opacity:1}
.btn:active{transform:translateY(0)}
.btn .ar{width:17px;height:9px;transition:transform .5s var(--e)}
.btn:hover .ar{transform:translateX(5px)}

.btn--solid{background:var(--forest-deep);color:var(--paper);border-color:transparent}
.btn--solid::before{background:var(--bronze);}
.btn--solid:hover{color:var(--paper);border-color:transparent}
.btn--bronze{border-color:rgba(107,79,58,.45);color:var(--bronze)}
.btn--bronze::before{background:var(--bronze)}
.btn--bronze:hover{color:var(--paper)}

/* sur fond sombre ou photo : verre clair */
.dark .btn,.cta .btn,.ph--dark .btn,.feature .btn,.banner .btn{
  border-color:rgba(234,223,207,.3);color:var(--paper);
  background:rgba(234,223,207,.12);
  -webkit-backdrop-filter:blur(16px) saturate(150%);
  backdrop-filter:blur(16px) saturate(150%);
}
.dark .btn::before,.cta .btn::before,.ph--dark .btn::before,.feature .btn::before{background:var(--paper)}
.dark .btn:hover,.cta .btn:hover,.ph--dark .btn:hover,.feature .btn:hover{
  color:var(--forest-deep);border-color:transparent;box-shadow:0 14px 34px -18px rgba(0,0,0,.7)}
.dark .btn--solid,.cta .btn--solid,.ph--dark .btn--solid{
  background:rgba(234,223,207,.94);color:var(--forest-deep);border-color:transparent}
.dark .btn--solid::before,.cta .btn--solid::before,.ph--dark .btn--solid::before{background:var(--bronze)}
.dark .btn--solid:hover,.cta .btn--solid:hover,.ph--dark .btn--solid:hover{color:var(--paper)}

.lk{
  font-family:var(--sans);
  position:relative;display:inline-flex;align-items:center;gap:.65em;
  font-size:clamp(12.6px,.84vw,13.8px);font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  padding-bottom:8px;
}
.lk::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;
  transform-origin:right;transform:scaleX(1);transition:transform .45s var(--e)}
.lk:hover::after{transform-origin:left;animation:lkdraw .7s var(--e)}
@keyframes lkdraw{0%{transform:scaleX(1);transform-origin:right}49%{transform:scaleX(0);transform-origin:right}
  51%{transform:scaleX(0);transform-origin:left}100%{transform:scaleX(1);transform-origin:left}}
.lk .ar{width:16px;height:9px;transition:transform .45s var(--e)}
.lk:hover .ar{transform:translateX(5px)}

/* ---------- 6. En-tête ---------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:900;
  transition:transform .55s var(--e),background-color .45s ease}
.hdr__in{height:var(--hdr);display:flex;align-items:center;justify-content:space-between;gap:var(--gap);
  border-bottom:1px solid transparent;transition:height .45s var(--e),border-color .45s ease}
.hdr.is-stuck{background:rgba(234,223,207,.72);
  -webkit-backdrop-filter:blur(20px) saturate(170%);backdrop-filter:blur(20px) saturate(170%)}
.hdr.is-stuck .hdr__in{height:clamp(62px,5.4vw,78px);border-bottom-color:var(--line)}

.brand{display:flex;align-items:center;flex:0 0 auto}
.brand img{height:clamp(42px,4.2vw,60px);width:auto;transition:height .45s var(--e)}
.hdr.is-stuck .brand img{height:clamp(34px,3.2vw,44px)}
.brand__alt{display:none}

.nav{display:flex;align-items:center;gap:clamp(20px,2.2vw,38px)}
.nav a{font-family:var(--sans);position:relative;font-size:clamp(14px,.94vw,15.4px);font-weight:500;letter-spacing:.02em;
  padding-block:6px;white-space:nowrap}
.nav a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--bronze);
  transform:scaleX(0);transform-origin:right;transition:transform .45s var(--e)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.nav a[aria-current="page"]{color:var(--bronze)}
.hdr.on-dark:not(.is-stuck) .nav a[aria-current="page"]{color:var(--bronze-3)}
.hdr__right{display:flex;align-items:center;gap:clamp(14px,1.6vw,26px)}
.hdr .btn{padding:12px 22px}
@media(max-width:1100px){.nav,.hdr .btn{display:none}}

/* pastille téléphone — affichée en permanence, à toutes les largeurs */
.telpill,.telfix{display:inline-flex;align-items:center;gap:9px;
  font-family:var(--sans);font-size:clamp(14px,.95vw,15.4px);font-weight:600;
  letter-spacing:.01em;font-variant-numeric:tabular-nums;white-space:nowrap;
  padding:10px 18px;border-radius:var(--r-pill);border:1px solid var(--line);
  background:rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);
  transition:background-color .4s var(--e),border-color .4s var(--e),color .4s var(--e),
    opacity .45s var(--e),transform .45s var(--e)}
.telpill:hover,.telfix:hover{background:var(--forest);border-color:var(--forest);color:var(--on-sage)}
.ph-ic{width:15px;height:15px;flex:0 0 auto;opacity:.75}
.telpill:hover .ph-ic,.telfix:hover .ph-ic{opacity:1}
.hdr.on-dark:not(.is-stuck) .telpill{border-color:rgba(234,223,207,.4);
  background:rgba(234,223,207,.13);color:var(--paper)}

/* au-dessus du hero, la barre est rétractée : le numéro reste seul à l'écran */
.telfix{position:fixed;z-index:901;top:clamp(15px,2.1vh,26px);right:var(--pad);
  color:var(--paper);border-color:rgba(234,223,207,.42);background:rgba(27,34,28,.32);
  box-shadow:0 18px 50px -28px rgba(0,0,0,.7)}
.hdr--float.is-on ~ .telfix{opacity:0;transform:translateY(-10px);pointer-events:none}
body.menu-open .telfix{opacity:0;pointer-events:none}
@media(max-width:560px){.telpill,.telfix{gap:7px;padding:9px 14px;font-size:13.6px}}

.burger{display:none;width:44px;height:44px;margin-right:-10px;position:relative;z-index:1002}
.burger i{position:absolute;left:11px;width:22px;height:1px;background:currentColor;
  transition:transform .45s var(--e),opacity .3s}
.burger i:nth-child(1){top:19px}
.burger i:nth-child(2){top:25px}
body.menu-open .burger{color:var(--paper)}
body.menu-open .burger i:nth-child(1){transform:translateY(3px) rotate(45deg)}
body.menu-open .burger i:nth-child(2){transform:translateY(-3px) rotate(-45deg)}
@media(max-width:1100px){.burger{display:block}}

.menu{position:fixed;inset:0;z-index:999;background:var(--forest);color:var(--on-sage);
  display:flex;flex-direction:column;justify-content:center;padding:var(--hdr) var(--pad) 36px;
  clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--e);pointer-events:none;overflow-y:auto}
body.menu-open .menu{clip-path:inset(0 0 0 0);pointer-events:auto}
.menu__list{display:flex;flex-direction:column;gap:clamp(2px,.8vw,8px);list-style:none}
.menu__list a{font-family:var(--serif);text-transform:uppercase;letter-spacing:.02em;
  font-size:clamp(1.5rem,6.6vw,2.5rem);line-height:1.3;display:block;overflow:hidden}
.menu__list a>span{display:block;transform:translateY(105%);transition:transform .7s var(--e)}
body.menu-open .menu__list a>span{transform:translateY(0)}
.menu__list li:nth-child(1) span{transition-delay:.16s}
.menu__list li:nth-child(2) span{transition-delay:.22s}
.menu__list li:nth-child(3) span{transition-delay:.28s}
.menu__list li:nth-child(4) span{transition-delay:.34s}
.menu__list li:nth-child(5) span{transition-delay:.40s}
.menu__list li:nth-child(6) span{transition-delay:.46s}
.menu__list a .idx{font-family:var(--sans);font-size:12.8px;font-weight:600;letter-spacing:.1em;
  color:var(--sage-label);vertical-align:super;margin-right:14px;font-style:normal}
.menu__cta{margin-top:clamp(26px,4vw,40px)}
.menu__foot{margin-top:clamp(28px,5vw,54px);padding-top:24px;border-top:1px solid var(--line-light);
  display:flex;flex-wrap:wrap;gap:8px 30px;justify-content:space-between;
  font-size:14.8px;color:var(--on-sage-2);opacity:0;transition:opacity .5s ease .5s}
body.menu-open .menu__foot{opacity:1}
body.menu-open{overflow:hidden}

.hdr.on-dark:not(.is-stuck){color:var(--paper)}
.hdr.on-dark:not(.is-stuck) .brand__main{display:none}
.hdr.on-dark:not(.is-stuck) .brand__alt{display:block}

/* ---------- 7. Révélations (si JS) ---------- */
[data-rv]{--d:0ms}
.js [data-rv="up"]{opacity:0;transform:translateY(24px);transition:opacity .9s var(--e) var(--d),transform .9s var(--e) var(--d)}
.js [data-rv="fade"]{opacity:0;transition:opacity 1.1s ease var(--d)}
.js [data-rv="clip"]{clip-path:inset(0 0 100% 0);transition:clip-path 1.1s var(--e) var(--d)}
.js [data-rv="line"]{transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--e) var(--d)}
.js [data-rv].is-in{opacity:1;transform:none;clip-path:inset(0 0 0 0)}
.ln{display:block;overflow:hidden;padding:.12em 0 .09em;margin:-.12em 0 -.09em}
.js .ln>span{display:block;transform:translateY(122%);transition:transform 1s var(--e) var(--d,0ms)}
.js .is-in .ln>span,.js .ln.is-in>span{transform:translateY(0)}
@media (prefers-reduced-motion:reduce){
  .js [data-rv],.js [data-rv].is-in{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
  .js .ln>span{transform:none!important;transition:none!important}
}

/* ---------- 8. Média ---------- */
.fig{position:relative;overflow:hidden;background:var(--paper-3);border-radius:var(--r-card)}
.fig img{width:100%;height:100%;object-fit:cover;filter:grayscale(.22) contrast(1.03) saturate(.94);
  transition:transform 1.4s var(--e),filter .9s ease}
.js .fig img{transform:scale(1.06)}
.js .fig.is-in img,.js .is-in .fig img{transform:scale(1)}
.fig::after{content:"";position:absolute;inset:0;background:var(--forest-2);mix-blend-mode:multiply;opacity:.16;
  transition:opacity .8s ease;pointer-events:none}
.fig::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(58,46,36,.1),rgba(58,46,36,0) 42%,rgba(58,46,36,.16))}
a:hover>.fig::after,.card:hover .fig::after{opacity:.06}
a:hover>.fig img,.card:hover .fig img{transform:scale(1.045)}
.fig--plain::after{opacity:0}
.fig--plain img{filter:none}
.ratio-43{aspect-ratio:4/3}
.ratio-11{aspect-ratio:1/1}
.ratio-34{aspect-ratio:3/4}
.ratio-169{aspect-ratio:16/9}
.ratio-3216{aspect-ratio:32/13}
@media(max-width:760px){.ratio-3216{aspect-ratio:4/3}.ratio-34{aspect-ratio:4/5}}

/* emplacement photo (démo) */
.slot{position:relative;display:grid;place-items:center;background:var(--paper-2);
  border:1px solid var(--line);overflow:hidden;border-radius:var(--r-card)}
.dark .slot,.slot--dark{background:rgba(27,61,47,.5);border-color:var(--line-light)}
.slot img{width:34%;max-width:190px;opacity:.15;filter:grayscale(1)}
.slot figcaption{font-family:var(--sans);position:absolute;left:0;right:0;bottom:16px;text-align:center;
  font-size:12.2px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-light)}
.slot::after{content:"";position:absolute;inset:14px;border:1px solid var(--line);pointer-events:none;border-radius:calc(var(--r-card) - 6px)}
.dark .slot::after,.slot--dark::after{border-color:var(--line-light)}

/* ---------- 9. Bandeau image + introduction centrée ---------- */
.hdr--solid{background:var(--paper)}
.hdr--float{transform:translateY(-104%)}
.hdr--float.is-on{transform:translateY(0)}
.hdr--float:focus-within{transform:translateY(0)}
.hdr--solid .hdr__in{border-bottom-color:var(--line)}

.banner{position:relative;overflow:hidden;background:var(--forest-deep);
  margin-top:var(--hdr);height:clamp(300px,58vh,700px)}
.banner__media{position:absolute;inset:0;z-index:0}
.banner__media picture{display:block;width:100%;height:100%}
.banner__media img{width:100%;height:100%;object-fit:cover}
.banner__media::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(58,46,36,.5) 0%,rgba(58,46,36,.14) 26%,
    rgba(58,46,36,.18) 58%,rgba(58,46,36,.74) 100%)}
.banner__media::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:var(--forest-2);mix-blend-mode:color;opacity:.18}

/* variante « ouverture » : pleine hauteur, logo par-dessus */
.banner--hero{margin-top:0;height:auto;min-height:74svh;
  display:flex;align-items:center;justify-content:center}
.banner__brand{position:relative;z-index:4;text-align:center;
  padding:clamp(56px,9vh,104px) var(--pad)}
.banner__brand img{height:clamp(104px,14.5vw,228px);width:auto;margin:0 auto;
  filter:drop-shadow(0 12px 40px rgba(58,46,36,.5))}
.banner__brand p i{font-style:normal}
.banner__brand p{margin-top:clamp(20px,2.4vw,34px);font-family:var(--sans);
  font-size:clamp(12px,.88vw,14px);font-weight:500;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(234,223,207,.74)}

.banner__bar{position:absolute;left:50%;bottom:clamp(20px,3vh,38px);z-index:4;
  transform:translateX(-50%);display:flex;justify-content:center;align-items:center;
  gap:clamp(14px,1.8vw,30px);max-width:calc(100% - var(--pad) * 2);
  padding:clamp(11px,1.1vw,15px) clamp(20px,2vw,32px);border-radius:var(--r-pill);
  background:rgba(234,223,207,.11);border:1px solid rgba(234,223,207,.2);
  -webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);
  box-shadow:0 18px 50px -28px rgba(0,0,0,.7);
  font-family:var(--sans);font-size:12.4px;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(234,223,207,.94);white-space:nowrap}
.banner__bar i{display:block;width:clamp(28px,4vw,62px);height:1px;background:rgba(234,223,207,.42)}
.banner__bar a{position:relative;padding-bottom:3px}
.banner__bar a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:currentColor;opacity:.6;transform-origin:right;transition:transform .45s var(--e)}
.banner__bar a:hover::after{transform:scaleX(0)}

.intro{text-align:center;padding-block:clamp(52px,6.6vw,104px) clamp(26px,3vw,44px)}
.intro .over{display:block;margin-bottom:clamp(4px,.7vw,10px)}
.intro h1{max-width:none}
.intro__txt{max-width:min(100%,980px);margin:clamp(24px,2.8vw,40px) auto 0;color:var(--muted);
  font-size:clamp(17px,1.22vw,21px);line-height:1.66}
.intro .row{justify-content:center;margin-top:clamp(26px,3vw,42px)}
.intro__meta{margin-top:clamp(28px,3.2vw,46px);padding-top:clamp(20px,2.2vw,28px);
  border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:center;
  gap:12px clamp(22px,3vw,54px);font-family:var(--sans);font-size:12.8px;font-weight:500;
  letter-spacing:.11em;text-transform:uppercase;color:var(--muted-light)}
.intro__meta b{font-weight:600;color:var(--bronze)}

/* ---------- 10. En-tête de page ---------- */
.ph{position:relative;text-align:center;overflow:hidden;
  padding-block:calc(var(--hdr) + clamp(44px,5.6vw,88px)) clamp(30px,3.8vw,56px)}
.ph--dark{background:var(--forest);color:var(--on-sage)}
.ph .over{display:block;margin-bottom:clamp(4px,.7vw,10px)}
.ph h1{max-width:none}
.ph .lead{margin:clamp(22px,2.6vw,36px) auto 0;max-width:min(100%,880px);text-align:center}
.ph__meta{margin-top:clamp(24px,3vw,42px);padding-top:18px;border-top:1px solid var(--line)}
.ph--dark .ph__meta{border-color:var(--line-light)}
.crumb{font-family:var(--sans);font-size:13.4px;font-weight:500;letter-spacing:.04em;color:var(--muted)}
.crumb a:hover{color:var(--bronze)}
.ph--dark .crumb{color:var(--on-sage-2)}

/* ---------- 11. Bande défilante ---------- */
.marq{overflow:hidden;border-block:1px solid var(--line);padding-block:clamp(15px,1.5vw,23px);background:var(--paper)}
.dark .marq,.marq--dark{background:var(--ink);border-color:var(--line-light)}
.marq__track{display:flex;width:max-content;animation:marq 46s linear infinite}
.marq__track>span{display:inline-flex;align-items:center;gap:clamp(24px,3.4vw,54px);
  padding-right:clamp(24px,3.4vw,54px);font-family:var(--serif);text-transform:uppercase;
  letter-spacing:.02em;font-size:clamp(1rem,1.9vw,1.75rem);white-space:nowrap}
.marq__track b{font-weight:400}
.marq__track i{font-style:normal;color:var(--bronze);font-size:.42em;transform:translateY(-.2em)}
@keyframes marq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marq__track{animation:none}}

/* ---------- 11b. Titre de section centré ---------- */
.sec-head{text-align:center;max-width:min(100%,920px);margin:0 auto clamp(40px,5.2vw,88px)}
.sec-head .over{display:block;margin-bottom:clamp(4px,.7vw,10px)}
.sec-head h2{font-family:var(--serif);font-weight:400;text-transform:uppercase;letter-spacing:.02em;
  line-height:1.16;font-size:clamp(1.5rem,3.1vw,3rem)}
.sec-head p{margin:clamp(18px,2.1vw,30px) auto 0;max-width:60ch;color:var(--muted);
  font-size:clamp(16px,1.06vw,18.5px);line-height:1.66}
.dark .sec-head p{color:var(--on-sage-2)}
.sec-foot{text-align:center;margin-top:clamp(34px,3.8vw,60px)}

/* ---------- 11c. Section pleine largeur, image de fond ---------- */
.feature{position:relative;overflow:hidden;color:var(--paper);background:var(--forest-deep)}
.feature__bg{position:absolute;inset:0;z-index:0}
.feature__bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(.12) contrast(1.02) brightness(1.03)}
.feature__bg::after{content:"";position:absolute;inset:0;background:var(--forest-2);mix-blend-mode:multiply;opacity:.56}
.feature__bg::before{content:"";position:absolute;inset:0;z-index:2;
  background:radial-gradient(84% 98% at 50% 48%,rgba(30,45,34,.42),rgba(30,45,34,.66))}
.feature .shell{position:relative;z-index:3}
.feature__in{text-align:center;display:flex;flex-direction:column;align-items:center;
  gap:clamp(16px,2vw,28px);padding-block:clamp(92px,12.5vw,220px)}
.feature h2{font-family:var(--serif);font-weight:400;text-transform:uppercase;letter-spacing:.02em;
  line-height:1.16;font-size:clamp(1.55rem,3.4vw,3.3rem);max-width:none}
.feature p{max-width:54ch;color:rgba(234,223,207,.84);font-size:clamp(16.5px,1.1vw,19px);line-height:1.64}
.feature .over{color:var(--bronze-4)}
.feature__list{display:flex;flex-wrap:wrap;justify-content:center;gap:9px clamp(14px,2vw,30px);
  max-width:66ch;margin-top:clamp(4px,.8vw,10px);
  font-family:var(--sans);font-size:12.6px;font-weight:500;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(234,223,207,.7)}
.feature .btn{border-color:rgba(234,223,207,.36);color:var(--paper);margin-top:clamp(8px,1vw,14px)}
.feature .btn::before{background:var(--paper)}
.feature .btn:hover{color:var(--forest-deep);border-color:var(--paper)}

/* ---------- 12. Liste de services ---------- */
.svc{border-top:1px solid var(--line)}
.dark .svc{border-color:var(--line-light)}
.svc__row{position:relative;display:grid;align-items:center;
  grid-template-columns:auto minmax(0,1.05fr) minmax(0,.95fr) auto;
  gap:clamp(16px,2.2vw,36px);padding-block:clamp(20px,2.5vw,36px);
  border-bottom:1px solid var(--line);transition:padding-left .55s var(--e)}
.dark .svc__row{border-color:var(--line-light)}
.svc__row:hover{padding-left:clamp(8px,1.4vw,24px)}
.svc__row h3{font-family:var(--sans);font-weight:500;font-size:clamp(1.2rem,2.1vw,2.05rem);
  line-height:1.2;letter-spacing:-.012em;transition:color .4s ease}
.svc__row:hover h3{color:var(--bronze)}
.dark .svc__row:hover h3{color:var(--bronze-3)}
.svc__row p{max-width:46ch;font-size:clamp(15px,.98vw,16.4px);color:var(--muted);line-height:1.55}
.dark .svc__row p{color:var(--on-sage-2)}
.svc__row .num{align-self:flex-start;padding-top:.7em}
.svc__arrow{width:40px;height:40px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;
  background:rgba(234,223,207,.45);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  transition:background .45s var(--e),border-color .45s var(--e),transform .45s var(--e)}
.dark .svc__arrow{border-color:var(--line-light)}
.svc__row:hover .svc__arrow{background:var(--bronze);border-color:var(--bronze);transform:rotate(-45deg)}
.svc__arrow svg{width:14px;height:8px;transition:stroke .45s ease}
.svc__row:hover .svc__arrow svg{stroke:var(--paper)}
@media(max-width:880px){
  .svc__row{grid-template-columns:auto minmax(0,1fr);gap:10px 18px}
  .svc__arrow{display:none}
  .svc__row p{grid-column:2}
  .svc__row .num{padding-top:.45em}
}
.follow{position:fixed;top:0;left:0;z-index:60;width:clamp(220px,20vw,320px);aspect-ratio:4/5;
  pointer-events:none;overflow:hidden;border-radius:var(--r-card);opacity:0;transform:translate(-50%,-50%) scale(.92);
  transition:opacity .45s var(--e),transform .55s var(--e)}
.follow.is-on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.follow img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
  filter:grayscale(.2) contrast(1.02);transition:opacity .45s ease}
.follow img.is-on{opacity:1}
.follow::after{content:"";position:absolute;inset:0;background:var(--forest-2);mix-blend-mode:multiply;opacity:.14}
@media(hover:none),(max-width:1024px){.follow{display:none}}

.svc--plain .svc__row{grid-template-columns:auto minmax(0,1fr) auto}
.svc--plain .svc__row h3{font-size:clamp(1.25rem,2.3vw,2.2rem)}
@media(max-width:880px){.svc--plain .svc__row{grid-template-columns:auto minmax(0,1fr)}}

/* pilier cliquable */
a.pillar{display:block;transition:border-color .45s var(--e)}
a.pillar:hover{border-color:var(--bronze)}
a.pillar h3{transition:color .4s ease}
a.pillar:hover h3{color:var(--bronze)}
.dark a.pillar:hover h3{color:var(--sage-label)}
.pillar__lk{display:inline-flex;align-items:center;gap:.6em;margin-top:clamp(14px,1.6vw,20px);
  font-family:var(--sans);font-size:12.6px;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;color:var(--bronze);
  opacity:.75;transition:opacity .4s ease,transform .45s var(--e)}
.dark .pillar__lk{color:var(--sage-label)}
a.pillar:hover .pillar__lk{opacity:1;transform:translateX(3px)}
.pillar__lk .ar{width:15px;height:9px}

/* liste à puces courtes */
.ticks{list-style:none;display:grid;gap:clamp(11px,1.1vw,15px);counter-reset:tick}
.ticks li{position:relative;padding-left:28px;font-size:clamp(15.8px,1.04vw,17.2px);line-height:1.56}
.ticks li::before{content:"";position:absolute;left:0;top:.72em;width:13px;height:1px;background:var(--bronze)}
.dark .ticks li::before{background:var(--sage-label)}
.ticks--num li{padding-left:38px;counter-increment:tick}
.ticks--num li::before{content:counter(tick,decimal-leading-zero);top:0;width:auto;height:auto;
  background:none;font-family:var(--sans);font-size:12.4px;font-weight:600;
  letter-spacing:.08em;color:var(--bronze);padding-top:.25em}

/* liste de liens externes */
.deflist--links dt{text-transform:none;letter-spacing:0;font-size:clamp(15px,1vw,16.5px);
  font-weight:600;color:var(--ink);padding-top:0}
.deflist--links dt a{position:relative;transition:color .35s ease}
.deflist--links dt a::after{content:"↗";margin-left:.45em;font-size:.82em;color:var(--bronze);
  display:inline-block;transition:transform .4s var(--e)}
.deflist--links dt a:hover{color:var(--bronze)}
.deflist--links dt a:hover::after{transform:translate(2px,-2px)}
.deflist--links dd{color:var(--muted)}

/* pilier centré */
.pillar--center{text-align:center}
.pillar--center p{margin-inline:auto;max-width:34ch}

/* ---------- 13. Cartes ---------- */
.card{position:relative;display:flex;flex-direction:column;gap:16px}
.card h3{font-size:clamp(1.15rem,1.5vw,1.45rem);line-height:1.3}
.cards{display:grid;gap:var(--gap) clamp(20px,2.3vw,38px)}
.cards--2{grid-template-columns:repeat(2,1fr)}
.cards--3{grid-template-columns:repeat(3,1fr)}
.cards--4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1000px){.cards--3,.cards--4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:660px){.cards--2,.cards--3,.cards--4{grid-template-columns:1fr}}

.pillar{padding-top:24px;border-top:1px solid var(--line)}
.dark .pillar{border-color:var(--line-light)}
.pillar .num{display:block;margin-bottom:clamp(14px,1.8vw,26px)}
.pillar h3{font-size:clamp(1.08rem,1.35vw,1.32rem);line-height:1.34;margin-bottom:10px}
.pillar p{font-size:clamp(15.5px,1vw,16.8px);color:var(--muted);line-height:1.62}
.dark .pillar p{color:var(--on-sage-2)}

/* ---------- 14. Accordéon ---------- */
.acc{border-top:1px solid var(--line)}
.acc__item{border-bottom:1px solid var(--line)}
.acc__btn{width:100%;display:flex;align-items:flex-start;gap:clamp(14px,2.2vw,38px);text-align:left;
  padding-block:clamp(19px,2.2vw,30px)}
.acc__btn h3{flex:1;font-size:clamp(1.12rem,1.6vw,1.55rem);line-height:1.3;transition:color .4s ease}
.acc__btn:hover h3{color:var(--bronze)}
.acc__btn .num{padding-top:.55em}
.acc__ico{position:relative;width:15px;height:15px;flex:0 0 auto;margin-top:.6em}
.acc__ico::before,.acc__ico::after{content:"";position:absolute;left:0;top:7px;width:15px;height:1px;
  background:currentColor;transition:transform .5s var(--e)}
.acc__ico::after{transform:rotate(90deg)}
.acc__item.is-open .acc__ico::after{transform:rotate(0)}
.acc__item.is-open h3{color:var(--bronze)}
.acc__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--e)}
.acc__item.is-open .acc__body{grid-template-rows:1fr}
.acc__body>div{overflow:hidden}
.acc__inner{padding:0 0 clamp(24px,2.4vw,38px) clamp(30px,4.2vw,70px);max-width:76ch}
.acc__inner ul{list-style:none;margin-top:18px;display:grid;gap:9px}
.acc__inner li{position:relative;padding-left:24px;font-size:clamp(15.5px,1vw,16.8px);color:var(--muted);line-height:1.55}
.acc__inner li::before{content:"";position:absolute;left:0;top:.8em;width:10px;height:1px;background:var(--bronze)}
@media(max-width:660px){.acc__inner{padding-left:0}}

/* ---------- 15. Blocs ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,4.6vw,88px);align-items:center}
.split--start{align-items:start}
@media(max-width:880px){.split{grid-template-columns:1fr;gap:clamp(26px,5vw,44px)}}

.stat{display:flex;flex-direction:column;gap:6px}
.stat b{font-family:var(--serif);font-weight:400;font-size:clamp(2.3rem,4.1vw,3.7rem);line-height:1;
  font-variant-numeric:tabular-nums}
.stat span{font-family:var(--sans);font-size:12.8px;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--muted-light)}
.dark .stat span{color:var(--on-sage-2)}

.quote{font-family:var(--sans);font-weight:300;font-size:clamp(1.3rem,2.3vw,2rem);
  line-height:1.42;letter-spacing:-.012em}
.quote__by{font-family:var(--sans);margin-top:clamp(20px,2.4vw,32px);font-size:12.8px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--bronze)}
.dark .quote__by{color:var(--sage-label)}

.deflist{display:grid}
.deflist>div{display:grid;grid-template-columns:minmax(150px,200px) 1fr;gap:clamp(14px,1.8vw,30px);
  padding-block:clamp(16px,1.6vw,23px);border-bottom:1px solid var(--line)}
.deflist>div:first-child{border-top:1px solid var(--line)}
.dark .deflist>div{border-color:var(--line-light)}
.deflist dt{font-family:var(--sans);font-size:12.8px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--bronze);padding-top:.35em}
.dark .deflist dt{color:var(--sage-label)}
.deflist dd{font-size:clamp(15.5px,1.02vw,17px);line-height:1.58}
@media(max-width:600px){.deflist>div{grid-template-columns:1fr;gap:5px}}

.taglist{display:flex;flex-wrap:wrap;gap:8px}
.taglist span{font-family:var(--sans);border:1px solid var(--line);border-radius:var(--r-pill);
  padding:8px 17px;font-size:12.8px;font-weight:500;letter-spacing:.06em;color:var(--muted);
  background:rgba(234,223,207,.5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.dark .taglist span{border-color:var(--line-light);color:var(--on-sage-2)}

.price{display:flex;flex-direction:column;gap:clamp(16px,1.9vw,26px);padding:clamp(24px,2.6vw,42px);
  border:1px solid var(--line);background:rgba(234,223,207,.55);border-radius:var(--r-card);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  transition:transform .6s var(--e),box-shadow .6s var(--e)}
.price:hover{transform:translateY(-6px);box-shadow:0 28px 60px -40px rgba(58,46,36,.5)}
.price--hi{background:var(--forest);color:var(--on-sage);border-color:var(--forest)}
.price--hi .muted{color:var(--on-sage-2)}
.price__top{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding-bottom:clamp(15px,1.7vw,22px);border-bottom:1px solid var(--line)}
.price--hi .price__top{border-color:var(--line-light)}
.price__amt{font-family:var(--serif);font-size:clamp(1.85rem,2.9vw,2.6rem);line-height:1;
  font-variant-numeric:tabular-nums;white-space:nowrap}
.price__amt sup{font-family:var(--sans);font-size:.34em;font-weight:600;letter-spacing:.04em;
  vertical-align:super;margin-left:.3em;color:var(--bronze)}
.price--hi .price__amt sup{color:var(--sage-label)}
.price ul{list-style:none;display:grid;gap:11px}
.price li{position:relative;padding-left:24px;font-size:clamp(15.5px,1vw,16.8px);line-height:1.56}
.price li::before{content:"";position:absolute;left:0;top:.8em;width:11px;height:1px;background:var(--bronze)}
.price--hi li::before{background:var(--sage-label)}

/* ---------- 16. Formulaire ---------- */
.form{display:grid;gap:clamp(24px,2.4vw,36px)}
.form__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,2.2vw,34px)}
@media(max-width:660px){.form__grid{grid-template-columns:1fr}}
.field{position:relative;display:flex;flex-direction:column}
.field label{font-family:var(--sans);font-size:12.8px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted-light);margin-bottom:9px}
.field input,.field textarea,.field select{border-bottom:1px solid var(--line);padding:8px 0 12px;
  font-size:16.5px;transition:border-color .4s ease;border-radius:0}
.field select{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%237F684E'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 2px center}
.field textarea{resize:vertical;min-height:112px}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--bronze)}
.field input::placeholder,.field textarea::placeholder{color:var(--muted-light);opacity:.75}
.form__note{font-size:15px;color:var(--muted);line-height:1.55;max-width:46ch}
.form__ok,.form__err{border:1px solid var(--bronze);border-radius:var(--r-card);
  padding:clamp(22px,2.4vw,34px);display:none}
.form__err{border-color:#8C4A3A}
.form__err .eyebrow{color:#8C4A3A}
.form__ok.is-on,.form__err.is-on{display:block}
/* pot de miel anti-pourriel : invisible pour l'humain, rempli par les robots */
.pot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.btn[disabled]{opacity:.55;pointer-events:none}

/* ---------- 17. Appel à l'action ---------- */
.cta{position:relative;overflow:hidden;background:var(--forest-deep);color:var(--paper)}
.cta__bg{position:absolute;inset:0;opacity:.46}
.cta__bg img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.85)}
.cta__bg::after{content:"";position:absolute;inset:0;
  background:radial-gradient(72% 92% at 50% 50%,rgba(58,46,36,.36),rgba(58,46,36,.86))}
.cta__in{position:relative;z-index:2;text-align:center;display:flex;flex-direction:column;align-items:center;
  gap:clamp(20px,2.4vw,32px);padding-block:clamp(70px,9vw,140px)}
.cta h2{max-width:20ch}
.cta .lead{text-align:center;max-width:52ch}

/* ---------- 18. Pied de page ---------- */
.ftr{background:var(--forest);color:var(--on-sage);padding-top:clamp(56px,6.6vw,104px)}
.ftr__top{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.15fr;gap:var(--gap) clamp(20px,2.4vw,40px);
  padding-bottom:clamp(42px,4.6vw,72px)}
@media(max-width:1000px){.ftr__top{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ftr__top{grid-template-columns:1fr}}
.ftr img.ftr__logo{height:clamp(62px,5.6vw,82px);width:auto;margin-bottom:20px}
.ftr h4{font-size:12.8px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--sage-label);
  font-family:var(--sans);margin-bottom:18px}
.ftr ul{list-style:none;display:grid;gap:10px}
.ftr a{font-size:clamp(15.2px,1vw,16.6px);color:var(--on-sage-2);transition:color .35s ease}
.ftr a:hover{color:var(--sage-label)}
.ftr p{font-size:clamp(15px,.98vw,16.4px);color:var(--on-sage-2);line-height:1.62}
.ftr__bot{border-top:1px solid var(--line-light);padding-block:24px clamp(24px,2.8vw,36px);
  display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:space-between;
  font-size:13.4px;color:rgba(245,239,228,.65)}
.ftr__word{overflow:hidden;line-height:.78;padding-bottom:clamp(6px,1vw,14px)}
.ftr__word span{display:block;font-family:var(--serif);font-weight:400;font-size:11vw;
  letter-spacing:-.02em;color:rgba(245,239,228,.1);white-space:nowrap;text-align:center}

/* ---------- 19. Utilitaires ---------- */
.stack-sm{display:grid;gap:14px}
.stack{display:grid;gap:clamp(18px,1.9vw,28px)}
.stack-lg{display:grid;gap:clamp(28px,3.4vw,52px)}
.row{display:flex;flex-wrap:wrap;gap:clamp(12px,1.3vw,18px);align-items:center}
.center{text-align:center}
.sticky{position:sticky;top:calc(var(--hdr) + 22px)}
@media(max-width:880px){.sticky{position:static}}
.c4{grid-column-end:span 4}.c5{grid-column-end:span 5}.c6{grid-column-end:span 6}
.c7{grid-column-end:span 7}.c8{grid-column-end:span 8}.c12{grid-column-end:span 12}
.start2{grid-column-start:2}.start6{grid-column-start:6}.start7{grid-column-start:7}.start9{grid-column-start:9}
@media(max-width:900px){
  .c4,.c5,.c6,.c7,.c8,.c12{grid-column-end:span 6}
  .start2,.start6,.start7,.start9{grid-column-start:auto}
}
.skip{position:absolute;left:-9999px;top:0;z-index:10000;background:var(--forest-deep);color:var(--paper);padding:14px 20px}
.skip:focus{left:12px;top:12px}
:focus-visible{outline:2px solid var(--bronze);outline-offset:3px}

/* ---------- 20. Mobile ---------- */
@media(max-width:760px){
  :root{--sec:clamp(64px,13vw,96px);--gap:26px}
  body{font-size:16px;line-height:1.62}
  .d1{font-size:clamp(2.55rem,11.4vw,3.6rem);line-height:1.03}
  .d2{font-size:clamp(2rem,8.6vw,2.9rem);line-height:1.1}
  .d3{font-size:clamp(1.45rem,6.2vw,2rem)}
  .lead{font-size:16.5px;line-height:1.58}
  .d1{font-size:clamp(1.62rem,7.4vw,2.3rem);line-height:1.18;letter-spacing:.02em}
  .over{font-size:clamp(1.1rem,5.4vw,1.5rem)}
  .banner{height:clamp(320px,52vh,520px)}
  .banner--hero{min-height:68svh;height:auto}
  .banner__brand{padding:80px var(--pad)}
  .banner__brand img{height:clamp(96px,30vw,150px)}
  .banner__brand p{letter-spacing:.16em;font-size:12px;line-height:1.9}
  .banner__brand p span{display:block}
  .banner__brand p i{display:none}
  .banner__bar span,.banner__bar i{display:none}
  .banner__bar{padding-bottom:16px;font-size:12px}
  .intro{padding-block:44px 40px}
  .intro__txt{font-size:16.5px;line-height:1.66}
  .intro .row{width:100%;flex-direction:column;align-items:stretch}
  .intro .row .btn{justify-content:center}
  .intro__meta{flex-direction:column;gap:9px;font-size:12.4px}
  .ph h1{max-width:none}
  .ph__meta{gap:14px}
  .svc__row h3{font-size:clamp(1.12rem,5vw,1.45rem)}
  .quote{font-size:clamp(1.2rem,5.4vw,1.6rem)}
  .marq__track>span{font-size:1.25rem;gap:22px;padding-right:22px}
  .cta__in{padding-block:66px}
  .stat b{font-size:2.6rem}
  .ftr__top{gap:34px}
  .ftr__word span{font-size:15vw}
  .ftr__bot{font-size:12px;gap:6px 20px}
  .price{padding:24px 22px}
  .acc__btn h3{font-size:clamp(1.05rem,4.6vw,1.3rem)}
}
@media(max-width:400px){
  .hero__row .btn{width:100%}
  .row .btn{width:100%;justify-content:center}
}

/* ---------- 21. Écran de chargement ---------- */
.loader{
  position:fixed;inset:0;z-index:10000;background:var(--forest-deep);
  display:grid;place-items:center;
  clip-path:inset(0 0 0 0);
  transition:clip-path .85s var(--e);
}
.loader.is-out{clip-path:inset(0 0 100% 0);pointer-events:none}
.loader__in{display:flex;flex-direction:column;align-items:center;
  gap:clamp(16px,2.2vw,28px);
  transition:transform .85s var(--e),opacity .5s ease}
.loader.is-out .loader__in{transform:translateY(-22px);opacity:0}
.loader img{height:clamp(52px,6.4vw,84px);width:auto;
  opacity:0;transform:scale(.94);animation:ldIn .75s var(--e) forwards}
.loader__name{font-family:var(--sans);font-size:12.4px;font-weight:600;letter-spacing:.32em;
  text-transform:uppercase;color:rgba(234,223,207,.58);
  opacity:0;animation:ldIn .75s var(--e) .1s forwards}
.loader__bar{display:block;width:clamp(110px,13vw,172px);height:1px;
  background:rgba(234,223,207,.18);overflow:hidden;margin-top:4px}
.loader__bar i{display:block;height:100%;width:100%;background:var(--bronze-3);
  transform:scaleX(0);transform-origin:left;
  transition:transform .52s cubic-bezier(.42,0,.24,1)}
.loader.is-full .loader__bar i{transform:scaleX(1)}
@keyframes ldIn{to{opacity:1;transform:scale(1)}}
html:not(.js) .loader{display:none}
body.loading{overflow:hidden}
@media (prefers-reduced-motion:reduce){.loader{display:none}}

/* le logo de l'ouverture se pose une fois le voile levé */
.banner__brand{transition:opacity 1s var(--e) .2s,transform 1s var(--e) .2s}
body.loading .banner__brand{opacity:0;transform:translateY(20px)}
@media (prefers-reduced-motion:reduce){
  body.loading .banner__brand{opacity:1;transform:none}
}

/* ---------- 22. Par où commencer ---------- */
.situations{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.5vw,20px)}
@media(max-width:1000px){.situations{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.situations{grid-template-columns:1fr}}
.situation{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:clamp(22px,2.2vw,30px) clamp(22px,2.2vw,30px);
  border:1px solid var(--line);border-radius:var(--r-card);
  background:rgba(234,223,207,.5);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  font-family:var(--sans);font-weight:500;letter-spacing:-.004em;
  font-size:clamp(16.5px,1.18vw,20px);line-height:1.34;color:var(--ink);
  transition:border-color .45s var(--e),transform .45s var(--e),box-shadow .5s var(--e);
}
.situation .ar{width:19px;height:10px;flex:0 0 auto;color:var(--bronze);
  transition:transform .45s var(--e)}
.situation:hover{border-color:var(--bronze);transform:translateY(-3px);
  box-shadow:0 18px 40px -26px rgba(58,46,36,.5)}
.situation:hover .ar{transform:translateX(5px)}
@media(max-width:620px){.situation{padding:20px 22px;font-size:17px}}