/* Polices servies depuis le domaine du site : aucune requête vers Google, aucun
   transfert d'adresse IP hors UE, et une requête de moins dans la chaîne critique
   (l'@import Google Fonts obligeait à charger le CSS distant avant les fontes).
   Fichiers dans assets/fonts/ — Outfit et Inter en variable, IBM Plex Mono en statique. */
@font-face{font-family:'Outfit';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/outfit-100-900-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Outfit';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/outfit-100-900-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/inter-100-900-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('fonts/inter-100-900-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/plexmono-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/plexmono-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/plexmono-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/plexmono-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

:root{
  --ink:#0b1220;
  --ink-2:#141c2b;
  --ink-3:#1c2635;
  --paper:#f6f8fa;
  --surface:#ffffff;
  --line:#e3e8ee;
  --line-soft: rgba(255,255,255,0.14);
  --slate:#516175;
  --slate-2:#8b97a6;
  --sky:#29abe2;
  --sky-deep:#2483b7;
  --orange:#e8531e;
  --radius:10px;
  --radius-sm:6px;
  --shadow-1: 0 1px 2px rgba(11,18,32,0.04), 0 8px 24px rgba(11,18,32,0.06);
  --shadow-2: 0 12px 32px rgba(11,18,32,0.12);
  --nav-h: 84px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

body{
  margin:0;
  font-family:'Inter', system-ui, sans-serif;
  font-size:16px;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  opacity:0;
}
body.is-ready{ opacity:1; transition:opacity 0.35s ease; }

h1,h2,h3,h4{
  font-family:'Outfit', system-ui, sans-serif;
  margin:0;
  letter-spacing:-0.015em;
  color:var(--ink);
}

.mono{ font-family:'IBM Plex Mono', ui-monospace, monospace; }

/* Les titres sur fond sombre doivent hériter du blanc du conteneur, pas du navy par défaut */
.hero h1, .page-hero h1, .section--dark h2, .section--dark h3, .cta-band h2{ color:inherit; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
button{ font-family:inherit; }
ul{ list-style:none; }

.wrap{ max-width:1240px; margin:0 auto; padding:0 32px; }
@media (max-width:640px){ .wrap{ padding:0 20px; } }

.cursor-pointer, a, button, .service-card, .city-card, .value-card{ cursor:pointer; }

::selection{ background:var(--orange); color:#fff; }
:focus-visible{ outline:2px solid var(--sky); outline-offset:3px; border-radius:2px; }

/* ================= Signature device: precision mark-frame ================= */
.mark-frame{ position:relative; }
.mark-frame .mf-c{
  position:absolute; width:14px; height:14px; pointer-events:none;
  border:0 solid var(--orange); opacity:0;
  transform:scale(0.6);
  transition: opacity 0.5s ease, transform 0.5s ease;
  transition-delay:0.15s;
}
.mark-frame .mf-tl{ top:-1px; left:-1px; border-top-width:2px; border-left-width:2px; }
.mark-frame .mf-tr{ top:-1px; right:-1px; border-top-width:2px; border-right-width:2px; }
.mark-frame .mf-bl{ bottom:-1px; left:-1px; border-bottom-width:2px; border-left-width:2px; }
.mark-frame .mf-br{ bottom:-1px; right:-1px; border-bottom-width:2px; border-right-width:2px; }
.mark-frame.is-visible .mf-c{ opacity:0.7; transform:scale(1); }
.mark-frame:hover .mf-c{ opacity:1; border-color:var(--sky); }
.mark-frame.on-dark .mf-c{ border-color:var(--sky); }
.mark-frame.on-dark:hover .mf-c{ border-color:var(--orange); }

/* ================= Reveal on scroll ================= */
.reveal{ opacity:0; transform:translateY(16px); transition:opacity 0.6s ease, transform 0.6s ease; }
.reveal.is-visible{ opacity:1; transform:none; }

/* ================= Floating navbar ================= */
.navbar{
  position:fixed; top:16px; left:16px; right:16px; z-index:200;
  display:flex; justify-content:center;
}
.navbar__inner{
  width:100%; max-width:1240px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  background:rgba(255,255,255,0.82);
  backdrop-filter:blur(16px) saturate(160%);
  -webkit-backdrop-filter:blur(16px) saturate(160%);
  border:1px solid var(--line);
  border-radius:16px;
  padding:10px 14px 10px 18px;
  box-shadow:0 10px 34px rgba(11,18,32,0.1);
  transition: padding 0.3s ease, background 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}
.navbar.is-scrolled .navbar__inner{
  padding:6px 14px 6px 18px;
  background:rgba(255,255,255,0.94);
  box-shadow:0 14px 40px rgba(11,18,32,0.16);
}
.navbar.is-scrolled .navbar__logo img{ height:42px; }
.navbar{ border-bottom: none; }
.navbar__inner{ border-image: none; position:relative; }
.navbar__inner::after{
  content:''; position:absolute; left:18px; right:18px; bottom:-1px; height:2px; border-radius:2px;
  background:linear-gradient(90deg, var(--sky), var(--orange));
  opacity:0.55;
}
.navbar__logo{ display:flex; align-items:center; gap:11px; }
.navbar__logo img{ height:52px; width:auto; filter:drop-shadow(0 2px 6px rgba(41,171,226,0.35)); transition:height 0.3s ease; }
.navbar__logo-text{
  font-family:'Outfit', sans-serif; font-weight:700; font-size:20px; letter-spacing:-0.01em; color:#fff;
}
.navbar__links{ display:flex; align-items:center; gap:6px; }
.navbar__list{ display:flex; align-items:center; gap:6px; margin:0; padding:0; list-style:none; }
.navbar__links a{
  position:relative; display:inline-block;
  color:var(--slate); font-size:14px; font-weight:500; padding:9px 14px; border-radius:9px;
  transition: color 0.2s ease, background 0.2s ease;
}
.navbar__links a:hover{ color:var(--ink); background:rgba(41,171,226,0.08); }
.navbar__links a.is-active{ color:var(--sky-deep); font-weight:600; }
.navbar__cta{
  background:var(--orange); color:#fff !important; padding:11px 20px; border-radius:9px;
  font-size:14px; font-weight:600; white-space:nowrap;
  box-shadow:0 6px 18px rgba(232,83,30,0.35);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.navbar__cta:hover{ transform:translateY(-1px); box-shadow:0 8px 22px rgba(232,83,30,0.45); }
@media (max-width:900px){
  .navbar__links, .navbar__cta{ display:none; }
  .navbar__inner{ justify-content:center; }
}

/* ================= Dock mobile (nav en bas de l'écran, ≤900px) =================
   Même pattern que le site Rama Web : pilule flottante d'icônes ancrée en bas,
   à la place d'un burger + menu plein écran. Item actif teinté bleu ciel,
   Contact en pastille orange (le CTA de la navbar), étiquette au toucher. */
.dock{
  position:fixed; left:0; right:0; bottom:calc(14px + env(safe-area-inset-bottom, 0px));
  z-index:210; display:none; justify-content:center; padding:0 16px; pointer-events:none;
}
.dock__bar{
  pointer-events:auto; display:flex; align-items:center; gap:4px; padding:8px;
  background:rgba(255,255,255,0.9);
  backdrop-filter:blur(16px) saturate(160%);
  -webkit-backdrop-filter:blur(16px) saturate(160%);
  border:1px solid var(--line); border-radius:999px;
  box-shadow:0 12px 34px rgba(11,18,32,0.18);
}
.dock__item{
  position:relative; display:flex; align-items:center; justify-content:center;
  width:46px; height:46px; border-radius:50%; color:var(--slate);
  -webkit-tap-highlight-color:transparent;
  transition:background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.dock__item svg{ width:22px; height:22px; }
.dock__item:active{ transform:scale(0.9); }
.dock__item.is-active{ background:rgba(41,171,226,0.14); color:var(--sky-deep); }
.dock__item--cta{ background:var(--orange); color:#fff; box-shadow:0 6px 16px rgba(232,83,30,0.4); }
.dock__item--cta.is-active{ background:var(--orange); color:#fff; box-shadow:0 6px 16px rgba(232,83,30,0.4), 0 0 0 3px rgba(232,83,30,0.22); }
.dock__tip{
  position:absolute; bottom:calc(100% + 12px); left:50%;
  transform:translateX(-50%) translateY(5px);
  background:var(--ink); color:#fff; font-size:12px; font-weight:600;
  padding:6px 12px; border-radius:8px; white-space:nowrap;
  opacity:0; pointer-events:none;
  transition:opacity 0.2s ease, transform 0.2s ease;
}
.dock__item:hover .dock__tip, .dock__item:focus-visible .dock__tip, .dock__item.is-tipped .dock__tip{
  opacity:1; transform:translateX(-50%) translateY(0);
}
@media (max-width:900px){
  .dock{ display:flex; }
}
@media (prefers-reduced-motion:reduce){
  .dock__item, .dock__tip{ transition:none; }
}

/* ================= Page hero (sub-pages) ================= */
.page-hero{
  position:relative;
  background:
    radial-gradient(55% 65% at 90% 0%, rgba(41,171,226,0.2) 0%, transparent 60%),
    radial-gradient(50% 55% at 4% 100%, rgba(232,83,30,0.15) 0%, transparent 62%),
    radial-gradient(120% 140% at 84% 0%, #1b2c3d 0%, var(--ink) 55%, #070b12 100%);
  color:#f6f8fa;
  padding:calc(var(--nav-h) + 80px) 0 84px;
  overflow:hidden;
}
.page-hero__grid{
  position:absolute; inset:0; opacity:0.45; pointer-events:none;
  background-image:
    linear-gradient(var(--line-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-soft) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.9), transparent 80%);
}
.page-hero__arc{
  position:absolute; top:-35%; right:-15%; width:60vw; height:60vw; max-width:760px; max-height:760px;
  border-radius:50%; border:1.5px solid rgba(41,171,226,0.22); pointer-events:none;
}
.page-hero__arc::before{ content:''; position:absolute; inset:56px; border-radius:50%; border:1px solid rgba(232,83,30,0.18); }
.page-hero__inner{ position:relative; z-index:2; max-width:760px; }
.eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-size:12.5px; letter-spacing:0.16em; font-weight:600; margin-bottom:20px;
}
.eyebrow::before{ content:''; width:22px; height:1px; background:currentColor; }
.eyebrow--sky{ color:var(--sky); }
.eyebrow--deep{ color:var(--sky-deep); }
.page-hero h1{ font-size:clamp(34px,5.2vw,58px); line-height:1.04; font-weight:700; }
.page-hero p.lead{ margin-top:20px; font-size:17.5px; line-height:1.6; color:#c3cdd6; max-width:560px; }

/* Variante claire (bleu/orange sur fond clair, pas de noir) — La Société */
.page-hero--light{
  background:
    radial-gradient(60% 70% at 88% 0%, rgba(41,171,226,0.22) 0%, transparent 60%),
    radial-gradient(55% 60% at 6% 100%, rgba(232,83,30,0.16) 0%, transparent 62%),
    var(--paper);
  color:var(--ink);
}
.page-hero--light .page-hero__grid{
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
}
.page-hero--light .eyebrow--sky{ color:var(--sky-deep); }
.page-hero--light p.lead{ color:var(--slate); }
.page-hero--light .btn--ghost{ border-color:var(--line); color:var(--ink); }
.page-hero--light .btn--ghost:hover{ color:#fff; border-color:transparent; }

/* ================= Hero (home) ================= */
.hero{
  position:relative;
  background:
    radial-gradient(60% 70% at 88% 4%, rgba(41,171,226,0.22) 0%, transparent 60%),
    radial-gradient(55% 60% at 6% 96%, rgba(232,83,30,0.16) 0%, transparent 62%),
    radial-gradient(120% 140% at 82% 6%, #1b2c3d 0%, var(--ink) 55%, #070b12 100%);
  color:#f6f8fa;
  padding:calc(var(--nav-h) + 100px) 0 120px;
  overflow:hidden;
}
.hero__grid{
  position:absolute; inset:0; opacity:0.5; pointer-events:none;
  background-image:
    linear-gradient(var(--line-soft) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-soft) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.9), transparent 75%);
}
.hero__arc{
  position:absolute; top:-30%; right:-18%; width:70vw; height:70vw; max-width:900px; max-height:900px;
  border-radius:50%; border:1.5px solid rgba(41,171,226,0.25); pointer-events:none;
  animation: arc-breathe 9s ease-in-out infinite;
}
.hero__arc::before{ content:''; position:absolute; inset:60px; border-radius:50%; border:1px solid rgba(232,83,30,0.2); }
@keyframes arc-breathe{
  0%,100%{ transform:scale(1); opacity:1; }
  50%{ transform:scale(1.035); opacity:0.85; }
}
@media (prefers-reduced-motion: reduce){ .hero__arc{ animation:none; } }
.hero__inner{ position:relative; z-index:2; max-width:800px; }
@keyframes hero-cascade{ from{ opacity:0; transform:translateY(20px); } to{ opacity:1; transform:none; } }
.hero__inner > *, .page-hero__inner > *{ animation:hero-cascade 0.75s cubic-bezier(0.16,1,0.3,1) both; }
.hero__inner > *:nth-child(1), .page-hero__inner > *:nth-child(1){ animation-delay:0.05s; }
.hero__inner > *:nth-child(2), .page-hero__inner > *:nth-child(2){ animation-delay:0.16s; }
.hero__inner > *:nth-child(3), .page-hero__inner > *:nth-child(3){ animation-delay:0.28s; }
.hero__inner > *:nth-child(4), .page-hero__inner > *:nth-child(4){ animation-delay:0.4s; }
@media (prefers-reduced-motion:reduce){ .hero__inner > *, .page-hero__inner > *{ animation:none; } }
.hero h1{ font-size:clamp(38px,6.2vw,72px); line-height:1.02; font-weight:700; }
.hero h1 em{ font-style:normal; color:var(--sky); }
.hero__sub{ margin-top:24px; font-size:18px; line-height:1.6; color:#c3cdd6; max-width:560px; }
.hero__actions{ display:flex; gap:16px; margin-top:38px; flex-wrap:wrap; }
.hero__meta{ position:absolute; right:32px; bottom:36px; z-index:2; display:flex; gap:28px; color:rgba(246,248,250,0.5); font-size:12px; }
@media (max-width:900px){ .hero__meta{ display:none; } }

/* Variante claire (bleu/orange sur fond clair, pas de noir) — Accueil */
.hero--light{
  background:
    radial-gradient(60% 70% at 88% 4%, rgba(41,171,226,0.22) 0%, transparent 60%),
    radial-gradient(55% 60% at 6% 96%, rgba(232,83,30,0.16) 0%, transparent 62%),
    var(--paper);
  color:var(--ink);
}
.hero--light .hero__grid{
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
}
.hero--light .eyebrow--sky{ color:var(--sky-deep); }
.hero--light h1 em{ color:var(--sky-deep); }
.hero--light .hero__sub{ color:var(--slate); }
.hero--light .hero__meta{ color:rgba(11,18,32,0.4); }
.hero--light .btn--ghost{ border-color:var(--line); color:var(--ink); }
.hero--light .btn--ghost:hover{ color:#fff; border-color:transparent; }

/* ================= Certifications (trust bar) ================= */
.trust-bar{ background:var(--paper); padding:64px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.trust-bar__label{ text-align:center; font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:0.14em; color:var(--slate); text-transform:uppercase; margin-bottom:38px; }
.trust-bar__logos{ display:flex; align-items:center; justify-content:center; gap:22px; flex-wrap:wrap; }
.trust-bar__logo{
  position:relative; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:18px 26px; height:104px;
  display:flex; align-items:center; justify-content:center;
  transition:transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.trust-bar__logo:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:var(--sky-deep); }
.trust-bar__logo img{ max-height:64px; max-width:170px; width:auto; height:auto; object-fit:contain; }
.trust-bar__logo-tip{
  position:absolute; left:50%; top:calc(100% + 12px); transform:translateX(-50%) translateY(-6px);
  width:220px; padding:12px 14px; background:var(--ink); color:#fff; border-radius:9px; font-size:12px; line-height:1.5;
  opacity:0; pointer-events:none; transition:opacity 0.2s ease, transform 0.2s ease; z-index:5; text-align:center;
}
.trust-bar__logo-tip::after{ content:''; position:absolute; bottom:100%; left:50%; transform:translateX(-50%); border:6px solid transparent; border-bottom-color:var(--ink); }
.trust-bar__logo:hover .trust-bar__logo-tip{ opacity:1; transform:translateX(-50%) translateY(0); }
@media (max-width:700px){
  .trust-bar__logos{ gap:14px; }
  .trust-bar__logo{ height:80px; padding:12px 16px; }
  .trust-bar__logo img{ max-height:48px; max-width:110px; }
  .trust-bar__logo-tip{ display:none; }
}

/* ===== Bandeau défilant des bailleurs (marquee infini) ===== */
.bailleurs-marquee{
  --bk:1; /* facteur d'échelle global des logos (réduit en mobile) */
  position:relative; overflow:hidden; margin-top:46px; padding:8px 0;
  -webkit-mask-image:linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);
  mask-image:linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);
}
.bailleurs-marquee__track{ display:flex; width:max-content; animation:bailleurs-scroll 38s linear infinite; }
.bailleurs-marquee:hover .bailleurs-marquee__track{ animation-play-state:paused; }
.bailleurs-marquee__logo{
  flex:0 0 auto; display:flex; align-items:center; justify-content:center;
  height:96px; padding:0 34px;
}
/* Chaque logo porte un style inline --h calculé pour égaliser la SURFACE optique
   (h = √(S/ratio), bornée) : les logos larges sont moins hauts, les logos compacts
   plus hauts, si bien qu'ils pèsent tous pareil dans la bande. Les PNG ont été
   détourés de leurs marges blanches en amont pour que ce calcul soit fidèle. */
.bailleurs-marquee__logo img{
  height:calc(var(--h, 48px) * var(--bk)); width:auto; max-width:none; object-fit:contain;
  opacity:0.92; transition:opacity 0.3s ease, transform 0.3s ease;
}
.bailleurs-marquee__logo:hover img{ opacity:1; transform:scale(1.06); }
@keyframes bailleurs-scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (max-width:700px){
  .bailleurs-marquee{ --bk:0.76; }
  .bailleurs-marquee__logo{ height:74px; padding:0 22px; }
  .bailleurs-marquee__track{ animation-duration:26s; }
}
@media (prefers-reduced-motion: reduce){ .bailleurs-marquee__track{ animation:none; } }

/* ================= Offres d'emploi (job board) ================= */
.jobs{ display:flex; flex-direction:column; gap:10px; max-width:880px; margin:0 auto; }
.job-row{
  display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:22px;
  padding:18px 22px; background:var(--surface); border:1px solid var(--line); border-radius:12px;
  transition:transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, opacity 0.5s ease;
}
.job-row:hover{ transform:translateY(-2px) translateX(4px); box-shadow:var(--shadow-1); border-color:var(--sky-deep); }
.job-row__title{ font-family:'Outfit',sans-serif; font-weight:600; font-size:15.5px; color:var(--ink); }
.job-row__meta{ display:flex; align-items:center; gap:12px; font-size:13px; color:var(--slate); white-space:nowrap; }
.job-row__badge{
  font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:600; letter-spacing:0.06em;
  color:var(--sky-deep); background:rgba(41,171,226,0.1); border:1px solid rgba(41,171,226,0.25);
  padding:3px 9px; border-radius:999px;
}
.job-row__cta{
  display:inline-flex; align-items:center; gap:7px; font-weight:600; font-size:14px; color:var(--orange);
  white-space:nowrap;
}
.job-row__cta svg{ width:16px; height:16px; transition:transform 0.25s ease; }
.job-row:hover .job-row__cta svg{ transform:translateX(4px); }
@media (max-width:700px){
  /* minmax(0,1fr) + wrap du meta : sinon la ligne ville/code postal en nowrap
     élargit la colonne et pousse le CTA hors écran (scroll horizontal) */
  .job-row{ grid-template-columns:minmax(0,1fr) auto; }
  .job-row__meta{ grid-column:1; grid-row:2; white-space:normal; flex-wrap:wrap; gap:6px 12px; }
  .job-row__cta{ grid-row:1 / span 2; }
}

/* ================= Témoignages (scroll infini) ================= */
.testi-wrap{
  display:grid; grid-template-columns:repeat(2,1fr); gap:16px; max-width:700px; margin:0 auto;
  max-height:460px; overflow:hidden;
  -webkit-mask-image:linear-gradient(to bottom, transparent, #000 8%, #000 92%, transparent);
  mask-image:linear-gradient(to bottom, transparent, #000 8%, #000 92%, transparent);
}
.testi-col{ display:flex; flex-direction:column; gap:16px; animation:testi-scroll linear infinite; }
.testi-wrap:hover .testi-col{ animation-play-state:paused; }
@keyframes testi-scroll{ from{ transform:translateY(0); } to{ transform:translateY(-50%); } }
@media (prefers-reduced-motion:reduce){ .testi-col{ animation:none; } }
.testi-card{
  position:relative; padding:22px 22px 20px; border-radius:14px; flex-shrink:0;
  background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--sky-deep);
}
.testi-card--alt{ border-top-color:var(--orange); }
.testi-card__mark{ position:absolute; top:16px; right:18px; font-family:'Outfit',sans-serif; font-size:28px; font-weight:800; line-height:1; color:var(--ink); opacity:0.1; }
.testi-card__name{ display:flex; align-items:center; gap:9px; font-family:'Outfit',sans-serif; font-weight:700; font-size:14px; margin-bottom:9px; padding-right:32px; color:var(--sky-deep); }
.testi-card__name::before{
  content:attr(data-initial); width:26px; height:26px; border-radius:50%; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:11px; background:var(--sky-deep); color:#fff;
}
.testi-card--alt .testi-card__name{ color:var(--orange); }
.testi-card--alt .testi-card__name::before{ background:var(--orange); }
.testi-card__text{ font-size:13px; line-height:1.55; margin:0; padding-right:14px; color:var(--slate); }
@media (max-width:700px){ .testi-wrap{ grid-template-columns:1fr; max-height:400px; max-width:380px; } }

/* ================= Carte vidéo (La Société) ================= */
.video-tease{
  position:relative; display:block; width:100%; max-width:880px; margin:0 auto;
  aspect-ratio:16/9; border-radius:var(--radius); overflow:hidden;
  border:none; padding:0; cursor:pointer; background:var(--paper);
  box-shadow:var(--shadow-2);
}
.video-tease img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:transform 0.7s cubic-bezier(0.16,1,0.3,1);
}
.video-tease:hover img{ transform:scale(1.045); }
.video-tease__scrim{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(11,18,32,0) 42%, rgba(11,18,32,0.78));
}
.video-tease__play{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:84px; height:84px; border-radius:50%; background:var(--orange);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 34px rgba(232,83,30,0.5);
  transition:transform 0.25s ease;
}
.video-tease__play::before{
  content:''; position:absolute; inset:-8px; border-radius:50%;
  border:2px solid rgba(232,83,30,0.55);
  animation:play-pulse 2.2s ease-out infinite;
}
@keyframes play-pulse{ 0%{ transform:scale(0.85); opacity:1; } 100%{ transform:scale(1.55); opacity:0; } }
.video-tease:hover .video-tease__play{ transform:translate(-50%,-50%) scale(1.08); }
.video-tease__play svg{ width:32px; height:32px; color:#fff; margin-left:5px; }
.video-tease__caption{
  position:absolute; left:30px; right:30px; bottom:26px;
  display:flex; flex-direction:column; gap:7px; text-align:left; pointer-events:none;
}
.video-tease__label{ font-size:11px; letter-spacing:0.14em; color:var(--sky); }
.video-tease__title{
  font-family:'Outfit',sans-serif; font-weight:700; font-size:clamp(17px,2.3vw,24px);
  color:#fff; line-height:1.25; max-width:560px;
}
@media (max-width:600px){
  .video-tease__play{ width:64px; height:64px; }
  .video-tease__play svg{ width:24px; height:24px; }
  .video-tease__caption{ left:18px; right:18px; bottom:16px; }
}
@media (prefers-reduced-motion:reduce){
  .video-tease__play::before{ animation:none; opacity:0; }
  .video-tease img{ transition:none; }
}

/* ================= RSE teaser (La Société) ================= */
.rse-teaser{ display:grid; grid-template-columns:1.4fr 1fr; gap:48px; align-items:center; }
.rse-teaser__text .btn{ margin-top:24px; }
@media (max-width:820px){ .rse-teaser{ grid-template-columns:1fr; } .rse-teaser .eco-badge{ justify-content:center; } }

/* ================= Réalisations (projets) ================= */
.project-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.project-card{ padding:30px 26px; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper); transition:transform 0.25s ease, box-shadow 0.25s ease; }
.project-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow-1); }
.project-card__icon{ width:38px; height:38px; color:var(--sky-deep); margin-bottom:18px; }
.project-card__icon svg{ width:100%; height:100%; }
.project-card h3{ font-size:17px; margin-bottom:4px; }
.project-card p{ font-size:13px; color:var(--slate); margin:0; font-family:'IBM Plex Mono',monospace; letter-spacing:0.03em; text-transform:uppercase; }
@media (max-width:820px){ .project-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .project-grid{ grid-template-columns:1fr; } }

/* ================= Index égalité professionnelle F/H ================= */
.egapro{ display:grid; grid-template-columns:auto 1fr; gap:48px; align-items:center; padding:40px 44px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.egapro__score{ text-align:center; padding-right:44px; border-right:1px solid var(--line); }
.egapro__num{ font-family:'Outfit',sans-serif; font-weight:800; font-size:26px; color:var(--ink); white-space:nowrap; }
.egapro__label{ font-size:12px; color:var(--slate); margin-top:10px; max-width:170px; line-height:1.4; }
.egapro__list{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:16px 32px; }
.egapro__list li{ display:flex; justify-content:space-between; gap:12px; font-size:14px; padding-bottom:12px; border-bottom:1px solid var(--line); }
.egapro__list strong{ font-family:'IBM Plex Mono',monospace; color:var(--sky-deep); }
@media (max-width:700px){
  .egapro{ grid-template-columns:1fr; padding:30px 26px; }
  .egapro__score{ border-right:none; border-bottom:1px solid var(--line); padding-right:0; padding-bottom:24px; }
  .egapro__list{ grid-template-columns:1fr; }
}

.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 26px; border-radius:10px; font-weight:600; font-size:15px;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.btn--primary{ background:var(--orange); color:#fff; box-shadow:0 8px 22px rgba(232,83,30,0.35); }
.btn--primary:hover{ transform:translateY(-2px); box-shadow:0 10px 26px rgba(232,83,30,0.45); }
.btn--ghost{ border:1.5px solid rgba(246,248,250,0.28); color:#f6f8fa; }
.btn--ghost:hover{ border-color:var(--sky); color:var(--sky); }
.btn--dark{ background:var(--ink); color:#fff; }
.btn--dark:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(11,18,32,0.3); }

/* ================= Stats ================= */
.stats__band{ background:var(--surface); display:grid; grid-template-columns:repeat(4,1fr); border-bottom:1px solid var(--line); }
.stats__item{
  position:relative; overflow:hidden; padding:52px 30px 52px 26px; text-align:left; color:var(--ink);
  border-left:1px solid var(--line); display:flex; align-items:center; min-height:118px;
}
.stats__item:first-child{ border-left:none; }
.stats__num{ position:relative; z-index:1; font-family:'IBM Plex Mono', monospace; font-size:clamp(28px,3.4vw,42px); font-weight:600; color:var(--sky-deep); flex-shrink:0; }
.stats__label{ position:relative; z-index:1; margin-left:14px; font-size:13px; letter-spacing:0.04em; color:var(--slate); text-transform:uppercase; line-height:1.4; }
@media (max-width:900px){ .stats__band{ grid-template-columns:repeat(2,1fr); } .stats__item:nth-child(3){ border-left:none; } }
@media (max-width:520px){
  .stats__band{ grid-template-columns:1fr; }
  .stats__item{ border-left:none !important; border-top:1px solid var(--line); }
  .stats__item:first-child{ border-top:none; }
}
.stats__caption{ text-align:center; padding:18px 20px; font-size:13px; color:var(--slate); background:var(--paper); }

.stats__band--triple{ grid-template-columns:repeat(3,1fr); }
.stats__band--triple .stats__item:nth-child(3n+1){ border-left:none; }
@media (max-width:900px){
  .stats__band--triple{ grid-template-columns:repeat(2,1fr); }
  .stats__band--triple .stats__item:nth-child(3n+1){ border-left:1px solid var(--line); }
  .stats__band--triple .stats__item:nth-child(2n+1){ border-left:none; }
}
@media (max-width:520px){
  .stats__band--triple{ grid-template-columns:1fr; }
  .stats__band--triple .stats__item{ border-left:none !important; border-top:1px solid var(--line); }
  .stats__band--triple .stats__item:first-child{ border-top:none; }
}

/* ================= Feature strip (qualité / délais / communication) ================= */
.feature-strip{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.feature-item{
  display:flex; gap:16px; align-items:flex-start; padding:26px 22px;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius);
  transition:box-shadow 0.25s ease, transform 0.25s ease;
}
.feature-item:hover{ box-shadow:var(--shadow-1); transform:translateY(-2px); }
.feature-item__icon{
  width:44px; height:44px; border-radius:10px; background:rgba(11,111,168,0.1);
  display:flex; align-items:center; justify-content:center; color:var(--sky-deep); flex-shrink:0;
}
.feature-item__icon svg{ width:22px; height:22px; }
.feature-item h3{ font-size:16px; margin-bottom:5px; }
.feature-item p{ font-size:13.5px; color:var(--slate); margin:0; line-height:1.5; }
@media (max-width:900px){ .feature-strip{ grid-template-columns:1fr; } }

/* ================= Carte de France (implantations) ================= */
.fr-map-block{ display:flex; flex-direction:column; align-items:center; gap:44px; }
.fr-map-block__text{ text-align:center; max-width:640px; }
.fr-map-wrap{ width:100%; max-width:680px; margin:0 auto; }
.fr-map{ position:relative; width:100%; aspect-ratio:300/300; }
.fr-map__svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.fr-map__dots{ opacity:0.42; }
.fr-map__reveal{ r:0; transition:r 1.8s cubic-bezier(0.3,0.8,0.3,1); }
.fr-map-wrap.is-visible .fr-map__reveal{ r:1000px; }
.fr-map__pin{
  position:absolute; --drop:16px; transform:translate(-50%, calc(-100% - var(--drop)));
  background:none; border:none; padding:6px; cursor:pointer; line-height:0; z-index:1;
  opacity:0;
  transition:transform 0.55s cubic-bezier(0.34,1.56,0.64,1) calc(0.35s + var(--pd,0ms)), opacity 0.4s ease calc(0.35s + var(--pd,0ms));
}
.fr-map-wrap.is-visible .fr-map__pin{ --drop:0px; opacity:1; }
.fr-map__pin--main::after{
  content:''; position:absolute; left:50%; top:50%; width:28px; height:28px; border-radius:50%;
  border:2px solid var(--orange); transform:translate(-50%,-58%) scale(0.5); opacity:0; pointer-events:none;
}
.fr-map-wrap.is-visible .fr-map__pin--main::after{ animation:fr-pin-pulse 2.6s ease-out 2s infinite; }
@keyframes fr-pin-pulse{
  0%{ transform:translate(-50%,-58%) scale(0.45); opacity:0.65; }
  70%{ transform:translate(-50%,-58%) scale(1.55); opacity:0; }
  100%{ transform:translate(-50%,-58%) scale(1.55); opacity:0; }
}
@media (prefers-reduced-motion: reduce){
  .fr-map__reveal{ r:1000px; transition:none; }
  .fr-map__pin{ transition-delay:0s; }
  .fr-map-wrap.is-visible .fr-map__pin--main::after{ animation:none; }
}
.fr-map__dot{
  display:block; width:16px; height:16px; border-radius:50% 50% 50% 0;
  background:var(--sky-deep); transform:rotate(-45deg); box-shadow:var(--shadow-1);
  transition:transform 0.2s ease, background 0.2s ease;
}
.fr-map__pin:hover .fr-map__dot, .fr-map__pin.is-active .fr-map__dot{ background:var(--orange); transform:rotate(-45deg) scale(1.2); z-index:2; }
.fr-map__pin--main .fr-map__dot{ width:22px; height:22px; background:var(--orange); }
.fr-map__pin--main:hover .fr-map__dot, .fr-map__pin--main.is-active .fr-map__dot{ transform:rotate(-45deg) scale(1.15); }
.fr-map__card{
  position:absolute; left:0; top:0; z-index:10; width:210px;
  transform:translate(-50%, calc(-100% - 14px)); background:var(--surface);
  border:1px solid var(--line); border-radius:12px; overflow:hidden; box-shadow:var(--shadow-2);
  opacity:0; pointer-events:none; transition:opacity 0.2s ease, transform 0.2s ease;
}
.fr-map__card.is-open{ opacity:1; pointer-events:auto; transform:translate(-50%, calc(-100% - 20px)); }
.fr-map__card::after{
  content:''; position:absolute; bottom:-6px; left:50%; width:12px; height:12px;
  background:var(--surface); border-right:1px solid var(--line); border-bottom:1px solid var(--line);
  transform:translateX(-50%) rotate(45deg);
}
/* Attribution cartographique : exigee par l'ODbL (OpenStreetMap) et les
   conditions CARTO. Discrete, mais lisible et cliquable. */
.fr-map__attrib{
  margin-top:12px; text-align:right; font-size:11.5px; line-height:1.5; color:var(--slate);
  opacity:0.72;
}
.fr-map__attrib a{ color:inherit; text-decoration:underline; text-underline-offset:2px; }
.fr-map__attrib a:hover{ color:var(--sky-deep); opacity:1; }
@media (max-width:760px){ .fr-map__attrib{ text-align:left; } }

.fr-map__card--below{ transform:translate(-50%, 8px); }
.fr-map__card--below.is-open{ transform:translate(-50%, 14px); }
.fr-map__card--below::after{
  bottom:auto; top:-6px; border-right:none; border-bottom:none;
  border-left:1px solid var(--line); border-top:1px solid var(--line);
}
.fr-map__card-close{
  position:absolute; top:8px; right:8px; z-index:5; width:24px; height:24px; border-radius:50%;
  background:rgba(11,18,32,0.55); border:none; color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:background 0.2s ease;
}
.fr-map__card-close:hover{ background:rgba(11,18,32,0.8); }
.fr-map__card-close svg{ width:13px; height:13px; }
.fr-map__card-photo{
  position:relative; aspect-ratio:16/10; background:var(--paper); display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:8px; color:var(--slate-2);
  border-bottom:1px solid var(--line);
}
.fr-map__card-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.fr-map__card-placeholder{ display:flex; flex-direction:column; align-items:center; gap:8px; }
.fr-map__card-photo svg{ width:26px; height:26px; }
.fr-map__card-photo span{ font-size:10.5px; letter-spacing:0.06em; text-transform:uppercase; font-family:'IBM Plex Mono',monospace; }
.fr-map__card-body{ padding:14px 16px 16px; text-align:center; }
.fr-map__card-name{ font-family:'Outfit',sans-serif; font-weight:700; font-size:15.5px; color:var(--ink); line-height:1.3; }
.fr-map__card-info{ font-size:12.5px; color:var(--slate); margin-top:5px; line-height:1.4; }
/* Ouverture de la fiche Google Maps : overlay sur la photo + lien sous l'adresse */
.fr-map__card-photo-link{
  position:absolute; inset:0; z-index:2; display:flex; align-items:flex-end; justify-content:center;
  padding:10px 8px; text-decoration:none; opacity:0; transition:opacity 0.2s ease;
  background:linear-gradient(to top, rgba(11,18,32,0.78), rgba(11,18,32,0) 62%);
}
.fr-map__card-photo-link[hidden]{ display:none; }
.fr-map__card-photo-link span{ color:#fff; font-weight:600; }
.fr-map__card-photo:hover .fr-map__card-photo-link,
.fr-map__card-photo-link:focus-visible{ opacity:1; }
.fr-map__card-cta{
  display:inline-flex; align-items:center; gap:5px; margin-top:9px; text-decoration:none;
  font-family:'IBM Plex Mono',monospace; font-size:10.5px; letter-spacing:0.06em; text-transform:uppercase;
  color:var(--sky-deep); border-bottom:1px solid transparent; transition:border-color 0.2s ease;
}
.fr-map__card-cta[hidden]{ display:none; }
.fr-map__card-cta svg{ width:11px; height:11px; }
.fr-map__card-cta:hover{ border-bottom-color:currentColor; }
@media (hover:none){ .fr-map__card-photo-link{ opacity:1; } }
.fr-map-block__text .eyebrow{ margin-bottom:16px; }
.fr-map-block__text h2{ font-size:clamp(24px,3vw,34px); margin-bottom:16px; }
.fr-map-block__text p{ color:var(--slate); font-size:16px; line-height:1.65; margin-bottom:14px; }
@media (max-width:900px){
  .fr-map-block{ grid-template-columns:1fr; gap:32px; }
  .fr-map-block__text{ text-align:center; }
}

/* ================= Quote ================= */
.quote{ background:var(--surface); padding:110px 0; }
.quote__mark{ font-family:'Outfit',sans-serif; font-size:80px; color:var(--orange); line-height:0.5; opacity:0.85; }
.quote p{ font-family:'Outfit', sans-serif; font-weight:600; font-size:clamp(22px,3.2vw,36px); line-height:1.3; max-width:820px; }
.quote__attr{ margin-top:24px; font-size:14px; color:var(--slate); letter-spacing:0.03em; }

/* ================= Sections ================= */
.section{ padding:104px 0; }
.section--tight{ padding:80px 0; }
.section__head{ max-width:640px; margin-bottom:52px; }
.section__head h2{ font-size:clamp(27px,3.4vw,40px); }
.section__head p{ margin-top:15px; color:var(--slate); font-size:16px; line-height:1.6; }
.section--surface{ background:var(--surface); }
.section--paper{ background:var(--paper); }
.section--dark{ background:var(--ink); color:#f6f8fa; }
.section--dark .section__head p{ color:#aeb8c1; }

/* ================= Service cards ================= */
.services__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.service-card{ background:var(--surface); padding:38px 28px 34px; transition: background 0.25s ease; }
.service-card:hover{ background:#fbfbfd; }
.service-card__icon{ width:38px; height:38px; margin-bottom:24px; color:var(--sky-deep); transition:color 0.2s ease, transform 0.2s ease; }
.service-card:hover .service-card__icon{ color:var(--orange); transform:translateY(-2px); }
.service-card h3{ font-size:19px; margin-bottom:11px; }
.service-card p{ font-size:14.5px; color:var(--slate); line-height:1.55; margin:0; }
@media (max-width:900px){ .services__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .services__grid{ grid-template-columns:1fr; } }

/* ================= Location cards ================= */
.locations__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.city-card{ padding:22px 20px; background:var(--ink-3); border-radius:var(--radius-sm); transition:background 0.2s ease, transform 0.2s ease; }
.city-card:hover{ background:#232f42; transform:translateY(-2px); }
.city-card__name{ font-family:'Outfit',sans-serif; font-weight:600; font-size:17px; }
.city-card__tag{ margin-top:6px; font-size:12px; color:#8b98a3; letter-spacing:0.04em; }

/* ================= Values / culture ================= */
.values__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.value-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:30px 26px; transition: box-shadow 0.25s ease, transform 0.25s ease; }
.value-card:hover{ box-shadow:var(--shadow-1); transform:translateY(-3px); }
.value-card__num{ font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--orange); font-weight:600; }
.value-card h3{ font-size:18px; margin:14px 0 10px; }
.value-card p{ font-size:14.5px; color:var(--slate); line-height:1.55; margin:0; }
@media (max-width:900px){ .values__grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .values__grid{ grid-template-columns:1fr; } }

/* ================= Process timeline (stepper) ================= */
.timeline{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; position:relative; }
.timeline::before{ content:''; position:absolute; top:51px; left:4%; right:4%; height:2px; background:var(--line); z-index:0; }
.timeline::after{
  content:''; position:absolute; top:51px; left:4%; right:4%; height:2px; z-index:0;
  background:linear-gradient(90deg, var(--sky-deep), var(--orange));
  transform:scaleX(0); transform-origin:left;
  transition:transform 1.6s cubic-bezier(0.16,1,0.3,1) 0.35s;
}
.timeline.is-visible::after{ transform:scaleX(1); }
.timeline__step{
  position:relative; z-index:1; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); padding:26px 24px 28px;
  transition:transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease, opacity 0.6s ease var(--stagger,0ms);
}
.timeline__step:nth-child(2){ --stagger:120ms; }
.timeline__step:nth-child(3){ --stagger:240ms; }
.timeline__step:nth-child(4){ --stagger:360ms; }
.timeline__step:hover{ transform:translateY(-5px); box-shadow:var(--shadow-2); border-color:rgba(41,171,226,0.45); }
.timeline__num{
  width:50px; height:50px; border-radius:50%; background:var(--surface); border:2px solid var(--sky-deep);
  display:flex; align-items:center; justify-content:center; font-family:'IBM Plex Mono',monospace;
  font-weight:600; font-size:15px; color:var(--sky-deep); margin-bottom:18px;
  transition:background 0.35s ease, border-color 0.35s ease, color 0.35s ease, box-shadow 0.35s ease;
}
.timeline__step h4{ font-size:16.5px; margin-bottom:8px; }
.timeline__step p{ font-size:14px; color:var(--slate); line-height:1.55; margin:0; }
@media (max-width:900px){ .timeline{ grid-template-columns:repeat(2,1fr); row-gap:26px; } .timeline::before, .timeline::after{ display:none; } }
@media (max-width:560px){ .timeline{ grid-template-columns:1fr; } }

/* ================= Glow border (liseré souris, monochrome) ================= */
.glow-card{ position:relative; isolation:isolate; }
.glow-card__fx{
  pointer-events:none; position:absolute; inset:0; border-radius:inherit;
  opacity:0; transition:opacity 0.3s ease; z-index:1;
  padding:2px;
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
}
.glow-card__fx--sky{ background:radial-gradient(200px circle at var(--gx,50%) var(--gy,50%), rgba(41,171,226,0.75), rgba(41,171,226,0.14) 55%, transparent 75%); }
.glow-card__fx--orange{ background:radial-gradient(220px circle at var(--gx,50%) var(--gy,50%), rgba(232,83,30,0.7), rgba(232,83,30,0.12) 55%, transparent 75%); }
.glow-card.is-glowing .glow-card__fx{ opacity:1; }

/* ================= Buttons: animated sweep fill ================= */
.btn{ position:relative; isolation:isolate; overflow:hidden; }
.btn::before{
  content:''; position:absolute; inset:0; z-index:-1; transform-origin:left; transform:scaleX(0);
  transition:transform 0.45s cubic-bezier(0.65,0,0.35,1);
}
.btn--primary::before{ background:var(--sky-deep); }
.btn--primary:hover::before{ transform:scaleX(1); }
.btn--ghost::before{ background:var(--orange); }
.btn--ghost:hover::before{ transform:scaleX(1); }
.btn--ghost:hover{ color:#fff; border-color:transparent; }
.btn--dark::before{ background:var(--orange); }
.btn--dark:hover::before{ transform:scaleX(1); }
.btn--dark:hover{ color:#fff; }
.btn__arrow{ width:16px; height:16px; transition:transform 0.25s ease; flex-shrink:0; margin-left:2px; }
.btn:hover .btn__arrow{ transform:translateX(3px); }

/* ================= Navbar tubelight ================= */
.navbar__links{ position:relative; }
.navbar__lamp{
  position:absolute; top:4px; bottom:4px; left:0; width:0; border-radius:9px;
  background:rgba(41,171,226,0.16); z-index:0; pointer-events:none;
  transition: transform 0.4s cubic-bezier(0.34,1.56,0.64,1), width 0.4s cubic-bezier(0.34,1.56,0.64,1), background 0.3s ease;
}
.navbar__lamp::before{
  content:''; position:absolute; top:-3px; left:50%; transform:translateX(-50%);
  width:28px; height:3px; border-radius:0 0 6px 6px; background:var(--sky);
  box-shadow:0 0 12px 2px rgba(41,171,226,0.6);
}
.navbar__links a{ position:relative; z-index:1; }
.navbar__links a.is-active{ background:none; }

/* ================= Hero floating shapes (verre dépoli) ================= */
.hero__shapes{ position:absolute; inset:0; pointer-events:none; z-index:1; overflow:hidden; }
.hero__shape{
  position:absolute; border-radius:999px; border:1.5px solid rgba(255,255,255,0.09);
  box-shadow:0 8px 32px rgba(0,0,0,0.18);
}
.hero__shape::after{
  content:''; position:absolute; inset:0; border-radius:inherit;
  background:radial-gradient(circle at 50% 50%, rgba(255,255,255,0.08), transparent 70%);
}
.hero__shape--a{ width:460px; height:110px; top:10%; left:-6%; background:linear-gradient(100deg, rgba(41,171,226,0.22), transparent 70%); animation:float-a 18s ease-in-out infinite alternate; }
.hero__shape--b{ width:360px; height:90px; top:64%; right:-8%; background:linear-gradient(100deg, rgba(232,83,30,0.24), transparent 70%); animation:float-b 22s ease-in-out infinite alternate; }
.hero__shape--c{ width:240px; height:64px; bottom:8%; left:6%; background:linear-gradient(100deg, rgba(41,171,226,0.24), transparent 70%); animation:float-c 20s ease-in-out infinite alternate; }
.hero__shape--d{ width:150px; height:42px; top:8%; right:16%; background:linear-gradient(100deg, rgba(232,83,30,0.2), transparent 70%); animation:float-a 16s ease-in-out infinite alternate; }
@keyframes float-a{ 0%{ transform:translate(0,0) rotate(10deg); } 100%{ transform:translate(-16px,20px) rotate(6deg); } }
@keyframes float-b{ 0%{ transform:translate(0,0) rotate(-14deg); } 100%{ transform:translate(18px,-14px) rotate(-9deg); } }
@keyframes float-c{ 0%{ transform:translate(0,0) rotate(-6deg); } 100%{ transform:translate(12px,-16px) rotate(-2deg); } }

/* ================= 10 principes — roue de valeurs ================= */
.wheel-block{ display:grid; grid-template-columns:460px 1fr; gap:56px; align-items:center; }
.wheel{ --wheel-r:190px; position:relative; width:460px; height:460px; margin:0 auto; }
.wheel::before{
  content:''; position:absolute; inset:64px; border-radius:50%; border:1px dashed var(--line); pointer-events:none;
}
.wheel__hub{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:206px; height:206px; border-radius:50%; background:var(--ink);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  padding:22px; box-shadow:var(--shadow-2); z-index:1;
}
.wheel__hub p{
  font-family:'Outfit',sans-serif; font-weight:700; font-size:16.5px; line-height:1.35; color:#f6f8fa;
  transition:opacity 0.2s ease;
}
.wheel__hub-bar{ width:34px; height:3px; background:var(--orange); border-radius:2px; margin-top:14px; transition:background 0.2s ease; }
.wheel__pos{
  position:absolute; top:50%; left:50%; width:0; height:0;
  transform: rotate(0deg) translate(var(--wheel-r)) rotate(0deg);
  transition: transform 0.9s cubic-bezier(0.34,1.56,0.64,1);
}
.wheel.is-visible .wheel__pos{
  transform: rotate(var(--angle)) translate(var(--wheel-r)) rotate(calc(-1 * var(--angle)));
}
.wheel__item{
  position:absolute; top:-33px; left:-33px; width:66px; height:66px; border-radius:50%;
  background:var(--surface); border:1.5px solid var(--line); color:var(--sky-deep);
  display:flex; align-items:center; justify-content:center; padding:0; margin:0;
  font:inherit; cursor:pointer; -webkit-appearance:none; appearance:none;
  opacity:0; box-shadow:var(--shadow-1);
  transition:transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, background 0.25s ease, opacity 0.5s ease var(--stagger, 0ms);
}
.wheel.is-visible .wheel__item{ opacity:1; }
@media (prefers-reduced-motion: reduce){
  .wheel__pos, .wheel__item{ transition-delay:0ms !important; }
}
.wheel__item svg{ width:24px; height:24px; pointer-events:none; }
.wheel__item:hover{ transform:scale(1.12); box-shadow:var(--shadow-2); border-color:var(--orange); }
.wheel__item.is-selected{ background:var(--orange); color:#fff; border-color:var(--orange); transform:scale(1.1); }
.wheel-block__text .eyebrow{ margin-bottom:16px; }
.wheel-block__text h2{ font-size:clamp(24px,3vw,34px); margin-bottom:16px; }
.wheel-block__text p{ color:var(--slate); font-size:16px; line-height:1.65; margin-bottom:14px; }
.wheel-block__text .btn{ margin-top:8px; }
@media (max-width:900px){
  .wheel-block{ grid-template-columns:1fr; justify-items:center; text-align:center; gap:36px; }
  .wheel-block__text{ max-width:520px; }
}
@media (max-width:560px){
  .wheel{ --wheel-r:118px; width:290px; height:290px; }
  .wheel__hub{ width:140px; height:140px; padding:14px; }
  .wheel__hub p{ font-size:12.5px; }
  .wheel__item{ width:52px; height:52px; top:-26px; left:-26px; }
  .wheel__item svg{ width:20px; height:20px; }
}

/* ================= Partner card (BAT Academy, Ostreya) ================= */
.partner-card{
  display:grid; grid-template-columns:1fr 1.1fr; align-items:stretch;
  max-width:760px; margin:0 auto; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-1);
}
.partner-card__media{ position:relative; min-height:220px; background:var(--paper); }
.partner-card__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.partner-card__content{
  display:flex; flex-direction:column; align-items:flex-start; gap:16px;
  padding:40px 38px;
}
.partner-card__logo{ height:52px; display:flex; align-items:center; justify-content:center; }
.partner-card__logo img{ max-height:52px; width:auto; }
.partner-card__logo-fallback{ font-family:'Outfit',sans-serif; font-weight:700; font-size:24px; color:var(--sky-deep); letter-spacing:0.02em; }
.partner-card__desc{ margin:0; font-size:14.5px; color:var(--slate); line-height:1.6; }
.partner-card__badge{ height:88px; width:auto; margin-top:10px; }
.partner-card--solo{ grid-template-columns:1fr; max-width:560px; box-shadow:var(--shadow-2); }
.partner-card--solo .partner-card__content{ align-items:center; text-align:center; padding:56px 48px; }

.section--formation{
  background:
    radial-gradient(70% 100% at 88% 0%, rgba(41,171,226,0.12) 0%, transparent 60%),
    radial-gradient(60% 90% at 8% 100%, rgba(232,83,30,0.09) 0%, transparent 60%),
    var(--paper);
}
.partner-card__logo--big{ height:160px; }
.partner-card__logo--big img{ max-height:160px; }
@media (max-width:700px){
  .partner-card{ grid-template-columns:1fr; }
  .partner-card__media{ min-height:180px; }
}

/* ================= Crew panel (photo équipe) ================= */
.crew{ padding:88px 0; background:var(--surface); }
.crew__grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:52px; align-items:center; }
.crew__art{
  position:relative; background:var(--paper); border-radius:var(--radius); padding:0;
  border:1px solid var(--line); box-shadow:var(--shadow-2); overflow:hidden;
}
.crew__photo{
  width:100%; height:auto; display:block;
  transform:scale(1.08); transition:transform 1.1s cubic-bezier(0.16,1,0.3,1);
}
.crew__art.is-visible .crew__photo{ transform:scale(1); }
.crew__art-caption{
  position:absolute; left:0; right:0; bottom:0; padding:26px 24px 16px;
  background:linear-gradient(180deg, rgba(11,18,32,0) 0%, rgba(11,18,32,0.72) 100%);
  color:#fff; font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.1em; text-transform:uppercase;
}
.crew__text .eyebrow{ margin-bottom:16px; }
.crew__text h2{ font-size:clamp(24px,3vw,34px); margin-bottom:16px; }
.crew__text p{ color:var(--slate); font-size:16px; line-height:1.65; margin-bottom:14px; }
.crew__text p:last-child{ margin-bottom:0; }
@media (max-width:900px){
  .crew__grid{ grid-template-columns:1fr; gap:32px; }
  .crew__art{ order:-1; }
}

.gallery{ padding:0 0 90px; background:var(--surface); }
.gallery__head{ margin-bottom:28px; }
.gallery__head h2{ font-size:clamp(22px,2.8vw,30px); }
.gallery__grid{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:230px; gap:16px; }
.gallery__item{ position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); background:var(--paper); transition:transform 0.3s ease, box-shadow 0.3s ease, opacity 0.6s ease var(--stagger,0ms); }
.gallery__item:nth-child(2){ --stagger:90ms; }
.gallery__item:nth-child(3){ --stagger:180ms; }
.gallery__item:nth-child(4){ --stagger:270ms; }
.gallery__item:nth-child(5){ --stagger:360ms; }
.gallery__item:hover{ transform:translateY(-3px); box-shadow:var(--shadow-2); }
.gallery__item img{ width:100%; height:100%; object-fit:cover; display:block; }
.gallery__item--lg{ grid-column:span 2; grid-row:span 2; }
.gallery__item--lg img{ object-position:left center; }
@media (max-width:860px){
  .gallery__grid{ grid-template-columns:repeat(2,1fr); grid-auto-rows:200px; }
  .gallery__item--lg{ grid-column:span 2; grid-row:span 1; }
}
@media (max-width:520px){
  .gallery__grid{ grid-template-columns:1fr; grid-auto-rows:230px; }
  .gallery__item--lg{ grid-column:span 1; }
}

.value-card__media{ display:flex; align-items:center; gap:12px; margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.value-card__media-logo{ height:18px; width:auto; display:block; }
.value-card__media-photo{ height:46px; width:66px; object-fit:cover; border-radius:6px; border:1px solid var(--line); margin-left:auto; display:block; }
.value-card__photo{ margin-top:16px; border-radius:8px; overflow:hidden; aspect-ratio:16/9; background:var(--paper); }
.value-card__photo img{ width:100%; height:100%; object-fit:cover; display:block; }

.eco-badge{ display:inline-flex; align-items:center; gap:16px; margin-top:20px; }
.eco-badge img{ width:88px; height:88px; object-fit:contain; flex-shrink:0; }
.eco-badge span{ font-size:14.5px; color:var(--slate); font-weight:600; line-height:1.4; }

/* ================= EcoVadis showcase (RSE page) ================= */
.eco-showcase{ border-bottom:1px solid var(--line); }
.eco-showcase__inner{ display:flex; align-items:center; justify-content:center; gap:56px; text-align:left; }
.eco-showcase__medal{ width:180px; height:180px; object-fit:contain; flex-shrink:0; }
.eco-showcase__text{ max-width:520px; }
.eco-showcase__text h2{ font-size:clamp(26px,3vw,36px); margin:6px 0 14px; }
.eco-showcase__text p{ color:var(--slate); font-size:15.5px; line-height:1.65; margin:0; }
@media (max-width:700px){
  .eco-showcase__inner{ flex-direction:column; text-align:center; gap:28px; }
  .eco-showcase__medal{ width:130px; height:130px; }
}

/* ================= RSE rows (un principe à la fois, pas une grille) ================= */
.rse-row{ display:grid; grid-template-columns:1fr 1.15fr; gap:52px; align-items:center; padding:50px 0; border-bottom:1px solid var(--line); }
.rse-row:first-child{ padding-top:0; }
.rse-row:last-child{ border-bottom:none; padding-bottom:0; }
.rse-row--reverse{ direction:rtl; }
.rse-row--reverse > *{ direction:ltr; }
.rse-row__media{ position:relative; aspect-ratio:4/3; border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); background:var(--surface); }
.rse-row__media img{ width:100%; height:100%; object-fit:cover; display:block; transform:scale(1.12); transition:transform 1.1s cubic-bezier(0.16,1,0.3,1); }
.rse-row.is-visible .rse-row__media img{ transform:scale(1); }
.rse-row__media--icon{ display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg, rgba(41,171,226,0.08), rgba(232,83,30,0.05)); }
.rse-row__media--icon svg{ width:25%; height:25%; color:var(--sky-deep); }
.rse-row--no-media{ grid-template-columns:1fr; }
.rse-row--no-media .rse-row__media{ display:none; }
.rse-row__content .value-card__num{ display:block; margin-bottom:4px; }
.rse-row__content h3{ font-size:clamp(20px,2.2vw,24px); margin:8px 0 12px; }
.rse-row__content p{ font-size:15px; color:var(--slate); line-height:1.65; margin:0; }
.rse-row__media-caption{ display:flex; align-items:center; gap:10px; margin-top:16px; }
.rse-row__media-caption img{ height:38px; width:auto; }

/* Cascade du contenu RSE au reveal */
body{ counter-reset:rse; }
.rse-row{ counter-increment:rse; }
.rse-row .value-card__num::before{ content:"0" counter(rse) " — "; color:var(--slate-2, var(--slate)); }
.rse-row__content > *{ opacity:0; transform:translateX(26px); transition:opacity 0.55s ease, transform 0.55s cubic-bezier(0.16,1,0.3,1); }
.rse-row--reverse .rse-row__content > *{ transform:translateX(-26px); }
.rse-row.is-visible .rse-row__content > *{ opacity:1; transform:none; }
.rse-row.is-visible .rse-row__content > *:nth-child(1){ transition-delay:0.12s; }
.rse-row.is-visible .rse-row__content > *:nth-child(2){ transition-delay:0.22s; }
.rse-row.is-visible .rse-row__content > *:nth-child(3){ transition-delay:0.32s; }
.rse-row.is-visible .rse-row__content > *:nth-child(4){ transition-delay:0.42s; }
@media (prefers-reduced-motion:reduce){
  .rse-row__content > *{ opacity:1; transform:none; transition:none; }
}

/* ================= Services — blocs photo + panneau ================= */
.svc-row{
  position:relative; display:grid; grid-template-columns:1.15fr 1fr; align-items:center;
  margin-bottom:72px;
}
.svc-row:last-child{ margin-bottom:0; }
.svc-row__media{
  position:relative; aspect-ratio:16/11; border-radius:var(--radius); overflow:hidden;
  border:1px solid var(--line); background:var(--paper);
}
.svc-row__media img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform:scale(1.1); transition:transform 1.1s cubic-bezier(0.16,1,0.3,1);
}
.svc-row.is-visible .svc-row__media img{ transform:scale(1); }
.svc-row__panel{
  position:relative; z-index:2; background:var(--surface);
  border:1px solid var(--line); border-left:4px solid var(--sky);
  border-radius:var(--radius); padding:38px 36px; margin-left:-72px;
  box-shadow:var(--shadow-2);
  opacity:0; transform:translateX(30px);
  transition:opacity 0.6s ease 0.15s, transform 0.6s cubic-bezier(0.16,1,0.3,1) 0.15s;
}
.svc-row.is-visible .svc-row__panel{ opacity:1; transform:none; }
.svc-row--reverse{ grid-template-columns:1fr 1.15fr; }
.svc-row--reverse .svc-row__media{ order:2; }
.svc-row--reverse .svc-row__panel{
  order:1; margin-left:0; margin-right:-72px;
  border-left:1px solid var(--line); border-right:4px solid var(--orange);
  transform:translateX(-30px);
}
.svc-row--reverse.is-visible .svc-row__panel{ transform:none; }
.svc-row__num{ font-size:13px; font-weight:600; color:var(--orange); letter-spacing:0.12em; margin-bottom:12px; }
.svc-row--reverse .svc-row__num{ color:var(--sky-deep); }
.svc-row__panel h3{ font-size:clamp(20px,2.2vw,26px); margin-bottom:12px; }
.svc-row__panel p{ font-size:14.5px; color:var(--slate); line-height:1.65; margin:0 0 12px; }
.svc-row__panel p:last-child{ margin-bottom:0; }
.svc-row--no-media{ grid-template-columns:1fr; }
.svc-row--no-media .svc-row__media{ display:none; }
.svc-row--no-media .svc-row__panel{ margin:0; }
@media (max-width:860px){
  .svc-row, .svc-row--reverse{ grid-template-columns:1fr; margin-bottom:48px; }
  .svc-row__media, .svc-row--reverse .svc-row__media{ order:0; }
  .svc-row__panel, .svc-row--reverse .svc-row__panel{ order:1; margin:-28px 16px 0; padding:28px 24px; }
}
@media (prefers-reduced-motion:reduce){
  .svc-row__panel{ opacity:1; transform:none; transition:none; }
  .svc-row__media img{ transform:none; transition:none; }
}
.rse-row__media-caption span{ font-size:13px; color:var(--slate); font-style:italic; }
@media (max-width:820px){
  .rse-row, .rse-row--reverse{ grid-template-columns:1fr; direction:ltr; gap:24px; }
  .rse-row__media{ order:-1; }
}

/* ================= Video modal ================= */
.video-modal{
  position:fixed; inset:0; z-index:400; display:flex; align-items:center; justify-content:center;
  opacity:0; pointer-events:none; transition:opacity 0.25s ease;
}
.video-modal.is-open{ opacity:1; pointer-events:auto; }
.video-modal__backdrop{ position:absolute; inset:0; background:rgba(7,11,18,0.86); }
.video-modal__box{
  position:relative; z-index:1; width:min(920px, 90vw); aspect-ratio:16/9;
  background:#000; border-radius:12px; overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,0.5);
  transform:scale(0.96); transition:transform 0.25s ease;
}
.video-modal.is-open .video-modal__box{ transform:scale(1); }
.video-modal__frame{ position:absolute; inset:0; }
.video-modal__frame iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.video-modal__close{
  position:absolute; top:-44px; right:0; width:36px; height:36px; border-radius:50%;
  background:rgba(255,255,255,0.12); border:none; color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center; z-index:2;
  transition:background 0.2s ease;
}
.video-modal__close:hover{ background:rgba(255,255,255,0.22); }
.video-modal__close svg{ width:18px; height:18px; }

/* ================= Splash (sas d'entrée, accueil uniquement) ================= */
#splash{
  position:fixed; inset:0; z-index:300;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  background:
    radial-gradient(60% 70% at 82% 6%, rgba(41,171,226,0.22) 0%, transparent 60%),
    radial-gradient(55% 60% at 10% 96%, rgba(232,83,30,0.16) 0%, transparent 62%),
    var(--paper);
  color:var(--ink); cursor:pointer;
  transition: opacity 0.5s ease, transform 0.5s ease;
}
/* fin quadrillage pour rappeler le hero, fondu vers le centre */
#splash::before{
  content:''; position:absolute; inset:0; pointer-events:none; opacity:0.6;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image: radial-gradient(70% 70% at 50% 40%, rgba(0,0,0,0.7), transparent 78%);
  -webkit-mask-image: radial-gradient(70% 70% at 50% 40%, rgba(0,0,0,0.7), transparent 78%);
}
#splash[hidden]{ display:none; }
#splash.is-hiding{ opacity:0; transform:scale(1.05); pointer-events:none; }
.splash__halo{
  position:absolute; top:16%; left:50%; width:600px; height:600px; transform:translateX(-50%);
  border-radius:50%; filter:blur(90px); opacity:0.7; pointer-events:none;
  background:radial-gradient(circle, rgba(41,171,226,0.28), rgba(232,83,30,0.12) 55%, transparent 75%);
  animation:splash-drift 11s ease-in-out infinite alternate;
}
@keyframes splash-drift{ 0%{ transform:translate(-50%,0); } 100%{ transform:translate(-46%,16px); } }
@media (prefers-reduced-motion: reduce){ .splash__halo{ animation:none; } }
.splash__mark{ position:relative; width:150px; height:150px; }
.splash__ring-svg{ position:absolute; inset:0; width:100%; height:100%; }
.splash__ring{
  fill:none; stroke:var(--sky); stroke-width:2; stroke-linecap:round;
  stroke-dasharray:430; stroke-dashoffset:430;
  transition:stroke-dashoffset 1.1s cubic-bezier(0.65,0,0.35,1);
}
#splash.is-playing .splash__ring{ stroke-dashoffset:0; }
.splash__icon-img{
  position:absolute; left:50%; top:50%; width:78px;
  transform:translate(-50%,-50%) scale(0.85); opacity:0;
  transition:opacity 0.6s ease 0.85s, transform 0.6s ease 0.85s;
}
#splash.is-playing .splash__icon-img{ opacity:1; transform:translate(-50%,-50%) scale(1); }
.splash__word{
  margin-top:22px; font-family:'Outfit',sans-serif; font-weight:700; font-size:24px;
  letter-spacing:0.5em; opacity:0; text-transform:uppercase;
  transition:opacity 0.9s ease 1.5s, letter-spacing 0.9s ease 1.5s;
}
#splash.is-playing .splash__word{ opacity:1; letter-spacing:0.14em; }
.splash__tag{
  margin-top:12px; font-size:14px; color:var(--slate); opacity:0; transform:translateY(8px);
  transition:opacity 0.6s ease 2s, transform 0.6s ease 2s;
}
#splash.is-playing .splash__tag{ opacity:1; transform:none; }
.splash__enter{
  position:absolute; bottom:48px; display:flex; flex-direction:column; align-items:center; gap:10px;
  color:var(--slate); font-size:13px; letter-spacing:0.06em; opacity:0;
  background:none; border:none; cursor:pointer; font-family:inherit;
  transition:opacity 0.6s ease 2.4s, color 0.2s ease;
}
#splash.is-playing .splash__enter{ opacity:1; }
.splash__enter:hover{ color:var(--sky-deep); }
.splash__enter svg{ width:18px; height:18px; animation:splash-bounce 1.6s ease-in-out infinite; }
@keyframes splash-bounce{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(6px); } }
@media (prefers-reduced-motion: reduce){
  .splash__ring, .splash__icon-img, .splash__word, .splash__tag, .splash__enter{ transition-duration:0.01ms !important; }
  .splash__enter svg{ animation:none; }
}

/* ================= Compare slider (avant / après) ================= */
.compare{
  position:relative; width:100%; aspect-ratio:16/8; border-radius:var(--radius);
  overflow:hidden; user-select:none; box-shadow:var(--shadow-2); border:1px solid var(--line);
  touch-action:none;
}
.compare__pane{ position:absolute; inset:0; display:flex; align-items:flex-end; padding:28px; }
.compare__after{
  background:
    radial-gradient(120% 160% at 15% 0%, #3a4a5c 0%, var(--ink) 55%, #070b12 100%);
}
.compare__after::before{
  content:''; position:absolute; inset:0; opacity:0.5;
  background-image:linear-gradient(var(--line-soft) 1px, transparent 1px), linear-gradient(90deg, var(--line-soft) 1px, transparent 1px);
  background-size:40px 40px;
}
.compare__before{
  background:linear-gradient(160deg, #cfd4d9 0%, #aab1b8 55%, #8b939c 100%);
  clip-path: inset(0 0 0 0);
}
.compare__before::before{
  content:''; position:absolute; inset:0; opacity:0.35;
  background-image:repeating-linear-gradient(45deg, rgba(0,0,0,0.06) 0 2px, transparent 2px 14px);
}
.compare__label{
  position:relative; z-index:2; font-family:'IBM Plex Mono',monospace; font-size:12.5px;
  letter-spacing:0.1em; padding:8px 14px; border-radius:8px; font-weight:600;
}
.compare__after .compare__label{ background:rgba(41,171,226,0.18); color:var(--sky); border:1px solid rgba(41,171,226,0.3); }
.compare__before .compare__label{ background:rgba(11,18,32,0.12); color:#3a4048; border:1px solid rgba(11,18,32,0.15); }
.compare__handle{
  position:absolute; top:0; bottom:0; left:50%; width:0; z-index:3;
  transform:translateX(-50%); cursor:ew-resize;
}
.compare__handle::before{
  content:''; position:absolute; top:0; bottom:0; left:-1px; width:2px; background:#fff;
  box-shadow:0 0 0 1px rgba(11,18,32,0.15);
}
.compare__grip{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:44px; height:44px; border-radius:50%; background:#fff; box-shadow:var(--shadow-2);
  display:flex; align-items:center; justify-content:center; gap:3px;
}
.compare__grip span{ width:2px; height:14px; background:var(--slate); border-radius:2px; }
.compare__caption{ margin-top:16px; font-size:13px; color:var(--slate-2); text-align:center; }

/* ================= Bento services grid ================= */
.bento{
  display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:200px; gap:16px;
}
.bento .service-card{
  border:1px solid var(--line); border-radius:var(--radius); display:flex; flex-direction:column; justify-content:flex-end;
  transition: background 0.25s ease, opacity 0.6s ease var(--stagger,0ms), transform 0.6s ease var(--stagger,0ms);
}
.bento .service-card:nth-child(2){ --stagger:100ms; }
.bento .service-card:nth-child(3){ --stagger:200ms; }
.bento .service-card:nth-child(4){ --stagger:300ms; }
.bento .service-card:nth-child(5){ --stagger:400ms; }
.bento .service-card--lg{ grid-column:span 2; grid-row:span 2; justify-content:flex-end; padding-bottom:34px; }
.bento .service-card--lg .service-card__icon{ width:46px; height:46px; }
.bento .service-card--lg h3{ font-size:23px; }
.service-card--photo{ position:relative; padding:0 !important; overflow:hidden; }
.service-card--photo .service-card__photo{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transform:scale(1.06); transition:transform 0.9s cubic-bezier(0.16,1,0.3,1);
}
.service-card--photo:hover .service-card__photo{ transform:scale(1.12); }
.service-card--photo::after{
  content:''; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(11,18,32,0) 38%, rgba(11,18,32,0.8));
}
.service-card--photo .service-card__overlay{
  position:relative; z-index:2; padding:0 30px 34px; color:#fff;
}
.service-card--photo .service-card__overlay h3{ color:#fff; }
.service-card--photo .service-card__overlay p{ color:rgba(255,255,255,0.85); }
.service-card--photo .mf-c{ z-index:3; }
@media (max-width:900px){
  .bento{ grid-template-columns:repeat(2,1fr); grid-auto-rows:190px; }
  .bento .service-card--lg{ grid-column:span 2; grid-row:span 1; }
}
@media (max-width:560px){
  .bento{ grid-template-columns:1fr; grid-auto-rows:auto; }
  .bento .service-card--lg{ grid-column:span 1; }
  .bento .service-card{ padding:30px 26px; }
}

/* ================= Timeline scroll-active (pastille de progression) ================= */
.timeline__step.is-active .timeline__num{
  background:var(--orange); border-color:var(--orange); color:#fff;
  box-shadow:0 8px 20px rgba(232,83,30,0.35);
}

/* ================= CTA band ================= */
.cta-band{ background:linear-gradient(120deg, var(--sky-deep), var(--sky)); color:#fff; padding:72px 0; text-align:center; }
.cta-band h2{ font-size:clamp(24px,3.2vw,34px); margin-bottom:22px; color:#fff; }
.cta-band__actions{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* ================= Contact ================= */
.contact-grid{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:start; }
@media (max-width:900px){ .contact-grid{ grid-template-columns:1fr; } }
.contact-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:32px; }
.contact-card h3{ font-size:16px; margin-bottom:18px; }
.contact-card__row{ display:flex; align-items:center; gap:14px; padding:12px 0; border-top:1px solid var(--line); }
.contact-card__row:first-of-type{ border-top:none; }
.contact-card__row svg{ width:20px; height:20px; color:var(--sky-deep); flex-shrink:0; }
.contact-card__row a{ font-size:15px; font-weight:500; }
.form-field{ margin-bottom:18px; }
.form-field label{ display:block; font-size:13px; font-weight:600; margin-bottom:8px; color:var(--ink); }
.form-field input, .form-field textarea, .form-field select{
  width:100%; padding:13px 14px; border-radius:8px; border:1.5px solid var(--line);
  background:var(--surface); font-family:inherit; font-size:15px; color:var(--ink);
  transition:border-color 0.2s ease, box-shadow 0.2s ease;
}
.form-field input:focus, .form-field textarea:focus, .form-field select:focus{
  outline:none; border-color:var(--sky); box-shadow:0 0 0 3px rgba(41,171,226,0.15);
}
.form-field textarea{ min-height:120px; resize:vertical; }
.form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:560px){ .form-row{ grid-template-columns:1fr; } }
.form-submit{ width:100%; justify-content:center; border:none; }
.form-note{ font-size:12.5px; color:var(--slate-2); margin-top:14px; text-align:center; }
.form-note a{ color:var(--sky-deep); text-decoration:underline; text-underline-offset:2px; }
/* <picture> ne doit pas exister pour la mise en page : sans ceci, il s'intercale
   entre la grille et l'image et casse les object-fit / height:100%. */
picture{ display:contents; }

/* ================= Lien d'évitement ================= */
/* Premier élément focalisable du document : il n'apparaît qu'à la tabulation et
   évite de traverser navbar + dock avant d'atteindre le contenu. Jamais
   display:none, sinon il devient inatteignable au clavier. */
.skip-link{
  position:fixed; top:14px; left:50%; z-index:2000;
  transform:translate(-50%, -160%);
  padding:12px 22px; border-radius:999px;
  background:var(--sky-deep); color:#fff;
  font-family:'Outfit', sans-serif; font-size:14px; font-weight:600; text-decoration:none;
  box-shadow:0 10px 30px rgba(16,42,66,0.28);
  transition:transform 0.2s ease;
}
.skip-link:focus{ transform:translate(-50%, 0); outline:2px solid var(--orange); outline-offset:3px; }
#contenu:focus{ outline:none; }
#contenu:focus-visible{ outline:2px solid var(--sky); outline-offset:-4px; }
@media (prefers-reduced-motion: reduce){ .skip-link{ transition:none; } }

/* ================= Page 404 ================= */
/* Le « 404 » est décoratif et surdimensionné en filigrane : il signale l'erreur
   d'un coup d'œil sans voler la vedette aux quatre portes de sortie. */
.err__code{
  font-size:clamp(76px, 13vw, 150px); font-weight:600; line-height:0.9;
  color:transparent; -webkit-text-stroke:1.5px rgba(41,171,226,0.32);
  letter-spacing:-0.02em; margin-bottom:18px; user-select:none;
}
.err__actions{ margin-top:30px; }
.err__grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(248px, 1fr)); gap:18px;
}
.err__card{
  display:flex; flex-direction:column; gap:7px; padding:24px 22px;
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  transition:transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.err__card:hover{
  transform:translateY(-3px); border-color:var(--sky);
  box-shadow:0 14px 34px rgba(16,42,66,0.09);
}
.err__card:focus-visible{ outline:2px solid var(--sky); outline-offset:3px; }
.err__card-eyebrow{ font-size:11px; letter-spacing:0.1em; color:var(--sky-deep); }
.err__card-title{ font-family:'Outfit', sans-serif; font-size:17px; font-weight:600; color:var(--ink); }
.err__card-desc{ font-size:14px; line-height:1.55; color:var(--slate-2); }
@media (prefers-reduced-motion: reduce){
  .err__card{ transition:none; }
  .err__card:hover{ transform:none; }
}
.form-note--ok{ color:#12784f; font-weight:600; }
.form-note--ko{ color:#b3341a; font-weight:600; }
.form-submit:disabled{ opacity:0.6; cursor:progress; }
/* Consentement RGPD : case + libellé, alignés sur la ligne de base du texte */
.form-consent{ display:flex; align-items:flex-start; gap:11px; margin:4px 0 20px; }
.form-consent input[type="checkbox"]{
  width:18px; height:18px; margin:1px 0 0; flex-shrink:0; accent-color:var(--sky-deep); cursor:pointer;
}
.form-consent input[type="checkbox"]:focus-visible{
  outline:2px solid var(--sky); outline-offset:2px;
}
.form-consent label{
  font-size:13px; line-height:1.55; font-weight:400; color:var(--slate); margin:0; cursor:pointer;
}
.form-consent label a{ color:var(--sky-deep); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
/* Honeypot anti-spam : hors écran, jamais visible ni focusable */
.form-field--hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* ================= Pages légales (mentions, confidentialité) ================= */
/* Colonne de lecture étroite : un texte juridique se lit, il ne se scanne pas. */
.legal{ max-width:760px; margin:0 auto; }
.legal h2{
  font-size:clamp(20px, 2.4vw, 25px); margin:44px 0 14px; color:var(--ink);
  padding-top:22px; border-top:1px solid var(--line);
}
.legal h2:first-child{ margin-top:0; padding-top:0; border-top:none; }
.legal p{ font-size:15.5px; line-height:1.75; color:var(--slate); margin-bottom:14px; }
.legal ul{ margin:0 0 16px; padding-left:20px; }
.legal li{ font-size:15.5px; line-height:1.75; color:var(--slate); margin-bottom:6px; }
.legal a{ color:var(--sky-deep); text-decoration:underline; text-underline-offset:2px; }
.legal a:hover{ color:var(--orange); }
.legal strong{ color:var(--ink); font-weight:600; }
.legal__updated{
  margin-top:40px; padding-top:20px; border-top:1px solid var(--line);
  font-size:12px; letter-spacing:0.06em; color:var(--slate-2); text-transform:uppercase;
}
/* Le tableau des traitements déborde sur mobile : il défile dans son propre cadre */
.legal-table-wrap{ overflow-x:auto; margin:0 0 18px; -webkit-overflow-scrolling:touch; }
.legal-table{
  width:100%; min-width:560px; border-collapse:collapse;
  background:var(--surface); border:1px solid var(--line); border-radius:10px; overflow:hidden;
}
.legal-table th, .legal-table td{
  text-align:left; padding:13px 15px; font-size:14px; line-height:1.6;
  border-bottom:1px solid var(--line); vertical-align:top;
}
.legal-table th{
  font-family:'IBM Plex Mono', monospace; font-size:11.5px; letter-spacing:0.07em; text-transform:uppercase;
  color:var(--sky-deep); background:rgba(41,171,226,0.07); font-weight:600;
}
.legal-table td{ color:var(--slate); }
.legal-table tr:last-child td{ border-bottom:none; }

/* ================= Breadcrumb-free footer ================= */
.footer{ background:linear-gradient(120deg, var(--sky-deep), var(--sky)); color:#eaf6fd; padding:64px 0 32px; border-top:1px solid rgba(255,255,255,0.25); }
.footer__top{ display:flex; justify-content:space-between; gap:40px; flex-wrap:wrap; padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,0.28); }
.footer__brand img{ height:64px; margin-bottom:16px; background:#fff; padding:10px 16px; border-radius:12px; box-sizing:content-box; }
.footer__brand p{ max-width:300px; font-size:13.5px; line-height:1.6; color:rgba(255,255,255,0.88); }
.footer__cols{ display:flex; gap:64px; flex-wrap:wrap; }
.footer__col h4{ font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.1em; color:rgba(255,255,255,0.65); text-transform:uppercase; margin-bottom:16px; }
.footer__col ul{ display:flex; flex-direction:column; gap:10px; margin:0; padding:0; }
.footer__col a{ font-size:14px; color:rgba(255,255,255,0.92); transition:color 0.2s ease, opacity 0.2s ease; }
.footer__col a:hover{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.footer__bottom{ display:flex; justify-content:space-between; align-items:center; padding-top:28px; font-size:12.5px; color:rgba(255,255,255,0.75); flex-wrap:wrap; gap:16px; }
.footer__social{ display:flex; gap:10px; }
.footer__social-link{
  width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.16); border:1px solid rgba(255,255,255,0.35); color:#fff;
  transition:transform 0.25s ease, background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}
.footer__social-link svg{ width:17px; height:17px; }
.footer__social-link:hover{ transform:translateY(-3px); background:var(--orange); border-color:var(--orange); color:#fff; }

.footer__bottom .mono a{
  position:relative; display:inline-block; color:#fff; font-weight:600;
  text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1.5px;
  text-decoration-color:rgba(255,255,255,0.55);
  animation:rw-credit-pulse 2.6s ease-in-out infinite;
  transition:color 0.2s ease, text-decoration-color 0.2s ease;
}
.footer__bottom .mono a::after{
  content:'↗'; display:inline-block; margin-left:4px; font-weight:700;
  animation:rw-credit-nudge 2.6s ease-in-out infinite;
  transition:transform 0.2s ease;
}
.footer__bottom .mono a:hover{
  color:var(--orange); text-decoration-color:var(--orange);
  animation:none;
}
.footer__bottom .mono a:hover::after{ animation:none; transform:translate(3px,-3px); }
@keyframes rw-credit-pulse{
  0%,100%{ text-decoration-color:rgba(255,255,255,0.35); }
  50%{ text-decoration-color:#fff; }
}
@keyframes rw-credit-nudge{
  0%,60%,100%{ transform:translate(0,0); }
  75%{ transform:translate(2px,-2px); }
}
@media (prefers-reduced-motion:reduce){
  .footer__bottom .mono a, .footer__bottom .mono a::after{ animation:none; }
}

/* ================= RSE — hero animé + médaille EcoVadis ================= */
.rse-hero .page-hero__inner{
  max-width:none; display:grid; grid-template-columns:1.2fr 0.8fr; gap:48px; align-items:center;
}
.rse-hero__text{ max-width:640px; }
.hero-pills{ display:flex; flex-wrap:wrap; gap:10px; margin-top:32px; }
.hero-pill{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13.5px; font-weight:600; color:var(--ink);
  border:1.5px solid var(--line); border-radius:999px; padding:9px 18px;
  background:var(--surface); cursor:pointer; font-family:inherit;
  transition:border-color 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.hero-pill:hover{ border-color:var(--sky-deep); color:var(--sky-deep); transform:translateY(-2px); box-shadow:var(--shadow-1); }
.hero-pill__num{ font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--orange); }

.medal-scene{
  position:relative; width:min(340px,72vw); aspect-ratio:1; margin:0 auto;
  display:flex; align-items:center; justify-content:center;
}
.medal-scene__ring{
  position:absolute; inset:0; border-radius:50%;
  border:1.5px dashed rgba(41,171,226,0.45);
  animation:medal-spin 28s linear infinite;
}
.medal-scene__ring--2{
  inset:12%; border:1px solid rgba(232,83,30,0.3); border-style:dashed;
  animation-direction:reverse; animation-duration:38s;
}
.medal-scene__halo{
  position:absolute; inset:10%; border-radius:50%; filter:blur(48px); pointer-events:none;
  background:radial-gradient(circle, rgba(41,171,226,0.45), rgba(232,83,30,0.22) 58%, transparent 78%);
  animation:medal-halo 5.5s ease-in-out infinite alternate;
}
.medal-scene__img{
  position:relative; z-index:2; width:60%;
  filter:drop-shadow(0 18px 42px rgba(11,18,32,0.28));
  animation:medal-float 6s ease-in-out infinite alternate;
}
.medal-scene__badge{
  position:absolute; z-index:3; bottom:4%; left:50%; transform:translateX(-50%);
  white-space:nowrap; background:var(--surface); border:1px solid var(--line);
  box-shadow:var(--shadow-1); border-radius:999px; padding:9px 18px;
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.08em;
  color:var(--sky-deep); font-weight:600;
}
@keyframes medal-spin{ to{ transform:rotate(360deg); } }
@keyframes medal-float{ from{ transform:translateY(-9px); } to{ transform:translateY(9px); } }
@keyframes medal-halo{ from{ opacity:0.4; transform:scale(0.94); } to{ opacity:0.72; transform:scale(1.06); } }
@media (max-width:900px){
  .rse-hero .page-hero__inner{ grid-template-columns:1fr; gap:36px; }
  .medal-scene{ width:min(260px,70vw); }
}
@media (prefers-reduced-motion:reduce){
  .medal-scene__ring, .medal-scene__img, .medal-scene__halo{ animation:none; }
}

/* Orbes de fond animés (hero + sections) */
.bg-orbs{ position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.bg-orb{ position:absolute; border-radius:50%; filter:blur(72px); will-change:transform; }
.bg-orb--sky{ background:radial-gradient(circle, rgba(41,171,226,0.32), transparent 70%); }
.bg-orb--orange{ background:radial-gradient(circle, rgba(232,83,30,0.26), transparent 70%); }
.bg-orb--a{ width:540px; height:540px; top:-180px; right:-140px; animation:orb-a 17s ease-in-out infinite alternate; }
.bg-orb--b{ width:440px; height:440px; bottom:-180px; left:-120px; animation:orb-b 21s ease-in-out infinite alternate; }
.bg-orb--c{ width:300px; height:300px; top:30%; left:38%; opacity:0.7; animation:orb-c 14s ease-in-out infinite alternate; }
@keyframes orb-a{ from{ transform:translate(0,0) scale(1); } to{ transform:translate(-70px,50px) scale(1.12); } }
@keyframes orb-b{ from{ transform:translate(0,0) scale(1.08); } to{ transform:translate(60px,-45px) scale(0.96); } }
@keyframes orb-c{ from{ transform:translate(0,0); } to{ transform:translate(45px,35px); } }
@media (prefers-reduced-motion:reduce){ .bg-orb{ animation:none; } }

/* Ancres : ne pas passer sous la navbar flottante */
.pillar-anchor{ scroll-margin-top:calc(var(--nav-h) + 32px); }

/* ================= RSE — explorateur de piliers (onglets) ================= */
.pillar-tabs__nav{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin-bottom:30px; }
.pillar-tab{
  position:relative; display:flex; align-items:center; gap:13px; text-align:left;
  padding:16px 18px 19px; background:var(--surface); border:1.5px solid var(--line);
  border-radius:13px; cursor:pointer; font-family:inherit; overflow:hidden;
  transition:border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.pillar-tab:hover{ transform:translateY(-2px); box-shadow:var(--shadow-1); border-color:rgba(41,171,226,0.5); }
.pillar-tab.is-active{ border-color:var(--sky-deep); box-shadow:var(--shadow-1); }
.pillar-tab__icon{
  width:42px; height:42px; border-radius:10px; background:rgba(41,171,226,0.1);
  display:flex; align-items:center; justify-content:center; color:var(--sky-deep); flex-shrink:0;
  transition:background 0.25s ease, color 0.25s ease;
}
.pillar-tab__icon svg{ width:21px; height:21px; }
.pillar-tab.is-active .pillar-tab__icon{ background:var(--sky-deep); color:#fff; }
.pillar-tab__num{ font-family:'IBM Plex Mono',monospace; font-size:11px; font-weight:600; color:var(--orange); letter-spacing:0.08em; display:block; }
.pillar-tab__label{ font-family:'Outfit',sans-serif; font-weight:600; font-size:15px; color:var(--ink); line-height:1.25; }
.pillar-tab__progress{
  position:absolute; left:0; right:0; bottom:0; height:3px;
  background:linear-gradient(90deg, var(--sky), var(--orange));
  transform:scaleX(0); transform-origin:left;
}
.pillar-tab.is-active .pillar-tab__progress{ animation:tab-progress var(--tab-ms,7000ms) linear forwards; }
.pillar-tabs.is-paused .pillar-tab__progress{ animation-play-state:paused; }
@keyframes tab-progress{ to{ transform:scaleX(1); } }
@media (prefers-reduced-motion:reduce){ .pillar-tab__progress{ display:none; } }

.pillar-panel{ display:none; }
.pillar-panel.is-active{
  display:grid; grid-template-columns:0.95fr 1.05fr; gap:48px; align-items:center;
  animation:panel-in 0.55s cubic-bezier(0.16,1,0.3,1);
}
@keyframes panel-in{ from{ opacity:0; transform:translateY(16px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ .pillar-panel.is-active{ animation:none; } }
.pillar-panel__media{
  position:relative; aspect-ratio:4/3; border-radius:var(--radius); overflow:hidden;
  border:1px solid var(--line); background:var(--paper); box-shadow:var(--shadow-1);
}
.pillar-panel__media img{ width:100%; height:100%; object-fit:cover; display:block; }
/* Variante « logo partenaire » : pas de photo, la marque est le visuel.
   Fond papier + filet discret, logo centre a taille lisible sans etre ecrase. */
.pillar-panel__media--brand{
  display:grid; place-items:center;
  background:
    radial-gradient(120% 100% at 50% 0%, rgba(0,166,224,0.07), transparent 62%),
    var(--paper);
}
.pillar-panel__media--brand .pillar-panel__brand{
  width:auto; height:auto; max-width:62%; max-height:34%; object-fit:contain;
}
@media (max-width:760px){ .pillar-panel__media--brand .pillar-panel__brand{ max-width:70%; } }
.pillar-panel__media-caption{
  position:absolute; left:14px; bottom:14px; display:flex; align-items:center; gap:10px;
  background:rgba(255,255,255,0.92); border:1px solid var(--line); border-radius:10px; padding:8px 14px;
  font-size:12.5px; color:var(--slate); font-weight:600;
}
.pillar-panel__media-caption img{ height:26px; width:auto; }
.pillar-panel__tag{
  display:inline-flex; align-items:center; gap:12px; margin-bottom:12px;
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.14em;
  text-transform:uppercase; color:var(--sky-deep); font-weight:600;
}
.pillar-panel__tag::before{ content:''; width:30px; height:2px; border-radius:2px; background:linear-gradient(90deg, var(--sky), var(--orange)); }
.pillar-panel__content h3{ font-size:clamp(22px,2.6vw,30px); margin-bottom:12px; }
.pillar-panel__content > p{ font-size:15px; color:var(--slate); line-height:1.65; margin:0; }
.pillar-points{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px 22px; margin-top:22px; }
.pillar-point{ display:flex; gap:11px; align-items:flex-start; }
.pillar-point svg{ width:18px; height:18px; color:var(--sky-deep); flex-shrink:0; margin-top:2px; }
.pillar-point div{ font-size:13.5px; color:var(--slate); line-height:1.5; }
.pillar-point strong{ display:block; font-size:14px; color:var(--ink); font-family:'Outfit',sans-serif; font-weight:600; margin-bottom:2px; }
@media (max-width:900px){
  .pillar-tabs__nav{ grid-template-columns:repeat(2,1fr); }
  .pillar-panel.is-active{ grid-template-columns:1fr; gap:26px; }
}
@media (max-width:560px){ .pillar-points{ grid-template-columns:1fr; } }

/* ================= RSE — roue des 17 ODD qui se démantèle ================= */
/* État par défaut (sans classe) = grille finale statique : sert aussi de repli no-JS / mobile / reduced-motion. */
.sdg .section__head{ margin-left:auto; margin-right:auto; text-align:center; }
.sdg-stage{ position:relative; }
@media (min-width:821px){
  .sdg-stage{ min-height:780px; display:flex; flex-direction:column; justify-content:center; }
}

.sdg-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px 24px; }
.sdg-item{
  display:flex; gap:18px; align-items:center; padding:16px 18px;
  background:var(--surface); border:1px solid var(--line); border-radius:12px;
  transition:background 0.5s ease 0.25s, border-color 0.5s ease 0.25s, box-shadow 0.25s ease, transform 0.25s ease;
}
.sdg-item:hover{ box-shadow:var(--shadow-1); transform:translateY(-2px); }
.sdg-stage.is-wheel .sdg-item, .sdg-stage.is-deploy .sdg-item{
  background:transparent; border-color:transparent; box-shadow:none; transform:none;
  pointer-events:none; /* cartes invisibles = pas de survol (sinon halos orange fantômes pendant l'animation) */
  transition:box-shadow 0.25s ease; /* bascule instantanée vers l'état transparent, retour en douceur via la règle de base */
}
.sdg-stage.is-wheel .glow-card__fx, .sdg-stage.is-deploy .glow-card__fx{ opacity:0 !important; }
.sdg-stage.is-wheel .sdg-note, .sdg-stage.is-deploy .sdg-note{ opacity:0; }
.sdg-note{ transition:opacity 0.5s ease 0.3s; }
.sdg-square{
  position:relative; z-index:2; width:92px; height:92px; flex-shrink:0; border-radius:10px;
  display:block; object-fit:cover;
  box-shadow:0 10px 24px rgba(11,18,32,0.2);
  transition:transform 0.3s ease, box-shadow 0.3s ease;
}
.sdg-item:hover .sdg-square{ transform:scale(1.16); box-shadow:0 14px 30px rgba(11,18,32,0.28); }
.sdg-item__txt{ font-size:13.5px; color:var(--slate); line-height:1.5; margin:0; transition:opacity 0.5s ease 0.15s, transform 0.5s ease 0.15s; }
.sdg-item__txt strong{ display:block; font-family:'Outfit',sans-serif; font-weight:600; font-size:14px; color:var(--ink); margin-bottom:3px; }
.sdg-stage.is-wheel .sdg-item__txt, .sdg-stage.is-deploy .sdg-item__txt{ opacity:0; transform:translateY(10px); }

/* La roue officielle des 17 ODD, objet compact au centre de la scène.
   roue.svg est vectorielle, générée avec les codes couleurs officiels ONU
   (mêmes hex que les tuiles odd*.webp) : le raccord secteur → tuile est exact.
   Chaque secteur est un calque de la même image découpé au clip-path, avec un
   léger recouvrement angulaire entre voisins pour des jointures invisibles :
   quand une part s'efface, la roue a un vrai trou. */
.sdg-wheel-box{
  position:absolute; left:50%; top:50%; z-index:1;
  width:var(--wheel-d,460px); height:var(--wheel-d,460px);
  margin-left:calc(var(--wheel-d,460px) / -2); margin-top:calc(var(--wheel-d,460px) / -2);
  pointer-events:none;
  opacity:0; transform:scale(0.7) rotate(-16deg);
  will-change:transform,opacity;
  transition:opacity 0.7s ease, transform 0.9s cubic-bezier(0.34,1.3,0.4,1);
}
.sdg-stage.is-wheel .sdg-wheel-box{ opacity:1; transform:none; }
/* Repli : ce qui reste de la roue se referme d'un seul mouvement, derrière les tuiles qui se posent */
.sdg-stage.is-deploy .sdg-wheel-box{
  opacity:0; transform:scale(0.55);
  transition:opacity 0.55s ease 0.05s, transform 0.65s cubic-bezier(0.55,0,0.55,0.2);
}
.sdg-wedge{
  position:absolute; inset:0;
  background-image:url('odd/roue.svg'); background-size:100% 100%;
}
.sdg-stage.is-wheel .sdg-wedge{ will-change:opacity; }
.sdg-stage.is-wheel .sdg-square, .sdg-stage.is-deploy .sdg-square{ will-change:transform,opacity; }

.sdg-replay{
  display:none; margin:26px auto 0; align-items:center; gap:8px;
  background:none; border:1.5px solid var(--line); border-radius:999px; padding:9px 18px;
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:0.06em; color:var(--slate);
  cursor:pointer; transition:border-color 0.2s ease, color 0.2s ease;
}
.sdg-replay:hover{ border-color:var(--sky-deep); color:var(--sky-deep); }
.sdg-replay svg{ width:14px; height:14px; }
.sdg-replay.is-shown{ display:inline-flex; }
.sdg-note{ margin:18px 0 0; font-size:12px; color:var(--slate-2); text-align:center; }

@media (max-width:900px){ .sdg-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .sdg-grid{ grid-template-columns:1fr; } }

/* ================= RSE — index de l'égalité professionnelle ================= */
.egapro{
  display:grid; grid-template-columns:0.9fr 1.1fr; gap:56px; align-items:start;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:46px 48px;
}
.egapro h3{ font-family:'Outfit',sans-serif; font-size:clamp(22px,2.4vw,28px); color:var(--ink); margin:10px 0 12px; line-height:1.2; }
.egapro__intro > p{ font-size:14.5px; color:var(--slate); line-height:1.65; }
.egapro__verdict{ margin-top:22px; padding:18px 20px; background:var(--paper); border-left:3px solid var(--sky-deep); border-radius:0 10px 10px 0; }
.egapro__verdict-label{ display:block; font-family:'IBM Plex Mono',monospace; font-size:11px; letter-spacing:0.14em; color:var(--slate); }
.egapro__verdict-value{ display:block; font-family:'Outfit',sans-serif; font-weight:600; font-size:22px; color:var(--sky-deep); margin:4px 0 8px; }
.egapro__verdict p{ font-size:13px; color:var(--slate); line-height:1.6; margin:0; }
.egapro__rows{ display:flex; flex-direction:column; }
.egapro-row{ display:grid; grid-template-columns:1fr auto; gap:8px 18px; align-items:baseline; padding:14px 0; border-top:1px solid var(--line); }
.egapro-row:first-child{ border-top:none; padding-top:0; }
.egapro-row__name{ font-size:13.5px; color:var(--ink); font-weight:500; line-height:1.45; }
.egapro-row__score{ font-family:'IBM Plex Mono',monospace; font-size:13.5px; color:var(--ink); text-align:right; white-space:nowrap; }
.egapro-row__score span{ color:var(--slate-2); }
.egapro-row__bar{ grid-column:1 / -1; display:block; height:5px; border-radius:999px; background:var(--paper); overflow:hidden; position:relative; }
.egapro-row__fill{ position:absolute; top:0; bottom:0; left:0; border-radius:999px; background:linear-gradient(90deg, var(--sky), var(--sky-deep)); }
.egapro-row--na .egapro-row__score{ color:var(--slate-2); font-size:11.5px; letter-spacing:0.08em; }
.egapro-row--na .egapro-row__bar{ background:repeating-linear-gradient(135deg, var(--paper) 0 6px, #e9edf2 6px 12px); }
.egapro-row--total{ margin-top:8px; padding-top:16px; border-top:2px solid var(--ink); }
.egapro-row--total .egapro-row__name{ font-family:'Outfit',sans-serif; font-weight:600; font-size:14px; }
.egapro-row--total .egapro-row__fill{ background:var(--orange); }
.egapro__note{ margin-top:18px; font-size:12px; color:var(--slate-2); line-height:1.6; }
@media (max-width:900px){ .egapro{ grid-template-columns:1fr; gap:34px; padding:32px 26px; } }

/* ================= Ajustements mobiles globaux (en fin de fichier : doivent
   gagner la cascade sur les définitions de base, notamment .footer) ================= */
/* Garde-fou : sur mobile, un élément qui déborde élargit le layout viewport
   (le body seul ne suffit pas, il faut aussi couper au niveau du html) */
html{ overflow-x:hidden; }
@media (max-width:900px){
  /* Le dock flotte au-dessus du bas de page : le footer réserve la place */
  .footer{ padding-bottom:calc(32px + 84px + env(safe-area-inset-bottom, 0px)); }
}