/* ================================================================
   CONSTRUCTIONS WELTER — « Béton clair, ligne rouille »
   Tokens : design-system/styles-current.md
   ================================================================ */
:root{
  /* Primary — rouille terre cuite */
  --primary-50:#FBF1EC;--primary-100:#F6DED2;--primary-200:#EBBBA2;--primary-300:#DE9370;
  --primary-400:#CB6E42;--primary-500:#B5522A;--primary-600:#9A4322;--primary-700:#7C351C;
  --primary-800:#5E2917;--primary-900:#431E12;--primary-950:#2A130B;
  /* Neutral — pierre calcaire */
  --neutral-50:#F6F4EF;--neutral-100:#EDEAE2;--neutral-200:#DDD8CD;--neutral-300:#C6BFB1;
  --neutral-400:#A79E8D;--neutral-500:#8A8071;--neutral-600:#6E6558;--neutral-700:#544D43;
  --neutral-800:#3A342D;--neutral-900:#23201B;--neutral-950:#14110E;
  /* Sémantique */
  --bg-page:var(--neutral-50);--bg-surface:#FFFFFF;--bg-alt:var(--neutral-100);
  --bg-ink:var(--neutral-950);--bg-rust:var(--primary-500);
  --text-strong:var(--neutral-900);--text-body:var(--neutral-700);--text-muted:var(--neutral-500);
  --text-accent:var(--primary-700);
  --text-on-ink-strong:#FFFFFF;--text-on-ink-body:#D9D4CB;--text-on-ink-muted:#9A9284;
  --line-hair:var(--neutral-200);--line-strong:var(--neutral-300);
  --line-on-ink:rgba(255,255,255,.14);--line-cote:var(--primary-500);
  --focus-ring:var(--primary-500);
  /* Typo */
  --font-display:'Familjen Grotesk','Arial Narrow',system-ui,sans-serif;
  --font-body:'Geist',system-ui,sans-serif;
  --font-mono:'Geist Mono',ui-monospace,monospace;
  --fs-hero:clamp(3.25rem,2.2rem + 5.6vw,7rem);
  --fs-display:clamp(2.75rem,1.9rem + 4vw,5.5rem);
  --fs-h1:clamp(2.25rem,1.6rem + 2.8vw,3.5rem);
  --fs-h2:clamp(1.75rem,1.3rem + 1.9vw,2.625rem);
  --fs-h3:clamp(1.375rem,1.15rem + .9vw,1.75rem);
  --fs-h4:clamp(1.125rem,1.05rem + .35vw,1.3125rem);
  --fs-lead:clamp(1.125rem,1.02rem + .5vw,1.375rem);
  --fs-body:1.0625rem;--fs-sm:.9375rem;--fs-xs:.8125rem;--fs-cote:.75rem;
  --ls-label:.08em;--ls-mono:.05em;
  /* Espace & structure */
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;
  --space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:128px;--space-11:160px;
  --section-y:clamp(96px,7vw + 40px,200px);
  --container:1400px;--container-narrow:780px;--gutter:clamp(20px,4vw,48px);
  --radius-sm:2px;--radius-md:4px;--radius-lg:8px;
  --shadow-sm:0 2px 8px rgba(20,17,14,.06);--shadow-md:0 8px 24px rgba(20,17,14,.08);
  --shadow-lg:0 20px 48px rgba(20,17,14,.12);--shadow-cta:0 10px 30px rgba(181,82,42,.28);
  /* Motion */
  --ease-out-expo:cubic-bezier(.16,1,.3,1);--ease-in-out:cubic-bezier(.65,0,.35,1);
  --dur-fast:200ms;--dur-base:350ms;--dur-slow:700ms;--stagger:80ms;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font:400 var(--fs-body)/1.6 var(--font-body);
  color:var(--text-body);background:var(--bg-page);
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;border:none;background:none;cursor:pointer;color:inherit}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}

.container{width:min(100% - 2*var(--gutter),var(--container));margin-inline:auto}
.section{padding-block:var(--section-y)}

/* Eyebrow mono */
.eyebrow{
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-label);
  text-transform:uppercase;color:var(--text-accent);
  display:inline-flex;align-items:center;gap:12px;margin-bottom:24px;
}
.eyebrow::before{content:"";width:32px;height:1px;background:var(--line-cote)}
.on-ink .eyebrow{color:var(--primary-300)}
.on-ink .eyebrow::before{background:var(--primary-400)}

.section-title{
  font:600 var(--fs-h1)/1.05 var(--font-display);letter-spacing:-.015em;
  text-transform:uppercase;color:var(--text-strong);max-width:20ch;
}
.on-ink .section-title{color:var(--text-on-ink-strong)}
.section-lead{font-size:var(--fs-lead);line-height:1.7;color:var(--text-body);max-width:56ch;margin-top:20px}

/* ---------------- Boutons ---------------- */
.btn{
  font:600 var(--fs-sm)/1 var(--font-display);text-transform:uppercase;letter-spacing:.04em;
  padding:18px 28px;border-radius:0;display:inline-flex;align-items:center;gap:10px;
  transition:transform var(--dur-base) var(--ease-out-expo),background-color .25s ease,
             color .25s ease,box-shadow var(--dur-base) ease;
  will-change:transform;
}
.btn--primary-on-ink{background:#FFF;color:var(--neutral-950)}
.btn--primary-on-ink:hover{background:var(--primary-500);color:#FFF;box-shadow:var(--shadow-cta)}
.btn--primary{background:var(--primary-500);color:#FFF}
.btn--primary:hover{background:var(--primary-600);box-shadow:var(--shadow-cta);transform:translateY(-1px)}
.btn--ghost{background:transparent;color:var(--neutral-900);border:1px solid var(--neutral-300)}
.btn--ghost:hover{border-color:var(--primary-500);color:var(--primary-700)}
.btn--ghost-on-ink{background:transparent;color:#FFF;border:1px solid var(--line-on-ink)}
.btn--ghost-on-ink:hover{border-color:var(--primary-400);color:var(--primary-300)}
.btn--link{
  padding:0;background:none;color:var(--primary-700);letter-spacing:var(--ls-label);
  font:600 var(--fs-cote)/1 var(--font-mono);text-transform:uppercase;
  border-bottom:1px solid currentColor;padding-bottom:4px;
}
.btn--link:hover{color:var(--primary-500)}
.btn .arrow{transition:transform var(--dur-fast) var(--ease-out-expo)}
.btn:hover .arrow{transform:translateX(4px)}

/* ---------------- Repère de cote (motif signature) ---------------- */
.cote{position:relative;height:1px;background:var(--line-cote)}
.cote::before,.cote::after{
  content:"";position:absolute;top:-4px;width:1px;height:9px;background:inherit;
  background:var(--line-cote);
}
.cote::before{left:0}
.cote::after{right:0}
.cote--on-ink{background:var(--line-on-ink)}
.cote--on-ink::before,.cote--on-ink::after{background:var(--line-on-ink)}
.cote__label{
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-mono);
  text-transform:uppercase;color:var(--text-accent);
  position:absolute;top:-20px;left:50%;transform:translateX(-50%);white-space:nowrap;
}

/* ---------------- Header / Nav ---------------- */
.site-header{
  position:fixed;inset:0 0 auto 0;z-index:60;
  transition:background-color var(--dur-base) ease,box-shadow var(--dur-base) ease,
             border-color var(--dur-base) ease;
  border-bottom:1px solid transparent;
}
.site-header .container{
  display:flex;align-items:center;justify-content:space-between;gap:32px;
  height:84px;transition:height var(--dur-base) var(--ease-out-expo);
}
.site-header.is-scrolled{
  background:rgba(246,244,239,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border-bottom-color:var(--line-hair);
}
.site-header.is-scrolled .container{height:64px}
.logo{
  font:700 1.375rem/1.05 var(--font-display);letter-spacing:-.015em;
  color:#FFF;transition:color var(--dur-base) ease;display:block;
}
.logo .logo-w{color:var(--primary-400);transition:color var(--dur-base) ease}
.site-header.is-scrolled .logo{color:var(--neutral-950)}
.site-header.is-scrolled .logo .logo-w{color:var(--primary-500)}
.main-nav{display:flex;align-items:center;gap:8px}
.nav-link{
  font:500 var(--fs-sm)/1 var(--font-body);color:rgba(255,255,255,.85);
  padding:10px 14px;position:relative;transition:color var(--dur-fast) ease;
  min-height:44px;display:inline-flex;align-items:center;
}
.nav-link:hover{color:#FFF}
.site-header.is-scrolled .nav-link{color:var(--neutral-800)}
.site-header.is-scrolled .nav-link:hover{color:var(--primary-700)}
.nav-link[aria-current="page"]{color:var(--primary-300)}
.site-header.is-scrolled .nav-link[aria-current="page"]{color:var(--primary-600)}
.nav-link[aria-current="page"]::after{
  content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;background:var(--primary-500);
}
.header-actions{display:flex;align-items:center;gap:20px}
.header-tel{
  font:500 var(--fs-sm)/1 var(--font-mono);letter-spacing:var(--ls-mono);
  color:rgba(255,255,255,.85);min-height:44px;display:inline-flex;align-items:center;
}
.header-tel:hover{color:#FFF}
.site-header.is-scrolled .header-tel{color:var(--neutral-800)}
.site-header.is-scrolled .header-tel:hover{color:var(--primary-700)}
.header-cta{padding:13px 20px;font-size:var(--fs-xs)}
.burger{
  display:none;flex-direction:column;justify-content:center;gap:5px;
  width:44px;height:44px;align-items:center;
}
.burger span{
  display:block;width:22px;height:2px;background:#FFF;
  transition:transform var(--dur-base) var(--ease-out-expo),opacity var(--dur-fast) ease,background-color var(--dur-base) ease;
}
.site-header.is-scrolled .burger span{background:var(--neutral-950)}

/* Menu mobile plein écran */
.mobile-menu{
  position:fixed;inset:0;z-index:70;background:var(--neutral-950);
  display:flex;flex-direction:column;justify-content:flex-start;padding:96px var(--gutter) 40px;
  clip-path:circle(0px at calc(100% - 42px) 42px);visibility:hidden;overflow-y:auto;
  transition:clip-path .6s var(--ease-out-expo),visibility 0s .6s;
  height:100dvh;
}
.mobile-menu.is-open{clip-path:circle(150% at calc(100% - 42px) 42px);visibility:visible;transition:clip-path .6s var(--ease-out-expo)}
.mobile-menu__close{
  position:absolute;top:16px;right:16px;width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;color:#FFF;font-size:1.5rem;z-index:2;
}
.mobile-menu nav{display:flex;flex-direction:column;gap:2px}
.mobile-menu .m-link{
  font:600 clamp(1.5rem,6.5vw,2.25rem)/1.25 var(--font-display);text-transform:uppercase;
  letter-spacing:-.015em;color:#FFF;padding:10px 0;min-height:44px;display:flex;align-items:center;
  transition:color var(--dur-fast) ease;
}
.mobile-menu .m-link:hover{color:var(--primary-300)}
.mobile-menu nav > *{opacity:0;transform:translateY(24px);
  transition:opacity var(--dur-slow) var(--ease-out-expo),transform var(--dur-slow) var(--ease-out-expo)}
.mobile-menu.is-open nav > *{opacity:1;transform:none}
.mobile-menu.is-open nav > *:nth-child(1){transition-delay:100ms}
.mobile-menu.is-open nav > *:nth-child(2){transition-delay:160ms}
.mobile-menu.is-open nav > *:nth-child(3){transition-delay:220ms}
.mobile-menu.is-open nav > *:nth-child(4){transition-delay:280ms}
.mobile-menu.is-open nav > *:nth-child(5){transition-delay:340ms}
.mobile-menu.is-open nav > *:nth-child(6){transition-delay:400ms}
.mobile-menu.is-open nav > *:nth-child(7){transition-delay:460ms}
.mobile-menu.is-open nav > *:nth-child(8){transition-delay:520ms}
.mobile-menu__cta{margin-top:32px;opacity:0;transform:translateY(24px);flex-shrink:0;
  transition:opacity var(--dur-slow) var(--ease-out-expo) 600ms,transform var(--dur-slow) var(--ease-out-expo) 600ms}
.mobile-menu.is-open .mobile-menu__cta{opacity:1;transform:none}
.mobile-menu__nap{
  margin-top:32px;flex-shrink:0;font:400 var(--fs-sm)/1.8 var(--font-mono);color:var(--text-on-ink-muted);
  letter-spacing:var(--ls-mono);opacity:0;transition:opacity var(--dur-slow) ease 700ms;font-style:normal;
}
.mobile-menu.is-open .mobile-menu__nap{opacity:1}

/* ---------------- HERO ---------------- */
.hero{
  position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;
  background:var(--bg-ink);overflow:hidden;isolation:isolate;
}
.hero__media{position:absolute;inset:-60px 0;z-index:-2;will-change:transform}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:center 40%}
.hero__overlay{
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(20,17,14,.78) 0%,rgba(20,17,14,.35) 60%,rgba(20,17,14,.15) 100%),
             linear-gradient(0deg,rgba(20,17,14,.55) 0%,rgba(20,17,14,0) 30%);
}
.hero .container{padding-top:84px}
.hero__content{max-width:1000px}
.hero__title{
  font:700 var(--fs-hero)/0.92 var(--font-display);letter-spacing:-.02em;
  text-transform:uppercase;color:#FFF;
}
.hero__title .accent{color:var(--primary-500)}
.hero__lead{
  margin-top:28px;font-size:var(--fs-lead);line-height:1.7;
  color:var(--text-on-ink-body);max-width:46ch;
}
.hero__cote{width:180px;margin-top:56px}
.hero__cote .cote__label{left:0;transform:none;color:var(--primary-300)}
.hero__actions{margin-top:40px;display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.hero__scroll{
  position:absolute;left:50%;bottom:32px;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:14px;
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-label);
  text-transform:uppercase;color:rgba(255,255,255,.75);
  transition:color var(--dur-fast) ease;
}
.hero__scroll:hover{color:#FFF}
.hero__scroll .tick{width:1px;height:36px;background:rgba(255,255,255,.4);position:relative;overflow:hidden}
.hero__scroll .tick::after{
  content:"";position:absolute;inset:0;background:var(--primary-400);
  animation:tick-drop 2.2s var(--ease-in-out) infinite;
}
@keyframes tick-drop{0%{transform:translateY(-100%)}55%{transform:translateY(0)}100%{transform:translateY(100%)}}

/* Reveal d'entrée hero (au chargement) */
.hero-in{opacity:0;transform:translateY(24px);
  transition:opacity var(--dur-slow) var(--ease-out-expo),transform var(--dur-slow) var(--ease-out-expo)}
body.is-loaded .hero-in{opacity:1;transform:none}
body.is-loaded .hero-in:nth-of-type(1){transition-delay:100ms}
.hero__lead.hero-in{transition-delay:220ms}
.hero__cote.hero-in{transition-delay:320ms}
.hero__actions.hero-in{transition-delay:400ms}

/* ---------------- PREUVES (bande chevauchante) ---------------- */
.proof{position:relative;z-index:2;margin-top:-64px}
.proof__card{
  background:var(--bg-surface);border:1px solid var(--line-hair);border-radius:var(--radius-md);
  box-shadow:var(--shadow-md);
  display:grid;grid-template-columns:repeat(4,1fr);
}
.proof__item{padding:44px 36px 36px;position:relative}
.proof__item + .proof__item{border-left:1px solid var(--line-hair)}
.proof__item .cote{width:56px;margin-bottom:22px}
.proof__num{
  font:600 clamp(2rem,1.5rem + 1.6vw,2.75rem)/1 var(--font-display);
  letter-spacing:-.015em;color:var(--text-strong);
}
.proof__num .unit{color:var(--primary-500);font-size:.6em;font-weight:500}
.proof__label{
  margin-top:10px;font:500 var(--fs-cote)/1.5 var(--font-mono);
  letter-spacing:var(--ls-mono);text-transform:uppercase;color:var(--text-muted);
}
.proof__badges{
  margin-top:28px;display:flex;flex-wrap:wrap;gap:12px 32px;justify-content:center;
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-mono);
  text-transform:uppercase;color:var(--neutral-400);
}
.proof__badges span{display:inline-flex;align-items:center;gap:8px}
.proof__badges span::before{content:"";width:5px;height:5px;background:var(--primary-300)}

/* ---------------- SERVICES — « Cadre mécanique » ---------------- */
.svc-grid{
  margin-top:64px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
}
.svc-card{
  position:relative;background:var(--bg-surface);border:1px solid var(--line-hair);
  border-radius:var(--radius-md);padding:36px 32px 32px;display:flex;flex-direction:column;
  transition:transform .4s var(--ease-out-expo),box-shadow .4s ease;
}
.svc-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
/* coins en L (crop-marks) qui se dessinent au hover */
.svc-card::before,.svc-card::after{
  content:"";position:absolute;width:18px;height:18px;pointer-events:none;
  transition:width .45s var(--ease-out-expo),height .45s var(--ease-out-expo),border-color .3s ease;
}
.svc-card::before{top:-1px;left:-1px;border-top:1px solid var(--neutral-300);border-left:1px solid var(--neutral-300)}
.svc-card::after{bottom:-1px;right:-1px;border-bottom:1px solid var(--neutral-300);border-right:1px solid var(--neutral-300)}
.svc-card:hover::before,.svc-card:hover::after{width:56px;height:56px;border-color:var(--primary-500)}
.svc-card__num{
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-mono);
  text-transform:uppercase;color:var(--primary-600);margin-bottom:20px;
}
.svc-card__title{
  font:600 var(--fs-h3)/1.15 var(--font-display);letter-spacing:-.015em;
  text-transform:uppercase;color:var(--text-strong);
}
.svc-card__title .tline{
  display:block;width:0;height:2px;background:var(--primary-500);margin-top:12px;
  transition:width .45s var(--ease-out-expo);
}
.svc-card:hover .svc-card__title .tline{width:44px}
.svc-card__desc{margin-top:14px;font-size:var(--fs-sm);line-height:1.65;color:var(--text-body);flex-grow:1}
.svc-card__link{margin-top:24px;align-self:flex-start}

/* ---------------- LA DALLE (section signature) ---------------- */
.dalle{
  position:relative;background:var(--bg-ink);color:var(--text-on-ink-body);overflow:hidden;
}
.dalle::before{ /* treillis ferraillage */
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:44px 44px;
}
.dalle::after{ /* grain */
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
}
.dalle .container{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,96px);align-items:end}
.dalle__baseline{
  font:600 var(--fs-h2)/1.2 var(--font-display);letter-spacing:-.015em;color:#FFF;max-width:18ch;
}
.dalle__baseline em{font-style:normal;color:var(--primary-300)}
.dalle__body{margin-top:24px;max-width:44ch;color:var(--text-on-ink-body)}
.dalle__figure{position:relative;padding-top:36px}
.dalle__number{
  font:600 clamp(3.75rem,2.2rem + 8vw,8.5rem)/0.95 var(--font-display);letter-spacing:-.02em;color:#FFF;
  display:flex;align-items:baseline;gap:.18em;flex-wrap:wrap;
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;
}
.dalle__number .unit{color:var(--primary-300);font-size:clamp(1.5rem,1rem + 2vw,2.75rem);font-weight:500;letter-spacing:-.01em}
.dalle__caption{
  margin-top:14px;font:400 var(--fs-sm)/1.6 var(--font-body);color:var(--text-on-ink-muted);
}
/* le repère de cote qui se dessine */
.dalle__cote{position:relative;margin-top:36px;height:1px}
.dalle__cote .line{
  position:absolute;inset:0;background:var(--primary-500);
  transform:scaleX(0);transform-origin:left;
  transition:transform .9s var(--ease-out-expo);
}
.dalle__cote .cap{
  position:absolute;top:-5px;width:1px;height:11px;background:var(--primary-500);
}
.dalle__cote .cap--start{left:0}
.dalle__cote .cap--end{right:0;opacity:0;transition:opacity 200ms var(--ease-out-expo) 820ms}
.dalle__cote .cote__label{
  color:var(--primary-400);top:-24px;left:0;transform:translateY(4px);
  opacity:0;transition:opacity var(--dur-base) var(--ease-out-expo) .45s,transform var(--dur-base) var(--ease-out-expo) .45s;
}
.dalle.is-drawn .dalle__cote .line{transform:scaleX(1)}
.dalle.is-drawn .dalle__cote .cap--end{opacity:1}
.dalle.is-drawn .dalle__cote .cote__label{opacity:1;transform:translateY(0)}
.dalle__stats{
  margin-top:56px;display:grid;grid-template-columns:repeat(3,auto);gap:48px;justify-content:start;
}
.dalle__stat{position:relative;padding-top:20px}
.dalle__stat .stat-cote{
  position:absolute;top:0;left:0;width:40px;height:1px;background:var(--primary-500);
  transform:scaleX(0);transform-origin:left center;
  transition:transform 700ms var(--ease-out-expo);
}
.dalle.is-drawn .dalle__stat .stat-cote{transform:scaleX(1)}
.dalle__stat b{
  display:block;font:600 var(--fs-h3)/1 var(--font-display);color:#FFF;
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;letter-spacing:-.01em;
}
.dalle__stat span{
  display:block;margin-top:8px;font:500 var(--fs-cote)/1.4 var(--font-mono);
  letter-spacing:var(--ls-mono);text-transform:uppercase;color:var(--text-on-ink-muted);
}

/* ---------------- RÉALISATIONS (bento) ---------------- */
.works__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px}
.works__grid{
  margin-top:64px;display:grid;gap:24px;
  grid-template-columns:repeat(4,1fr);
  grid-template-areas:
    "big big med1 med2"
    "big big sm1  sm2";
}
.work{
  position:relative;overflow:hidden;border-radius:var(--radius-lg);
  min-height:260px;isolation:isolate;display:block;
}
.work--big{grid-area:big;min-height:560px}
.work--med1{grid-area:med1}.work--med2{grid-area:med2}
.work--sm1{grid-area:sm1}.work--sm2{grid-area:sm2}
.work img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform var(--dur-slow) var(--ease-out-expo);
  will-change:transform;
}
.work:hover img{transform:scale(1.04)}
.work::after{ /* overlay encre bas */
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(transparent 45%,rgba(20,17,14,.72));
  transition:background-color var(--dur-base) ease;
}
.work:hover::after{background-color:rgba(20,17,14,.14)}
/* crop-marks */
.work .marks{position:absolute;inset:14px;z-index:2;pointer-events:none}
.work .marks i{position:absolute;width:14px;height:14px;border:0 solid rgba(255,255,255,.55)}
.work .marks i:nth-child(1){top:0;left:0;border-top-width:1px;border-left-width:1px}
.work .marks i:nth-child(2){top:0;right:0;border-top-width:1px;border-right-width:1px}
.work .marks i:nth-child(3){bottom:0;left:0;border-bottom-width:1px;border-left-width:1px}
.work .marks i:nth-child(4){bottom:0;right:0;border-bottom-width:1px;border-right-width:1px}
.work__label{
  position:absolute;left:24px;bottom:20px;z-index:3;
  font:500 var(--fs-cote)/1.5 var(--font-mono);letter-spacing:var(--ls-mono);
  text-transform:uppercase;color:#FFF;
}
.work__label small{display:block;color:rgba(255,255,255,.65);font-size:inherit}

/* ---------------- PROCESS (timeline cote) ---------------- */
.process__track{position:relative;margin-top:80px}
.process__line{
  position:absolute;top:5px;left:0;right:0;height:1px;background:var(--line-hair);
}
.process__line .fill{
  position:absolute;inset:0;background:var(--primary-500);
  transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease-out-expo);
}
.process.is-drawn .process__line .fill{transform:scaleX(1)}
.process__steps{display:grid;grid-template-columns:repeat(5,1fr);gap:32px}
.process__step{position:relative;padding-top:36px}
.process__step::before{
  content:"";position:absolute;top:0;left:0;width:1px;height:11px;background:var(--primary-500);
}
.process__step .num{
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-mono);color:var(--primary-600);
}
.process__step h3{
  margin-top:12px;font:600 var(--fs-h4)/1.2 var(--font-display);
  letter-spacing:-.01em;text-transform:uppercase;color:var(--text-strong);
}
.process__step p{margin-top:10px;font-size:var(--fs-sm);line-height:1.65}

/* ---------------- ZONE ---------------- */
.zone{background:var(--bg-alt);border-top:1px solid var(--line-hair);border-bottom:1px solid var(--line-hair)}
.zone .container{display:grid;grid-template-columns:5fr 7fr;gap:72px;align-items:start}
.zone__communes{
  display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-strong);
}
.zone__communes a{
  font:500 var(--fs-sm)/1 var(--font-mono);letter-spacing:var(--ls-mono);
  padding:18px 8px;border-bottom:1px solid var(--line-strong);color:var(--text-body);
  display:flex;align-items:center;gap:10px;transition:color var(--dur-fast) ease,padding-left var(--dur-fast) var(--ease-out-expo);
  min-height:44px;
}
.zone__communes a::before{content:"";width:5px;height:5px;background:var(--neutral-300);transition:background-color var(--dur-fast) ease}
.zone__communes a:hover{color:var(--primary-700);padding-left:14px}
.zone__communes a:hover::before{background:var(--primary-500)}
.zone__cote{width:220px;margin-top:44px}

/* ---------------- CTA rouille ---------------- */
.cta{background:var(--bg-rust);color:#FFF;text-align:center}
.cta .section-title{color:#FFF;margin-inline:auto}
.cta__sub{margin:20px auto 0;max-width:52ch;color:rgba(255,255,255,.85);font-size:var(--fs-lead);line-height:1.7}
.cta__actions{margin-top:44px;display:flex;flex-wrap:wrap;gap:16px;justify-content:center;align-items:center}
.cta .btn--primary-on-ink:hover{background:var(--neutral-950);color:#FFF;box-shadow:none}
.cta__tel{
  font:500 var(--fs-lead)/1 var(--font-mono);letter-spacing:var(--ls-mono);color:#FFF;
  border-bottom:1px solid rgba(255,255,255,.4);padding-bottom:4px;
  transition:border-color var(--dur-fast) ease;min-height:44px;display:inline-flex;align-items:center;
}
.cta__tel:hover{border-color:#FFF}
.cta__reassure{
  margin-top:36px;display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:center;
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-mono);
  text-transform:uppercase;color:rgba(255,255,255,.75);
}
.cta__reassure span{display:inline-flex;align-items:center;gap:8px}
.cta__reassure span::before{content:"";width:5px;height:5px;background:rgba(255,255,255,.5)}

/* ---------------- FOOTER ---------------- */
.site-footer{background:var(--bg-ink);color:var(--text-on-ink-body);padding:96px 0 0}
.site-footer .cote-sep{position:relative;margin-bottom:72px}
.site-footer .cote-sep .cote__label{color:var(--text-on-ink-muted);left:0;transform:none}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.2fr;gap:40px}
.footer-brand .logo{color:#FFF;font-size:1.5rem}
.footer-brand p{margin-top:20px;font-size:var(--fs-sm);line-height:1.7;color:var(--text-on-ink-muted);max-width:34ch}
.footer-col h2{
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-label);
  text-transform:uppercase;color:var(--text-on-ink-muted);margin-bottom:24px;
}
.footer-col ul{display:flex;flex-direction:column;gap:2px}
.footer-col a{
  font-size:var(--fs-sm);color:var(--text-on-ink-body);position:relative;
  padding:6px 0;display:inline-block;min-height:32px;
}
.footer-col a::after{
  content:"";position:absolute;left:0;bottom:4px;height:1px;width:0;
  background:var(--primary-400);transition:width var(--dur-base) var(--ease-out-expo);
}
.footer-col a:hover{color:#FFF}
.footer-col a:hover::after{width:100%}
.footer-nap{font-style:normal;font-size:var(--fs-sm);line-height:1.9;color:var(--text-on-ink-body)}
.footer-nap a{color:#FFF}
.footer-nap a:hover{color:var(--primary-300)}
.footer-nap .mono{font-family:var(--font-mono);letter-spacing:var(--ls-mono)}
.footer-bottom{
  margin-top:80px;border-top:1px solid var(--line-on-ink);
  padding:28px 0;display:flex;flex-wrap:wrap;gap:12px 32px;align-items:center;justify-content:space-between;
  font-size:var(--fs-xs);color:var(--text-on-ink-muted);
}
.footer-bottom a{color:var(--text-on-ink-muted)}
.footer-bottom a:hover{color:#FFF}
.footer-bottom .lang{font-family:var(--font-mono);letter-spacing:var(--ls-mono)}

/* ---------------- Drawer devis multistep ---------------- */
.drawer-backdrop{
  position:fixed;inset:0;z-index:80;background:rgba(20,17,14,.55);
  opacity:0;visibility:hidden;transition:opacity var(--dur-base) ease,visibility 0s var(--dur-base);
}
.drawer-backdrop.is-open{opacity:1;visibility:visible;transition:opacity var(--dur-base) ease}
.drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:90;width:min(520px,100%);
  background:var(--bg-page);box-shadow:var(--shadow-lg);
  transform:translateX(102%);transition:transform .55s var(--ease-out-expo);
  display:flex;flex-direction:column;height:100dvh;
}
.drawer.is-open{transform:none}
.drawer__head{
  padding:28px 36px;border-bottom:1px solid var(--line-hair);
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.drawer__head h2{
  font:600 var(--fs-h4)/1.1 var(--font-display);text-transform:uppercase;
  letter-spacing:-.01em;color:var(--text-strong);
}
.drawer__close{width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:var(--text-strong)}
.drawer__body{flex:1;overflow-y:auto;padding:32px 36px}
.stepper{display:flex;gap:8px;margin-bottom:32px}
.stepper .step{
  flex:1;height:3px;background:var(--neutral-200);position:relative;
  transition:background-color var(--dur-base) ease;
}
.stepper .step.is-done,.stepper .step.is-active{background:var(--primary-500)}
.stepper__label{
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-mono);
  text-transform:uppercase;color:var(--text-accent);margin-bottom:24px;display:block;
}
.dstep{display:none}
.dstep.is-active{display:block;animation:dstep-in .45s var(--ease-out-expo)}
@keyframes dstep-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.field{margin-bottom:22px}
.field label{
  display:block;font:500 var(--fs-cote)/1 var(--font-mono);text-transform:uppercase;
  letter-spacing:var(--ls-mono);color:var(--neutral-600);margin-bottom:8px;
}
.field input,.field select,.field textarea{
  width:100%;font:400 var(--fs-body)/1.4 var(--font-body);color:var(--text-strong);
  background:#FFF;border:1px solid var(--neutral-300);border-radius:var(--radius-sm);padding:14px 16px;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--primary-500);box-shadow:0 0 0 3px rgba(181,82,42,.15);outline:none;
}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:22px}
.choice{
  position:relative;border:1px solid var(--neutral-300);border-radius:var(--radius-sm);
  padding:16px;cursor:pointer;font-size:var(--fs-sm);color:var(--text-body);
  transition:border-color var(--dur-fast) ease,background-color var(--dur-fast) ease;
  display:flex;align-items:center;min-height:52px;
}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice:hover{border-color:var(--primary-300)}
.choice:has(input:checked){border-color:var(--primary-500);background:var(--primary-50);color:var(--primary-800)}
.drawer__foot{
  padding:24px 36px;border-top:1px solid var(--line-hair);
  display:flex;gap:12px;justify-content:space-between;background:var(--bg-page);
}
.drawer__foot .btn{flex:1;justify-content:center}
.drawer__success{text-align:center;padding:48px 0}
.drawer__success .cote{width:120px;margin:0 auto 32px}
.drawer__success h3{font:600 var(--fs-h3)/1.15 var(--font-display);text-transform:uppercase;color:var(--text-strong)}
.drawer__success p{margin-top:16px;max-width:36ch;margin-inline:auto}

/* ---------------- Sticky CTA mobile ---------------- */
.sticky-bar{
  position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:50;
  display:none;gap:10px;padding:10px;background:var(--neutral-950);border-radius:999px;
  box-shadow:var(--shadow-lg);
  transform:translateY(140%);transition:transform .5s var(--ease-out-expo);
}
.sticky-bar.is-visible{transform:none}
.sticky-bar a,.sticky-bar button{
  flex:1;display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;
  font:600 var(--fs-sm)/1 var(--font-display);text-transform:uppercase;letter-spacing:.04em;
  border-radius:999px;
}
.sticky-bar .call{color:#FFF;border:1px solid var(--line-on-ink)}
.sticky-bar .quote{background:var(--primary-500);color:#FFF}

/* ---------------- Reveals ---------------- */
.reveal{
  opacity:0;transform:translateY(24px);
  transition:opacity var(--dur-slow) var(--ease-out-expo),transform var(--dur-slow) var(--ease-out-expo);
  will-change:opacity,transform;
}
.reveal.is-visible{opacity:1;transform:none}
.reveal-group > *{
  opacity:0;transform:translateY(24px);
  transition:opacity var(--dur-slow) var(--ease-out-expo),transform var(--dur-slow) var(--ease-out-expo);
}
.reveal-group.is-visible > *{opacity:1;transform:none}
.reveal-group.is-visible > *:nth-child(1){transition-delay:0ms}
.reveal-group.is-visible > *:nth-child(2){transition-delay:80ms}
.reveal-group.is-visible > *:nth-child(3){transition-delay:160ms}
.reveal-group.is-visible > *:nth-child(4){transition-delay:240ms}
.reveal-group.is-visible > *:nth-child(5){transition-delay:320ms}
.reveal-group.is-visible > *:nth-child(6){transition-delay:400ms}
.reveal-group.is-visible > *:nth-child(7){transition-delay:480ms}
.reveal-group.is-visible > *:nth-child(8){transition-delay:560ms}

/* ---------------- Responsive ---------------- */
@media (max-width:1080px){
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .works__grid{
    grid-template-columns:repeat(2,1fr);
    grid-template-areas:"big big" "med1 med2" "sm1 sm2";
  }
  .work--big{min-height:420px}
  .process__steps{grid-template-columns:repeat(2,1fr);gap:40px 32px}
  .process__line{display:none}
  .process__step{border-top:1px solid var(--line-hair);padding-top:24px}
  .process__step::before{display:none}
  .dalle .container,.zone .container{grid-template-columns:1fr;gap:48px}
  .proof__card{grid-template-columns:repeat(2,1fr)}
  .proof__item:nth-child(3){border-left:none}
  .proof__item:nth-child(n+3){border-top:1px solid var(--line-hair)}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px 40px}
  .footer-brand{grid-column:1 / -1}
}
@media (max-width:860px){
  .main-nav,.header-tel{display:none}
  .burger{display:flex}
  .header-cta{display:none}
}
@media (max-width:640px){
  .svc-grid{grid-template-columns:1fr}
  .works__grid{grid-template-columns:1fr;grid-template-areas:"big" "med1" "med2" "sm1" "sm2"}
  .work{min-height:300px}
  .process__steps{grid-template-columns:1fr}
  .proof{margin-top:-48px}
  .proof__card{grid-template-columns:1fr}
  .proof__item + .proof__item{border-left:none;border-top:1px solid var(--line-hair)}
  .footer-grid{grid-template-columns:1fr;gap:40px}
  .zone__communes{grid-template-columns:repeat(2,1fr)}
  .dalle__stats{grid-template-columns:1fr;gap:28px}
  .sticky-bar{display:flex}
  body{padding-bottom:0}
  .choice-grid{grid-template-columns:1fr}
  .drawer__body,.drawer__head,.drawer__foot{padding-inline:24px}
  .hero__scroll{display:none}
}
@media (min-width:641px) and (max-width:860px){
  .sticky-bar{display:flex;left:auto;width:340px}
}

/* ---------------- Mode QA (captures) ---------------- */
html.qa .reveal,html.qa .reveal-group > *,html.qa .hero-in{opacity:1 !important;transform:none !important;transition:none !important}
html.qa .hero{min-height:860px}
html.qa .dalle__cote .line,html.qa .process__line .fill,html.qa .dalle__stat .stat-cote{transform:scaleX(1) !important;transition:none !important}
html.qa .dalle__cote .cap--end,html.qa .dalle__cote .cote__label{opacity:1 !important;transform:none !important;transition:none !important}

/* ---------------- Reduced motion ---------------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal,.reveal-group > *,.hero-in{opacity:1 !important;transform:none !important;transition:none !important}
  .hero__media{transform:none !important}
  .dalle__cote .line{transform:scaleX(1) !important;transition:none}
  .dalle__cote .cap--end{opacity:1 !important;transition:none}
  .dalle__cote .cote__label{opacity:1;transform:none !important;transition:none}
  .dalle__stat .stat-cote{transform:scaleX(1) !important;transition:none}
  .process__line .fill{transform:scaleX(1);transition:none}
  .hero__scroll .tick::after{animation:none}
  .work img,.btn{transition:none}
  .mobile-menu,.drawer{transition:none}
}

/* ================================================================
   PAGES SECONDAIRES — nav dropdown, mini-hero, contenu éditorial,
   FAQ, cross-links, footer étendu, timeline, galerie, légal
   ================================================================ */

/* ---------------- Nav dropdown (desktop) ---------------- */
.nav-item{position:relative;display:flex;align-items:center}
.nav-item > .nav-link{display:inline-flex;align-items:center;gap:6px}
.nav-item > .nav-link .caret{width:8px;height:8px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;
  transform:rotate(45deg) translateY(-2px);transition:transform .25s var(--ease-out-expo);opacity:.7}
.nav-item:hover > .nav-link .caret,.nav-item:focus-within > .nav-link .caret{transform:rotate(225deg) translateY(2px)}
.nav-dropdown{
  position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(6px);min-width:240px;
  background:#FFF;border:1px solid var(--line-hair);box-shadow:var(--shadow-lg);border-radius:var(--radius-md);
  padding:10px;opacity:0;visibility:hidden;transition:opacity .25s var(--ease-out-expo),transform .25s var(--ease-out-expo),visibility 0s .25s;
  z-index:70;
}
.nav-item:hover .nav-dropdown,.nav-item:focus-within .nav-dropdown{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);transition:opacity .25s var(--ease-out-expo),transform .25s var(--ease-out-expo);
}
.nav-dropdown a{
  display:block;padding:11px 14px;font:500 var(--fs-sm) var(--font-body);color:var(--neutral-800);
  border-radius:var(--radius-sm);white-space:nowrap;min-height:auto;
}
.nav-dropdown a:hover{background:var(--neutral-100);color:var(--primary-700)}
.site-header.is-scrolled .nav-item > .nav-link .caret{border-color:currentColor}

/* ---------------- Menu mobile : accordéons de groupe ---------------- */
.m-group{border-top:1px solid var(--line-on-ink);padding:8px 0}
.m-group summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;
  font:600 clamp(1.5rem,6vw,2rem)/1.2 var(--font-display);text-transform:uppercase;letter-spacing:-.015em;
  color:#FFF;padding:8px 0;min-height:44px;
}
.m-group summary::-webkit-details-marker{display:none}
.m-group summary::after{content:"+";font:400 1.5rem/1 var(--font-body);color:var(--primary-300);transition:transform .3s var(--ease-out-expo)}
.m-group[open] summary::after{content:"–"}
.m-group .m-sublist{display:flex;flex-direction:column;padding:4px 0 12px;gap:2px}
.m-group .m-sublist a{
  font:400 var(--fs-body) var(--font-body);color:var(--text-on-ink-body);padding:9px 0;min-height:40px;display:flex;align-items:center;
}
.m-group .m-sublist a:hover{color:#FFF}

/* ---------------- Mini-hero (pages secondaires) ---------------- */
.mini-hero{
  position:relative;background:var(--bg-ink);color:var(--text-on-ink-body);overflow:hidden;isolation:isolate;
  padding-top:calc(84px + var(--space-9));padding-bottom:var(--space-9);
}
.mini-hero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:44px 44px;
}
.mini-hero__media{position:absolute;inset:0;z-index:-2}
.mini-hero__media img{width:100%;height:100%;object-fit:cover;opacity:.38}
.mini-hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,17,14,.55),rgba(20,17,14,.92) 85%)}
.mini-hero .container{position:relative}
.breadcrumb{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:28px;
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-mono);text-transform:uppercase;color:var(--text-on-ink-muted);
}
.breadcrumb a{color:var(--text-on-ink-muted);transition:color .2s ease}
.breadcrumb a:hover{color:#FFF}
.breadcrumb span[aria-hidden]{color:var(--primary-400)}
.breadcrumb .current{color:var(--primary-300)}
.mini-hero__title{
  font:700 clamp(2.5rem,1.9rem + 3.6vw,4.75rem)/0.98 var(--font-display);letter-spacing:-.02em;
  text-transform:uppercase;color:#FFF;max-width:18ch;
}
.mini-hero__lead{margin-top:24px;max-width:58ch;font-size:var(--fs-lead);line-height:1.7;color:var(--text-on-ink-body)}
.mini-hero__cote{width:200px;margin-top:36px}
.mini-hero__actions{margin-top:36px;display:flex;flex-wrap:wrap;gap:16px}

/* ---------------- Contenu éditorial (articles / pages texte) ---------------- */
.prose{max-width:var(--container-narrow)}
.prose h2{
  font:600 var(--fs-h2)/1.15 var(--font-display);letter-spacing:-.015em;text-transform:uppercase;
  color:var(--text-strong);margin-top:var(--space-9);margin-bottom:var(--space-5);
}
.prose h2:first-child{margin-top:0}
.prose h3{font:600 var(--fs-h4)/1.3 var(--font-display);letter-spacing:-.01em;color:var(--text-strong);
  margin-top:var(--space-7);margin-bottom:var(--space-3)}
.prose p{margin-bottom:var(--space-5);font-size:var(--fs-body);line-height:1.75;color:var(--text-body);max-width:66ch}
.prose ul{margin:0 0 var(--space-5);padding:0;display:flex;flex-direction:column;gap:12px}
.prose ul li{position:relative;padding-left:24px;font-size:var(--fs-body);line-height:1.65;color:var(--text-body)}
.prose ul li::before{content:"";position:absolute;left:0;top:11px;width:9px;height:1px;background:var(--primary-500)}
.prose blockquote{
  margin:var(--space-7) 0;padding:28px 32px;border-left:2px solid var(--primary-500);background:var(--bg-alt);
  font:500 var(--fs-h4)/1.5 var(--font-display);color:var(--text-strong);letter-spacing:-.005em;
}
.prose strong{color:var(--text-strong);font-weight:600}
.prose a:not(.btn){color:var(--primary-700);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--primary-200)}
.prose a:not(.btn):hover{text-decoration-color:var(--primary-500)}
.article-meta{
  display:flex;gap:16px;flex-wrap:wrap;margin-bottom:var(--space-6);
  font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-mono);text-transform:uppercase;color:var(--text-muted);
}

/* ---------------- Bloc "ce que couvre ce poste" (services) ---------------- */
.covers-grid{margin-top:56px;display:grid;grid-template-columns:repeat(2,1fr);gap:20px 40px}
.covers-item{position:relative;padding-left:28px;padding-top:2px}
.covers-item::before{content:"";position:absolute;left:0;top:10px;width:14px;height:1px;background:var(--primary-500)}
.covers-item h3{font:600 var(--fs-h4)/1.2 var(--font-display);letter-spacing:-.01em;color:var(--text-strong);text-transform:uppercase}
.covers-item p{margin-top:8px;font-size:var(--fs-sm);line-height:1.65;color:var(--text-body)}

/* ---------------- FAQ (accordion natif details/summary) ---------------- */
.faq-list{margin-top:56px;border-top:1px solid var(--line-hair)}
.faq-item{border-bottom:1px solid var(--line-hair)}
.faq-item summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:26px 4px;font:600 var(--fs-h4)/1.35 var(--font-display);letter-spacing:-.01em;color:var(--text-strong);
  min-height:44px;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary .plus{
  flex-shrink:0;width:22px;height:22px;position:relative;
}
.faq-item summary .plus::before,.faq-item summary .plus::after{
  content:"";position:absolute;background:var(--primary-500);transition:transform .3s var(--ease-out-expo);
}
.faq-item summary .plus::before{left:0;top:50%;width:100%;height:1px;transform:translateY(-50%)}
.faq-item summary .plus::after{top:0;left:50%;width:1px;height:100%;transform:translateX(-50%)}
.faq-item[open] summary .plus::after{transform:translateX(-50%) rotate(90deg);opacity:0}
.faq-item .faq-a{padding:0 4px 26px;max-width:68ch;font-size:var(--fs-body);line-height:1.7;color:var(--text-body)}
.faq-item[open] summary{color:var(--primary-700)}

/* ---------------- Cross-link cards (services/zones liés) ---------------- */
.crosslinks{margin-top:24px;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.crosslink-card{
  display:block;padding:24px;border:1px solid var(--line-hair);border-radius:var(--radius-md);background:var(--bg-surface);
  transition:border-color .3s ease,transform .3s var(--ease-out-expo);
}
.crosslink-card:hover{border-color:var(--primary-300);transform:translateY(-2px)}
.crosslink-card .kicker{font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-mono);text-transform:uppercase;color:var(--primary-600)}
.crosslink-card h3{margin-top:10px;font:600 var(--fs-h4)/1.2 var(--font-display);text-transform:uppercase;letter-spacing:-.01em;color:var(--text-strong)}
.crosslink-card .arrow{margin-top:14px;display:inline-block;color:var(--primary-600);font-family:var(--font-mono)}

/* ---------------- Liste communes / zone (pages service & zone) ---------------- */
.chip-list{margin-top:20px;display:flex;flex-wrap:wrap;gap:10px}
.chip-list a{
  padding:10px 18px;border:1px solid var(--line-hair);border-radius:999px;font:500 var(--fs-sm) var(--font-body);
  color:var(--text-body);transition:border-color .2s ease,color .2s ease;min-height:44px;display:inline-flex;align-items:center;
}
.chip-list a:hover{border-color:var(--primary-400);color:var(--primary-700)}

/* ---------------- À propos : timeline ---------------- */
.timeline{margin-top:64px;position:relative;padding-left:32px;border-left:1px solid var(--line-hair)}
.timeline-item{position:relative;padding-bottom:48px}
.timeline-item:last-child{padding-bottom:0}
.timeline-item::before{content:"";position:absolute;left:-37px;top:4px;width:9px;height:9px;background:var(--primary-500);border-radius:50%}
.timeline-item .year{font:500 var(--fs-cote)/1 var(--font-mono);letter-spacing:var(--ls-mono);text-transform:uppercase;color:var(--primary-600)}
.timeline-item h3{margin-top:8px;font:600 var(--fs-h4)/1.25 var(--font-display);letter-spacing:-.01em;color:var(--text-strong)}
.timeline-item p{margin-top:8px;max-width:60ch;font-size:var(--fs-body);line-height:1.7;color:var(--text-body)}

/* ---------------- Valeurs (à propos) ---------------- */
.values-grid{margin-top:56px;display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.value-card{padding-top:24px;border-top:1px solid var(--line-hair)}
.value-card .num{font:500 var(--fs-cote) var(--font-mono);letter-spacing:var(--ls-mono);color:var(--primary-600)}
.value-card h3{margin-top:14px;font:600 var(--fs-h3)/1.2 var(--font-display);text-transform:uppercase;letter-spacing:-.01em;color:var(--text-strong)}
.value-card p{margin-top:12px;font-size:var(--fs-sm);line-height:1.65;color:var(--text-body)}

/* ---------------- Réalisations : galerie filtrable ---------------- */
.gallery-filters{margin-top:40px;display:flex;flex-wrap:wrap;gap:10px}
.gallery-filters button{
  padding:10px 18px;border:1px solid var(--line-hair);border-radius:999px;font:500 var(--fs-sm) var(--font-body);
  color:var(--text-body);min-height:44px;transition:border-color .2s ease,background-color .2s ease,color .2s ease;
}
.gallery-filters button:hover{border-color:var(--primary-300)}
.gallery-filters button.is-active{background:var(--neutral-950);border-color:var(--neutral-950);color:#FFF}
.gallery-grid{margin-top:40px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.gallery-grid .work{min-height:340px;transition:opacity .35s ease,transform .35s ease}
.gallery-grid .work.is-hidden{display:none}

/* ---------------- Page Devis / Contact ---------------- */
.page-form{
  margin-top:56px;background:var(--bg-surface);border:1px solid var(--line-hair);border-radius:var(--radius-md);
  padding:clamp(28px,4vw,56px);box-shadow:var(--shadow-md);
}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.contact-nap{font-style:normal}
.contact-nap dt{font:500 var(--fs-cote) var(--font-mono);letter-spacing:var(--ls-mono);text-transform:uppercase;color:var(--text-muted);margin-top:24px}
.contact-nap dt:first-child{margin-top:0}
.contact-nap dd{margin:6px 0 0;font-size:var(--fs-lead);color:var(--text-strong)}
.contact-map{margin-top:32px;border:1px solid var(--line-hair);border-radius:var(--radius-md);overflow:hidden;filter:grayscale(.3) contrast(1.05)}
.contact-map iframe{display:block;width:100%;height:320px;border:0}

/* ---------------- Légal ---------------- */
.legal-updated{margin-top:8px;font:500 var(--fs-cote) var(--font-mono);letter-spacing:var(--ls-mono);text-transform:uppercase;color:var(--text-muted)}

/* ---------------- Responsive : ajouts pages secondaires ---------------- */
@media (max-width:1080px){
  .covers-grid{grid-template-columns:1fr}
  .crosslinks{grid-template-columns:1fr}
  .values-grid{grid-template-columns:1fr}
  .gallery-grid{grid-template-columns:repeat(2,1fr)}
  .contact-grid{grid-template-columns:1fr;gap:40px}
}
@media (max-width:640px){
  .gallery-grid{grid-template-columns:1fr}
  .mini-hero{padding-top:calc(64px + var(--space-7))}
  .nav-dropdown{display:none}
}
@media (max-width:860px){
  .nav-item .caret{display:none}
}