/* ==========================================================================
   LCG Building — feuille de style
   1. Tokens · 2. Base · 3. Header · 4. Hero · 5. Sections · 6. Composants
   7. Lightbox · 8. Footer · 9. Responsive
   ========================================================================== */

/* ── 1. Tokens ─────────────────────────────────────────────────────────── */
:root{
  --ink:        #0f1115;
  --ink-soft:   #14171d;
  --ink-line:   #242833;
  --paper:      #ffffff;
  --paper-alt:  #f6f5f2;
  --text:       #1b1e25;
  --muted:      #6b7280;
  --muted-dark: #9aa1ad;
  --accent:     #f0a202;
  --accent-dk:  #b87d00;
  --accent-soft:rgba(240,162,2,.14);

  --radius:     14px;
  --radius-lg:  22px;
  --shadow:     0 1px 2px rgba(16,20,30,.05), 0 18px 40px -16px rgba(16,20,30,.22);
  --container:  1200px;
  --ease:       cubic-bezier(.22,.61,.36,1);

  --font:       "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-head:  "Archivo", "Inter", system-ui, sans-serif;
}

/* ── 2. Base ───────────────────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:92px; }

body{
  margin:0; overflow-x:hidden;
  font-family:var(--font); font-size:16px; line-height:1.65;
  color:var(--text); background:var(--paper);
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; display:block; }
a{ color:inherit; }

h1,h2,h3,h4{ font-family:var(--font-head); line-height:1.08; letter-spacing:-.025em; margin:0 0 .6em; }
h2{ font-size:clamp(1.9rem, 3.8vw, 3rem); }
h3{ font-size:1.18rem; letter-spacing:-.01em; }
h4{ font-size:.95rem; }
p{ margin:0 0 1em; }

.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:24px; }

.skip{ position:absolute; left:-9999px; top:0; background:var(--accent); color:var(--ink);
  padding:10px 18px; z-index:300; font-weight:600; }
.skip:focus{ left:12px; top:12px; }

:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:4px; }

.eyebrow{ font-size:.78rem; letter-spacing:.16em; text-transform:uppercase;
  font-weight:600; color:var(--accent-dk); margin:0 0 .9rem; }

/* Barre de progression de lecture */
.progress{ position:fixed; top:0; left:0; height:3px; width:0;
  background:linear-gradient(90deg,var(--accent),#ffd166); z-index:150;
  transition:width .1s linear; }

/* Boutons */
.btn{
  --btn-bg:var(--ink); --btn-fg:#fff;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.95rem 1.6rem; border-radius:999px; border:1px solid transparent;
  background:var(--btn-bg); color:var(--btn-fg);
  font-family:var(--font); font-weight:600; font-size:.95rem; text-decoration:none; cursor:pointer;
  transition:transform .18s var(--ease), background .18s var(--ease), box-shadow .18s var(--ease);
}
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }
.btn--primary{ --btn-bg:var(--accent); --btn-fg:var(--ink); box-shadow:0 12px 26px -14px rgba(240,162,2,1); }
.btn--primary:hover{ --btn-bg:#ffb31f; }
.btn--ghost{ --btn-bg:transparent; --btn-fg:#fff; border-color:rgba(255,255,255,.34); }
.btn--ghost:hover{ --btn-bg:rgba(255,255,255,.1); }
.btn--dark{ --btn-bg:var(--ink); --btn-fg:#fff; }
.btn--sm{ padding:.6rem 1.15rem; font-size:.88rem; }
.btn--lg{ padding:1.1rem 2rem; font-size:1rem; }
.btn--block{ width:100%; }

/* ── 3. Header ─────────────────────────────────────────────────────────── */
.header{ position:fixed; inset:0 0 auto 0; z-index:100;
  transition:background .3s var(--ease), box-shadow .3s var(--ease); }
.header.is-stuck{ background:rgba(15,17,21,.93);
  backdrop-filter:saturate(180%) blur(14px); box-shadow:0 1px 0 rgba(255,255,255,.08); }
.header__inner{ display:flex; align-items:center; justify-content:space-between; height:84px; gap:1.5rem; }

.logo{ display:flex; align-items:center; gap:.6rem; text-decoration:none; color:#fff; flex-shrink:0; }
.logo__mark{ color:var(--accent); display:flex; }
.logo__text{ font-family:var(--font-head); font-weight:800; font-size:1.15rem;
  letter-spacing:-.02em; text-transform:uppercase; }
.logo__text span{ color:var(--accent); }

.nav{ display:flex; align-items:center; gap:1.7rem; }
.nav__link{ position:relative; color:rgba(255,255,255,.8); text-decoration:none;
  font-size:.92rem; font-weight:500; transition:color .18s var(--ease); white-space:nowrap; }
.nav__link::after{ content:""; position:absolute; left:0; right:100%; bottom:-6px; height:2px;
  background:var(--accent); transition:right .25s var(--ease); }
.nav__link:hover{ color:#fff; }
.nav__link:hover::after,.nav__link.is-current::after{ right:0; }
.nav__link.is-current{ color:#fff; }
.nav__cta{ display:flex; align-items:center; gap:1rem; }
.nav__phone{ display:flex; align-items:center; gap:.4rem; color:#fff; text-decoration:none;
  font-weight:600; font-size:.9rem; white-space:nowrap; }
.nav__phone svg{ color:var(--accent); }

.burger{ display:none; width:44px; height:44px; border:0; background:transparent; cursor:pointer;
  flex-direction:column; justify-content:center; gap:5px; padding:0; }
.burger span{ display:block; height:2px; background:#fff; border-radius:2px;
  transition:transform .25s var(--ease), opacity .2s; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ── 4. Hero ───────────────────────────────────────────────────────────── */
.hero{ position:relative; min-height:min(96vh,900px); display:flex; align-items:center;
  background:var(--ink); color:#fff; overflow:hidden; padding:150px 0 110px; }
.hero__media{ position:absolute; inset:0; }
.hero__media img{ width:100%; height:100%; object-fit:cover; opacity:.55;
  transform:scale(1.06); animation:heroZoom 18s var(--ease) forwards; }
@keyframes heroZoom{ to{ transform:scale(1); } }
.hero__media::after{ content:""; position:absolute; inset:0;
  background:
    linear-gradient(105deg, rgba(12,14,18,.96) 12%, rgba(12,14,18,.72) 48%, rgba(12,14,18,.35) 100%),
    linear-gradient(0deg, rgba(12,14,18,.92) 0%, transparent 42%); }
.hero__inner{ position:relative; max-width:880px; }
.hero__title{ font-size:clamp(2.1rem, 6.6vw, 5.2rem); margin-bottom:1.1rem;
  letter-spacing:-.04em; font-weight:900; overflow-wrap:break-word; }
.hero__title em{ font-style:normal; color:var(--accent); }
.hero__lead{ font-size:clamp(1.02rem,1.45vw,1.22rem); color:rgba(255,255,255,.8); max-width:640px; }
.hero__cta{ display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2.2rem; }
.hero__badges{ list-style:none; display:flex; flex-wrap:wrap; gap:2.4rem;
  margin:3.2rem 0 0; padding:1.8rem 0 0; border-top:1px solid rgba(255,255,255,.14); }
.hero__badges li{ display:flex; flex-direction:column; }
.hero__badges strong{ font-family:var(--font-head); font-size:1.4rem; color:var(--accent); line-height:1.1; }
.hero__badges span{ font-size:.85rem; color:rgba(255,255,255,.62); }

.hero__scroll{ position:absolute; left:50%; bottom:28px; transform:translateX(-50%);
  width:26px; height:42px; border:2px solid rgba(255,255,255,.3); border-radius:14px; }
.hero__scroll span{ position:absolute; left:50%; top:8px; width:3px; height:8px; border-radius:2px;
  background:var(--accent); transform:translateX(-50%); animation:scrollCue 1.8s infinite; }
@keyframes scrollCue{ 0%{opacity:0;transform:translate(-50%,0)} 40%{opacity:1} 80%{opacity:0;transform:translate(-50%,14px)} 100%{opacity:0} }

/* Bandeau défilant */
.marquee{ background:var(--accent); color:var(--ink); overflow:hidden; padding:.85rem 0;
  border-block:1px solid rgba(0,0,0,.12); }
.marquee__track{ display:flex; align-items:center; gap:2rem; width:max-content;
  animation:slide 38s linear infinite; }
.marquee span{ font-family:var(--font-head); font-weight:700; font-size:.95rem;
  text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; }
.marquee i{ font-style:normal; font-size:.6rem; opacity:.5; }
@keyframes slide{ to{ transform:translateX(-50%); } }

/* ── 5. Sections ───────────────────────────────────────────────────────── */
.section{ padding:clamp(72px,9vw,124px) 0; }
.section--alt{ background:var(--paper-alt); }
.section--dark{ background:var(--ink); color:#fff; }
.section--dark h2,.section--dark h3{ color:#fff; }
.section--dark .eyebrow{ color:var(--accent); }
.section--dark .section__lead{ color:rgba(255,255,255,.72); }
.section__head{ max-width:680px; margin-bottom:3.4rem; }
.section__head--center{ margin-inline:auto; text-align:center; }
.section__lead{ color:var(--muted); font-size:1.05rem; }

/* ── 6. Composants ─────────────────────────────────────────────────────── */

/* Services */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; align-items:start; }
.svc{ background:var(--paper); border:1px solid rgba(15,17,21,.09); border-radius:var(--radius-lg);
  overflow:hidden; transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s; }
.svc:hover{ transform:translateY(-5px); box-shadow:var(--shadow); border-color:rgba(240,162,2,.5); }
.svc__media{ aspect-ratio:16/10; overflow:hidden; background:var(--ink); }
.svc__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.svc:hover .svc__media img{ transform:scale(1.06); }
.svc__body{ padding:1.7rem 1.6rem 1.8rem; }
.svc__body p{ color:var(--muted); font-size:.95rem; margin-bottom:1rem; }
.svc__toggle{ display:inline-flex; align-items:center; gap:.45rem; padding:0; border:0;
  background:none; cursor:pointer; color:var(--accent-dk);
  font-family:var(--font); font-weight:600; font-size:.88rem; }
.svc__toggle::after{ content:"+"; font-size:1.05rem; line-height:1; transition:transform .25s var(--ease); }
.svc__toggle[aria-expanded="true"]::after{ transform:rotate(45deg); }
.svc__list{ list-style:none; margin:0; padding:0; max-height:0; overflow:hidden;
  transition:max-height .4s var(--ease), margin .3s var(--ease); }
.svc__list.is-open{ max-height:340px; margin-top:1rem; }
.svc__list li{ position:relative; padding:.4rem 0 .4rem 1.2rem; font-size:.9rem; color:var(--muted);
  border-top:1px solid rgba(15,17,21,.06); }
.svc__list li::before{ content:""; position:absolute; left:0; top:1.05em;
  width:5px; height:5px; border-radius:50%; background:var(--accent); }

/* Secteurs */
.sectors{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.sector{ padding:2.2rem 1.9rem; border-radius:var(--radius-lg);
  border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.03); }
.sector--featured{ background:var(--accent); color:var(--ink); border-color:transparent; }
.sector--featured h3{ color:var(--ink); }
.sector__idx{ display:inline-block; font-size:.72rem; letter-spacing:.16em; text-transform:uppercase;
  font-weight:700; color:var(--accent); margin-bottom:1rem; }
.sector--featured .sector__idx{ color:rgba(15,17,21,.6); }
.sector p{ color:rgba(255,255,255,.72); font-size:.95rem; }
.sector--featured p{ color:rgba(15,17,21,.78); }
.sector ul{ list-style:none; margin:1.4rem 0 0; padding:1.2rem 0 0; display:grid; gap:.6rem;
  border-top:1px solid rgba(255,255,255,.14); font-size:.9rem; color:rgba(255,255,255,.82); }
.sector--featured ul{ border-color:rgba(15,17,21,.18); color:rgba(15,17,21,.82); }
.sector li{ position:relative; padding-left:1.4rem; }
.sector li::before{ content:""; position:absolute; left:0; top:.44em; width:11px; height:6px;
  border-left:2px solid var(--accent); border-bottom:2px solid var(--accent); transform:rotate(-45deg); }
.sector--featured li::before{ border-color:var(--ink); }

/* Filtres */
.filters{ display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:1.8rem; }
.filter{ padding:.55rem 1.15rem; border-radius:999px; cursor:pointer;
  border:1px solid rgba(15,17,21,.14); background:transparent; color:var(--muted);
  font-family:var(--font); font-size:.88rem; font-weight:600;
  transition:background .2s, color .2s, border-color .2s; }
.filter:hover{ border-color:var(--ink); color:var(--text); }
.filter.is-active{ background:var(--ink); border-color:var(--ink); color:#fff; }

/* Réalisations */
.works{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.work{ position:relative; border-radius:var(--radius-lg); overflow:hidden; cursor:pointer;
  background:var(--ink); color:#fff; min-height:310px;
  display:flex; flex-direction:column; justify-content:flex-end; }
.work--tall{ grid-row:span 2; grid-column:span 2; min-height:440px; }
.work.is-hidden{ display:none; }
.work__media{ position:absolute; inset:0; }
.work__media img{ width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease); }
.work__media::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(12,14,18,.1) 25%, rgba(12,14,18,.93) 100%); }
.work:hover .work__media img{ transform:scale(1.06); }
.work__body{ position:relative; padding:1.9rem; }
.work__body h3{ margin-bottom:.4rem; }
.work__body p{ margin:0; color:rgba(255,255,255,.75); font-size:.93rem; max-width:46ch; }
.work__more{ display:inline-block; margin-top:.9rem; font-size:.85rem; font-weight:600;
  color:var(--accent); opacity:0; transform:translateX(-6px);
  transition:opacity .25s var(--ease), transform .25s var(--ease); }
.work:hover .work__more{ opacity:1; transform:none; }
.tag{ display:inline-block; margin-bottom:.8rem; padding:.28rem .72rem; border-radius:999px;
  background:var(--accent); color:var(--ink);
  font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.works__empty{ margin-top:2rem; color:var(--muted); }

/* Avant / Après */
.ba{ display:grid; grid-template-columns:.8fr 1.2fr; gap:3.5rem; align-items:center; }
.ba__facts{ display:flex; gap:2.4rem; margin:2rem 0 0; }
.ba__facts dt{ font-size:.74rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }
.ba__facts dd{ margin:.25rem 0 0; font-family:var(--font-head); font-weight:700; font-size:1.25rem; }
.ba__viewer{ position:relative; margin:0; border-radius:var(--radius-lg); overflow:hidden;
  aspect-ratio:3/2; background:var(--ink); user-select:none; box-shadow:var(--shadow); }
.ba__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ba__clip{ position:absolute; inset:0; overflow:hidden; clip-path:inset(0 50% 0 0); }
.ba__label{ position:absolute; top:14px; padding:.3rem .8rem; border-radius:999px;
  font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  background:rgba(12,14,18,.72); color:#fff; backdrop-filter:blur(6px); }
.ba__label--before{ left:14px; }
.ba__label--after{ right:14px; background:var(--accent); color:var(--ink); }
.ba__handle{ position:absolute; inset:0; }
.ba__handle input[type=range]{ position:absolute; inset:0; width:100%; height:100%;
  margin:0; opacity:0; cursor:ew-resize; }
.ba__grip{ position:absolute; top:0; bottom:0; left:50%; width:2px; background:#fff;
  transform:translateX(-50%); pointer-events:none; box-shadow:0 0 14px rgba(0,0,0,.5); }
.ba__grip::after{ content:"⇄"; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:46px; height:46px; border-radius:50%; background:#fff; color:var(--ink);
  display:grid; place-items:center; font-size:1.1rem; box-shadow:0 6px 18px rgba(0,0,0,.35); }

/* Méthode */
.methode{ display:grid; grid-template-columns:.85fr 1.15fr; gap:4rem; align-items:start; }
.methode__photo{ margin:2rem 0; border-radius:var(--radius); overflow:hidden; }
.methode__photo img{ aspect-ratio:16/10; object-fit:cover; width:100%; }
.methode__photo figcaption{ padding:.7rem .2rem 0; font-size:.85rem; color:var(--muted); }
.steps{ list-style:none; margin:0; padding:0; }
.step{ display:flex; gap:1.6rem; padding:1.7rem 0; border-top:1px solid rgba(15,17,21,.1); }
.step:last-child{ border-bottom:1px solid rgba(15,17,21,.1); }
.step__num{ font-family:var(--font-head); font-weight:800; font-size:1.5rem;
  color:var(--accent); line-height:1.2; flex-shrink:0; width:2.6rem; }
.step h3{ margin-bottom:.35rem; display:flex; flex-wrap:wrap; align-items:center; gap:.7rem; }
.step__time{ font-family:var(--font); font-size:.72rem; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; color:var(--accent-dk); background:var(--accent-soft);
  padding:.2rem .6rem; border-radius:999px; }
.step p{ margin:0; color:var(--muted); font-size:.96rem; }

/* Estimateur */
.est{ display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; }
.est__note{ list-style:none; margin:2rem 0 0; padding:0; display:grid; gap:.6rem;
  font-size:.9rem; color:rgba(255,255,255,.6); }
.est__note li{ position:relative; padding-left:1.4rem; }
.est__note li::before{ content:""; position:absolute; left:0; top:.55em;
  width:6px; height:6px; border-radius:50%; background:var(--accent); }
.est__panel{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.12);
  border-radius:var(--radius-lg); padding:2rem; }
.range{ -webkit-appearance:none; appearance:none; width:100%; height:5px; border-radius:99px;
  background:rgba(255,255,255,.18); outline:none; margin:.4rem 0; }
.range::-webkit-slider-thumb{ -webkit-appearance:none; width:22px; height:22px; border-radius:50%;
  background:var(--accent); cursor:grab; border:3px solid var(--ink); box-shadow:0 0 0 1px var(--accent); }
.range::-moz-range-thumb{ width:18px; height:18px; border-radius:50%; background:var(--accent);
  cursor:grab; border:3px solid var(--ink); }
.range__scale{ display:flex; justify-content:space-between; font-size:.75rem; color:var(--muted-dark); }
.segmented{ display:grid; grid-template-columns:repeat(3,1fr); gap:.4rem; padding:.3rem;
  background:rgba(255,255,255,.06); border-radius:999px; }
.segmented button{ padding:.6rem .4rem; border:0; border-radius:999px; cursor:pointer;
  background:transparent; color:rgba(255,255,255,.7);
  font-family:var(--font); font-size:.85rem; font-weight:600; transition:background .2s, color .2s; }
.segmented button.is-active{ background:var(--accent); color:var(--ink); }
.check{ display:flex; align-items:flex-start; gap:.6rem; margin-bottom:.7rem;
  font-size:.88rem; color:rgba(255,255,255,.78); cursor:pointer; font-weight:400; }
.check input{ margin-top:.25rem; accent-color:var(--accent); width:16px; height:16px; flex-shrink:0; }
.est__result{ margin:1.8rem 0 1.4rem; padding:1.4rem; border-radius:var(--radius);
  background:rgba(240,162,2,.12); border:1px solid rgba(240,162,2,.35); text-align:center; }
.est__label{ display:block; font-size:.74rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); margin-bottom:.4rem; }
.est__amount{ display:block; font-family:var(--font-head); font-weight:700;
  font-size:clamp(1.05rem,1.8vw,1.28rem); color:#fff; line-height:1.35; }
.est__unit{ display:block; margin-top:.4rem; font-size:.85rem; color:var(--muted-dark); }

/* À propos */
.about{ display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center;
  margin-bottom:clamp(48px,6vw,80px); }
.about__media{ margin:0; position:relative; border-radius:var(--radius-lg); overflow:hidden; }
.about__media img{ width:100%; aspect-ratio:4/3.4; object-fit:cover; }
.about__media figcaption{ position:absolute; left:18px; bottom:18px; right:18px;
  padding:.9rem 1.1rem; border-radius:var(--radius); font-size:.9rem;
  background:rgba(12,14,18,.78); color:#fff; backdrop-filter:blur(8px); }
.about__media strong{ color:var(--accent); }
.about p{ color:var(--muted); }
.checklist{ list-style:none; margin:1.6rem 0 0; padding:0; display:grid; gap:.75rem; }
.checklist li{ position:relative; padding-left:2rem; font-size:.96rem; }
.checklist li::before{ content:""; position:absolute; left:0; top:.42em; width:14px; height:8px;
  border-left:2.5px solid var(--accent); border-bottom:2.5px solid var(--accent); transform:rotate(-45deg); }

/* Zone */
.zone{ display:grid; grid-template-columns:1.1fr .9fr; gap:4rem; align-items:center; }
.zone__tags{ display:flex; flex-wrap:wrap; gap:.55rem; margin:1.8rem 0 1.4rem; }
.zone__tags span{ padding:.45rem 1rem; border-radius:999px; background:var(--paper);
  border:1px solid rgba(15,17,21,.1); font-size:.87rem; font-weight:500; }
.zone__small{ font-size:.9rem; color:var(--muted); margin:0; }
.zone__map svg{ width:100%; max-width:380px; margin-inline:auto; }

/* FAQ */
.faq{ display:grid; grid-template-columns:.75fr 1.25fr; gap:4rem; align-items:start; }
.qa{ border-top:1px solid rgba(15,17,21,.12); }
.qa:last-child{ border-bottom:1px solid rgba(15,17,21,.12); }
.qa summary{ list-style:none; cursor:pointer; padding:1.25rem 2.5rem 1.25rem 0; position:relative;
  font-family:var(--font-head); font-weight:700; font-size:1.02rem; letter-spacing:-.01em; }
.qa summary::-webkit-details-marker{ display:none; }
.qa summary::after{ content:""; position:absolute; right:.4rem; top:1.6rem;
  width:11px; height:11px; border-right:2px solid var(--accent); border-bottom:2px solid var(--accent);
  transform:rotate(45deg); transition:transform .25s var(--ease); }
.qa[open] summary::after{ transform:rotate(-135deg); }
.qa p{ margin:0 0 1.3rem; color:var(--muted); font-size:.95rem; max-width:64ch; }

/* Bandeau CTA */
.cta{ position:relative; padding:clamp(70px,8vw,110px) 0; color:#fff; overflow:hidden; background:var(--ink); }
.cta__bg{ position:absolute; inset:0; }
.cta__bg img{ width:100%; height:100%; object-fit:cover; opacity:.22; }
.cta__bg::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(12,14,18,.94), rgba(12,14,18,.6)); }
.cta__inner{ position:relative; text-align:center; max-width:640px; }
.cta__inner h2{ color:#fff; }
.cta__inner p{ color:rgba(255,255,255,.72); font-size:1.05rem; }
.cta__btns{ display:flex; flex-wrap:wrap; gap:.9rem; justify-content:center; margin-top:1.8rem; }

/* Contact */
.contact{ background:var(--ink); color:#fff; }
.contact h2{ color:#fff; }
.contact .eyebrow{ color:var(--accent); }
.contact .section__lead{ color:rgba(255,255,255,.72); }
.contact__grid{ display:grid; grid-template-columns:1fr 1.05fr; gap:4rem; align-items:start; }
.contact__list{ list-style:none; margin:2.4rem 0 0; padding:0; display:grid; gap:1.3rem; }
.contact__list li{ display:grid; gap:.2rem; padding-bottom:1.1rem;
  border-bottom:1px solid rgba(255,255,255,.1); }
.contact__label{ font-size:.75rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-dark); }
.contact__list a{ text-decoration:none; font-size:1.05rem; font-weight:600; overflow-wrap:anywhere; }
.contact__list a:hover{ color:var(--accent); }
.contact__seals{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:2rem; }
.contact__seals span{ padding:.45rem 1rem; border-radius:999px; font-size:.82rem; font-weight:600;
  border:1px solid rgba(240,162,2,.4); color:var(--accent); }

.form{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1);
  border-radius:var(--radius-lg); padding:2rem; }
.field{ margin-bottom:1.1rem; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.field label{ display:block; font-size:.85rem; font-weight:600; margin-bottom:.45rem;
  color:rgba(255,255,255,.85); }
.field input[type=text],.field input[type=email],.field input[type=tel],
.field select,.field textarea{
  width:100%; padding:.85rem 1rem; border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05);
  color:#fff; font-family:inherit; font-size:.95rem; transition:border-color .2s, background .2s; }
.field textarea{ resize:vertical; }
.field input::placeholder,.field textarea::placeholder{ color:rgba(255,255,255,.38); }
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--accent); background:rgba(255,255,255,.08); }
.field select option{ color:#111; }
.field.is-error input,.field.is-error textarea,.field.is-error select{ border-color:#ff6b6b; }
.check--rgpd{ margin:0 0 1.2rem; }
.check--rgpd.is-error span{ color:#ff8f8f; }
.form__note{ font-size:.8rem; color:var(--muted-dark); margin:1rem 0 0; }
.form__status{ margin:.8rem 0 0; font-size:.9rem; font-weight:600; color:var(--accent); min-height:1.2em; }
.form__status--ok{ color:#4ade80; }
.form__status--err{ color:#ff8f8f; }
.form__status a{ color:inherit; }
.honey{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.btn[disabled]{ opacity:.6; cursor:progress; transform:none; }

/* ── 7. Lightbox ───────────────────────────────────────────────────────── */
.lightbox{ position:fixed; inset:0; z-index:200; display:grid; place-items:center; padding:24px; }
.lightbox[hidden]{ display:none; }
.lightbox__backdrop{ position:absolute; inset:0; background:rgba(8,10,14,.82); backdrop-filter:blur(6px); }
.lightbox__panel{ position:relative; width:min(940px,100%); max-height:90vh; overflow-y:auto;
  background:var(--paper); border-radius:var(--radius-lg); display:grid; grid-template-columns:1fr 1fr;
  animation:lbIn .3s var(--ease); }
@keyframes lbIn{ from{ opacity:0; transform:translateY(16px) scale(.98); } }
.lightbox__close{ position:absolute; top:12px; right:14px; z-index:2; width:38px; height:38px;
  border-radius:50%; border:0; cursor:pointer; font-size:1.5rem; line-height:1;
  background:rgba(12,14,18,.7); color:#fff; }
.lightbox__media{ margin:0; }
.lightbox__media img{ width:100%; height:100%; min-height:260px; object-fit:cover;
  border-radius:var(--radius-lg) 0 0 var(--radius-lg); }
.lightbox__body{ padding:2rem 1.9rem; }
.lightbox__body h4{ margin:1.4rem 0 .6rem; font-size:.78rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted); }
.lightbox__body > p{ color:var(--muted); font-size:.95rem; }
.lightbox__facts{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem 1.2rem; margin:1.4rem 0 0;
  padding:1.2rem 0; border-block:1px solid rgba(15,17,21,.1); }
.lightbox__facts dt{ font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); }
.lightbox__facts dd{ margin:.15rem 0 0; font-weight:600; font-size:.98rem; }
.lightbox__presta{ list-style:none; margin:0 0 1.6rem; padding:0; display:grid; gap:.45rem; }
.lightbox__presta li{ position:relative; padding-left:1.4rem; font-size:.92rem; color:var(--muted); }
.lightbox__presta li::before{ content:""; position:absolute; left:0; top:.42em; width:11px; height:6px;
  border-left:2px solid var(--accent); border-bottom:2px solid var(--accent); transform:rotate(-45deg); }
body.is-locked{ overflow:hidden; }

/* ── 8. Footer ─────────────────────────────────────────────────────────── */
.footer{ background:#0b0d11; color:rgba(255,255,255,.68); padding:4.5rem 0 1.5rem; }
.footer__inner{ display:grid; grid-template-columns:1.1fr 2fr; gap:3.5rem; }
.footer__brand .logo__text{ color:#fff; display:block; margin-bottom:1rem; }
.footer__brand p{ font-size:.92rem; max-width:36ch; margin-bottom:1.4rem; }
.footer__nav{ display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
.footer__nav h4{ color:#fff; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; margin-bottom:1.1rem; }
.footer__nav a,.footer__nav span{ display:block; text-decoration:none; font-size:.91rem;
  margin-bottom:.55rem; overflow-wrap:break-word; }
.footer__nav a:hover{ color:var(--accent); }
.footer__bottom{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem;
  margin-top:3.2rem; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.1);
  font-size:.83rem; color:var(--muted-dark); }
.footer__bottom p{ margin:0; }
.footer__bottom a{ text-decoration:none; }
.footer__bottom a:hover{ color:var(--accent); }
.footer__credit{ opacity:.7; }

/* Apparitions */
.reveal{ opacity:0; transform:translateY(24px);
  transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-visible{ opacity:1; transform:none; }

/* ── 9. Responsive ─────────────────────────────────────────────────────── */
@media (max-width:1100px){
  .nav{ gap:1.1rem; }
  .nav__phone{ display:none; }
}
@media (max-width:1000px){
  .cards,.sectors{ grid-template-columns:repeat(2,1fr); }
  .works{ grid-template-columns:repeat(2,1fr); }
  .work--tall{ grid-column:span 2; grid-row:auto; }
  .works > .work:last-child:not(.is-hidden){ grid-column:span 2; }
  .methode,.about,.contact__grid,.ba,.est,.faq,.zone{ grid-template-columns:1fr; gap:2.8rem; }
  .footer__inner{ grid-template-columns:1fr; }
  .lightbox__panel{ grid-template-columns:1fr; }
  .lightbox__media img{ max-height:280px; border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
}
@media (max-width:760px){
  html{ scroll-padding-top:76px; }
  .header__inner{ height:72px; }
  .burger{ display:flex; }
  .nav{ position:fixed; inset:72px 0 auto 0; flex-direction:column; align-items:stretch; gap:0;
    background:rgba(15,17,21,.98); backdrop-filter:blur(12px); padding:1rem 24px 1.6rem;
    transform:translateY(-130%); transition:transform .32s var(--ease);
    border-bottom:1px solid rgba(255,255,255,.1); max-height:calc(100vh - 72px); overflow-y:auto; }
  .nav.is-open{ transform:translateY(0); }
  .nav__link{ padding:.9rem 0; border-bottom:1px solid rgba(255,255,255,.08); }
  .nav__link::after{ display:none; }
  .nav__cta{ flex-direction:column; align-items:stretch; margin-top:1.2rem; }
  .nav__phone{ display:flex; justify-content:center; padding:.6rem 0; }
  .hero{ padding:116px 0 80px; min-height:auto; }
  .hero__cta .btn{ flex:1 1 auto; }
  .hero__badges{ gap:1.4rem 2rem; margin-top:2.4rem; }
  .hero__scroll{ display:none; }
  .cards,.sectors,.works{ grid-template-columns:1fr; }
  .work--tall{ grid-column:auto; }
  .field-row{ grid-template-columns:1fr; }
  .footer__nav{ grid-template-columns:1fr 1fr; }
  .form,.est__panel{ padding:1.5rem; }
  .ba__facts{ gap:1.6rem; }
  .segmented{ grid-template-columns:1fr; border-radius:var(--radius); }
  .segmented button{ border-radius:var(--radius); }
  .lightbox{ padding:0; }
  .lightbox__panel{ max-height:100vh; border-radius:0; }
  .lightbox__media img{ border-radius:0; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
  .work__more{ opacity:1; transform:none; }
}
