/* Wakaserve · Cobalt Mosaïque */

:root {
  --blanc: #ffffff;
  --nuage: #f3f6ff;
  --ciel: #eef2ff;
  --trait: #e3e8f5;
  --trait-fort: #d5dcee;
  --encre: #0b1026;
  --texte: #3a4260;
  --gris: #566079;
  --cobalt: #1f44ff;
  --cobalt-fonce: #1533d6;
  --cobalt-vif: #3b5bff;
  --nuit: #0a1478;
  --nuit-doux: #c8d2ff;
  --sur-bleu: #dce3ff;
  --sombre: #1c2238;
  --urgence: #b5f23d;
  --urgence-texte: #1533d6;
  --urgence-clair: #effcd6;
  --aide: #1533d6;
  --aide-vif: #6584ff;
  --aide-clair: #eef2ff;

  --font: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --titre: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;

  --largeur: 1280px;
  --gouttiere: clamp(16px, 4vw, 48px);
  --section: clamp(56px, 7vw, 96px);
  --rayon: 28px;
  --rayon-s: 20px;

  --degrade-cobalt: radial-gradient(70% 140% at 88% 0%, #6584ff 0%, rgba(101, 132, 255, 0) 58%),
    linear-gradient(110deg, #1533d6 0%, #1f44ff 55%, #6584ff 100%);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.6;
  color: var(--encre);
  background: var(--blanc);
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
a { color: var(--cobalt); }
a:hover { color: var(--cobalt-fonce); }
button { font: inherit; }
h1, h2, h3, p { margin: 0; }
:focus-visible { outline: 2px solid var(--cobalt); outline-offset: 3px; }

.container {
  max-width: var(--largeur);
  margin: 0 auto;
  padding-left: max(var(--gouttiere), env(safe-area-inset-left, 0px));
  padding-right: max(var(--gouttiere), env(safe-area-inset-right, 0px));
}
.section { padding-top: var(--section); }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Typographie */
.eyebrow { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font); font-weight: 600; font-size: 13px; color: var(--cobalt); }
.eyebrow::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 0 100% 0 0; background: currentColor; }
.accent { color: var(--cobalt); }
.h-display {
  font-weight: 500;
  font-size: clamp(42px, 5.6vw, 80px);
  line-height: 1.02;
  letter-spacing: -0.05em;
  text-wrap: balance;
}
.h-section {
  font-weight: 500;
  font-size: clamp(32px, 4.2vw, 58px);
  line-height: 1.04;
  letter-spacing: -0.05em;
  text-wrap: balance;
}
.h-card { font-size: clamp(22px, 2vw, 28px); font-weight: 500; letter-spacing: -0.035em; line-height: 1.15; }
.lead { font-size: 17px; line-height: 1.65; color: var(--texte); }
.muted { color: var(--gris); }

.section-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px 48px;
  margin-bottom: 48px;
}
.section-head__titre { display: flex; flex-direction: column; gap: 18px; max-width: 760px; }
.section-head .lead { max-width: 420px; font-size: 16px; }
.section-head--centre { flex-direction: column; align-items: center; text-align: center; }
.section-head--centre .lead { max-width: 560px; }

/* Boutons en deux pièces */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 52px;
  padding: 0 24px;
  border-radius: 14px;
  border: 1px solid transparent;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.btn--icone { padding: 0; background: none !important; border: 0; color: inherit; }
.btn__texte { display: inline-flex; align-items: center; min-height: 52px; padding: 0 24px; border-radius: 14px; transition: background-color .2s ease; }
.btn__rond { width: 52px; height: 52px; border-radius: 14px 26px 26px 14px; display: grid; place-items: center; transition: border-radius .35s cubic-bezier(.6, 0, .2, 1), background-color .2s ease; }
.btn__rond svg { width: 20px; height: 20px; transition: transform .35s cubic-bezier(.6, 0, .2, 1); }
.btn:hover .btn__rond { border-radius: 26px; }
.btn:hover .btn__rond svg { transform: rotate(45deg); }
.btn--primaire .btn__texte { background: var(--cobalt); color: #fff; }
.btn--primaire:hover .btn__texte { background: var(--cobalt-fonce); }
.btn--primaire .btn__rond { background: var(--urgence); color: var(--encre); }
.btn--sombre .btn__texte { background: var(--encre); color: #fff; }
.btn--sombre:hover .btn__texte { background: #000; }
.btn--sombre .btn__rond { background: var(--cobalt); color: #fff; }
.btn--blanc .btn__texte { background: #fff; color: var(--nuit); }
.btn--blanc .btn__rond { background: var(--urgence); color: var(--encre); }
.btn--blanc:not(.btn--icone) { background: #fff; color: var(--nuit); }
.btn--blanc:not(.btn--icone):hover { background: var(--ciel); color: var(--nuit); }
.btn--contour { border-color: var(--cobalt); color: var(--cobalt); background: transparent; }
.btn--contour:hover { background: var(--ciel); color: var(--cobalt); }
.btn--contour-blanc { border-color: rgba(255, 255, 255, .6); color: #fff; }
.btn--contour-blanc:hover { background: rgba(255, 255, 255, .1); color: #fff; }
.btn--petit .btn__texte { min-height: 44px; padding: 0 18px; font-size: 15px; }
.btn--petit .btn__rond { width: 44px; height: 44px; }
.btn--petit:not(.btn--icone) { min-height: 44px; font-size: 15px; }
.btn--plein { width: 100%; }
.btn--plein .btn__texte { flex: 1; justify-content: center; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.lien-fleche { color: var(--encre); font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
.lien-fleche:hover { color: var(--cobalt); }
@media (max-width: 420px) { .btn__texte { padding: 0 16px; white-space: normal; text-align: center; line-height: 1.25; } }

.rond-fleche { flex: none; width: 44px; height: 44px; border-radius: 12px 22px 22px 12px; background: var(--ciel); color: var(--cobalt); display: grid; place-items: center; transition: border-radius .35s ease, background-color .2s ease, color .2s ease; }
.rond-fleche svg { width: 18px; height: 18px; transition: transform .35s ease; }

.note { display: inline-flex; align-items: center; gap: 10px; padding: 6px 14px 6px 6px; border-radius: 999px; background: var(--ciel); font-size: 14px; align-self: flex-start; }
.note b { padding: 3px 10px; border-radius: 999px; background: var(--cobalt); color: #fff; font-weight: 500; }
.coches { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 0; padding: 0; list-style: none; font-size: 15px; color: var(--texte); }
.coches li { display: flex; align-items: center; gap: 8px; }
.coches li::before { content: ""; width: 12px; height: 12px; border-radius: 0 100% 0 0; background: var(--aide-vif); }

/* En-tête */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255, 255, 255, .92);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--trait);
}
.site-header__barre { display: flex; align-items: center; gap: 24px; height: 84px; }
.logo img { height: 28px; width: auto; }
.nav { display: flex; align-items: center; gap: 4px; margin: 0 auto; }
.nav > a, .nav__declencheur {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 16px;
  border: 0;
  border-radius: 999px;
  background: none;
  color: var(--encre);
  font-size: 15px;
  text-decoration: none;
  cursor: pointer;
}
.nav > a:hover, .nav__declencheur:hover { color: var(--cobalt); }
.nav [aria-current="page"] { background: var(--ciel); color: var(--cobalt); }
.nav__declencheur svg { width: 14px; height: 14px; transition: transform .2s ease; }
.nav__menu { position: relative; }
.mega {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  width: min(880px, 92vw);
  transform: translate(-50%, 8px);
  padding: 28px;
  border-radius: 24px;
  border: 1px solid var(--trait);
  background: #fff;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) 1.1fr;
  gap: 24px;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, transform .2s ease, visibility .2s;
}
.nav__menu:hover .mega, .nav__menu:focus-within .mega, .nav__menu.ouvert .mega { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.nav__menu:hover .nav__declencheur svg { transform: rotate(180deg); }
.mega__colonne { display: flex; flex-direction: column; gap: 4px; }
.mega__titre { font-family: var(--font); font-weight: 600; font-size: 12px; color: var(--cobalt); margin-bottom: 8px; }
.mega__colonne a { display: flex; flex-direction: column; padding: 8px 10px; margin: 0 -10px; border-radius: 12px; color: var(--encre); text-decoration: none; }
.mega__colonne a:hover { background: var(--nuage); }
.mega__colonne a span { font-weight: 500; font-size: 15px; }
.mega__colonne a small { font-size: 13px; color: var(--gris); }
.mega__appel { border-radius: 18px; padding: 22px; background: var(--degrade-cobalt); color: #fff; display: flex; flex-direction: column; gap: 12px; }
.mega__appel strong { font-size: 20px; font-weight: 500; letter-spacing: -0.02em; }
.mega__appel p { font-size: 14px; line-height: 1.5; color: var(--sur-bleu); }
.mega__appel ul { margin: 0; padding: 0; list-style: none; font-family: var(--font); font-weight: 600; font-size: 12px; color: var(--sur-bleu); display: grid; gap: 4px; }
.langues { font-family: var(--font); font-weight: 600; font-size: 13px; color: var(--gris); }
.langues a { color: var(--gris); text-decoration: none; }
.langues a[aria-current="true"] { color: var(--cobalt); }
.nav-toggle {
  display: none;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid var(--trait-fort);
  background: #fff;
  place-items: center;
  cursor: pointer;
}
.nav-toggle svg { width: 20px; height: 20px; }

@media (max-width: 1080px) {
  .nav-toggle { display: grid; margin-left: auto; }
  .site-header__barre .langues, .site-header__barre > .btn { display: none; }
  .nav {
    position: fixed;
    inset: 84px 0 0;
    margin: 0;
    padding: 24px var(--gouttiere) 40px;
    background: #fff;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    overflow-y: auto;
    display: none;
  }
  .nav.ouvert { display: flex; }
  .nav > a, .nav__declencheur { font-size: 20px; padding: 14px 0; border-radius: 0; border-bottom: 1px solid var(--trait); width: 100%; justify-content: space-between; }
  .nav [aria-current="page"] { background: none; }
  .mega { position: static; width: auto; transform: none; opacity: 1; visibility: visible; display: none; grid-template-columns: 1fr; padding: 16px 0; border: 0; }
  .nav__menu.ouvert .mega { display: grid; transform: none; }
  .nav__mobile-cta { display: flex !important; margin-top: 24px; }
}
.nav__mobile-cta { display: none !important; }

/* Héros */
.hero { padding-top: clamp(48px, 7vw, 80px); }
.hero__grille { display: flex; flex-wrap: wrap; gap: 32px 64px; align-items: flex-start; }
.hero__titre { flex: 999 1 560px; min-width: 0; }
.hero__aside { flex: 1 1 360px; min-width: 0; display: flex; flex-direction: column; gap: 22px; padding-top: 10px; }
.hero__chiffres { display: flex; flex-wrap: wrap; gap: 32px; padding-top: 8px; }
.chiffre-court { display: flex; flex-direction: column; gap: 2px; }
.chiffre-court strong { font-size: 34px; font-weight: 500; letter-spacing: -0.04em; color: var(--cobalt); line-height: 1.2; }
.chiffre-court span { font-size: 14px; color: var(--gris); }

.vague { position: relative; height: clamp(260px, 32vw, 400px); margin-top: 24px; background: radial-gradient(55% 70% at 60% 45%, #e3e9ff 0%, rgba(227, 234, 255, 0) 70%); }
.vague svg { width: 100%; height: 100%; }
.vague__etiquette { position: absolute; display: flex; flex-direction: column; gap: 2px; }
.vague__etiquette strong { font-size: clamp(26px, 3vw, 38px); font-weight: 400; color: var(--cobalt); letter-spacing: -0.04em; line-height: 1.1; }
.vague__etiquette span { font-size: 14px; color: var(--gris); }
.vague__etiquette--a { left: 2%; top: 12%; }
.vague__etiquette--b { right: 2%; top: 6%; text-align: right; }
.vague__etiquette--c { right: 12%; bottom: 6%; text-align: right; }
@media (max-width: 640px) { .vague__etiquette--b { display: none; } }

/* Fil d'Ariane */
.ariane { padding-top: 32px; font-family: var(--font); font-weight: 600; font-size: 13px; color: var(--gris); }
.ariane a { color: var(--gris); text-decoration: none; }
.ariane a:hover { color: var(--cobalt); }
.ariane [aria-current="page"] { color: var(--cobalt); }

/* Logos clients */
.clients { display: flex; flex-direction: column; gap: 28px; padding: 40px 0 56px; border-bottom: 1px solid var(--trait); }
.clients__tete { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; }
.clients__tete h2 { font-weight: 500; font-size: 28px; letter-spacing: -0.03em; }
.clients__tete p { max-width: 520px; font-size: 15px; color: var(--gris); }
.clients__grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr)); gap: 12px; }
.clients__logo { height: 76px; border: 1px solid var(--trait); border-radius: 16px; display: grid; place-items: center; padding: 14px 18px; }
.clients__logo img { max-height: 42px; width: auto; object-fit: contain; }
.clients--ligne { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 20px 44px; padding: 40px 0; }
.clients--ligne > span { font-size: 15px; color: var(--gris); }
.clients--ligne .clients__rang { display: flex; flex-wrap: wrap; align-items: center; gap: 24px 40px; }
.clients--ligne img { height: 30px; width: auto; }

/* Bande de chiffres */
.bande-chiffres {
  position: relative;
  overflow: hidden;
  border-radius: var(--rayon);
  padding: 16px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr));
  color: #fff;
  background: var(--degrade-cobalt);
}
.bande-chiffres > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.bande-chiffres__case { position: relative; padding: 28px; display: flex; flex-direction: column; gap: 22px; }
.bande-chiffres__case strong { font-size: clamp(44px, 4.4vw, 56px); font-weight: 500; letter-spacing: -0.045em; line-height: 1; }
.bande-chiffres__case span { font-size: 15px; line-height: 1.45; color: var(--sur-bleu); }
.bande-chiffres__case--nuit { background: var(--nuit); border-radius: 18px; }
.bande-chiffres__case--nuit span { color: var(--nuit-doux); }

/* Agence */
.intro { display: flex; flex-wrap: wrap; gap: 32px 80px; align-items: flex-end; margin-bottom: 56px; }
.intro__titre { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.intro__texte { flex: 1 1 360px; min-width: 0; display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.piliers { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); border-top: 1px solid var(--trait); }
.pilier { display: flex; flex-direction: column; gap: 14px; padding: 32px 32px 8px 0; }
.pilier + .pilier { padding-left: 32px; border-left: 1px solid var(--trait); }
.pilier__num { font-family: var(--font); font-weight: 600; font-size: 14px; color: var(--cobalt); }
.pilier h3 { font-size: 24px; font-weight: 500; letter-spacing: -0.03em; }
.pilier p { font-size: 15px; line-height: 1.6; color: var(--gris); }
@media (max-width: 900px) { .pilier + .pilier { padding-left: 0; border-left: 0; border-top: 1px solid var(--trait); } }

/* Pôles */
.poles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 20px; }
.pole { border: 1px solid var(--trait); border-radius: var(--rayon); padding: 30px; display: flex; flex-direction: column; gap: 22px; }
.pole__tete { display: flex; justify-content: space-between; align-items: center; }
.pole__icone { width: 52px; height: 52px; border-radius: 50%; background: var(--ciel); color: var(--cobalt); display: grid; place-items: center; }
.pole__icone svg { width: 24px; height: 24px; }
.pole__compte { font-family: var(--font); font-weight: 600; font-size: 13px; color: var(--gris); }
.pole__liste { display: flex; flex-direction: column; }
.pole__liste a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 0;
  border-top: 1px solid var(--trait);
  color: var(--encre);
  text-decoration: none;
}
.pole__liste a span { display: flex; flex-direction: column; gap: 2px; }
.pole__liste a b { font-weight: 500; }
.pole__liste a small { font-size: 14px; color: var(--gris); }
.pole__liste a svg { flex: none; width: 18px; height: 18px; color: var(--cobalt); transition: transform .2s ease; }
.pole__liste a:hover svg { transform: translate(2px, -2px); }
.pole--bleu { border-color: transparent; color: #fff; background: radial-gradient(80% 60% at 100% 0%, #6584ff 0%, rgba(101, 132, 255, 0) 60%), var(--cobalt); }
.pole--bleu .pole__icone { background: rgba(255, 255, 255, .16); color: #fff; }
.pole--bleu .pole__compte, .pole--bleu .pole__liste a small { color: var(--sur-bleu); }
.pole--bleu .pole__liste a { color: #fff; border-top-color: rgba(255, 255, 255, .22); }
.pole--bleu .pole__liste a svg { color: #fff; }

/* Rangées de services */
.rangee { display: flex; flex-wrap: wrap; gap: 24px 40px; padding-top: 32px; margin-top: 32px; border-top: 1px solid var(--trait); }
.rangee:first-of-type { margin-top: 0; }
.rangee__tete { flex: 1 1 220px; display: flex; flex-direction: column; gap: 10px; }
.rangee__tete h3 { font-size: 30px; font-weight: 500; letter-spacing: -0.04em; }
.rangee__services { flex: 4 1 640px; min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr)); gap: 14px; }
.tuile {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 28px;
  min-height: 190px;
  padding: 22px;
  border-radius: 22px;
  background: var(--nuage);
  color: var(--encre);
  text-decoration: none;
  transition: background-color .2s ease;
}
.tuile:hover { background: var(--ciel); color: var(--encre); }
.tuile__haut { display: flex; justify-content: space-between; align-items: flex-start; color: var(--cobalt); }
.tuile__haut > span { width: 46px; height: 46px; border-radius: 50%; background: #fff; display: grid; place-items: center; }
.tuile__haut svg { width: 22px; height: 22px; }
.tuile__haut > svg { width: 20px; height: 20px; }
.tuile b { display: block; font-size: 18px; font-weight: 500; letter-spacing: -0.02em; margin-bottom: 6px; }
.tuile small { font-size: 14px; line-height: 1.45; color: var(--gris); }

/* Projets */
.filtres { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 40px; }
.filtres--colle { position: sticky; top: 84px; z-index: 5; margin-bottom: 0; padding: 14px 0; background: var(--blanc); border-bottom: 1px solid var(--trait); }
.filtre {
  height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  border: 1px solid var(--trait-fort);
  background: #fff;
  color: var(--encre);
  font-size: 14px;
  cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
.filtre span { font-family: var(--font); font-weight: 600; color: var(--gris); margin-left: 4px; }
.filtre:hover { border-color: var(--cobalt); }
.filtre[aria-pressed="true"] { background: var(--cobalt); border-color: var(--cobalt); color: #fff; }
.filtre[aria-pressed="true"] span { color: var(--sur-bleu); }
.projets { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(340px, 100%), 1fr)); gap: 44px 24px; }
.centre { display: flex; justify-content: center; margin-top: 48px; }

/* Raisons */
.raisons { display: flex; flex-wrap: wrap; gap: 48px 80px; }
.raisons__tete { flex: 1 1 360px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.raisons__liste { flex: 1.6 1 560px; min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 0 40px; }
.raison { display: flex; gap: 20px; padding: 24px 0; border-bottom: 1px solid var(--trait); }
.raison__num { flex: none; width: 48px; height: 48px; border-radius: 50%; background: var(--ciel); display: grid; place-items: center; font-family: var(--font); font-weight: 600; font-size: 13px; color: var(--cobalt); }
.raison h3 { font-size: 19px; font-weight: 500; letter-spacing: -0.02em; margin-bottom: 8px; }
.raison p { font-size: 14px; line-height: 1.6; color: var(--gris); }

.raisons-nuit {
  border-radius: 32px;
  padding: clamp(32px, 5vw, 64px);
  background: radial-gradient(60% 90% at 100% 0%, var(--cobalt) 0%, rgba(31, 68, 255, 0) 60%), var(--nuit);
  color: #fff;
}
.raisons-nuit .eyebrow { color: var(--nuit-doux); }
.raisons-nuit .accent { color: #a3b6ff; }
.raisons-nuit .lead { color: var(--sur-bleu); }
.raisons-nuit__grille { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 1px; background: rgba(255, 255, 255, .16); border-radius: 22px; overflow: hidden; }
.raisons-nuit__grille > div { background: var(--nuit); padding: 28px; display: flex; flex-direction: column; gap: 12px; }
.raisons-nuit__grille span { font-family: var(--font); font-weight: 600; font-size: 13px; color: #a3b6ff; }
.raisons-nuit__grille h3 { font-size: 20px; font-weight: 500; letter-spacing: -0.02em; }
.raisons-nuit__grille p { font-size: 14px; line-height: 1.6; color: var(--nuit-doux); }

/* Avis */
.avis { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap: 20px; }
.avis figure { margin: 0; background: var(--nuage); border-radius: 24px; padding: 28px; display: flex; flex-direction: column; justify-content: space-between; gap: 28px; }
.avis blockquote { margin: 0; font-size: 18px; line-height: 1.55; letter-spacing: -0.01em; }
.avis figcaption { display: flex; align-items: center; gap: 14px; font-size: 14px; }
.avis figcaption > span:first-child { flex: none; width: 48px; height: 48px; border-radius: 14px; background: #fff; border: 1px solid var(--trait); display: grid; place-items: center; overflow: hidden; }
.avis figcaption img { max-width: 38px; max-height: 38px; object-fit: contain; }
.avis figcaption b { display: block; font-weight: 600; }
.avis figcaption small { font-size: 14px; color: var(--gris); }

/* Étapes */
.etapes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 28px; }
.etape { display: flex; flex-direction: column; gap: 16px; }
.etape__ligne { display: flex; align-items: center; gap: 12px; }
.etape__ligne b { width: 52px; height: 52px; border-radius: 50%; background: var(--cobalt); color: #fff; display: grid; place-items: center; font-family: var(--font); font-weight: 600; font-size: 14px; font-weight: 400; }
.etape__ligne i { flex: 1; height: 1px; background: #c8d2ff; }
.etape:last-child .etape__ligne b { background: var(--nuit); }
.etape h3 { font-size: 21px; font-weight: 500; letter-spacing: -0.02em; }
.etape p { font-size: 15px; line-height: 1.6; color: var(--gris); }

.etapes-cartes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 16px; }
.etape-carte { border: 1px solid var(--trait); border-radius: 24px; padding: 26px; display: flex; flex-direction: column; gap: 14px; }
.etape-carte__haut { display: flex; justify-content: space-between; align-items: center; }
.etape-carte__haut b { width: 44px; height: 44px; border-radius: 50%; background: var(--cobalt); color: #fff; display: grid; place-items: center; font-family: var(--font); font-weight: 600; font-weight: 400; font-size: 14px; }
.etape-carte__haut span { font-family: var(--font); font-weight: 600; font-size: 12px; color: var(--cobalt); padding: 5px 10px; border-radius: 999px; background: var(--ciel); }
.etape-carte h3 { font-size: 20px; font-weight: 500; }
.etape-carte p { font-size: 14px; line-height: 1.6; color: var(--gris); }
.etape-carte--nuit { background: var(--nuit); border-color: transparent; color: #fff; }
.etape-carte--nuit .etape-carte__haut b { background: #fff; color: var(--nuit); }
.etape-carte--nuit .etape-carte__haut span { background: rgba(255, 255, 255, .14); color: #fff; }
.etape-carte--nuit p { color: var(--nuit-doux); }

/* Offres */
.offres { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 20px; }
.offre { border: 1px solid var(--trait); border-radius: var(--rayon); padding: 32px; display: flex; flex-direction: column; gap: 22px; }
.offre__tete { display: flex; flex-direction: column; gap: 10px; }
.offre__tete h3 { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 26px; font-weight: 600; letter-spacing: -0.03em; }
.offre__tete h3 small { font-size: 13px; font-weight: 400; letter-spacing: 0; }
.offre__tete p { font-size: 15px; line-height: 1.55; color: var(--gris); }
.offre hr { width: 100%; margin: 0; border: 0; border-top: 1px solid var(--trait); }
.offre__prix { font-size: 40px; font-weight: 600; letter-spacing: -0.045em; line-height: 1.1; }
.offre ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; font-size: 15px; color: var(--texte); }
.offre li { display: flex; gap: 10px; }
.offre li::before { content: "✓"; color: var(--cobalt); }
.offre--bleu { border-color: transparent; color: #fff; background: radial-gradient(80% 60% at 100% 0%, #6584ff 0%, rgba(101, 132, 255, 0) 60%), var(--cobalt); }
.offre--bleu .offre__tete p, .offre--bleu .offre__tete small { color: var(--sur-bleu); }
.offre--bleu hr { border-top-color: rgba(255, 255, 255, .24); }
.offre--bleu ul { color: #fff; }
.offre--bleu li::before { color: #fff; }

.sur-mesure { display: flex; flex-wrap: wrap; gap: 28px 48px; align-items: center; margin-top: 20px; padding: 32px; border-radius: var(--rayon); background: var(--nuit); color: #fff; }
.sur-mesure__texte { flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.sur-mesure .eyebrow { color: #a3b6ff; }
.sur-mesure h3 { font-size: 28px; font-weight: 500; letter-spacing: -0.035em; }
.sur-mesure p { font-size: 15px; line-height: 1.6; color: var(--nuit-doux); }
.puces { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 6px; margin: 0; list-style: none; padding-left: 0; }
.puces li { padding: 7px 14px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .28); font-size: 13px; }
.sur-mesure__action { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.sur-mesure__action span { font-size: 14px; color: var(--nuit-doux); }

/* Blocs de texte */
.duo { display: flex; flex-wrap: wrap; gap: 32px 80px; }
.duo > :first-child { flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.duo > :last-child { flex: 1.2 1 460px; min-width: 0; display: flex; flex-direction: column; gap: 22px; }
.duo .lead { font-size: 17px; line-height: 1.7; }

.cartes-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 20px; margin-top: 48px; }
.carte { border-radius: 24px; padding: 28px; background: var(--nuage); display: flex; flex-direction: column; gap: 14px; }
.carte > svg { width: 28px; height: 28px; color: var(--cobalt); }
.carte h3 { font-size: 20px; font-weight: 500; letter-spacing: -0.02em; }
.carte p { font-size: 15px; line-height: 1.6; color: var(--gris); }
.carte--contour { background: none; border: 1px solid var(--trait); }
.carte--bleue { background: var(--cobalt); color: #fff; }
.carte--bleue > svg { color: #fff; }
.carte--bleue p { color: var(--sur-bleu); }
.carte__icone { width: 56px; height: 56px; border-radius: 50%; background: var(--ciel); color: var(--cobalt); display: grid; place-items: center; }
.carte__icone svg { width: 24px; height: 24px; }
.carte--bleue .carte__icone { background: rgba(255, 255, 255, .16); color: #fff; }

.inclus { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); border-top: 1px solid var(--trait); }
.inclus > div { display: flex; flex-direction: column; gap: 12px; padding: 28px 28px 28px 0; border-bottom: 1px solid var(--trait); }
.inclus span { font-family: var(--font); font-weight: 600; font-size: 14px; color: var(--cobalt); }
.inclus h3 { font-size: 20px; font-weight: 500; letter-spacing: -0.02em; }
.inclus p { font-size: 15px; line-height: 1.6; color: var(--gris); }

/* Panneau visuel bleu */
.panneau {
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  background: radial-gradient(70% 90% at 85% 0%, #6584ff 0%, rgba(101, 132, 255, 0) 60%), linear-gradient(140deg, #1533d6 0%, #1f44ff 60%, #6584ff 100%);
  color: #fff;
}
.panneau > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.navigateur { position: relative; margin: 40px 28px 0; background: #fff; border-radius: 16px 16px 0 0; overflow: hidden; }
.navigateur__barre { display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-bottom: 1px solid var(--trait); }
.navigateur__barre i { width: 10px; height: 10px; border-radius: 50%; background: #dde3f2; }
.navigateur__barre span { margin-left: 12px; flex: 1; height: 26px; border-radius: 999px; background: var(--nuage); font-family: var(--font); font-weight: 600; font-size: 12px; color: var(--gris); display: flex; align-items: center; padding: 0 12px; }
.navigateur img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; }

.bande-trois { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); margin-top: 64px; border-top: 1px solid var(--trait); border-bottom: 1px solid var(--trait); }
.bande-trois > div { padding: 28px 24px; display: flex; flex-direction: column; gap: 6px; }
.bande-trois > div + div { border-left: 1px solid var(--trait); }
.bande-trois strong { font-size: 44px; font-weight: 500; letter-spacing: -0.045em; color: var(--cobalt); line-height: 1.1; }
.bande-trois span { font-size: 15px; color: var(--gris); }
@media (max-width: 720px) { .bande-trois > div + div { border-left: 0; border-top: 1px solid var(--trait); } }

/* FAQ */
.faq { border-top: 1px solid var(--trait); }
.faq details { border-bottom: 1px solid var(--trait); }
.faq summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 22px 0;
  font-size: 18px;
  font-weight: 500;
  cursor: pointer;
  list-style: none;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+";
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--ciel);
  color: var(--cobalt);
  display: grid;
  place-items: center;
  font-size: 20px;
  transition: transform .2s ease;
}
.faq details[open] summary::after { content: "−"; }
.faq details p { padding: 0 56px 24px 0; font-size: 15px; line-height: 1.7; color: var(--texte); }

/* Blog */
.a-la-une { display: flex; flex-wrap: wrap; border: 1px solid var(--trait); border-radius: 32px; overflow: hidden; color: var(--encre); text-decoration: none; }
.a-la-une__image { flex: 1.2 1 460px; min-height: 320px; background: var(--nuage); }
.a-la-une__image img { width: 100%; height: 100%; object-fit: cover; }
.a-la-une__texte { flex: 1 1 380px; padding: clamp(28px, 4vw, 48px); display: flex; flex-direction: column; gap: 18px; justify-content: center; }
.a-la-une__texte h3 { font-size: clamp(26px, 2.6vw, 34px); line-height: 1.15; font-weight: 500; letter-spacing: -0.035em; }
.meta { display: flex; flex-wrap: wrap; gap: 6px 16px; font-family: var(--font); font-weight: 600; font-size: 12px; color: var(--gris); }
.articles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)); gap: 40px 24px; }

/* Contact */
.contact { display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.contact__infos { flex: 1 1 360px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.contact__formulaire { flex: 1.5 1 520px; min-width: 0; border: 1px solid var(--trait); border-radius: 32px; padding: clamp(24px, 4vw, 44px); display: flex; flex-direction: column; gap: 24px; }
.info { border-radius: 24px; padding: 24px; background: var(--nuage); display: flex; gap: 18px; align-items: flex-start; }
.info__icone { flex: none; width: 48px; height: 48px; border-radius: 50%; background: #fff; color: var(--cobalt); display: grid; place-items: center; }
.info__icone svg { width: 22px; height: 22px; }
.info h3 { font-family: var(--font); font-weight: 600; font-size: 12px; font-weight: 400; color: var(--gris); margin-bottom: 8px; }
.info p { font-size: 17px; line-height: 1.5; }
.info small { display: block; font-size: 14px; color: var(--gris); }
.info--bleu { background: var(--degrade-cobalt); color: #fff; }
.info--bleu .info__icone { background: rgba(255, 255, 255, .16); color: #fff; }
.info--bleu h3, .info--bleu small { color: var(--sur-bleu); }
.champs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.champ { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.champ--large { grid-column: 1 / -1; }
.champ label { font-size: 14px; font-weight: 500; }
.champ label span { color: var(--cobalt); }
.champ input, .champ select, .champ textarea {
  width: 100%;
  font: inherit;
  font-size: 16px;
  color: var(--encre);
  background: #fff;
  border: 1px solid #8f9aab;
  border-radius: 14px;
  padding: 13px 16px;
  transition: border-color .2s ease;
}
.champ textarea { min-height: 140px; resize: vertical; }
.champ input:focus, .champ select:focus, .champ textarea:focus { outline: none; border-color: var(--cobalt); box-shadow: 0 0 0 3px var(--ciel); }
.formulaire__pied { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; }
.formulaire__pied small { font-size: 13px; color: var(--gris); }
.formulaire__merci { padding: 18px 20px; border-radius: 16px; background: var(--ciel); color: var(--nuit); font-size: 15px; }
@media (max-width: 640px) { .champs { grid-template-columns: 1fr; } }

.reseaux { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 16px; }
.reseau { border: 1px solid var(--trait); border-radius: 24px; padding: 26px; display: flex; flex-direction: column; gap: 22px; color: var(--encre); text-decoration: none; transition: border-color .2s ease; }
.reseau:hover { border-color: var(--cobalt); color: var(--encre); }
.reseau__haut { display: flex; justify-content: space-between; align-items: center; }
.reseau__haut > span { width: 48px; height: 48px; border-radius: 50%; background: var(--ciel); color: var(--cobalt); display: grid; place-items: center; }
.reseau__haut svg { width: 22px; height: 22px; }
.reseau h3 { font-size: 20px; font-weight: 500; margin-bottom: 6px; }
.reseau p { font-size: 14px; color: var(--gris); }
.reseau--bleu { background: var(--degrade-cobalt); border-color: transparent; color: #fff; }
.reseau--bleu:hover { color: #fff; }
.reseau--bleu .reseau__haut > span { background: rgba(255, 255, 255, .16); color: #fff; }
.reseau--bleu p { color: var(--sur-bleu); }

/* Appel final */
.appel { padding: var(--section) 0 40px; }
.appel__bloc {
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  background: var(--degrade-cobalt);
  color: #fff;
  padding: clamp(36px, 5vw, 72px);
  display: flex;
  flex-wrap: wrap;
  gap: 40px 64px;
  align-items: flex-end;
}
.appel__bloc > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.appel__titre { position: relative; flex: 999 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.appel__titre .eyebrow { color: var(--sur-bleu); }
.appel__titre h2 { font-weight: 500; font-size: clamp(36px, 4.6vw, 64px); line-height: 1.02; letter-spacing: -0.05em; text-wrap: balance; }
.appel__titre h2 span { color: var(--nuit-doux); }
.appel__texte { position: relative; flex: 1 1 380px; min-width: 0; display: flex; flex-direction: column; gap: 22px; }
.appel__texte p { font-size: 17px; line-height: 1.65; color: #e8ecf8; }
.appel__texte small { font-size: 14px; color: var(--sur-bleu); }

/* Pied de page */
.site-footer { --nuit-doux: #c8d2ff; position: relative; overflow: hidden; background: radial-gradient(60% 90% at 90% 100%, #1f44ff 0%, rgba(31, 68, 255, 0) 60%), #0a1478; color: #fff; }
.site-footer .container { padding-top: 72px; padding-bottom: 28px; display: flex; flex-direction: column; gap: 48px; }
.site-footer__haut { display: flex; flex-wrap: wrap; gap: 40px 64px; }
.site-footer__marque { flex: 2 1 380px; min-width: 0; display: flex; flex-direction: column; gap: 22px; }
.site-footer__marque img { align-self: flex-start; height: 40px; width: auto; }
.site-footer__marque p { max-width: 460px; font-size: 22px; line-height: 1.4; letter-spacing: -0.02em; }
.site-footer__col { flex: 1 1 160px; display: flex; flex-direction: column; gap: 12px; font-size: 15px; }
.site-footer__col--large { flex-basis: 220px; }
.site-footer__col h2 { font-family: var(--font); font-weight: 600; font-size: 13px; font-weight: 400; color: var(--nuit-doux); margin-bottom: 4px; }
.site-footer__col a { color: #fff; text-decoration: none; }
.site-footer__col a:hover { color: var(--nuit-doux); }
.site-footer__col small { color: var(--nuit-doux); font-size: 15px; }
.sociaux { display: flex; gap: 10px; }
.sociaux a { width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .35); display: grid; place-items: center; transition: background-color .2s ease; }
.sociaux a:hover { background: rgba(255, 255, 255, .12); }
.sociaux svg { width: 18px; height: 18px; }
.site-footer__nom { font-weight: 600; font-size: clamp(76px, 17vw, 250px); line-height: .78; letter-spacing: -0.065em; white-space: nowrap; margin-bottom: -8px; user-select: none; }
.site-footer__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .18); font-size: 14px; color: var(--nuit-doux); }
.site-footer__bas a { color: var(--nuit-doux); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
}

/* Ajustements de mise en page */
.espace-haut { padding-top: 64px; }
.hero__grille--etire { align-items: stretch; }
.hero__titre--colonne { flex-basis: 520px; display: flex; flex-direction: column; justify-content: center; gap: 24px; }
.panneau--hero { flex: 1 1 420px; min-width: 0; min-height: 460px; }
.panneau__lieu { position: absolute; left: 28px; top: 26px; color: var(--sur-bleu); }
.panneau__phrase { position: absolute; left: 28px; right: 28px; bottom: 26px; font-size: 26px; line-height: 1.25; letter-spacing: -0.03em; }
.espace-bas { margin-bottom: 20px; }
.h-geant { font-weight: 500; font-size: clamp(52px, 8vw, 112px); line-height: .95; letter-spacing: -0.06em; }
.hero__grille--bas { align-items: flex-end; }
.hero__grille--centre { align-items: center; }
.hero--service { padding-top: 32px; }
.etapes, .etapes-cartes { margin: 0; padding: 0; list-style: none; }
.raisons__liste.faq { display: block; }
.projets--page { padding-top: 40px; }
.info a { color: inherit; text-decoration: none; }
.info a:hover { text-decoration: underline; }
.reseau__haut > svg { width: 20px; height: 20px; color: var(--cobalt); }
.reseau--bleu .reseau__haut > svg { color: #fff; }
.reseau--bleu .eyebrow { color: var(--sur-bleu); margin-bottom: 6px; }
.a-la-une__texte .btn { align-self: flex-start; }
.a-la-une:hover { border-color: var(--cobalt); color: var(--encre); }
.avis .initiales { font-family: var(--font); font-weight: 600; font-size: 14px; color: var(--cobalt); }
[id] { scroll-margin-top: 100px; }
.section-head__titre { max-width: 680px; }

/* Bande mosaïque du héros */
.bande-mosaique { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-flow: dense; gap: 12px; margin-top: 48px; }
.carreau { position: relative; overflow: hidden; aspect-ratio: 1; border-radius: 22px; background: var(--nuage); }
.carreau > i { position: absolute; display: block; }
.carreau--double { grid-column: span 2; aspect-ratio: auto; background: radial-gradient(60% 80% at 60% 45%, #e3e9ff 0%, var(--nuage) 70%); }
.carreau--double svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.carreau--info { display: flex; flex-direction: column; justify-content: flex-end; gap: 4px; padding: clamp(12px, 1.6vw, 20px); }
.carreau--info strong { position: relative; font-size: clamp(24px, 2.6vw, 38px); font-weight: 500; line-height: 1; letter-spacing: -0.04em; }
.carreau--info span { position: relative; font-size: clamp(12px, 1vw, 14px); line-height: 1.3; }
.carreau--cobalt { background: var(--degrade-cobalt); color: #fff; }
.carreau--urgence { background: var(--urgence); color: var(--encre); }
.carreau--aide { background: var(--aide); color: #fff; }
.carreau--nuit { background: var(--nuit); color: #fff; }
.carreau--image img { width: 100%; height: 100%; object-fit: cover; }
.carreau--arche img { border-radius: 999px 999px 0 0; }
.carreau--feuille img { border-radius: 0 50% 0 50%; }
.carreau--rond { padding: 12px; background: var(--ciel); }
.carreau--rond img { border-radius: 50%; }
.f-quart { width: 100%; height: 100%; inset: 0; border-radius: 0 0 0 100%; }
.f-demi { width: 100%; height: 50%; left: 0; bottom: 0; border-radius: 999px 999px 0 0; }
.f-rond { width: 70%; height: 70%; left: 15%; top: 15%; border-radius: 50%; }
.f-petit-rond { width: 34%; height: 34%; right: 12%; top: 12%; border-radius: 50%; }
.f-triangle { width: 100%; height: 100%; inset: 0; clip-path: polygon(0 0, 100% 100%, 0 100%); }
.f-carre { width: 50%; height: 50%; right: 0; bottom: 0; }
.f-icone { position: relative; width: 28px; height: 28px; margin-bottom: auto; }
@media (max-width: 760px) {
  .bande-mosaique { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  .carreau--large { display: none; }
  .carreau--double { grid-column: span 3; aspect-ratio: 2.2; }
}

/* Logos qui défilent */
.ruban { overflow: hidden; padding: 28px 0; margin-top: 56px; border-top: 1px solid var(--trait); border-bottom: 1px solid var(--trait); }
.ruban__titre { margin-bottom: 18px; font-size: 14px; color: var(--gris); text-align: center; }
.ruban__piste { display: flex; gap: 56px; width: max-content; animation: ruban 48s linear infinite; }
.ruban:hover .ruban__piste { animation-play-state: paused; }
.ruban__piste img { height: 36px; width: auto; flex: none; }
@keyframes ruban { to { transform: translateX(-50%); } }

/* Trois promesses */
.promesses { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr)); gap: 16px; }
.promesse { display: flex; flex-direction: column; gap: 14px; min-height: 420px; padding: 32px; border: 1px solid var(--trait); border-radius: var(--rayon); background: #fff; transition: border-color .25s ease; }
.promesse:hover { border-color: var(--cobalt); }
.promesse__formes { position: relative; width: 112px; height: 112px; margin-bottom: 18px; }
.promesse__formes i { position: absolute; display: block; }
.promesse__nom { font-family: var(--font); font-weight: 600; font-size: 13px; }
.promesse h3 { font-size: 26px; font-weight: 500; letter-spacing: -0.03em; line-height: 1.15; }
.promesse p { font-size: 15px; line-height: 1.6; color: var(--texte); }
.promesse__preuve { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--trait); font-size: 14px; font-weight: 500; }
.promesse--urgence .promesse__nom, .promesse--urgence .promesse__preuve { color: var(--urgence-texte); }
.promesse--aide .promesse__nom, .promesse--aide .promesse__preuve { color: var(--aide); }
.promesse--confiance .promesse__nom, .promesse--confiance .promesse__preuve { color: var(--cobalt); }

/* Urgence et frise */
.fond-nuage { background: var(--nuage); padding-bottom: var(--section); margin-top: var(--section); }
.urgence { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px 64px; align-items: end; }
@media (max-width: 900px) { .urgence { grid-template-columns: 1fr; } }
.frise { position: relative; margin-top: 56px; padding-top: 40px; }
.frise::before { content: ""; position: absolute; left: 0; right: 0; top: 11px; height: 2px; background: var(--trait); }
.frise__jauge { position: absolute; left: 0; top: 11px; height: 2px; width: 100%; background: linear-gradient(90deg, var(--cobalt), var(--urgence)); transform-origin: 0 50%; }
.frise__liste { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.frise li { position: relative; display: flex; flex-direction: column; gap: 10px; }
.frise li::before { content: ""; position: absolute; top: -40px; left: 0; width: 24px; height: 24px; border-radius: 0 50% 50% 50%; background: #fff; border: 2px solid var(--cobalt); }
.frise li:last-child::before { background: var(--urgence); border-color: var(--urgence); }
.frise small { font-family: var(--font); font-weight: 600; font-size: 12px; color: var(--cobalt); }
.frise h3 { font-size: 21px; font-weight: 500; letter-spacing: -0.02em; }
.frise p { font-size: 14px; line-height: 1.6; color: var(--texte); }
@media (max-width: 800px) {
  .frise { padding-top: 0; padding-left: 40px; }
  .frise__liste { grid-template-columns: 1fr; gap: 28px; }
  .frise::before, .frise__jauge { left: 11px; top: 0; bottom: 0; width: 2px; height: auto; }
  .frise__jauge { transform-origin: 50% 0; background: linear-gradient(var(--cobalt), var(--urgence)); }
  .frise li::before { top: 0; left: -40px; }
}

/* Galerie horizontale */
.galerie { overflow: hidden; }
.galerie__piste { display: flex; gap: 20px; width: max-content; padding: 0 max(var(--gouttiere), calc((100vw - var(--largeur)) / 2 + var(--gouttiere))); }
@media (max-width: 900px), (prefers-reduced-motion: reduce) {
  .galerie { overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .galerie::-webkit-scrollbar { display: none; }
  .galerie .projet { scroll-snap-align: start; }
}

/* Aide */
.aide { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 32px 64px; align-items: start; }
.aide__carte { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 18px; padding: 30px; border-radius: var(--rayon); background: var(--aide); color: #fff; }
.aide__carte::after { content: ""; position: absolute; right: -36px; top: -36px; width: 130px; height: 130px; border-radius: 50%; background: var(--aide-vif); }
.aide__carte .eyebrow { position: relative; color: #dce3ff; }
.aide__carte h3 { position: relative; font-size: 26px; font-weight: 500; letter-spacing: -0.03em; }
.aide__carte p { position: relative; font-size: 15px; color: #dce3ff; }
.aide__liens { position: relative; display: grid; gap: 10px; }
.aide__liens a { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 56px; padding: 0 18px; border-radius: 14px; background: rgba(255, 255, 255, .12); color: #fff; text-decoration: none; transition: background-color .2s ease; }
.aide__liens a:hover { background: rgba(255, 255, 255, .22); color: #fff; }
.aide__liens small { color: #dce3ff; }
@media (max-width: 900px) { .aide { grid-template-columns: 1fr; } }
.faq { display: flex; flex-direction: column; gap: 10px; border-top: 0; }
.faq details { border: 1px solid var(--trait); border-radius: 18px; padding: 0 22px; background: #fff; transition: border-color .2s ease; }
.faq details[open] { border-color: var(--cobalt); }
.faq summary::after { border-radius: 0 50% 50% 50%; }
.raisons__liste.faq { display: flex; }

.bouton-aide { position: fixed; right: max(16px, env(safe-area-inset-right, 0px)); bottom: max(16px, env(safe-area-inset-bottom, 0px)); z-index: 60; transition: opacity .3s ease, visibility .3s; }
.bouton-aide.cache { opacity: 0; visibility: hidden; }
.bouton-aide__ouvrir { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 18px 0 6px; border: 0; border-radius: 26px; background: var(--aide); color: #fff; font-weight: 500; cursor: pointer; }
.bouton-aide__ouvrir i { width: 40px; height: 40px; border-radius: 50%; background: var(--aide-vif); color: var(--encre); display: grid; place-items: center; }
.bouton-aide__ouvrir svg { width: 20px; height: 20px; }
.bouton-aide__panneau { position: absolute; right: 0; bottom: 64px; width: min(320px, calc(100vw - 32px)); padding: 20px; border-radius: 20px; background: #fff; border: 1px solid var(--trait); display: flex; flex-direction: column; gap: 12px; }
.bouton-aide__panneau[hidden] { display: none; }
.bouton-aide__panneau p { font-size: 18px; font-weight: 500; letter-spacing: -0.02em; }
.bouton-aide__panneau a { display: flex; justify-content: space-between; min-height: 48px; align-items: center; padding: 0 14px; border-radius: 12px; background: var(--aide-clair); color: var(--encre); text-decoration: none; font-weight: 500; }
.bouton-aide__panneau small { color: var(--gris); }
@media (max-width: 640px) { .bouton-aide__ouvrir span { display: none; } .bouton-aide__ouvrir { padding: 0 6px; } }

/* Frise de formes du pied */

/* Formes sur les éléments communs */
.raison__num { border-radius: 0 50% 50% 50%; }
.pole__icone { border-radius: 0 50% 50% 50%; }
.tuile__haut > span { border-radius: 0 50% 50% 50%; transition: border-radius .35s ease; }
.tuile:hover .tuile__haut > span { border-radius: 50%; }
.etape__ligne b { border-radius: 0 50% 50% 50%; }

[id] { scroll-margin-top: 100px; }
@media (prefers-reduced-motion: reduce) { .ruban__piste { animation: none; } }

/* Textes importants dans le style du nom du pied de page */
.h-display, .h-geant, .h-section, .appel__titre h2, .site-footer__nom { font-family: var(--titre); font-weight: 600; letter-spacing: -0.06em; }
.h-display { line-height: .98; }
.carreau--info strong, .bande-chiffres__case strong, .chiffre-court strong, .bande-trois strong, .offre__prix { font-family: var(--titre); font-weight: 600; letter-spacing: -0.06em; }

/* Titres de cartes et descriptions en Montserrat */
.h-card, .promesse h3, .rangee__tete h3, .frise h3, .aide__carte h3, .clients__tete h2, .pilier h3, .raison h3, .etape h3, .etape-carte h3, .offre__tete h3, .carte h3, .inclus h3, .reseau h3, .projet__bas h3, .article h3, .a-la-une__texte h2, .raisons-nuit__grille h3, .tuile b, .sur-mesure h3, .mega__appel strong {
  font-family: var(--font);
  font-weight: 600;
  letter-spacing: -0.02em;
}
.h-card, .promesse h3 { font-size: clamp(21px, 1.9vw, 24px); line-height: 1.25; }
.promesse p, .pilier p, .raison p, .etape p, .etape-carte p, .carte p, .inclus p, .reseau p, .projet__bas p, .article p, .frise p, .tuile small, .pole__liste a small, .offre__tete p, .aide__carte p, .lead { letter-spacing: -0.005em; }
.lead { font-size: 16px; line-height: 1.7; }
.site-footer__marque p { font-family: var(--font); font-weight: 500; font-size: 20px; letter-spacing: -0.02em; }
.offre__tete h3 { flex-wrap: wrap; }

/* Sélecteur de langue */
.langues { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--trait); border-radius: 12px; background: #fff; font-family: var(--font); }
.langues a { display: grid; place-items: center; min-width: 38px; height: 34px; padding: 0 8px; border-radius: 9px; font-size: 13px; font-weight: 600; color: var(--gris); text-decoration: none; transition: border-radius .35s cubic-bezier(.6, 0, .2, 1), background-color .2s ease, color .2s ease; }
.langues a:hover { background: var(--nuage); color: var(--encre); border-radius: 9px 17px 17px 9px; }
.langues a[aria-current="true"] { background: var(--cobalt); color: #fff; border-radius: 9px 17px 17px 9px; }
.langues a[aria-current="true"]:hover { border-radius: 17px; }
.nav__langues { display: none; }
@media (max-width: 1080px) {
  .nav__langues { display: inline-flex; align-self: flex-start; margin-top: 24px; }
  .nav__langues a { min-width: 52px; height: 44px; font-size: 15px; }
}

/* Flou de l en-tête sur un calque, pour que le menu mobile occupe tout l écran */
.site-header { isolation: isolate; background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
.site-header::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(255, 255, 255, .92); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }

@media (max-width: 1080px) { .nav .nav__mobile-cta { display: inline-flex !important; } }
@media (max-width: 1080px) { .nav .nav__langues { display: inline-flex; } }

/* Soyons honnêtes, en bleu nuit */
.urgence-nuit {
  position: relative;
  overflow: hidden;
  margin-top: var(--section);
  padding: clamp(72px, 9vw, 112px) 0;
  background: radial-gradient(60% 70% at 85% 10%, rgba(31, 68, 255, .45), transparent 60%), radial-gradient(40% 50% at 0% 100%, rgba(101, 132, 255, .22), transparent 70%), var(--nuit);
  color: #fff;
}
.urgence-nuit::after { content: ""; position: absolute; right: -90px; bottom: -90px; width: 260px; height: 260px; border-radius: 100% 0 0 0; background: rgba(255, 255, 255, .05); }
.urgence-nuit .container { position: relative; z-index: 1; }
.urgence-nuit .eyebrow { color: var(--urgence); }
.urgence-nuit .accent { color: var(--urgence); }
.urgence-nuit__haut { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 32px 64px; align-items: start; }
.urgence-nuit__titre { display: flex; flex-direction: column; gap: 16px; }
.urgence-nuit__direct { display: flex; flex-direction: column; gap: 18px; padding: 28px; border-radius: var(--rayon); background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); }
.urgence-nuit__direct > p { font-size: 16px; line-height: 1.7; color: #c8d2ff; }
.urgence-nuit__note { font-size: 14px; color: #c8d2ff; }
@media (max-width: 900px) { .urgence-nuit__haut { grid-template-columns: 1fr; } }

.frise--cartes { margin-top: 64px; padding-top: 0; }
.frise--cartes::before, .frise--cartes .frise__jauge { top: 54px; }
.frise--cartes::before { background: rgba(255, 255, 255, .14); }
.frise--cartes .frise__liste { gap: 20px; }
.frise--cartes li { position: relative; z-index: 1; gap: 10px; padding: 26px; border-radius: var(--rayon); background: #121f8f; border: 1px solid rgba(255, 255, 255, .1); }
.frise--cartes li::before { display: none; }
.frise--cartes small { font-family: var(--font); font-weight: 600; font-size: 13px; color: var(--nuit-doux); }
.frise--cartes h3 { color: #fff; font-size: 20px; }
.frise--cartes p { color: #c8d2ff; }
.etape-forme { display: block; width: 56px; height: 56px; margin-bottom: 8px; }
.etape-forme--1 { background: var(--aide-vif); border-radius: 0 100% 0 0; }
.etape-forme--2 { background: var(--cobalt); border-radius: 50%; }
.etape-forme--3 { background: #6584ff; border-radius: 100% 0 0 0; }
.etape-forme--4 { background: #fff; border-radius: 0 50% 50% 50%; }
@media (max-width: 800px) {
  .frise--cartes { padding-left: 0; }
  .frise--cartes::before, .frise--cartes .frise__jauge { display: none; }
}

/* Avis en carrousel */
.temoignages { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 40px 64px; align-items: start; }
.temoignages__tete { position: sticky; top: 120px; display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
.temoignages__note { display: flex; align-items: baseline; gap: 4px; }
.temoignages__note strong { font-family: var(--titre); font-weight: 600; font-size: clamp(72px, 8vw, 112px); line-height: .9; letter-spacing: -0.06em; color: var(--cobalt); }
.temoignages__note span { font-family: var(--titre); font-weight: 600; font-size: 32px; letter-spacing: -0.04em; color: var(--gris); }
.temoignages__scene { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.temoignages__cartes { display: grid; gap: 16px; }
.temoignage {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
  min-height: 360px;
  margin: 0;
  padding: clamp(28px, 4vw, 48px);
  border-radius: 32px;
  background: var(--degrade-cobalt);
  color: #fff;
}
.temoignage::before { content: ""; position: absolute; right: 32px; top: 32px; width: 72px; height: 36px; background: radial-gradient(circle at 100% 100%, var(--nuit-doux) 0 70%, transparent 71%) left / 50% 100% no-repeat, radial-gradient(circle at 100% 100%, #fff 0 70%, transparent 71%) right / 50% 100% no-repeat; }
.temoignage::after { content: ""; position: absolute; right: -80px; bottom: -120px; width: 280px; height: 280px; border-radius: 50%; background: rgba(255, 255, 255, .08); }
.temoignage blockquote { position: relative; z-index: 1; margin: 0; max-width: 34ch; font-size: clamp(20px, 2.2vw, 28px); line-height: 1.4; font-weight: 500; letter-spacing: -0.02em; }
.temoignage figcaption { position: relative; z-index: 1; display: flex; align-items: center; gap: 14px; font-size: 15px; }
.temoignage figcaption > span:first-child { flex: none; width: 56px; height: 56px; border-radius: 0 50% 50% 50%; background: #fff; display: grid; place-items: center; overflow: hidden; color: var(--cobalt); font-weight: 700; font-size: 14px; }
.temoignage figcaption img { max-width: 40px; max-height: 40px; object-fit: contain; }
.temoignage figcaption b { display: block; font-weight: 600; }
.temoignage figcaption small { font-size: 14px; color: #dce3ff; }
.temoignages__cartes.js .temoignage { grid-area: 1 / 1; opacity: 0; visibility: hidden; transform: translateX(24px); transition: opacity .5s ease, transform .5s ease, visibility .5s; }
.temoignages__cartes.js .temoignage.est-actif { opacity: 1; visibility: visible; transform: none; }
.temoignages__pied { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; }
.temoignages__clients { display: flex; flex-wrap: wrap; gap: 8px; }
.temoignages__clients button { width: 48px; height: 48px; padding: 6px; border: 1px solid var(--trait); border-radius: 0 50% 50% 50%; background: #fff; display: grid; place-items: center; cursor: pointer; font-family: var(--font); font-size: 12px; font-weight: 700; color: var(--cobalt); transition: border-color .2s ease, border-radius .35s ease; }
.temoignages__clients button img { max-width: 32px; max-height: 32px; object-fit: contain; }
.temoignages__clients button:hover { border-color: var(--cobalt); }
.temoignages__clients button[aria-pressed="true"] { border: 2px solid var(--cobalt); border-radius: 50%; }
.temoignages__fleches { display: flex; gap: 8px; }
.temoignages__fleches .rond-fleche { width: 52px; height: 52px; border: 0; cursor: pointer; }
.temoignages__fleches .rond-fleche svg { transform: rotate(45deg); }
.temoignages__fleches .rond-fleche--retour svg { transform: rotate(-135deg); }
.temoignages__fleches .rond-fleche:hover { border-radius: 26px; background: var(--cobalt); color: #fff; }
@media (max-width: 900px) {
  .temoignages { grid-template-columns: 1fr; }
  .temoignages__tete { position: static; }
}

/* Prêt à démarrer : colonnes alignées en haut */
.appel__bloc { align-items: flex-start; }
.temoignages__cartes { overflow: hidden; border-radius: 32px; }
.temoignage::before { left: clamp(28px, 4vw, 48px); right: auto; top: clamp(28px, 4vw, 44px); }
.temoignage blockquote { margin-top: 52px; }

/* Menu Nos Services */
@media (min-width: 1081px) {
  .site-header__barre { position: relative; }
  .nav__menu { position: static; }
  .mega {
    top: calc(100% - 4px);
    left: 0;
    right: 0;
    width: auto;
    transform: none;
    padding: 20px;
    gap: 8px;
    border-radius: 24px;
    grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.15fr);
    clip-path: inset(0 0 100% 0 round 24px);
    transition: clip-path .4s cubic-bezier(.6, 0, .2, 1), opacity .2s ease, visibility .4s;
  }
  .mega::before { content: ""; position: absolute; left: 0; right: 0; top: -24px; height: 24px; }
  .nav__menu:hover .mega, .nav__menu:focus-within .mega, .nav__menu.ouvert .mega { transform: none; clip-path: inset(0 0 0 0 round 24px); }
}
.mega__colonne { padding: 10px; border-radius: 18px; }
.mega__titre { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; padding: 4px 10px; font-family: var(--font); font-size: 13px; font-weight: 700; color: var(--encre); }
.mega__titre::before { content: ""; flex: none; width: 16px; height: 16px; }
.mega__colonne:nth-child(1) .mega__titre::before { background: var(--cobalt); border-radius: 0 100% 0 0; }
.mega__colonne:nth-child(2) .mega__titre::before { background: var(--aide-vif); border-radius: 50%; }
.mega__colonne:nth-child(3) .mega__titre::before { background: var(--cobalt-vif); border-radius: 100% 100% 0 0; }
.mega__colonne a { position: relative; margin: 0; padding: 12px 14px; border-radius: 14px; transition: background-color .2s ease; }
.mega__colonne a:hover { background: var(--nuage); }
.mega__colonne a span { font-size: 15px; font-weight: 600; color: var(--encre); }
.mega__colonne a small { font-size: 13px; line-height: 1.45; color: var(--gris); }
.mega__colonne a::after { content: ""; position: absolute; right: 12px; top: 14px; width: 8px; height: 8px; border-radius: 0 100% 0 0; background: var(--cobalt); opacity: 0; transition: opacity .2s ease, border-radius .3s ease; }
.mega__colonne a:hover::after { opacity: 1; border-radius: 50%; }
.mega__appel { position: relative; overflow: hidden; border-radius: 20px; }
.mega__appel::after { content: ""; position: absolute; right: -36px; bottom: -36px; width: 120px; height: 120px; border-radius: 100% 0 0 0; background: var(--aide-vif); }
.mega__appel > * { position: relative; z-index: 1; }

/* Listes déroulantes du formulaire */
.champ select {
  -webkit-appearance: none;
  appearance: none;
  padding-right: 56px;
  background: #fff url("../img/chevron.svg") no-repeat right 8px center / 36px 36px;
  text-overflow: ellipsis;
  cursor: pointer;
}
.champ select:invalid, .champ select option[value=""] { color: var(--gris); }
.champ select option { color: var(--encre); }
@supports (appearance: base-select) {
  .champ select, .champ select::picker(select) { appearance: base-select; }
  .champ select { display: flex; align-items: center; }
  .champ select::picker-icon { display: none; }
  .champ select::picker(select) { margin-top: 6px; padding: 8px; border: 1px solid var(--trait); border-radius: 18px; background: #fff; }
  .champ select option { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 14px; border-radius: 12px; font-family: var(--font); font-size: 15px; font-weight: 500; transition: background-color .15s ease; }
  .champ select option:hover, .champ select option:focus-visible { background: var(--nuage); }
  .champ select option:checked { background: var(--ciel); color: var(--cobalt); }
  .champ select option::checkmark { content: ""; order: 1; margin-left: auto; width: 12px; height: 12px; border-radius: 0 100% 0 0; background: var(--cobalt); }
  .champ select option[disabled] { display: none; }
}

.site-footer .container { padding-bottom: 96px; }

/* Trait dessiné du titre */
.trait-main { position: relative; display: inline-block; }
.trait-main svg { position: absolute; left: -4%; bottom: -0.26em; width: 108%; height: .32em; overflow: visible; pointer-events: none; }
.trait-main path { fill: none; stroke: var(--urgence); stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; animation: trait 1.1s cubic-bezier(.6, 0, .2, 1) .7s forwards; }
.trait-main path { stroke-dasharray: 600; stroke-dashoffset: 600; }
@keyframes trait { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) { .trait-main path { animation: none; stroke-dashoffset: 0; } }

/* Pôles en volets */
.volets { --ferme: 128px; --ecart: 12px; container-type: inline-size; display: flex; gap: var(--ecart); height: 540px; }
.volet { position: relative; overflow: hidden; flex: 0 0 var(--ferme); min-width: 0; border-radius: 32px; color: #fff; transition: flex-grow .7s cubic-bezier(.6, 0, .2, 1), flex-basis .7s cubic-bezier(.6, 0, .2, 1); }
.volet.est-ouvert { flex: 1 1 0; }
.volet--design { background: radial-gradient(70% 90% at 100% 0%, #6584ff 0%, rgba(101, 132, 255, 0) 60%), var(--cobalt); }
.volet--web { background: radial-gradient(70% 90% at 100% 0%, rgba(31, 68, 255, .55) 0%, rgba(31, 68, 255, 0) 60%), var(--nuit); }
.volet--digital { background: var(--ciel); color: var(--encre); }

.volet__onglet { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; padding: 26px 0 30px 30px; border: 0; background: none; color: inherit; font: inherit; text-align: left; cursor: pointer; transition: opacity .3s ease, visibility .3s; }
.volet__onglet > span { display: flex; flex-direction: column; gap: 14px; }
.volet__onglet small { font-size: 13px; font-weight: 600; opacity: .8; }
.volet__onglet b { writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; font-family: var(--titre); font-weight: 600; font-size: 44px; line-height: 1; letter-spacing: -0.05em; }
.volet__forme { width: 44px; height: 44px; background: #fff; }
.volet--design .volet__forme { border-radius: 0 100% 0 0; }
.volet--web .volet__forme { border-radius: 50%; background: var(--cobalt); }
.volet--digital .volet__forme { border-radius: 100% 100% 0 0; background: var(--cobalt); }
.volet.est-ouvert .volet__onglet { opacity: 0; visibility: hidden; }

.volet__contenu { position: absolute; top: 0; left: 0; bottom: 0; width: calc(100cqw - 2 * var(--ferme) - 2 * var(--ecart)); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 28px; padding: 36px; opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s; }
.volet.est-ouvert .volet__contenu { opacity: 1; visibility: visible; transition: opacity .45s ease .35s, visibility 0s .35s; }
.volet__texte { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.volet__texte h3 { font-family: var(--titre); font-weight: 600; font-size: clamp(34px, 3.6vw, 48px); line-height: 1; letter-spacing: -0.06em; }
.volet__texte > p { max-width: 40ch; font-size: 16px; line-height: 1.6; color: var(--sur-bleu); }
.volet--digital .volet__texte > p { color: var(--texte); }
.volet__services { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; margin-top: auto; padding: 8px; border-radius: 24px; background: #fff; }
.volet__services a { display: flex; flex-direction: column; gap: 2px; min-height: 44px; padding: 12px 14px; border-radius: 16px; color: var(--encre); text-decoration: none; transition: background-color .2s ease; }
.volet__services a:hover { background: var(--nuage); }
.volet__services b { font-size: 15px; font-weight: 600; }
.volet__services small { font-size: 13px; line-height: 1.4; color: var(--gris); }
.volet__visuel { min-width: 0; overflow: hidden; border-radius: 160px 24px 24px 24px; background: rgba(255, 255, 255, .1); }
.volet__visuel img { width: 100%; height: 100%; object-fit: cover; }

.volet__coin { position: absolute; right: 0; bottom: 0; z-index: 3; padding: 10px 0 0 10px; border-radius: 28px 0 0 0; background: var(--blanc); opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s; }
.volet__coin::before, .volet__coin::after { content: ""; position: absolute; width: 28px; height: 28px; background: radial-gradient(circle at 0 0, transparent 27.5px, var(--blanc) 28px); }
.volet__coin::before { right: 0; bottom: 100%; }
.volet__coin::after { right: 100%; bottom: 0; }
.volet.est-ouvert .volet__coin { opacity: 1; visibility: visible; transition: opacity .45s ease .45s, visibility 0s .45s; }
.volet__fleche { width: 64px; height: 64px; border-radius: 50%; background: var(--urgence); color: var(--encre); display: grid; place-items: center; transition: border-radius .35s ease; }
.volet__fleche svg { width: 22px; height: 22px; transition: transform .35s ease; }
.volet__fleche:hover { border-radius: 20px 32px 32px 20px; }
.volet__fleche:hover svg { transform: rotate(45deg); }

@media (max-width: 900px) {
  .volets { flex-direction: column; height: auto; }
  .volet { flex: none !important; }
  .volet__onglet { display: none; }
  .volet__contenu { position: relative; width: auto; grid-template-columns: 1fr; padding: 24px 24px 96px; opacity: 1; visibility: visible; }
  .volet__visuel { height: 220px; border-radius: 110px 20px 20px 20px; }
  .volet__coin { opacity: 1; visibility: visible; }
}
@media (max-width: 520px) {
  .volet__services { grid-template-columns: 1fr; }
}

/* Cartes à encoche (réalisations et articles) */
.projet { position: relative; display: flex; flex-direction: column; padding: 10px; border: 1px solid var(--trait); border-radius: 32px; background: #fff; color: var(--encre); text-decoration: none; transition: border-color .3s ease; }
.projet:hover { border-color: var(--trait-fort); }
.projet[hidden] { display: none; }
.projet__image { overflow: hidden; border-radius: 24px; aspect-ratio: 16 / 10; background: var(--nuage); }
.projet__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2, .7, .2, 1); }
.projet:hover .projet__image img { transform: scale(1.05); }
.projet__corps { position: relative; flex: 1; display: flex; flex-direction: column; gap: 10px; margin-top: -36px; padding: 22px 14px 8px; border-radius: 24px 0 0 0; background: #fff; }
.projet__onglet { position: absolute; right: 0; bottom: 100%; padding: 8px 8px 0; border-radius: 26px 26px 0 0; background: #fff; }
.projet__onglet::before { content: ""; position: absolute; right: 100%; bottom: 0; width: 24px; height: 24px; background: radial-gradient(circle at 0 0, transparent 23.5px, #fff 24px); }
.projet__onglet .rond-fleche { width: 48px; height: 48px; border-radius: 50%; }
.projet:hover .projet__onglet .rond-fleche { border-radius: 16px 24px 24px 16px; background: var(--urgence); color: var(--encre); }
.projet:hover .projet__onglet .rond-fleche svg { transform: rotate(45deg); }
.projet__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 13px; font-weight: 600; color: var(--gris); }
.projet__meta span:first-child { display: inline-flex; align-items: center; gap: 8px; color: var(--cobalt); }
.projet__meta span:first-child::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--cobalt); }
.projet__meta span + span::before { content: ""; display: inline-block; width: 4px; height: 4px; margin-right: 10px; border-radius: 50%; background: var(--trait-fort); vertical-align: middle; }
.projet__corps h3 { font-family: var(--font); font-size: 18px; font-weight: 600; line-height: 1.35; letter-spacing: -0.01em; }
.projet__texte { margin-top: auto; padding-top: 14px; border-top: 1px solid var(--trait); font-size: 14px; line-height: 1.55; color: var(--gris); }
.projet--article .projet__texte { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.galerie .projet { width: min(420px, 80vw); }
.projet--article .projet__meta { gap: 4px 8px; font-size: 12px; }
.projet--article .projet__meta span + span::before { margin-right: 8px; }
.projet--article .projet__meta span:first-child::before { display: none; }

/* Héros bleus des pages internes */
.hero-bleu { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; min-height: max(640px, min(100svh, 960px)); padding: 120px 0 clamp(36px, 5vw, 64px); color: #fff; background: radial-gradient(55% 65% at 62% 38%, #3b5bff 0%, rgba(59, 91, 255, 0) 70%), linear-gradient(180deg, #1533d6 0%, #1f44ff 62%, #3b5bff 100%); }
.hero-bleu__scene { position: absolute; inset: 0; }
.hero-bleu__scene svg { width: 100%; height: 100%; }
.hero-bleu__fleur { transform-box: view-box; transform-origin: 860px 1010px; animation: balance 10s ease-in-out 2s infinite alternate; }
.petale { transform-box: view-box; transform-origin: 860px 1010px; transform: rotate(var(--a)); animation: eventail 1.6s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(var(--i) * 70ms + 150ms); }
.hero-bleu__dome { transform-box: view-box; transform-origin: 860px 1070px; animation: dome 1.2s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes eventail { from { transform: rotate(0deg) scale(.35); opacity: 0; } }
@keyframes dome { from { transform: scale(.6); opacity: 0; } }
@keyframes balance { from { transform: rotate(0deg); } to { transform: rotate(4deg); } }
@media (prefers-reduced-motion: reduce) { .petale, .hero-bleu__dome, .hero-bleu__fleur { animation: none; } }
.hero-bleu__haut { position: absolute; top: 108px; left: 0; right: 0; z-index: 1; }
.hero-bleu__bas { position: relative; z-index: 1; width: 100%; display: grid; grid-template-columns: minmax(220px, 300px) minmax(0, 1fr); align-items: end; gap: 32px 64px; }
.hero-bleu__intro { display: flex; align-items: center; gap: 16px; padding-bottom: 8px; }
.hero-bleu__intro p { font-size: 15px; line-height: 1.5; color: #fff; }
.hero-bleu__descendre { flex: none; width: 48px; height: 48px; border: 1.5px solid rgba(255, 255, 255, .6); border-radius: 50%; display: grid; place-items: center; color: #fff; transition: background-color .25s ease, border-color .25s ease, color .25s ease, border-radius .35s ease; }
.hero-bleu__descendre svg { width: 18px; height: 18px; transform: rotate(135deg); }
.hero-bleu__descendre:hover { border-color: var(--urgence); border-radius: 16px 24px 24px 16px; background: var(--urgence); color: var(--encre); }
.hero-bleu__titre { justify-self: start; font-family: var(--titre); font-weight: 600; font-size: clamp(40px, min(13vw, 8.4vw + 12px), 132px); line-height: .92; letter-spacing: -0.06em; }
.ariane--blanc, .ariane--blanc a { padding-top: 0; color: rgba(255, 255, 255, .78); }
.ariane--blanc a:hover, .ariane--blanc [aria-current="page"] { color: #fff; }
.hero--intro { scroll-margin-top: 84px; }
#projets { scroll-margin-top: 150px; }
@media (max-width: 760px) {
  .hero-bleu { min-height: max(560px, min(92svh, 760px)); }
  .hero-bleu__bas { grid-template-columns: 1fr; }
  .hero-bleu__titre { order: -1; font-size: clamp(40px, 13vw, 72px); }
}

/* En-tête posé sur le bleu */
.logo__blanc { display: none; }
.page-bleue .site-header { position: fixed; left: 0; right: 0; border-bottom-color: transparent; transition: border-color .3s ease; }
.page-bleue .site-header::before { transition: opacity .3s ease; }
.page-bleue .site-header:not(.est-defile)::before { opacity: 0; }
.page-bleue .site-header.est-defile { border-bottom-color: var(--trait); }
.page-bleue .site-header:not(.est-defile) .logo__encre { display: none; }
.page-bleue .site-header:not(.est-defile) .logo__blanc { display: block; }
.page-bleue .site-header:not(.est-defile) .langues { border-color: rgba(255, 255, 255, .28); background: rgba(255, 255, 255, .1); }
.page-bleue .site-header:not(.est-defile) .langues a { color: #fff; }
.page-bleue .site-header:not(.est-defile) .langues a:hover { background: rgba(255, 255, 255, .16); }
.page-bleue .site-header:not(.est-defile) .langues a[aria-current="true"] { background: #fff; color: var(--cobalt); }
.page-bleue .site-header:not(.est-defile) .site-header__barre > .btn .btn__texte { background: #fff; color: var(--cobalt); }
.page-bleue .site-header:not(.est-defile) .nav-toggle { border-color: rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .12); color: #fff; }
@media (min-width: 1081px) {
  .page-bleue .site-header:not(.est-defile) .nav > a, .page-bleue .site-header:not(.est-defile) .nav__declencheur { color: #fff; }
  .page-bleue .site-header:not(.est-defile) .nav > a:hover, .page-bleue .site-header:not(.est-defile) .nav__declencheur:hover { background: rgba(255, 255, 255, .12); color: #fff; }
  .page-bleue .site-header:not(.est-defile) .nav [aria-current="page"] { background: rgba(255, 255, 255, .16); color: #fff; }
}

/* Corrections de la revue */
.lien-fleche--blanc { align-self: center; color: #fff; }
.lien-fleche--blanc:hover { color: var(--urgence); }
.tuile { justify-content: flex-start; }
.carreau--arche img { object-position: 50% 70%; }
.btn--sombre .btn__rond { background: var(--urgence); color: var(--encre); }
.hero--intro .hero__aside { flex: 1 1 480px; }
.hero--intro .hero__grille--etire .hero__titre--colonne { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 24px 64px; align-items: start; }
.hero--intro .hero__grille--etire .hero__titre--colonne > h2 { grid-row: span 2; }
@media (max-width: 900px) { .hero--intro .hero__grille--etire .hero__titre--colonne { grid-template-columns: 1fr; } .hero--intro .hero__grille--etire .hero__titre--colonne > h2 { grid-row: auto; } }
@media (max-width: 1080px) { .nav > a.nav__mobile-cta { width: auto; padding: 0; border-bottom: 0; font-size: 16px; justify-content: flex-start; align-self: flex-start; } }

/* Scènes 3D des héros */
.scene-flotte { transform-box: view-box; transform-origin: 50% 50%; animation: flotte 12s ease-in-out 2s infinite alternate; }
.piece { transform-box: fill-box; transform-origin: 50% 100%; animation: piece 1.2s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(var(--i) * 90ms + 150ms); }
.trace-hb { stroke-dasharray: 1; stroke-dashoffset: 1; animation: trace-hb 1.8s cubic-bezier(.6, 0, .2, 1) forwards; animation-delay: calc(var(--i, 0) * 140ms + 200ms); }
.onde .trace-hb { animation-delay: calc(var(--i) * 140ms + 200ms); }
@keyframes piece { from { transform: scale(.2); opacity: 0; } }
@keyframes trace-hb { to { stroke-dashoffset: 0; } }
@keyframes flotte { to { transform: translateX(-18px) rotate(1deg); } }
@media (prefers-reduced-motion: reduce) {
  .scene-flotte, .piece { animation: none; }
  .trace-hb { animation: none; stroke-dashoffset: 0; }
}

/* Héros bleu de l'accueil */
.hero-bleu--accueil .hero-bleu__bas { grid-template-columns: minmax(0, 1.55fr) minmax(280px, 1fr); }
.hero-bleu--accueil .hero-bleu__titre { font-size: clamp(40px, 6.2vw, 96px); line-height: .95; }
.hero-bleu--accueil .hero-bleu__titre .accent { color: var(--nuit-doux); }
.hero-bleu__aside { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding-bottom: 8px; }
.hero-bleu__aside .lead { font-size: 16px; color: #e8ecf8; }
.hero-bleu__aside .note { background: rgba(255, 255, 255, .12); color: #fff; }
.hero-bleu__aside .note b { background: #fff; color: var(--cobalt); }
.bande-accueil { padding-top: 24px; }
.bande-accueil .bande-mosaique { margin-top: 0; }
@media (max-width: 900px) {
  .hero-bleu--accueil .hero-bleu__bas { grid-template-columns: 1fr; }
  .hero-bleu--accueil .hero-bleu__titre { order: -1; font-size: clamp(36px, 10vw, 64px); }
}
@media (max-width: 760px) {
  .hero-bleu--accueil { padding-top: 380px; }
  .hero-bleu--accueil .hero-bleu__scene { inset: 84px 0 auto; height: 290px; }
}
.hero-bleu:not(.hero-bleu--accueil) { min-height: clamp(520px, 70svh, 660px); }
@media (max-width: 760px) { .hero-bleu:not(.hero-bleu--accueil) { min-height: clamp(460px, 64svh, 560px); } }
.hero-bleu:not(.hero-bleu--accueil) .hero-bleu__scene svg { overflow: visible; transform: scale(.74); transform-origin: 60% 100%; }
@media (max-width: 760px) { .hero-bleu:not(.hero-bleu--accueil) .hero-bleu__scene svg { transform: scale(.6); transform-origin: 50% 100%; } }
.hero-bleu--accueil { min-height: clamp(580px, 76svh, 720px); }
@media (max-width: 760px) {
  .hero-bleu--accueil { min-height: 0; padding-top: 320px; }
  .hero-bleu--accueil .hero-bleu__scene { height: 230px; }
}
.hero-bleu__titre .accent { color: var(--nuit-doux); }
.hero-bleu--long .hero-bleu__titre { font-size: clamp(36px, 5.2vw, 78px); line-height: .98; }
.intro-accueil { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px 48px; padding: 16px 0 32px; }
.intro-accueil .lead { flex: 1 1 420px; max-width: 640px; }
.intro-accueil .lien-fleche { align-self: center; }
.bande-accueil { scroll-margin-top: 84px; }
@media (max-width: 760px) { .hero-bleu--long .hero-bleu__titre { font-size: clamp(34px, 9.6vw, 52px); } }
@media (max-width: 760px) {
  .hero-bleu, .hero-bleu:not(.hero-bleu--accueil) { min-height: 0; justify-content: flex-start; padding: 108px 0 0; }
  .hero-bleu__haut { position: relative; top: 0; order: 0; margin-bottom: 16px; }
  .hero-bleu__bas { order: 1; }
  .hero-bleu__scene { position: relative; inset: auto; order: 2; height: 230px; margin-top: 28px; }
  .hero-bleu .hero-bleu__scene svg, .hero-bleu:not(.hero-bleu--accueil) .hero-bleu__scene svg { transform: none; }
}
@media (min-width: 761px) {
  .hero-bleu, .hero-bleu:not(.hero-bleu--accueil) { min-height: clamp(540px, 72svh, 680px); justify-content: center; padding: 120px 0 64px; }
  .hero-bleu__scene { left: 46%; right: -6%; top: 84px; bottom: 0; }
  .hero-bleu .hero-bleu__scene svg, .hero-bleu:not(.hero-bleu--accueil) .hero-bleu__scene svg { transform: none; }
  .hero-bleu__scene svg { display: block; }
  .hero-bleu__haut { position: relative; top: 0; margin-bottom: 22px; }
  .hero-bleu__bas { display: flex; flex-direction: column; align-items: flex-start; gap: 30px; }
  .hero-bleu__titre { order: -1; max-width: min(640px, 52%); font-size: clamp(56px, 6.8vw, 104px); }
  .hero-bleu--long .hero-bleu__titre { max-width: min(620px, 50%); font-size: clamp(38px, 4.3vw, 64px); line-height: 1.02; }
  .hero-bleu__intro { max-width: min(440px, 46%); gap: 20px; padding-bottom: 0; }
  .hero-bleu__intro p { font-size: 17px; line-height: 1.55; color: #e8ecf8; }
  .hero-bleu__descendre { width: 52px; height: 52px; }
}
@media (min-width: 761px) { .hero-bleu__haut { width: 100%; } }
@media (min-width: 761px) and (max-width: 1100px) { .hero-bleu__scene { left: 54%; right: -14%; } .hero-bleu__intro, .hero-bleu__titre, .hero-bleu--long .hero-bleu__titre { max-width: 50%; } }

/* Volets : visuel en arche */
.volets { height: 500px; }
.volet__contenu { grid-template-columns: minmax(0, 1fr) minmax(0, .82fr); gap: 36px; padding: 40px; }
.volet__texte > p { font-size: 17px; }
.volet__visuel { align-self: start; height: calc(100% - 44px); padding: 10px; border: 1px solid rgba(255, 255, 255, .3); border-radius: 999px 999px 30px 30px; background: rgba(255, 255, 255, .12); overflow: visible; }
.volet__visuel img { display: block; border-radius: 999px 999px 22px 22px; background: #fff; }
.volet--digital .volet__visuel { border-color: var(--trait-fort); background: #fff; }
.volet--digital .volet__visuel img { object-position: 72% 50%; }
@media (max-width: 900px) {
  .volet__visuel { height: 260px; align-self: stretch; }
}
@media (max-width: 900px) { .volets { height: auto; } .volet__contenu { grid-template-columns: 1fr; padding: 24px 24px 96px; gap: 24px; } }

/* Volets : diaporama plein cadre */
.volet__diapo { position: absolute; inset: 0; z-index: 0; overflow: hidden; opacity: 0; transition: opacity .5s ease; }
.volet.est-ouvert .volet__diapo { opacity: 1; transition-delay: .25s; }
.volet__diapo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.08); transition: opacity 1.2s ease, transform 6s linear; }
.volet__diapo img.est-actif { opacity: 1; transform: scale(1); }
.volet__diapo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10, 20, 120, .92) 0%, rgba(10, 20, 120, .72) 38%, rgba(10, 20, 120, .25) 75%, rgba(10, 20, 120, .1) 100%), linear-gradient(0deg, rgba(10, 20, 120, .55) 0%, rgba(10, 20, 120, 0) 45%); }
.volet__contenu { z-index: 1; grid-template-columns: minmax(0, 560px); }
.volet--digital .volet__contenu { color: #fff; }
.volet--digital .volet__texte > p, .volet__texte > p { color: #e8ecf8; }
.volet__services { box-sizing: border-box; }
@media (prefers-reduced-motion: reduce) { .volet__diapo img { transition: opacity .3s ease; transform: none; } }
@media (max-width: 900px) {
  .volet__contenu { grid-template-columns: 1fr; padding: 28px 24px 96px; min-height: 460px; }
  .volet__diapo { opacity: 1; }
  .volet__diapo::after { background: linear-gradient(180deg, rgba(10, 20, 120, .9) 0%, rgba(10, 20, 120, .6) 45%, rgba(10, 20, 120, .85) 100%); }
}

/* Filtres en panneau */
.tri { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 20px 40px; margin-bottom: 44px; padding: 28px; border: 1px solid var(--trait); border-radius: 28px; background: var(--nuage); }
.tri__compte { display: flex; flex-direction: column; min-width: 150px; padding-right: 36px; border-right: 1px solid var(--trait-fort); }
.tri__compte strong { font-family: var(--titre); font-weight: 600; font-size: 76px; line-height: .9; letter-spacing: -0.06em; color: var(--cobalt); font-variant-numeric: tabular-nums; }
.tri__compte span { margin-top: 10px; font-size: 14px; font-weight: 600; color: var(--gris); }
.tri__corps { grid-row: span 2; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.tri__ligne { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.tri__poles { position: relative; display: inline-flex; padding: 4px; border: 1px solid var(--trait); border-radius: 16px; background: #fff; }
.tri__poles button { position: relative; z-index: 1; min-height: 44px; padding: 0 20px; border: 0; background: none; font-family: var(--font); font-size: 15px; font-weight: 600; color: var(--texte); cursor: pointer; transition: color .3s ease; }
.tri__poles button[aria-pressed="true"] { color: #fff; }
.tri__curseur { position: absolute; top: 4px; bottom: 4px; left: 4px; width: 0; border-radius: 12px 22px 22px 12px; background: var(--cobalt); transition: transform .45s cubic-bezier(.6, 0, .2, 1), width .45s cubic-bezier(.6, 0, .2, 1); }
.tri__recherche { flex: 1 1 240px; display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 0 16px; border: 1px solid var(--trait); border-radius: 16px; background: #fff; color: var(--gris); cursor: text; transition: border-color .2s ease; }
.tri__recherche:focus-within { border-color: var(--cobalt); }
.tri__recherche svg { flex: none; width: 20px; height: 20px; }
.tri__recherche input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; font-family: var(--font); font-size: 16px; color: var(--encre); }
.tri__cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(190px, 100%), 1fr)); gap: 10px; }
.tri__cat { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 10px 16px; border: 1px solid var(--trait); border-radius: 16px; background: #fff; font-family: var(--font); font-size: 15px; font-weight: 600; color: var(--encre); text-align: left; cursor: pointer; transition: border-color .2s ease, background-color .2s ease, color .2s ease, border-radius .35s ease; }
.tri__cat[hidden] { display: none; }
.tri__cat span { flex: 1; }
.tri__cat b { font-family: var(--titre); font-weight: 600; font-size: 19px; letter-spacing: -0.04em; color: var(--gris); }
.tri__cat:hover:not(:disabled) { border-color: var(--cobalt); }
.tri__cat[aria-pressed="true"] { border-color: var(--cobalt); border-radius: 16px 28px 28px 16px; background: var(--cobalt); color: #fff; }
.tri__cat[aria-pressed="true"] b { color: var(--sur-bleu); }
.tri__cat:disabled { opacity: .4; cursor: not-allowed; }
.tri__forme { flex: none; width: 22px; height: 22px; background: var(--cobalt); transition: background-color .2s ease; }
.tri__forme--web { border-radius: 50%; }
.tri__forme--design { border-radius: 0 100% 0 0; background: var(--cobalt-vif); }
.tri__forme--digital { border-radius: 100% 100% 0 0; background: var(--nuit); }
.tri__forme--blog { border-radius: 0 50% 50% 50%; }
.tri__cat[aria-pressed="true"] .tri__forme { background: var(--urgence); }
.tri__effacer { grid-column: 1; align-self: end; justify-self: start; min-height: 44px; padding: 0; border: 0; background: none; font-family: var(--font); font-size: 14px; font-weight: 600; color: var(--cobalt); text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.tri__vide { padding: 48px 0; text-align: center; color: var(--gris); }
.tri__vide button { border: 0; background: none; padding: 0; font: inherit; font-weight: 600; color: var(--cobalt); text-decoration: underline; cursor: pointer; }
@media (max-width: 760px) {
  .tri { grid-template-columns: 1fr; gap: 16px; padding: 20px; border-radius: 24px; }
  .tri__compte { flex-direction: row; align-items: baseline; gap: 10px; min-width: 0; padding: 0 0 14px; border-right: 0; border-bottom: 1px solid var(--trait-fort); }
  .tri__compte strong { font-size: 48px; }
  .tri__corps { grid-row: auto; }
  .tri__poles { width: 100%; }
  .tri__poles button { flex: 1; padding: 0 6px; }
  .tri__cats { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 -20px; padding: 0 20px 4px; scrollbar-width: none; }
  .tri__cats::-webkit-scrollbar { display: none; }
  .tri__cat { flex: none; scroll-snap-align: start; }
  .tri__effacer { grid-column: auto; }
}
.volet__services { width: min(560px, 100%); }
.tri__cats { grid-template-columns: repeat(auto-fill, minmax(min(210px, 100%), 1fr)); }
.tri__cat span { white-space: nowrap; }
@media (max-width: 760px) {
  .tri { overflow: hidden; }
  .tri__cats { margin: 0 -20px; padding: 0 20px 4px; scroll-padding-left: 20px; }
}
.hero-bleu + .section { padding-top: clamp(56px, 7vw, 88px); }

/* Pages services : formules */
.offres--4 { grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); }
.offres--une { grid-template-columns: 1fr; }
.offre__note { margin-top: -14px; font-size: 13px; color: var(--gris); }
.offre--bleu .offre__note { color: var(--sur-bleu); }
.offre--seule { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px 56px; padding: clamp(28px, 4vw, 48px); }
.offre__gauche, .offre__droite { display: flex; flex-direction: column; gap: 20px; align-items: flex-start; }
.offre--seule .offre__tete h3 { font-family: var(--titre); font-size: clamp(30px, 3.4vw, 44px); font-weight: 600; letter-spacing: -0.05em; }
.offre--seule .eyebrow { color: var(--sur-bleu); }
.offre__sous-titre { font-size: 14px; font-weight: 600; color: var(--sur-bleu); }
.offre--seule .offre__droite { padding: 28px; border-radius: 22px; background: rgba(255, 255, 255, .1); }
.offres__rassure { margin-top: 20px; text-align: center; font-size: 14px; color: var(--gris); }
@media (max-width: 760px) { .offre--seule { grid-template-columns: 1fr; } }
.cartes-3--serre { margin-top: 0; }
.tuiles-liens { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); gap: 12px; }
.tuile-lien { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 72px; padding: 18px 22px; border: 1px solid var(--trait); border-radius: 20px; color: var(--encre); font-size: 17px; font-weight: 600; text-decoration: none; transition: border-color .2s ease, background-color .2s ease, border-radius .35s ease; }
.tuile-lien svg { width: 20px; height: 20px; color: var(--cobalt); transition: transform .35s ease; }
.tuile-lien:hover { border-color: var(--cobalt); border-radius: 20px 36px 36px 20px; background: var(--nuage); }
.tuile-lien:hover svg { transform: rotate(45deg); }
.pont { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px 64px; align-items: start; padding: clamp(28px, 5vw, 56px); border-radius: var(--rayon); background: var(--nuage); }
.pont > div { display: flex; flex-direction: column; gap: 18px; align-items: flex-start; }
@media (max-width: 900px) { .pont { grid-template-columns: 1fr; } }

/* Formulaire de devis */
.formulaire--devis { display: flex; flex-direction: column; gap: 22px; max-width: 880px; margin: 0 auto; padding: clamp(22px, 4vw, 40px); border: 1px solid var(--trait); border-radius: var(--rayon); background: #fff; }
.devis__bloc { display: flex; flex-direction: column; gap: 18px; padding: 24px; border-radius: 22px; background: var(--nuage); }
.devis__bloc[hidden] { display: none; }
.devis__bloc-titre { font-family: var(--titre); font-size: 24px; font-weight: 600; letter-spacing: -0.04em; }
.devis__astuce, .devis__volume { padding: 12px 16px; border-left: 3px solid var(--cobalt); border-radius: 4px 14px 14px 4px; background: #fff; font-size: 14px; line-height: 1.55; color: var(--texte); }
.devis__volume { border-left-color: var(--urgence); }
.devis__volume[hidden] { display: none; }
.pilules { margin: 0; padding: 0; border: 0; min-width: 0; }
.pilules legend { margin-bottom: 10px; padding: 0; font-size: 14px; font-weight: 600; }
.pilules > div { display: flex; flex-wrap: wrap; gap: 8px; }
.pilule { position: relative; cursor: pointer; }
.pilule input { position: absolute; opacity: 0; pointer-events: none; }
.pilule span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid var(--trait-fort); border-radius: 14px; background: #fff; font-size: 15px; font-weight: 500; transition: border-color .2s ease, background-color .2s ease, color .2s ease, border-radius .35s ease; }
.pilule:hover span { border-color: var(--cobalt); }
.pilule input:checked + span { border-color: var(--cobalt); border-radius: 14px 22px 22px 14px; background: var(--cobalt); color: #fff; }
.pilule input:focus-visible + span { outline: 2px solid var(--cobalt); outline-offset: 2px; }

/* Fiche réalisation */
.etude { display: flex; flex-direction: column; gap: 40px; }
.etude__tete { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 24px 48px; }
.etude__fiche { display: flex; flex-wrap: wrap; gap: 16px 48px; margin: 0; }
.etude__fiche div { display: flex; flex-direction: column; gap: 4px; }
.etude__fiche dt { font-size: 13px; font-weight: 600; color: var(--gris); }
.etude__fiche dd { margin: 0; font-size: 16px; font-weight: 600; color: var(--encre); }
.etude__fiche a { color: var(--cobalt); text-decoration: none; }
.etude__banniere { margin: 0; overflow: hidden; border-radius: var(--rayon); border: 1px solid var(--trait); background: var(--nuage); }
.etude__banniere img { display: block; width: 100%; height: auto; }
.etude__texte { display: flex; flex-direction: column; }
.etude__bloc { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: 16px 64px; padding: 32px 0; border-top: 1px solid var(--trait); }
.etude__bloc h2 { font-family: var(--titre); font-size: 26px; font-weight: 600; letter-spacing: -0.04em; }
.etude__bloc > div { display: flex; flex-direction: column; gap: 14px; max-width: 72ch; font-size: 17px; line-height: 1.7; color: var(--texte); }
.etude__bloc ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 8px; }
@media (max-width: 800px) { .etude__bloc { grid-template-columns: 1fr; } }
.galerie-projet { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.galerie-projet__item { margin: 0; overflow: hidden; border-radius: 22px; border: 1px solid var(--trait); background: var(--nuage); }
.galerie-projet__item img { display: block; width: 100%; height: 100%; object-fit: cover; }
.galerie-projet__item--g-big { grid-column: 1 / -1; }
.galerie-projet__item--g-tall, .galerie-projet__item--g-wide { aspect-ratio: 4 / 5; }
.galerie-projet__item--g-tall img, .galerie-projet__item--g-wide img { object-position: top; }
@media (max-width: 700px) { .galerie-projet { grid-template-columns: 1fr; } }
.voisins { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px; padding-top: 32px; padding-bottom: 8px; }
.voisins > div { display: flex; flex-wrap: wrap; gap: 12px; }
.voisins__retour { font-weight: 600; color: var(--cobalt); }
.voisin { display: flex; flex-direction: column; gap: 4px; max-width: 360px; padding: 16px 20px; border: 1px solid var(--trait); border-radius: 20px; color: var(--encre); text-decoration: none; transition: border-color .2s ease; }
.voisin:hover { border-color: var(--cobalt); }
.voisin small { font-size: 13px; color: var(--gris); }
.voisin span { font-size: 15px; font-weight: 600; line-height: 1.4; }

/* Article */
.article-page { max-width: 820px; display: flex; flex-direction: column; gap: 32px; }
.article-page__meta { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 14px; font-weight: 600; color: var(--gris); }
.article-page__une { margin: 0; overflow: hidden; border-radius: var(--rayon); border: 1px solid var(--trait); }
.article-page__une img { display: block; width: 100%; height: auto; }
.article-page__corps { display: flex; flex-direction: column; gap: 20px; font-size: 18px; line-height: 1.8; color: var(--texte); }
.article-page__corps h2 { margin-top: 20px; font-family: var(--titre); font-size: clamp(26px, 3vw, 34px); font-weight: 600; line-height: 1.15; letter-spacing: -0.04em; color: var(--encre); }
.article-page__corps h3 { margin-top: 12px; font-size: 22px; font-weight: 600; color: var(--encre); }
.article-page__corps strong { color: var(--encre); }
.article-page__corps a { color: var(--cobalt); }
.article-page__corps ul, .article-page__corps ol { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; }
.article-page__corps blockquote { margin: 0; padding: 20px 24px; border-left: 3px solid var(--cobalt); border-radius: 4px 20px 20px 4px; background: var(--nuage); font-size: 19px; color: var(--encre); }
.article-page__corps img { width: 100%; height: auto; border-radius: 22px; }
.article-page__corps figure { margin: 0; }
.article-page__partage { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding-top: 24px; border-top: 1px solid var(--trait); }
.article-page__partage span { margin-right: 6px; font-weight: 600; }
.article-page__partage a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid var(--trait); border-radius: 14px; color: var(--encre); font-size: 15px; text-decoration: none; }
.article-page__partage a:hover { border-color: var(--cobalt); color: var(--cobalt); }

/* Page légale */
.legal { display: flex; flex-direction: column; gap: 48px; max-width: 920px; }
.legal__tete { display: flex; flex-direction: column; gap: 16px; }
.legal__onglets { display: flex; flex-wrap: wrap; gap: 8px; }
.legal__onglets a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1px solid var(--trait); border-radius: 14px; color: var(--encre); font-weight: 600; text-decoration: none; }
.legal__onglets a:hover { border-color: var(--cobalt); color: var(--cobalt); }
.legal__doc { display: flex; flex-direction: column; gap: 20px; scroll-margin-top: 100px; font-size: 16px; line-height: 1.7; color: var(--texte); }
.legal__doc > h2 { font-family: var(--titre); font-size: clamp(30px, 3.6vw, 44px); font-weight: 600; letter-spacing: -0.05em; color: var(--encre); }
.legal__doc .lg-lede { font-size: 18px; color: var(--encre); }
.legal__doc .lg-art { display: flex; flex-direction: column; gap: 12px; padding: 24px 0; border-top: 1px solid var(--trait); }
.legal__doc .lg-num { font-size: 13px; font-weight: 600; color: var(--cobalt); }
.legal__doc h3 { font-size: 21px; font-weight: 600; color: var(--encre); }
.legal__doc ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 6px; }
.legal__doc a { color: var(--cobalt); }
.legal__doc .lg-art > div { display: flex; flex-direction: column; border: 1px solid var(--trait); border-radius: 18px; overflow: hidden; }
.legal__doc .lg-art > div > div { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: 4px 20px; padding: 12px 18px; }
.legal__doc .lg-art > div > div + div { border-top: 1px solid var(--trait); }
.legal__doc .lg-art > div > div span:first-child { font-weight: 600; color: var(--encre); }
@media (max-width: 600px) { .legal__doc .lg-art > div > div { grid-template-columns: 1fr; } }
.hero--intro .hero__grille--etire .hero__titre--colonne { grid-template-areas: "eye lead" "titre lead" "titre actions"; grid-template-rows: auto auto 1fr; }
.hero--intro .hero__grille--etire .hero__titre--colonne > .eyebrow { grid-area: eye; }
.hero--intro .hero__grille--etire .hero__titre--colonne > h2 { grid-area: titre; grid-row: auto; }
.hero--intro .hero__grille--etire .hero__titre--colonne > .lead { grid-area: lead; }
.hero--intro .hero__grille--etire .hero__titre--colonne > .actions { grid-area: actions; align-self: start; }
@media (max-width: 900px) { .hero--intro .hero__grille--etire .hero__titre--colonne { grid-template-areas: "eye" "titre" "lead" "actions"; grid-template-rows: none; } }

/* Qui répond de vos projets */
.signature { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px 72px; align-items: center; }
.signature__visuel { position: relative; aspect-ratio: 1; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; gap: 12px; }
.signature__forme { display: block; }
.signature__forme--1 { background: var(--cobalt); border-radius: 100% 0 0 0; }
.signature__forme--2 { background: var(--nuit); border-radius: 0 50% 50% 50%; }
.signature__forme--3 { background: var(--ciel); border-radius: 50%; }
.signature__forme--4 { background: var(--urgence); border-radius: 0 0 100% 0; }
.signature__initiales { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 44%; aspect-ratio: 1; border-radius: 50%; background: #fff; font-family: var(--titre); font-size: clamp(40px, 6vw, 84px); font-weight: 600; letter-spacing: -0.06em; color: var(--cobalt); }
.signature__texte { display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.signature__faits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; margin: 6px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--trait); }
.signature__faits li { display: flex; flex-direction: column; gap: 4px; padding: 18px 16px 0 0; }
.signature__faits strong { font-family: var(--titre); font-size: 30px; font-weight: 600; letter-spacing: -0.05em; color: var(--cobalt); }
.signature__faits span { font-size: 14px; line-height: 1.45; color: var(--gris); }
.signature .actions { align-items: center; }
@media (max-width: 900px) {
  .signature { grid-template-columns: 1fr; }
  .signature__visuel { max-width: 340px; }
}
@media (max-width: 520px) { .signature__faits { grid-template-columns: 1fr; } .signature__faits li { padding-right: 0; } }
.signature__photo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 56%; aspect-ratio: 1; object-fit: cover; border-radius: 50%; border: 8px solid #fff; }

/* Puces rondes des formules */
.offre li { align-items: flex-start; }
.offre li::before { content: ""; flex: none; width: 22px; height: 22px; margin-top: 1px; border-radius: 50%; background: var(--ciel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f44ff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 12px no-repeat; }
.offre--bleu li::before { background-color: rgba(255, 255, 255, .18); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }
.offre--seule li::before { background-color: var(--urgence); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b1026' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E"); }

/* Page article */
.lecture { position: fixed; top: 0; left: 0; right: 0; z-index: 60; height: 4px; pointer-events: none; }
.lecture span { display: block; height: 100%; background: var(--urgence); transform: scaleX(0); transform-origin: 0 50%; }
.lecture-page { display: grid; grid-template-columns: minmax(0, 250px) minmax(0, 760px); justify-content: center; gap: 40px 72px; align-items: start; }
.lecture-page__cote { position: sticky; top: 112px; display: flex; flex-direction: column; gap: 28px; }
.auteur-mini { display: flex; align-items: center; gap: 12px; }
.auteur-mini span:last-child { display: flex; flex-direction: column; gap: 2px; }
.auteur-mini b { font-size: 15px; }
.auteur-mini small { font-size: 13px; line-height: 1.4; color: var(--gris); }
.auteur-mini__logo { flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 0 50% 50% 50%; background: var(--cobalt); color: #fff; font-family: var(--titre); font-size: 22px; font-weight: 600; letter-spacing: -0.05em; }
.sommaire p, .partage p { margin-bottom: 12px; font-size: 13px; font-weight: 700; color: var(--gris); }
.sommaire ol { margin: 0; padding: 0; list-style: none; counter-reset: s; border-left: 2px solid var(--trait); }
.sommaire li { counter-increment: s; }
.sommaire a { display: grid; grid-template-columns: 28px 1fr; gap: 4px; margin-left: -2px; padding: 9px 0 9px 14px; border-left: 2px solid transparent; font-size: 14px; line-height: 1.45; color: var(--texte); text-decoration: none; transition: color .2s ease, border-color .2s ease; }
.sommaire a::before { content: counter(s, decimal-leading-zero); font-family: var(--titre); font-weight: 600; color: var(--gris); }
.sommaire a:hover, .sommaire a[aria-current="true"] { border-left-color: var(--cobalt); color: var(--cobalt); }
.sommaire a[aria-current="true"]::before { color: var(--cobalt); }
.partage > div { display: flex; gap: 8px; }
.partage a, .partage button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--trait); border-radius: 50%; background: #fff; color: var(--encre); cursor: pointer; transition: border-color .2s ease, background-color .2s ease, color .2s ease, border-radius .35s ease; }
.partage svg { width: 18px; height: 18px; }
.partage a:hover, .partage button:hover { border-color: var(--cobalt); border-radius: 14px 22px 22px 14px; color: var(--cobalt); }
.partage .est-copie { border-color: var(--urgence); background: var(--urgence); }
.lecture-page__corps { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
.lecture-page__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; font-size: 14px; font-weight: 600; color: var(--gris); }
.puce-cat { display: inline-flex; align-items: center; min-height: 32px; padding: 0 14px; border-radius: 10px 16px 16px 10px; background: var(--ciel); color: var(--cobalt); text-decoration: none; }
.lecture-page__une { margin: 0; overflow: hidden; border-radius: 28px; background: var(--nuage); }
.lecture-page__une img { display: block; width: 100%; height: auto; }
.texte-article { font-size: 18px; line-height: 1.85; color: #2c3550; }
.texte-article > * + * { margin-top: 1.1em; }
.texte-article > p:first-child { font-size: 21px; line-height: 1.7; color: var(--encre); }
.texte-article h2 { margin-top: 1.9em; scroll-margin-top: 110px; font-family: var(--titre); font-size: clamp(26px, 2.8vw, 34px); font-weight: 600; line-height: 1.15; letter-spacing: -0.04em; color: var(--encre); }
.texte-article h2::before { content: ""; display: block; width: 36px; height: 18px; margin-bottom: 14px; border-radius: 36px 36px 0 0; background: var(--cobalt); }
.texte-article h3 { margin-top: 1.6em; font-size: 22px; font-weight: 600; color: var(--encre); }
.texte-article strong { font-weight: 700; color: var(--encre); }
.texte-article a { color: var(--cobalt); text-underline-offset: 3px; }
.texte-article ul, .texte-article ol { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.texte-article ul li { position: relative; padding-left: 32px; }
.texte-article ul li::before { content: ""; position: absolute; left: 0; top: .5em; width: 18px; height: 18px; border-radius: 50%; background: var(--ciel); }
.texte-article ul li::after { content: ""; position: absolute; left: 6px; top: calc(.5em + 6px); width: 6px; height: 6px; border-radius: 50%; background: var(--cobalt); }
.texte-article ol { counter-reset: n; }
.texte-article ol li { position: relative; padding-left: 40px; counter-increment: n; }
.texte-article ol li::before { content: counter(n); position: absolute; left: 0; top: .2em; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--cobalt); color: #fff; font-family: var(--titre); font-size: 14px; font-weight: 600; line-height: 1; }
.texte-article .exergue, .texte-article blockquote { position: relative; margin: 1.6em 0; padding: 26px 28px 26px 76px; border-radius: 6px 26px 26px 6px; background: var(--nuage); font-family: var(--titre); font-size: clamp(20px, 2.2vw, 25px); font-weight: 600; font-style: normal; line-height: 1.35; letter-spacing: -0.03em; color: var(--encre); }
.texte-article .exergue::before, .texte-article blockquote::before { content: ""; position: absolute; left: 24px; top: 28px; width: 34px; height: 17px; background: radial-gradient(circle at 100% 100%, var(--cobalt) 0 70%, transparent 71%) left / 50% 100% no-repeat, radial-gradient(circle at 100% 100%, var(--urgence) 0 70%, transparent 71%) right / 50% 100% no-repeat; }
.texte-article blockquote p { margin: 0; }
.texte-article img { width: 100%; height: auto; border-radius: 22px; }
.texte-article figure { margin: 1.6em 0; }
.texte-article figcaption { margin-top: 8px; font-size: 14px; color: var(--gris); }
.texte-article .elementor, .texte-article .elementor * { font-family: inherit !important; }
.texte-article .elementor-heading-title { font-family: var(--titre) !important; color: var(--encre); }
.auteur-carte { display: flex; gap: 20px; margin-top: 8px; padding: 28px; border-radius: 28px; background: var(--nuage); }
.auteur-carte > div { display: flex; flex-direction: column; gap: 12px; }
.auteur-carte p:not(.eyebrow) { font-size: 15px; line-height: 1.65; color: var(--texte); }
.auteur-carte .actions { align-items: center; }
@media (max-width: 1000px) {
  .lecture-page { grid-template-columns: minmax(0, 760px); }
  .lecture-page__cote { position: static; order: 2; flex-direction: row; flex-wrap: wrap; justify-content: space-between; padding-top: 24px; border-top: 1px solid var(--trait); }
  .lecture-page__cote .sommaire { display: none; }
}
@media (max-width: 600px) {
  .texte-article { font-size: 17px; }
  .texte-article > p:first-child { font-size: 19px; }
  .texte-article .exergue, .texte-article blockquote { padding: 64px 22px 22px; }
  .texte-article .exergue::before, .texte-article blockquote::before { top: 24px; left: 22px; }
  .auteur-carte { flex-direction: column; }
}

/* Galerie des réalisations */
.galerie-etude__grille { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; align-items: start; }
.vue { margin: 0; display: flex; flex-direction: column; gap: 12px; min-width: 0; grid-column: span 6; }
.vue figcaption { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; color: var(--texte); }
.vue__forme { flex: none; width: 14px; height: 14px; border-radius: 0 100% 0 0; background: var(--cobalt); }
.vue--mobile .vue__forme { border-radius: 50%; background: var(--urgence); }
.vue--page .vue__forme { border-radius: 100% 100% 0 0; }
.vue__cadre { position: relative; display: block; overflow: hidden; border-radius: 24px; border: 1px solid var(--trait); background: var(--nuage); cursor: zoom-in; }
.vue__cadre img { display: block; width: 100%; height: auto; transition: transform .8s cubic-bezier(.2, .7, .2, 1); }
.vue__cadre::after { content: ""; position: absolute; right: 16px; bottom: 16px; width: 44px; height: 44px; border-radius: 50%; background: var(--urgence) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b1026' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='M20 20l-4.5-4.5M11 8v6M8 11h6'/%3E%3C/svg%3E") center / 20px no-repeat; transform: scale(0); transition: transform .35s cubic-bezier(.6, 0, .2, 1); }
.vue__cadre:hover::after, .vue__cadre:focus-visible::after { transform: scale(1); }
.vue__barre { display: flex; gap: 6px; padding: 12px 16px; background: #fff; border-bottom: 1px solid var(--trait); }
.vue__barre i { width: 9px; height: 9px; border-radius: 50%; background: var(--trait-fort); }
.vue__barre i:first-child { background: var(--cobalt); }
.vue--ecran { grid-column: span 12; }
.vue--ecran .vue__cadre:hover img { transform: scale(1.02); }
.vue--page { grid-column: span 7; }
.vue--page .vue__cadre { height: 620px; }
.vue--page .vue__cadre img { transition: transform 5s ease-in-out; }
.vue--page .vue__cadre:hover img { transform: translateY(calc(-100% + 576px)); }
.vue--mobile { grid-column: span 5; align-items: center; }
.vue--mobile .vue__cadre { width: min(300px, 100%); padding: 12px; border: 0; border-radius: 44px; background: var(--encre); }
.vue--mobile .vue__cadre img { border-radius: 32px; }
.vue__telephone { position: absolute; left: 50%; top: 20px; z-index: 1; width: 76px; height: 20px; transform: translateX(-50%); border-radius: 12px; background: var(--encre); }
.vue--mobile .vue__cadre::after { right: 26px; bottom: 26px; }
.vue--image .vue__cadre:hover img { transform: scale(1.03); }
.galerie-etude__grille--1 .vue { grid-column: span 12; }
.galerie-etude__grille--2 .vue--image { grid-column: span 6; }
.galerie-etude__grille--3 .vue--image:first-child { grid-column: span 12; }
@media (max-width: 900px) {
  .vue, .vue--page, .vue--mobile, .galerie-etude__grille--2 .vue--image { grid-column: span 12; }
  .vue--page .vue__cadre { height: 460px; }
  .vue--page .vue__cadre:hover img { transform: translateY(calc(-100% + 416px)); }
}

.visionneuse { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 64px 80px; background: rgba(8, 12, 40, .94); }
.visionneuse[hidden] { display: none; }
.visionneuse figure { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 14px; max-width: 100%; max-height: 100%; }
.visionneuse img { max-width: 100%; max-height: calc(100svh - 170px); width: auto; height: auto; border-radius: 16px; object-fit: contain; background: #fff; }
.visionneuse figcaption { font-size: 15px; font-weight: 600; color: #fff; text-align: center; }
.visionneuse__fermer { position: absolute; right: 20px; top: 16px; width: 48px; height: 48px; border: 0; border-radius: 50%; background: #fff; color: var(--encre); font-size: 28px; line-height: 1; cursor: pointer; }
.visionneuse__nav { position: absolute; top: 50%; width: 52px; height: 52px; margin-top: -26px; border: 0; border-radius: 50%; background: var(--urgence); color: var(--encre); display: grid; place-items: center; cursor: pointer; transition: border-radius .35s ease; }
.visionneuse__nav svg { width: 22px; height: 22px; }
.visionneuse__nav--prec { left: 16px; }
.visionneuse__nav--prec svg { transform: rotate(-135deg); }
.visionneuse__nav--suiv { right: 16px; }
.visionneuse__nav--suiv svg { transform: rotate(45deg); }
.visionneuse__nav:hover { border-radius: 16px 26px 26px 16px; }
.visionneuse__compteur { position: absolute; left: 24px; top: 26px; font-family: var(--titre); font-size: 18px; font-weight: 600; color: #fff; }
@media (max-width: 700px) {
  .visionneuse { padding: 72px 12px 96px; }
  .visionneuse__nav { top: auto; bottom: 20px; margin-top: 0; }
  .visionneuse__nav--prec { left: calc(50% - 64px); }
  .visionneuse__nav--suiv { right: calc(50% - 64px); }
}

/* FAQ sur deux colonnes */
.raisons:has(> .raisons__liste.faq) { flex-direction: column; gap: 40px; }
.raisons:has(> .raisons__liste.faq) > .raisons__tete { flex: none; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "eye lead" "titre lead"; gap: 14px 64px; align-items: end; }
.raisons:has(> .raisons__liste.faq) > .raisons__tete > .eyebrow { grid-area: eye; }
.raisons:has(> .raisons__liste.faq) > .raisons__tete > h2 { grid-area: titre; }
.raisons:has(> .raisons__liste.faq) > .raisons__tete > .lead { grid-area: lead; align-self: end; }
.raisons > .raisons__liste.faq { flex: none; display: block; column-count: 2; column-gap: 20px; }
.raisons > .raisons__liste.faq details { display: block; break-inside: avoid; margin-bottom: 12px; }
@media (max-width: 900px) {
  .raisons:has(> .raisons__liste.faq) > .raisons__tete { grid-template-columns: 1fr; grid-template-areas: "eye" "titre" "lead"; }
  .raisons > .raisons__liste.faq { column-count: 1; }
}

/* FAQ : deux colonnes fixes */
.raisons > .raisons__liste.faq.faq--colonnes { column-count: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; align-items: start; }
.faq__colonne { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.faq__colonne details { margin-bottom: 0 !important; }
@media (max-width: 900px) { .raisons > .raisons__liste.faq.faq--colonnes { grid-template-columns: 1fr; } }

/* Carrousels mobiles */
.defile-points { display: none; }
@media (max-width: 760px) {
  .defile { display: flex !important; flex-wrap: nowrap; gap: 12px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; margin-left: calc(-1 * var(--gouttiere)); margin-right: calc(-1 * var(--gouttiere)); padding: 4px var(--gouttiere) 6px; scroll-padding-left: var(--gouttiere); scrollbar-width: none; border-top: 0 !important; grid-template-columns: none !important; }
  .defile::-webkit-scrollbar { display: none; }
  .defile > * { flex: 0 0 84%; min-width: 0; scroll-snap-align: start; }
  .defile.offres > *, .defile.projets > * { flex-basis: 86%; }
  .defile.inclus > div { padding: 22px; border: 1px solid var(--trait); border-radius: 22px; background: #fff; }
  .defile.inclus > div:last-child { border-bottom: 1px solid var(--trait); }
  .defile.frise__liste { padding-left: var(--gouttiere); }
  .defile.frise__liste::before, .frise--cartes:has(.defile) .frise__jauge { display: none; }
  .defile-points { display: flex; justify-content: center; gap: 2px; margin-top: 10px; }
  .defile-points button { position: relative; width: 22px; height: 28px; padding: 0; border: 0; background: none; cursor: pointer; }
  .defile-points button::before { content: ""; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; border-radius: 50%; background: var(--trait-fort); transform: translate(-50%, -50%); transition: width .3s ease, background-color .3s ease, border-radius .3s ease; }
  .defile-points button[aria-current="true"]::before { width: 22px; border-radius: 6px; background: var(--cobalt); }
  .defile-points--sombre button::before { background: rgba(255, 255, 255, .28); }
  .defile-points--sombre button[aria-current="true"]::before { background: var(--urgence); }
  .defile .peut-deplier { cursor: pointer; }
  .defile .peut-deplier:not(.est-deplie) > p, .defile .peut-deplier:not(.est-deplie) > div > p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .defile__plus { align-self: flex-start; display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 4px; font-size: 13px; font-weight: 700; color: var(--cobalt); }
  .defile__plus::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); transition: transform .3s ease; }
  .est-deplie .defile__plus::after { transform: rotate(-135deg) translateY(-2px); }
  .urgence-nuit .defile__plus, .raisons-nuit .defile__plus, .etape-carte--nuit .defile__plus, .carte--bleue .defile__plus { color: var(--urgence); }
  .defile > .carte, .defile > .etape-carte, .defile > .promesse, .defile > div { display: flex; flex-direction: column; }
}

/* Pied de page mobile */
@media (max-width: 760px) {
  .site-footer .container { padding-top: 56px; gap: 36px; }
  .site-footer__haut { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 20px; }
  .site-footer__marque { grid-column: 1 / -1; gap: 16px; }
  .site-footer__marque p { font-size: 18px; line-height: 1.45; }
  .site-footer__col { gap: 10px; }
  .site-footer__col--large { grid-column: 1 / -1; order: 3; }
  .site-footer__col--large a { display: flex; align-items: center; justify-content: space-between; min-height: 48px; padding: 0 16px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 14px; background: rgba(255, 255, 255, .06); }
  .site-footer__col--large a small { font-size: 13px; }
  .site-footer__col--large > small { margin-top: 4px; font-size: 14px; }
  .site-footer__col a { min-height: 32px; display: inline-flex; align-items: center; }
  .site-footer__nom { font-size: 19.4vw; margin-bottom: -4px; }
  .site-footer__bas { flex-direction: column; align-items: center; gap: 8px; text-align: center; padding-bottom: 72px; }
}

/* Listes de choix maison */
.choix { position: relative; }
.choix__natif { position: absolute !important; left: 0; bottom: 0; width: 100% !important; height: 1px !important; min-height: 0 !important; padding: 0 !important; border: 0 !important; opacity: 0; pointer-events: none; }
.choix__bouton { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 54px; padding: 8px 8px 8px 18px; border: 1px solid var(--trait-fort); border-radius: 16px; background: #fff; font-family: var(--font); font-size: 16px; color: var(--gris); text-align: left; cursor: pointer; transition: border-color .2s ease, border-radius .35s ease, box-shadow .2s ease; }
.choix__bouton::after { content: ""; flex: none; width: 38px; height: 38px; border-radius: 12px; background: var(--ciel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f44ff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") center / 18px no-repeat; transition: transform .35s ease, border-radius .35s ease, background-color .2s ease; }
.choix__bouton:hover, .choix__bouton:focus-visible { border-color: var(--cobalt); outline: none; }
.choix__bouton:focus-visible { box-shadow: 0 0 0 3px var(--ciel); }
.choix.a-valeur .choix__bouton { color: var(--encre); font-weight: 500; }
.choix.est-ouvert .choix__bouton { border-color: var(--cobalt); }
.choix.est-ouvert .choix__bouton::after { transform: rotate(180deg); border-radius: 50%; }
.choix.est-invalide .choix__bouton { border-color: #d93a3a; }
.choix__valeur { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.choix__liste { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 30; max-height: 320px; overflow-y: auto; margin: 0; padding: 8px; list-style: none; border: 1px solid var(--trait); border-radius: 20px; background: #fff; opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .2s ease, transform .25s ease, visibility .25s; overscroll-behavior: contain; }
.choix.est-ouvert .choix__liste { opacity: 1; visibility: visible; transform: none; }
.choix__liste li { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 10px 14px; border-radius: 14px; font-size: 15px; font-weight: 500; color: var(--encre); cursor: pointer; outline: none; transition: background-color .15s ease, border-radius .3s ease; }
.choix__liste li::before { content: ""; flex: none; width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--trait-fort); background: #fff; transition: background-color .2s ease, border-color .2s ease; }
.choix__liste li:hover, .choix__liste li:focus { background: var(--nuage); }
.choix__liste li:focus { border-radius: 14px 22px 22px 14px; }
.choix__liste li[aria-selected="true"] { background: var(--ciel); color: var(--cobalt); }
.choix__liste li[aria-selected="true"]::before { border-color: var(--cobalt); background: var(--cobalt) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 12px no-repeat; }
.devis__bloc .choix__bouton { border-color: var(--trait); }

/* Chiffres et avis sur mobile */
@media (max-width: 760px) {
  .bande-trois { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 36px; border: 0; border-radius: 22px; background: var(--nuage); }
  .bande-trois > div { padding: 18px 10px 16px; gap: 4px; text-align: center; align-items: center; }
  .bande-trois > div + div { border-top: 0; border-left: 1px solid var(--trait-fort); }
  .bande-trois strong { font-size: clamp(24px, 7.6vw, 32px); }
  .bande-trois span { font-size: 12px; line-height: 1.35; }
  .hero__chiffres { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; padding: 0; border-radius: 22px; background: var(--nuage); }
  .hero__chiffres .chiffre-court { padding: 16px 8px; align-items: center; text-align: center; }
  .hero__chiffres .chiffre-court + .chiffre-court { border-left: 1px solid var(--trait-fort); }
  .chiffre-court strong { font-size: clamp(24px, 7.6vw, 30px); }
  .chiffre-court span { font-size: 12px; line-height: 1.35; }

  .temoignages { gap: 24px; }
  .temoignages__tete { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px 16px; align-items: center; }
  .temoignages__tete > .eyebrow, .temoignages__tete > h2, .temoignages__tete > .btn { grid-column: 1 / -1; }
  .temoignages__tete > .btn { justify-self: start; }
  .temoignages__note strong { font-size: 64px; }
  .temoignages__tete > .muted { font-size: 14px; line-height: 1.45; }
  .temoignages__cartes.js.defile .temoignage { grid-area: auto; opacity: 1; visibility: visible; transform: none; }
  .temoignages__cartes.defile > .temoignage { flex-basis: 86%; }
  .temoignage { min-height: 0; gap: 24px; padding: 24px; border-radius: 26px; }
  .temoignage::before { left: 24px; top: 24px; width: 52px; height: 26px; }
  .temoignage blockquote { margin-top: 40px; font-size: 17px; line-height: 1.5; }
  .temoignage figcaption > span:first-child { width: 46px; height: 46px; }
  .temoignage figcaption small { font-size: 13px; }
  .temoignages__pied { display: none; }
}

/* Pied de page : la route Cameroun, diaspora */
.pied { position: relative; overflow: hidden; padding: clamp(64px, 8vw, 104px) 0 28px; background: radial-gradient(50% 60% at 85% 20%, rgba(31, 68, 255, .55) 0%, rgba(31, 68, 255, 0) 70%), var(--nuit); color: #fff; }
.pied::before { content: ""; position: absolute; left: -120px; bottom: -120px; width: 320px; height: 320px; border-radius: 0 100% 0 0; background: rgba(255, 255, 255, .04); }
.pied .container { position: relative; }
.pied__grille { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); grid-template-areas: "parole route" "nav reseaux"; gap: 48px 64px; align-items: start; }
.pied__parole { grid-area: parole; display: flex; flex-direction: column; gap: 26px; }
.pied__sur { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; color: var(--nuit-doux); }
.pied__sur i { width: 12px; height: 12px; border-radius: 50%; background: var(--urgence); box-shadow: 0 0 0 0 rgba(181, 242, 61, .6); animation: pied-pouls 2.4s ease-out infinite; }
@keyframes pied-pouls { 70% { box-shadow: 0 0 0 10px rgba(181, 242, 61, 0); } 100% { box-shadow: 0 0 0 0 rgba(181, 242, 61, 0); } }
.pied__titre { font-family: var(--titre); font-size: clamp(36px, 4.6vw, 62px); font-weight: 600; line-height: 1; letter-spacing: -0.055em; }
.pied__titre span { display: block; color: var(--nuit-doux); }
.pied__contacts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ticket { position: relative; display: flex; flex-direction: column; gap: 6px; min-height: 104px; padding: 20px 76px 20px 22px; border: 1px solid rgba(255, 255, 255, .16); border-radius: 22px; background: rgba(255, 255, 255, .05); color: #fff; text-decoration: none; transition: background-color .25s ease, border-color .25s ease, border-radius .4s ease; }
.ticket--large { grid-column: 1 / -1; min-height: 88px; }
.ticket__lieu { font-size: 13px; font-weight: 600; color: var(--nuit-doux); }
.ticket strong { font-family: var(--titre); font-size: clamp(20px, 2vw, 26px); font-weight: 600; letter-spacing: -0.04em; overflow-wrap: anywhere; }
.ticket__rond { position: absolute; right: 18px; top: 50%; width: 44px; height: 44px; margin-top: -22px; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff; display: grid; place-items: center; transition: background-color .25s ease, color .25s ease, border-radius .35s ease; }
.ticket__rond svg { width: 18px; height: 18px; transition: transform .35s ease; }
.ticket:hover { border-color: var(--urgence); border-radius: 22px 36px 36px 22px; background: rgba(255, 255, 255, .09); }
.ticket:hover .ticket__rond { background: var(--urgence); color: var(--encre); border-radius: 14px 22px 22px 14px; }
.ticket:hover .ticket__rond svg { transform: rotate(45deg); }

.route { grid-area: route; position: relative; margin: 0; padding: 22px; border: 1px solid rgba(255, 255, 255, .14); border-radius: 30px; background: linear-gradient(160deg, rgba(31, 68, 255, .35), rgba(10, 20, 120, .2)); }
.route figcaption { display: flex; flex-direction: column; gap: 2px; margin-bottom: 4px; }
.route figcaption b { font-family: var(--titre); font-size: 22px; font-weight: 600; letter-spacing: -0.04em; }
.route figcaption span { font-size: 13px; color: var(--nuit-doux); }
.route svg { display: block; width: 100%; height: auto; overflow: visible; }
.route__zone { fill: rgba(255, 255, 255, .05); }
.route__zone--europe { fill: rgba(255, 255, 255, .07); }
.route__ligne { fill: none; stroke: rgba(255, 255, 255, .18); stroke-width: 2; stroke-dasharray: 2 8; stroke-linecap: round; }
.route__flux { fill: none; stroke: url(#routeTrait); stroke-width: 3.5; stroke-linecap: round; stroke-dasharray: 60 420; stroke-dashoffset: 480; animation: route-flux 4.2s cubic-bezier(.6, 0, .4, 1) infinite; }
.route__flux--2 { animation-delay: 1.6s; stroke-dasharray: 46 320; stroke-dashoffset: 366; animation-name: route-flux-2; }
@keyframes route-flux { to { stroke-dashoffset: 0; } }
@keyframes route-flux-2 { to { stroke-dashoffset: 0; } }
.route__ville circle { fill: #fff; }
.route__ville text { fill: #fff; font-family: var(--font); font-size: 15px; font-weight: 600; }
.route__ville--hub circle { fill: var(--urgence); }
.route__ville--hub text { font-family: var(--titre); font-size: 22px; letter-spacing: -0.03em; }
.route__ville--loin circle { fill: #8ea2ff; }
.route__onde { fill: none !important; stroke: var(--urgence); stroke-width: 2; transform-box: fill-box; transform-origin: center; animation: route-onde 2.4s ease-out infinite; }
@keyframes route-onde { from { transform: scale(1); opacity: .9; } to { transform: scale(3.4); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .route__flux, .route__onde, .pied__sur i { animation: none; } .route__flux { stroke-dasharray: none; stroke-dashoffset: 0; opacity: .7; } }

.pied__nav { grid-area: nav; display: flex; flex-wrap: wrap; gap: 8px; }
.pied__nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1px solid rgba(255, 255, 255, .16); border-radius: 14px; color: #fff; font-size: 15px; font-weight: 600; text-decoration: none; transition: background-color .2s ease, color .2s ease, border-radius .35s ease; }
.pied__nav a:hover { background: #fff; color: var(--nuit); border-radius: 14px 22px 22px 14px; }
.pied__reseaux { grid-area: reseaux; display: flex; justify-content: flex-end; gap: 8px; }
.pied__reseaux a { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid rgba(255, 255, 255, .16); border-radius: 50%; color: #fff; transition: background-color .2s ease, color .2s ease, border-radius .35s ease; }
.pied__reseaux a:hover { background: var(--urgence); color: var(--encre); border-radius: 14px 22px 22px 14px; }
.pied__reseaux svg { width: 18px; height: 18px; }

.pied__signature { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px 40px; margin-top: clamp(56px, 7vw, 88px); padding-top: 36px; border-top: 1px solid rgba(255, 255, 255, .14); }
.pied__signature img { height: 34px; width: auto; }
.pied__devise { font-family: var(--titre); font-size: clamp(40px, 7.4vw, 112px); font-weight: 600; line-height: .95; letter-spacing: -0.06em; color: rgba(255, 255, 255, .92); }
.pied__waka { position: relative; display: inline-block; color: var(--urgence); }
.pied__waka svg { position: absolute; left: -3%; bottom: -0.2em; width: 106%; height: .3em; overflow: visible; }
.pied__waka path { fill: none; stroke: var(--urgence); stroke-width: 6; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.pied__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; margin-top: 28px; font-size: 14px; color: var(--nuit-doux); }
.pied__bas a { color: var(--nuit-doux); }
.pied__bas a:hover { color: #fff; }

@media (max-width: 900px) {
  .pied__grille { grid-template-columns: 1fr; grid-template-areas: "parole" "route" "nav" "reseaux"; gap: 32px; }
  .pied__reseaux { justify-content: flex-start; }
}
@media (max-width: 560px) {
  .pied__contacts { grid-template-columns: 1fr; }
  .ticket { min-height: 80px; padding: 16px 70px 16px 18px; }
  .route { padding: 18px 14px 12px; border-radius: 24px; }
  .route__ville text { font-size: 19px; }
  .route__ville--hub text { font-size: 26px; }
  .pied__nav a { flex: 1 1 calc(50% - 8px); justify-content: center; }
  .pied__signature { flex-direction: column; align-items: flex-start; }
  .pied__devise { font-size: 13.4vw; }
  .pied__bas { flex-direction: column; padding-bottom: 72px; }
}

@media (max-width: 520px) {
  .signature__faits { grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 0; border-radius: 22px; background: var(--nuage); }
  .signature__faits li { padding: 16px 8px; align-items: center; text-align: center; }
  .signature__faits li + li { border-left: 1px solid var(--trait-fort); }
  .signature__faits strong { font-size: clamp(22px, 7vw, 28px); }
  .signature__faits span { font-size: 12px; line-height: 1.35; }
}

/* Deux boutons sur une ligne en mobile */
@media (max-width: 560px) {
  .actions:has(> .btn + .btn) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-items: stretch; }
  .actions:has(> .btn + .btn) > .btn { width: 100%; min-width: 0; }
  .actions:has(> .btn + .btn) > .btn--icone { display: flex; }
  .actions:has(> .btn + .btn) .btn__texte { flex: 1; min-width: 0; min-height: 48px; padding: 6px 10px; justify-content: center; text-align: center; font-size: 14px; line-height: 1.2; white-space: normal; }
  .actions:has(> .btn + .btn) .btn__rond { flex: none; width: 44px; height: auto; min-height: 48px; }
  .actions:has(> .btn + .btn) > .btn:not(.btn--icone) { min-height: 48px; padding: 6px 10px; font-size: 14px; line-height: 1.2; white-space: normal; text-align: center; }
  .eyebrow { white-space: normal; }
}
@media (max-width: 560px) {
  .actions:has(> .btn--icone + .lien-fleche) { flex-wrap: nowrap; gap: 14px; }
  .actions:has(> .btn--icone + .lien-fleche) > .btn { flex: 0 1 auto; min-width: 0; }
  .actions:has(> .btn--icone + .lien-fleche) .btn__texte { min-height: 48px; padding: 6px 14px; font-size: 14px; line-height: 1.2; white-space: normal; text-align: center; }
  .actions:has(> .btn--icone + .lien-fleche) .btn__rond { width: 44px; height: auto; min-height: 48px; flex: none; }
  .actions:has(> .btn--icone + .lien-fleche) > .lien-fleche { flex: 0 1 auto; font-size: 14px; line-height: 1.35; }
}
@media (max-width: 360px) {
  .actions:has(> .btn + .btn) .btn__texte, .actions:has(> .btn + .btn) > .btn:not(.btn--icone), .actions:has(> .btn--icone + .lien-fleche) .btn__texte { font-size: 13px; padding: 6px 8px; hyphens: auto; }
  .actions:has(> .btn + .btn) .btn__rond, .actions:has(> .btn--icone + .lien-fleche) .btn__rond { width: 40px; }
}
.ticket strong { white-space: nowrap; font-size: clamp(18px, 1.55vw, 23px); }
.ticket--large strong { font-size: clamp(20px, 2vw, 26px); }
.pied__nav { flex-wrap: nowrap; gap: 6px; }
.pied__nav a { padding: 0 14px; font-size: 14px; }
.route__pays { fill: rgba(255, 255, 255, .45); font-family: var(--font); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
@media (max-width: 560px) { .pied__nav { flex-wrap: wrap; } .pied__nav a { font-size: 15px; } .route__pays { font-size: 15px; } }

/* Pied de page sans carte */
.pied__grille { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); grid-template-areas: "parole cote"; gap: 48px 96px; }
.pied__cote { grid-area: cote; display: flex; flex-direction: column; gap: 18px; padding-top: 6px; }
.pied__sur--nav { margin-bottom: 2px; }
.pied__sur--nav::before { content: ""; width: 12px; height: 12px; border-radius: 0 100% 0 0; background: var(--nuit-doux); }
.pied__nav { flex-direction: column; flex-wrap: nowrap; gap: 0; border-top: 1px solid rgba(255, 255, 255, .14); }
.pied__nav a { justify-content: space-between; min-height: 0; padding: 16px 4px; border: 0; border-bottom: 1px solid rgba(255, 255, 255, .14); border-radius: 0; font-family: var(--titre); font-size: clamp(20px, 2vw, 26px); font-weight: 600; letter-spacing: -0.04em; }
.pied__nav a svg { width: 20px; height: 20px; color: var(--nuit-doux); transition: transform .35s ease, color .2s ease; }
.pied__nav a:hover { background: none; color: var(--urgence); border-radius: 0; }
.pied__nav a:hover svg { transform: rotate(45deg); color: var(--urgence); }
.pied__reseaux { justify-content: flex-start; margin-top: 6px; }
@media (max-width: 900px) { .pied__grille { grid-template-columns: 1fr; grid-template-areas: "parole" "cote"; gap: 40px; } }
@media (max-width: 560px) { .pied__nav a { flex: none; justify-content: space-between; font-size: 20px; padding: 14px 2px; } }

.pied__signature img { height: 56px; }
@media (max-width: 560px) { .pied__signature img { height: 46px; } }

/* WhatsApp dans l'en-tête mobile */
.tete-wa { display: none; }
@media (max-width: 1080px) {
  .tete-wa { display: inline-flex; align-items: center; gap: 8px; height: 44px; margin-left: auto; padding: 0 14px 0 6px; border-radius: 22px; background: var(--urgence); color: var(--encre); font-size: 14px; font-weight: 700; text-decoration: none; transition: border-radius .35s ease; }
  .tete-wa i { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--encre); color: var(--urgence); }
  .tete-wa svg { width: 17px; height: 17px; }
  .tete-wa:hover { border-radius: 14px 22px 22px 14px; }
  .tete-wa + .nav-toggle { margin-left: 8px; }
}
@media (max-width: 360px) { .tete-wa span { display: none; } .tete-wa { padding: 0 6px; } }
.nav-toggle { flex: none; width: 46px; min-width: 46px; height: 46px; padding: 0; aspect-ratio: 1; border-radius: 50%; line-height: 0; transition: background-color .2s ease, border-color .2s ease; }
.nav-toggle svg { display: block; margin: auto; }
.nav-toggle[aria-expanded="true"] { border-color: var(--encre); background: var(--encre); color: #fff; }

/* Carte des clients, façon réseau mondial */
.monde-section { padding: var(--section) 0; background: linear-gradient(180deg, var(--nuage) 0%, #fff 70%); }
.monde-section__tete { display: flex; flex-direction: column; align-items: center; gap: 16px; max-width: 760px; margin: 0 auto clamp(24px, 4vw, 48px); text-align: center; }
.monde { position: relative; padding: clamp(40px, 6vw, 72px) clamp(0px, 4vw, 48px); }
.monde__plan { position: relative; width: 100%; }
.monde__fond { display: block; width: 100%; height: 100%; }
.monde__liens { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.monde__arc { fill: none; stroke: url(#mondeArc); stroke-opacity: .55; stroke-width: 2; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.monde__flux { fill: none; stroke: var(--cobalt); stroke-width: 3; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 26 2000; stroke-dashoffset: 2026; animation: monde-flux 3.2s cubic-bezier(.6, 0, .4, 1) infinite; animation-delay: calc(var(--i) * .9s); }
@keyframes monde-flux { to { stroke-dashoffset: 0; } }
.monde__point { position: absolute; z-index: 1; width: 0; height: 0; }
.monde__point > button { position: absolute; left: 0; top: 0; width: 22px; height: 22px; transform: translate(-50%, -50%); padding: 0; border: 6px solid var(--cobalt); border-radius: 50%; background: #fff; cursor: pointer; transition: transform .25s ease; }
.monde__point > button::before { content: ""; position: absolute; inset: -16px; border-radius: 50%; border: 1px solid rgba(31, 68, 255, .22); background: rgba(31, 68, 255, .05); }
.monde__point > button:hover, .monde__point.est-ouvert > button { transform: translate(-50%, -50%) scale(1.15); }
.monde__point--siege > button { width: 34px; height: 42px; border: 0; border-radius: 0; background: none; transform: translate(-50%, -96%); }
.monde__point--siege > button::before { inset: auto; left: 50%; bottom: -10px; width: 30px; height: 10px; margin-left: -15px; border: 2px solid var(--cobalt); border-radius: 50%; background: none; }
.monde__point--siege > button:hover, .monde__point--siege.est-ouvert > button { transform: translate(-50%, -100%) scale(1.06); }
.monde__epingle { display: block; width: 100%; height: 100%; overflow: visible; }
.monde__epingle path { fill: var(--urgence); stroke: var(--encre); stroke-width: 2; }
.monde__epingle circle { fill: var(--encre); }
.monde__etiquette { position: absolute; left: 24px; top: -30px; padding: 5px 10px; border: 1px solid var(--trait); border-radius: 10px; background: #fff; font-size: 12px; font-weight: 700; color: var(--encre); white-space: nowrap; pointer-events: none; transition: opacity .2s ease; }
.monde__bulle { position: absolute; left: 22px; top: 50%; z-index: 2; width: 280px; max-height: 300px; overflow-y: auto; padding: 16px; border: 1px solid var(--trait); border-radius: 20px; background: #fff; color: var(--encre); transform: translate(8px, -50%); opacity: 0; visibility: hidden; transition: opacity .2s ease, transform .25s ease, visibility .25s; }
.monde__point--gauche .monde__bulle { left: auto; right: 22px; transform: translate(-8px, -50%); }
.monde__point:hover .monde__bulle, .monde__point.est-ouvert .monde__bulle, .monde__point:focus-within .monde__bulle { opacity: 1; visibility: visible; transform: translate(0, -50%); }
.monde__point:hover .monde__etiquette, .monde__point.est-ouvert .monde__etiquette { opacity: 0; }
.monde__point:hover, .monde__point.est-ouvert, .monde__point:focus-within { z-index: 3; }
.monde__lieu { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.monde__lieu b { font-family: var(--titre); font-size: 18px; font-weight: 600; letter-spacing: -0.03em; }
.monde__lieu span { font-size: 12px; font-weight: 600; color: var(--gris); }
.monde__bulle ul { margin: 6px 0 12px; padding: 0; list-style: none; }
.monde__bulle ul:last-child { margin-bottom: 0; }
.monde__bulle li { border-top: 1px solid var(--trait); }
.monde__bulle a { display: block; padding: 8px 0; font-size: 13px; line-height: 1.4; color: var(--encre); text-decoration: none; }
.monde__bulle a:hover { color: var(--cobalt); }
.monde-info { position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 12px; padding: 16px 22px; border: 1px solid var(--trait); border-radius: 16px; background: #fff; font-size: 16px; font-weight: 600; color: var(--encre); }
.monde-info svg { flex: none; width: 22px; height: 22px; color: var(--cobalt); }
.monde-info--hg { left: 0; top: 0; }
.monde-info--hd { right: 0; top: 0; }
.monde-info--bg { left: 4%; bottom: 0; }
.monde-info--bd { right: 4%; bottom: 0; }
@media (prefers-reduced-motion: reduce) { .monde__flux { display: none; } }
@media (max-width: 760px) {
  .monde { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0; }
  .monde__plan { grid-column: 1 / -1; order: -1; margin-bottom: 12px; }
  .monde-info { position: static; padding: 12px 14px; font-size: 14px; gap: 8px; }
  .monde-info svg { width: 18px; height: 18px; }
  .monde__point > button { width: 16px; height: 16px; border-width: 4px; }
  .monde__point > button::before { inset: -9px; }
  .monde__point--siege > button { width: 24px; height: 30px; }
  .monde__etiquette { display: none; }
  .monde__bulle { position: fixed; left: 16px !important; right: 16px !important; top: auto; bottom: 16px; width: auto; max-height: 50vh; transform: translateY(12px) !important; z-index: 70; }
  .monde__point.est-ouvert .monde__bulle, .monde__point:focus-within .monde__bulle { transform: none !important; }
  .monde__point:hover:not(.est-ouvert):not(:focus-within) .monde__bulle { opacity: 0; visibility: hidden; }
}
@media (max-width: 760px) {
  .monde__point--siege > button::before { inset: auto; left: 50%; bottom: -7px; width: 20px; height: 7px; margin-left: -10px; border-width: 1.5px; }
}

/* Retour en haut */
.haut-page { position: fixed; right: max(16px, env(safe-area-inset-right, 0px)); bottom: calc(max(16px, env(safe-area-inset-bottom, 0px)) + 66px); z-index: 59; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #fff; color: var(--encre); text-decoration: none; opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .3s ease, transform .3s ease, visibility .3s, background-color .2s ease, color .2s ease; }
.haut-page.est-visible { opacity: 1; visibility: visible; transform: none; }
.haut-page__anneau { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.haut-page__anneau circle { fill: none; stroke: var(--trait-fort); stroke-width: 2; }
.haut-page__anneau .haut-page__progres { stroke: var(--cobalt); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: var(--reste, 100); transition: stroke-dashoffset .1s linear; }
.haut-page__fleche { position: relative; width: 20px; height: 20px; transition: transform .3s ease; }
.haut-page:hover { background: var(--cobalt); color: #fff; }
.haut-page:hover .haut-page__fleche { transform: translateY(-2px); }
.haut-page:hover .haut-page__progres { stroke: var(--urgence); }
@media (max-width: 640px) { .haut-page { width: 46px; height: 46px; bottom: calc(max(16px, env(safe-area-inset-bottom, 0px)) + 62px); right: max(17px, env(safe-area-inset-right, 0px)); } }

/* Espacements de sections harmonisés */
.hero--intro { padding-top: var(--section); }
.hero-bleu + .section { padding-top: var(--section); }
.urgence-nuit { padding: var(--section) 0; }
.monde-section { padding: var(--section) 0; }
.pied { padding-top: var(--section); }
.appel { padding: var(--section) 0 32px; }
.fond-nuage { padding-bottom: var(--section); margin-top: var(--section); }
.espace-haut { padding-top: calc(var(--section) * .6); }
.urgence-nuit + .section { padding-top: var(--section); }
.monde-section + .section { padding-top: 0; }
.monde-section + .appel { padding-top: 0; }
.monde-section__pied { display: flex; justify-content: center; margin-top: clamp(20px, 3vw, 32px); }
.monde-section + .espace-haut { padding-top: 0; }
.galerie-etude__grille:not(:has(.vue--image ~ .vue--image)) .vue--image { grid-column: span 12; }