/* Elon Zumbua — Entrepreneur & Speaker
   Noir & blanc, un seul accent bleu très discret. */

:root {
  --bg: #ffffff;
  --ink: #0f1324;
  --text: #3b4152;
  --muted: #6b7287;
  --line: #e7eaf1;
  --soft: #f5f6f9;
  --accent: #1d4ed8;
  --sans: "Inter Tight", "Helvetica Neue", Arial, sans-serif;
  --serif: "Cormorant Garamond", Georgia, serif;
  --gutter: clamp(16px, 4vw, 56px);
  --max: 1240px;
  --header-h: 76px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 300;
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
p { margin: 0 0 1.1em; }
h1, h2, h3 { margin: 0; font-weight: 300; line-height: 1.12; letter-spacing: -.01em; }
::selection { background: var(--ink); color: #fff; }
:focus-visible { outline: 1px solid var(--accent); outline-offset: 4px; }

.wrap { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
.narrow { max-width: 820px; }

/* Photos : toujours en noir & blanc (retirer ce filtre pour revenir à la couleur) */
.bw { filter: grayscale(1) contrast(1.05); transition: filter .7s var(--ease), transform 1.2s var(--ease); }
/* Au survol, la photo reprend ses couleurs */
@media (hover: hover) {
  .figure:hover .bw, .hero:hover .bw { filter: grayscale(0) contrast(1); }
}

/* ---------- Typo utilitaires ---------- */
.eyebrow {
  display: block;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 28px;
}
.display { font-size: clamp(38px, 6vw, 84px); font-weight: 300; }
.h2 { font-size: clamp(30px, 3.8vw, 52px); }
.lead { font-size: clamp(20px, 2vw, 26px); line-height: 1.5; font-weight: 300; }
.muted { color: var(--muted); }
.dot { color: var(--accent); }
.quote {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(30px, 4.2vw, 58px);
  line-height: 1.18;
  letter-spacing: -.005em;
}

/* Liens texte : soulignement fin, bleu au survol */
.link {
  display: inline-flex; align-items: center; gap: 10px;
  font-size: 13px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase;
  padding-bottom: 6px;
  background: linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat;
  transition: color .3s var(--ease), background-size .4s var(--ease);
}
.link:hover { color: var(--accent); }
.link .arrow { transition: transform .3s var(--ease); }
.link:hover .arrow { transform: translateX(4px); }

/* Boutons */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  min-height: 54px; padding: 0 30px;
  font: 500 13px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase;
  border: 1px solid var(--ink);
  background: var(--ink); color: #fff;
  cursor: pointer;
  transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.btn:hover { background: #fff; color: var(--ink); }
.btn:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent); }
.btn--ghost { background: transparent; color: var(--ink); }
.btn--ghost:hover { background: var(--ink); color: #fff; }
.btn--light { background: #fff; color: var(--ink); border-color: #fff; }
.btn--light:hover { background: transparent; color: #fff; }

/* ---------- Header ---------- */
.site-header {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  height: var(--header-h);
  display: flex; align-items: center;
  transition: background .4s var(--ease), border-color .4s var(--ease), color .4s var(--ease);
  border-bottom: 1px solid transparent;
}
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; max-width: none; }
.brand { font-size: 14px; font-weight: 500; letter-spacing: .3em; text-transform: uppercase; white-space: nowrap; }
.menu-toggle {
  display: inline-flex; flex-direction: column; align-items: center; gap: 6px;
  background: none; border: 0; padding: 8px 0 8px 12px; cursor: pointer; color: inherit;
  font: 500 11px/1 var(--sans); letter-spacing: .3em; text-transform: uppercase;
}
.menu-toggle .bars { width: 26px; height: 7px; position: relative; }
.menu-toggle .bars::before, .menu-toggle .bars::after {
  content: ""; position: absolute; left: 0; right: 0; height: 1px; background: currentColor;
  transition: transform .4s var(--ease), top .4s var(--ease);
}
.menu-toggle .bars::before { top: 0; }
.menu-toggle .bars::after { top: 6px; }

/* Sur le hero sombre : header blanc, puis noir une fois scrollé */
.site-header.on-dark { color: #fff; }
.site-header.is-solid { background: rgba(255,255,255,.96); color: var(--ink); border-color: var(--line); backdrop-filter: blur(8px); }
body.menu-open .site-header { color: var(--ink); background: transparent; border-color: transparent; }
body.menu-open .menu-toggle .bars { width: 16px; }
body.menu-open .menu-toggle .bars::before { top: 3px; transform: rotate(45deg); }
body.menu-open .menu-toggle .bars::after { top: 3px; transform: rotate(-45deg); }

/* ---------- Menu overlay ---------- */
.menu {
  position: fixed; inset: 0; z-index: 40;
  background: #fff;
  display: flex; flex-direction: column;
  padding: calc(var(--header-h) + 4vh) var(--gutter) 40px;
  opacity: 0; visibility: hidden;
  transition: opacity .45s var(--ease), visibility .45s;
  overflow-y: auto;
}
body.menu-open { overflow: hidden; }
body.menu-open .menu { opacity: 1; visibility: visible; }
.menu-inner { width: 100%; max-width: var(--max); margin: auto; display: grid; grid-template-columns: 1.4fr 1fr; gap: 60px; align-items: end; }
.menu-list { list-style: none; margin: 0; padding: 0; }
.menu-list > li { border-top: 1px solid var(--line); }
.menu-list > li:last-child { border-bottom: 1px solid var(--line); }
.menu-list a, .menu-list button {
  display: flex; width: 100%; align-items: baseline; justify-content: space-between; gap: 20px;
  padding: 14px 0;
  font: 300 clamp(22px, 2.6vw, 34px)/1.2 var(--sans); letter-spacing: -.005em;
  color: var(--ink); background: none; border: 0; cursor: pointer; text-align: left;
  transition: color .3s var(--ease), padding-left .4s var(--ease);
}
.menu-list a:hover, .menu-list button:hover { color: var(--accent); padding-left: 10px; }
.menu-list a[aria-current="page"] { color: var(--muted); }
.menu-list .num { font-size: 12px; font-weight: 500; letter-spacing: .2em; color: var(--muted); }
.menu-list .chev { font-size: .5em; transition: transform .4s var(--ease); display: inline-block; }
.menu-list button[aria-expanded="true"] .chev { transform: rotate(180deg); }
.submenu { list-style: none; margin: 0; padding: 0 0 0 clamp(20px, 4vw, 60px); overflow: hidden; max-height: 0; transition: max-height .5s var(--ease); }
.submenu.open { max-height: 260px; }
.submenu a { font-size: clamp(16px, 1.5vw, 20px); padding: 9px 0; border-top: 1px solid var(--line); }
.submenu small { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.menu-aside { font-size: 15px; color: var(--muted); }
.menu-aside p { margin-bottom: 18px; }
.menu-aside a:hover { color: var(--accent); }

/* ---------- Hero accueil ---------- */
.hero {
  position: relative; min-height: 100svh;
  display: flex; align-items: flex-end;
  color: #fff; background: #000;
  overflow: hidden;
}
.hero picture, .hero picture img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero picture img { object-fit: cover; object-position: 50% 35%; }
.hero::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,0) 22%, rgba(0,0,0,0) 45%, rgba(0,0,0,.78) 100%);
}
.hero-content { position: relative; z-index: 2; width: 100%; padding-bottom: clamp(40px, 8vh, 90px); }
.hero h1 { font-size: clamp(44px, 6.2vw, 96px); font-weight: 300; letter-spacing: -.025em; line-height: .95; }
.hero .role { margin-top: 18px; font-size: 13px; font-weight: 500; letter-spacing: .32em; text-transform: uppercase; }
.hero .role .dot { color: #8fb0ff; }
.hero-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 30px; flex-wrap: wrap; }
.hero .btn--light:hover { border-color: #fff; }
.scroll-cue { font-size: 11px; letter-spacing: .3em; text-transform: uppercase; opacity: .8; }

/* Hero des pages intérieures */
.page-hero { padding: calc(var(--header-h) + clamp(60px, 12vh, 140px)) 0 clamp(50px, 8vh, 90px); }
.page-hero .display { max-width: 15ch; }
.page-hero .lead { max-width: 640px; margin-top: 30px; color: #2a2a2a; }

/* ---------- Sections ---------- */
.section { padding: clamp(80px, 12vw, 160px) 0; }
.section--tight { padding: clamp(56px, 8vw, 100px) 0; }
.section--soft { background: var(--soft); }
.rule { border: 0; border-top: 1px solid var(--line); margin: 0; }

.split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 7vw, 110px); align-items: center; }
.split--top { align-items: start; }
.split--wide-left { grid-template-columns: 1.15fr .85fr; }

.figure { position: relative; overflow: hidden; background: #ddd; margin: 0; }
.figure img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease), filter .7s var(--ease); }
.figure:hover img { transform: scale(1.025); }
.figure figcaption { margin-top: 12px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.ratio-45 { aspect-ratio: 4 / 5; }
.ratio-23 { aspect-ratio: 2 / 3; }
.ratio-wide { aspect-ratio: 16 / 9; }

/* Liste numérotée (thèmes, expertises) */
.numbered { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
.numbered li {
  display: grid; grid-template-columns: 90px 1fr 1.2fr; gap: 30px;
  padding: 34px 0; border-bottom: 1px solid var(--line);
  align-items: baseline;
}
.numbered .n { font-size: 13px; font-weight: 500; letter-spacing: .2em; color: var(--muted); }
.numbered h3 { font-size: clamp(24px, 2.6vw, 34px); }
.numbered p { margin: 0; color: #3a3a3a; }
.numbered--compact li { grid-template-columns: 70px 1fr 1.4fr; padding: 26px 0; }
.numbered ul.points { list-style: none; padding: 0; margin: 14px 0 0; }
.numbered ul.points li { display: block; border: 0; padding: 4px 0 4px 18px; position: relative; color: #3a3a3a; }
.numbered ul.points li::before { content: ""; position: absolute; left: 0; top: 15px; width: 8px; height: 1px; background: var(--ink); }

/* Bandeau partenaire */
.partner { display: grid; grid-template-columns: auto 1fr auto; gap: clamp(30px, 6vw, 90px); align-items: center; }
.partner-logo { width: clamp(120px, 14vw, 170px); }
.partner p { margin: 0; max-width: 560px; }

/* Entreprises (accueil) */
.ventures { border-top: 1px solid var(--ink); }
.venture {
  display: grid; grid-template-columns: 1fr 1.3fr auto; gap: 40px; align-items: center;
  padding: 40px 0; border-bottom: 1px solid var(--line);
  transition: padding-left .5s var(--ease);
}
.venture:hover { padding-left: 14px; }
.venture h3 { font-size: clamp(30px, 3.6vw, 48px); }
.venture p { margin: 0; color: #3a3a3a; }
.venture .tag { display: block; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin-top: 10px; }
.venture:hover .link { color: var(--accent); }

/* Citation */
.quote-block { text-align: center; }
.quote-block .quote { max-width: 980px; margin: 0 auto; }
.quote-block cite { display: block; margin-top: 34px; font-style: normal; font-size: 12px; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; color: var(--muted); }

/* Galerie asymétrique */
.gallery { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(10px, 1.4vw, 20px); }
.gallery .figure:nth-child(1) { grid-column: 1 / 6; aspect-ratio: 4/5; }
.gallery .figure:nth-child(2) { grid-column: 6 / 13; aspect-ratio: 16/11; align-self: end; }
.gallery .figure:nth-child(3) { grid-column: 1 / 5; aspect-ratio: 4/5; }
.gallery .figure:nth-child(4) { grid-column: 5 / 9; aspect-ratio: 4/5; margin-top: 12%; }
.gallery .figure:nth-child(5) { grid-column: 9 / 13; aspect-ratio: 4/5; }

/* Why */
.why { padding: calc(var(--header-h) + clamp(60px, 12vh, 140px)) 0 clamp(80px, 12vw, 150px); }
.why .quote { max-width: 18ch; }
.why-body { columns: 2; column-gap: clamp(30px, 5vw, 70px); margin-top: clamp(40px, 6vw, 80px); max-width: 980px; }
.why-body p { break-inside: avoid; }
.signature { font-family: var(--serif); font-style: italic; font-size: 30px; margin-top: 10px; }

/* Principes */
.principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(30px, 4vw, 60px); border-top: 1px solid var(--ink); padding-top: 40px; }
.principles h3 { font-size: 24px; margin: 14px 0 14px; }
.principles p { color: #3a3a3a; margin: 0; }

/* Faits (bio) */
.facts { list-style: none; margin: 30px 0 0; padding: 0; border-top: 1px solid var(--line); }
.facts li { display: flex; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 15px; }
.facts li span:first-child { color: var(--muted); font-size: 12px; letter-spacing: .18em; text-transform: uppercase; padding-top: 3px; }
.facts li span:last-child { text-align: right; }

/* Détails format */
.specs { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ink); }
.specs div { padding: 26px 20px 0 0; }
.specs dt { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.specs dd { margin: 8px 0 0; font-size: 20px; }

/* Équipe Kin Consult */
.team { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ink); }
.team li { padding: 26px 24px 26px 0; border-right: 1px solid var(--line); }
.team li + li { padding-left: 24px; }
.team li:last-child { border-right: 0; }
.team strong { display: block; font-weight: 400; font-size: 20px; margin-bottom: 6px; }
.team span { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.team .is-elon strong::after { content: " ·"; color: var(--accent); }

.logo-kin { width: 110px; filter: invert(1); }
.wordmark { font-size: clamp(56px, 10vw, 150px); font-weight: 300; letter-spacing: -.04em; line-height: .9; }

.pills { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.pills span { border: 1px solid var(--line); padding: 8px 16px; font-size: 13px; letter-spacing: .06em; }

/* ---------- Formulaire ---------- */
.form { display: grid; grid-template-columns: 1fr 1fr; gap: 26px 30px; }
.field { display: flex; flex-direction: column; gap: 8px; }
.field--full { grid-column: 1 / -1; }
.field label { font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.field label .req { color: var(--ink); }
.field input, .field select, .field textarea {
  width: 100%; font: 300 17px/1.4 var(--sans); color: var(--ink);
  background: transparent; border: 0; border-bottom: 1px solid #cfcfcf; border-radius: 0;
  padding: 10px 0 12px; appearance: none; -webkit-appearance: none;
  transition: border-color .3s var(--ease);
}
.field select {
  background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%);
  background-position: calc(100% - 10px) 52%, calc(100% - 5px) 52%;
  background-size: 5px 5px; background-repeat: no-repeat; padding-right: 26px;
}
.field textarea { min-height: 130px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-bottom-color: var(--accent); }
.field input:user-invalid, .field select:user-invalid, .field textarea:user-invalid { border-bottom-color: #b42318; }
.form-foot { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 10px; }
.form-foot small { color: var(--muted); font-size: 13px; max-width: 420px; }
.form-success { display: none; border-top: 1px solid var(--ink); padding-top: 40px; }
.form-success .check { width: 44px; height: 44px; border: 1px solid var(--accent); border-radius: 50%; display: grid; place-items: center; color: var(--accent); margin-bottom: 24px; }
.is-sent .form { display: none; }
.is-sent .form-success { display: block; }
.form-success:focus { outline: none; }

/* ---------- CTA final & footer ---------- */
.cta-final { background: var(--ink); color: #fff; text-align: center; }
.cta-final .display { max-width: 14ch; margin: 0 auto 40px; }
.cta-final .eyebrow { color: #a3a3a3; }

.site-footer { padding: 60px 0 40px; font-size: 14px; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 50px; border-bottom: 1px solid var(--line); }
.footer-grid h4 { margin: 0 0 16px; font-size: 12px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.footer-grid ul { list-style: none; margin: 0; padding: 0; }
.footer-grid li { margin-bottom: 8px; }
.footer-grid a:hover { color: var(--accent); }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding-top: 26px; color: var(--muted); font-size: 13px; }

/* ---------- Révélations au scroll ---------- */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.in { opacity: 1; transform: none; }
.no-js .reveal { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; scroll-behavior: auto !important; }
  .reveal { opacity: 1; transform: none; }
}

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .split, .split--wide-left { grid-template-columns: 1fr; }
  .menu-inner { grid-template-columns: 1fr; gap: 40px; }
  .numbered li, .numbered--compact li { grid-template-columns: 50px 1fr; }
  .numbered li > p, .numbered li > div { grid-column: 2; }
  .venture { grid-template-columns: 1fr; gap: 14px; }
  .partner { grid-template-columns: 1fr; gap: 24px; }
  .principles { grid-template-columns: 1fr; }
  .specs { grid-template-columns: 1fr 1fr; row-gap: 10px; }
  .team { grid-template-columns: 1fr 1fr; }
  .team li { border-right: 0; border-bottom: 1px solid var(--line); padding-left: 0 !important; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .why-body { columns: 1; }
  .gallery .figure:nth-child(n) { grid-column: span 6; margin-top: 0; aspect-ratio: 4/5; }
  .gallery .figure:nth-child(2) { grid-column: 1 / -1; aspect-ratio: 16/11; order: -1; }
  .gallery .figure:nth-child(5) { grid-column: 1 / -1; aspect-ratio: 16/11; }
}
@media (max-width: 600px) {
  body { font-size: 16px; }
  :root { --header-h: 64px; }
  .brand { letter-spacing: .22em; font-size: 13px; }
  .form { grid-template-columns: 1fr; }
  .team { grid-template-columns: 1fr; }
  .specs { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  .hero-row .btn { width: 100%; }
  .btn { width: 100%; }
  .facts li { flex-direction: column; gap: 4px; }
  .facts li span:last-child { text-align: left; }
}

/* Trio de photos (page Speaker) */
.trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(10px, 1.4vw, 20px); }
.trio .figure { aspect-ratio: 4 / 5; }
@media (max-width: 600px) {
  .trio { grid-template-columns: 1fr 1fr; }
  .trio .figure:first-child { grid-column: 1 / -1; aspect-ratio: 16 / 11; }
}

/* Bandeau photo pleine largeur */
.band { width: 100%; height: min(56.25vw, 78vh); min-height: 260px; }


/* ---------- Page À propos : mise en page inspirée de tonyelumelu.com/about ---------- */
.about-intro { padding: calc(var(--header-h) + clamp(50px, 8vh, 100px)) 0 clamp(60px, 9vw, 130px); }
.about-intro-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .85fr); gap: clamp(40px, 7vw, 120px); align-items: start; }
.about-eyebrow { display: block; font-size: 15px; font-weight: 400; letter-spacing: .14em; text-transform: uppercase; color: #555; }
.name-serif { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(48px, 5.2vw, 76px); line-height: 1.15; letter-spacing: -.01em; margin: 14px 0 34px; }
.about-bio p { font-size: 17px; line-height: 2; color: var(--muted); }
.about-portrait { aspect-ratio: 2 / 3; margin-top: clamp(20px, 8vw, 120px); }

.timeline { border-top: 1px solid var(--line); }
.chapter { padding: clamp(80px, 10vw, 150px) 0; border-bottom: 1px solid var(--line); }
.chapter-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 520px); gap: clamp(40px, 7vw, 120px); align-items: start; }
.chapter-aside { height: 100%; }
.chapter-sticky { position: sticky; top: calc(var(--header-h) + 48px); padding-left: 34px; }
.chapter-progress { position: absolute; left: 0; top: 6px; bottom: 0; width: 1px; background: var(--line); }
.chapter-progress::before { content: ""; position: absolute; left: 0; top: 0; width: 1px; height: calc(var(--p, 0) * 100%); background: var(--ink); }
.chapter-progress::after {
  content: ""; position: absolute; left: -3px; top: calc(var(--p, 0) * 100%); width: 7px; height: 7px; margin-top: -3px;
  border-radius: 50%; background: var(--accent);
}
.chapter-head {
  display: flex; align-items: center; gap: 18px; margin: 0;
  font-size: 13px; font-weight: 400; letter-spacing: .2em; text-transform: uppercase; color: var(--muted);
}
.chapter-line { width: 64px; height: 1px; background: currentColor; }
.years {
  margin: 26px 0 0; font-family: var(--serif); font-weight: 500;
  font-size: clamp(96px, 11vw, 168px); line-height: .98; letter-spacing: -.045em; color: var(--ink);
  font-variant-numeric: lining-nums; font-feature-settings: "lnum" 1;
}
.years span { display: block; }
.years .to { font-style: italic; font-weight: 400; }
.chapter-body h2 { font-size: clamp(26px, 2.2vw, 30px); line-height: 1.4; margin: 0 0 22px; }
.chapter-body > p { font-size: 16px; line-height: 30px; color: var(--muted); }
.chapter-fig { margin: 40px 0; }
.chapter-fig .figure { aspect-ratio: 4 / 5; }
.chapter-fig figcaption { margin-top: 12px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.chapter-quote { margin: 44px 0 0; padding-top: 28px; border-top: 1px solid var(--line); }
.chapter-quote p { margin: 0; font-family: var(--serif); font-style: italic; font-size: clamp(24px, 2vw, 28px); line-height: 1.3; color: var(--ink); }
.chapter-quote p::before { content: "« "; color: var(--accent); }
.chapter-quote p::after { content: " »"; color: var(--accent); }

.milestones-section { padding: clamp(80px, 10vw, 140px) 0; text-align: center; }
.milestones-title { margin: 0 0 50px; font-size: 13px; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.milestones { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); }
.milestones li { padding: 10px 20px; border-left: 1px solid var(--line); }
.milestones li:first-child { border-left: 0; }
.milestones strong { display: block; font-family: var(--serif); font-weight: 500; font-size: clamp(48px, 5vw, 76px); line-height: 1; letter-spacing: -.03em; font-variant-numeric: lining-nums; }
.milestones span { display: block; margin-top: 12px; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }

.why--after { padding: clamp(80px, 12vw, 150px) 0; border-top: 1px solid var(--line); }

@media (max-width: 960px) {
  .about-intro-grid, .chapter-grid { grid-template-columns: 1fr; }
  .about-portrait { margin-top: 0; max-width: 480px; }
  .chapter-sticky { position: static; padding-left: 0; }
  .chapter-progress { display: none; }
  .years { font-size: clamp(72px, 20vw, 110px); }
  .milestones { grid-template-columns: 1fr 1fr; row-gap: 30px; }
  .milestones li:nth-child(3) { border-left: 0; }
}

/* Duo de photos (Corpoready) */
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(12px, 2vw, 28px); }
@media (max-width: 600px) { .duo { grid-template-columns: 1fr; } }

/* ---------- Hero portrait (accueil, en couleur) ----------
   Écrans larges : image horizontale (assets/img/hero-wide.jpg), qui prend toute la largeur,
   Elon à droite. Écrans verticaux : portrait d'origine. Le texte reste à gauche. */
.hero.hero--portrait { min-height: 100svh; align-items: center; background: #0e1218; overflow: hidden; }
.hero.hero--portrait::after { display: none; }
.hero-media, .hero-media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero.hero--portrait .hero-media img { object-fit: cover; object-position: 100% 18%; }
.hero--portrait::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(14,18,26,.5) 0%, rgba(14,18,26,0) 20%);
}
.hero--portrait .hero-content { position: relative; z-index: 2; width: 100%; padding: calc(var(--header-h) + 20px) 0 40px; }
.hero--portrait .hero-content .wrap { max-width: none; padding-left: clamp(24px, 8vw, 150px); padding-right: 0; }
.hero.hero--portrait .hero-title {
  max-width: min(46vw, 12.5em);
  font-family: var(--serif); font-weight: 500; font-size: clamp(40px, 4.4vw, 76px);
  line-height: 1.07; letter-spacing: -.01em; color: #fff; text-shadow: 0 2px 30px rgba(8,10,14,.35);
}
.hero--portrait .hero-title .soft { color: rgba(255,255,255,.72); }
.hero--portrait .hero-kicker { margin: 30px 0 40px; font-size: 13px; letter-spacing: .3em; text-transform: uppercase; color: rgba(255,255,255,.9); }
.hero--portrait .hero-kicker span { margin: 0 14px; }

@media (min-aspect-ratio: 1/1) and (max-width: 1100px) {
  .hero.hero--portrait .hero-title { font-size: clamp(30px, 4vw, 44px); max-width: 40vw; }
  .hero--portrait .hero-kicker { letter-spacing: .18em; font-size: 12px; }
  .hero--portrait .hero-kicker span { margin: 0 8px; }
}
/* Écrans verticaux / étroits : portrait d'origine, texte en bas */
@media (max-aspect-ratio: 1/1) {
  .hero.hero--portrait { align-items: flex-end; }
  .hero.hero--portrait .hero-media img { object-position: 50% 10%; }
  .hero--portrait::before { background: linear-gradient(180deg, rgba(14,18,26,.4) 0%, rgba(14,18,26,0) 16%, rgba(14,18,26,0) 40%, rgba(14,18,26,.9) 76%); }
  .hero--portrait .hero-content { padding-bottom: 40px; }
  .hero--portrait .hero-content .wrap { padding: 0 var(--gutter); }
  .hero.hero--portrait .hero-title { max-width: 14em; font-size: clamp(32px, 7vw, 56px); }
}
@media (max-width: 600px) {
  .hero--portrait .hero-kicker { font-size: 11px; letter-spacing: .14em; white-space: nowrap; margin: 20px 0 28px; }
  .hero--portrait .hero-kicker span { margin: 0 6px; }
}

/* Hero, écrans verticaux : photo remontée, texte sur la zone sombre du bas, tout tient dans la largeur */
@media (max-aspect-ratio: 1/1) {
  .hero.hero--portrait .hero-media img { object-position: 50% 0; height: 72%; bottom: auto; }
  .hero--portrait::before { background: linear-gradient(180deg, rgba(14,18,26,.35) 0%, rgba(14,18,26,0) 14%, rgba(14,18,26,0) 46%, #0e1218 72%); }
  .hero--portrait .hero-content { padding-bottom: 36px; }
  .hero.hero--portrait .hero-title { font-size: clamp(28px, 8.6vw, 52px); }
  .hero--portrait .hero-kicker { display: flex; flex-wrap: wrap; gap: 4px 0; white-space: normal; }
  .hero--portrait .btn { width: auto; padding: 0 22px; letter-spacing: .14em; white-space: nowrap; }
}
@media (max-width: 360px) {
  .hero--portrait .hero-kicker { font-size: 10px; letter-spacing: .1em; }
  .hero--portrait .hero-kicker span { margin: 0 5px; }
  .hero--portrait .btn { font-size: 12px; padding: 0 18px; letter-spacing: .1em; }
}

/* ---------- Hero : finitions design ---------- */
.hero--portrait .hero-eyebrow { display: flex; align-items: center; gap: 16px; margin: 0 0 26px; font-size: 12px; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; color: rgba(255,255,255,.85); }
.hero-eyebrow-line { width: 44px; height: 1px; background: var(--accent); box-shadow: 0 0 0 .5px rgba(29,78,216,.4); }
.hero--portrait .hero-kicker { color: rgba(255,255,255,.65); }
.hero-actions { display: flex; align-items: center; gap: 28px; flex-wrap: wrap; }
.hero-link { color: #fff; font-size: 13px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; padding-bottom: 6px; background: linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat; transition: background-size .4s var(--ease), color .3s; }
.hero-link:hover { background-size: 0 1px; color: #cfe0ff; }
.hero-proof { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; border-top: 1px solid rgba(255,255,255,.14); background: linear-gradient(0deg, rgba(10,13,18,.55), rgba(10,13,18,0)); }
.hero-proof .wrap { max-width: none; padding: 20px clamp(24px, 8vw, 150px); display: flex; gap: clamp(20px, 4vw, 56px); flex-wrap: wrap; }
.hero-proof span { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.hero-proof strong { font-weight: 500; color: #fff; }
.hero--portrait .hero-content { padding-bottom: 110px; }
/* apparition */
@media (prefers-reduced-motion: no-preference) {
  .hero--portrait .hero-content .wrap > * { opacity: 0; transform: translateY(18px); animation: heroIn .9s var(--ease) forwards; }
  .hero--portrait .hero-content .wrap > *:nth-child(2) { animation-delay: .12s; }
  .hero--portrait .hero-content .wrap > *:nth-child(3) { animation-delay: .24s; }
  .hero--portrait .hero-content .wrap > *:nth-child(4) { animation-delay: .36s; }
  .hero.hero--portrait .hero-media img { animation: heroZoom 1.8s var(--ease) both; }
}
@keyframes heroIn { to { opacity: 1; transform: none; } }
@keyframes heroZoom { from { transform: scale(1.04); } to { transform: none; } }
@media (max-aspect-ratio: 1/1) {
  .hero-proof { display: none; }
  .hero--portrait .hero-content { padding-bottom: 36px; }
  .hero--portrait .hero-eyebrow { font-size: 10px; letter-spacing: .2em; margin-bottom: 16px; }
  .hero-actions { gap: 18px; }
}

/* ---------- Barre de navigation blanche (comme la maquette) ---------- */
.site-header, .site-header.on-dark, .site-header.is-solid { background: #fff; color: var(--ink); border-bottom: 1px solid var(--line); }
:root { --header-h: 88px; }
.brand { font-size: 20px; font-weight: 400; letter-spacing: .12em; }
.topnav { display: none; }
@media (min-width: 1000px) {
  .topnav { display: flex; align-items: center; gap: clamp(28px, 3.6vw, 54px); margin-left: auto; margin-right: clamp(40px, 7vw, 120px); }
  .topnav a { font-size: 13px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--ink); transition: color .3s var(--ease); }
  .topnav a:hover { color: var(--accent); }
  .topnav-drop { position: relative; }
  .topnav-drop > a { display: inline-flex; flex-direction: column; align-items: center; }
  .caret { width: 0; height: 0; margin-top: 6px; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid currentColor; }
  .topnav-menu { position: absolute; left: 50%; top: calc(100% + 14px); transform: translate(-50%, 6px); min-width: 180px; padding: 16px 22px; background: #fff; border: 1px solid var(--line); display: flex; flex-direction: column; gap: 12px; opacity: 0; visibility: hidden; transition: all .25s var(--ease); }
  .topnav-drop:hover .topnav-menu, .topnav-drop:focus-within .topnav-menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
  .menu-toggle { flex-direction: column-reverse; gap: 8px; }
  .menu-toggle .label { font-size: 11px; letter-spacing: .3em; }
  .menu-toggle .bars { width: 46px; height: 10px; }
  .menu-toggle .bars::after { top: 9px; }
  body.menu-open .topnav { visibility: hidden; }
}
/* le hero commence sous la barre blanche */
.hero.hero--portrait { margin-top: var(--header-h); min-height: calc(100svh - var(--header-h)); }
.hero--portrait .hero-content { padding: 60px 0; }
@media (min-aspect-ratio: 1/1) { .hero--portrait::before { background: linear-gradient(90deg, rgba(14,18,26,.35), rgba(14,18,26,0) 55%); } }
@media (max-aspect-ratio: 1/1) { .hero--portrait .hero-content { padding: 40px 0 36px; } }

/* ---------- Accueil : section « Qui est Elon » ---------- */
.intro-eyebrow { display: flex; align-items: center; gap: 16px; margin: 0 0 28px; font-size: 12px; font-weight: 500; letter-spacing: .26em; text-transform: uppercase; color: var(--muted); }
.intro-eyebrow span { width: 44px; height: 1px; background: var(--ink); }
.intro-statement { max-width: 22ch; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(34px, 4.4vw, 64px); line-height: 1.12; margin-bottom: clamp(60px, 8vw, 110px); }
.intro-grid { display: grid; grid-template-columns: 7fr 5fr; gap: clamp(40px, 6vw, 100px); align-items: start; }
.intro-media { position: relative; padding-bottom: 60px; }
.intro-main { aspect-ratio: 4 / 5; }
.intro-inset { position: absolute; right: -8%; bottom: 0; width: 42%; aspect-ratio: 4 / 5; border: 8px solid #fff; }
.intro-caption { margin: 14px 0 0; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.intro-text { padding-top: 10px; }
.intro-text > p:not(.lead):not(.intro-label) { color: #3a3a3a; }
.intro-label { margin: 40px 0 10px; font-size: 12px; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: var(--muted); }
.intro-pillars { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
.intro-pillars li { display: grid; grid-template-columns: 44px 1fr; gap: 12px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.intro-pillars span { font-size: 12px; letter-spacing: .2em; color: var(--muted); padding-top: 5px; }
.intro-pillars strong { display: block; font-weight: 400; font-size: 20px; }
.intro-pillars em { font-style: normal; font-size: 15px; color: var(--muted); }
.intro-actions { display: flex; gap: 34px; flex-wrap: wrap; margin-top: 36px; }
.link--muted { color: var(--muted); }
.intro-figures { margin-top: clamp(70px, 9vw, 120px); padding-top: 50px; border-top: 1px solid var(--line); text-align: center; }
@media (max-width: 960px) {
  .intro-grid { grid-template-columns: 1fr; }
  .intro-inset { display: none; }
  .intro-media { padding-bottom: 0; }
}

/* ---------- Mise en avant KPMG ---------- */
.kpmg { background: var(--ink); color: #fff; padding: clamp(80px, 11vw, 150px) 0; }
.kpmg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 7vw, 120px); align-items: start; }
.kpmg-logo { width: clamp(130px, 14vw, 180px); filter: invert(1); margin-bottom: 40px; }
.kpmg-eyebrow { display: flex; align-items: center; gap: 16px; font-size: 12px; font-weight: 500; letter-spacing: .26em; text-transform: uppercase; color: rgba(255,255,255,.6); margin-bottom: 24px; }
.kpmg-eyebrow::before { content: ""; width: 44px; height: 1px; background: var(--accent); }
.kpmg-title { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(32px, 3.8vw, 54px); line-height: 1.15; }
.kpmg-body .lead { color: rgba(255,255,255,.85); margin-bottom: 34px; }
.kpmg-points { list-style: none; margin: 0 0 40px; padding: 0; border-top: 1px solid rgba(255,255,255,.2); }
.kpmg-points li { padding: 20px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.kpmg-points strong { display: block; font-weight: 400; font-size: 19px; margin-bottom: 4px; }
.kpmg-points span { font-size: 15px; color: rgba(255,255,255,.62); }
.kpmg .link { color: #fff; }
.kpmg .link:hover { color: #9db8ff; }
@media (max-width: 960px) { .kpmg-grid { grid-template-columns: 1fr; } }

/* ---------- FAQ (page Speaker) ---------- */
.faq-grid { display: grid; grid-template-columns: 1fr 1.3fr; gap: clamp(40px, 7vw, 120px); align-items: start; }
.faq-list { border-top: 1px solid var(--ink); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 24px; align-items: baseline; padding: 24px 0; font-size: clamp(18px, 1.6vw, 22px); line-height: 1.35; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; font-size: 24px; font-weight: 300; color: var(--muted); transition: transform .3s var(--ease), color .3s; flex: none; }
.faq-item[open] summary::after { transform: rotate(45deg); color: var(--accent); }
.faq-item summary:hover { color: var(--accent); }
.faq-item p { margin: 0 0 26px; max-width: 60ch; color: #3a3a3a; }
@media (max-width: 960px) { .faq-grid { grid-template-columns: 1fr; } }

/* ---------- Accueil : « Qui est Elon » façon collage (comme la maquette) ---------- */
.verse { text-align: center; padding: clamp(40px, 5vw, 64px) var(--gutter); border-bottom: 1px solid var(--line); background: #fbfbfa; }
.verse::before { content: ""; display: block; width: 90px; height: 1px; background: var(--ink); opacity: .55; margin: 0 auto 26px; }
.verse p { margin: 0; font-family: var(--serif); font-style: italic; font-size: clamp(24px, 2.4vw, 34px); }
.verse span { display: block; margin-top: 14px; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }

.who { background: #fbfbfa; padding: clamp(60px, 8vw, 110px) 0; }
.who-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(40px, 6vw, 110px); align-items: center; max-width: 1400px; }
.who-collage { position: relative; aspect-ratio: 1 / 1.08; width: 100%; max-width: 640px; }
.who-block { position: absolute; background: #ece9e3; }
.who-block--a { left: 0; top: 30%; width: 36%; height: 50%; }
.who-block--b { right: 0; top: 24%; width: 16%; height: 40%; background: #efede8; }
.who-photo { position: absolute; margin: 0; background: transparent; border: 0; box-shadow: 0 8px 26px rgba(30,25,20,.22); overflow: hidden; }
.who-photo img { width: 100%; height: 100%; object-fit: cover; }
.who-photo--a { left: 3%; top: 12%; width: 40%; aspect-ratio: 3 / 4.5; }
.who-photo--b { left: 34%; top: 0; width: 60%; aspect-ratio: 1 / 1.02; }
.who-photo--c { left: 38%; top: 50%; width: 54%; aspect-ratio: 1 / .95; }

.who-eyebrow { display: flex; align-items: center; gap: 18px; margin: 0 0 30px; font-size: 12px; font-weight: 500; letter-spacing: .26em; text-transform: uppercase; color: var(--muted); }
.who-eyebrow span { width: 44px; height: 1px; background: var(--ink); }
.who-text > p { font-size: 17px; line-height: 1.75; color: #222; max-width: 56ch; }
.who-text strong { font-weight: 500; color: #000; }
.who-quote { margin: 34px 0 0; padding: 4px 0 4px 34px; border-left: 3px solid #c5a46d; max-width: 56ch; }
.who-quote p { margin: 0; font-size: 17px; line-height: 1.7; color: #222; }
.who-links { display: flex; gap: 34px; flex-wrap: wrap; margin: 36px 0 0; }
@media (max-width: 960px) {
  .who-grid { grid-template-columns: 1fr; }
  .who-collage { max-width: 560px; margin: 0 auto 20px; }
  }

/* Hero : même police que « ELON ZUMBUA » (Inter Tight) ; section « Qui est Elon » sur fond gris léger */
.hero.hero--portrait .hero-title { font-family: var(--sans); font-weight: 400; font-size: clamp(34px, 3.7vw, 60px); line-height: 1.14; letter-spacing: -.015em; }
.verse, .who { background: #f1f1ef; }
.who-block { background: #e3e2de; }
.who-block--b { background: #e8e7e3; }

/* ---------- Citation (Marc 9:23) : fond blanc, petit format, texte dégradé ---------- */
.verse { background: #fff; padding: clamp(36px, 4.5vw, 60px) var(--gutter); border-bottom: 1px solid var(--line); }
.verse::before { display: none; }
.verse-quote { margin: 0 auto; text-align: center; max-width: 520px; }
.verse .verse-q { display: block; margin-top: 0; letter-spacing: 0; text-transform: none; font-family: Georgia, "Times New Roman", serif; font-weight: 700; font-size: 84px; line-height: 1; height: 38px; overflow: visible; color: #d6d8df; }
.verse .verse-q--close { height: 30px; margin-top: 4px; }
.verse-quote p {
  margin: 8px 0 0; font-family: var(--sans); font-style: normal; font-weight: 600;
  font-size: clamp(24px, 2.6vw, 36px); line-height: 1.18; letter-spacing: -.02em;
  background: none; color: #0a0a0a; -webkit-text-fill-color: #0a0a0a;
}
.verse-quote footer { margin-top: 18px; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: #1b1d22; }
.verse span { display: block; }

/* Citation : sur une ligne, guillemets de part et d'autre */
.verse-quote { max-width: none; display: grid; grid-template-columns: auto auto auto; justify-content: center; align-items: start; column-gap: clamp(14px, 2vw, 26px); }
.verse .verse-q { height: auto; font-size: clamp(60px, 6vw, 84px); line-height: .8; margin: 0; padding-top: .06em; }
.verse .verse-q--close { margin: 0; height: auto; align-self: end; padding: 0; }
.verse-quote p { margin: 0; white-space: nowrap; font-size: clamp(22px, 2.8vw, 38px); align-self: center; }
.verse-quote footer { grid-column: 1 / -1; }
@media (max-width: 600px) { .verse-quote p { white-space: normal; text-align: center; font-size: 22px; } .verse .verse-q { font-size: 52px; } }

/* Citation : guillemets français classiques, même police que le titre du hero */
.verse-quote { display: block; max-width: none; }
.verse-quote p { font-family: var(--sans); font-weight: 400; font-size: clamp(22px, 2.6vw, 36px); line-height: 1.2; letter-spacing: -.015em; white-space: nowrap; color: #0a0a0a; -webkit-text-fill-color: #0a0a0a; align-self: auto; }
@media (max-width: 600px) { .verse-quote p { white-space: normal; font-size: 22px; } }

/* Citation : dégradé noir vers bleu ; section « Qui est Elon » : gris plus léger */
.verse-quote p {
  background: linear-gradient(90deg, #0a0a0a 0%, #0a0a0a 38%, #1d4ed8 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
}
.who { background: #f7f7f6; }
.who { background: #fbfbfa; }
.verse { border-bottom: 0; }

/* Collage « Qui est Elon » : noir et blanc, couleur au survol et au toucher */
.who-photo img { filter: grayscale(1) contrast(1.05); transition: filter .6s var(--ease), transform 1.2s var(--ease); -webkit-tap-highlight-color: transparent; }
.who-photo:hover img, .who-photo:active img, .who-photo:focus-within img { filter: grayscale(0) contrast(1); }

/* ---------- Accueil : « Ses activités » (cartes, comme le modèle) ---------- */
.activities { background: linear-gradient(180deg, #e6e9f0 0%, #dde1ea 100%); padding: clamp(70px, 9vw, 130px) 0; }
.activities .wrap { max-width: 1280px; }
.activities-title { text-align: center; font-family: var(--sans); font-weight: 800; text-transform: uppercase; letter-spacing: .005em; font-size: clamp(40px, 6vw, 84px); line-height: 1; color: #121212; margin: 0 0 clamp(46px, 6vw, 80px); }
.activities-sub { margin: 0 0 22px; font-family: var(--sans); font-weight: 700; text-transform: uppercase; font-size: clamp(20px, 2.2vw, 30px); color: #121212; }
.activities-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(12px, 1.4vw, 20px); }
.act-card { position: relative; display: flex; flex-direction: column; min-height: clamp(220px, 20vw, 290px); padding: 22px 24px 24px; border-radius: 22px; background: rgba(255,255,255,.34); border: 1px solid rgba(255,255,255,.85); box-shadow: 0 1px 0 rgba(255,255,255,.6) inset; transition: transform .45s var(--ease), background .3s var(--ease), box-shadow .45s var(--ease); color: #121212; }
a.act-card:hover { transform: translateY(-4px); background: rgba(255,255,255,.6); box-shadow: 0 18px 40px rgba(40,50,80,.14); }
.act-tag { font-size: 12px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: #5b6070; }
.act-name { margin-top: auto; display: flex; align-items: center; gap: 12px; font-family: var(--sans); font-weight: 700; font-size: clamp(24px, 2.2vw, 32px); letter-spacing: -.02em; line-height: 1.05; }
.act-logo { width: 40px; height: auto; filter: invert(1); }
.act-desc { margin-top: 12px; font-size: 14.5px; line-height: 1.5; color: #444a58; max-width: 30ch; }
.act-arrow { position: absolute; top: 20px; right: 22px; font-size: 18px; color: #5b6070; transition: transform .35s var(--ease), color .3s; }
a.act-card:hover .act-arrow { transform: translate(3px, -3px); color: var(--accent); }
@media (max-width: 1100px) { .activities-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .activities-grid { grid-template-columns: 1fr; } .act-card { min-height: 200px; } }

/* « Ses activités » : fond blanc, style minimaliste du site */
.activities { background: #fff; }
.activities-title { font-weight: 300; text-transform: none; letter-spacing: -.02em; font-size: clamp(34px, 4.2vw, 58px); margin-bottom: 14px; }
.activities-sub { text-align: center; font-family: var(--sans); font-weight: 500; font-size: 12px; letter-spacing: .26em; text-transform: uppercase; color: var(--muted); margin: 0 0 clamp(40px, 5vw, 64px); }
.act-card { background: #fff; border: 1px solid var(--line); border-radius: 0; box-shadow: none; }
a.act-card:hover { transform: none; background: #fff; border-color: var(--ink); box-shadow: none; }
.act-tag { color: var(--muted); }
.act-name { font-weight: 400; letter-spacing: -.015em; }
.act-desc { color: var(--muted); }
.act-arrow { color: var(--muted); }
.act-logo { width: 34px; }

/* « Ses activités » : au repos, uniquement le logo ; au survol, le logo monte et le texte apparaît */
.act-card { --lift: 84px; overflow: hidden; }
.act-tag, .act-arrow { opacity: 0; transform: translateY(-6px); transition: opacity .35s var(--ease), transform .45s var(--ease); }
.act-main { position: absolute; left: 24px; right: 24px; bottom: 24px; display: flex; align-items: flex-end; transition: transform .5s var(--ease); }
.act-logo { display: block; height: auto; filter: none; }
.act-logo--wide { width: min(190px, 82%); }
.act-logo--kin { width: 78px; }
.act-wordmark { font-family: var(--sans); font-weight: 500; font-size: clamp(26px, 2.4vw, 34px); letter-spacing: -.02em; line-height: 1; color: var(--ink); }
.act-desc { position: absolute; left: 24px; right: 24px; bottom: 24px; margin: 0; max-width: none; opacity: 0; transform: translateY(14px); transition: opacity .4s var(--ease) .05s, transform .5s var(--ease) .05s; }
.act-card:hover .act-main, .act-card:focus-visible .act-main, .act-card:active .act-main { transform: translateY(calc(-1 * var(--lift))); }
.act-card:hover .act-desc, .act-card:focus-visible .act-desc, .act-card:active .act-desc { opacity: 1; transform: none; }
.act-card:hover .act-tag, .act-card:hover .act-arrow, .act-card:focus-visible .act-tag, .act-card:focus-visible .act-arrow, .act-card:active .act-tag, .act-card:active .act-arrow { opacity: 1; transform: none; }
.act-card--static:hover { border-color: var(--ink); }
@media (hover: none) {
  /* écrans tactiles : tout est visible, sans effet de survol */
  .act-main { position: static; margin-top: auto; }
  .act-desc { position: static; opacity: 1; transform: none; margin-top: 12px; }
  .act-tag, .act-arrow { opacity: 1; transform: none; }
  .act-card:hover .act-main, .act-card:active .act-main { transform: none; }
}
.act-logo--kin { filter: invert(1); width: 84px; }
@media (hover: none) { .act-main { margin-top: 18px; } .act-logo--wide { width: 170px; } }

/* Cartes : logos centrés, noir et blanc, micro pour Speaker */
.act-card { --lift: 40px; }
.act-main { top: 50%; bottom: auto; left: 24px; right: 24px; justify-content: center; align-items: center; transform: translateY(-50%); }
.act-card:hover .act-main, .act-card:focus-visible .act-main, .act-card:active .act-main { transform: translateY(calc(-50% - var(--lift))); }
.act-desc { text-align: center; left: 22px; right: 22px; }
.act-logo { filter: grayscale(1); }
.act-logo--wide { width: min(170px, 78%); }
.act-logo--kin { filter: invert(1) grayscale(1); width: 84px; }
.act-mic { width: 44px; height: auto; color: var(--ink); }
.act-wordmark { text-align: center; }
@media (hover: none) {
  .act-main { position: static; transform: none; margin: 18px 0 0; justify-content: center; }
  .act-card:hover .act-main, .act-card:active .act-main { transform: none; }
  .act-desc { text-align: center; }
}

/* « Ses activités » : un peu plus d'UI (cartes arrondies, ombres douces, pastilles, flèche en bouton, barre bleue au survol) */
.activities { background: linear-gradient(180deg, #fff 0%, #f6f8fc 100%); }
.activities-title { font-weight: 400; }
.activities-sub { display: table; margin: 0 auto clamp(40px, 5vw, 64px); padding: 8px 18px; border: 1px solid var(--line); border-radius: 999px; background: #fff; letter-spacing: .2em; }
.act-card { border-radius: 22px; border: 1px solid #e7eaf1; background: linear-gradient(180deg, #ffffff 0%, #f8f9fc 100%); box-shadow: 0 1px 2px rgba(20,30,60,.04), 0 10px 28px rgba(20,30,60,.05); transition: transform .5s var(--ease), box-shadow .5s var(--ease), border-color .3s var(--ease); }
a.act-card:hover, .act-card--static:hover { transform: translateY(-6px); background: linear-gradient(180deg, #ffffff 0%, #f8f9fc 100%); border-color: rgba(29,78,216,.35); box-shadow: 0 2px 4px rgba(20,30,60,.04), 0 26px 54px rgba(20,50,120,.16); }
.act-card::after { content: ""; position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--ease); }
.act-card:hover::after { transform: scaleX(1); }
.act-tag { align-self: flex-start; padding: 5px 11px; border-radius: 999px; background: #eef2ff; color: var(--accent); font-weight: 600; letter-spacing: .14em; font-size: 10.5px; }
.act-arrow { top: 16px; right: 16px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; border: 1px solid #dfe3ec; background: #fff; font-size: 15px; color: var(--ink); transition: opacity .35s var(--ease), transform .45s var(--ease), background .3s, color .3s, border-color .3s; }
a.act-card:hover .act-arrow { background: var(--accent); border-color: var(--accent); color: #fff; transform: none; }
.act-logo--wide { width: min(184px, 80%); }
.act-mic { width: 46px; padding: 14px; box-sizing: content-box; border-radius: 50%; background: #f1f4fb; }
.act-desc { color: #596074; }
.act-card { --lift: 34px; min-height: clamp(250px, 21vw, 310px); }
.act-logo--kin { width: 64px; }
.act-logo--wide { width: min(170px, 76%); }
.act-main { top: 48%; }
.act-card:hover .act-main, .act-card:focus-visible .act-main, .act-card:active .act-main { transform: translateY(calc(-50% - var(--lift))); }

/* Logos en couleur */
.act-logo { filter: none; }
.act-logo--kin { filter: none; width: 72px; }
.act-mic { color: var(--accent); }

/* ---------- Page 404 ---------- */
.notfound { min-height: calc(100svh - 260px); display: flex; align-items: center; padding: calc(var(--header-h) + clamp(50px, 9vh, 120px)) 0 clamp(60px, 10vh, 120px); text-align: center; }
.notfound-code { margin: 0; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(110px, 20vw, 280px); line-height: .9; letter-spacing: -.03em; color: #e9e9e7; }
.notfound-title { margin: -.2em 0 22px; font-size: clamp(30px, 4vw, 56px); font-weight: 300; }
.notfound .lead { max-width: 46ch; margin: 0 auto; }
.notfound-actions { display: flex; align-items: center; justify-content: center; gap: 32px; flex-wrap: wrap; margin-top: 38px; }
.notfound-links { list-style: none; margin: 56px 0 0; padding: 22px 0 0; border-top: 1px solid var(--line); display: flex; justify-content: center; gap: clamp(20px, 4vw, 48px); flex-wrap: wrap; }
.notfound-links a { font-size: 13px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); transition: color .3s var(--ease); }
.notfound-links a:hover { color: var(--accent); }

/* Texte réservé aux moteurs de recherche et lecteurs d'écran (liens descriptifs) */
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

/* ===== Ses activités v3 : maquette, 4 logos de même taille optique ===== */
.activities { background: #fbfbfd; padding: clamp(80px, 9vw, 130px) 0; }
.activities .activities-title { font-family: var(--sans); font-weight: 600; font-size: clamp(40px, 4.4vw, 64px); letter-spacing: -.035em; line-height: 1.05; color: #0f1324; text-transform: none; margin: 0 0 18px; }
.activities .activities-sub { display: block; margin: 0 auto clamp(44px, 5vw, 64px); padding: 0; border: 0; border-radius: 0; background: none; text-align: center; font-size: 12.5px; font-weight: 400; letter-spacing: .38em; text-transform: uppercase; color: #6b7287; }
.activities .activities-grid { gap: clamp(14px, 1.4vw, 20px); }
.activities .act-card { border-radius: 18px; border: 1px solid #eceef3; background: #fff; box-shadow: 0 1px 2px rgba(15,19,36,.03), 0 18px 40px rgba(15,19,36,.06); min-height: clamp(220px, 15vw, 240px); }
.activities a.act-card:hover, .activities .act-card--static:hover { background: #fff; }
.activities .act-logo { filter: none; height: auto; max-width: 80%; }
.activities .act-logo--corpo { width: 143px; }
.activities .act-logo--kin { width: 96px; }
.activities .act-logo--speaks { width: 167px; }
.activities .act-logo--bef { width: 106px; }
.activities .act-card { --lift: 44px; }
@media (hover: none) { .activities .act-main { margin-top: 22px; } }

/* ===== Bande « Elon Speaks » ===== */
.es-band { position: relative; overflow: hidden; background: #fff; min-height: clamp(540px, 42vw, 680px); display: flex; align-items: center; }
.es-photo { position: absolute; top: 0; right: 0; width: 72%; height: 100%; object-fit: cover; object-position: 50% 46%; }
.es-band::before { content: ""; position: absolute; top: 0; bottom: 0; left: 28%; width: 38%; background: linear-gradient(90deg, #fff 0%, rgba(255,255,255,.85) 35%, rgba(255,255,255,0) 100%); z-index: 1; pointer-events: none; }
.es-inner { position: relative; z-index: 2; width: 100%; display: flex; justify-content: space-between; align-items: flex-start; gap: 40px; padding-top: clamp(60px, 7vw, 100px); padding-bottom: clamp(60px, 7vw, 100px); }
.es-eyebrow { display: inline-flex; align-items: center; gap: 22px; font-size: 13px; letter-spacing: .32em; text-transform: uppercase; color: #1f2433; }
.es-eyebrow::before { content: ""; width: 52px; height: 1.5px; background: var(--accent); }
.es-title { margin: 30px 0 0; font-family: var(--sans); font-weight: 400; font-size: clamp(46px, 5.6vw, 92px); line-height: 1.02; letter-spacing: -.04em; color: #0f1324; max-width: 9.5em; }
.es-title strong { font-weight: 700; }
.es-title .es-blue { color: var(--accent); }
.es-ctas { display: flex; flex-wrap: wrap; gap: 18px; margin-top: clamp(32px, 3.6vw, 48px); }
.es-btn { display: inline-flex; align-items: center; gap: 18px; padding: 17px 28px; border-radius: 10px; font-size: 13.5px; font-weight: 500; letter-spacing: .02em; text-transform: uppercase; text-decoration: none; transition: background .3s, color .3s, transform .3s var(--ease), box-shadow .3s; }
.es-btn span { transition: transform .3s var(--ease); }
.es-btn:hover span { transform: translateX(4px); }
.es-btn--fill { background: var(--accent); color: #fff; box-shadow: 0 10px 26px rgba(29,78,216,.28); }
.es-btn--fill:hover { background: #1e40af; }
.es-btn--line { border: 1px solid #1f2433; color: #1f2433; background: rgba(255,255,255,.7); }
.es-btn--line:hover { background: #1f2433; color: #fff; }
.es-quote { position: relative; margin: 0; max-width: 250px; padding: 64px 0 0 28px; }
.es-quote::before { content: "\201C"; position: absolute; top: -10px; left: 18px; font-family: var(--serif); font-size: 110px; line-height: 1; color: transparent; -webkit-text-stroke: 1.2px #8d95a8; }
.es-quote p { margin: 0; padding-left: 0; border-left: 0; font-size: 16.5px; line-height: 1.6; color: #1f2433; position: relative; }
.es-quote p::before { content: ""; position: absolute; left: -28px; top: -6px; bottom: 6px; width: 1px; background: #8d95a8; }
@media (max-width: 900px) {
  .es-band { display: block; min-height: 0; }
  .es-photo { position: relative; width: 100%; height: 440px; object-position: 50% 40%; }
  .es-band::before { left: 0; right: 0; width: auto; top: 300px; bottom: auto; height: 141px; background: linear-gradient(180deg, rgba(255,255,255,0), #fff); }
  .es-inner { flex-direction: column; padding-top: 10px; }
  .es-title { font-size: clamp(42px, 11vw, 60px); }
  .es-btn { width: 100%; justify-content: space-between; }
  .es-quote { max-width: none; }
}
.es-title > strong, .es-title > span { display: block; }
.es-title { max-width: none; }
.activities .act-logo--kin { width: 116px; }
@media (min-width: 901px) {
  .es-photo { width: 84%; }
  .es-band::before { left: 0; width: 62%; background: linear-gradient(90deg, #fff 0%, #fff 36%, rgba(255,255,255,.78) 60%, rgba(255,255,255,0) 100%); }
  .es-quote { max-width: 230px; margin-right: clamp(-40px, -2vw, 0px); }
}

/* ===== Bande Elon Speaks : la tête dépasse du cadre ===== */
/* La photo et son détourage partagent exactement la même géométrie ; seule la photo est rognée sous --pop. */
.es-band { --pop: clamp(56px, 6vw, 96px); --sw: min(70vw, 1240px); isolation: isolate; overflow: hidden; padding-top: var(--pop); min-height: calc(clamp(540px, 42vw, 680px) + var(--pop)); }
.es-stage { position: absolute; top: 0; bottom: 0; right: -4vw; width: var(--sw); }
.es-band .es-photo, .es-cut { position: absolute; left: 0; top: calc(14px - var(--sw) * .5286); width: 100%; height: auto; max-width: none; object-fit: fill; }
.es-band .es-photo { z-index: 0; clip-path: inset(calc(var(--pop) - 14px + var(--sw) * .5286) 0 0 0); }
.es-cut { z-index: 2; pointer-events: none; filter: drop-shadow(0 14px 24px rgba(15,19,36,.18)); }
.es-band::before { top: var(--pop); z-index: 1; }
.es-band::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: var(--pop); background: #fff; z-index: 0; }
.es-inner { z-index: 3; align-items: flex-end; }
.es-quote { align-self: flex-end; max-width: 270px; padding: 30px 28px 26px 34px; border-radius: 16px; background: rgba(255,255,255,.82); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 18px 40px rgba(15,19,36,.12); }
.es-quote::before { top: -38px; left: 22px; font-size: 96px; -webkit-text-stroke: 1.2px var(--accent); }
.es-quote p::before { left: -16px; top: 2px; bottom: 2px; background: var(--accent); }
@media (max-width: 900px) {
  .es-band { --sw: 150vw; --pop: 64px; padding-top: 0; }
  .es-stage { position: relative; top: auto; bottom: auto; right: auto; width: 100%; height: 470px; overflow: hidden; }
  .es-band .es-photo, .es-cut { left: -25vw; width: var(--sw); }
  .es-band::after { display: none; }
  .es-band::before { top: 330px; height: 141px; }
  .es-band .es-photo { height: auto; }
  .es-inner { align-items: stretch; }
  .es-quote { align-self: stretch; margin-top: 28px; }
}
@media (min-width: 901px) {
  .es-band::before { display: none; }
  .es-band .es-photo { -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 22%, #000 46%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 22%, #000 46%); }
}
@media (min-width: 901px) { .es-quote { max-width: 240px; margin-right: calc(-1 * clamp(0px, 5vw, 96px)); margin-bottom: -20px; } }

/* Collage « Qui est Elon » : N&B pré-calculés au lieu du filtre CSS grayscale (qui faisait « déchirer » les images dans Chrome) ; couleur au survol par fondu ; angles arrondis */
.who-photo { border-radius: 18px; }
.who-photo img, .who-photo:hover img, .who-photo:active img, .who-photo:focus-within img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: none; transition: none; }
.who-photo .who-nb { z-index: 1; transition: opacity .6s var(--ease); }
.who-photo:hover .who-nb, .who-photo:active .who-nb, .who-photo:focus-within .who-nb { opacity: 0; }
/* Survol du collage : la photo survolée passe devant les autres et se soulève ; elle ne repasse derrière qu'une fois revenue en place */
.who-photo--a { z-index: 1; } .who-photo--b { z-index: 2; } .who-photo--c { z-index: 3; }
.who-photo { cursor: pointer; transition: transform .55s var(--ease), box-shadow .55s var(--ease), z-index 0s linear .55s; }
.who-photo:hover, .who-photo:active, .who-photo:focus-visible { z-index: 10; transform: translateY(-8px) scale(1.04); box-shadow: 0 26px 60px rgba(15,19,36,.32); transition: transform .55s var(--ease), box-shadow .55s var(--ease), z-index 0s; }
.who-photo:focus { outline: none; }
@media (prefers-reduced-motion: reduce) { .who-photo:hover, .who-photo:active, .who-photo:focus-visible { transform: none; } }

/* Bande Elon Speaks : zone blanche à droite pour la citation (comme la maquette) */
@media (min-width: 901px) {
  .es-band { --sw: min(59.5vw, 1060px); }
  .es-stage { right: 4.25vw; }
  .es-band .es-photo { -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 22%, #000 44%, #000 72%, transparent 94%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 22%, #000 44%, #000 72%, transparent 94%); }
  .es-inner { align-items: flex-start; }
  .es-quote { align-self: flex-start; margin: clamp(10px, 2vw, 30px) calc(-1 * clamp(0px, 5vw, 96px)) 0 0; }
}
.es-quote { max-width: 250px; padding: 64px 0 0 28px; border-radius: 0; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; }
.es-quote::before { top: -6px; left: 18px; font-size: 110px; -webkit-text-stroke: 1.2px #8d95a8; }
.es-quote p::before { left: -28px; top: -6px; bottom: 6px; background: #8d95a8; }
@media (min-width: 901px) {
  .es-band { --sw: min(52.5vw, 940px); }
  .es-stage { right: 9.2vw; }
  .es-band .es-photo { -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 22%, #000 44%, #000 76%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 22%, #000 44%, #000 76%, transparent 100%); }
  .es-quote { position: absolute; z-index: 3; right: clamp(24px, 3.5vw, 64px); top: calc(var(--pop) + clamp(30px, 4vw, 70px)); margin: 0; max-width: 240px; }
}
@media (min-width: 901px) {
  .es-band > .es-quote { position: absolute; z-index: 4; right: clamp(24px, 4vw, 80px); top: calc(var(--pop) + clamp(40px, 5vw, 80px)); margin: 0; max-width: 230px; }
}
@media (max-width: 900px) {
  .es-band > .es-quote { margin: 28px 16px 40px; max-width: none; }
}
/* Voile blanc derrière la citation : il blanchit seulement le décor (le détourage d'Elon passe au-dessus) */
.es-wash { display: none; }
@media (min-width: 901px) {
  .es-wash { display: block; position: absolute; z-index: 1; top: 0; right: calc(-1 * 9.2vw); width: calc(9.2vw + 30vw); height: 100%; pointer-events: none;
    background: radial-gradient(ellipse 70% 55% at 72% 34%, #fff 0%, rgba(255,255,255,.96) 38%, rgba(255,255,255,.6) 62%, rgba(255,255,255,0) 82%); }
}

/* Activités : au survol le logo monte ET rétrécit pour ne jamais toucher l'étiquette ni le texte */
@media (hover: hover) {
  .activities .act-card { min-height: clamp(270px, 19vw, 300px); --lift: 18px; }
  .activities .act-main { top: 47%; }
  .activities .act-logo { transition: transform .5s var(--ease); transform-origin: center; }
  .activities .act-card:hover .act-logo, .activities .act-card:focus-visible .act-logo { transform: scale(.74); }
  .activities .act-desc { font-size: 14px; line-height: 1.45; bottom: 22px; }
}
/* Téléphone : cartes en 2 colonnes, plus compactes, logos plus petits */
@media (max-width: 600px) {
  .activities .activities-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .activities .act-card { min-height: 0; padding: 14px 12px 16px; border-radius: 14px; }
  .activities .act-tag { font-size: 9px; padding: 4px 8px; letter-spacing: .1em; }
  .activities .act-arrow { display: none; }
  .activities .act-main { margin: 14px 0 0; min-height: 70px; display: flex; align-items: center; justify-content: center; }
  .activities .act-logo--corpo { width: 96px; }
  .activities .act-logo--kin { width: 66px; }
  .activities .act-logo--speaks { width: 110px; }
  .activities .act-logo--bef { width: 64px; }
  .activities .act-desc { font-size: 12px; line-height: 1.4; margin-top: 10px; }
  .activities .activities-sub { font-size: 10.5px; letter-spacing: .26em; }
}
/* Téléphone : texte et logos des activités un cran plus petits */
@media (max-width: 600px) {
  .activities .act-desc { font-size: 10.5px; line-height: 1.4; }
  .activities .act-tag { font-size: 8px; }
  .activities .act-main { min-height: 60px; }
  .activities .act-logo--corpo { width: 82px; }
  .activities .act-logo--kin { width: 56px; }
  .activities .act-logo--speaks { width: 94px; }
  .activities .act-logo--bef { width: 54px; }
}

/* Hero : 2 boutons (Booker Elon / Travailler avec Elon) */
.hero.hero--portrait .hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.btn--outline-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.75); }
.btn--outline-light:hover { background: #fff; color: var(--ink); border-color: #fff; }
@media (max-width: 600px) { .hero.hero--portrait .hero-actions { gap: 10px; } }
/* Citation Elon Speaks : un seul grand guillemet, sans « » dans le texte */
.es-band .es-quote { padding-top: 96px; }
.es-band .es-quote::before { top: -34px; left: 10px; font-size: 190px; line-height: 1; -webkit-text-stroke: 1.5px var(--accent); color: transparent; }
@media (max-width: 900px) { .es-band .es-quote { padding-top: 84px; } .es-band .es-quote::before { font-size: 160px; top: -26px; } }

/* « Qui est Elon Zumbua ? » est un H2 (SEO) mais garde l'apparence du surtitre */
h2.who-eyebrow { font-family: var(--sans); font-size: 12px; font-weight: 500; line-height: 1.4; letter-spacing: .26em; text-transform: uppercase; color: var(--muted); margin: 0 0 30px; max-width: none; }

/* Bande « Booking » de bas de page : plus compacte */
.section.cta-final { padding: clamp(56px, 6vw, 88px) 0; }
.cta-final .display { font-size: clamp(30px, 3.4vw, 48px); max-width: 20ch; margin: 14px auto 28px; }

/* Nouveau logo Kin Consult (horizontal) */
.activities .act-logo--kin { width: 150px; }
.logo-kin { width: 220px; height: auto; }
@media (max-width: 600px) { .activities .act-logo--kin { width: 92px; } .logo-kin { width: 170px; } }

/* Bande « Pourquoi travailler avec Elon ? » (remplace « L'avenir se construit… ») */
.es-band h2.es-eyebrow { margin: 0; font-family: var(--sans); font-size: 13px; font-weight: 400; line-height: 1.4; letter-spacing: .32em; text-transform: uppercase; color: #1f2433; }
.why-list { list-style: none; margin: clamp(30px, 3.5vw, 48px) 0 0; padding: 0; max-width: 640px; }
.why-list li { display: grid; grid-template-columns: 74px 1fr; gap: 0; padding: clamp(22px, 2.4vw, 34px) 0; border-bottom: 1px solid #e3e6ee; }
.why-list li:first-child { padding-top: 0; }
.why-list li:last-child { border-bottom: 0; }
.why-n { font-size: clamp(22px, 2vw, 28px); font-weight: 600; color: #c9cdd8; line-height: 1.3; }
.why-list h3 { margin: 0 0 10px; font-family: var(--sans); font-size: clamp(22px, 2.1vw, 30px); font-weight: 700; letter-spacing: -.025em; line-height: 1.2; color: #0f1324; }
.why-list .es-blue { color: var(--accent); }
.why-list p { margin: 0; font-size: 15.5px; line-height: 1.6; color: #596074; max-width: 46ch; }
.es-band > .es-quote p { font-size: 17px; }
.es-sign { margin-top: 18px; font-family: "Mrs Saint Delafield", cursive; font-size: 46px; line-height: 1; color: #0f1324; transform: rotate(-6deg); transform-origin: left; }
@media (max-width: 900px) {
  .why-list li { grid-template-columns: 48px 1fr; }
  .why-list h3 { font-size: 22px; }
  .why-list p { font-size: 14.5px; }
}
@media (max-width: 600px) { .es-band h2.es-eyebrow { font-size: 11px; letter-spacing: .18em; gap: 14px; } .es-band h2.es-eyebrow::before { width: 32px; } }
/* Texte « Pourquoi travailler avec Elon ? » : colonne sur fond blanc, sans chevaucher la photo */
@media (min-width: 901px) {
  .es-band .es-photo { -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 28%, rgba(0,0,0,.5) 40%, #000 52%, #000 76%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0%, transparent 28%, rgba(0,0,0,.5) 40%, #000 52%, #000 76%, transparent 100%); }
  .es-band .es-text { max-width: min(600px, 40vw); }
  .why-list { max-width: none; }
  .why-list h3 { font-size: clamp(19px, 1.6vw, 26px); white-space: normal; }
  .why-list li { grid-template-columns: 64px 1fr; }
  .why-list p { font-size: 15px; max-width: 44ch; }
}
/* Comme la maquette : à gauche, la photo se fond dans le blanc par un flou progressif (couche floutée + photo nette qui prend le relais) */
.es-photo--blur { display: none; }
@media (min-width: 901px) {
  .es-band .es-photo--blur { display: block; z-index: 0; filter: blur(10px) saturate(1.05); opacity: .9;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 12%, rgba(0,0,0,.8) 28%, #000 40%, #000 76%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 12%, rgba(0,0,0,.8) 28%, #000 40%, #000 76%, transparent 100%); }
  .es-band .es-photo:not(.es-photo--blur) {
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 30%, rgba(0,0,0,.6) 42%, #000 54%, #000 76%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0%, transparent 30%, rgba(0,0,0,.6) 42%, #000 54%, #000 76%, transparent 100%); }
  .es-band .es-text { max-width: min(640px, 44vw); }
}
/* Descriptions d'activités plus longues : cartes plus hautes */
@media (hover: hover) {
  .activities .act-card { min-height: clamp(300px, 22vw, 330px); --lift: 34px; }
  .activities .act-desc { font-size: 13.5px; }
}
/* Logos des activités réduits (~15 %) */
.activities .act-logo--corpo { width: 122px; }
.activities .act-logo--kin { width: 128px; }
.activities .act-logo--speaks { width: 142px; }
.activities .act-logo--bef { width: 90px; }
@media (max-width: 600px) {
  .activities .act-logo--corpo { width: 70px; }
  .activities .act-logo--kin { width: 78px; }
  .activities .act-logo--speaks { width: 80px; }
  .activities .act-logo--bef { width: 46px; }
}

/* Notre impact en chiffres */
.stats { background: #fbfbfd; padding: 0 0 clamp(80px, 9vw, 130px); }
.stats-title { margin: 0 0 clamp(36px, 4vw, 56px); text-align: center; font-family: var(--sans); font-weight: 600; font-size: clamp(34px, 3.8vw, 56px); letter-spacing: -.035em; line-height: 1.05; color: #0f1324; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(14px, 1.4vw, 20px); }
.stat-card { background: #fff; border: 1px solid #eceef3; border-radius: 18px; box-shadow: 0 1px 2px rgba(15,19,36,.03), 0 18px 40px rgba(15,19,36,.06); padding: clamp(26px, 2.6vw, 40px); }
.stat-num { margin: 0 0 10px; font-family: var(--sans); font-weight: 700; font-size: clamp(38px, 3.6vw, 56px); letter-spacing: -.04em; line-height: 1; color: #0f1324; white-space: nowrap; }
.stat-label { margin: 0 0 6px; font-size: 12.5px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; line-height: 1.5; color: #0f1324; }
.stat-sub { margin: 0; font-size: 15px; line-height: 1.5; color: #7a8196; }
@media (max-width: 1000px) { .stats-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) {
  .stats-grid { gap: 10px; }
  .stat-card { padding: 18px 14px; border-radius: 14px; }
  .stat-num { font-size: 30px; }
  .stat-label { font-size: 9.5px; letter-spacing: .14em; }
  .stat-sub { font-size: 12px; }
}
/* Chiffres : dans la direction du site (Inter Tight léger, accent bleu discret, filet comme les cartes) */
.stats .stats-title { font-weight: 600; }
.stat-card { position: relative; overflow: hidden; }
.stat-card::before { content: ""; position: absolute; left: clamp(26px, 2.6vw, 40px); top: 0; width: 34px; height: 3px; background: var(--accent); border-radius: 0 0 3px 3px; }
.stat-num { font-weight: 300; letter-spacing: -.045em; font-size: clamp(42px, 4vw, 62px); }
.stat-plus { color: var(--accent); font-weight: 300; margin-left: 2px; }
.stat-label { font-weight: 500; letter-spacing: .26em; font-size: 12px; color: #1f2433; }
.stat-sub { color: var(--muted); font-size: 14.5px; }
@media (max-width: 600px) { .stat-num { font-size: 32px; } .stat-card::before { left: 14px; } }

.stat-card::before { display: none; }
/* Flèches des cartes d'activités : sans cercle */
.activities .act-arrow { border: 0; background: none; border-radius: 0; width: auto; height: auto; font-size: 18px; color: var(--ink); }
.activities a.act-card:hover .act-arrow { background: none; color: var(--accent); transform: translateX(3px); }

/* Chiffres placés après « Pourquoi travailler avec Elon ? » */
.stats { padding-top: clamp(80px, 9vw, 130px); }

/* « Qui est Elon Zumbua ? » légèrement plus soutenu que « Ses activités » */
.who { background: #f3f3f1; }
/* Animation des chiffres : chiffres tabulaires (pas de saut de largeur), « + » qui apparaît à la fin, légère montée de la carte */
.stat-num { font-variant-numeric: tabular-nums; }
.stat-plus { display: inline-block; opacity: 0; transform: translateY(6px) scale(.7); transition: opacity .4s var(--ease), transform .5s var(--ease); }
.stat-card.is-done .stat-plus { opacity: 1; transform: none; }
.stat-card { transition: transform .6s var(--ease), box-shadow .6s var(--ease); }
.stat-card.is-done { box-shadow: 0 1px 2px rgba(15,19,36,.03), 0 22px 48px rgba(29,78,216,.08); }
.stat-card:hover { transform: translateY(-4px); }
@media (prefers-reduced-motion: reduce) { .stat-plus { opacity: 1; transform: none; transition: none; } }

/* ===== Bande Instagram (remplace la galerie) : deux téléphones + texte, dans la DA du site ===== */
.ig-band { background: linear-gradient(180deg, #f4f5f8 0%, #eceef3 100%); padding: clamp(70px, 8vw, 120px) 0; overflow: hidden; }
.ig-inner { display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; gap: clamp(30px, 5vw, 80px); }
.ig-visual { position: relative; height: clamp(460px, 42vw, 600px); }
.ig-disc { position: absolute; left: 50%; top: 50%; width: 82%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(circle at 40% 35%, #fff 0%, rgba(255,255,255,.75) 55%, rgba(255,255,255,0) 72%); }
.phone { position: absolute; width: clamp(200px, 17vw, 250px); aspect-ratio: 9 / 19; border-radius: 38px; background: #0f1324; padding: 9px; box-shadow: 0 30px 60px rgba(15,19,36,.28), inset 0 0 0 2px #2a2f40; }
.phone::before { content: ""; position: absolute; top: 16px; left: 50%; width: 32%; height: 20px; transform: translateX(-50%); border-radius: 20px; background: #0f1324; z-index: 3; }
.phone-screen { width: 100%; height: 100%; border-radius: 30px; overflow: hidden; background: #fff; font-family: var(--sans); color: #0f1324; padding-top: 42px; }
.phone--front { left: 6%; bottom: 0; transform: rotate(-8deg); z-index: 2; }
.phone--back { right: 4%; top: 0; transform: rotate(12deg); z-index: 1; }
.ig-top { padding: 0 14px 8px; border-bottom: 1px solid #eef0f4; }
.ig-handle { font-size: 12px; font-weight: 600; }
.ig-profile { display: flex; align-items: center; gap: 16px; padding: 12px 14px 6px; }
.ig-av { width: 58px; height: 58px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--accent); }
.ig-stats { display: flex; flex-direction: column; line-height: 1.2; }
.ig-stats strong { font-size: 15px; font-weight: 600; }
.ig-stats span { font-size: 10px; color: var(--muted); }
.ig-name { margin: 4px 14px 0; font-size: 11.5px; font-weight: 600; }
.ig-bio { margin: 2px 14px 8px; font-size: 10px; color: var(--muted); }
.ig-follow { display: block; margin: 0 14px 10px; padding: 6px 0; border-radius: 8px; background: var(--accent); color: #fff; font-size: 10.5px; font-weight: 600; text-align: center; }
.ig-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; }
.ig-grid img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
.ig-post-head { display: flex; align-items: center; gap: 8px; padding: 8px 12px; font-size: 11px; font-weight: 600; }
.ig-av-s { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; }
.ig-post-img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; display: block; }
.ig-actions { display: flex; gap: 12px; padding: 8px 12px 2px; font-size: 14px; }
.ig-caption { margin: 0; padding: 4px 12px; font-size: 10px; line-height: 1.45; color: #3b4152; }
.ig-title { margin: 0; font-family: var(--sans); font-weight: 600; font-size: clamp(40px, 4.6vw, 72px); line-height: 1.02; letter-spacing: -.04em; text-transform: uppercase;
  background: linear-gradient(100deg, #0a0a0a 0%, #0f1324 45%, var(--accent) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ig-lead { margin: 26px 0 32px; max-width: 46ch; font-size: clamp(16px, 1.25vw, 18.5px); line-height: 1.65; color: #3b4152; }
.ig-btn { display: inline-flex; align-items: center; gap: 16px; padding: 16px 28px; border-radius: 10px; background: #fff; border: 1px solid #dfe3ec; color: var(--ink); font-size: 13.5px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; box-shadow: 0 10px 26px rgba(15,19,36,.08); transition: background .3s, color .3s, border-color .3s; }
.ig-btn:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
@media (max-width: 900px) {
  .ig-inner { grid-template-columns: 1fr; }
  .ig-visual { height: 470px; max-width: 420px; margin: 0 auto; width: 100%; }
  .phone { width: 200px; }
  .ig-text { text-align: left; }
}
@media (max-width: 420px) { .phone { width: 170px; border-radius: 32px; } .phone-screen { border-radius: 25px; } .ig-visual { height: 400px; } }

/* Grand guillemet de la citation retiré */
.es-band .es-quote::before { display: none; }
.es-band .es-quote, .es-band > .es-quote { padding-top: 0; }
/* Halo bleu léger derrière « Son impact en chiffres » */
.stats .wrap { position: relative; }
.stats .stats-title { position: relative; z-index: 1; }
.stats .stats-title::before { content: ""; position: absolute; z-index: -1; left: 50%; top: 50%; width: min(620px, 90%); height: 170%; transform: translate(-50%, -50%); border-radius: 50%; background: radial-gradient(ellipse at center, rgba(29,78,216,.16) 0%, rgba(29,78,216,.07) 45%, rgba(29,78,216,0) 72%); filter: blur(12px); pointer-events: none; }
.stats .stats-title::before { background: radial-gradient(ellipse at center, rgba(29,78,216,.30) 0%, rgba(29,78,216,.13) 42%, rgba(29,78,216,0) 72%); }
.stats .stats-title::before { background: radial-gradient(ellipse at center, rgba(29,78,216,.12) 0%, rgba(29,78,216,.05) 42%, rgba(29,78,216,0) 72%); }
.stats .stats-title::before { background: radial-gradient(ellipse at center, rgba(29,78,216,.06) 0%, rgba(29,78,216,.025) 42%, rgba(29,78,216,0) 72%); }


/* ===== Chiffres : cadre vivant (liseré lumineux qui tourne), texte plus petit, chiffres centrés ===== */
@property --angle { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.stats .stat-card { text-align: center; }
.stats .stat-card::before { display: block; content: ""; position: absolute; inset: 0; left: 0; top: 0; width: auto; height: auto; padding: 1.5px; border-radius: inherit; pointer-events: none;
  background: conic-gradient(from var(--angle), transparent 0deg, transparent 250deg, rgba(29,78,216,.15) 280deg, var(--accent) 330deg, #60a5fa 352deg, transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
          mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  opacity: 0; transition: opacity .8s var(--ease); animation: statSpin 6s linear infinite; }
.stats .stat-card.is-done::before { opacity: .85; }
.stats .stat-card:nth-child(2)::before { animation-delay: -1.5s; }
.stats .stat-card:nth-child(3)::before { animation-delay: -3s; }
.stats .stat-card:nth-child(4)::before { animation-delay: -4.5s; }
.stats .stat-card:hover::before { opacity: 1; animation-duration: 3s; }
@keyframes statSpin { to { --angle: 360deg; } }
.stats .stat-num { display: flex; justify-content: center; align-items: baseline; transform-origin: center; }
.stats .stat-label { font-size: 10.5px; letter-spacing: .22em; }
.stats .stat-sub { font-size: 13px; }
@media (max-width: 600px) { .stats .stat-label { font-size: 9px; letter-spacing: .14em; } .stats .stat-sub { font-size: 11px; } }
@media (prefers-reduced-motion: reduce) { .stats .stat-card::before { animation: none; opacity: .35; } }

/* Bande Instagram : un seul iPhone (style 18 Pro) avec la vraie capture du compte */
.ig-visual { display: grid; place-items: center; }
.iphone { position: relative; display: block; width: clamp(250px, 21vw, 310px); aspect-ratio: 9 / 19.5; border-radius: 52px; padding: 11px;
  background: linear-gradient(145deg, #3a3d44 0%, #1c1e22 35%, #2b2d33 70%, #45484f 100%);
  box-shadow: inset 0 0 0 1.5px #5a5e66, inset 0 0 0 4px #121316, 0 40px 80px rgba(15,19,36,.32), 0 10px 24px rgba(15,19,36,.18);
  transform: rotate(-6deg); transition: transform .6s var(--ease); z-index: 1; }
.iphone:hover { transform: rotate(-3deg) translateY(-6px); }
.iphone-screen { position: relative; display: block; width: 100%; height: 100%; border-radius: 42px; overflow: hidden; background: #000; }
.iphone-screen img { position: absolute; top: 44px; left: 0; width: 100%; height: calc(100% - 44px); object-fit: cover; object-position: top; }
.iphone-status { position: absolute; top: 0; left: 0; right: 0; height: 44px; display: flex; align-items: center; justify-content: space-between; padding: 0 26px; color: #fff; font: 600 13px/1 var(--sans); z-index: 2; }
.iphone-island { position: absolute; left: 50%; top: 10px; width: 30%; height: 26px; transform: translateX(-50%); border-radius: 20px; background: #000; box-shadow: 0 0 0 1px #111; }
.iphone-icons { font-size: 8px; letter-spacing: 1px; }
.iphone-btn { position: absolute; width: 3px; border-radius: 2px; background: #2b2d33; }
.iphone-btn--action { left: -3px; top: 17%; height: 4%; }
.iphone-btn--vol1 { left: -3px; top: 24%; height: 8%; }
.iphone-btn--vol2 { left: -3px; top: 34%; height: 8%; }
.iphone-btn--power { right: -3px; top: 28%; height: 12%; }
@media (max-width: 900px) { .ig-visual { height: auto; padding: 20px 0 10px; } .iphone { width: 240px; } }

.iphone-screen img { object-fit: cover; object-position: top center; }
.ig-visual { height: auto; padding: 20px 0; }


/* ================= Système accueil : cohérence typo / couleurs / composants ================= */
/* Fonds : alternance blanc / soft froid, un seul rythme vertical */
.who { background: var(--soft); }
.activities, .es-band, .ig-band { background: var(--bg); }
.stats { background: var(--soft); padding: clamp(80px, 9vw, 130px) 0; }
.who, .activities, .ig-band { padding-top: clamp(80px, 9vw, 130px); padding-bottom: clamp(80px, 9vw, 130px); }
.es-band { border-top: 1px solid var(--line); }
.es-band::after { background: var(--bg); }

/* Titres H2 de section : un seul style */
.activities .activities-title, .stats .stats-title, .ig-title {
  font-family: var(--sans); font-weight: 600; font-size: clamp(34px, 3.8vw, 56px); letter-spacing: -.035em; line-height: 1.05;
  color: var(--ink); text-transform: none; background: none; -webkit-background-clip: border-box; background-clip: border-box; }
.ig-title span { color: var(--accent); }

/* Surtitres : un seul style (12 px, .3em, muted, trait bleu 40 px) */
h2.who-eyebrow, .es-band h2.es-eyebrow, .activities .activities-sub, .cta-final .eyebrow {
  display: inline-flex; align-items: center; gap: 16px; font-family: var(--sans); font-size: 12px; font-weight: 500; letter-spacing: .3em; text-transform: uppercase; line-height: 1.4; color: var(--muted); }
.who-eyebrow span { width: 40px; height: 1.5px; background: var(--accent); }
.es-band h2.es-eyebrow::before { width: 40px; height: 1.5px; }
.activities .activities-sub::before, .cta-final .eyebrow::before { content: ""; width: 40px; height: 1.5px; background: var(--accent); }
.activities .activities-sub { display: flex; justify-content: center; margin: 0 auto clamp(44px, 5vw, 64px); }
.cta-final .eyebrow { color: #a3a8b8; justify-content: center; }

/* Textes courants */
.who-text p, .why-list p, .ig-lead, .es-band > .es-quote p { color: var(--text); }
.who-text p { font-size: 16px; line-height: 1.7; }
.stat-sub, .act-desc { color: var(--muted); }
.stat-num, .stat-label, .why-list h3, .es-title, .es-sign { color: var(--ink); }
.why-n { color: #c9cdd8; }

/* Boutons : un seul système (rayon 10, 54 px, 13 px, .14em) */
.btn, .es-btn, .ig-btn { border-radius: 10px; min-height: 54px; font-size: 13px; font-weight: 500; letter-spacing: .14em; }
.cta-final .btn, .cta-final .btn--light { background: var(--accent); border-color: var(--accent); color: #fff; }
.cta-final .btn:hover { background: #fff; border-color: #fff; color: var(--ink); }
.ig-btn { background: transparent; border: 1px solid var(--ink); color: var(--ink); box-shadow: none; padding: 0 28px; }
.ig-btn:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.cta-final { background: var(--ink); }

/* Cartes : même bordure, ombre, rayon, survol */
.activities .act-card, .stat-card { border-radius: 18px; border-color: var(--line); box-shadow: 0 1px 2px rgba(15,19,36,.03), 0 18px 40px rgba(15,19,36,.06); }
.activities a.act-card:hover, .activities .act-card--static:hover, .stat-card:hover { transform: translateY(-4px); box-shadow: 0 2px 4px rgba(15,19,36,.04), 0 26px 54px rgba(15,19,36,.10); }

.who-quote { border-left-color: var(--accent) !important; }
.who-quote p, .who-quote strong { color: var(--ink); }

/* Photos N&B des pages intérieures : N&B pré-calculé + couleur révélée au survol (plus de filtre CSS) */
.bw, .figure:hover .bw, .hero:hover .bw { filter: none; }
.bw-pair { position: relative; display: block; width: 100%; height: 100%; }
.bw-pair > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.bw-pair .bw-col { position: absolute; inset: 0; opacity: 0; transition: opacity .7s var(--ease); }
@media (hover: hover) { .figure:hover .bw-col, .bw-pair:hover .bw-col, .hero:hover .bw-col { opacity: 1; } }
.bw-pair:active .bw-col { opacity: 1; }
.figure .bw-pair > img { transition: transform 1.2s var(--ease), opacity .7s var(--ease); }
.figure:hover .bw-pair > img { transform: scale(1.025); }

/* ================= Système appliqué aux pages intérieures ================= */
/* Titres */
.display { font-family: var(--sans); font-weight: 600; font-size: clamp(38px, 5vw, 72px); letter-spacing: -.04em; line-height: 1.02; }
.h2 { font-family: var(--sans); font-weight: 600; font-size: clamp(32px, 3.6vw, 52px); letter-spacing: -.035em; line-height: 1.05; color: var(--ink); }
.cta-final .display { color: #fff; }
.name-serif, .kpmg-title { font-family: var(--sans); font-style: normal; font-weight: 600; letter-spacing: -.04em; line-height: 1.05; }
.lead { font-weight: 400; color: var(--text); }
.kpmg .lead, .kpmg-body .lead { color: rgba(255,255,255,.85); }
/* Surtitres : 12 px, .3em, gris, trait bleu */
.eyebrow { display: flex; align-items: center; gap: 16px; font-size: 12px; font-weight: 500; letter-spacing: .3em; color: var(--muted); }
.eyebrow::before { content: ""; flex: none; width: 40px; height: 1.5px; background: var(--accent); }
.kpmg-eyebrow { letter-spacing: .3em; }
.kpmg-eyebrow::before { width: 40px; height: 1.5px; }
.cta-final .eyebrow { justify-content: center; }
/* Listes, filets, FAQ : filets gris doux, titres en ink 600 */
.numbered, .specs, .faq-list { border-top-color: var(--line); }
.numbered li { border-color: var(--line); }
.numbered .n { color: #c9cdd8; font-weight: 600; letter-spacing: .05em; font-size: 15px; }
.numbered h3 { font-weight: 600; letter-spacing: -.025em; color: var(--ink); }
.numbered p, .numbered ul.points li, .faq-item p { color: var(--text); }
.numbered ul.points li::before { background: var(--accent); }
.specs dd { font-weight: 500; color: var(--ink); }
.faq-item summary { font-weight: 500; color: var(--ink); }
/* Photos : coins arrondis comme l'accueil */
.figure, .bw-pair { border-radius: 18px; overflow: hidden; }
/* Formulaire : carte comme l'accueil */
#booking .form, .form-success { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: clamp(24px, 3vw, 44px); box-shadow: 0 1px 2px rgba(15,19,36,.03), 0 18px 40px rgba(15,19,36,.06); }
/* Bouton principal = bleu partout (comme le Booking de l'accueil) */
.btn:not(.btn--light):not(.btn--ghost):not(.btn--outline-light) { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn:not(.btn--light):not(.btn--ghost):not(.btn--outline-light):hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.btn--ghost { border-color: var(--ink); color: var(--ink); }
/* Derniers écarts des pages intérieures */
.wordmark, .notfound-title { font-weight: 600; letter-spacing: -.04em; }
.wordmark { font-size: clamp(48px, 7vw, 104px); }
.about-eyebrow { display: flex; align-items: center; gap: 16px; font-size: 12px; font-weight: 500; letter-spacing: .3em; color: var(--muted); }
.about-eyebrow::before { content: ""; flex: none; width: 40px; height: 1.5px; background: var(--accent); }
.years { font-family: var(--sans); font-weight: 300; letter-spacing: -.05em; }
.milestones strong { font-family: var(--sans); font-weight: 300; letter-spacing: -.045em; }
.chapter-quote p, .intro-statement { font-family: var(--sans); font-style: normal; font-weight: 400; letter-spacing: -.02em; color: var(--ink); }
.chapter-line { background: var(--accent); }
.years, .years * { font-style: normal; }

/* ===== Booking : toggle Conférence / Coaching 1-1 ===== */
.bk-toggle { position: relative; display: inline-flex; gap: 0; padding: 6px; margin-bottom: clamp(28px, 3vw, 40px); background: #fff; border: 1px solid var(--line); border-radius: 999px; box-shadow: 0 1px 2px rgba(15,19,36,.03), 0 12px 30px rgba(15,19,36,.07); }
.bk-toggle button { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 9px; padding: 13px 22px; border: 0; background: none; border-radius: 999px; cursor: pointer;
  font: 500 12.5px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink); transition: color .35s var(--ease); white-space: nowrap; }
.bk-toggle button[aria-selected="false"]:hover { color: var(--accent); }
.bk-toggle button[aria-selected="true"] { color: #fff; }
.bk-toggle button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.bk-thumb { position: absolute; z-index: 0; left: 6px; top: 6px; bottom: 6px; width: 0; border-radius: 999px; background: var(--accent);
  box-shadow: 0 8px 20px rgba(29,78,216,.32); transition: transform .45s cubic-bezier(.2,.9,.25,1.1), width .45s cubic-bezier(.2,.9,.25,1.1); }
.bk-panel.bk-in, .bk-intro:not([hidden]) { animation: bkIn .45s var(--ease); }
@keyframes bkIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.bk-panel[hidden], .bk-intro[hidden] { display: none !important; }

/* Formules */
.bk-plans, .bk-format { border: 0; padding: 0; margin: 0; min-width: 0; }
.bk-plans legend, .bk-format legend { padding: 0; margin-bottom: 12px; font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--muted); }
.bk-plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.bk-plans legend { grid-column: 1 / -1; }
.bk-plan { position: relative; cursor: pointer; display: block; }
.bk-plan input, .bk-chips input { position: absolute; opacity: 0; pointer-events: none; }
.bk-plan-box { position: relative; display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 18px 16px 16px; border: 1px solid var(--line); border-radius: 14px; background: #fff;
  transition: border-color .25s, background .25s, box-shadow .25s, transform .25s var(--ease); }
.bk-plan:hover .bk-plan-box { border-color: rgba(29,78,216,.4); transform: translateY(-2px); }
.bk-plan strong { font-size: 15.5px; font-weight: 600; letter-spacing: -.01em; color: var(--ink); padding-right: 22px; }
.bk-plan-desc { font-size: 13px; line-height: 1.45; color: var(--muted); }
.bk-plan-price { margin-top: auto; padding-top: 8px; font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--accent); }
.bk-plan-check { position: absolute; top: 14px; right: 14px; width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid #cfd4df; display: grid; place-items: center; font-size: 11px; color: transparent; transition: all .25s; }
.bk-badge { align-self: flex-start; margin-bottom: 2px; padding: 4px 9px; border-radius: 999px; background: #eef2ff; color: var(--accent); font-size: 9.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.bk-plan input:checked + .bk-plan-box { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent), 0 14px 30px rgba(29,78,216,.12); background: #f7f9ff; }
.bk-plan input:checked + .bk-plan-box .bk-plan-check { background: var(--accent); border-color: var(--accent); color: #fff; }
.bk-plan input:focus-visible + .bk-plan-box { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Format : petites pilules */
.bk-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.bk-chips label { position: relative; cursor: pointer; }
.bk-chips span { display: inline-block; padding: 10px 16px; border: 1px solid var(--line); border-radius: 999px; font-size: 13.5px; color: var(--ink); transition: all .25s; }
.bk-chips label:hover span { border-color: var(--accent); color: var(--accent); }
.bk-chips input:checked + span { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 6px 16px rgba(29,78,216,.25); }
.bk-chips input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }

@media (max-width: 760px) { .bk-plans { grid-template-columns: 1fr; } }
@media (max-width: 420px) { .bk-toggle button { padding: 12px 14px; letter-spacing: .08em; font-size: 11.5px; gap: 7px; } }
@media (prefers-reduced-motion: reduce) { .bk-thumb { transition: none; } .bk-panel.bk-in, .bk-intro:not([hidden]) { animation: none; } }
/* Formules : annule le style des <label> de champ, et colonnes qui ne débordent pas */
.bk-plans { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.field .bk-plan, .field.bk-plans label.bk-plan, .bk-chips label { font-size: inherit; font-weight: 400; letter-spacing: 0; text-transform: none; color: inherit; }
.bk-plan strong { font-size: 15px; line-height: 1.25; }
.bk-plan-desc { font-size: 12.5px; letter-spacing: 0; text-transform: none; }
@media (max-width: 1100px) and (min-width: 761px) { .bk-plans { grid-template-columns: 1fr; } .bk-plan-box { flex-direction: column; } }
.bk-plan strong { font-size: 14px; overflow-wrap: anywhere; hyphens: auto; }
.bk-plan-box { padding: 16px 14px 14px; }
@media (max-width: 760px) { .bk-plans { grid-template-columns: 1fr; } .bk-plan strong { overflow-wrap: normal; hyphens: manual; } }
@media (max-width: 760px) { .gallery .figure:nth-child(4) { grid-column: 1 / -1; aspect-ratio: 4 / 3; margin-top: 0; } .gallery .figure:nth-child(4) img { object-position: 40% 30%; } }

/* ================= Finitions ================= */
/* Règle typographique : l'italique classique (Cormorant) est réservé aux CITATIONS */
.chapter-quote p, .es-band > .es-quote p { font-family: var(--serif); font-style: italic; font-weight: 500; letter-spacing: 0; line-height: 1.3; color: var(--ink); }
.chapter-quote p { font-size: clamp(24px, 2.1vw, 30px); }
.es-band > .es-quote p { font-size: 21px; }
.signature { font-family: "Mrs Saint Delafield", cursive; font-style: normal; font-size: 46px; line-height: 1; color: var(--ink); transform: rotate(-4deg); transform-origin: left; }
.notfound-code { font-family: var(--sans); font-style: normal; font-weight: 600; letter-spacing: -.06em; color: #eceef3; }

/* Liens texte : trait gris fin, le trait bleu se dessine au survol */
.link { background:
    linear-gradient(var(--accent), var(--accent)) left bottom / 0% 1.5px no-repeat,
    linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat;
  transition: color .3s var(--ease), background-size .5s var(--ease); }
.link:hover, .link:focus-visible { color: var(--accent); background-size: 100% 1.5px, 100% 1px; }
.kpmg .link:hover { color: #fff; }
.site-footer a:not(.btn):not(.brand), .muted a:not(.btn), .who-text a:not(.link) {
  background: linear-gradient(var(--accent), var(--accent)) left 100% / 0% 1px no-repeat; transition: color .3s var(--ease), background-size .45s var(--ease); }
.site-footer a:not(.btn):not(.brand):hover, .muted a:not(.btn):hover { color: var(--accent); background-size: 100% 1px; }

/* Apparitions : même durée partout + cascade ; les cartes gardent leur survol rapide */
.reveal.in { transition: opacity .9s var(--ease) var(--rd, 0s), transform .9s var(--ease) var(--rd, 0s); }
.act-card.reveal, .stat-card.reveal { transition: opacity .9s var(--ease) var(--rd, 0s), transform .9s var(--ease) var(--rd, 0s), box-shadow .5s var(--ease), border-color .3s var(--ease); }
.act-card.reveal.in, .stat-card.reveal.in { transition: opacity .9s var(--ease) var(--rd, 0s), transform .5s var(--ease), box-shadow .5s var(--ease), border-color .3s var(--ease); }

/* Pied de page */
.site-footer { padding: clamp(56px, 7vw, 90px) 0 36px; }
.footer-top { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; flex-wrap: wrap; padding-bottom: clamp(36px, 4vw, 52px); margin-bottom: clamp(36px, 4vw, 52px); border-bottom: 1px solid var(--line); }
.footer-id .brand { font-size: 22px; }
.footer-tag { display: flex; align-items: center; gap: 10px; margin: 16px 0 0; font-size: 12px; font-weight: 500; letter-spacing: .3em; text-transform: uppercase; color: var(--accent); }
.footer-desc { margin: 12px 0 0; max-width: 42ch; }
.footer-cta { display: flex; gap: 12px; flex-wrap: wrap; }
.footer-grid { grid-template-columns: repeat(4, 1fr); border-bottom: 0; padding-bottom: 40px; }
.footer-social { display: flex; flex-direction: column; gap: 10px; }
.site-footer .footer-social a { display: inline-flex; align-items: center; gap: 10px; width: fit-content; }
.footer-social svg { flex: none; transition: transform .3s var(--ease); }
.footer-social a:hover svg { transform: translateY(-2px); }
.footer-bottom { border-top: 1px solid var(--line); }
@media (max-width: 760px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; } .footer-cta { width: 100%; } .footer-cta .btn { flex: 1; } }
@media (max-width: 420px) { .footer-cta { flex-direction: column; } }
.chapter-quote p::before { content: "«\00a0"; }
.chapter-quote p::after { content: "\00a0»"; }

/* Liens dans le texte (maillage interne) : discrets, trait bleu qui se dessine au survol */
.txt-link { color: inherit; text-decoration: none; background:
    linear-gradient(var(--accent), var(--accent)) left 100% / 0% 1.5px no-repeat,
    linear-gradient(rgba(29,78,216,.35), rgba(29,78,216,.35)) left 100% / 100% 1px no-repeat;
  transition: color .3s var(--ease), background-size .45s var(--ease); }
.txt-link:hover, .txt-link:focus-visible { color: var(--accent); background-size: 100% 1.5px, 100% 1px; }
.kpmg .txt-link { color: #fff; background-image: linear-gradient(#9db8ff, #9db8ff), linear-gradient(rgba(255,255,255,.4), rgba(255,255,255,.4)); }

/* ================= UI : en-tête, menu, états, formulaires, FAQ ================= */
/* En-tête : compact au défilement, caché en descendant, réapparaît en remontant */
.site-header { transition: height .35s var(--ease), transform .45s var(--ease), background .35s var(--ease), box-shadow .35s var(--ease); }
.site-header.is-compact { height: 64px; background: rgba(255,255,255,.88); -webkit-backdrop-filter: saturate(1.4) blur(14px); backdrop-filter: saturate(1.4) blur(14px); box-shadow: 0 1px 0 var(--line), 0 8px 24px rgba(15,19,36,.05); border-bottom-color: transparent; }
.site-header.is-hidden { transform: translateY(-100%); }
body.menu-open .site-header { transform: none; }
@media (min-width: 1000px) {
  /* Bouton MENU en haut à droite, comme la première version (demande de Joel, 2026-10-09) */
  .topnav { margin-right: clamp(32px, 4vw, 64px); gap: clamp(22px, 2.6vw, 40px); }
  .topnav > a, .topnav-drop > a { position: relative; padding: 6px 0; }
  .topnav > a:not(.topnav-cta)::after, .topnav-drop > a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 1.5px; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
  .topnav-drop > a::after { bottom: -12px; }
  .topnav > a:hover::after, .topnav-drop:hover > a::after, .topnav > a.is-current::after, .topnav-drop.is-current > a::after { transform: scaleX(1); }
  .topnav > a.is-current, .topnav-drop.is-current > a { color: var(--accent); }
  .topnav .topnav-cta { display: inline-flex; align-items: center; gap: 10px; margin-left: 6px; padding: 12px 20px; border-radius: 999px; background: var(--accent); color: #fff; letter-spacing: .14em; box-shadow: 0 8px 20px rgba(29,78,216,.25); transition: background .3s var(--ease), transform .2s var(--ease), box-shadow .3s; }
  .topnav .topnav-cta:hover { background: var(--ink); color: #fff; box-shadow: 0 8px 20px rgba(15,19,36,.2); }
  .topnav-cta span { transition: transform .3s var(--ease); }
  .topnav-cta:hover span { transform: translateX(3px); }
  /* sous-menus : carte arrondie */
  .topnav-menu { top: calc(100% + 18px); min-width: 210px; padding: 8px; gap: 2px; border-radius: 14px; border-color: var(--line); box-shadow: 0 18px 44px rgba(15,19,36,.12); transition: opacity .25s var(--ease), transform .3s var(--ease), visibility .25s; }
  .topnav-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -20px; height: 20px; }
  .topnav-menu a { display: block; padding: 11px 14px; border-radius: 9px; letter-spacing: .14em; font-size: 12px; transition: background .2s, color .2s; }
  .topnav-menu a:hover { background: #f5f6f9; color: var(--accent); }
}

/* Menu mobile plein écran */
.menu-list a, .menu-list button { font-weight: 600; letter-spacing: -.03em; }
.menu-list .num { color: var(--accent); font-weight: 600; letter-spacing: .1em; }
.menu-list a[aria-current="page"] { color: var(--accent); }
.menu-cta { margin-top: 28px; width: 100%; }
.menu-list a, .menu-list button, .site-footer li a, .footer-social a { min-height: 44px; }
.site-footer li a { display: inline-flex; align-items: center; }

/* Boutons : retour tactile, flèche qui glisse */
.btn, .es-btn, .ig-btn, .bk-toggle button, .bk-chips span, .topnav-cta { -webkit-tap-highlight-color: transparent; }
.btn:active, .es-btn:active, .ig-btn:active, .topnav-cta:active, .bk-chips label:active span { transform: scale(.98); }
.btn > span[aria-hidden="true"], .es-btn > span, .ig-btn > span { display: inline-block; transition: transform .3s var(--ease); }
.btn:hover > span[aria-hidden="true"], .es-btn:hover > span, .ig-btn:hover > span { transform: translateX(4px); }
.btn { transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease), transform .15s var(--ease); }

/* Focus clavier homogène */
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
.btn:focus-visible, .topnav-cta:focus-visible { outline-offset: 3px; box-shadow: none; }
.act-card:focus-visible, .stat-card:focus-visible, .iphone:focus-visible { outline-offset: 4px; border-radius: 18px; }

/* Formulaires : champs en boîte */
.form { gap: 20px 18px; }
.field label { font-size: 11.5px; font-weight: 600; letter-spacing: .14em; color: #4b5266; }
.field label .req, .bk-plans legend .req, .bk-format legend .req { color: var(--accent); }
.field input, .field select, .field textarea {
  height: 48px; padding: 0 14px; font: 400 15.5px/1.4 var(--sans); color: var(--ink);
  background-color: #f7f8fb; border: 1px solid var(--line); border-radius: 10px;
  transition: border-color .25s var(--ease), background-color .25s var(--ease), box-shadow .25s var(--ease); }
.field textarea { height: auto; min-height: 130px; padding: 12px 14px; }
.field input::placeholder, .field textarea::placeholder { color: #9aa1b2; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: #cfd5e2; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; background-color: #fff; border-color: var(--accent); box-shadow: 0 0 0 4px rgba(29,78,216,.12); }
.field input:user-invalid, .field select:user-invalid, .field textarea:user-invalid { border-color: #c2321f; background-color: #fff7f6; box-shadow: none; }
.field:has(:user-invalid)::after { content: "Ce champ est requis"; font-size: 12px; color: #c2321f; }
.field:has(input[type="email"]:user-invalid)::after { content: "Adresse email invalide"; }
.field select { padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%230f1324' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-position: right 14px center; background-size: 12px 8px; background-repeat: no-repeat; }
.field select:invalid { color: #9aa1b2; }
.field input[type="date"] { padding-right: 10px; }
.form-foot .btn .spinner { width: 14px; height: 14px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; }
.btn.is-loading { opacity: .85; pointer-events: none; }
@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 760px) { .form { grid-template-columns: 1fr; } .form-foot .btn { width: 100%; } }

/* FAQ : accordéon */
.faq-list { border-top: 0; display: flex; flex-direction: column; gap: 6px; }
.faq-item { border: 1px solid transparent; border-bottom: 1px solid var(--line); border-radius: 12px; padding: 0 18px; transition: background .3s var(--ease), border-color .3s var(--ease); }
.faq-item summary { padding: 22px 0; }
.faq-item summary::after { content: ""; flex: none; width: 22px; height: 22px; background:
  linear-gradient(currentColor, currentColor) center / 12px 1.5px no-repeat,
  linear-gradient(currentColor, currentColor) center / 1.5px 12px no-repeat; color: var(--muted); transition: transform .35s var(--ease), color .3s; }
.faq-item[open]:not(.is-closing) { background: #f5f6f9; border-color: var(--line); }
.faq-item[open]:not(.is-closing) summary::after { transform: rotate(45deg); color: var(--accent); }
.faq-item p { overflow: hidden; }

/* Ancres : le titre n'est jamais caché par l'en-tête */
[id] { scroll-margin-top: calc(var(--header-h) + 16px); }

@media (prefers-reduced-motion: reduce) {
  .site-header, .topnav-menu, .faq-item, .btn, .btn > span { transition: none !important; }
  .site-header.is-hidden { transform: none; }
}

/* Timeline intégrale (2026-10-08) : message central de chaque chapitre, duo de photos, conviction finale */
.chapter-key { margin: 44px 0 0; padding-top: 24px; border-top: 1px solid var(--line); font-size: clamp(19px, 1.6vw, 22px); line-height: 1.45; font-weight: 500; letter-spacing: -.01em; color: var(--ink); }
.chapter-key::before { content: ""; display: block; width: 40px; height: 2px; margin-bottom: 18px; background: var(--accent); }
.chapter-duo { margin: 40px 0; }
.chapter-duo .chapter-fig .figure { aspect-ratio: 4 / 5; }
.about-conviction { padding: clamp(80px, 10vw, 140px) 0; text-align: center; }
.conviction { max-width: 860px; margin: 0 auto; }
.conviction p { margin: 0; font-family: var(--serif); font-style: italic; font-weight: 500; font-size: clamp(30px, 3.6vw, 48px); line-height: 1.22; color: var(--ink); }
.conviction footer { margin-top: 30px; }
.conviction .signature { display: inline-block; transform: rotate(-4deg); transform-origin: center; }
@media (max-width: 560px) { .chapter-duo { grid-template-columns: 1fr; } }
.years .to.to--word { font-size: .5em; letter-spacing: -.03em; white-space: nowrap; }
/* Page Be Finance */
.bef-logo { display: block; width: clamp(160px, 18vw, 230px); height: auto; margin: 6px 0 30px; }

/* ---------- Page Speaker refaite (2026-10-08) : vidéos, déroulé, bandeau photo ---------- */
.section--ink { background: var(--ink); color: #c9cfe0; }
.section--ink .h2, .section--ink .lead { color: #fff; }
.section--ink .eyebrow { color: #aab3cc; }
.action-grid { display: grid; grid-template-columns: minmax(280px, 400px) 1fr; gap: clamp(36px, 6vw, 96px); align-items: center; }
.action-txt .lead { margin-top: 24px; color: #c9cfe0; }
.action-quote { margin: 32px 0 0; padding-left: 22px; border-left: 2px solid var(--accent); }
.action-quote p { margin: 0; font-family: var(--serif); font-style: italic; font-weight: 500; font-size: clamp(22px, 2vw, 27px); line-height: 1.3; color: #fff; }
.action-quote footer { margin-top: 10px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: #8d95ad; }
.action-more { display: flex; gap: 20px; align-items: center; margin-top: 40px; padding: 16px; border: 1px solid rgba(255,255,255,.12); border-radius: 18px; background: rgba(255,255,255,.03); }
.action-more-title { margin: 0; color: #fff; font-weight: 500; }
.action-more-sub { margin: 4px 0 12px; font-size: 14px; color: #8d95ad; }
.link--light { color: #8fb0ff; }

.vcard { position: relative; margin: 0; aspect-ratio: 9 / 16; border-radius: 18px; overflow: hidden; background: #000; box-shadow: 0 30px 70px rgba(0,0,0,.35); }
.vcard video { width: 100%; height: 100%; object-fit: cover; display: block; }
.vcard figcaption { position: absolute; left: 14px; bottom: 14px; padding: 7px 12px; border-radius: 999px; background: rgba(15,19,36,.7); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font-size: 12px; font-weight: 500; transition: opacity .3s; pointer-events: none; }
.vcard--mini { flex: none; width: 92px; border-radius: 12px; box-shadow: none; }
.vplay { position: absolute; inset: 0; display: grid; place-items: center; border: 0; background: linear-gradient(180deg, rgba(15,19,36,0) 40%, rgba(15,19,36,.45)); cursor: pointer; transition: opacity .3s; }
.vplay span { position: relative; width: 76px; height: 76px; border-radius: 50%; background: rgba(255,255,255,.95); box-shadow: 0 10px 30px rgba(0,0,0,.3); transition: transform .35s var(--ease); }
.vplay span::after { content: ""; position: absolute; left: 31px; top: 25px; border-left: 20px solid var(--ink); border-top: 13px solid transparent; border-bottom: 13px solid transparent; }
.vplay span::before { content: ""; position: absolute; inset: -10px; border-radius: 50%; border: 1px solid rgba(255,255,255,.55); animation: vpulse 2.2s var(--ease) infinite; }
.vplay:hover span { transform: scale(1.08); }
.vplay--sm span { width: 38px; height: 38px; }
.vplay--sm span::after { left: 15px; top: 12px; border-left-width: 11px; border-top-width: 7px; border-bottom-width: 7px; }
.vplay--sm span::before { display: none; }
.vcard.is-playing .vplay, .vcard.is-playing figcaption { opacity: 0; pointer-events: none; }
@keyframes vpulse { 0% { transform: scale(.9); opacity: .9; } 100% { transform: scale(1.35); opacity: 0; } }

.flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 24px); }
.flow li { padding: clamp(26px, 3vw, 36px); border: 1px solid var(--line); border-radius: 18px; background: #fff; transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .35s; }
.flow li:hover { transform: translateY(-4px); border-color: rgba(29,78,216,.3); box-shadow: 0 18px 40px rgba(15,19,36,.08); }
.flow-n { display: inline-block; margin-bottom: 18px; padding: 6px 12px; border-radius: 999px; background: #e8eefc; color: var(--accent); font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.flow h3 { margin: 0 0 10px; font-size: 21px; }
.flow p { margin: 0; color: var(--muted); font-size: 16px; }

.marquee { overflow: hidden; padding: 0 0 clamp(72px, 9vw, 120px); }
.marquee-track { display: flex; gap: 16px; width: max-content; animation: marquee 45s linear infinite; }
.marquee:hover .marquee-track { animation-play-state: paused; }
.marquee-item { margin: 0; width: clamp(220px, 22vw, 320px); aspect-ratio: 4 / 5; border-radius: 18px; overflow: hidden; }
.marquee-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.marquee-item:hover img { transform: scale(1.03); }
@keyframes marquee { to { transform: translateX(calc(-50% - 8px)); } }
@media (prefers-reduced-motion: reduce) { .marquee-track { animation: none; } .marquee { overflow-x: auto; } .vplay span::before { animation: none; } }

@media (max-width: 860px) {
  .action-grid { grid-template-columns: 1fr; }
  .vcard--main { max-width: 360px; width: 100%; margin: 0 auto; }
  .flow { grid-template-columns: 1fr; }
}

/* ---------- Timeline : archives (tirages inclinés, avec l'année), photo pleine largeur ---------- */
.archives { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(12px, 1.6vw, 20px); margin: 44px 0; padding: 6px 4px; }
.archives--2 { grid-template-columns: repeat(2, 1fr); max-width: 78%; }
.archive { margin: 0; padding: 8px 8px 12px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 14px 34px rgba(15, 19, 36, .10); transform: rotate(var(--r, 0deg)); transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.archive:hover { transform: rotate(0deg) translateY(-8px) scale(1.04); box-shadow: 0 24px 50px rgba(15, 19, 36, .16); z-index: 2; position: relative; }
.archive-img { aspect-ratio: 4 / 5; border-radius: 6px; overflow: hidden; }
.archive-img .bw-pair, .archive-img img { width: 100%; height: 100%; object-fit: cover; }
.archive:hover .bw-col { opacity: 1; }
.archive figcaption { display: flex; align-items: baseline; gap: 8px; margin-top: 10px; font-size: 12.5px; font-weight: 500; color: var(--ink); line-height: 1.3; }
.archive figcaption span { flex: none; font-size: 11px; font-weight: 600; letter-spacing: .08em; color: var(--accent); }
.chapter-fig--wide .figure { aspect-ratio: 3 / 2; }
html:not(.no-js) .archives.reveal .archive { opacity: 0; transform: translateY(24px) rotate(0deg); transition: opacity .7s var(--ease), transform .7s var(--ease); }
html:not(.no-js) .archives.reveal.in .archive { opacity: 1; transform: rotate(var(--r, 0deg)); }
html:not(.no-js) .archives.reveal.in .archive:nth-child(2) { transition-delay: .12s; }
html:not(.no-js) .archives.reveal.in .archive:nth-child(3) { transition-delay: .24s; }
html:not(.no-js) .archives.reveal.in .archive:hover { transform: rotate(0deg) translateY(-8px) scale(1.04); transition-delay: 0s; }
@media (max-width: 560px) { .archives { grid-template-columns: repeat(2, 1fr); } .archives--2 { max-width: none; } .archive figcaption { font-size: 11.5px; } }

/* ---------- Timeline : légendes posées sur les photos (pastille discrète) au lieu de texte sous l'image ---------- */
.timeline .chapter-fig { position: relative; }
.timeline .chapter-fig figcaption { position: absolute; left: 14px; bottom: 14px; z-index: 2; margin: 0; padding: 7px 12px; border-radius: 999px; background: rgba(15, 19, 36, .62); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font-size: 11.5px; font-weight: 500; letter-spacing: .02em; text-transform: none; line-height: 1.2; pointer-events: none; opacity: .92; transition: opacity .4s var(--ease), transform .4s var(--ease); }
.timeline .chapter-fig:hover figcaption { opacity: 1; transform: translateY(-2px); }
.timeline .chapter-fig .figure { border-radius: 16px; box-shadow: 0 18px 44px rgba(15, 19, 36, .10); }
.timeline .chapter-duo { gap: 16px; }
.timeline .chapter-duo .chapter-fig:nth-child(2) { margin-top: 48px !important; }
.timeline .chapter-fig--wide { margin-left: -6%; margin-right: -6%; }
@media (max-width: 860px) { .timeline .chapter-fig--wide { margin-left: 0; margin-right: 0; } .timeline .chapter-duo .chapter-fig:nth-child(2) { margin-top: 0 !important; } }
/* Timeline : tirage seul, chapitre hommage (2019) sur fond doux */
.archives--1 { grid-template-columns: minmax(0, 240px); }
.chapter--tribute { background: var(--soft); }
.chapter--tribute .years span:first-child { color: var(--ink); }

/* ---------- Retours Joel 2026-10-09 ---------- */
/* Timeline : tirage paysage (photo de classe), photos réduites */
.archives--2:has(.archive-img--wide) { grid-template-columns: 1.45fr 1fr; align-items: end; max-width: 92%; }
.archive-img--wide { aspect-ratio: 1242 / 868; }
.timeline .chapter-fig--small { max-width: 72%; }
.timeline .chapter-duo--small { max-width: 82%; }
.timeline .chapter-duo--small .chapter-fig:nth-child(2) { margin-top: 32px !important; }
@media (max-width: 860px) { .timeline .chapter-fig--small, .timeline .chapter-duo--small, .archives--2:has(.archive-img--wide) { max-width: none; } }

/* Kin Consult : le logo sert de titre */
.kin-title { margin: 6px 0 28px; line-height: 0; }
.kin-title .logo-kin { width: clamp(200px, 22vw, 300px); height: auto; }

/* Be Finance : photo d'équipe */
.bef-team { margin: 0; aspect-ratio: 3 / 2; border-radius: 18px; overflow: hidden; position: relative; }
.bef-team img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.bef-team figcaption { position: absolute; left: 16px; bottom: 16px; padding: 8px 14px; border-radius: 999px; background: rgba(15,19,36,.62); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font-size: 12.5px; font-weight: 500; }

/* Speaker : hero plein écran, photo en couleur */
.sp-hero { position: relative; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; background: #070a14; color: #fff; overflow: hidden; isolation: isolate; }
.sp-hero-photo { position: absolute; inset: 0 0 0 auto; width: min(62%, 1100px); z-index: -2; }
.sp-hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 30%; transform: scale(1.08); animation: spZoom 2.4s cubic-bezier(.2,.7,.2,1) forwards; }
.sp-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background:
  linear-gradient(90deg, #070a14 0%, #070a14 34%, rgba(7,10,20,.82) 48%, rgba(7,10,20,.15) 72%, rgba(7,10,20,0) 100%),
  linear-gradient(0deg, #070a14 0%, rgba(7,10,20,0) 34%),
  radial-gradient(60% 60% at 18% 30%, rgba(29,78,216,.35), transparent 70%); }
.sp-hero-inner { width: 100%; padding-top: calc(var(--header-h) + 4vh); padding-bottom: clamp(32px, 5vh, 64px); }
.sp-hero-txt { max-width: 640px; }
.sp-kicker { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: #c9d4f5; }
.sp-live { width: 8px; height: 8px; border-radius: 50%; background: #ff4d4d; box-shadow: 0 0 0 0 rgba(255,77,77,.6); animation: spLive 1.8s infinite; }
.sp-title { margin: 26px 0 0; font-family: var(--sans); font-weight: 600; font-size: clamp(56px, min(9vw, 13vh), 136px); line-height: .92; letter-spacing: -.055em; color: #fff; }
.sp-title .dot { color: #4f7dff; }
.sp-line { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .06em; }
.sp-line > span { display: inline-block; transform: translateY(105%); animation: spUp 1s cubic-bezier(.2,.8,.2,1) forwards; }
.sp-line:nth-child(2) > span { animation-delay: .12s; }
.sp-line:nth-child(3) > span { animation-delay: .24s; }
.sp-lead { margin: 28px 0 0; max-width: 520px; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; color: #c9cfe0; opacity: 0; animation: spFade .9s .45s forwards; }
.sp-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; margin-top: 36px; opacity: 0; animation: spFade .9s .6s forwards; }
.sp-btn { background: var(--accent); border-color: var(--accent); color: #fff; padding: 18px 28px; box-shadow: 0 14px 40px rgba(29,78,216,.45); }
.sp-btn:hover { background: #fff; border-color: #fff; color: var(--ink); }
.sp-watch { display: inline-flex; align-items: center; gap: 12px; color: #fff; font-weight: 500; font-size: 15px; text-decoration: none; }
.sp-watch-ico { position: relative; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255,255,255,.4); transition: background .3s, border-color .3s; }
.sp-watch-ico::after { content: ""; position: absolute; left: 18px; top: 15px; border-left: 12px solid #fff; border-top: 8px solid transparent; border-bottom: 8px solid transparent; }
.sp-watch:hover .sp-watch-ico { background: var(--accent); border-color: var(--accent); }
.sp-proof { border-top: 1px solid rgba(255,255,255,.1); background: rgba(7,10,20,.6); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); opacity: 0; animation: spFade .9s .8s forwards; }
.sp-proof-row { display: grid; grid-template-columns: repeat(4, 1fr); }
.sp-proof-item { display: flex; flex-direction: column; gap: 4px; padding: 22px 24px; border-left: 1px solid rgba(255,255,255,.08); font-size: 13px; color: #8d95ad; }
.sp-proof-item:first-child { border-left: 0; padding-left: 0; }
.sp-proof-item strong { color: #fff; font-size: 16px; font-weight: 600; }
.sp-proof-kpmg { flex-direction: row; align-items: center; gap: 14px; }
.sp-proof-kpmg img { width: 74px; height: auto; filter: brightness(0) invert(1); }
.sp-proof-kpmg span { color: #fff; font-weight: 500; font-size: 14px; }
@keyframes spUp { to { transform: translateY(0); } }
@keyframes spFade { to { opacity: 1; } }
@keyframes spZoom { to { transform: scale(1); } }
@keyframes spLive { 70% { box-shadow: 0 0 0 10px rgba(255,77,77,0); } 100% { box-shadow: 0 0 0 0 rgba(255,77,77,0); } }
@media (prefers-reduced-motion: reduce) { .sp-line > span, .sp-lead, .sp-actions, .sp-proof, .sp-hero-photo img { animation: none; transform: none; opacity: 1; } }
@media (max-width: 860px) {
  .sp-hero { min-height: auto; }
  .sp-hero-photo { position: relative; width: 100%; height: 62vh; inset: auto; order: -1; margin-top: var(--header-h); }
  .sp-hero::before { background: linear-gradient(0deg, #070a14 0%, #070a14 42%, rgba(7,10,20,0) 64%); }
  .sp-hero-inner { padding-top: 0; margin-top: -22vh; position: relative; }
  .sp-proof-row { grid-template-columns: 1fr 1fr; }
  .sp-proof-item { padding: 16px 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.08); }
  .sp-proof-item:nth-child(-n+2) { border-top: 0; }
}

/* Timeline : toutes les photos en tirage (cadre blanc, légende dessous, légère inclinaison) — Joel 2026-10-09 */
.timeline .chapter-fig { max-width: 84%; padding: 10px 10px 0; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 16px 38px rgba(15, 19, 36, .11); transform: rotate(-1.2deg); transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.timeline .chapter-body > .chapter-fig:nth-of-type(even) { transform: rotate(1deg); margin-left: auto; }
.timeline .chapter-fig:hover { transform: rotate(0deg) translateY(-6px); box-shadow: 0 26px 54px rgba(15, 19, 36, .16); }
.timeline .chapter-fig .figure { border-radius: 8px; box-shadow: none; }
.timeline .chapter-fig figcaption, .timeline .chapter-fig:hover figcaption { position: static; display: flex; align-items: center; gap: 8px; margin: 0; padding: 12px 4px 14px; background: none; -webkit-backdrop-filter: none; backdrop-filter: none; border-radius: 0; color: var(--ink); font-size: 13px; font-weight: 500; letter-spacing: 0; opacity: 1; transform: none; }
.timeline .chapter-fig figcaption::before { content: ""; width: 14px; height: 2px; background: var(--accent); flex: none; }
.timeline .chapter-fig--wide { margin-left: 0; margin-right: 0; }
.timeline .chapter-fig--small { max-width: 64%; }
.timeline .chapter-duo .chapter-fig { max-width: none; }
.timeline .chapter-duo .chapter-fig:nth-child(2) { transform: rotate(1.4deg); }
.timeline .chapter-duo .chapter-fig:hover { transform: rotate(0deg) translateY(-6px); }
@media (max-width: 860px) { .timeline .chapter-fig, .timeline .chapter-fig--small { max-width: 100%; } }
/* Hero Speaker épuré (Joel 2026-10-09) : plus d'air, moins d'éléments */
.sp-hero { justify-content: center; }
.sp-hero-inner { padding-top: calc(var(--header-h) + 10vh); padding-bottom: 12vh; }
.sp-title { margin-top: 0; }
.sp-lead { margin-top: 36px; max-width: 440px; }
.sp-actions { margin-top: 48px; }
.sp-trust { display: flex; align-items: center; gap: 12px; margin: 56px 0 0; font-size: 13px; letter-spacing: .04em; color: #8d95ad; opacity: 0; animation: spFade .9s .8s forwards; }
.sp-trust img { width: 64px; height: auto; filter: brightness(0) invert(1); opacity: .9; }
.sp-hero::before { background:
  linear-gradient(90deg, #070a14 0%, #070a14 30%, rgba(7,10,20,.78) 46%, rgba(7,10,20,.1) 70%, rgba(7,10,20,0) 100%),
  linear-gradient(0deg, rgba(7,10,20,.85) 0%, rgba(7,10,20,0) 26%); }
@media (max-width: 860px) { .sp-hero-inner { padding-top: 0; padding-bottom: 56px; } .sp-trust { margin-top: 40px; } }
@media (prefers-reduced-motion: reduce) { .sp-trust { animation: none; opacity: 1; } }
/* Hero Speaker : bloc de texte calé vers le bas (Joel 2026-10-09) */
.sp-hero { justify-content: flex-end; }
.sp-hero-inner { padding-top: calc(var(--header-h) + 14vh); padding-bottom: 9vh; }

/* ---------- Responsive (2026-10-09) : pied de page, petits écrans ---------- */
.footer-tag { flex-wrap: wrap; row-gap: 4px; }
@media (max-width: 600px) {
  .footer-tag { letter-spacing: .14em; font-size: 11px; gap: 8px; }
  .footer-top { align-items: flex-start; }
  .footer-cta { width: 100%; }
  .footer-cta .btn { flex: 1 1 100%; justify-content: center; }
}

/* Hero Speaker sur mobile/tablette (≤ 860 px) : photo entière et nette en haut, voile seulement sur son pied (Joel 2026-10-09).
   Placé en dernier pour ne pas être écrasé par les réglages desktop ci-dessus. */
@media (max-width: 860px) {
  .sp-hero { min-height: 0; justify-content: flex-start; }
  .sp-hero::before { content: none; background: none; }
  .sp-hero-photo { position: relative; inset: auto; order: -1; width: 100%; height: auto; aspect-ratio: 5 / 6; max-height: 74vh; margin-top: var(--header-h); z-index: 0; }
  .sp-hero-photo::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 34%; background: linear-gradient(0deg, #070a14 4%, rgba(7,10,20,0)); }
  .sp-hero-inner { position: relative; z-index: 1; padding-top: 0; padding-bottom: 56px; margin-top: -16vw; }
  .sp-hero-inner .sp-title { font-size: clamp(48px, 13.5vw, 96px); }
}

/* Mobile : photos en couleur (pas de survol possible sur tactile) */
@media (max-width: 760px) { .bw-pair .bw-col { opacity: 1; } .figure:hover .bw-pair > img { transform: none; } }

/* Chapitre « Début dans la finance » : photos légèrement agrandies */
.timeline .chapter-duo--small { max-width: 100%; }

/* Cohérence des sections (Joel 2026-10-12) : un seul bleu nuit, un peu plus clair que l'encre, pour toutes les sections sombres ;
   les fonds clairs prennent une teinte bleutée assortie. */
:root { --navy: #15254f; --soft: #f1f4fa; }
.kpmg, .section--ink, .cta-final { background: var(--navy); }
.kpmg + .section--ink, .kpmg + * + .section--ink { border-top: 1px solid rgba(255,255,255,.08); }

/* « Voir Elon sur scène » en blanc (Joel 2026-10-12) : évite deux sections bleues à la suite après KPMG */
#en-action .action-txt .lead { color: var(--text); }
#en-action .action-quote p { color: var(--ink); }
#en-action .action-quote footer, #en-action .action-more-sub { color: var(--muted); }
#en-action .action-more { border-color: var(--line); background: var(--soft); }
#en-action .action-more-title { color: var(--ink); }
#en-action .link--light { color: var(--accent); }
#en-action .vcard { box-shadow: 0 24px 56px rgba(15, 19, 36, .18); }

/* « Ses activités » : carte du monde en silhouette derrière le contenu (décorative) */
.activities { position: relative; overflow: hidden; isolation: isolate; background: #fff; }
.activities::before { content: ""; position: absolute; z-index: -1; pointer-events: none; left: 50%; top: 50%; width: 90%; aspect-ratio: 1000 / 480; transform: translate(-50%, -50%);
  background: url("../img/world-map.svg") center / contain no-repeat;
  -webkit-mask-image: radial-gradient(ellipse 60% 62% at 50% 45%, #000 55%, transparent 100%); mask-image: radial-gradient(ellipse 60% 62% at 50% 45%, #000 55%, transparent 100%); }
@media (max-width: 760px) { .activities::before { width: 160%; top: 30%; } }
.activities .act-card { background-color: #fff; }
/* Carte : calage sur la maquette (démarre au-dessus du titre, presque pleine largeur, fondu léger) */
.activities::before { width: 92%; top: 4%; transform: translateX(-50%);
  -webkit-mask-image: radial-gradient(ellipse 75% 80% at 50% 40%, #000 60%, transparent 100%); mask-image: radial-gradient(ellipse 75% 80% at 50% 40%, #000 60%, transparent 100%); }
@media (max-width: 760px) { .activities::before { width: 170%; top: 2%; } }

/* « Ses activités » : calage exact sur la maquette de Joel (2026-10-13, référence 1600 px) */
.activities { background: #fff; padding: clamp(80px, 9.4vw, 150px) 0 clamp(80px, 9vw, 145px); }
.activities::before { width: 88%; top: clamp(30px, 4vw, 65px); opacity: .8;
  -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%), linear-gradient(90deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 55%, transparent 100%), linear-gradient(90deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
  -webkit-mask-composite: source-in; mask-composite: intersect; }
.activities-title { font-weight: 700; font-size: clamp(38px, 4vw, 64px); letter-spacing: -.045em; margin-bottom: 22px; }
.activities-sub { font-size: clamp(11px, .9vw, 14px); margin-bottom: clamp(44px, 4.6vw, 74px); }
.activities-grid { max-width: 1312px; margin-inline: auto; gap: clamp(14px, 1.5vw, 24px); }
.act-card { min-height: clamp(260px, 22vw, 353px); }
.act-logo--corpo { width: clamp(100px, 8.5vw, 136px) !important; height: auto !important; }
.act-logo--kin { width: clamp(110px, 9vw, 145px) !important; height: auto !important; }
.act-logo--speaks { width: clamp(120px, 10vw, 162px) !important; height: auto !important; }
.act-logo--bef { width: clamp(80px, 6.6vw, 105px) !important; height: auto !important; }
@media (max-width: 760px) { .activities::before { width: 170%; top: 20px; } }
.activities .wrap { max-width: calc(1312px + 2 * var(--gutter, 48px)); }
.activities .activities-grid .act-card { min-height: clamp(260px, 22vw, 353px); }
.activities .activities-grid { gap: clamp(14px, 1.5vw, 24px); }

/* Accueil : pas de filet entre « Ses activités » et « Pourquoi travailler avec Elon » ; signature plus petite et plus détachée */
.es-band { border-top: 0; }
.es-quote .es-sign { font-size: 36px; margin-top: 30px; }
@media (max-width: 760px) { .es-quote .es-sign { font-size: 30px; margin-top: 22px; } }
.es-quote .es-sign { font-size: 28px; margin-top: 34px; }
@media (max-width: 760px) { .es-quote .es-sign { font-size: 24px; margin-top: 24px; } }
.es-quote .es-sign { display: block; padding-left: clamp(28px, 3vw, 48px); }
@media (max-width: 760px) { .es-quote .es-sign { padding-left: 24px; } }

/* Responsive : les tailles de logos calées sur la maquette (ordinateur) ne s'appliquent pas au téléphone */
@media (max-width: 600px) {
  .activities .act-logo--corpo { width: 82px !important; }
  .activities .act-logo--kin { width: 56px !important; }
  .activities .act-logo--speaks { width: 94px !important; }
  .activities .act-logo--bef { width: 54px !important; }
  .activities-title { font-size: 34px; }
}
@media (min-width: 601px) and (max-width: 1100px) {
  .activities .act-logo--corpo { width: 110px !important; }
  .activities .act-logo--kin { width: 118px !important; }
  .activities .act-logo--speaks { width: 132px !important; }
  .activities .act-logo--bef { width: 86px !important; }
}

/* Modifications Elon (doc 2026-10-15) : bloc Instagram divisé par deux */
.ig-band { padding-top: clamp(44px, 4.5vw, 64px); padding-bottom: clamp(44px, 4.5vw, 64px); }
.ig-inner { grid-template-columns: auto 1fr; gap: clamp(28px, 4vw, 64px); max-width: 980px; margin-inline: auto; }
.ig-visual { height: auto !important; padding: 0 !important; }
.ig-disc { display: none; }
.iphone { width: clamp(130px, 11vw, 155px) !important; border-radius: 28px; padding: 6px; }
.iphone-screen { border-radius: 23px; }
.iphone-status { height: 24px; padding: 0 14px; font-size: 8px; }
.iphone-island { top: 6px; height: 14px; border-radius: 10px; }
.iphone-screen img { top: 24px; height: calc(100% - 24px); }
.ig-band .ig-title { font-size: clamp(24px, 2.2vw, 32px); }
.ig-lead { font-size: 15px; margin-top: 14px; }
@media (max-width: 900px) { .ig-inner { grid-template-columns: auto 1fr; } .iphone { width: 120px !important; } }
@media (max-width: 520px) { .ig-inner { grid-template-columns: 1fr; justify-items: center; text-align: center; } }

/* Appel à l'action final : un seul, sur fond bleu ciel (Elon, 2026-10-15) */
.cta-final { background: linear-gradient(180deg, #e8f1fd 0%, #d9e8fb 100%) !important; color: var(--ink); }
.cta-final .display { color: var(--ink) !important; }
.cta-final .eyebrow { color: var(--accent) !important; }
.cta-final .btn { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: 0 14px 30px rgba(29, 78, 216, .25); }
.cta-final .btn:hover { background: var(--ink) !important; border-color: var(--ink) !important; color: #fff !important; }

/* Biographie : photo d'intro à la hauteur du texte, toutes les photos en couleur */
.about-intro-grid { align-items: stretch !important; }
.about-intro .about-portrait { height: 100%; min-height: 420px; aspect-ratio: auto !important; margin: 0; }
.about-intro .about-portrait img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 860px) { .about-intro .about-portrait { height: auto; aspect-ratio: 4 / 5 !important; min-height: 0; } }
.photo-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(14px, 2vw, 24px); margin: 36px 0; }
.timeline .photo-grid .chapter-fig { max-width: none; transform: none; }
.timeline .photo-grid .chapter-fig:nth-child(2) { transform: rotate(.8deg); }
.timeline .photo-grid .chapter-fig:nth-child(3) { transform: rotate(-.8deg); }
.timeline .chapter-fig--tribute { max-width: 56%; }
@media (max-width: 860px) { .timeline .chapter-fig--tribute { max-width: 80%; } }
@media (max-width: 480px) { .photo-grid { gap: 10px; } .photo-grid figcaption { font-size: 10px; } }

/* ---------- Kin Consult (doc d'Elon, 2026-10-15) ---------- */
.kin-hero .kin-title { margin: 0 0 30px; }
.logo-kin-v3 { width: clamp(130px, 12vw, 170px); height: auto; filter: none; }
.kin-intro { max-width: 760px; }
.kin-intro .lead { margin-top: 0; }
.kin-intro p:not(.lead) { color: var(--text); font-size: 17px; line-height: 1.75; margin-top: 18px; }
.kin-story p { margin-top: 16px; }

/* Expertises : carrousel d'images, comme sur kin-consult.com */
.kx { background: var(--navy); color: #c9cfe0; overflow: hidden; }
.kx .eyebrow { color: #aab3cc; }
.kx-head { max-width: 760px; margin-bottom: clamp(36px, 4vw, 56px); }
.kx-head .h2 { color: #fff; }
.kx-head .h2 span { color: #8fb0ff; }
.kx-head .lead { color: #c9cfe0; margin-top: 20px; }
.kx-track { display: grid; grid-auto-flow: column; grid-auto-columns: clamp(280px, 30vw, 380px); gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-left: 0; padding-bottom: 6px; scrollbar-width: none; overscroll-behavior-x: contain; }
.kx-track::-webkit-scrollbar { display: none; }
.kx-track:focus-visible { outline: 2px solid #8fb0ff; outline-offset: 6px; border-radius: 18px; }
.kx-card { scroll-snap-align: start; display: flex; flex-direction: column; border-radius: 18px; overflow: hidden; background: #fff; color: var(--text); transition: transform .5s var(--ease); }
.kx-card:hover { transform: translateY(-6px); }
.kx-img { position: relative; aspect-ratio: 4 / 4.2; overflow: hidden; }
.kx-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s var(--ease); }
.kx-card:hover .kx-img img { transform: scale(1.04); }
.kx-img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,16,36,.15) 0%, rgba(10,16,36,0) 35%, rgba(10,16,36,.78) 100%); }
.kx-n { position: absolute; z-index: 1; left: 20px; top: 16px; color: #fff; font-size: 13px; letter-spacing: .2em; opacity: .9; }
.kx-img h3 { position: absolute; z-index: 1; left: 20px; right: 20px; bottom: 18px; margin: 0; color: #fff; font-size: clamp(21px, 1.8vw, 25px); font-weight: 600; letter-spacing: -.02em; line-height: 1.15; }
.kx-body { padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 16px; flex: 1; }
.kx-body p { margin: 0; font-size: 15.5px; line-height: 1.6; }
.kx-body ul { list-style: none; margin: auto 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.kx-body li { font-size: 12.5px; padding: 6px 11px; border-radius: 999px; background: #eef3fd; color: var(--accent); font-weight: 500; }
.kx-nav { display: flex; justify-content: space-between; align-items: center; margin-top: 28px; }
.kx-count { font-size: 13px; letter-spacing: .14em; color: #aab3cc; }
.kx-count b { color: #fff; font-weight: 600; }
.kx-btn { width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); background: transparent; color: #fff; font-size: 18px; cursor: pointer; transition: background .3s, border-color .3s, transform .2s; }
.kx-btn + .kx-btn { margin-left: 10px; }
.kx-btn:hover { background: #fff; color: var(--navy); border-color: #fff; }
.kx-btn:active { transform: scale(.94); }
@media (max-width: 600px) { .kx-track { grid-auto-columns: 82vw; } }

/* Formats : « Choisissez le format adéquat » */
.kf { background: radial-gradient(120% 80% at 50% 0%, #eef4ff 0%, #fff 60%); }
.kf-head { text-align: center; max-width: 820px; margin: 0 auto clamp(40px, 5vw, 64px); }
.kf-head .eyebrow { justify-content: center; }
.kf-title { margin: 0; font-weight: 700; text-transform: uppercase; letter-spacing: -.01em; line-height: 1.02; font-size: clamp(32px, 4.6vw, 64px);
  background: linear-gradient(180deg, var(--accent) 0%, var(--navy) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.kf-head .lead { margin: 22px auto 0; max-width: 640px; }
.kf-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(14px, 2vw, 24px); }
.kf-card { position: relative; padding: 30px 28px 32px; border-radius: 18px; background: #fff; border: 1px solid var(--line); box-shadow: 0 14px 34px rgba(15,19,36,.06); transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.kf-card:hover { transform: translateY(-6px); box-shadow: 0 24px 50px rgba(15,19,36,.1); }
.kf-card--accent { background: var(--navy); border-color: var(--navy); color: #c9cfe0; }
.kf-card--accent h3 { color: #fff; }
.kf-n { font-size: 13px; letter-spacing: .2em; color: var(--accent); }
.kf-card--accent .kf-n { color: #8fb0ff; }
.kf-card h3 { margin: 18px 0 12px; font-size: clamp(24px, 2.2vw, 30px); font-weight: 600; letter-spacing: -.02em; color: var(--ink); }
.kf-card p { margin: 0; line-height: 1.65; }
.kf-card ul { list-style: none; padding: 18px 0 0; margin: 20px 0 0; border-top: 1px solid var(--line); display: grid; gap: 8px; font-size: 14px; }
.kf-card--accent ul { border-color: rgba(255,255,255,.14); }
.kf-card li::before { content: "→ "; color: var(--accent); }
.kf-card--accent li::before { color: #8fb0ff; }
.kv { margin: clamp(40px, 5vw, 64px) auto 0; max-width: 980px; }
.kv video { width: 100%; border-radius: 18px; display: block; background: #000; aspect-ratio: 16 / 9; }
.kv figcaption { margin-top: 12px; font-size: 13px; color: var(--muted); text-align: center; }
@media (max-width: 860px) { .kf-grid { grid-template-columns: 1fr; } }

/* Pourquoi choisir Kin Consult */
.kw-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(36px, 6vw, 90px); align-items: center; }
.kw-list { list-style: none; padding: 0; margin: 34px 0 0; display: grid; gap: 22px; }
.kw-list li { display: grid; gap: 6px; padding-left: 22px; border-left: 2px solid var(--accent); }
.kw-list strong { color: var(--ink); font-size: 18px; font-weight: 600; }
.kw-list span { color: var(--text); line-height: 1.6; }
.kw-video { margin: 0; }
.kw-video video { width: 100%; aspect-ratio: 9 / 16; max-height: 640px; object-fit: cover; border-radius: 18px; background: #000; display: block; }
.kw-video figcaption { margin-top: 12px; font-size: 13px; color: var(--muted); }
@media (max-width: 860px) { .kw-grid { grid-template-columns: 1fr; } .kw-video { max-width: 420px; } }
@media (min-width: 861px) { .split--top > .figure:first-child { position: sticky; top: calc(var(--header-h, 80px) + 24px); } }
.ig-band .ig-visual .iphone { width: clamp(125px, 10.5vw, 150px) !important; }
.kx-card--intro { position: relative; margin: 0; background: #000; min-height: 100%; }
.kx-card--intro img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.kx-card--intro::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,16,36,0) 55%, rgba(10,16,36,.8) 100%); }
.kx-card--intro figcaption { position: absolute; z-index: 1; left: 20px; right: 20px; bottom: 20px; color: #fff; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; }
.kw-video video { aspect-ratio: 16 / 9 !important; max-height: none !important; }
.kw-video figcaption { display: grid; gap: 2px; font-size: 13px; color: var(--muted); }
.kw-video figcaption strong { color: var(--ink); font-size: 15px; font-weight: 600; }
.kw-grid { grid-template-columns: 1fr 1fr; }

/* « Pourquoi choisir Kin Consult » plus compact */
.kw { padding-top: clamp(56px, 6vw, 88px) !important; padding-bottom: clamp(56px, 6vw, 88px) !important; }
.kw-grid { grid-template-columns: 1.1fr .9fr; gap: clamp(28px, 4vw, 60px); max-width: 1120px; margin-inline: auto; }
.kw .h2 { font-size: clamp(26px, 2.6vw, 36px); }
.kw-list { margin-top: 22px; gap: 14px; }
.kw-list strong { font-size: 16px; }
.kw-list span { font-size: 14.5px; line-height: 1.5; }
.logo-kin-v4 { width: clamp(220px, 24vw, 320px); height: auto; }
.kf-card--accent, .kf-card--accent h3, .kf-card--accent p, .kf-card--accent li { color: #fff; }

/* Kin Consult : « Sur le terrain », bandeau d'images qui défile (comme kin-consult.com) */
.kt { overflow: hidden; padding-bottom: clamp(64px, 8vw, 110px); }
.kt-head { max-width: 760px; margin-bottom: clamp(32px, 4vw, 52px); }
.kt-head .lead { margin-top: 18px; }
.kt-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%); }
.kt-track { display: flex; gap: 18px; width: max-content; animation: marquee 45s linear infinite; }
.kt-marquee:hover .kt-track { animation-play-state: paused; }
.kt-item { position: relative; margin: 0; width: clamp(280px, 34vw, 520px); aspect-ratio: 3 / 2; border-radius: 18px; overflow: hidden; flex: none; }
.kt-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1s var(--ease); }
.kt-item:hover img { transform: scale(1.04); }
.kt-item::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,16,36,0) 55%, rgba(10,16,36,.7) 100%); }
.kt-item figcaption { position: absolute; z-index: 1; left: 18px; bottom: 16px; color: #fff; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; font-weight: 500; }
@media (prefers-reduced-motion: reduce) { .kt-track { animation: none; } .kt-marquee { overflow-x: auto; } }
.kt-track { gap: 16px; }
/* Pied de page : bloc d'identité sur toute la largeur */
.footer-top { display: block; }
.footer-id { width: 100%; }
.footer-desc { max-width: none; }
.footer-id { text-align: center; } .footer-id .footer-tag { justify-content: center; }

/* Kin Consult — retouches (Elon, 2026-10-16) */
/* Hero : compact, logo à gauche, texte homogène à droite */
.kin-hero { padding-top: calc(var(--header-h, 80px) + clamp(36px, 6vh, 70px)) !important; padding-bottom: clamp(36px, 5vh, 60px) !important; }
.kin-hero-grid { display: grid; grid-template-columns: minmax(200px, .8fr) 1.2fr; gap: clamp(32px, 6vw, 90px); align-items: center; }
.kin-hero .kin-title { margin: 0; }
.kin-hero .logo-kin-v4 { width: 100%; max-width: 340px; }
.kin-intro { max-width: 640px; }
.kin-intro p { margin: 0 0 14px; font-size: 17px; line-height: 1.7; color: var(--text); }
.kin-intro .kin-intro-cta { margin: 24px 0 0; }
@media (max-width: 860px) { .kin-hero-grid { grid-template-columns: 1fr; gap: 24px; } .kin-hero .logo-kin-v4 { max-width: 240px; } }

/* Expertises : section plus compacte, comme kin-consult.com */
.kx { padding-top: clamp(60px, 7vw, 96px) !important; padding-bottom: clamp(60px, 7vw, 96px) !important; }
.kx-head { margin-bottom: clamp(26px, 3vw, 40px); max-width: 640px; }
.kx-head .h2 { font-size: clamp(26px, 2.6vw, 36px); }
.kx-head .lead { font-size: 16px; margin-top: 14px; }
.kx-track { grid-auto-columns: clamp(250px, 24vw, 310px); gap: 16px; }
.kx-img { aspect-ratio: 4 / 3; }
.kx-img h3 { font-size: clamp(17px, 1.4vw, 20px); bottom: 14px; left: 16px; right: 16px; }
.kx-n { left: 16px; top: 12px; font-size: 12px; }
.kx-body { padding: 16px 16px 18px; gap: 12px; }
.kx-body p { font-size: 14px; line-height: 1.55; }
.kx-body li { font-size: 11.5px; padding: 5px 9px; }
.kx-nav { margin-top: 20px; }
.kx-btn { width: 42px; height: 42px; font-size: 16px; }
.kx-img img[data-fit="wide"] { object-fit: cover; object-position: 50% 30%; }

/* Moins d'espace entre « Nos formats » et « Sur le terrain » */
.kf { padding-bottom: clamp(30px, 3vw, 44px) !important; }
.kt { padding-top: clamp(30px, 3vw, 44px) !important; }
.kx-img { aspect-ratio: 3 / 2; }
.kin-story p, .kin-story .lead { font-size: 17px; line-height: 1.7; color: var(--text); margin-top: 14px; }
.kin-story .h2 { font-size: clamp(26px, 2.6vw, 36px); }
.kin-hero + .section { padding-top: clamp(30px, 4vw, 50px) !important; }

/* Kin Consult : hero v2, photo en fond + voile bleu nuit (comme kin-consult.com) */
.kin-hero2 { position: relative; overflow: hidden; color: #fff; background: var(--navy); padding: calc(var(--header-h, 80px) + clamp(48px, 8vh, 90px)) 0 clamp(56px, 9vh, 100px); }
.kin-hero2-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.kin-hero2::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(12,20,46,.94) 0%, rgba(12,20,46,.84) 45%, rgba(12,20,46,.45) 100%); }
.kin-hero2-inner { position: relative; z-index: 2; max-width: 1180px; }
.kin-hero2-logo { margin: 0; line-height: 0; }
.kin-hero2-logo img { width: clamp(220px, 24vw, 320px); height: auto; }
.kin-hero2-tag { margin: 22px 0 0; font-size: 12px; letter-spacing: .3em; text-transform: uppercase; color: #9fb8ff; }
.kin-hero2-text { max-width: 620px; margin-top: 26px; }
.kin-hero2-text p { margin: 0 0 14px; font-size: 17px; line-height: 1.7; color: rgba(255,255,255,.88); }
.kin-hero2-cta { margin: 26px 0 0; }
.kin-hero2 + .section { padding-top: clamp(56px, 7vw, 96px) !important; }
@media (max-width: 760px) { .kin-hero2::before { background: linear-gradient(180deg, rgba(12,20,46,.78) 0%, rgba(12,20,46,.92) 100%); } .kin-hero2-text p { font-size: 16px; } }

/* Kin Consult : hero d'origine (logo puis texte), harmonisé */
.kin-hero { padding-top: calc(var(--header-h, 80px) + clamp(40px, 7vh, 80px)) !important; padding-bottom: clamp(40px, 6vh, 64px) !important; }
.kin-hero .wrap { display: block; max-width: 1180px; }
.kin-hero .kin-title { margin: 0 0 28px; line-height: 0; }
.kin-hero .logo-kin-v4 { width: clamp(220px, 22vw, 300px); max-width: none; }
.kin-hero .kin-intro { max-width: 680px; }
.kin-hero .kin-intro p { margin: 0 0 14px; font-size: 18px; line-height: 1.7; color: var(--text); font-weight: 400; }
.kin-hero .kin-intro .kin-intro-cta { margin: 26px 0 0; }
.kin-hero + .section { padding-top: clamp(24px, 3vw, 40px) !important; }
/* « Conférences & prises de parole » : photo verticale affichée en entier, même hauteur que les autres */
.kt-item--portrait { width: calc(clamp(280px, 34vw, 520px) * 2 / 3 * 1284 / 1475); aspect-ratio: 1284 / 1475; }
.kt-item--portrait img { object-position: 50% 50%; }
/* Ordre : Formats, Pourquoi, Sur le terrain : on remet des marges normales autour de « Pourquoi » */
.kf { padding-bottom: clamp(56px, 7vw, 96px) !important; }
.kw + .kt { padding-top: clamp(56px, 7vw, 96px) !important; }

/* Expertises encore plus compactes */
.kx { padding-top: clamp(44px, 5vw, 68px) !important; padding-bottom: clamp(44px, 5vw, 68px) !important; }
.kx-head { margin-bottom: clamp(20px, 2.4vw, 30px); max-width: 560px; }
.kx-head .h2 { font-size: clamp(22px, 2.1vw, 30px); }
.kx-head .lead { font-size: 15px; margin-top: 10px; }
.kx-track { grid-auto-columns: clamp(220px, 19vw, 260px); gap: 14px; }
.kx-img h3 { font-size: clamp(15px, 1.2vw, 17px); }
.kx-body { padding: 13px 14px 15px; gap: 10px; }
.kx-body p { font-size: 13px; line-height: 1.5; }
.kx-body li { font-size: 11px; padding: 4px 8px; }
.kx-nav { margin-top: 16px; }
.kx-btn { width: 38px; height: 38px; font-size: 15px; }
@media (max-width: 600px) { .kx-track { grid-auto-columns: 72vw; } }

/* Expertises : cartes horizontales (image à gauche, texte à droite) qui défilent en continu */
.kx-marquee { overflow: hidden; margin-inline: calc(-1 * var(--gutter, 24px)); -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%); }
.kx-track--loop { display: flex !important; gap: 16px; width: max-content; overflow: visible; animation: kx-loop 55s linear infinite; padding: 4px 0 8px; }
.kx-marquee:hover .kx-track--loop { animation-play-state: paused; }
@keyframes kx-loop { to { transform: translateX(calc(-50% - 8px)); } }
.kx-track--loop .kx-card { flex: none; width: clamp(420px, 40vw, 540px); display: grid; grid-template-columns: 44% 1fr; flex-direction: row; min-height: 210px; }
.kx-track--loop .kx-card:hover { transform: none; }
.kx-track--loop .kx-img { aspect-ratio: auto; height: 100%; min-height: 210px; }
.kx-track--loop .kx-body { padding: 18px 18px 18px; justify-content: center; }
.kx-track--loop .kx-body ul { margin-top: 4px; }
@media (max-width: 600px) {
  .kx-track--loop .kx-card { width: 86vw; grid-template-columns: 1fr; }
  .kx-track--loop .kx-img { min-height: 0; aspect-ratio: 16 / 9; }
}
@media (prefers-reduced-motion: reduce) { .kx-track--loop { animation: none; } .kx-marquee { overflow-x: auto; } }

/* ---------- Be Finance (2026-10-16) ---------- */
.bef-hero { background: var(--navy); color: #fff; min-height: 70vh; display: flex; align-items: center; padding: calc(var(--header-h, 80px) + clamp(36px, 6vh, 64px)) 0 clamp(48px, 7vh, 80px); }
.bef-hero-grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(32px, 5vw, 80px); align-items: center; width: 100%; }
.bef-hero-logo { display: block; width: clamp(84px, 7vw, 110px); height: auto; margin-bottom: 26px; }
.bef-hero h1 { margin: 0; color: #fff; font-weight: 600; letter-spacing: -.03em; line-height: 1.08; font-size: clamp(32px, 3.6vw, 52px); max-width: 16ch; }
.bef-hero-text p { margin: 22px 0 0; max-width: 520px; font-size: 17px; line-height: 1.7; color: rgba(255,255,255,.85); }
.bef-hero-text p a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.bef-hero .bef-hero-cta { margin-top: 30px; }
.bef-hero-photo { margin: 0; border-radius: 18px; overflow: hidden; box-shadow: 0 30px 70px rgba(0,0,0,.35); aspect-ratio: 1284 / 828; }
.bef-hero-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 860px) { .bef-hero { min-height: 0; } .bef-hero-grid { grid-template-columns: 1fr; } }

.bef-acc { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(32px, 6vw, 90px); align-items: center; }
.bef-list { margin-top: clamp(28px, 3vw, 40px); }
.bef-acc-photo { margin: 0; aspect-ratio: 4 / 5; }
.bef-acc-photo img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 860px) { .bef-acc { grid-template-columns: 1fr; } .bef-acc-photo { max-width: 460px; } }

.bef-247 { margin-top: 20px; padding: 14px 18px; border-radius: 12px; background: var(--soft); color: var(--text); line-height: 1.6; }
.bef-247 strong { display: block; color: var(--accent); font-size: 13px; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 2px; }
.bef-groupe { margin: clamp(36px, 4vw, 56px) 0 0; position: relative; border-radius: 18px; overflow: hidden; aspect-ratio: 1284 / 946; }
.bef-groupe img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bef-groupe figcaption { position: absolute; left: 16px; bottom: 16px; padding: 8px 14px; border-radius: 999px; background: rgba(15,19,36,.62); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font-size: 12px; font-weight: 500; }
.bef-legal { margin-top: clamp(28px, 3vw, 40px); font-size: 12.5px; color: var(--muted); }
.bef-hero-text p a.btn { text-decoration: none; color: #fff; }
.bef-hero h1 { max-width: 19ch; }
.bef-acc { grid-template-columns: 1.4fr .6fr; } .bef-acc-photo { max-width: 340px; justify-self: end; width: 100%; }
@media (max-width: 860px) { .bef-acc-photo { max-width: 300px; justify-self: start; } }

/* Expertises : cartes de nouveau verticales (image en haut, texte en dessous), défilement continu conservé */
.kx-track--loop .kx-card { width: clamp(230px, 20vw, 270px); display: flex; flex-direction: column; grid-template-columns: none; min-height: 0; }
.kx-track--loop .kx-img { aspect-ratio: 3 / 2; height: auto; min-height: 0; }
.kx-track--loop .kx-body { padding: 14px 15px 16px; justify-content: flex-start; }
@media (max-width: 600px) { .kx-track--loop .kx-card { width: 72vw; } }
/* Expertises : cartes légèrement plus petites */
.kx-track--loop .kx-card { width: clamp(205px, 17.5vw, 235px); }
.kx-track--loop .kx-body { padding: 12px 13px 14px; gap: 9px; }
.kx-track--loop .kx-body p { font-size: 12.5px; }
.kx-track--loop .kx-img h3 { font-size: clamp(14px, 1.1vw, 16px); }
.kx-track--loop .kx-body li { font-size: 10.5px; padding: 4px 7px; }
@media (max-width: 600px) { .kx-track--loop .kx-card { width: 64vw; } }
.kx-head .h2 { font-size: clamp(26px, 2.6vw, 36px); } .kx-head { max-width: 640px; }

/* ---------- Bande défilante en haut du site (inspirée de futursleaders.be) ---------- */
:root { --bar-h: 34px; }
body { padding-top: var(--bar-h); }
.promo-bar { position: absolute; top: 0; left: 0; right: 0; z-index: 60; height: var(--bar-h); overflow: hidden; display: flex; align-items: center;
  background: linear-gradient(90deg, #15254f 0%, var(--accent) 55%, #4f8ff7 100%); color: #fff; }
.promo-track { display: flex; width: max-content; animation: promo-scroll 38s linear infinite; }
.promo-bar:hover .promo-track { animation-play-state: paused; }
.promo-run { display: flex; align-items: center; flex: none; }
.promo-item { font-size: 13px; font-weight: 500; letter-spacing: .02em; white-space: nowrap; padding: 0 22px; }
.promo-item a { color: #fff; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255,255,255,.5); }
.promo-item a:hover { text-decoration-color: #fff; }
.promo-dot { font-size: 9px; opacity: .7; }
@keyframes promo-scroll { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .promo-track { animation: none; } }
@media (max-width: 600px) { :root { --bar-h: 30px; } .promo-item { font-size: 12px; padding: 0 16px; } }
/* L'en-tête fixe démarre sous la bande, puis remonte en haut dès qu'on fait défiler (géré par main.js) */
.site-header { top: var(--header-top, var(--bar-h)); }
body.menu-open .promo-bar { visibility: hidden; }

/* =====================================================================
   Finitions (2026-10-16) : un seul rythme vertical et une seule échelle de titres sur tout le site
   ===================================================================== */
:root { --sec-y: clamp(72px, 8vw, 116px); --sec-y-tight: clamp(48px, 5.5vw, 80px); --h2: clamp(30px, 3.1vw, 44px); }
main .section { padding-top: var(--sec-y); padding-bottom: var(--sec-y); }
main .section[style*="padding-top:0"] { padding-top: 0; }
main .section--tight { padding-top: var(--sec-y-tight); padding-bottom: var(--sec-y-tight); }
.kpmg { padding-top: var(--sec-y); padding-bottom: var(--sec-y); }
.who, .activities, .stats { padding-top: var(--sec-y) !important; padding-bottom: var(--sec-y) !important; }

/* Titres de section : même taille, même graisse, même interlignage */
main .h2, .kpmg-title, .activities .activities-title, .stats .stats-title, .kx-head .h2, .kw .h2, .kin-story .h2 {
  font-size: var(--h2) !important; font-weight: 600; letter-spacing: -.035em; line-height: 1.08; }
.kf-title { font-size: clamp(30px, 3.6vw, 52px) !important; }
.cta-final .display { font-size: clamp(30px, 3.4vw, 48px); }

/* Kin Consult : on aligne ses sections sur le même rythme */
.kx, .kw, .kt, .kf { padding-top: var(--sec-y) !important; }
.kx, .kw, .kf { padding-bottom: var(--sec-y) !important; }
.kt { padding-bottom: var(--sec-y) !important; }

/* Textes d'introduction sous les titres : même taille partout */
main .section .lead { font-size: clamp(17px, 1.3vw, 19px); line-height: 1.65; }
/* Bande défilante : seulement sur Be Finance */
body { padding-top: 0; }
body:has(> .promo-bar) { padding-top: var(--bar-h); }
.site-header { top: var(--header-top, 0px); }
.bef-hero h1 { font-size: clamp(30px, 3.3vw, 48px); max-width: 20ch; } .nowrap { white-space: nowrap; }

/* Expertises : « Découvrir l'expertise » ouvre le détail dans une fenêtre (comme kin-consult.com) */
.kx-track--loop .kx-body ul { display: none; }
.kx-more { margin-top: auto; align-self: flex-start; display: inline-flex; gap: 8px; align-items: center; padding: 0; border: 0; background: none; font: 600 13px/1.2 var(--sans); color: var(--accent); cursor: pointer; }
.kx-more span { transition: transform .3s var(--ease); }
.kx-more:hover span { transform: translateX(4px); }
.kx-dialog { width: min(520px, calc(100vw - 32px)); border: 0; border-radius: 18px; padding: clamp(24px, 3vw, 34px); color: var(--text); box-shadow: 0 30px 80px rgba(10,16,36,.35); }
.kx-dialog::backdrop { background: rgba(10,16,36,.55); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.kx-dialog[open] { animation: kxd-in .35s var(--ease); }
@keyframes kxd-in { from { opacity: 0; transform: translateY(12px) scale(.98); } }
.kx-d-close { position: absolute; top: 12px; right: 14px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--soft); color: var(--ink); font-size: 20px; cursor: pointer; }
.kx-d-eyebrow { margin: 0; font-size: 12px; letter-spacing: .25em; text-transform: uppercase; color: var(--accent); }
.kx-dialog h3 { margin: 10px 0 0; font-size: clamp(22px, 2.2vw, 28px); font-weight: 600; letter-spacing: -.02em; color: var(--ink); }
.kx-d-line { margin: 12px 0 0; line-height: 1.65; }
.kx-d-points { list-style: none; margin: 22px 0 0; padding: 20px 0 0; border-top: 1px solid var(--line); display: grid; gap: 10px; }
.kx-d-points li { position: relative; padding-left: 18px; color: var(--ink); }
.kx-d-points li::before { content: ""; position: absolute; left: 0; top: .6em; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.kx-marquee.is-paused .kx-track--loop { animation-play-state: paused; }
/* Expertises : défilement piloté en JS (continu + flèches) */
.kx-track--loop.is-js { animation: none !important; will-change: transform; }
.kx-arrows { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
/* Expertises : exactement 4 cartes visibles à la fois sur ordinateur (largeur calculée en JS) */
.kx-marquee { margin-inline: 0; -webkit-mask-image: none; mask-image: none; }
.kx-track--loop .kx-card { width: var(--kx-w, 260px) !important; }

/* ---------- Be Finance corporate (2026-10-16) ---------- */
.bef-hero { min-height: 78vh; padding-top: calc(var(--header-h, 80px) + clamp(56px, 9vh, 110px)); padding-bottom: clamp(64px, 10vh, 120px); }
.bef-hero h1 { font-size: clamp(36px, 4.3vw, 62px) !important; line-height: 1.04; letter-spacing: -.04em; max-width: 15ch; }
.bef-247-hl { color: #9fb8ff; }
.bef-hero-text p { margin-top: 28px; }
.bef-hero .bef-hero-cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 38px; }
.btn--line-light { background: transparent !important; border: 1px solid rgba(255,255,255,.45) !important; color: #fff !important; box-shadow: none !important; }
.btn--line-light:hover { background: #fff !important; color: var(--navy) !important; border-color: #fff !important; }
.bef-hero-photo { border: 1px solid rgba(255,255,255,.18); box-shadow: 0 40px 90px rgba(0,0,0,.45); }

.bef-dom { background: linear-gradient(180deg, #eef3fd 0%, #f6f8fd 100%); }
.bef-dom-head { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(28px, 5vw, 72px); align-items: end; margin-bottom: clamp(36px, 4vw, 56px); }
.bef-dom-photo { margin: 0; aspect-ratio: 21 / 9; }
.bef-dom-photo img { width: 100%; height: 100%; object-fit: cover; }
.bef-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 24px); perspective: 900px; }
.bef-card { position: relative; overflow: hidden; padding: clamp(26px, 2.6vw, 36px); border-radius: 18px; background: #fff; border: 1px solid #e3e9f6;
  box-shadow: 0 10px 30px rgba(21,37,79,.07); transform-style: preserve-3d; transition: transform .5s var(--ease), box-shadow .5s var(--ease); will-change: transform; }
.bef-card.is-tilting { transition: transform .08s linear, box-shadow .3s var(--ease); }
.bef-card:hover { box-shadow: 0 26px 60px rgba(21,37,79,.16); }
.bef-card-ico { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 14px; background: linear-gradient(135deg, #15254f 0%, var(--accent) 100%); color: #fff; transform: translateZ(30px); }
.bef-card-ico svg { width: 26px; height: 26px; }
.bef-card h3 { margin: 22px 0 10px; font-size: clamp(21px, 1.8vw, 25px); font-weight: 600; letter-spacing: -.02em; color: var(--ink); transform: translateZ(20px); }
.bef-card p { margin: 0; line-height: 1.65; color: var(--text); transform: translateZ(10px); }
.bef-card-glare { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .4s;
  background: radial-gradient(420px circle at var(--gx, 50%) var(--gy, 0%), rgba(79,143,247,.14), transparent 60%); }
.bef-card:hover .bef-card-glare { opacity: 1; }
@media (max-width: 860px) { .bef-dom-head, .bef-cards { grid-template-columns: 1fr; } .bef-dom-photo { aspect-ratio: 16 / 9; } }
.bef-hero-grid { grid-template-columns: 1.2fr .8fr; }
.bef-hero h1 { font-size: clamp(34px, 3.9vw, 58px) !important; max-width: 18ch; }
.bef-hero { min-height: 0; padding-top: calc(var(--header-h, 80px) + clamp(44px, 7vh, 84px)); padding-bottom: clamp(56px, 8vh, 96px); }
.bef-hero-logo { margin-bottom: 30px; }
@media (max-width: 860px) { .bef-hero-grid { grid-template-columns: 1fr; } }
.bef-card h3, .bef-card p { transform: none; } .bef-card { -webkit-font-smoothing: antialiased; backface-visibility: hidden; }
/* Be Finance : photo d'Elon entière (format portrait), groupe plus petit */
.bef-dom-head { grid-template-columns: 1fr auto; align-items: center; }
.bef-dom-photo { aspect-ratio: 1066 / 1600 !important; width: clamp(220px, 22vw, 300px); }
.bef-dom-photo img { object-position: 50% 50% !important; }
.bef-groupe { max-width: 760px; margin-inline: auto; }
@media (max-width: 860px) { .bef-dom-head { grid-template-columns: 1fr; } .bef-dom-photo { width: min(300px, 80%); } }

/* Corpoready : duo photo éditorial (ULB + conférence jeunes actifs) */
.corpo-duo-sec { padding-top: var(--sec-y-tight) !important; padding-bottom: var(--sec-y-tight) !important; }
.corpo-duo { display: grid; grid-template-columns: 1.15fr .85fr; grid-template-rows: auto auto; gap: clamp(16px, 2.4vw, 32px); align-items: start; }
.corpo-ph { position: relative; margin: 0; border-radius: 18px; overflow: hidden; box-shadow: 0 24px 60px rgba(15,19,36,.14); }
.corpo-ph img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s var(--ease); }
.corpo-ph:hover img { transform: scale(1.03); }
.corpo-ph--a { grid-row: 1 / 3; aspect-ratio: 4 / 5; }
.corpo-ph--b { aspect-ratio: 4 / 3; margin-top: clamp(40px, 6vw, 90px); }
.corpo-ph figcaption { position: absolute; left: 16px; bottom: 16px; display: grid; gap: 2px; padding: 10px 14px; border-radius: 12px; background: rgba(255,255,255,.94); color: var(--ink); font-size: 14px; font-weight: 600; box-shadow: 0 8px 24px rgba(15,19,36,.15); }
.corpo-ph figcaption span { font-size: 10.5px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--accent); }
.corpo-duo-quote { align-self: end; margin: 0; padding-left: 20px; border-left: 2px solid var(--accent); font-size: clamp(17px, 1.4vw, 20px); line-height: 1.55; color: var(--ink); max-width: 32ch; }
@media (max-width: 760px) {
  .corpo-duo { grid-template-columns: 1fr; }
  .corpo-ph--a { grid-row: auto; aspect-ratio: 4 / 5; }
  .corpo-ph--b { margin-top: 0; }
}
/* Be Finance : photo d'Elon en horizontal */
.bef-dom-head { grid-template-columns: .9fr 1.1fr; align-items: end; }
.bef-dom-photo { aspect-ratio: 3 / 2 !important; width: 100%; }
.bef-dom-photo img { object-position: 50% 40% !important; }
@media (max-width: 860px) { .bef-dom-head { grid-template-columns: 1fr; } .bef-dom-photo { width: 100%; } }

/* Corpoready : la vidéo dans un iPhone (cadre titane, Dynamic Island, boutons latéraux) */
.phone18 { position: relative; width: clamp(250px, 24vw, 320px); aspect-ratio: 9 / 19.5; padding: 10px; border-radius: 54px; justify-self: center;
  background: linear-gradient(145deg, #4a4d55 0%, #23252a 30%, #34373e 65%, #575a62 100%);
  box-shadow: inset 0 0 0 1.5px #6b6f78, inset 0 0 0 4px #101114, 0 50px 90px rgba(0,0,0,.45), 0 12px 28px rgba(0,0,0,.3); }
.phone18-screen.vcard { position: relative; width: 100%; height: 100%; aspect-ratio: auto; margin: 0; border-radius: 45px; overflow: hidden; background: #000; box-shadow: none; }
.phone18-screen video { width: 100%; height: 100%; object-fit: cover; display: block; }
.phone18-island { position: absolute; z-index: 3; top: 11px; left: 50%; width: 32%; height: 28px; transform: translateX(-50%); border-radius: 20px; background: #000; pointer-events: none; }
.phone18-screen.is-playing .phone18-island { opacity: 1; }
.phone18-btn { position: absolute; width: 3px; border-radius: 2px; background: #2c2e34; }
.phone18-btn--action { left: -3px; top: 17%; height: 4%; }
.phone18-btn--vol1 { left: -3px; top: 24%; height: 8%; }
.phone18-btn--vol2 { left: -3px; top: 34%; height: 8%; }
.phone18-btn--power { right: -3px; top: 27%; height: 13%; }
.phone18-screen figcaption { bottom: 22px; left: 50%; transform: translateX(-50%); white-space: nowrap; }
/* Corpoready : phrase posée en blanc sur la grande photo */
.band--title { position: relative; }
.band--title::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,16,36,0) 40%, rgba(10,16,36,.72) 100%); pointer-events: none; }
.band-title { position: absolute; z-index: 1; left: 0; right: 0; bottom: clamp(24px, 5vw, 64px); }
.band-title .wrap { display: block; color: #fff; font-weight: 600; letter-spacing: -.04em; line-height: 1.02; font-size: clamp(34px, 5.4vw, 80px); text-shadow: 0 2px 24px rgba(0,0,0,.25); }
.band--title .band-title, .band--title .band-title .wrap { text-transform: none; padding: 0; background: none; border-radius: 0; box-shadow: none; position: static; } .band--title .band-title { position: absolute; left: 0; right: 0; bottom: clamp(24px, 5vw, 64px); } .band--title .band-title .wrap { margin: 0 auto; padding: 0 var(--gutter); }
/* Phrase posée sur le tableau vert (zone unie en haut à gauche de la photo), au-dessus des visages */
.band--title .band-title { top: clamp(22px, 4vw, 60px); bottom: auto; }
.band--title::after { background: linear-gradient(180deg, rgba(10,16,36,.45) 0%, rgba(10,16,36,.12) 32%, rgba(10,16,36,0) 50%); }
.band--title .band-title .wrap { font-size: clamp(28px, 4.6vw, 68px); }
@media (max-width: 600px) { .band--title .band-title .wrap { font-size: 26px; } }
/* Phrase centrée, un peu sous le milieu de la photo */
.band--title .band-title { top: 56%; bottom: auto; transform: translateY(-50%); text-align: center; }
.band--title::after { background: radial-gradient(ellipse 70% 55% at 50% 56%, rgba(10,16,36,.5) 0%, rgba(10,16,36,.18) 60%, rgba(10,16,36,0) 100%); }

/* =====================================================================
   Modifications Elon (document du 2026-10-16)
   ===================================================================== */
/* Accueil : les 3 photos de « Qui est Elon » directement en couleur */
.who-photo .who-nb { display: none !important; }

/* « Ses activités » : lueur bleue discrète (prompt d'Elon) */
.activities .act-card {
  background: linear-gradient(180deg, #FCFDFF 0%, #F1F6FD 100%) !important;
  border: 1px solid #dfe8f6 !important;
  box-shadow: 0 16px 40px rgba(65, 110, 180, 0.10) !important;
  transition: box-shadow 250ms ease, border-color 250ms ease, transform 250ms ease !important;
}
.activities .act-card::after { content: ""; position: absolute; left: 16%; right: 16%; bottom: 0; height: 2px; border-radius: 2px; background: var(--accent); opacity: 0; transform: scaleX(.4); transition: opacity 250ms ease, transform 250ms ease; }
.activities .act-card:hover, .activities .act-card:focus-visible, .activities .act-card:active {
  border-color: #c9daf3 !important;
  box-shadow: 0 20px 48px rgba(65, 110, 180, 0.16), 0 0 0 4px rgba(79, 143, 247, 0.06) !important;
}
.activities .act-card:hover::after, .activities .act-card:focus-visible::after, .activities .act-card:active::after { opacity: 1; transform: scaleX(1); }
.activities { padding-bottom: calc(var(--sec-y) + 20px) !important; }

/* Transition douce vers « Son impact en chiffres » : le bas de la photo se fond dans le blanc */
.es-band { position: relative; }
.es-fade { position: absolute; left: 0; right: 0; bottom: 0; height: clamp(120px, 14vw, 220px); z-index: 2; pointer-events: none; background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.75) 55%, #fff 100%); }
.es-band .es-inner { position: relative; z-index: 3; }
.stats { background: linear-gradient(180deg, #fff 0%, #f6f9fe 45%, #f2f6fd 100%) !important; }

/* Instagram : téléphone + texte décalés à gauche, vidéo « Elon en action » à droite (vignette aux coins coupés) */
.ig-inner { grid-template-columns: auto minmax(0, 1fr) auto !important; max-width: 1180px !important; margin-inline: auto; gap: clamp(28px, 4vw, 64px) !important; justify-content: start; }
.ig-action { display: grid; gap: 14px; width: clamp(240px, 22vw, 300px); }
.ig-action-label { display: flex; align-items: center; gap: 14px; font-size: 12px; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; color: var(--ink); }
.ig-action-label::before { content: ""; width: 40px; height: 1.5px; background: var(--accent); }
.ig-action-video.vcard { margin: 0; aspect-ratio: 16 / 10; border-radius: 0; box-shadow: none; background: #0b0f1c;
  clip-path: polygon(14px 0, 100% 0, 100% calc(100% - 22px), calc(100% - 22px) 100%, 0 100%, 0 14px); filter: drop-shadow(0 18px 30px rgba(15,19,36,.18)); }
.ig-action-video video { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.ig-action-video .vplay span { background: rgba(255,255,255,.92); }
.ig-action-video .vplay span::after { border-left-color: var(--accent); }
@media (max-width: 1000px) { .ig-inner { grid-template-columns: auto 1fr !important; } .ig-action { grid-column: 1 / -1; width: min(360px, 100%); justify-self: center; } }
@media (max-width: 520px) { .ig-inner { grid-template-columns: 1fr !important; } }
/* Bas de la photo « Pourquoi travailler avec Elon » fondu dans le blanc (pas de bord net) */
@media (min-width: 901px) {
  .es-band .es-photo--blur {
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 12%, rgba(0,0,0,.8) 28%, #000 40%, #000 76%, transparent 100%), linear-gradient(180deg, #000 62%, transparent 98%);
            mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 12%, rgba(0,0,0,.8) 28%, #000 40%, #000 76%, transparent 100%), linear-gradient(180deg, #000 62%, transparent 98%);
    -webkit-mask-composite: source-in; mask-composite: intersect; }
  .es-band .es-photo:not(.es-photo--blur) {
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 30%, rgba(0,0,0,.6) 42%, #000 54%, #000 76%, transparent 100%), linear-gradient(180deg, #000 62%, transparent 98%);
            mask-image: linear-gradient(90deg, transparent 0%, transparent 30%, rgba(0,0,0,.6) 42%, #000 54%, #000 76%, transparent 100%), linear-gradient(180deg, #000 62%, transparent 98%);
    -webkit-mask-composite: source-in; mask-composite: intersect; }
  .es-cut { -webkit-mask-image: linear-gradient(180deg, #000 62%, transparent 98%); mask-image: linear-gradient(180deg, #000 62%, transparent 98%); }
}
.es-fade { display: none; }
.stats { padding-top: clamp(28px, 3vw, 48px) !important; }

/* Biographie : plus de grand nom, on commence par le texte ; photo recadrée haut et bas (tête → mains) */
.about-intro { padding-top: calc(var(--header-h, 80px) + clamp(36px, 5vw, 64px)) !important; padding-bottom: clamp(40px, 5vw, 70px) !important; }
.about-intro-grid { align-items: center !important; }
.about-intro .about-portrait { height: auto !important; min-height: 0 !important; aspect-ratio: 353 / 477 !important; max-width: 420px; justify-self: end; width: 100%; }
.about-intro .about-portrait img { object-position: 50% 30% !important; }
.about-bio p:first-child { margin-top: 0; }

/* Kin Consult : fondateurs — titre sur une ligne, texte et photo de même hauteur, légende */
.kin-founders { align-items: center !important; }
.kin-founders .kin-story-title { font-size: clamp(24px, 2.3vw, 32px) !important; white-space: nowrap; letter-spacing: -.03em; color: var(--ink); }
.kin-founders .kin-story p, .kin-founders .kin-story .lead { font-size: 15.5px !important; line-height: 1.65 !important; margin-top: 12px !important; color: var(--text); }
.kin-founders-fig { margin: 0; }
.kin-founders-fig figcaption { margin-top: 12px; font-size: 13px; font-style: italic; color: var(--muted); }
@media (max-width: 1100px) { .kin-founders .kin-story-title { white-space: normal; } }

/* Kin Consult : expertises sur un dégradé bleu foncé → blanc, cartes ombrées */
.kx { background: linear-gradient(180deg, var(--navy) 0%, var(--navy) 38%, #3f5fae 62%, #c9d7f2 84%, #fff 100%) !important; }
.kx-track--loop .kx-card { box-shadow: 0 18px 40px rgba(15, 25, 60, .22); }
.kx-arrows .kx-btn { border-color: rgba(21,37,79,.35); color: var(--navy); background: #fff; }
.kx-arrows .kx-btn:hover { background: var(--navy); color: #fff; border-color: var(--navy); }

/* Kin Consult : bouton sous la vidéo de témoignage */
.kw-cta { margin: 22px 0 0; }
.kx-track--loop.is-js { will-change: auto; }
/* Fondateurs : photo plus grande pour équilibrer la hauteur du texte, premier paragraphe comme les autres */
.kin-founders { grid-template-columns: 1fr 1.12fr !important; gap: clamp(32px, 5vw, 72px) !important; }
.kin-founders-fig .figure { aspect-ratio: 5 / 4 !important; }
.kin-founders .kin-story .lead, .kin-founders .kin-story .lead.muted { color: var(--text) !important; font-weight: 400; }
.kin-founders .kin-story p, .kin-founders .kin-story .lead { font-size: 15px !important; line-height: 1.6 !important; }
@media (max-width: 860px) { .kin-founders { grid-template-columns: 1fr !important; } }
@media (max-width: 860px) { .kw-grid { grid-template-columns: minmax(0, 1fr) !important; } .kw-video { max-width: 100%; } .kw-cta .btn { white-space: normal; } }
.timeline .chapter-fig--xs { max-width: 42% !important; } @media (max-width: 860px) { .timeline .chapter-fig--xs { max-width: 70% !important; } }

/* =====================================================================
   Corpoready v2 (document Modifications d'Elon, 2026-10-20)
   ===================================================================== */
.corpo-hero .lead { max-width: 760px; }
/* Affiche */
.band--title-c .band-title { top: 54%; }
.band--title-c .band-title .wrap { font-size: clamp(28px, 4vw, 58px); line-height: 1.12; }
.band-bar { display: block; width: 64px; height: 4px; border-radius: 2px; background: var(--accent); margin: 18px auto 0; }

/* Le constat d'Elon */
.cc-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px, 6vw, 96px); }
.cc-left p { margin: 22px 0 0; font-size: clamp(18px, 1.5vw, 21px); line-height: 1.6; color: var(--ink); }
.cc-right { border-left: 1px solid var(--line); padding-left: clamp(24px, 4vw, 56px); }
.cc-right h3 { margin: 0 0 8px; font-size: 18px; font-weight: 700; color: var(--ink); }
.cc-right h3:not(:first-child) { margin-top: 26px; }
.cc-right p { margin: 0 0 12px; line-height: 1.65; color: var(--text); }
.cc-quote { display: grid; grid-template-columns: auto 1fr; gap: 18px; align-items: center; margin: 18px 0 20px; padding: 20px 22px; border-radius: 14px; background: #eef4fe; }
.cc-quote-ico { width: 44px; height: 44px; color: var(--accent); padding-right: 16px; border-right: 1px solid #cddcf5; box-sizing: content-box; }
.cc-quote-ico svg { width: 44px; height: 44px; }
.cc-quote p { margin: 0; font-size: 18px; font-weight: 600; line-height: 1.45; color: var(--accent); }
@media (max-width: 860px) { .cc-grid { grid-template-columns: 1fr; } .cc-right { border-left: 0; padding-left: 0; } }

/* Les chiffres derrière le constat */
.corpo-stats { background: linear-gradient(180deg, #f6f9fe 0%, #eef3fc 100%); }
.cs-head { max-width: 860px; }
.cs-head p { margin: 14px 0 0; font-size: 17px; line-height: 1.65; color: var(--text); }
.cs-tabs { display: flex; flex-wrap: wrap; gap: 10px; margin: 28px 0 22px; }
.cs-tabs button { min-width: 140px; padding: 13px 26px; border-radius: 10px; border: 1px solid #d7e0ef; background: #fff; color: var(--ink); font: 600 15px/1 var(--sans); cursor: pointer; transition: background .25s, color .25s, border-color .25s, box-shadow .25s; }
.cs-tabs button:hover { border-color: var(--accent); }
.cs-tabs button[aria-selected="true"] { background: var(--navy); border-color: var(--navy); color: #fff; box-shadow: 0 10px 24px rgba(21,37,79,.22); }
.cs-panel { background: #fff; border-radius: 18px; padding: clamp(22px, 3vw, 40px); box-shadow: 0 16px 40px rgba(65,110,180,.08); }
.cs-panel[hidden] { display: none; }
.cs-panel:not([hidden]) { animation: kxd-in .4s var(--ease); }
.cs-city-name { display: block; font-size: 12px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-bottom: 6px; }
.cs-block { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(24px, 4vw, 56px); padding: clamp(18px, 2.5vw, 30px) 0; border-bottom: 1px solid var(--line); }
.cs-block:first-of-type { padding-top: 0; }
.cs-block-text h3 { margin: 10px 0 14px; font-size: clamp(24px, 2.2vw, 32px); font-weight: 700; letter-spacing: -.03em; line-height: 1.1; color: var(--ink); }
.cs-bar { display: block; width: 36px; height: 3px; border-radius: 2px; background: var(--accent); }
.cs-block-text p { margin: 0 0 12px; line-height: 1.65; color: var(--text); font-size: 15.5px; }
.cs-block-text strong { color: var(--ink); }
.cs-block-aside { display: grid; gap: 16px; align-content: start; }
.cs-block-aside:empty { display: none; }
.cs-block:has(.cs-block-aside:empty) { grid-template-columns: 1fr; }
.cs-city { margin: 0; border-radius: 14px; overflow: hidden; position: relative; aspect-ratio: 581 / 227; }
.cs-city img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cs-city--kin { aspect-ratio: 16 / 7; }
.cs-city--kin figcaption { position: absolute; left: 16px; bottom: 14px; padding: 8px 14px; border-radius: 999px; background: rgba(15,19,36,.65); color: #fff; font-size: 12px; font-weight: 600; letter-spacing: .04em; }
.cs-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.cs-stats--2 { grid-template-columns: repeat(2, 1fr); }
.cs-stat { display: grid; gap: 4px; align-content: start; padding: 16px; border-radius: 14px; background: #f3f7fe; }
.cs-ico { display: block; width: 26px; height: 26px; color: var(--accent); }
.cs-ico svg { width: 100%; height: 100%; }
.cs-stat strong { margin-top: 6px; font-size: clamp(24px, 2.2vw, 30px); font-weight: 700; letter-spacing: -.02em; color: var(--accent); }
.cs-stat b { font-size: 14px; color: var(--ink); }
.cs-stat small { font-size: 12.5px; line-height: 1.45; color: var(--muted); }
.cs-chart-title { margin: 0 0 12px; font-weight: 700; color: var(--ink); font-size: 15px; }
.cs-bars { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: end; height: 170px; padding: 0 6px; border-bottom: 1px solid var(--line); }
.cs-bars-col { display: flex; flex-direction: column; justify-content: flex-end; height: 100%; text-align: center; }
.cs-bars-col span { position: relative; display: block; height: var(--h); border-radius: 6px 6px 0 0; background: #5b8ef1; }
.cs-bars-col--dark span { background: var(--navy); }
.cs-bars-col i { position: absolute; left: 0; right: 0; top: -22px; font-style: normal; font-weight: 700; font-size: 14px; color: var(--accent); }
.cs-bars-col--dark i { color: var(--navy); }
.cs-bars-col em { order: 2; margin-top: 8px; font-style: normal; font-size: 12px; color: var(--muted); transform: translateY(100%); }
.cs-chart { padding-bottom: 28px; }
.cs-source { display: flex; gap: 8px; align-items: flex-start; margin: 2px 0 0; font-size: 12px; line-height: 1.5; color: var(--muted); }
.cs-source span { flex: none; width: 15px; height: 15px; color: var(--accent); margin-top: 1px; }
.cs-source span svg { width: 100%; height: 100%; }
.cs-reponse { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(24px, 4vw, 56px); margin-top: clamp(18px, 2.5vw, 30px); padding: clamp(20px, 3vw, 34px); border-radius: 16px; background: linear-gradient(135deg, #eef4fe 0%, #f7faff 100%); }
.cs-mini { display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); }
.cs-reponse h3 { margin: 10px 0 14px; font-size: clamp(22px, 2vw, 28px); font-weight: 700; letter-spacing: -.02em; line-height: 1.15; color: var(--ink); }
.cs-reponse p { margin: 0 0 10px; font-size: 15px; line-height: 1.65; color: var(--text); }
.cs-reponse-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.cs-reponse-list li { display: grid; gap: 6px; align-content: start; padding: 0 16px; border-left: 1px solid #d5e0f3; }
.cs-reponse-list li:first-child { border-left: 0; padding-left: 0; }
.cs-reponse-list b { font-size: 14px; color: var(--ink); }
.cs-reponse-list small { font-size: 12.5px; line-height: 1.5; color: var(--muted); }
@media (max-width: 1000px) { .cs-block, .cs-reponse { grid-template-columns: 1fr; } .cs-reponse-list { grid-template-columns: 1fr 1fr; row-gap: 18px; } .cs-reponse-list li:nth-child(3) { border-left: 0; padding-left: 0; } }
@media (max-width: 560px) { .cs-stats { grid-template-columns: 1fr 1fr; } .cs-reponse-list { grid-template-columns: 1fr; } .cs-reponse-list li { border-left: 0; padding-left: 0; } .cs-tabs button { min-width: 0; flex: 1; padding: 12px 10px; } }

/* Notre approche : trois piliers */
.corpo-approche { background: radial-gradient(120% 90% at 50% 0%, #2a4fb0 0%, var(--navy) 55%, #0f1a3d 100%); color: #c9d4ee; }
.cp-head { text-align: center; max-width: 820px; margin: 0 auto clamp(36px, 4vw, 56px); }
.cp-head .eyebrow { justify-content: center; color: #aab7d8; }
.cp-head .h2 { color: #fff; }
.cp-head .h2 span { color: #8fb0ff; }
.cp-head .lead { color: #c9d4ee; margin: 16px auto 0; }
.cp-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 24px); }
.cp-card { border-radius: 18px; overflow: hidden; background: #eef3fd; color: var(--text); box-shadow: 0 24px 50px rgba(0,0,0,.25); display: flex; flex-direction: column; }
.cp-img { aspect-ratio: 16 / 9; overflow: hidden; }
.cp-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1s var(--ease); }
.cp-card:hover .cp-img img { transform: scale(1.04); }
.cp-body { padding: 22px 24px 26px; }
.cp-n { font-size: 12px; letter-spacing: .2em; color: var(--accent); }
.cp-body h3 { margin: 8px 0 4px; font-size: clamp(22px, 1.9vw, 27px); font-weight: 700; letter-spacing: -.02em; color: var(--ink); }
.cp-sub { margin: 0 0 12px; color: var(--accent); font-weight: 500; }
.cp-body p { line-height: 1.6; font-size: 15px; }
.cp-body ul { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 10px; }
.cp-body li { display: grid; grid-template-columns: 20px 1fr; gap: 10px; align-items: start; font-size: 14.5px; color: var(--ink); }
.cp-body li span { width: 20px; height: 20px; color: var(--accent); }
.cp-body li span svg { width: 100%; height: 100%; }
@media (max-width: 960px) { .cp-grid { grid-template-columns: 1fr; max-width: 560px; margin-inline: auto; } }

/* Les expériences du terrain */
.corpo-terrain .kt-head p:not(.lead) { margin-top: 12px; color: var(--text); line-height: 1.65; }
.corpo-terrain .kt-head .h2 { margin-top: 6px; }
.cs-reponse { grid-template-columns: 1fr; }
.cs-reponse > div { max-width: 820px; }
.cs-reponse-list { padding-top: 22px; border-top: 1px solid #d5e0f3; }
.cs-reponse-list li { padding: 0 20px; }
@media (max-width: 1000px) { .cs-reponse-list li { padding: 0 14px; } }
/* Images Bruxelles / Paris : affichées en entier (le texte est dans l'image) */
.cs-city:not(.cs-city--kin) { aspect-ratio: auto; }
.cs-city:not(.cs-city--kin) img { height: auto; object-fit: initial; }

/* Chiffres Corpoready : la section tient dans l'écran, seul le contenu de l'onglet défile (ordinateur) */
@media (min-width: 861px) and (min-height: 640px) {
  .corpo-stats { min-height: calc(100vh - var(--header-h, 80px)); display: flex; flex-direction: column; justify-content: center;
    padding-top: clamp(28px, 4vh, 48px) !important; padding-bottom: clamp(28px, 4vh, 48px) !important; scroll-margin-top: var(--header-h, 80px); }
  .corpo-stats .cs-head p { margin-top: 8px; font-size: 15.5px; }
  .corpo-stats .cs-tabs { margin: 18px 0 16px; }
  .cs-panel { height: calc(100vh - var(--header-h, 80px) - 250px); min-height: 380px; overflow-y: auto; overscroll-behavior: contain;
    scrollbar-width: thin; scrollbar-color: #b9c8e6 transparent; scroll-behavior: smooth; }
  .cs-panel::-webkit-scrollbar { width: 8px; }
  .cs-panel::-webkit-scrollbar-thumb { background: #b9c8e6; border-radius: 8px; }
  .cs-scroll-hint { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 10px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
}
.cs-scroll-hint { display: none; }


/* Vidéo d'Elon (20/10) : moins de blanc autour, section bleu ciel plus grande, fenêtre des chiffres plus haute */
.corpo-constat { padding-bottom: clamp(36px, 4vw, 56px) !important; }
@media (min-width: 861px) and (min-height: 640px) {
  .corpo-stats { justify-content: flex-start; min-height: 0; padding-top: clamp(26px, 3.2vh, 40px) !important; padding-bottom: clamp(26px, 3.2vh, 40px) !important; }
  .corpo-stats .cs-head p { margin-top: 6px; font-size: 15px; line-height: 1.55; }
  .corpo-stats .cs-tabs { margin: 14px 0 12px; }
  .corpo-stats .cs-tabs button { padding: 11px 24px; }
  .cs-panel { height: calc(100vh - var(--header-h, 80px) - 200px); min-height: 440px; }
  .corpo-stats .cs-scroll-hint { margin-top: 8px; }
}
.corpo-approche { padding-top: clamp(56px, 6vw, 88px) !important; }
/* Chiffres Corpoready : arrivé au bout du cadre, la page reprend son défilement (pas de blocage) */
.cs-panel { overscroll-behavior: auto !important; }

/* Be Finance : galerie équipe (escalier + grand groupe + saut) */
.bef-gal { display: grid; grid-template-columns: .85fr 1.15fr; grid-template-rows: 1fr 1fr; gap: clamp(12px, 1.6vw, 20px); margin-top: clamp(36px, 4vw, 56px); height: clamp(520px, 52vw, 720px); }
.bef-gal figure { position: relative; margin: 0; border-radius: 18px; overflow: hidden; box-shadow: 0 16px 40px rgba(21,37,79,.10); }
.bef-gal img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s var(--ease); }
.bef-gal figure:hover img { transform: scale(1.03); }
.bef-gal-a { grid-row: 1 / 3; }
.bef-gal figcaption { position: absolute; left: 16px; bottom: 16px; padding: 8px 14px; border-radius: 999px; background: rgba(15,19,36,.62); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font-size: 12px; font-weight: 500; }
@media (max-width: 760px) { .bef-gal { grid-template-columns: 1fr; grid-template-rows: auto; height: auto; } .bef-gal-a { grid-row: auto; aspect-ratio: 1 / 1; } .bef-gal-b, .bef-gal-c { aspect-ratio: 4 / 3; } }

/* Be Finance : hero v3 (maquette d'Elon) — fond clair, équipe dans l'escalier à droite, villes en bas */
.bef-hero3 { position: relative; overflow: hidden; background: #fff; min-height: calc(100vh - var(--bar-h, 34px)); padding: calc(var(--header-h, 80px) + clamp(28px, 4vh, 48px)) 0 clamp(32px, 5vh, 56px); display: flex; }
.bef-hero3-bg { position: absolute; top: 0; right: 0; width: 66%; height: 100%; object-fit: cover; object-position: 50% 45%;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 22%, #000 42%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 22%, #000 42%); }
.bef-hero3::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, #f6f9ff 0%, rgba(246,249,255,.9) 34%, rgba(246,249,255,0) 58%); }
.bef-hero3-inner { position: relative; z-index: 2; display: flex; flex-direction: column; width: 100%; }
.bef-hero3-logo { width: clamp(120px, 11vw, 160px); height: auto; }
.bef-hero3-text { margin: clamp(40px, 8vh, 90px) 0 auto; max-width: 640px; }
.bef-hero3-text p { margin: 0 0 clamp(22px, 3vh, 34px); font-size: clamp(22px, 2.15vw, 32px); line-height: 1.3; letter-spacing: -.01em; color: var(--navy); font-weight: 400; }
.bef-hero3-cities { margin-top: clamp(28px, 5vh, 56px); padding-top: 22px; border-top: 1px solid #d6dff0; max-width: 700px; }
.bef-hero3-cities span { display: block; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #6f8ed6; margin-bottom: 12px; }
.bef-hero3-cities ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 14px 46px; }
.bef-hero3-cities li { display: flex; align-items: center; gap: 8px; font-size: 17px; font-weight: 500; color: var(--navy); }
.bef-hero3-cities svg { width: 20px; height: 20px; color: var(--accent); }
@media (max-width: 860px) {
  .bef-hero3 { min-height: 0; flex-direction: column; padding-bottom: 0; }
  .bef-hero3-bg { position: relative; width: 100%; height: 360px; order: 2; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 25%); mask-image: linear-gradient(180deg, transparent 0%, #000 25%); }
  .bef-hero3::before { display: none; }
  .bef-hero3-text { margin-bottom: 0; }
  .bef-hero3-cities ul { gap: 12px 24px; }
}
.bef-hero3-bg { width: 62%; object-position: 50% 12%; } .bef-hero3-text { max-width: 600px; }
@media (max-width: 860px) {
  .bef-hero3 { display: block; }
  .bef-hero3-inner { display: block; }
  .bef-hero3-bg { display: block; width: 100% !important; height: 380px; margin-top: 28px; object-position: 50% 20%; }
  .bef-hero3-text { margin-top: 32px; max-width: none; }
  .bef-hero3-text p { font-size: 20px; }
  .bef-hero3-cities ul { gap: 10px 20px; }
}
@media (max-width: 860px) {
  .bef-hero3 { padding-top: calc(var(--header-h, 80px) + 24px); }
  .bef-hero3-inner { width: auto !important; box-sizing: border-box; }
  .bef-hero3-bg { position: relative; order: 0; margin: 28px 0 0; }
}
/* Toute l'équipe visible : la photo garde ses proportions (pas de recadrage) */
@media (min-width: 861px) { .bef-hero3-bg { width: auto !important; height: 100%; aspect-ratio: 1800 / 1775; max-width: 70%; object-fit: cover; object-position: 50% 50%; } }
@media (max-width: 860px) { .bef-hero3-bg { height: auto !important; aspect-ratio: 1800 / 1775; object-fit: cover; } }
@media (max-width: 860px) { .bef-hero3-text, .bef-hero3-text p, .bef-hero3-cities { max-width: 100% !important; width: auto !important; overflow-wrap: break-word; } .bef-hero3 .wrap { padding-left: 20px; padding-right: 20px; } }
@media (min-width: 861px) { .bef-hero3 { min-height: max(calc(100vh - var(--bar-h, 34px)), 760px); } .bef-hero3-bg { object-position: 50% 0%; } }
/* La photo démarre sous l'en-tête : la rangée du haut (dont Elon) n'est plus cachée */
@media (min-width: 861px) { .bef-hero3-bg { top: calc(var(--header-h, 80px) + 12px); height: calc(100% - var(--header-h, 80px) - 12px); } }

/* ---------- Be Finance : 2e section (entreprise / particulier) ---------- */
.bef-sw { background: #fff; }
.bs-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 18px; }
.bs-choice button { display: grid; grid-template-columns: auto 1fr; gap: 26px; align-items: center; text-align: left; padding: 28px 34px; border-radius: 10px; border: 1px solid #dfe6f2; background: #fff; cursor: pointer; font: inherit; color: inherit; transition: border-color .25s, background .25s, box-shadow .25s; }
.bs-choice button:hover { border-color: #b9cdf2; }
.bs-choice button[aria-selected="true"] { border-color: var(--accent); background: #f2f7ff; box-shadow: 0 10px 28px rgba(29,78,216,.10); }
.bs-big { width: 64px; height: 64px; color: var(--accent); }
.bs-big svg { width: 100%; height: 100%; }
.bs-choice b { display: block; font-size: 19px; color: var(--ink); }
.bs-choice small { display: block; margin-top: 8px; font-size: 15px; color: var(--text); }
.bs-choice em { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; font-style: normal; font-weight: 500; font-size: 15px; color: var(--accent); }
.bs-choice em svg { width: 16px; height: 16px; transition: transform .3s; }
.bs-choice button:hover em svg { transform: translateX(4px); }
.bs-panel { padding: clamp(24px, 3vw, 40px); border-radius: 10px; border: 1px solid #e3eaf6; background: linear-gradient(180deg, #f7faff 0%, #f1f6fe 100%); }
.bs-panel[hidden] { display: none; }
.bs-panel:not([hidden]) { animation: kxd-in .35s var(--ease); }
.bs-head { display: grid; grid-template-columns: auto 1fr; gap: 26px; align-items: start; }
.bs-hico { width: 34px; height: 34px; margin-top: 6px; color: var(--accent); }
.bs-hico svg { width: 100%; height: 100%; }
.bs-head h2 { margin: 0; font-size: clamp(26px, 2.4vw, 32px); font-weight: 700; letter-spacing: -.02em; color: var(--ink); }
.bs-sub { margin: 6px 0 0; font-size: 18px; color: var(--ink); }
.bs-head p:last-child { margin: 8px 0 0; color: var(--text); }
.bs-grid { list-style: none; margin: clamp(28px, 3vw, 40px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px 28px; }
.bs-grid li { display: grid; grid-template-columns: 58px 1fr; gap: 16px; align-items: start; }
.bs-ico { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: #fff; color: var(--accent); box-shadow: 0 6px 18px rgba(29,78,216,.10); }
.bs-ico svg { width: 28px; height: 28px; }
.bs-grid h4 { margin: 4px 0 8px; font-size: 16.5px; font-weight: 600; color: var(--ink); line-height: 1.3; }
.bs-grid p { margin: 0; font-size: 14px; line-height: 1.55; color: var(--text); }
.bs-cta { display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; margin-top: clamp(28px, 3vw, 40px); padding: 20px 26px; border-radius: 8px; background: #e9f1fe; }
.bs-cico { width: 46px; height: 46px; color: var(--accent); padding-right: 22px; border-right: 1px solid #c8d8f3; box-sizing: content-box; }
.bs-cico svg { width: 46px; height: 46px; }
.bs-cta b { font-size: 17px; color: var(--ink); }
.bs-cta p { margin: 6px 0 0; font-size: 14.5px; color: var(--text); }
@media (max-width: 1000px) { .bs-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px) {
  .bs-choice { grid-template-columns: 1fr; }
  .bs-choice button { padding: 20px; gap: 16px; }
  .bs-big { width: 46px; height: 46px; }
  .bs-grid { grid-template-columns: 1fr; gap: 22px; }
  .bs-cta { grid-template-columns: 1fr; text-align: left; }
  .bs-cico { border-right: 0; padding-right: 0; }
}
.bs-choice b, .bs-cta b { font-weight: 700; }
.bs-cta .btn { text-transform: none; letter-spacing: 0; font-size: 15px; font-weight: 600; white-space: nowrap; }
.bef-sw { padding-top: clamp(48px, 5vw, 72px) !important; }
.bs-legal { margin: 18px 0 0; font-size: 12.5px; color: var(--muted); }

/* ---------- Be Finance : 3e section (plan d'action + projet) ---------- */
.bef-plan { background: #fff; padding-top: clamp(40px, 4vw, 64px) !important; padding-bottom: clamp(40px, 4vw, 64px) !important; }
.bp-title { margin: 0 0 clamp(26px, 3vw, 40px); font-size: clamp(28px, 3vw, 42px); font-weight: 500; letter-spacing: -.03em; color: var(--navy); }
.bp-title strong { font-weight: 800; }
.bp-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.bp-steps li { position: relative; display: grid; grid-template-columns: 56px 1fr; gap: 18px; align-items: start; padding-right: 30px; }
.bp-n { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #eaf1fd; color: var(--accent); font-weight: 700; font-size: 17px; }
.bp-steps h3 { margin: 4px 0 8px; font-size: 17px; font-weight: 600; color: var(--ink); }
.bp-steps p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--text); }
.bp-arr { position: absolute; right: 0; top: 18px; width: 18px; height: 18px; color: #8fa6d6; }
.bp-arr svg { width: 100%; height: 100%; }
.bef-proj { position: relative; overflow: hidden; text-align: center; padding: clamp(48px, 5vw, 72px) 0; background: radial-gradient(60% 120% at 0% 100%, #dfeafb 0%, transparent 60%), radial-gradient(60% 120% at 100% 100%, #dfeafb 0%, transparent 60%), linear-gradient(180deg, #eef4fd 0%, #f5f8fe 100%); }
.bef-proj h2 { margin: 0; font-size: clamp(26px, 2.8vw, 38px); font-weight: 800; letter-spacing: -.03em; color: var(--navy); }
.bef-proj p { margin: 14px auto 0; font-size: 17px; color: var(--text); }
.bpj-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; margin-top: 30px; }
.bpj-btns .btn { min-width: 220px; justify-content: center; text-transform: none; letter-spacing: 0; font-size: 15.5px; font-weight: 600; }
.btn--outline { background: #fff !important; color: var(--accent) !important; border: 1px solid #9db7ea !important; box-shadow: none !important; }
.btn--outline:hover { border-color: var(--accent) !important; background: #f3f7ff !important; }
@media (max-width: 1000px) { .bp-steps { grid-template-columns: 1fr 1fr; row-gap: 28px; } .bp-arr { display: none; } .bp-steps li { padding-right: 0; } }
@media (max-width: 560px) { .bp-steps { grid-template-columns: 1fr; } .bpj-btns .btn { width: 100%; } }
/* Hero Be Finance : la photo se prolonge vers la gauche dans un flou */
.bef-hero3-blur { display: none; }
@media (min-width: 861px) {
  .bef-hero3-blur { display: block; position: absolute; top: calc(var(--header-h, 80px) + 12px); left: 0; right: 0; bottom: 0; width: 100%; height: calc(100% - var(--header-h, 80px) - 12px); object-fit: cover; object-position: 70% 40%; filter: blur(28px) saturate(1.1); transform: scale(1.08); opacity: .55; z-index: 0; }
  .bef-hero3::before { background: linear-gradient(90deg, rgba(246,249,255,.92) 0%, rgba(246,249,255,.78) 32%, rgba(246,249,255,.15) 55%, rgba(246,249,255,0) 65%); }
  .bef-hero3-bg { z-index: 0; -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.6) 18%, #000 36%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.6) 18%, #000 36%); }
}

/* Hero Be Finance — transition fluide : la photo se prolonge par son reflet flouté (les bords se raccordent) */
.bef-hero3-mirror { display: none; }
@media (min-width: 861px) {
  .bef-hero3-media { position: absolute; z-index: 0; top: var(--header-h, 80px); right: 0; bottom: 0; display: flex; flex-direction: row-reverse; }
  .bef-hero3-media img { flex: none; height: 100%; width: auto !important; max-width: none !important; aspect-ratio: 1800 / 1775; object-fit: cover; }
  .bef-hero3-media .bef-hero3-bg { position: relative !important; top: auto !important; right: auto !important; z-index: 1;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 12%, rgba(0,0,0,.8) 28%, #000 42%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 12%, rgba(0,0,0,.8) 28%, #000 42%); }
  .bef-hero3-mirror { display: block; transform: scaleX(-1); filter: blur(26px) saturate(1.05); margin-right: -2px;
    -webkit-mask-image: linear-gradient(270deg, #000 0%, #000 30%, transparent 85%); mask-image: linear-gradient(270deg, #000 0%, #000 30%, transparent 85%); }
  .bef-hero3::before { z-index: 1; background: linear-gradient(90deg, rgba(246,249,255,.94) 0%, rgba(246,249,255,.86) 30%, rgba(246,249,255,.45) 46%, rgba(246,249,255,0) 60%); }
}

/* ---------- Be Finance vivante (photos + mouvements) ---------- */
.bs-head { grid-template-columns: auto 1fr minmax(240px, 34%); align-items: center; }
.bs-photo { margin: 0; aspect-ratio: 4 / 3; border-radius: 14px; overflow: hidden; box-shadow: 0 18px 40px rgba(21,37,79,.14); }
.bs-photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s var(--ease); }
.bs-panel:hover .bs-photo img { transform: scale(1.04); }
.bs-grid li { padding: 14px; margin: -14px; border-radius: 14px; transition: background .3s, transform .3s var(--ease); }
.bs-grid li:hover { background: #fff; transform: translateY(-3px); box-shadow: 0 12px 30px rgba(21,37,79,.08); }
.bs-ico { transition: transform .4s var(--ease), background .3s, color .3s; }
.bs-grid li:hover .bs-ico { transform: scale(1.08) rotate(-6deg); background: var(--accent); color: #fff; }
.bs-grid li.reveal:nth-child(2) { --rd: 80ms; } .bs-grid li.reveal:nth-child(3) { --rd: 160ms; } .bs-grid li.reveal:nth-child(4) { --rd: 240ms; } .bs-grid li.reveal:nth-child(5) { --rd: 320ms; }
.bs-choice button .bs-big svg { transition: transform .4s var(--ease); }
.bs-choice button:hover .bs-big svg, .bs-choice button[aria-selected="true"] .bs-big svg { transform: translateY(-3px) scale(1.05); }
/* Plan d'action : une ligne se dessine entre les étapes, les ronds s'allument au survol */
.bp-steps { position: relative; }
.bp-steps::before { content: ""; position: absolute; left: 28px; right: 12%; top: 28px; height: 2px; background: linear-gradient(90deg, var(--accent), #9db7ea); transform: scaleX(0); transform-origin: left; transition: transform 1.6s var(--ease) .2s; z-index: 0; opacity: .35; }
.bp-steps.in::before { transform: scaleX(1); }
.bp-n { position: relative; z-index: 1; transition: background .3s, color .3s, transform .3s var(--ease); box-shadow: 0 0 0 6px #fff; }
.bp-steps li:hover .bp-n { background: var(--accent); color: #fff; transform: scale(1.08); }
.bp-arr { display: none; }
/* Bandeau équipe */
.bef-team { background: #fff; padding-top: clamp(48px, 5vw, 72px) !important; padding-bottom: clamp(48px, 5vw, 72px) !important; }
.bef-team .kt-head .h2 span { color: var(--accent); }
.bef-team .kt-item { aspect-ratio: 4 / 3; width: clamp(260px, 26vw, 400px); }
/* Bloc « Quel projet » : léger mouvement du fond */
.bef-proj { background-size: 140% 140%, 140% 140%, 100% 100%; animation: bpj-move 14s ease-in-out infinite alternate; }
@keyframes bpj-move { from { background-position: 0% 100%, 100% 100%, 0 0; } to { background-position: 30% 60%, 70% 60%, 0 0; } }
.bpj-btns .btn { transition: transform .25s var(--ease), box-shadow .25s; }
.bpj-btns .btn:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(29,78,216,.22); }
@media (max-width: 860px) { .bs-head { grid-template-columns: auto 1fr; } .bs-photo { grid-column: 1 / -1; } .bp-steps::before { display: none; } }
@media (prefers-reduced-motion: reduce) { .bef-proj { animation: none; } }
.bs-hico { align-self: start; margin-top: 70px; } @media (max-width: 860px) { .bs-hico { margin-top: 6px; } }

/* ---------- Speaker — thèmes en onglets ---------- */
.st-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 18px; }
.st-tabs button { position: relative; overflow: hidden; display: flex; align-items: center; gap: 14px; padding: 18px 22px; border-radius: 14px; border: 1px solid #dfe6f2; background: #fff; color: var(--ink); font: 600 16px/1.2 var(--sans); text-align: left; cursor: pointer; transition: background .3s, color .3s, border-color .3s, box-shadow .3s, transform .25s var(--ease); }
.st-tabs button:hover { border-color: #b9cdf2; transform: translateY(-2px); }
.st-tabs button[aria-selected="true"] { background: var(--navy); border-color: var(--navy); color: #fff; box-shadow: 0 14px 30px rgba(21,37,79,.25); }
.st-tn { font-size: 13px; letter-spacing: .14em; color: var(--accent); font-weight: 700; }
.st-tabs button[aria-selected="true"] .st-tn { color: #9fb8ff; }
.st-ti { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: #eef4fe; color: var(--accent); flex: none; transition: background .3s, color .3s; }
.st-tabs button[aria-selected="true"] .st-ti { background: rgba(255,255,255,.12); color: #fff; }
.st-ti svg { width: 20px; height: 20px; }
.st-bar { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: #9fb8ff; transform: scaleX(0); transform-origin: left; }
.st-tabs button[aria-selected="true"] .st-bar.run { animation: st-prog var(--st-d, 7s) linear forwards; }
@keyframes st-prog { to { transform: scaleX(1); } }
.st-panel { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(28px, 4vw, 56px); align-items: center; padding: clamp(18px, 2vw, 24px); border-radius: 22px; background: linear-gradient(135deg, #f2f6fe 0%, #f8faff 100%); border: 1px solid #e3eaf6; }
.st-panel[hidden] { display: none; }
.st-panel:not([hidden]) { animation: st-in .55s var(--ease); }
@keyframes st-in { from { opacity: 0; transform: translateY(14px); } }
.st-photo { position: relative; margin: 0; aspect-ratio: 4 / 3.4; border-radius: 16px; overflow: hidden; box-shadow: 0 24px 50px rgba(21,37,79,.18); }
.st-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.st-panel:not([hidden]) .st-photo img { animation: st-zoom 1.4s var(--ease); }
@keyframes st-zoom { from { transform: scale(1.08); } }
.st-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,16,36,0) 50%, rgba(10,16,36,.55) 100%); }
.st-big { position: absolute; z-index: 1; right: 18px; bottom: 6px; font-size: clamp(64px, 8vw, 120px); font-weight: 800; letter-spacing: -.05em; line-height: 1; color: rgba(255,255,255,.88); }
.st-body { padding: clamp(6px, 1vw, 16px) clamp(4px, 1.5vw, 24px) clamp(6px, 1vw, 16px) 0; }
.st-kicker { font-size: 12px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); }
.st-body h3 { margin: 10px 0 0; font-size: clamp(28px, 2.8vw, 40px); font-weight: 700; letter-spacing: -.03em; line-height: 1.08; color: var(--ink); }
.st-line { margin: 14px 0 0; font-size: clamp(17px, 1.4vw, 20px); line-height: 1.5; color: var(--text); }
.st-points { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 12px; }
.st-points li { display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: center; font-size: 16px; color: var(--ink); }
.st-points svg { width: 22px; height: 22px; color: var(--accent); }
.st-meta { margin: 22px 0 18px; font-size: 13.5px; color: var(--muted); }
@media (max-width: 860px) {
  .st-tabs { display: flex; overflow-x: auto; scrollbar-width: none; margin-inline: calc(-1 * var(--gutter, 16px)); padding: 2px var(--gutter, 16px) 6px; }
  .st-tabs::-webkit-scrollbar { display: none; }
  .st-tabs button { flex: none; padding: 14px 16px; font-size: 15px; }
  .st-panel { grid-template-columns: 1fr; }
  .st-body { padding: 0 6px 8px; }
}
@media (prefers-reduced-motion: reduce) { .st-panel, .st-photo img, .st-bar { animation: none !important; } }

/* Speaker « En action » : dessin de scène vue de la salle derrière la section (comme la carte du monde de l'accueil) */
#en-action { position: relative; isolation: isolate; overflow: hidden; background: #fff; }
#en-action::before { content: ""; position: absolute; z-index: -1; pointer-events: none; left: 50%; top: 50%; width: 92%; aspect-ratio: 1000 / 560; transform: translate(-50%, -50%);
  background: url("../img/stage.svg") center / contain no-repeat;
  -webkit-mask-image: radial-gradient(ellipse 62% 66% at 50% 46%, #000 52%, transparent 100%); mask-image: radial-gradient(ellipse 62% 66% at 50% 46%, #000 52%, transparent 100%); }
@media (max-width: 760px) { #en-action::before { width: 170%; top: 18%; } }
/* Finalement : carte du monde (comme l'accueil) derrière « Voir Elon sur scène » */
#en-action::before { aspect-ratio: 1000 / 480; width: 90%; background-image: url("../img/world-map.svg");
  -webkit-mask-image: radial-gradient(ellipse 60% 62% at 50% 45%, #000 55%, transparent 100%); mask-image: radial-gradient(ellipse 60% 62% at 50% 45%, #000 55%, transparent 100%); }
@media (max-width: 760px) { #en-action::before { width: 160%; top: 22%; } }
/* Speaker « En action » : ce qu'Elon fait concrètement */
.action-points { list-style: none; margin: 28px 0 0; padding: 0; display: grid; gap: 16px; }
.action-points li { display: grid; gap: 4px; padding-left: 20px; border-left: 2px solid var(--accent); color: var(--text); font-size: 15.5px; line-height: 1.55; }
.action-points strong { color: var(--ink); font-size: 17px; font-weight: 600; }
/* Vidéo « En action » : lecture automatique en muet, bouton pour activer le son */
.vsound { position: absolute; z-index: 4; left: 50%; bottom: 58px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border: 0; border-radius: 999px; background: rgba(15,19,36,.7); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font: 600 12.5px/1 var(--sans); cursor: pointer; white-space: nowrap; transition: background .25s; }
.vsound:hover { background: var(--accent); }
.vsound-on { display: none; }
.vsound[aria-pressed="true"] .vsound-on { display: inline; }
.vsound[aria-pressed="true"] .vsound-off { display: none; }
/* « En action » : le format à côté du téléphone */
.action-specs { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 12px; margin: 28px 0 0; }
.action-specs div { padding: 14px 18px; border-radius: 12px; background: rgba(255,255,255,.85); border: 1px solid #e1e8f4; box-shadow: 0 8px 22px rgba(21,37,79,.06); }
.action-specs dt { font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--accent); }
.action-specs dd { margin: 6px 0 0; font-size: 14.5px; font-weight: 600; color: var(--ink); }
@media (max-width: 1100px) { .action-specs { grid-template-columns: 1fr; } }

/* ---------- Speaker : thèmes en camembert à côté du téléphone ---------- */
#en-action .action-grid { align-items: center; }
.pz-accent { color: var(--accent); }
.pz-lead { margin-top: 14px !important; font-size: 16px !important; }
.pz { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(200px, .8fr); gap: clamp(18px, 2.5vw, 34px); align-items: center; margin-top: 22px; }
.pz-svg { width: 100%; height: auto; overflow: visible; }
.pz-slice { cursor: pointer; outline: none; }
.pz-part { fill: #dce7f6; stroke: #fff; stroke-width: 4; transition: fill .3s, transform .35s var(--ease); transform-origin: 200px 200px; }
.pz-slice:hover .pz-part, .pz-slice:focus-visible .pz-part { fill: #c9daf3; }
.pz-slice.is-active .pz-part { fill: #bcd2f2; transform: scale(1.035); }
.pz-arc { fill: none; stroke: var(--accent); stroke-width: 7; stroke-linecap: round; opacity: 0; transition: opacity .3s; }
.pz-slice.is-active .pz-arc { opacity: 1; }
.pz-n { font: 700 15px var(--sans); fill: var(--navy); pointer-events: none; }
.pz-t { font: 700 14.5px var(--sans); fill: var(--navy); letter-spacing: -.01em; pointer-events: none; }
.pz-slice.is-active .pz-n, .pz-slice.is-active .pz-t { fill: var(--accent); }
.pz-core { fill: var(--navy); }
.pz-cn { font: 700 16px var(--sans); fill: #9fb8ff; }
.pz-ct { font: 700 14px var(--sans); fill: #fff; }
.pz-detail[hidden] { display: none; }
.pz-detail:not([hidden]) { animation: kxd-in .35s var(--ease); }
.pz-dn { margin: 0; font-size: 13px; font-weight: 700; letter-spacing: .18em; color: var(--accent); }
.pz-detail h3 { margin: 6px 0 14px; font-size: clamp(20px, 1.8vw, 24px); font-weight: 700; letter-spacing: -.02em; line-height: 1.15; color: var(--ink); }
.pz-detail ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pz-detail li { display: grid; grid-template-columns: 24px 1fr; font-size: 15px; line-height: 1.45; color: var(--ink); }
.pz-detail li span { color: var(--accent); font-weight: 700; }
.pz-link { display: inline-flex; gap: 8px; margin-top: 18px; font-weight: 600; font-size: 14.5px; color: var(--accent); }
.pz-link span { transition: transform .3s; }
.pz-link:hover span { transform: translateX(4px); }
@media (max-width: 1100px) { .pz { grid-template-columns: 1fr; } .pz-svg { max-width: 380px; margin-inline: auto; display: block; } }
/* « Les thèmes » (Speaker) : sans carte du monde, fond gris du site */
#en-action { background: var(--soft) !important; }
#en-action::before { display: none !important; }
/* Camembert : flèche au centre qui pointe la part choisie, camembert plus grand, titre plus petit */
.pz-arrow { transform-box: view-box; transform-origin: 200px 200px; transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.pz-arrow path { fill: #fff; }
#en-action .action-txt .h2 { font-size: clamp(24px, 2.2vw, 32px) !important; }
.pz { grid-template-columns: minmax(320px, 1.35fr) minmax(190px, .75fr); gap: clamp(14px, 2vw, 28px); }
.pz-svg { max-width: 460px; }
.pz-n { font-size: 16px; } .pz-t { font-size: 15px; }
@media (max-width: 1100px) { .pz-svg { max-width: 420px; } }
/* Aiguille de boussole au centre du camembert */
.pz-arrow path { fill: none; }
.pzn-r1 { fill: #e11d2a !important; } .pzn-r2 { fill: #b5121d !important; }
.pzn-b1 { fill: #3b82d6 !important; } .pzn-b2 { fill: #1f5fae !important; }
.pzn-hub { fill: #c9ced8; stroke: #fff; stroke-width: 2; } .pzn-hub2 { fill: #8a93a3; }
.pz-core { fill: #fff; stroke: #dbe4f3; stroke-width: 2; }
/* Téléphone -10 %, camembert plus grand */
#en-action .phone18 { width: clamp(225px, 21.6vw, 288px); }
#en-action .action-grid { grid-template-columns: auto 1fr !important; gap: clamp(32px, 4vw, 64px); }
.pz { grid-template-columns: minmax(360px, 1.5fr) minmax(180px, .7fr); }
.pz-svg { max-width: 520px; }
@media (max-width: 1100px) { .pz { grid-template-columns: minmax(0, 1fr); } .pz-svg { max-width: 440px; margin-inline: auto; } }
/* Aiguille : la pointe bleue indique la part choisie, la queue est rouge */
.pzn-r1 { fill: #3b82d6 !important; } .pzn-r2 { fill: #1f5fae !important; }
.pzn-b1 { fill: #e11d2a !important; } .pzn-b2 { fill: #b5121d !important; }
.pzn-b1, .pzn-b2 { display: none; }
#en-action .action-grid { gap: clamp(48px, 7vw, 120px) !important; }

/* Hero Speaker (photo d'Elon 22/10) : titre sur 2 lignes « Faire intervenir / Elon. », photo plus petite à droite */
@media (min-width: 861px) {
  .sp-hero-txt { max-width: 760px; position: relative; z-index: 2; }
  .sp-title { font-size: clamp(56px, min(7.2vw, 11vh), 112px); line-height: .95; }
  .sp-title .sp-line:nth-child(3) { display: block; }
  .sp-lead { max-width: 480px; }
}
@media (min-width: 861px) {
}
@media (min-width: 861px) { .sp-hero-inner { padding-bottom: 20vh !important; } }
@media (min-width: 861px) { .sp-hero-inner { padding-bottom: 30vh !important; } }
/* Hero Speaker : texte comme la référence (titre plus grand, accroche plus étroite sur 3 lignes) */
@media (min-width: 861px) {
  .sp-hero-txt { max-width: 820px; }
  .sp-title { font-size: clamp(64px, min(8.2vw, 13vh), 132px) !important; line-height: .93; letter-spacing: -.055em; }
  .sp-lead { max-width: 480px !important; margin-top: 40px !important; font-size: clamp(18px, 1.45vw, 21px); line-height: 1.65; }
  .sp-actions { margin-top: 44px !important; }
  .sp-hero-inner { padding-bottom: 24vh !important; }
}
/* Hero Speaker : texte calé au détail près sur la capture de référence (1600 px) */
@media (min-width: 861px) {
  .sp-hero .sp-hero-inner.wrap { max-width: none; padding-left: clamp(24px, 10.8vw, 220px); }
  .sp-title { font-size: clamp(64px, min(8.35vw, 13.5vh), 134px) !important; }
  .sp-lead { max-width: 500px !important; font-size: clamp(18px, 1.39vw, 22.5px) !important; line-height: 1.6 !important; }
  .sp-actions { margin-top: 56px !important; }
  .sp-btn { padding: 21px 32px !important; font-size: 15px; }
  .sp-trust { margin-top: 64px !important; gap: 16px; font-size: 14.5px; color: #8d95ad; }
  .sp-trust img { width: 70px; }
}
@media (min-width: 861px) { .sp-hero-inner { padding-bottom: 21.6vh !important; } .sp-btn { padding: 21px 22px 21px 28px !important; } }
@media (min-width: 861px) { .sp-title { font-size: clamp(64px, 7.36vw, 130px) !important; } .sp-hero-inner { padding-bottom: 15vh !important; } .sp-btn { padding-right: 18px !important; } }
@media (min-width: 861px) { .sp-hero-inner { padding-bottom: 12.4vh !important; } .sp-actions { margin-top: 52px !important; } .sp-lead { margin-top: 37px !important; } }
@media (min-width: 861px) { .sp-hero { justify-content: flex-end !important; } .sp-hero-inner { padding-top: calc(var(--header-h) + 24px) !important; padding-bottom: 8.6vh !important; } }
@media (min-width: 861px) { .sp-title { line-height: .912 !important; } .sp-lead { line-height: 1.53 !important; } }
@media (min-width: 861px) { .sp-lead { margin-top: 42px !important; } .sp-hero-inner { padding-bottom: 9.15vh !important; } }
@media (min-width: 861px) { .sp-btn { padding-left: 31px !important; } }
@media (min-width: 861px) { .sp-btn { padding-right: 13px !important; } }
.pz-t { font-size: 16px !important; }

/* ---------- Speaker : bandeau « Ils ont fait intervenir Elon » (logos en couleur qui défilent) ---------- */
.refs { background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.refs-inner { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: clamp(24px, 4vw, 56px); padding: clamp(28px, 3.5vw, 44px) 0 clamp(28px, 3.5vw, 44px) clamp(20px, 10.8vw, 220px); }
.refs-eyebrow { display: flex; align-items: center; gap: 14px; font-size: 12px; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; color: var(--ink); }
.refs-eyebrow::before { content: ""; width: 34px; height: 1.5px; background: var(--accent); }
.refs-head h2 { margin: 10px 0 0; font-size: clamp(22px, 2vw, 30px); font-weight: 800; line-height: 1.05; letter-spacing: -.03em; color: var(--ink); }
.refs-head h2 span { display: block; font-weight: 400; color: var(--accent); }
.refs-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%); }
.refs-track { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: clamp(56px, 6vw, 96px); width: max-content; animation: refs-scroll 30s linear infinite; }
.refs-marquee:hover .refs-track { animation-play-state: paused; }
@keyframes refs-scroll { to { transform: translateX(-50%); } }
.refs-track li { flex: none; display: flex; align-items: center; }
.refs-track img { display: block; width: auto; transition: transform .3s var(--ease); }
.refs-track li:hover img { transform: scale(1.06); }
.lg-kpmg img { height: 44px; }
.lg-kul img { height: 46px; }
.lg-ulb img { height: 62px; }
@media (max-width: 760px) { .refs-inner { grid-template-columns: 1fr; padding-left: 20px; gap: 18px; } .lg-kpmg img { height: 34px; } .lg-kul img { height: 36px; } .lg-ulb img { height: 48px; } }
@media (prefers-reduced-motion: reduce) { .refs-track { animation: none; } .refs-marquee { overflow-x: auto; } }
.lg-africell img { height: 40px; }
.lg-engages img { height: 64px; }
.lg-harel img { height: 64px; border-radius: 10px; }
.lg-borne img { height: 54px; }
.refs-track { animation-duration: 45s; }
@media (max-width: 760px) { .lg-africell img { height: 32px; } .lg-engages img, .lg-harel img { height: 50px; } .lg-borne img { height: 42px; } }
.lg-engages img { height: 80px; } @media (max-width: 760px) { .lg-engages img { height: 60px; } }
.lg-borne img { height: 60px; } @media (max-width: 760px) { .lg-borne img { height: 46px; } }

/* ---------- Speaker : section « Le format » ---------- */
.fmt { background: #fff; padding-top: clamp(56px, 6vw, 88px) !important; padding-bottom: clamp(56px, 6vw, 88px) !important; }
.fmt-head { display: grid; grid-template-columns: 1fr 1fr; gap: 8px clamp(28px, 5vw, 80px); align-items: end; margin-bottom: clamp(28px, 3vw, 44px); }
.fmt-head .eyebrow { grid-column: 1 / -1; }
.fmt-head .h2 { margin: 0; font-size: clamp(26px, 2.6vw, 36px) !important; }
.fmt-head .lead { margin: 0; font-size: 16.5px !important; color: var(--text); }
.fmt-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(12px, 1.6vw, 20px); }
.fmt-grid li { display: grid; gap: 6px; align-content: start; padding: 24px 22px; border-radius: 16px; background: var(--soft); border: 1px solid #e3eaf6; transition: transform .3s var(--ease), box-shadow .3s, background .3s; }
.fmt-grid li:hover { transform: translateY(-4px); background: #fff; box-shadow: 0 16px 36px rgba(21,37,79,.10); }
.fmt-ico { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 10px; border-radius: 12px; background: #fff; color: var(--accent); box-shadow: 0 6px 16px rgba(29,78,216,.10); }
.fmt-ico svg { width: 24px; height: 24px; }
.fmt-k { font-size: 11.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--accent); }
.fmt-grid strong { font-size: 17px; font-weight: 600; line-height: 1.4; color: var(--ink); }
.fmt-grid li.reveal:nth-child(2) { --rd: 80ms; } .fmt-grid li.reveal:nth-child(3) { --rd: 160ms; } .fmt-grid li.reveal:nth-child(4) { --rd: 240ms; }
@media (max-width: 960px) { .fmt-head { grid-template-columns: 1fr; } .fmt-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .fmt-grid { grid-template-columns: 1fr; } }
/* « Le format » : texte simple, sans cartes ni icônes */
.fmt-grid { gap: 0; border-top: 1px solid var(--line); }
.fmt-grid li, .fmt-grid li:hover { padding: 22px 24px 4px 0; border: 0; border-radius: 0; background: none; box-shadow: none; transform: none; }
.fmt-grid li + li { padding-left: 24px; border-left: 1px solid var(--line); }
@media (max-width: 960px) { .fmt-grid li:nth-child(3) { padding-left: 0; border-left: 0; } }
@media (max-width: 520px) { .fmt-grid li + li { padding-left: 0; border-left: 0; } .fmt-grid li { padding: 16px 0 0; } }
.pz-detail h3 { margin-top: 0; }

/* ==========================================================================
   Retours Elon — 2026-11-09
   ========================================================================== */

/* CTA bleu (toutes les pages) : maquette Elon, photo détourée qui dépasse du bloc */
.cta-blue-wrap { padding: clamp(110px, 12vw, 160px) 0 clamp(56px, 7vw, 100px); background: #fff; }
.cta-blue { position: relative; min-height: clamp(260px, 24vw, 330px); display: flex; align-items: center; border-radius: 22px; color: #fff; }
.cta-blue-bg { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; background: linear-gradient(110deg, #0b1d4d 0%, #102f78 55%, #1747b8 100%); box-shadow: 0 30px 70px rgba(13,31,77,.25); }
.cta-blue-circle { position: absolute; right: 6%; top: 50%; width: clamp(280px, 30vw, 420px); aspect-ratio: 1; border-radius: 50%; transform: translateY(-46%); background: radial-gradient(circle at 40% 35%, #6aa8ff 0%, #2f6fe0 60%, #1d55c9 100%); }
.cta-blue-ring { position: absolute; right: calc(6% - 22px); top: 50%; width: calc(clamp(280px, 30vw, 420px) + 44px); aspect-ratio: 1; border-radius: 50%; transform: translateY(-48%); border: 1px solid rgba(255,255,255,.22); }
.cta-blue-text { position: relative; z-index: 2; max-width: 62%; padding: clamp(36px, 4.4vw, 60px); }
.cta-blue-title { margin: 0 0 clamp(24px, 2.6vw, 34px); font-family: var(--sans); font-weight: 700; font-size: clamp(30px, 3.5vw, 50px); line-height: 1.08; letter-spacing: -.025em; color: #fff; }
.cta-blue-title span { color: #7cb4ff; }
.cta-blue-btn { display: inline-flex; align-items: center; gap: 14px; padding: 17px 26px; border-radius: 8px; background: #fff; color: #0b1d4d; font-size: 14px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; transition: transform .3s var(--ease), box-shadow .3s var(--ease); }
.cta-blue-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(0,0,0,.25); }
.cta-blue-btn:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.cta-blue-cut { position: absolute; z-index: 1; right: calc(6% + clamp(280px, 30vw, 420px) * .5 - clamp(150px, 16vw, 225px)); bottom: 0; height: 132%; pointer-events: none; }
.cta-blue-cut img { height: 100%; width: auto; display: block; filter: drop-shadow(0 18px 30px rgba(4,12,40,.35)); }
@media (max-width: 860px) {
  .cta-blue-wrap { padding-top: clamp(48px, 10vw, 72px); }
  .cta-blue { min-height: 0; }
  .cta-blue-circle, .cta-blue-ring, .cta-blue-cut { display: none; }
  .cta-blue-text { max-width: none; padding: 40px 24px; text-align: center; margin: 0 auto; }
  .cta-blue-title { font-size: clamp(28px, 7.5vw, 36px); }
  .cta-blue-btn { padding: 16px 20px; font-size: 12.5px; letter-spacing: .1em; }
}

/* Mon impact : maquette Elon (panneau, cartes chiffres + témoignages, défilement auto sur une ligne) */
.impact { background: #fff; padding: clamp(56px, 7vw, 100px) 0; }
.impact-panel { padding: clamp(22px, 2.6vw, 34px); border-radius: 0; background: #fff; border: none; box-shadow: none; }
.impact-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 22px; }
.impact-title { margin: 0; font-family: var(--sans); font-weight: 800; font-size: clamp(30px, 3.2vw, 44px); letter-spacing: -.03em; color: #0d1f4d; line-height: 1.05; }
.impact-sub { margin: 4px 0 0; color: #3d4a66; font-size: 16px; }
.impact-nav { display: flex; gap: 12px; flex: none; }
.impact-arrow { width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid #0d1f4d; background: #fff; color: #0d1f4d; font-size: 20px; cursor: pointer; display: grid; place-items: center; transition: background .2s, color .2s; }
.impact-arrow--on { background: #1d4ed8; border-color: #1d4ed8; color: #fff; box-shadow: 0 8px 18px rgba(29,78,216,.35); }
.impact-arrow:hover { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }
.impact-track { display: flex; gap: 16px; margin: 0; padding: 4px 2px 10px; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; scroll-behavior: smooth; }
.impact-track::-webkit-scrollbar { display: none; }
.imp-card { position: relative; flex: none; width: 280px; height: 248px; scroll-snap-align: start; display: flex; flex-direction: column; padding: 22px 24px; border-radius: 20px; background: #f6f8fd; border: none; box-shadow: none; color: #0d1f4d; box-sizing: border-box; overflow: hidden; }
.imp-feat { background: linear-gradient(145deg, #0b1d4d 0%, #123a8c 60%, #1d4ed8 100%); border: 0; color: #fff; justify-content: center; }
.imp-ico { width: 46px; height: 32px; color: #fff; margin-bottom: 4px; }
.imp-ico svg { width: 100%; height: 100%; }
.imp-big { margin: 0; font-family: var(--sans); font-weight: 900; font-style: italic; font-size: 58px; line-height: 1; letter-spacing: -.05em; color: #fff; }
.imp-big--dark { color: #0d1f4d; }
.imp-flabel { margin: 10px 0 4px; font-size: 17px; font-weight: 700; line-height: 1.2; }
.imp-flabel--lg { font-size: 22px; margin-top: 2px; }
.imp-fsub { margin: 0; font-size: 13.5px; color: rgba(255,255,255,.82); }
.imp-social { display: flex; gap: 16px; margin: 16px 0 0; }
.imp-social svg { width: 30px; height: 30px; color: #fff; }
.imp-subs .imp-big { font-size: 54px; }
.imp-tag { display: block; padding-left: 10px; border-left: 3px solid #1d4ed8; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #1d4ed8; }
.imp-qmark { display: block; height: 30px; margin-top: 8px; font-family: Georgia, serif; font-size: 56px; line-height: 1; color: #c7d5ee; }
.imp-qtext { margin: 2px 0 0; font-size: 15.5px; font-weight: 700; line-height: 1.32; color: #0d1f4d; }
.imp-who { display: flex; align-items: center; gap: 12px; margin: auto 0 0; }
.imp-av { width: 34px; height: 34px; border-radius: 50%; background: #d7e2f5; flex: none; object-fit: cover; }
.imp-who strong { display: block; font-size: 14px; color: #0d1f4d; }
.imp-who em { display: block; font-style: normal; font-size: 12.5px; color: #6b7792; }
.imp-soft { background: linear-gradient(160deg, #f4f8ff, #dde9fb); align-items: center; text-align: center; justify-content: center; }
.imp-slabel { margin: 6px 0 12px; font-size: 19px; font-weight: 700; color: #0d1f4d; }
.imp-chips { display: flex; gap: 6px; margin: 0 0 12px; }
.imp-chips b { padding: 5px 8px; border-radius: 8px; background: #fff; color: #0d1f4d; font-size: 12.5px; font-weight: 800; box-shadow: 0 3px 8px rgba(21,37,79,.12); }
.imp-ssub { margin: 0; font-size: 12.5px; line-height: 1.45; color: #4a5672; }
.imp-world { width: 320px; align-items: flex-start; text-align: left; justify-content: flex-start; }
.imp-map { position: absolute; right: 8px; top: 34px; width: 62%; }
.imp-world .imp-big { margin-top: 14px; font-size: 64px; position: relative; }
.imp-slabel--left { margin: 2px 0 8px; font-size: 18px; line-height: 1.1; position: relative; }
.imp-ssub--left { position: relative; }
.impact-dots { display: flex; justify-content: center; gap: 8px; margin-top: 12px; }
.impact-dots i { width: 30px; height: 6px; border-radius: 6px; background: #d5dff0; transition: background .3s, width .3s; }
.impact-dots i.is-on { width: 34px; background: #1d4ed8; }
@media (max-width: 600px) {
  .impact-head { align-items: flex-start; }
  .impact-arrow { width: 40px; height: 40px; }
  .imp-card { width: 256px; height: 236px; }
  .imp-world { width: 290px; }
}

/* Accueil : vidéo « Elon en action » en lecture automatique */
.ig-action-video video { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Corpoready : constat — maquette Elon (bulle de citation + photo détourée) */
.corpo-constat .cc-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 5vw, 80px); }
.cc-left > p:first-of-type { font-size: clamp(19px, 1.6vw, 23px); line-height: 1.5; color: var(--ink); max-width: 30ch; }
.cc-visual { position: relative; margin-top: clamp(24px, 3vw, 40px); min-height: clamp(380px, 32vw, 450px); }
.cc-bubble { position: absolute; left: 0; bottom: 20px; z-index: 1; width: clamp(290px, 25vw, 350px); aspect-ratio: 1; margin: 0; padding: 0 clamp(34px, 3vw, 48px) 0 clamp(28px, 2.6vw, 40px); box-sizing: border-box; border-radius: 50%; background: #eaf0fb; display: flex; flex-direction: column; justify-content: center; text-align: center; }
.cc-bubble-mark { display: block; height: 52px; margin-top: -10px; font-family: Georgia, serif; font-size: 120px; line-height: .9; color: #bccbea; }
.cc-left .cc-bubble p { margin: 6px 0 14px; font-size: clamp(14px, 1.15vw, 16px); line-height: 1.45; font-weight: 600; color: var(--ink); }
.cc-bubble footer { font-size: 11.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); }
.cc-cut { position: absolute; z-index: 2; bottom: 0; left: calc(clamp(290px, 25vw, 350px) * .84); width: clamp(210px, 17vw, 250px); pointer-events: none; }
.cc-cut img { width: 100%; height: auto; display: block; }
.cc-right p { line-height: 1.7; }
.cc-right h3:not(:first-child) { margin-top: 30px; }
@media (max-width: 860px) {
  .corpo-constat .cc-grid { grid-template-columns: 1fr; }
  .cc-visual { min-height: 330px; }
  .cc-bubble { width: 232px; bottom: 16px; padding: 0 30px 0 22px; }
  .cc-bubble-mark { height: 36px; font-size: 80px; }
  .cc-left .cc-bubble p { font-size: 12.5px; line-height: 1.4; margin-bottom: 8px; }
  .cc-bubble footer { font-size: 10px; }
  .cc-cut { left: auto; right: -8px; width: 150px; }
}

/* BE Finance : texte du hero −20 %, plus de grand blanc sous la galerie */
.bef-hero3-text p { font-size: clamp(17.6px, 1.72vw, 25.6px); }
@media (max-width: 860px) { .bef-hero3-text p { font-size: 16px; } }
.kt.bef-team { aspect-ratio: auto; overflow: hidden; border-radius: 0; }

/* Speaker : photos −25 %, vidéo KPMG à gauche du formulaire */
.marquee-item { width: clamp(165px, 16.5vw, 240px); }
.bk-video { position: relative; margin: clamp(28px, 3vw, 40px) 0 0; max-width: 520px; border-radius: 18px; overflow: hidden; background: #0f1324; box-shadow: 0 24px 50px rgba(21,37,79,.16); }
.bk-video video { width: 100%; display: block; aspect-ratio: 16 / 9; object-fit: cover; }
.bk-video figcaption { position: absolute; left: 14px; bottom: 14px; padding: 7px 12px; border-radius: 999px; background: rgba(15,19,36,.62); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; font-size: 12px; font-weight: 500; }

/* Corpoready : CTA clair avec salle de classe (maquette Elon) */
.cta-light-wrap { padding: clamp(56px, 7vw, 100px) 0; background: #fff; }
.cta-light { position: relative; overflow: hidden; display: flex; align-items: center; min-height: clamp(220px, 20vw, 280px); border-radius: 22px; background: linear-gradient(100deg, #dfe9fb 0%, #eaf1fd 45%, #f4f7fd 100%); border: 1px solid #dce6f7; box-shadow: 0 22px 50px rgba(21,37,79,.10); }
.cta-light-media { position: absolute; inset: 0 0 0 30%; }
.cta-light-media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; display: block; -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 30%, #000 60%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 30%, #000 60%); opacity: .9; }
.cta-light::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(228,237,252,.95) 0%, rgba(228,237,252,.6) 38%, rgba(228,237,252,0) 70%); pointer-events: none; }
.cta-light-text { position: relative; z-index: 1; max-width: 560px; padding: clamp(32px, 4vw, 56px); }
.cta-light-title { margin: 0 0 clamp(22px, 2.4vw, 30px); font-family: var(--sans); font-weight: 700; font-size: clamp(26px, 2.8vw, 38px); line-height: 1.15; letter-spacing: -.025em; color: #0d1f4d; }
.cta-light-btn { display: inline-flex; align-items: center; gap: 14px; padding: 16px 26px; border-radius: 8px; background: #1d4ed8; color: #fff; font-size: 14px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; box-shadow: 0 10px 24px rgba(29,78,216,.3); transition: transform .3s var(--ease), background .3s; }
.cta-light-btn:hover { transform: translateY(-2px); background: #1a44bf; }
@media (max-width: 760px) {
  .cta-light { flex-direction: column; align-items: stretch; }
  .cta-light-media { position: relative; inset: auto; height: 170px; }
  .cta-light-media img { -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent 100%); mask-image: linear-gradient(180deg, #000 55%, transparent 100%); }
  .cta-light::after { display: none; }
  .cta-light-text { padding: 8px 24px 32px; text-align: center; }
  .cta-light-btn { font-size: 12.5px; padding: 15px 20px; }
}

/* Bouton son des vidéos en lecture automatique */
.ig-action-video, .bk-video { position: relative; }
.vsound { position: absolute; z-index: 3; right: 12px; bottom: 12px; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; display: grid; place-items: center; background: rgba(15,19,36,.62); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: #fff; cursor: pointer; transition: background .2s, transform .2s; }
.vsound:hover { background: #1d4ed8; transform: scale(1.06); }
.vsound:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.vsound svg { width: 20px; height: 20px; }
.vsound .vs-on, .vsound[aria-pressed="true"] .vs-off { display: none; }
.vsound[aria-pressed="true"] .vs-on { display: block; }
.ig-action-video .vsound, .bk-video .vsound { left: auto !important; top: auto !important; right: 14px !important; bottom: 14px !important; transform: none !important; margin: 0 !important; }
.ig-action-video .vsound { right: 30px !important; }

/* ==========================================================================
   Passe responsive — 2026-11-09
   ========================================================================== */
@media (max-width: 860px) {
  #en-action .action-grid { grid-template-columns: 1fr !important; gap: 40px !important; justify-items: center; }
  #en-action .action-txt { width: 100%; max-width: 560px; }
  #en-action .pz { grid-template-columns: minmax(0, 1fr) !important; max-width: 100%; }
  #en-action .pz-svg { max-width: min(100%, 380px); margin-inline: auto; }
  #en-action .pz-details { width: 100%; }
}
@media (max-width: 520px) {
  .activities .activities-grid { grid-template-columns: 1fr; gap: 14px; }
  .activities .act-card { min-height: 0; }
  .act-desc { font-size: 14.5px !important; line-height: 1.55; }
  .hero-kicker { font-size: 12px; }
  .bs-cta .btn { white-space: normal; max-width: 100%; text-align: center; justify-content: center; }
}
@media (max-width: 360px) {
  .btn, .cta-blue-btn, .cta-light-btn { white-space: normal; max-width: 100%; }
}

/* Mon impact : bande pleine largeur, bords en fondu, défilement continu (JS) */
.impact { overflow-x: clip; }
.impact-track { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); padding: 6px 0 12px; scroll-snap-type: none; scroll-behavior: auto; overscroll-behavior-x: contain;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%); }
.imp-card { scroll-snap-align: none; }
@media (max-width: 600px) {
  .impact-track { -webkit-mask-image: none; mask-image: none; }
}

/* Accueil mobile : « Qui est Elon » plus compact + bouton + ; activités = logos seuls en 2×2 */
.who-toggle { display: none; }
@media (max-width: 600px) {
  .who { padding: 48px 0 !important; }
  .who-collage { max-width: 300px !important; margin: 0 auto 8px !important; }
  .who-eyebrow { margin-bottom: 16px !important; font-size: 13px !important; }
  .who-text > p, .who-more > p, .who-quote p { font-size: 15px !important; line-height: 1.6 !important; }
  .who-text > p:first-of-type { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
  .who-text.is-open > p:first-of-type { -webkit-line-clamp: unset; display: block; }
  .who-more { display: none; }
  .who-text.is-open .who-more { display: block; }
  .who-quote { margin-top: 20px !important; padding-left: 18px !important; }
  .who-toggle { display: inline-flex; align-items: center; gap: 10px; margin: 14px 0 0; padding: 0; border: 0; background: none; color: #0d1f4d; font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
  .who-toggle-ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #1d4ed8; color: #fff; font-size: 20px; line-height: 1; }
  .who-links { margin-top: 18px !important; }

  .activities-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 12px !important; }
  .act-card { min-height: 0 !important; aspect-ratio: 1 / 1; padding: 16px !important; display: flex !important; align-items: center !important; justify-content: center !important; }
  .act-card .act-tag, .act-card .act-desc, .act-card .act-arrow { display: none !important; }
  .act-card .act-main { margin: 0 !important; width: 100%; display: flex !important; align-items: center; justify-content: center; }
  .act-card .act-logo { max-width: 82% !important; max-height: 70px !important; width: auto !important; height: auto !important; margin: 0 auto !important; }
}
@media (max-width: 600px) {
  .activities .act-card:hover .act-main, .activities .act-card:active .act-main, .activities .act-card:focus-visible .act-main,
  .activities .act-card:hover .act-logo, .activities .act-card:active .act-logo, .activities .act-card:focus-visible .act-logo { transform: none !important; }
}

/* Biographie mobile : blocs repliés, textes et photos plus compacts */
.bio-toggle { display: none; }
@media (max-width: 600px) {
  .about-bio p, .chapter-body > p { font-size: 15px !important; line-height: 1.6 !important; }
  .chapter-body > h2 { font-size: 22px !important; line-height: 1.2 !important; margin-bottom: 12px !important; }
  .years { font-size: clamp(48px, 14vw, 64px) !important; }
  .chapter { padding-top: 36px !important; padding-bottom: 36px !important; }
  .about-intro .about-portrait { max-width: 260px !important; margin: 20px auto 0 !important; justify-self: center !important; }
  .bio-fold:not(.is-open) > *:not(h2):not(.bio-lead):not(.bio-media):not(.bio-toggle) { display: none !important; }
  .bio-fold:not(.is-open) > .bio-lead { display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
  .bio-fold .bio-media { max-width: 300px; margin-left: auto !important; margin-right: auto !important; }
  .chapter-body figure.chapter-fig, .chapter-body .chapter-fig { max-width: 300px; margin-left: auto; margin-right: auto; }
  .chapter-duo .chapter-fig, .photo-grid .chapter-fig { max-width: none; }
  .bio-toggle { display: inline-flex; margin-top: 14px; }
}
/* Biographie : galerie 2×2 regroupée (mobile uniquement) */
.bio-gallery { display: none; }
@media (max-width: 600px) {
  .chapter-body > .bio-src { display: none !important; }
  .chapter-body > .bio-gallery { display: grid !important; margin: 20px 0 !important; max-width: none !important; }
  .bio-gallery .chapter-fig { max-width: none !important; }
  .bio-gallery .chapter-fig:nth-child(2) { transform: rotate(.8deg); }
  .bio-gallery .chapter-fig:nth-child(3) { transform: rotate(-.8deg); }
}
@media (max-width: 600px) { .about-intro .about-portrait { display: none !important; } }

/* Biographie mobile : photos plus vivantes (inclinaisons variées, entrée en cascade, léger zoom, réaction au toucher) */
@media (max-width: 600px) {
  .timeline .photo-grid { gap: 12px !important; }
  .timeline .photo-grid .chapter-fig { --r: 0deg; transform: rotate(var(--r)) !important; transition: transform .7s cubic-bezier(.2,.8,.2,1), opacity .6s ease; box-shadow: 0 10px 24px rgba(13,31,77,.12); border-radius: 14px; }
  .timeline .photo-grid .chapter-fig:nth-child(1) { --r: -1.4deg; --i: 0; }
  .timeline .photo-grid .chapter-fig:nth-child(2) { --r: 1.2deg; --i: 1; }
  .timeline .photo-grid .chapter-fig:nth-child(3) { --r: 1deg; --i: 2; }
  .timeline .photo-grid .chapter-fig:nth-child(4) { --r: -1.2deg; --i: 3; }
  .timeline .photo-grid .chapter-fig img { transition: transform 1.4s cubic-bezier(.2,.8,.2,1); }
  .timeline .photo-grid.bio-anim .chapter-fig { opacity: 0; transform: translateY(22px) scale(.92) rotate(0deg) !important; }
  .timeline .photo-grid.bio-anim .chapter-fig img { transform: scale(1.12); }
  .timeline .photo-grid.bio-anim.is-in .chapter-fig { opacity: 1; transform: rotate(var(--r)) !important; transition-delay: calc(var(--i, 0) * 110ms); }
  .timeline .photo-grid.bio-anim.is-in .chapter-fig img { transform: scale(1); transition-delay: calc(var(--i, 0) * 110ms); }
  .timeline .photo-grid .chapter-fig:active { transform: rotate(0deg) scale(.96) !important; transition-delay: 0s; }
}

/* Corpoready mobile : « Les chiffres derrière le constat » condensé */
@media (max-width: 600px) {
  .corpo-stats { padding-top: 48px !important; padding-bottom: 48px !important; }
  .corpo-stats .cs-head p { font-size: 15px !important; line-height: 1.55 !important; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
  .corpo-stats .cs-tabs { margin-top: 16px !important; margin-bottom: 18px !important; }
  .corpo-stats .cs-city-name { display: none !important; }
  .corpo-stats .cs-block { gap: 14px !important; margin-bottom: 28px !important; padding-bottom: 0 !important; }
  .corpo-stats .cs-block + .cs-block { padding-top: 24px !important; border-top: 1px solid #e3e9f6; }
  .corpo-stats .cs-block-text h3 { font-size: 20px !important; line-height: 1.25 !important; margin-bottom: 8px !important; }
  .corpo-stats .cs-block-text > p { font-size: 15px !important; line-height: 1.55 !important; margin: 0 0 10px !important; }
  .corpo-stats .cs-chart { display: none !important; }
  .corpo-stats .cs-city { max-height: 120px; overflow: hidden; border-radius: 12px; margin: 0 !important; }
  .corpo-stats .cs-city img { width: 100%; height: 120px; object-fit: cover; }
  .corpo-stats .cs-block-aside { gap: 12px !important; }
  .corpo-stats .cs-stats { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; margin: 0 !important; }
  .corpo-stats .cs-stats--2 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .corpo-stats .cs-stat { padding: 12px 8px !important; min-height: 0 !important; text-align: center; align-items: center !important; }
  .corpo-stats .cs-stat .cs-ico { display: none !important; }
  .corpo-stats .cs-stat strong { font-size: 22px !important; line-height: 1.1 !important; }
  .corpo-stats .cs-stat b { font-size: 11.5px !important; line-height: 1.25 !important; margin-top: 4px !important; }
  .corpo-stats .cs-stat small { display: none !important; }
  .corpo-stats .cs-source { font-size: 11px !important; line-height: 1.4 !important; margin: 0 !important; }
}
@media (max-width: 600px) {
  .corpo-stats .cs-reponse { padding: 22px 18px !important; margin-top: 8px !important; }
  .corpo-stats .cs-reponse h3 { font-size: 20px !important; line-height: 1.25 !important; margin-bottom: 8px !important; }
  .corpo-stats .cs-reponse > div:first-child > p { font-size: 15px !important; line-height: 1.55 !important; margin: 0 0 10px !important; }
  .corpo-stats .cs-reponse-list { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 10px !important; margin-top: 16px !important; padding: 0 !important; }
  .corpo-stats .cs-reponse-list li { padding: 12px !important; margin: 0 !important; min-height: 0 !important; border-radius: 12px; background: rgba(255,255,255,.7); }
  .corpo-stats .cs-reponse-list li small { display: none !important; }
  .corpo-stats .cs-reponse-list li b { font-size: 13px !important; line-height: 1.3 !important; }
}

/* Corpoready mobile : comme sur ordinateur, l'onglet défile dans un cadre de hauteur fixe */
@media (max-width: 860px) {
  .corpo-stats .cs-panel { height: 68vh; height: 68svh; min-height: 380px; max-height: 620px; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: auto;
    padding: 20px 16px !important; scrollbar-width: thin; scrollbar-color: #b9c8e6 transparent;
    -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(180deg, #000 calc(100% - 36px), transparent); }
  .corpo-stats .cs-panel.is-end { -webkit-mask-image: none; mask-image: none; }
  .corpo-stats .cs-panel[hidden] { display: none; }
  .corpo-stats .cs-scroll-hint { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 10px; font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
}

/* Corpoready « Notre approche » mobile/tablette : les 3 piliers défilent de gauche à droite, juste sous le texte */
.cp-dots { display: none; }
@media (max-width: 960px) {
  .cp-head { margin-bottom: 22px !important; }
  .cp-grid { display: flex !important; max-width: none !important; gap: 14px !important; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none;
    margin-inline: calc(-1 * var(--gutter)) !important; padding: 4px var(--gutter) 18px; scroll-padding-inline: var(--gutter); }
  .cp-grid::-webkit-scrollbar { display: none; }
  .cp-card { flex: 0 0 min(84%, 400px); scroll-snap-align: start; box-shadow: 0 16px 34px rgba(0,0,0,.25) !important; }
  .cp-card.reveal { opacity: 1 !important; transform: none !important; }
  .cp-body { padding: 18px 18px 20px !important; }
  .cp-body h3 { font-size: 21px !important; }
  .cp-body p { font-size: 14.5px !important; }
  .cp-body li { font-size: 13.5px !important; }
  .cp-dots { display: flex; justify-content: center; gap: 8px; margin-top: 4px; }
  .cp-dots i { width: 8px; height: 8px; border-radius: 8px; background: rgba(255,255,255,.3); transition: width .3s, background .3s; }
  .cp-dots i.is-on { width: 26px; background: #8fb0ff; }
}

/* Kin Consult « Nos formats » mobile : Conférence en haut, Atelier + Workshop côte à côte */
@media (max-width: 860px) {
  .kf-head { margin-bottom: 24px !important; }
  .kf-grid { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  .kf-card { padding: 18px 16px 18px !important; border-radius: 16px !important; }
  .kf-card:first-child { grid-column: 1 / -1; }
  .kf-card h3 { margin: 8px 0 6px !important; font-size: 20px !important; }
  .kf-card p { font-size: 14px !important; line-height: 1.5 !important; }
  .kf-card ul { margin-top: 12px !important; padding-top: 10px !important; gap: 4px !important; font-size: 12.5px !important; }
  .kf-card:not(:first-child) p { font-size: 13px !important; }
}
@media (max-width: 380px) {
  .kf-card:not(:first-child) { padding: 16px 12px !important; }
  .kf-card:not(:first-child) h3 { font-size: 18px !important; }
}

/* Be Finance mobile : « Vous êtes une entreprise / un particulier » côte à côte */
@media (max-width: 860px) {
  .bs-choice { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  .bs-choice button { grid-template-columns: 1fr !important; justify-items: center; text-align: center !important; gap: 10px !important; padding: 16px 10px !important; }
  .bs-choice .bs-big { width: 38px !important; height: 38px !important; }
  .bs-choice b { font-size: 15px !important; line-height: 1.25 !important; }
  .bs-choice small { font-size: 12.5px !important; line-height: 1.4 !important; margin-top: 6px !important; }
  .bs-choice em { display: none !important; }
}

/* Activités (ordinateur) : logo parfaitement centré au repos, remonte au survol comme avant */
@media (hover: hover) and (min-width: 601px) {
  .activities .act-main { top: 50% !important; transition: transform .5s var(--ease), top .5s var(--ease) !important; }
  .activities .act-card:hover .act-main, .activities .act-card:focus-visible .act-main { top: 47% !important; }
}

/* Kin Consult mobile : texte des fondateurs replié (+) */
.kin-toggle { display: none !important; }
@media (max-width: 600px) {
  .kin-fold:not(.is-open) > p:not(.kin-lead) { display: none !important; }
  .kin-fold:not(.is-open) > .kin-lead { display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
  .kin-fold .kin-lead { margin-top: 18px !important; }
  .kin-toggle { display: inline-flex !important; margin-top: 14px; }
}

/* Speaker : bouton son de la vidéo dans le téléphone (en bas à droite, au-dessus de la légende) */
.phone18-screen .vsound { left: auto !important; top: auto !important; right: 14px !important; bottom: 46px !important; transform: none !important; margin: 0 !important; width: 40px !important; height: 40px !important; padding: 0 !important; }

/* Accueil mobile : citation « Je crois au potentiel… » masquée */
@media (max-width: 600px) { .es-band .es-quote { display: none !important; } }

/* Footer : titres de colonnes un peu plus gras */
.footer-grid h4 { font-weight: 800 !important; }

/* Formulaires : champ anti-spam invisible + message d'erreur d'envoi */
.hp-field { display: none !important; }
.form-error { grid-column: 1 / -1; margin: 0; padding: 12px 14px; border-radius: 10px; background: #fdecec; color: #8a1c1c; font-size: 14px; }
.form-error a { color: inherit; text-decoration: underline; }