/* =============================================================
   Cabinet Devorsine · Site internet · styles.css
   Forké de la charte graphique v1.0
   ============================================================= */

/* ---------- Fontes ---------- */
/* Plus Jakarta Sans, Inter, JetBrains Mono loaded via Google Fonts CDN */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600;700&display=swap');

:root {
  /* Palette */
  --cd-marine:        #0B1C4D;
  --cd-bleu-nuit:     #112970;
  --cd-bleu-roi:      #16379A;
  --cd-bleu-vif:      #1A4BC4;
  --cd-bleu-ciel:     #86C1F5;
  --cd-corail:        #E8624A;
  --cd-corail-hover:  #d4553e;
  --cd-corail-fond:   #FEF1ED;
  --cd-anthracite:    #2D3748;
  --cd-gris-moyen:    #718096;
  --cd-gris-clair:    #E2E8F0;
  --cd-blanc-casse:   #F7FAFC;
  --cd-blanc:         #FFFFFF;

  /* Typo */
  --cd-font-serif:    "Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
  --cd-font-sans:     "Inter", Calibri, Arial, -apple-system, BlinkMacSystemFont, sans-serif;
  --cd-font-mono:     "JetBrains Mono", "IBM Plex Mono", ui-monospace, Menlo, monospace;

  /* Espacement */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;
  --space-5xl: 128px;

  /* Layout */
  --container: 1280px;
  --gutter: 32px;
}

/* ---------- Reset léger ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
button { font: inherit; cursor: pointer; }

body {
  font-family: var(--cd-font-sans);
  font-size: 16px;
  line-height: 1.55;
  color: var(--cd-anthracite);
  background: var(--cd-blanc);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern" 1, "liga" 1;
}

/* ---------- Container ---------- */
.wrap {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.wrap-narrow {
  max-width: 920px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}

/* ---------- Typographie ---------- */
.eyebrow {
  font-family: var(--cd-font-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cd-corail);
  line-height: 1.3;
}
.eyebrow--marine { color: var(--cd-bleu-ciel); }
.eyebrow--gris { color: var(--cd-gris-moyen); }

h1, h2, h3, h4 {
  font-family: var(--cd-font-serif);
  color: var(--cd-marine);
  margin: 0;
  font-weight: 600;
  letter-spacing: -0.025em;
  line-height: 1.05;
  text-wrap: balance;
}
h1 { font-size: clamp(40px, 5.6vw, 72px); line-height: 1.02; letter-spacing: -0.035em; font-weight: 700; }
h2 { font-size: clamp(32px, 3.6vw, 48px); line-height: 1.08; letter-spacing: -0.028em; font-weight: 600; }
h3 { font-size: clamp(22px, 2vw, 28px); line-height: 1.2; letter-spacing: -0.018em; font-weight: 600; }
h4 { font-size: 18px; line-height: 1.28; letter-spacing: -0.01em; font-weight: 600; }

p { margin: 0; }
.lead {
  font-size: 19px;
  line-height: 1.55;
  color: var(--cd-anthracite);
}
.muted { color: var(--cd-gris-moyen); }

.num {
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
}

/* ---------- Filet corail ---------- */
.filet {
  display: block;
  width: 40px;
  height: 2px;
  background: var(--cd-corail);
  border: 0;
  margin: 0 0 var(--space-lg) 0;
}
.filet--wide { width: 96px; height: 4px; }

/* ---------- Boutons ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: var(--cd-corail);
  color: var(--cd-blanc);
  font-family: var(--cd-font-sans);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 14px 26px;
  border: 0;
  border-radius: 6px;
  cursor: pointer;
  transition: background 120ms ease, color 120ms ease, border-color 120ms ease, transform 120ms ease;
  text-decoration: none;
}
.site-header .btn {
  font-size: 13px;
  padding: 10px 18px;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.site-header .header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.btn:hover  { background: #d6553e; }
.btn:active { background: #c14d39; }

.btn--ghost {
  background: transparent;
  color: var(--cd-marine);
  border: 1px solid var(--cd-marine);
}
.btn--ghost:hover { background: var(--cd-marine); color: var(--cd-blanc); }

.btn--ghost-light {
  background: transparent;
  color: var(--cd-blanc);
  border: 1px solid rgba(255,255,255,0.45);
}
.btn--ghost-light:hover {
  background: rgba(255,255,255,0.1);
  border-color: var(--cd-blanc);
  color: var(--cd-blanc);
}

.btn--link {
  background: transparent;
  color: var(--cd-marine);
  padding: 0;
  font-size: 13px;
  border-bottom: 1px solid var(--cd-marine);
  border-radius: 0;
  padding-bottom: 2px;
}
.btn--link:hover { background: transparent; color: var(--cd-corail); border-bottom-color: var(--cd-corail); }

/* ---------- Sections ---------- */
section { padding: var(--space-4xl) 0; }
section.tight { padding: var(--space-3xl) 0; }
section.bg-cream { background: var(--cd-blanc-casse); }
section.bg-marine { background: var(--cd-marine); color: var(--cd-blanc); }
section.bg-marine h1,
section.bg-marine h2,
section.bg-marine h3,
section.bg-marine h4 { color: var(--cd-blanc); }
section.bg-corail { background: var(--cd-corail); color: var(--cd-blanc); }
section.bg-corail h1,
section.bg-corail h2,
section.bg-corail h3 { color: var(--cd-blanc); }

/* ---------- Header ---------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--cd-blanc);
  border-bottom: 1px solid rgba(11,28,77,0.06);
  transition: box-shadow 200ms ease, background 200ms ease, border-color 200ms ease;
}
.site-header.scrolled {
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: saturate(120%) blur(8px);
  -webkit-backdrop-filter: saturate(120%) blur(8px);
  border-bottom-color: rgba(11,28,77,0.08);
  box-shadow: 0 1px 0 rgba(11,28,77,0.04), 0 8px 24px -16px rgba(11,28,77,0.16);
}
.site-header .wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 16px;
  padding-bottom: 16px;
  gap: var(--space-lg);
  max-width: 1440px;
}
.site-header .brand {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  text-decoration: none;
  flex-shrink: 0;
}
.site-header .brand img { height: 36px; width: auto; }
.site-header nav {
  display: flex;
  align-items: center;
  gap: 28px;
  flex: 0 1 auto;
  justify-content: center;
  flex-wrap: nowrap;
  min-width: 0;
}
.site-header nav a {
  font-family: var(--cd-font-sans);
  font-size: 13.5px;
  font-weight: 500;
  color: var(--cd-anthracite);
  text-decoration: none;
  position: relative;
  padding: 6px 0;
  letter-spacing: 0.005em;
  transition: color 140ms ease;
  white-space: nowrap;
}
.site-header nav a::after {
  content: "";
  position: absolute;
  left: 50%;
  right: 50%;
  bottom: -2px;
  height: 1.5px;
  background: var(--cd-corail);
  transition: left 180ms ease, right 180ms ease;
}
.site-header nav a:hover { color: var(--cd-marine); }
.site-header nav a:hover::after,
.site-header nav a.is-active::after { left: 0; right: 0; }
.site-header nav a.is-active { color: var(--cd-marine); }

.site-header .hamburger {
  display: none;
  background: transparent;
  border: 1px solid var(--cd-marine);
  color: var(--cd-marine);
  width: 40px; height: 40px;
  border-radius: 6px;
  align-items: center;
  justify-content: center;
}

/* ---------- Espace client (dropdown CTA) ---------- */
.site-header .header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.account-menu { position: relative; flex-shrink: 0; }
.account-menu .account-trigger {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  color: var(--cd-marine);
  border: 1px solid rgba(11,28,77,0.2);
  font-family: var(--cd-font-sans);
  font-size: 13px;
  font-weight: 500;
  padding: 9px 14px;
  border-radius: 6px;
  cursor: pointer;
  transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
  text-decoration: none;
  letter-spacing: 0.005em;
  white-space: nowrap;
}
.account-menu .account-trigger svg { color: currentColor; transition: transform 160ms ease; }
.account-menu:hover .account-trigger,
.account-menu:focus-within .account-trigger {
  background: var(--cd-marine);
  color: var(--cd-blanc);
}
.account-menu:hover .account-trigger svg,
.account-menu:focus-within .account-trigger svg { transform: rotate(180deg); }

.account-sub {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 300px;
  background: var(--cd-blanc);
  border: 1px solid var(--cd-gris-clair);
  border-radius: 6px;
  box-shadow: 0 16px 40px -16px rgba(11,28,77,0.28);
  padding: 8px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity 140ms ease, transform 140ms ease;
  z-index: 60;
}
.account-menu:hover .account-sub,
.account-menu:focus-within .account-sub {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.account-sub::before {
  content: "";
  position: absolute;
  top: -8px;
  right: 32px;
  width: 12px; height: 12px;
  background: var(--cd-blanc);
  border-top: 1px solid var(--cd-gris-clair);
  border-left: 1px solid var(--cd-gris-clair);
  transform: rotate(45deg);
}
.account-sub a {
  display: block;
  padding: 14px 16px;
  text-decoration: none;
  color: var(--cd-marine);
  border-radius: 4px;
  transition: background 120ms ease;
}
.account-sub a:hover { background: var(--cd-blanc-casse); }
.account-sub a .sub-label {
  display: block;
  font-family: var(--cd-font-mono);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cd-corail);
  margin-bottom: 6px;
  font-weight: 500;
}
.account-sub a .sub-title {
  font-family: var(--cd-font-serif);
  font-size: 16px;
  font-weight: 500;
  color: var(--cd-marine);
  display: flex;
  align-items: center;
  gap: 10px;
}
.account-sub a .sub-title::after {
  content: "→";
  margin-left: auto;
  color: var(--cd-gris-moyen);
  font-family: var(--cd-font-serif);
  transition: transform 160ms ease, color 160ms ease;
}
.account-sub a:hover .sub-title::after {
  color: var(--cd-corail);
  transform: translateX(4px);
}
.account-sub .sub-divider {
  height: 1px;
  background: var(--cd-gris-clair);
  margin: 4px 8px;
}

/* Submenu "Pôles d'expertise" */
.has-sub { position: relative; }
.has-sub::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 18px;
}
.has-sub > .sub {
  position: absolute;
  top: calc(100% + 14px);
  left: -12px;
  background: var(--cd-blanc);
  border: 1px solid var(--cd-gris-clair);
  border-radius: 8px;
  box-shadow: 0 16px 40px -16px rgba(11,28,77,0.18);
  padding: 6px 0;
  min-width: 260px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity 180ms ease, transform 180ms ease;
}
.has-sub:hover > .sub,
.has-sub:focus-within > .sub,
.has-sub.open > .sub { opacity: 1; pointer-events: auto; transform: translateY(0); }
.sub a {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 28px;
  font-family: var(--cd-font-serif);
  font-size: 15px;
  font-weight: 500;
  color: var(--cd-marine);
  text-decoration: none;
  transition: background 120ms ease, color 120ms ease, padding-left 180ms ease;
}
.sub a::before {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--cd-corail);
  opacity: 0;
  transform: scale(0.6);
  transition: opacity 180ms ease, transform 180ms ease;
}
.sub a::after { display: none; }
.sub a:hover {
  background: var(--cd-blanc-casse);
  color: var(--cd-corail);
  padding-left: 36px;
}
.sub a:hover::before {
  opacity: 1;
  transform: scale(1);
}

/* ---------- Footer ---------- */
.site-footer {
  background: var(--cd-marine);
  color: var(--cd-blanc);
  padding: var(--space-4xl) 0 var(--space-xl);
}
.site-footer .wrap { padding-bottom: 0; }
.site-footer .footer-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: var(--space-3xl);
  padding-bottom: var(--space-3xl);
  border-bottom: 1px solid rgba(255,255,255,0.14);
}
.site-footer img.logo-foot { height: 44px; width: auto; margin-bottom: var(--space-lg); }
.site-footer .signature {
  font-family: var(--cd-font-serif);
  font-style: italic;
  color: var(--cd-bleu-ciel);
  font-size: 17px;
  margin-bottom: var(--space-lg);
}
.site-footer .foot-title {
  font-family: var(--cd-font-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-bottom: var(--space-md);
}
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li { margin-bottom: 10px; }
.site-footer li a, .site-footer p {
  font-size: 14px;
  color: rgba(255,255,255,0.78);
  text-decoration: none;
  line-height: 1.55;
  transition: color 120ms ease;
}
.site-footer li a:hover { color: var(--cd-corail); }
.site-footer .mentions {
  padding-top: var(--space-xl);
  font-size: 12px;
  color: rgba(255,255,255,0.55);
  line-height: 1.65;
}
.site-footer .mentions p + p { margin-top: 6px; }

.site-footer .groupe-entities {
  padding-top: 20px;
  margin-top: 4px;
}
.site-footer .groupe-title {
  font-size: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-weight: 600;
  color: rgba(255,255,255,0.4);
  margin-bottom: 10px;
}
.site-footer .groupe-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  font-size: 12px;
  color: rgba(255,255,255,0.55);
}
.site-footer .groupe-list span::before {
  content: "· ";
  color: var(--cd-corail);
  opacity: 0.6;
}
.site-footer .groupe-list span:first-child::before {
  content: "";
}

/* ---------- Hero ---------- */
.hero-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.cdtp{background:#0B1C4D;display:grid;grid-template-columns:1fr 1fr;align-items:stretch;font-family:'Inter',Arial,sans-serif}
.cdtp-left{position:relative;min-height:640px;display:flex;align-items:center;justify-content:center}
.cdtp-left svg{width:100%;height:100%;max-height:860px;display:block}
.cdtp-right{display:flex;flex-direction:column;justify-content:center;padding:96px 15% 96px 40px;box-sizing:border-box}
.cdtp-filet{display:block;width:88px;height:4px;background:#E8624A}
.cdtp-eyebrow-txt{font-size:13px;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:#86C1F5;margin-top:28px}
.cdtp-h2{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-weight:700;font-size:44px;line-height:1.18;letter-spacing:-0.01em;color:#FFFFFF;margin:22px 0 0}
.cdtp-right p{font-size:16px;line-height:1.65;color:rgba(255,255,255,0.75);margin:22px 0 0}
.cdtp-right p.cdtp-lead{font-size:17px;line-height:1.6;color:rgba(255,255,255,0.85);margin-top:28px}
.cdtp-right p.cdtp-lead strong{color:#FFFFFF}
.cdtp-btn{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600;color:#FFFFFF;background:#E8624A;padding:15px 26px;border-radius:6px;text-decoration:none;margin-top:40px;align-self:flex-start;transition:background 150ms ease}
.cdtp-btn:hover{background:#d6553e}
.cdtp svg .sv-eyebrow{font-family:'Inter',Arial,sans-serif;font-size:13px;font-weight:600;letter-spacing:0.18em;fill:#86C1F5}
.cdtp svg .sv-title{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-size:44px;font-weight:600;letter-spacing:-0.015em;fill:#FFFFFF}
.cdtp svg .sv-val{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-size:27px;font-weight:500;fill:#FFFFFF;font-variant-numeric:lining-nums tabular-nums}
.cdtp svg .sv-name{font-family:'Inter',Arial,sans-serif;font-size:11.5px;font-weight:500;letter-spacing:0.08em;fill:#86C1F5}
.cdtp svg .sv-center{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-size:56px;font-weight:600;fill:#FFFFFF;font-variant-numeric:lining-nums tabular-nums}
.cdtp svg .sv-caption{font-family:'Inter',Arial,sans-serif;font-size:15px;fill:#86C1F5}
.cdtp svg .sv-legend{font-family:'Inter',Arial,sans-serif;font-size:13.5px;fill:rgba(255,255,255,0.85)}
.cdtp svg .sv-mention{font-family:'Inter',Arial,sans-serif;font-size:12.5px;fill:rgba(255,255,255,0.55)}
@media (max-width:900px){
  .cdtp{grid-template-columns:1fr}
  .cdtp-left{min-height:0}
  .cdtp-left svg{max-height:none;aspect-ratio:960/1080}
  .cdtp-right{padding:56px 24px 72px}
  .cdtp-h2{font-size:32px}
}
@media (prefers-reduced-motion:reduce){}
/* De courtier à Risk Manager */
.cdrm{background:#FFFFFF;display:grid;grid-template-columns:1fr 1fr;align-items:center;font-family:'Inter',Arial,sans-serif}
.cdrm-left{position:relative;overflow:hidden}
.cdrm-stage{position:relative;width:860px;height:700px;transform-origin:top left}
.cdrm-right{display:flex;flex-direction:column;justify-content:center;padding:96px 12% 96px 72px;box-sizing:border-box}
.cdrm-filet{display:block;width:88px;height:4px;background:#E8624A}
.cdrm-eyebrow{font-size:13px;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:#718096;margin-top:28px}
.cdrm-h2{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-weight:700;font-size:clamp(36px,3.4vw,52px);line-height:1.12;letter-spacing:-0.02em;color:#0B1C4D;margin:22px 0 0}
.cdrm-right p{font-size:16px;line-height:1.65;color:#2D3748;margin:22px 0 0;max-width:52ch}
.cdrm-right p.cdrm-lead{font-size:17px;line-height:1.6;margin-top:28px}
.cdrm-btn{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600;color:#FFFFFF;background:#0B1C4D;padding:15px 26px;border-radius:6px;text-decoration:none;margin-top:40px;align-self:flex-start;transition:background 150ms ease}
.cdrm-btn:hover{background:#112970}
.cdrm-num{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;color:#718096}
.cdrm-step{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-weight:600;font-size:21px;color:#0B1C4D;margin-top:3px}
.cdrm-badge{display:inline-block;background:#E8624A;color:#FFFFFF;font-family:'Plus Jakarta Sans',Arial,sans-serif;font-weight:600;font-size:10px;letter-spacing:0.08em;text-transform:uppercase;padding:4px 9px;margin-top:8px}
.cdrm-center{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-weight:600;font-size:23px;line-height:1.3;color:#0B1C4D;text-align:center}
/* Notre approche (pôle pages) */
.cdap-filet{display:block;width:60px;height:4px;background:#E8624A}
.cdap-eyebrow{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:#718096;margin-top:14px}
.cdap-h2{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-weight:700;font-size:32px;line-height:1.12;letter-spacing:-0.02em;color:#0B1C4D;margin:10px 0 0}
.cdap-row-label{transition:opacity 500ms ease,transform 500ms ease}
.cdap-row-label .rl-tag{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:700;letter-spacing:0.2em;text-transform:uppercase}
.cdap-row-label .rl-sub{font-size:11px;font-style:italic;color:#718096;line-height:1.45;margin-top:6px}
.cdap-step{transition:opacity 450ms ease,transform 450ms ease}
/* Notre organisation (trio dédié) */
.cdeq{background:#fff;display:grid;grid-template-columns:460px 1fr;align-items:center;font-family:'Inter',Arial,sans-serif;max-width:1120px;margin:0 auto;padding:var(--space-4xl) var(--space-xl)}
.cdeq-left{display:flex;flex-direction:column;justify-content:center;padding:0 48px 0 0;box-sizing:border-box}
.cdeq-filet{display:block;width:60px;height:4px;background:#E8624A}
.cdeq-eyebrow{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:#718096;margin-top:18px}
.cdeq-h2{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-weight:700;font-size:clamp(28px,3vw,38px);line-height:1.12;letter-spacing:-0.02em;color:#0B1C4D;margin:14px 0 0}
.cdeq-left p{font-size:15px;line-height:1.6;color:var(--cd-anthracite);margin-top:18px;max-width:48ch}
.cdeq-stage{position:relative;min-height:540px}
.cdeq-card{position:absolute;left:320px;width:400px;height:148px;background:#fff;border:1px solid #E2E8F0;border-radius:6px;padding:20px 24px;box-sizing:border-box;transition:border-color 300ms ease,box-shadow 300ms ease,transform 300ms ease}
.cdeq-card.is-active{border-color:var(--cd-corail);box-shadow:0 6px 24px rgba(11,28,77,0.10);transform:translateY(-3px)}
.cdeq-card.is-active .r-eyebrow{color:var(--cd-corail)}
.cdeq-card .r-eyebrow{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:#718096}
.cdeq-card .r-name{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-weight:600;font-size:20px;color:#0B1C4D;margin-top:5px}
.cdeq-card .r-desc{font-size:12px;line-height:1.5;color:#718096;margin-top:6px}
.cdeq-card .r-reply{position:absolute;left:24px;bottom:14px;display:inline-flex;align-items:center;gap:7px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:600;letter-spacing:0.06em;color:#E8624A;opacity:0;transform:translateY(6px);transition:opacity 350ms ease,transform 350ms ease}
.cdeq-card .r-reply::before{content:'';width:6px;height:6px;border-radius:3px;background:#E8624A}
.cdeq-card.is-active .r-reply{opacity:1;transform:translateY(0)}
.cdeq-vous{position:absolute;left:20px;top:222px;width:120px;height:96px;background:#0B1C4D;border-radius:6px;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.cdeq-vous .v-tag{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9px;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;color:#86C1F5}
.cdeq-vous .v-name{font-family:'Plus Jakarta Sans',Arial,sans-serif;font-weight:600;font-size:19px}
.cdeq-chip{position:absolute;opacity:0;white-space:nowrap;background:#0B1C4D;color:#fff;font-size:12px;font-weight:500;padding:8px 14px;border-radius:16px 16px 16px 3px;box-shadow:0 4px 16px rgba(11,28,77,0.22);transform:translate(-8px,-50%);font-family:'Inter',Arial,sans-serif;pointer-events:none}
.cdeq-pilot{position:absolute;opacity:0;white-space:nowrap;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;font-weight:600;letter-spacing:0.16em;text-transform:uppercase;color:#E8624A;background:#fff;padding:2px 8px;transition:opacity 400ms ease}
@media (max-width:900px){.cdeq{grid-template-columns:1fr}.cdeq-left{padding:56px 24px 0}.cdeq-stage{min-height:420px;transform:scale(0.7);transform-origin:top center}
  .cdrm{grid-template-columns:1fr}
  .cdrm-right{padding:24px 24px 64px}
}
.hero {
  background-color: var(--cd-marine);
  background-image:
    linear-gradient(95deg, rgba(11,28,77,0.78) 0%, rgba(11,28,77,0.55) 35%, rgba(11,28,77,0.25) 65%, rgba(11,28,77,0.1) 100%),
    url("assets/images/hero-belem.webp");
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
  color: var(--cd-blanc);
  position: relative;
  overflow: hidden;
  min-height: calc(100vh - 88px);
  padding: 80px 0 80px;
  display: flex;
  align-items: center;
}
.hero .wrap {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: var(--space-3xl);
  align-items: center;
  width: 100%;
  position: relative;
  z-index: 1;
}
.hero--single .wrap {
  display: block;
}
.hero--single .hero-content {
  max-width: 920px;
}

/* 3 blocs CTA hero (Devis / Nous contacter / Recrutement) */
.hero-ctas {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.2);
  margin-top: var(--space-2xl);
  max-width: 720px;
}
.hero-cta {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 22px 22px 20px;
  background: rgba(11, 28, 77, 0.55);
  text-decoration: none;
  color: var(--cd-blanc);
  position: relative;
  transition: background 180ms ease;
  min-height: 130px;
}
.hero-cta:hover {
  background: rgba(11, 28, 77, 0.9);
}
.hero-cta-kicker {
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
}
.hero-cta-label {
  font-family: var(--cd-font-serif);
  font-size: 22px;
  font-weight: 600;
  color: var(--cd-blanc);
  letter-spacing: -0.015em;
  margin-top: 4px;
}
.hero-cta-arrow {
  position: absolute;
  right: 22px;
  bottom: 18px;
  font-family: var(--cd-font-serif);
  font-size: 22px;
  color: rgba(255, 255, 255, 0.55);
  transition: transform 180ms ease, color 180ms ease;
}
.hero-cta:hover .hero-cta-arrow {
  transform: translateX(4px);
  color: var(--cd-corail);
}
.hero-stats-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1.4fr;
  gap: 1px;
  background: rgba(255,255,255,0.18);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 6px;
  overflow: hidden;
  margin-top: var(--space-3xl);
  max-width: 940px;
}
.hero-stats-row .stat-cell {
  background: var(--cd-marine);
  padding: var(--space-lg) var(--space-md);
}
.hero-stats-row .val {
  font-family: var(--cd-font-serif);
  font-size: 32px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.025em;
  color: var(--cd-blanc);
}
.hero-stats-row .lab {
  font-family: var(--cd-font-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-top: 10px;
}
.hero-stats-row .score-line {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.hero-stats-row .score {
  font-family: var(--cd-font-serif);
  font-size: 32px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--cd-corail);
}
.hero-stats-row .out {
  font-family: var(--cd-font-sans);
  font-size: 14px;
  color: var(--cd-bleu-ciel);
  font-weight: 400;
}
.hero-stats-row .stars {
  display: inline-flex;
  gap: 1px;
  color: var(--cd-corail);
  font-size: 14px;
  letter-spacing: 0;
}
.hero-stats-row .stars .half {
  background: linear-gradient(90deg, var(--cd-corail) 50%, rgba(232,98,74,0.25) 50%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero h1 { color: var(--cd-blanc); max-width: 14ch; }
.hero .lead { color: rgba(255,255,255,0.78); max-width: 56ch; margin-top: var(--space-xl); }
.hero .cta-row { display: flex; gap: var(--space-md); margin-top: var(--space-2xl); flex-wrap: wrap; }

.hero .stats {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: rgba(255,255,255,0.15);
  border: 1px solid rgba(255,255,255,0.15);
}
.hero .stats.cols-2 { grid-template-columns: 1fr 1fr; }
.hero .stat .stars {
  display: flex;
  gap: 2px;
  margin-top: 12px;
  color: var(--cd-corail);
  font-size: 18px;
  letter-spacing: 4px;
  line-height: 1;
}
.hero .stat .stars .half {
  position: relative;
  display: inline-block;
  color: rgba(255,255,255,0.18);
}
.hero .stat .stars .half::before {
  content: "★";
  position: absolute;
  left: 0; top: 0;
  width: 90%;
  overflow: hidden;
  color: var(--cd-corail);
}
.hero .stat-google {
  display: block;
  padding: var(--space-xl) var(--space-lg);
  position: relative;
  cursor: pointer;
  transition: background 0.25s ease;
}
.hero .stat-google:hover {
  background: rgba(255,255,255,0.06);
}
.stat-overlay-link {
  position: absolute;
  inset: 0;
  z-index: 2;
  text-decoration: none;
}
.hero .stat-google .meta { display: flex; flex-direction: column; gap: 6px; }
.hero .stat-google .meta .score-line {
  display: flex; align-items: baseline; gap: 12px;
  font-family: var(--cd-font-serif);
}
.hero .stat-google .meta .score {
  font-size: 36px;
  color: var(--cd-blanc);
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1;
}
.hero .stat-google .meta .out {
  font-size: 16px;
  color: var(--cd-bleu-ciel);
  font-style: italic;
}
.hero .stat-google .meta .src {
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-top: 4px;
}
.hero .stat {
  background: var(--cd-marine);
  padding: var(--space-xl) var(--space-lg);
}
.hero .stat .val {
  font-family: var(--cd-font-serif);
  font-size: 56px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--cd-blanc);
}
.hero .stat .val.accent { color: var(--cd-corail); }
.hero .stat .lab {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-top: 12px;
}

/* Décor sub-hero rule */
.hero::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: rgba(255,255,255,0.08);
}

/* ---------- Section: Pôles ---------- */
.section-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3xl);
  align-items: end;
  margin-bottom: var(--space-3xl);
}
.section-header .right { padding-bottom: 6px; }

.poles-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1.5px solid var(--cd-marine);
}
.poles-grid .pole:nth-child(3n) { border-right: 0; }
.poles-grid .pole:nth-child(n+4) { border-top: 1px solid var(--cd-gris-clair); }
.pole {
  padding: var(--space-2xl) var(--space-2xl) var(--space-xl);
  border-right: 1px solid var(--cd-gris-clair);
  background: var(--cd-blanc);
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: background 160ms ease, transform 160ms ease;
}
.pole:last-child { border-right: 0; }
.pole:hover { background: var(--cd-blanc); }
.pole:hover .pole-arrow { transform: translateX(6px); color: var(--cd-corail); }
/* Num-order retiré — le h3 devient le premier élément */
.pole h3 {
  font-size: 26px;
  margin-bottom: 6px;
}
.pole .target {
  font-style: italic;
  color: var(--cd-gris-moyen);
  font-size: 14px;
  margin-bottom: var(--space-md);
  line-height: 1.45;
}
.pole .msg {
  font-size: 15px;
  color: var(--cd-anthracite);
  line-height: 1.55;
}
.pole-arrow {
  margin-top: var(--space-sm);
  font-family: var(--cd-font-serif);
  font-size: 28px;
  color: var(--cd-marine);
  transition: transform 160ms ease, color 160ms ease;
}

/* Mobile : flèche discrète */
@media (max-width: 720px) {
  .pole-arrow {
    font-size: 20px;
    margin-top: var(--space-md);
  }
}

/* ---------- Preuve sociale (3 colonnes marine) ---------- */
.proof-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}
.proof-cell {
  padding: var(--space-xl) var(--space-2xl);
  border-right: 1px solid rgba(255,255,255,0.16);
}
.proof-cell:last-child { border-right: 0; }
.proof-cell .filet { background: var(--cd-corail); margin-bottom: var(--space-md); }
.proof-cell .big {
  font-family: var(--cd-font-serif);
  font-size: 36px;
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--cd-blanc);
  margin-bottom: 8px;
}
.proof-cell .desc {
  font-size: 14px;
  color: rgba(255,255,255,0.72);
}

/* ---------- Proxibilité ---------- */
.proxi {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3xl);
  align-items: center;
}
.proxi .word {
  font-family: var(--cd-font-serif);
  font-style: italic;
  font-size: clamp(64px, 9vw, 128px);
  line-height: 0.95;
  color: var(--cd-marine);
  letter-spacing: -0.04em;
}
.proxi .word .dot { color: var(--cd-corail); }
.proxi .def { font-size: 18px; line-height: 1.6; color: var(--cd-anthracite); max-width: 46ch; }

/* ---------- CTA corail ---------- */
.cta-corail {
  background: var(--cd-corail);
  color: var(--cd-blanc);
  padding: var(--space-4xl) 0;
  text-align: center;
}
.cta-corail h2 { color: var(--cd-blanc); margin-bottom: var(--space-md); }
.cta-corail p { font-size: 19px; color: rgba(255,255,255,0.92); margin-bottom: var(--space-xl); }
.cta-corail .btn--ghost-light { border-color: var(--cd-blanc); }

/* ---------- Encarts (mise en avant) ---------- */
.encart {
  background: var(--cd-blanc);
  border-left: 4px solid var(--cd-bleu-roi);
  padding: var(--space-xl) var(--space-2xl);
  font-family: var(--cd-font-serif);
  font-style: italic;
  font-size: 22px;
  line-height: 1.4;
  color: var(--cd-marine);
  max-width: 760px;
}
.encart .source {
  display: block;
  margin-top: var(--space-md);
  font-family: var(--cd-font-sans);
  font-style: normal;
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
}

/* ---------- Page hero (pôles, pages secondaires) ---------- */
.page-hero {
  background: var(--cd-marine);
  color: var(--cd-blanc);
  padding: 120px 0 96px;
  min-height: calc(100vh - 88px);
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.page-hero .wrap { width: 100%; }
.page-hero--image {
  background-color: var(--cd-marine);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.page-hero--image::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(95deg, rgba(11,28,77,0.82) 0%, rgba(11,28,77,0.58) 38%, rgba(11,28,77,0.28) 68%, rgba(11,28,77,0.12) 100%);
  pointer-events: none;
  z-index: 0;
}
.page-hero--image .wrap { position: relative; z-index: 1; }
.page-hero h1 { color: var(--cd-blanc); max-width: 18ch; }
.page-hero .lead { color: rgba(255,255,255,0.78); max-width: 60ch; margin-top: var(--space-lg); }
.page-hero .crumb {
  display: flex; gap: 10px; align-items: center;
  font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-bottom: var(--space-xl);
}
.page-hero .crumb a { text-decoration: none; color: var(--cd-bleu-ciel); opacity: 0.7; }
.page-hero .crumb a:hover { opacity: 1; color: var(--cd-corail); }

.page-hero .cta-row { display: flex; gap: var(--space-md); margin-top: var(--space-2xl); flex-wrap: wrap; }

/* ---------- Grille services (pôle) ---------- */
.services-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-2xl) var(--space-3xl);
}
.service h3 {
  font-size: 24px;
  margin-bottom: var(--space-sm);
}
.service .meta {
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cd-corail);
  margin-bottom: var(--space-sm);
}
.service p { color: var(--cd-anthracite); font-size: 15.5px; line-height: 1.6; }

/* ---------- Données chiffrées (sur marine) ---------- */
.kpi-band {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}
.kpi {
  padding: 0 var(--space-2xl);
  border-right: 1px solid rgba(255,255,255,0.18);
}
.kpi:first-child { padding-left: 0; }
.kpi:last-child { border-right: 0; padding-right: 0; }
.kpi .filet { background: var(--cd-corail); margin-bottom: var(--space-md); }
.kpi .val {
  font-family: var(--cd-font-serif);
  font-size: clamp(48px, 6vw, 72px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: -0.025em;
  color: var(--cd-blanc);
}
.kpi .val.accent { color: var(--cd-corail); }
.kpi .lab {
  font-size: 14px;
  color: rgba(255,255,255,0.78);
  margin-top: var(--space-md);
  line-height: 1.5;
}

/* ---------- Contact ---------- */
.contact-split {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  min-height: 700px;
}
.contact-left {
  background: var(--cd-marine);
  color: var(--cd-blanc);
  padding: var(--space-4xl) var(--space-3xl);
}
.contact-left h2 { color: var(--cd-blanc); }
.contact-left .group { margin-top: var(--space-2xl); }
.contact-left .group-title {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-bottom: var(--space-sm);
}
.contact-left .group p { color: rgba(255,255,255,0.86); font-size: 15px; line-height: 1.55; }
.contact-left .group a { color: var(--cd-blanc); text-decoration: none; }
.contact-left .group a:hover { color: var(--cd-corail); }
.contact-left .tel {
  font-family: var(--cd-font-serif);
  font-size: 32px;
  color: var(--cd-blanc);
  font-weight: 500;
}

.contact-right {
  background: var(--cd-blanc-casse);
  padding: var(--space-4xl) var(--space-3xl);
}
.contact-right h2 { margin-bottom: var(--space-sm); }
.contact-right .lead { margin-bottom: var(--space-2xl); color: var(--cd-gris-moyen); }
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-md) var(--space-md);
}
.field { display: flex; flex-direction: column; gap: 6px; }
.field.full { grid-column: 1 / -1; }
.field label {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
}
.field input,
.field select,
.field textarea {
  font-family: var(--cd-font-sans);
  font-size: 15px;
  padding: 12px 14px;
  background: var(--cd-blanc);
  border: 1px solid var(--cd-gris-clair);
  border-radius: 2px;
  color: var(--cd-anthracite);
  transition: border-color 120ms ease, box-shadow 120ms ease;
}
.field textarea { resize: vertical; min-height: 140px; line-height: 1.55; }
.field input:focus,
.field select:focus,
.field textarea:focus {
  outline: 0;
  border-color: var(--cd-marine);
  box-shadow: 0 0 0 2px rgba(11,28,77,0.08);
}
.form-foot {
  margin-top: var(--space-lg);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-md);
}
.form-foot small { color: var(--cd-gris-moyen); font-size: 12px; }

/* ---------- Avis ---------- */
.reviews-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3xl);
  align-items: end;
  margin-bottom: var(--space-3xl);
}
.score-block {
  display: flex; align-items: baseline; gap: var(--space-md);
}
.score-block .big {
  font-family: var(--cd-font-serif);
  font-size: 96px;
  font-weight: 500;
  line-height: 0.9;
  color: var(--cd-marine);
  letter-spacing: -0.03em;
}
.score-block .over {
  font-family: var(--cd-font-serif);
  font-size: 32px;
  color: var(--cd-gris-moyen);
}
.score-block .stars { color: var(--cd-corail); font-size: 22px; letter-spacing: 4px; }

.reviews-grid {
  display: flex;
  gap: var(--space-lg);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--cd-gris-clair) transparent;
  padding-bottom: var(--space-sm);
}
.reviews-grid::-webkit-scrollbar { height: 6px; }
.reviews-grid::-webkit-scrollbar-track { background: transparent; }
.reviews-grid::-webkit-scrollbar-thumb { background: var(--cd-gris-clair); border-radius: 3px; }
.review {
  background: var(--cd-blanc);
  border: 1px solid var(--cd-gris-clair);
  padding: var(--space-xl);
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
  flex: 0 0 320px;
  scroll-snap-align: start;
}
.review .review-text {
  font-family: var(--cd-font-serif);
  font-size: 15px;
  line-height: 1.5;
  color: var(--cd-marine);
  flex: 1;
}
.review .review-text.is-truncated {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.review .review-more {
  display: inline-block;
  font-family: var(--cd-font-sans);
  font-size: 12px;
  font-weight: 600;
  color: var(--cd-corail);
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  margin-top: 4px;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.review .review-more:hover { color: var(--cd-marine); }
.review .stars { color: var(--cd-corail); font-size: 14px; letter-spacing: 3px; }
.review .body {
  font-family: var(--cd-font-serif);
  font-size: 17px;
  line-height: 1.5;
  color: var(--cd-marine);
}
.review .author {
  font-size: 13px;
  color: var(--cd-anthracite);
  font-weight: 500;
  margin-top: var(--space-sm);
}
.review .src {
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
}

/* ---------- Legal pages ---------- */
.legal-content {
  max-width: 760px;
}
.legal-content h2 {
  font-size: 24px;
  margin-top: var(--space-2xl);
  margin-bottom: var(--space-md);
}
.legal-content h2:first-child { margin-top: 0; }
.legal-content p { color: var(--cd-anthracite); margin-bottom: var(--space-md); line-height: 1.65; }
.legal-content .entity {
  border-left: 4px solid var(--cd-bleu-roi);
  background: var(--cd-blanc-casse);
  padding: var(--space-md) var(--space-lg);
  margin-bottom: var(--space-md);
}
.legal-content .entity strong {
  font-family: var(--cd-font-serif);
  font-weight: 500;
  display: block;
  margin-bottom: 4px;
  color: var(--cd-marine);
}
.legal-content .entity span {
  font-size: 13px;
  color: var(--cd-anthracite);
  line-height: 1.55;
}

/* ---------- Qui sommes-nous ---------- */
.history-timeline {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: var(--space-xl);
  border-top: 1px solid var(--cd-gris-clair);
  padding: var(--space-xl) 0;
}
.history-timeline .year {
  font-family: var(--cd-font-serif);
  font-size: 36px;
  color: var(--cd-corail);
  letter-spacing: -0.02em;
}
.history-timeline .desc h3 { margin-bottom: var(--space-sm); font-size: 22px; }
.history-timeline .desc p { color: var(--cd-anthracite); font-size: 15.5px; line-height: 1.6; }

.values-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-xl);
}
.value {
  padding: var(--space-xl);
  border-top: 2px solid var(--cd-marine);
  background: var(--cd-blanc-casse);
}
.value .num {
  font-family: var(--cd-font-serif);
  font-size: 20px;
  color: var(--cd-corail);
  margin-bottom: var(--space-md);
}
.value h3 { font-size: 22px; margin-bottom: var(--space-sm); }
.value p { color: var(--cd-anthracite); font-size: 15px; line-height: 1.6; }

/* =============================================================
   ACTUALITÉS — listing + cartes
   ============================================================= */
.actu-toolbar {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-lg);
  align-items: end;
  padding-bottom: var(--space-xl);
  margin-bottom: var(--space-2xl);
  border-bottom: 1px solid var(--cd-gris-clair);
}
.actu-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.actu-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: transparent;
  border: 1px solid var(--cd-gris-clair);
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--cd-anthracite);
  padding: 8px 12px;
  cursor: pointer;
  border-radius: 2px;
  transition: all 120ms ease;
}
.actu-chip:hover { border-color: var(--cd-marine); color: var(--cd-marine); }
.actu-chip[aria-pressed="true"] {
  background: var(--cd-marine);
  border-color: var(--cd-marine);
  color: var(--cd-blanc);
}
.actu-chip .count {
  font-family: var(--cd-font-mono);
  font-size: 10px;
  color: var(--cd-gris-moyen);
}
.actu-chip[aria-pressed="true"] .count { color: rgba(255,255,255,0.65); }

.actu-search {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--cd-gris-clair);
  padding: 8px 12px;
  min-width: 280px;
}
.actu-search input {
  border: 0;
  outline: 0;
  font-family: var(--cd-font-sans);
  font-size: 14px;
  width: 100%;
  color: var(--cd-anthracite);
  background: transparent;
}
.actu-search svg { color: var(--cd-gris-moyen); flex-shrink: 0; }

/* ---------- Article cards ---------- */
.actu-featured {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: var(--space-3xl);
  align-items: center;
  background: var(--cd-marine);
  color: var(--cd-blanc);
  padding: var(--space-3xl);
  margin-bottom: var(--space-3xl);
  position: relative;
  overflow: hidden;
}
.actu-featured::before {
  content: "";
  position: absolute;
  left: var(--space-3xl);
  top: 0;
  width: 96px;
  height: 4px;
  background: var(--cd-corail);
}
.actu-featured .meta {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-bottom: var(--space-md);
  margin-top: var(--space-md);
  display: flex;
  gap: 16px;
  align-items: center;
}
.actu-featured .meta .type-tag { color: var(--cd-corail); }
.actu-featured h2 {
  color: var(--cd-blanc);
  font-size: clamp(28px, 3.4vw, 42px);
  line-height: 1.08;
  margin-bottom: var(--space-lg);
  max-width: 22ch;
}
.actu-featured .excerpt {
  color: rgba(255,255,255,0.78);
  font-size: 17px;
  line-height: 1.55;
  max-width: 52ch;
  margin-bottom: var(--space-xl);
}
.actu-featured a.read {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--cd-font-sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--cd-corail);
  text-decoration: none;
  border-bottom: 1px solid var(--cd-corail);
  padding-bottom: 4px;
  transition: gap 160ms ease;
}
.actu-featured a.read:hover { gap: 16px; }
.actu-featured .side-stats {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-left: 1px solid rgba(255,255,255,0.18);
  padding-left: var(--space-2xl);
}
.actu-featured .side-stats .row {
  padding: var(--space-md) 0;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
.actu-featured .side-stats .row:last-child { border-bottom: 0; }
.actu-featured .side-stats .v {
  font-family: var(--cd-font-serif);
  font-size: 32px;
  line-height: 1;
  color: var(--cd-blanc);
  letter-spacing: -0.02em;
}
.actu-featured .side-stats .v.accent { color: var(--cd-corail); }
.actu-featured .side-stats .l {
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
  margin-top: 6px;
}

.actu-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-xl) var(--space-lg);
}
.actu-card {
  background: var(--cd-blanc);
  border: 1px solid var(--cd-gris-clair);
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  transition: border-color 160ms ease, transform 160ms ease;
  position: relative;
}
.actu-card:hover { border-color: var(--cd-marine); }
.actu-card:hover .actu-card-title { color: var(--cd-corail); }
.actu-card-meta {
  display: flex;
  gap: 12px;
  align-items: center;
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: var(--space-md) var(--space-lg) 0;
  color: var(--cd-gris-moyen);
}
.actu-card-meta .type {
  color: var(--cd-corail);
  font-weight: 500;
}
.actu-card-meta .pole {
  display: inline-block;
  background: var(--cd-blanc-casse);
  border: 1px solid var(--cd-gris-clair);
  padding: 3px 7px;
  font-size: 9.5px;
}
.actu-card-body { padding: var(--space-md) var(--space-lg) var(--space-lg); flex: 1; }
.actu-card-title {
  font-family: var(--cd-font-serif);
  font-size: 22px;
  line-height: 1.18;
  color: var(--cd-marine);
  font-weight: 500;
  letter-spacing: -0.012em;
  margin-bottom: var(--space-sm);
  text-wrap: balance;
  transition: color 120ms ease;
}
.actu-card-excerpt {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--cd-anthracite);
}
.actu-card-foot {
  border-top: 1px solid var(--cd-gris-clair);
  padding: 12px var(--space-lg);
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
}
.actu-card-foot .read-time { color: var(--cd-marine); }

/* Variant: communiqué / brève — plus minéral */
.actu-card.kind-breve .actu-card-title,
.actu-card.kind-communique .actu-card-title { font-size: 18px; }

/* Pagination */
.actu-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  margin-top: var(--space-3xl);
}
.actu-pagination a, .actu-pagination span {
  font-family: var(--cd-font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  padding: 10px 14px;
  text-decoration: none;
  color: var(--cd-anthracite);
  border: 1px solid transparent;
  min-width: 40px;
  text-align: center;
}
.actu-pagination a:hover { border-color: var(--cd-gris-clair); color: var(--cd-marine); }
.actu-pagination .is-current {
  border: 1px solid var(--cd-marine);
  color: var(--cd-marine);
  font-weight: 500;
}

/* Home: derniers articles */
.home-actu {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-lg);
}

/* Home: notes de conjoncture */
.home-conjoncture {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-lg);
  margin-top: var(--space-2xl);
}
.conj-card {
  background: var(--cd-blanc);
  border: 1px solid var(--cd-gris-clair);
  border-radius: 6px;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  transition: border-color 160ms ease, transform 160ms ease;
}
.conj-card:hover { border-color: var(--cd-marine); }
.conj-card:hover .conj-card-title { color: var(--cd-corail); }
.conj-card-soon { cursor: default; opacity: 0.7; }
.conj-card-soon:hover { border-color: var(--cd-gris-clair); }
.conj-card-soon:hover .conj-card-title { color: inherit; }
.conj-card-img {
  height: 180px;
  background-size: cover;
  background-position: center;
  position: relative;
}
.conj-card-img::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(11,28,77,0.15) 0%, rgba(11,28,77,0.55) 100%);
}
.conj-img-mobilite  { background: url('../assets/images/vignette-conj-mobilite-2026.webp') center/cover; }
.conj-img-protection { background: url('../assets/images/vignette-conj-protection-sociale-2027.webp') center/cover; }
.conj-img-cyber { background: url('../assets/images/conjoncture-cyber-cover.webp') center/cover; }
.conj-card-body {
  padding: var(--space-md) var(--space-lg) var(--space-lg);
  flex: 1;
  display: flex;
  flex-direction: column;
}
.conj-card-body .actu-card-meta { padding: 0; margin-bottom: var(--space-sm); }
.conj-card-title {
  font-family: var(--cd-font-serif);
  font-size: 22px;
  line-height: 1.2;
  color: var(--cd-marine);
  font-weight: 500;
  letter-spacing: -0.012em;
  margin-bottom: var(--space-sm);
  transition: color 120ms ease;
}
.conj-card-excerpt {
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--cd-anthracite);
  flex: 1;
}
.conj-card-foot {
  border-top: 1px solid var(--cd-gris-clair);
  padding: 12px 0 0;
  margin-top: var(--space-md);
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
}
.conj-card-foot .read-time { color: var(--cd-marine); }
@media (max-width: 1024px) {
  .home-conjoncture { grid-template-columns: 1fr; }
  .conj-card-img { height: 140px; }
}

/* ============ TRANSPARENCE — responsive ============ */
@media (max-width: 1024px) {
  section.bg-marine[style*="space-5xl"] .wrap[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: var(--space-2xl) !important;
  }
}

/* =============================================================
   NOTRE ACCOMPAGNEMENT — page dédiée + composants transverses
   ============================================================= */

/* ---------- Hero compteur temps gagné ---------- */
.acc-hero {
  background: var(--cd-marine);
  color: var(--cd-blanc);
  padding: 140px 0 120px;
  position: relative;
  overflow: hidden;
}
.acc-hero .wrap {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: var(--space-3xl);
  align-items: end;
}
.acc-hero h1 {
  color: var(--cd-blanc);
  max-width: 14ch;
  margin-top: var(--space-md);
}
.acc-hero h1 em {
  font-family: var(--cd-font-serif);
  font-style: italic;
  color: var(--cd-corail);
  font-weight: 400;
}
.acc-hero .lead {
  color: rgba(255,255,255,0.78);
  max-width: 52ch;
  margin-top: var(--space-xl);
  font-size: 19px;
  line-height: 1.55;
}

.acc-counter {
  border-left: 1px solid rgba(255,255,255,0.18);
  padding-left: var(--space-2xl);
}
.acc-counter .label {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-bottom: var(--space-md);
}
.acc-counter .big {
  font-family: var(--cd-font-serif);
  font-size: clamp(80px, 11vw, 168px);
  line-height: 0.9;
  letter-spacing: -0.035em;
  color: var(--cd-corail);
  font-weight: 500;
  font-variant-numeric: lining-nums tabular-nums;
}
.acc-counter .big .unit {
  font-size: 0.32em;
  color: var(--cd-bleu-ciel);
  font-style: italic;
  font-weight: 400;
  margin-left: 6px;
  display: inline-block;
  vertical-align: 0.6em;
}
.acc-counter .caption {
  font-family: var(--cd-font-serif);
  font-style: italic;
  font-size: 18px;
  color: var(--cd-blanc);
  margin-top: var(--space-md);
  max-width: 30ch;
  line-height: 1.4;
}

/* ---------- Phases (2 colonnes Avant / Après signature) ---------- */
.acc-phases {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  border-top: 1.5px solid var(--cd-marine);
}
.acc-phase {
  padding: var(--space-3xl);
  border-right: 1px solid var(--cd-gris-clair);
}
.acc-phase:last-child { border-right: 0; }
.acc-phase .phase-label {
  display: flex;
  align-items: center;
  gap: 16px;
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cd-corail);
  margin-bottom: 24px;
}
.acc-phase .phase-label::before {
  content: "";
  display: block;
  width: 40px; height: 2px;
  background: var(--cd-corail);
}
.acc-phase h2 {
  font-size: 30px;
  margin-bottom: var(--space-md);
  max-width: 22ch;
}
.acc-phase .intro {
  color: var(--cd-anthracite);
  font-size: 15.5px;
  line-height: 1.55;
  max-width: 42ch;
  margin-bottom: var(--space-2xl);
}

/* ---------- Liste des 10 étapes ---------- */
.acc-steps {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: step;
}
.acc-step {
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: 24px;
  padding: 20px 0;
  border-top: 1px solid var(--cd-gris-clair);
  position: relative;
}
.acc-step:last-child { border-bottom: 1px solid var(--cd-gris-clair); }
.acc-step .num {
  font-family: var(--cd-font-serif);
  font-size: 26px;
  font-weight: 400;
  color: var(--cd-corail);
  line-height: 1;
  padding-top: 2px;
  font-variant-numeric: lining-nums tabular-nums;
}
.acc-step h3 {
  font-family: var(--cd-font-serif);
  font-size: 19px;
  color: var(--cd-marine);
  margin-bottom: 6px;
  font-weight: 500;
  line-height: 1.25;
}
.acc-step p {
  color: var(--cd-anthracite);
  font-size: 14.5px;
  line-height: 1.55;
}
.acc-step .sla {
  display: inline-block;
  margin-top: 8px;
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cd-corail);
  border: 1px solid var(--cd-corail-fond);
  background: var(--cd-corail-fond);
  padding: 4px 8px;
}

/* ---------- Verbatims clients ---------- */
.verbatims {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1.5px solid var(--cd-marine);
  border-bottom: 1px solid var(--cd-gris-clair);
}
.verbatim {
  padding: var(--space-2xl) var(--space-xl);
  border-right: 1px solid var(--cd-gris-clair);
  background: var(--cd-blanc);
}
.verbatim:last-child { border-right: 0; }
.verbatim .mark {
  font-family: var(--cd-font-serif);
  font-style: italic;
  font-size: 56px;
  color: var(--cd-corail);
  line-height: 0.5;
  margin-bottom: 16px;
  font-weight: 400;
}
.verbatim blockquote {
  font-family: var(--cd-font-serif);
  font-size: 20px;
  line-height: 1.4;
  color: var(--cd-marine);
  margin: 0 0 var(--space-md) 0;
  letter-spacing: -0.005em;
}
.verbatim .author {
  font-family: var(--cd-font-sans);
  font-size: 13px;
  font-weight: 500;
  color: var(--cd-anthracite);
  margin-top: var(--space-md);
}
.verbatim .role {
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
  margin-top: 4px;
}

/* ---------- Bandeau compagnies mandantes ---------- */
.mandants {
  padding: var(--space-3xl) 0;
  background: var(--cd-blanc-casse);
  border-top: 1px solid var(--cd-gris-clair);
  border-bottom: 1px solid var(--cd-gris-clair);
}
.mandants .head {
  text-align: center;
  margin-bottom: var(--space-2xl);
}
.mandants .eyebrow { color: var(--cd-corail); margin-bottom: 12px; }
.mandants h2 {
  font-size: 28px;
  max-width: 40ch;
  margin: 0 auto;
  text-align: center;
}
.mandants-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1px;
  background: var(--cd-gris-clair);
  border: 1px solid var(--cd-gris-clair);
}
.mandant {
  background: var(--cd-blanc);
  padding: 32px 16px;
  display: grid;
  place-items: center;
  min-height: 100px;
  font-family: var(--cd-font-serif);
  font-size: 16px;
  color: var(--cd-marine);
  letter-spacing: -0.005em;
  font-weight: 500;
  text-align: center;
}
.mandant .placeholder {
  display: block;
  font-family: var(--cd-font-mono);
  font-size: 9.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
  margin-top: 6px;
  font-weight: 400;
}

/* ---------- Composant transverse sur pôles (encart service) ---------- */
.service-strip {
  background: var(--cd-marine);
  color: var(--cd-blanc);
  padding: var(--space-4xl) 0;
  border-top: 1px solid var(--cd-bleu-nuit);
}
.service-strip h2 { color: var(--cd-blanc); }
.service-strip .strip-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3xl);
  align-items: end;
  margin-bottom: var(--space-2xl);
}
.service-strip .strip-head p {
  color: rgba(255,255,255,0.78);
  font-size: 17px;
  line-height: 1.55;
  max-width: 46ch;
  justify-self: end;
}
.service-strip .filet { background: var(--cd-corail); margin-bottom: 24px; }
.service-strip .eyebrow { color: var(--cd-bleu-ciel); margin-bottom: 16px; }

.service-strip-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid rgba(255,255,255,0.18);
}
.service-item {
  padding: var(--space-xl) var(--space-md) var(--space-xl) 0;
  border-right: 1px solid rgba(255,255,255,0.12);
}
.service-item:last-child { border-right: 0; padding-right: 0; }
.service-item:not(:first-child) { padding-left: var(--space-lg); }
.service-item .marker {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cd-corail);
  margin-bottom: 14px;
}
.service-item h4 {
  font-family: var(--cd-font-serif);
  font-size: 19px;
  color: var(--cd-blanc);
  margin-bottom: 10px;
  font-weight: 500;
  line-height: 1.25;
}
.service-item p {
  color: rgba(255,255,255,0.72);
  font-size: 14px;
  line-height: 1.55;
}
.service-strip .cta-row {
  margin-top: var(--space-2xl);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-lg);
  flex-wrap: wrap;
  padding-top: var(--space-xl);
  border-top: 1px solid rgba(255,255,255,0.18);
}
.service-strip .cta-row .reminder {
  font-family: var(--cd-font-serif);
  font-style: italic;
  font-size: 18px;
  color: rgba(255,255,255,0.92);
  max-width: 50ch;
}

/* ---------- Strip hero (sous le hero principal home) ---------- */
.hero-services-strip {
  background: var(--cd-bleu-nuit);
  color: var(--cd-blanc);
  border-top: 1px solid rgba(255,255,255,0.08);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.hero-services-strip .wrap {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}
.hero-services-strip .cell {
  padding: var(--space-xl) var(--space-lg);
  border-right: 1px solid rgba(255,255,255,0.12);
}
.hero-services-strip .cell:last-child { border-right: 0; }
.hero-services-strip .marker {
  font-family: var(--cd-font-mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--cd-corail);
  margin-bottom: 12px;
}
.hero-services-strip h4 {
  font-family: var(--cd-font-serif);
  font-size: 18px;
  color: var(--cd-blanc);
  font-weight: 500;
  letter-spacing: -0.005em;
  line-height: 1.25;
}

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .acc-hero .wrap { grid-template-columns: 1fr; }
  .acc-counter { border-left: 0; padding-left: 0; border-top: 1px solid rgba(255,255,255,0.18); padding-top: var(--space-xl); margin-top: var(--space-xl); }
  .acc-phases { grid-template-columns: 1fr; }
  .acc-phase { border-right: 0; border-bottom: 1px solid var(--cd-gris-clair); }
  .acc-phase:last-child { border-bottom: 0; }
  .verbatims { grid-template-columns: 1fr; }
  .verbatim { border-right: 0; border-bottom: 1px solid var(--cd-gris-clair); }
  .verbatim:last-child { border-bottom: 0; }
  .mandants-grid { grid-template-columns: repeat(3, 1fr); }
  .service-strip .strip-head { grid-template-columns: 1fr; gap: var(--space-md); }
  .service-strip .strip-head p { justify-self: start; }
  .service-strip-grid { grid-template-columns: repeat(2, 1fr); }
  .service-item { padding: var(--space-lg) !important; border-bottom: 1px solid rgba(255,255,255,0.12); }
  .service-item:nth-child(2) { border-right: 0 !important; }
  .hero-services-strip .wrap { grid-template-columns: repeat(2, 1fr); }
  .hero-services-strip .cell:nth-child(2) { border-right: 0; }
  .hero-services-strip .cell:nth-child(1), .hero-services-strip .cell:nth-child(2) { border-bottom: 1px solid rgba(255,255,255,0.12); }
}
@media (max-width: 720px) {
  .mandants-grid { grid-template-columns: repeat(2, 1fr); }
  .service-strip-grid { grid-template-columns: 1fr; }
  .hero-services-strip .wrap { grid-template-columns: 1fr; }
  .hero-services-strip .cell { border-right: 0; border-bottom: 1px solid rgba(255,255,255,0.12); }
  .hero-services-strip .cell:last-child { border-bottom: 0; }
}

/* ============ TIMELINE HORIZONTALE — Qui sommes-nous ============ */
.timeline-h {
  position: relative;
  padding: var(--space-2xl) 0 var(--space-xl);
}
.timeline-h .points {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
}
.timeline-h .points::before {
  content: "";
  position: absolute;
  top: 7px;
  left: 8.333%;
  right: 8.333%;
  height: 2px;
  background: linear-gradient(90deg, var(--cd-marine) 0%, var(--cd-marine) 78%, var(--cd-corail) 100%);
  z-index: 0;
}
.timeline-h .point {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0 8px;
}
.timeline-h .point::before {
  content: "";
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--cd-marine);
  border: 3px solid var(--cd-blanc-casse);
  box-shadow: 0 0 0 1px var(--cd-marine);
  margin-bottom: 18px;
  z-index: 2;
}
.timeline-h .point.is-now::before {
  background: var(--cd-corail);
  box-shadow: 0 0 0 1px var(--cd-corail), 0 0 0 8px rgba(232, 98, 74, 0.12);
}
.timeline-h .point .year {
  font-family: var(--cd-font-serif);
  font-size: 32px;
  line-height: 1;
  color: var(--cd-marine);
  letter-spacing: -0.02em;
  margin-bottom: 8px;
  font-weight: 500;
  font-variant-numeric: lining-nums tabular-nums;
}
.timeline-h .point.is-now .year { color: var(--cd-corail); }
.timeline-h .point .gen {
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
  margin-bottom: 12px;
}
.timeline-h .point.is-now .gen { color: var(--cd-corail); }
.timeline-h .point .desc {
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--cd-anthracite);
  max-width: 22ch;
  text-wrap: pretty;
}
.timeline-h .point .desc strong {
  font-family: var(--cd-font-serif);
  font-weight: 500;
  font-size: 15px;
  color: var(--cd-marine);
  display: block;
  margin-bottom: 6px;
  letter-spacing: -0.005em;
}

@media (max-width: 1024px) {
  .timeline-h .points::before {
    top: 0; bottom: 0;
    left: 14px;
    right: auto;
    width: 2px;
    height: auto;
    background: linear-gradient(180deg, var(--cd-marine) 0%, var(--cd-marine) 78%, var(--cd-corail) 100%);
  }
  .timeline-h .points {
    grid-template-columns: 1fr;
    gap: var(--space-xl);
  }
  .timeline-h .point {
    flex-direction: row;
    align-items: flex-start;
    text-align: left;
    padding: 0 0 0 40px;
    position: relative;
  }
  .timeline-h .point::before {
    position: absolute;
    left: 8px;
    top: 4px;
    margin-bottom: 0;
  }
  .timeline-h .point > div {
    width: 100%;
  }
  .timeline-h .point .desc { max-width: none; }
}
:root {
  --art-col: 720px;
  --art-col-wide: 920px;
}

/* ---------- Article header (cover marine) ---------- */
.article-cover {
  background: var(--cd-marine);
  color: var(--cd-blanc);
  padding: 100px 0 80px;
  position: relative;
}
.article-cover.is-light {
  background: var(--cd-blanc-casse);
  color: var(--cd-anthracite);
}
.article-cover.is-light h1 { color: var(--cd-marine); }
.article-cover.is-light .lead { color: var(--cd-anthracite); }

.article-cover .wrap-art {
  max-width: var(--art-col-wide);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.article-cover .crumb {
  display: flex;
  gap: 12px;
  align-items: center;
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-bottom: var(--space-2xl);
}
.article-cover.is-light .crumb { color: var(--cd-gris-moyen); }
.article-cover .crumb a { text-decoration: none; color: inherit; opacity: 0.85; }
.article-cover .crumb a:hover { color: var(--cd-corail); opacity: 1; }

.article-cover .type-tag {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--cd-corail);
  margin-bottom: var(--space-md);
}
.article-cover .type-tag::before {
  content: "";
  display: inline-block;
  width: 28px; height: 2px;
  background: var(--cd-corail);
}
.article-cover h1 {
  color: var(--cd-blanc);
  font-size: clamp(40px, 5vw, 64px);
  line-height: 1.04;
  letter-spacing: -0.022em;
  max-width: 22ch;
  margin-bottom: var(--space-xl);
}
.article-cover .lead {
  font-family: var(--cd-font-serif);
  font-style: italic;
  font-size: 22px;
  line-height: 1.45;
  color: rgba(255,255,255,0.82);
  max-width: 50ch;
  margin-bottom: var(--space-2xl);
}
.article-cover.is-light .lead { color: var(--cd-anthracite); font-style: normal; }

.article-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  padding-top: var(--space-lg);
  border-top: 1px solid rgba(255,255,255,0.18);
}
.article-cover.is-light .article-meta { border-top-color: var(--cd-gris-clair); }
.article-meta dt {
  font-family: var(--cd-font-mono);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-bottom: 4px;
}
.article-cover.is-light .article-meta dt { color: var(--cd-gris-moyen); }
.article-meta dd {
  font-family: var(--cd-font-sans);
  font-size: 14px;
  margin: 0;
  color: var(--cd-blanc);
}
.article-cover.is-light .article-meta dd { color: var(--cd-marine); }

/* ---------- Article body ---------- */
.article-body {
  max-width: var(--art-col);
  margin: 0 auto;
  padding: var(--space-3xl) var(--gutter);
  font-size: 17px;
  line-height: 1.68;
  color: var(--cd-anthracite);
}
.article-body p { margin: 0 0 1.2em; }
.article-body p:first-child::first-letter {
  font-family: var(--cd-font-serif);
  font-size: 64px;
  float: left;
  line-height: 1;
  padding: 6px 12px 0 0;
  color: var(--cd-corail);
  font-weight: 500;
}
.article-body .no-dropcap p:first-child::first-letter { all: unset; }

.article-body h2 {
  font-family: var(--cd-font-serif);
  font-size: 30px;
  color: var(--cd-marine);
  line-height: 1.15;
  letter-spacing: -0.015em;
  margin: 2.4em 0 0.6em;
  font-weight: 500;
}
.article-body h2 .num-prefix {
  display: block;
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cd-corail);
  margin-bottom: 12px;
  font-weight: 500;
}
.article-body h3 {
  font-family: var(--cd-font-serif);
  font-size: 22px;
  color: var(--cd-marine);
  line-height: 1.25;
  margin: 1.8em 0 0.5em;
  font-weight: 500;
}
.article-body h4 {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cd-corail);
  font-weight: 500;
  margin: 1.6em 0 0.6em;
}
.article-body strong { color: var(--cd-marine); font-weight: 600; }
.article-body em { font-family: var(--cd-font-serif); font-style: italic; color: var(--cd-bleu-roi); }
.article-body a {
  color: var(--cd-corail);
  text-decoration: none;
  border-bottom: 1px solid var(--cd-corail-fond);
}
.article-body a:hover { border-bottom-color: var(--cd-corail); }
.article-body ul, .article-body ol {
  margin: 1em 0 1.4em 0;
  padding-left: 24px;
}
.article-body li { margin-bottom: 0.5em; }
.article-body ul li::marker { color: var(--cd-corail); }

/* Article — wide-bleed elements (full-bleed encarts) */
.article-wide {
  max-width: var(--art-col-wide);
  margin-left: auto;
  margin-right: auto;
  padding: 0 var(--gutter);
}

.article-pullquote {
  font-family: var(--cd-font-serif);
  font-style: italic;
  font-size: 28px;
  line-height: 1.32;
  color: var(--cd-marine);
  letter-spacing: -0.01em;
  border-left: 2px solid var(--cd-corail);
  padding: 12px 0 12px 32px;
  margin: 2em 0;
  max-width: var(--art-col);
}
.article-pullquote cite {
  display: block;
  font-family: var(--cd-font-mono);
  font-style: normal;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
  margin-top: 14px;
}

.article-kpi-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid var(--cd-gris-clair);
  border-bottom: 1px solid var(--cd-gris-clair);
  margin: var(--space-2xl) 0;
}
.article-kpi-row .kpi-cell {
  padding: var(--space-lg) var(--space-md);
  border-right: 1px solid var(--cd-gris-clair);
}
.article-kpi-row .kpi-cell:last-child { border-right: 0; }
.article-kpi-row .v {
  font-family: var(--cd-font-serif);
  font-size: 42px;
  line-height: 1;
  color: var(--cd-marine);
  letter-spacing: -0.02em;
  font-weight: 500;
}
.article-kpi-row .v.accent { color: var(--cd-corail); }
.article-kpi-row .v .unit { font-size: 16px; color: var(--cd-bleu-roi); font-style: italic; }
.article-kpi-row .l {
  margin-top: 10px;
  font-size: 13px;
  color: var(--cd-anthracite);
  line-height: 1.4;
}
.article-kpi-row .src {
  font-family: var(--cd-font-mono);
  font-size: 10px;
  letter-spacing: 0.06em;
  color: var(--cd-gris-moyen);
  margin-top: 6px;
}

.article-lecture {
  background: var(--cd-marine);
  color: var(--cd-blanc);
  padding: var(--space-2xl);
  position: relative;
  margin: var(--space-2xl) 0;
}
.article-lecture::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 5px; height: 100%;
  background: var(--cd-corail);
}
.article-lecture .label {
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--cd-bleu-ciel);
  margin-bottom: 12px;
}
.article-lecture h4 {
  font-family: var(--cd-font-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 24px;
  color: var(--cd-blanc);
  margin: 0 0 14px;
  letter-spacing: -0.005em;
}
.article-lecture p {
  color: rgba(255,255,255,0.85);
  font-size: 15.5px;
  line-height: 1.6;
  margin: 0 0 0.9em;
}
.article-lecture p:last-child { margin-bottom: 0; }
.article-lecture p:first-child::first-letter { all: unset; }

.article-attention {
  background: var(--cd-corail-fond);
  border-left: 4px solid var(--cd-corail);
  padding: var(--space-lg) var(--space-xl);
  margin: 2em 0;
}
.article-attention .label {
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--cd-corail);
  margin-bottom: 8px;
  font-weight: 500;
}
.article-attention h4 {
  font-family: var(--cd-font-serif);
  font-size: 19px;
  color: var(--cd-marine);
  margin: 0 0 8px;
}
.article-attention p {
  font-size: 15px;
  color: var(--cd-anthracite);
  margin: 0;
}
.article-attention p:first-child::first-letter { all: unset; }

/* Article table — réglementaire */
.article-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  margin: var(--space-xl) 0;
}
.article-table th, .article-table td {
  padding: 14px 14px;
  text-align: left;
  border-bottom: 1px solid var(--cd-gris-clair);
  vertical-align: top;
}
.article-table thead th {
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
  font-weight: 500;
  border-bottom: 1.5px solid var(--cd-marine);
}
.article-table .indicator {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.article-table .ind-up    { color: #c44020; }
.article-table .ind-up::before { content:"▲ "; }
.article-table .ind-stable{ color: var(--cd-bleu-vif); }
.article-table .ind-stable::before { content:"■ "; }
.article-table .ind-down { color: var(--cd-success, #16A34A); }
.article-table .ind-down::before { content:"▼ "; }

/* Figure */
.article-figure { margin: var(--space-xl) 0; }
.article-figure .img {
  background: var(--cd-blanc-casse);
  aspect-ratio: 16 / 9;
  border: 1px solid var(--cd-gris-clair);
  display: grid; place-items: center;
  background:
    repeating-linear-gradient(135deg,
      var(--cd-blanc-casse) 0,
      var(--cd-blanc-casse) 12px,
      #eef2f8 12px,
      #eef2f8 24px);
}
.article-figure .img .ph-label {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cd-anthracite);
  background: var(--cd-blanc);
  padding: 6px 12px;
  border: 1px solid var(--cd-gris-clair);
}
.article-figure figcaption {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 16px;
  margin-top: 12px;
  font-size: 13px;
  color: var(--cd-anthracite);
  line-height: 1.5;
}
.article-figure figcaption .num {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  color: var(--cd-corail);
  letter-spacing: 0.1em;
}

/* TOC sticky */
.article-toc {
  position: sticky;
  top: 100px;
  border-left: 1px solid var(--cd-gris-clair);
  padding-left: var(--space-lg);
}
.article-toc .label {
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
  margin-bottom: var(--space-md);
}
.article-toc ol { list-style: none; padding: 0; margin: 0; counter-reset: t; }
.article-toc li { counter-increment: t; margin-bottom: 10px; line-height: 1.4; }
.article-toc a {
  text-decoration: none;
  font-size: 13.5px;
  color: var(--cd-anthracite);
  display: flex;
  gap: 10px;
}
.article-toc a::before {
  content: counter(t, decimal-leading-zero);
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  color: var(--cd-corail);
  flex-shrink: 0;
}
.article-toc a:hover { color: var(--cd-corail); }

/* Article footer / signature */
.article-signature {
  max-width: var(--art-col);
  margin: var(--space-2xl) auto var(--space-3xl);
  padding: var(--space-xl) var(--gutter);
  border-top: 1px solid var(--cd-gris-clair);
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: var(--space-md);
}
.article-signature .avatar {
  width: 64px; height: 64px;
  background: var(--cd-blanc-casse);
  border: 1px solid var(--cd-gris-clair);
  display: grid;
  place-items: center;
  font-family: var(--cd-font-serif);
  font-style: italic;
  font-size: 22px;
  color: var(--cd-marine);
}
.article-signature .name {
  font-family: var(--cd-font-serif);
  font-size: 18px;
  color: var(--cd-marine);
  margin-bottom: 2px;
}
.article-signature .role {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
  margin-bottom: 10px;
}
.article-signature .bio {
  font-size: 14px;
  color: var(--cd-anthracite);
  line-height: 1.55;
}

/* References */
.article-refs {
  max-width: var(--art-col);
  margin: 0 auto var(--space-3xl);
  padding: var(--space-xl) var(--gutter) 0;
  border-top: 1px solid var(--cd-gris-clair);
  font-family: var(--cd-font-mono);
  font-size: 11.5px;
  line-height: 1.65;
  color: var(--cd-gris-moyen);
  columns: 2;
  column-gap: 48px;
}
.article-refs .r { break-inside: avoid; margin-bottom: 8px; }
.article-refs .num { color: var(--cd-corail); margin-right: 8px; }
.article-refs .label {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cd-anthracite);
  margin-bottom: var(--space-md);
  column-span: all;
}

/* "À lire aussi" suggestions */
.article-related {
  background: var(--cd-blanc-casse);
  padding: var(--space-3xl) 0;
}
.article-related .wrap-art {
  max-width: var(--art-col-wide);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.article-related .head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  margin-bottom: var(--space-xl);
}
.article-related .actu-grid { gap: var(--space-md); }

/* Liste des articles connexes */
.article-related .wrap-narrow { max-width: 860px; margin: 0 auto; padding: 0 var(--gutter); }
.article-related h2 {
  font-family: var(--cd-font-serif);
  font-size: 20px;
  font-weight: 600;
  color: var(--cd-marine);
  margin-bottom: var(--space-lg);
}
.related-list { list-style: none; padding: 0; }
.related-list li {
  padding: var(--space-md) 0;
  border-bottom: 1px solid var(--cd-gris-clair);
  display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-md);
}
.related-list li:last-child { border-bottom: 0; }
.related-list a {
  font-family: var(--cd-font-serif);
  font-size: 16px;
  font-weight: 500;
  color: var(--cd-marine);
  text-decoration: none;
}
.related-list a:hover { color: var(--cd-corail); }
.related-date {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  color: var(--cd-gris-moyen);
  white-space: nowrap;
  letter-spacing: 0.04em;
}

/* Gabarit "Brève" : sobre, dense, sans dropcap */
.article-breve .article-body { font-size: 15.5px; line-height: 1.6; }
.article-breve .article-body p:first-child::first-letter { all: unset; }
.article-breve .article-cover { padding: 80px 0 60px; }
.article-breve .article-cover h1 { font-size: clamp(32px, 3.6vw, 44px); }

/* Gabarit "Communiqué" : header sobre clair */
.article-communique .article-cover h1 { font-size: clamp(32px, 3.6vw, 44px); }
.article-communique .article-body p:first-child::first-letter { all: unset; }
.article-communique .article-dateline {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cd-corail);
  margin-bottom: var(--space-md);
  font-weight: 500;
}

/* Gabarit "Étude de cas" — entêtes structurées */
.case-stage {
  display: grid;
  grid-template-columns: 140px 1fr;
  gap: var(--space-lg);
  padding: var(--space-lg) 0;
  border-top: 1px solid var(--cd-gris-clair);
  align-items: start;
}
.case-stage .stage-num {
  font-family: var(--cd-font-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cd-corail);
  padding-top: 6px;
}
.case-stage h3 { margin-top: 0; }

/* Tribune : 2 colonnes corps + portrait sticky */
.article-tribune .article-body { max-width: var(--art-col); }

/* Couleurs sémantiques par type d'article */
.type-conjoncture { color: var(--cd-corail); }
.type-breve       { color: var(--cd-bleu-roi); }
.type-cas         { color: #16A34A; }
.type-tribune     { color: var(--cd-marine); }
.type-communique  { color: var(--cd-gris-moyen); }

/* ---------- Responsive ---------- */
/* Header compact — écrans moyens (portables 13", 1200-1025px) */
@media (max-width: 1200px) {
  .site-header nav { gap: 14px; }
  .site-header nav a { font-size: 12.5px; }
  .site-header .brand img { height: 30px; }
  .site-header .header-actions { gap: 6px; }
  .site-header .btn { font-size: 12px; padding: 10px 18px; }
  .account-menu .account-trigger { font-size: 12px; padding: 7px 10px; }
}

/* Header mobile — tablettes et petits écrans */
@media (max-width: 1024px) {
  .page-hero { min-height: auto; padding: 100px 0 60px; }
  /* Header bascule en mode mobile dès le viewport tablette */
  .site-header nav,
  .site-header .account-menu { display: none; }
  .site-header .hamburger { display: inline-flex; }

  .hero { padding: 80px 0 60px; min-height: auto; }
  .hero .wrap { grid-template-columns: 1fr; }
  .hero--single .hero-content .lead { white-space: normal !important; font-size: 17px !important; }
  .hero-ctas { grid-template-columns: 1fr; max-width: none; }
  .hero-cta { min-height: auto; padding: 16px 18px; }
  .hero-cta-arrow { position: static; align-self: flex-end; margin-top: -28px; }
  .hero-stats-row { grid-template-columns: 1fr; max-width: none; }
  .hero-stats-row .stat-cell { padding: var(--space-md) var(--space-lg); }
  .poles-grid { grid-template-columns: repeat(2, 1fr); }
  .pole { border-right: none !important; border-bottom: 1px solid var(--cd-gris-clair); }
  .pole:nth-child(2n) { border-right: 0; }
  .section-header { grid-template-columns: 1fr; gap: var(--space-lg); }
  .proxi { grid-template-columns: 1fr; gap: var(--space-lg); }
  .proof-grid { grid-template-columns: 1fr; }
  .proof-cell { border-right: 0; border-bottom: 1px solid rgba(255,255,255,0.16); }
  .proof-cell:last-child { border-bottom: 0; }
  .services-grid { grid-template-columns: 1fr; }
  .kpi-band { grid-template-columns: 1fr; gap: var(--space-lg); }
  .kpi { border-right: 0; padding: 0; border-bottom: 1px solid rgba(255,255,255,0.18); padding-bottom: var(--space-lg); }
  .kpi:last-child { border-bottom: 0; }
  .contact-split { grid-template-columns: 1fr; }
  .reviews-grid { flex-wrap: nowrap; overflow-x: auto; }
  .reviews-head { grid-template-columns: 1fr; }
  .history-timeline { grid-template-columns: 1fr; gap: var(--space-md); }
  .values-grid { grid-template-columns: 1fr; }
  .site-footer .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-2xl); }
  .actu-grid { grid-template-columns: repeat(2, 1fr); }
  .actu-featured { grid-template-columns: 1fr; padding: var(--space-2xl); }
  .actu-featured .side-stats { border-left: 0; border-top: 1px solid rgba(255,255,255,0.18); padding-left: 0; padding-top: var(--space-lg); }
  .home-actu { grid-template-columns: 1fr; }
  .article-kpi-row { grid-template-columns: repeat(2, 1fr); }
  .article-kpi-row .kpi-cell:nth-child(2) { border-right: 0; }
  .article-kpi-row .kpi-cell:nth-child(1), .article-kpi-row .kpi-cell:nth-child(2) { border-bottom: 1px solid var(--cd-gris-clair); }
  .actu-toolbar { grid-template-columns: 1fr; }
  .actu-search { min-width: 0; }
  .case-stage { grid-template-columns: 1fr; gap: var(--space-sm); }
}
@media (max-width: 720px) {
  :root { --gutter: 20px; }
  section { padding: var(--space-3xl) 0; }
  .site-header nav { display: none; }
  .site-header .account-menu { display: none; }
  .site-header .hamburger { display: inline-flex; }
  .hero-video { display: none; }
  .pole-hero-video { display: none; }
  .pole-hero-mobile { display: block !important; }
  .poles-grid { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .site-footer .footer-grid { grid-template-columns: 1fr; gap: var(--space-xl); }
  .hero .stats { grid-template-columns: 1fr 1fr; }
  .score-block .big { font-size: 72px; }
  .actu-grid { grid-template-columns: 1fr; }
  .article-kpi-row { grid-template-columns: 1fr; }
  .article-kpi-row .kpi-cell { border-right: 0; border-bottom: 1px solid var(--cd-gris-clair); }
  .article-kpi-row .kpi-cell:last-child { border-bottom: 0; }
  .article-refs { columns: 1; }
}

/* ---------- Mobile nav overlay ---------- */
.mobile-nav-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(11, 28, 77, 0.97); /* marine quasi-opaque */
  z-index: 9999;
  padding: 100px var(--gutter) var(--gutter);
  overflow-y: auto;
}
.mobile-nav-overlay.open { display: flex; flex-direction: column; }
.mobile-nav-overlay nav { display: flex !important; flex-direction: column; gap: 12px; }
.mobile-nav-overlay nav a {
  display: block;
  color: #fff;
  font-family: var(--cd-font-serif);
  font-size: 22px;
  font-weight: 500;
  text-decoration: none;
  padding: 12px 0;
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
.mobile-nav-overlay nav .has-sub > a { font-weight: 600; }
.mobile-nav-overlay nav .sub {
  display: flex !important;
  flex-direction: column;
  gap: 4px;
  padding: 8px 0 8px 16px;
  position: static;
  opacity: 1;
  visibility: visible;
  background: none;
  box-shadow: none;
}
.mobile-nav-overlay nav .sub a {
  font-size: 17px;
  font-weight: 400;
  border-bottom: none;
  padding: 6px 0;
  opacity: 0.8;
}
.hamburger.active svg path { stroke: var(--cd-corail); }

/* ---------- Mobile phones (480px et moins) ---------- */
@media (max-width: 480px) {
  :root { --gutter: 16px; }

  /* Header */
  .site-header .brand img { height: 28px; }
  .site-header .btn { display: none; }
  .site-header .account-menu { display: none; }

  /* Hero */
  .hero { padding: 60px 0 40px; }
  .hero h1 {
    font-size: 32px !important;
    white-space: normal !important;
    letter-spacing: -0.02em !important;
  }
  .hero .lead {
    font-size: 16px !important;
    white-space: normal !important;
  }
  .hero .cta-row { flex-direction: column; gap: var(--space-sm); }
  .hero .cta-row .btn { width: 100%; text-align: center; }
  .hero-stats-row { gap: var(--space-md); }

  /* Poles grid */
  .poles-grid { grid-template-columns: 1fr; }

  /* Sections */
  section { padding: var(--space-2xl) 0; }
  .page-hero { padding: 80px 0 40px; min-height: auto; }
  .page-hero h1 { font-size: 28px !important; }

  /* Footer */
  .site-footer .footer-grid { grid-template-columns: 1fr; }
  .site-footer .groupe-list { flex-direction: column; gap: var(--space-sm); }

  /* Articles */
  .actu-featured { padding: var(--space-lg); }
  .actu-featured .side-stats { padding-left: 0; border-left: 0; padding-top: var(--space-md); border-top: 1px solid rgba(255,255,255,0.18); }
  .article-body { font-size: 15px; }

  /* Contact */
  .contact-split { grid-template-columns: 1fr; }

  /* KPI row */
  .article-kpi-row { grid-template-columns: 1fr; }
  .article-kpi-row .kpi-cell { border-right: 0; border-bottom: 1px solid var(--cd-gris-clair); }
  .article-kpi-row .kpi-cell:last-child { border-bottom: 0; }

  /* CTA buttons full-width */
  .btn { width: 100%; text-align: center; box-sizing: border-box; }

  /* Prevent horizontal overflow */
  body { overflow-x: hidden; }
  img, svg, table, pre, code { max-width: 100%; }

  /* Press items */
  .press-item h3 { font-size: 17px; }
  .press-meta { gap: 8px; }

  /* Glossaire */
  .glossaire-grid { grid-template-columns: 1fr; }

  /* Tables */
  .kpi-band { grid-template-columns: 1fr 1fr; }
  .score-block .big { font-size: 48px; }

  /* Recrutement */
  .poste-row { grid-template-columns: 1fr; gap: var(--space-sm); }
  .poste-num { padding-left: 0; }
}
.poste-row {
  display: grid;
  grid-template-columns: 70px 1fr auto;
  gap: var(--space-lg);
  align-items: center;
  padding: var(--space-lg) 0;
  border-bottom: 1px solid var(--cd-gris-clair);
  transition: background 160ms ease;
}
.poste-row:hover { background: var(--cd-blanc-casse); }
.poste-num {
  font-family: var(--cd-font-serif);
  font-size: 28px;
  color: var(--cd-corail);
  font-weight: 500;
  font-variant-numeric: lining-nums tabular-nums;
  padding-left: var(--space-md);
}
.poste-body { padding: 0 var(--space-md); }
.poste-tag {
  font-family: var(--cd-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cd-gris-moyen);
  font-weight: 600;
  margin-bottom: 6px;
}
.poste-body h3 {
  font-size: 19px;
  margin-bottom: 6px;
  line-height: 1.25;
}
.poste-body p {
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--cd-anthracite);
  max-width: 70ch;
  margin: 0;
}
.poste-cta {
  font-family: var(--cd-font-sans);
  font-size: 13px;
  font-weight: 500;
  color: var(--cd-marine);
  border: 1px solid var(--cd-gris-clair);
  padding: 9px 16px;
  border-radius: 6px;
  text-decoration: none;
  white-space: nowrap;
  transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
}
.poste-cta:hover {
  background: var(--cd-marine);
  color: var(--cd-blanc);
  border-color: var(--cd-marine);
}

@media (max-width: 1024px) {
  .poste-row {
    grid-template-columns: 50px 1fr;
    gap: var(--space-md);
  }
  .poste-cta { grid-column: 2 / -1; justify-self: start; margin-top: 8px; }
  .poste-body { padding: 0; }
}

/* Glossary product links on pole pages */
.product-card { display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:var(--cd-blanc-casse);border-radius:6px;text-decoration:none;color:var(--cd-marine);font-size:14px;font-weight:500;transition:background .15s,transform .1s }
.product-card:hover{background:var(--cd-blanc);box-shadow:0 2px 8px rgba(0,0,0,.05);transform:translateY(-1px)}
.product-card .arrow{color:var(--cd-corail);font-size:14px;transition:transform .15s}
.product-card:hover .arrow{transform:translateX(3px)}

/* Clickable service cards linking to glossary */
.service-link { text-decoration: none; color: inherit; display: block; }
.service-link .service { transition: box-shadow .2s, transform .15s; cursor: pointer; }
.service-link:hover .service { box-shadow: 0 4px 16px rgba(11,28,77,.1); transform: translateY(-2px); }
.service-link:hover .service h3 { color: var(--cd-corail); }

/* CTA link inside service cards */
.service-cta { display:block;margin-top:16px;font-size:13px;font-weight:500;color:var(--cd-corail);text-decoration:none }
.service:hover { box-shadow: 0 3px 12px rgba(11,28,77,.08) }
.service:hover h3 { color: var(--cd-corail) }

/* Service cards grid - standard 3x2 */
.services-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-md) }
@media (max-width:720px) { .services-grid { grid-template-columns:1fr } }

/* ============ Mobile responsiveness fixes (audit 2026-07) ============ */
/* Guard against sub-pixel/absolute-element horizontal gaps on mobile */
@media (max-width: 1024px) {
  html, body { overflow-x: hidden; overflow-x: clip; }
}

/* 4-column KPI band (qui-sommes-nous) — collapses like the base .kpi-band */
.kpi-band--4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1024px) { .kpi-band--4 { grid-template-columns: 1fr 1fr; gap: var(--space-lg); } }
@media (max-width: 480px)  { .kpi-band--4 { grid-template-columns: 1fr 1fr; } }

/* Web museum cards (qui-sommes-nous) — auto-fit instead of fixed 4 cols + min-width */
.web-museum-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  gap: 20px;
}

/* 4-step timeline on pôle pages */
.timeline-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; }
@media (max-width: 1024px) { .timeline-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-xl); } }
@media (max-width: 720px)  { .timeline-grid { grid-template-columns: 1fr; } }

/* 3-perk grid (recrutement) */
.perks-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; }
@media (max-width: 1024px) { .perks-grid { grid-template-columns: 1fr; } }

/* Generic asymmetric 2-col splits that must stack on mobile */
.split-2col { display: grid; grid-template-columns: 1fr 1.4fr; gap: var(--space-4xl); align-items: start; }
.split-2col--eq { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3xl); align-items: center; }
.split-pub { display: grid; grid-template-columns: 1fr 1.35fr; gap: 0; }
@media (max-width: 1024px) {
  .split-2col, .split-2col--eq { grid-template-columns: 1fr; gap: var(--space-2xl); }
  .split-pub { grid-template-columns: 1fr; }
}

/* Comparison table (pourquoi-nous) — allow swipe instead of overflowing the page */
@media (max-width: 720px) {
  .pq-table { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .pq-trow { min-width: 560px; }
}

/* Data tables — swipe horizontally on small screens instead of widening the page */
@media (max-width: 720px) {
  .article-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; white-space: nowrap; }
}

/* "Notre organisation" animated stage (pourquoi-nous) — absolute cards extend to
   ~720px inside the stage; clip and rescale so they never widen the page */
@media (max-width: 900px) { .cdeq { overflow: hidden; } }
@media (max-width: 520px) {
  .cdeq-stage { transform: scale(0.48); transform-origin: top left; min-height: 290px; }
}

/* 3-col variant of services grid (pôle pages) — was an inline style that
   defeated the mobile media queries */
.services-grid--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1024px) { .services-grid--3 { grid-template-columns: 1fr; } }

/* 5-step timeline (pôle mobilité) */
.timeline-grid--5 { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 1024px) { .timeline-grid--5 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 720px)  { .timeline-grid--5 { grid-template-columns: 1fr; } }

/* Header brand must be able to shrink on very narrow screens (≤360px)
   so the hamburger stays inside the viewport */
@media (max-width: 480px) {
  .site-header .brand { flex-shrink: 1; min-width: 0; overflow: hidden; }
  .site-header .brand img { max-width: 100%; height: auto; max-height: 28px; }
}

/* Nowrap subtitles must wrap on mobile */
@media (max-width: 720px) { .h2-sub { white-space: normal !important; } }

/* Contact panels: reduce padding + allow shrinking on small screens */
@media (max-width: 480px) {
  .contact-left, .contact-right { padding: var(--space-2xl) var(--gutter); min-width: 0; }
  .contact-split > * { min-width: 0; }
}

/* Engagement banner (pôle protection sociale) + similar 1fr/auto rows: stack on mobile */
@media (max-width: 720px) {
  .engagement-banner { grid-template-columns: 1fr !important; }
  .engagement-banner a { white-space: normal !important; justify-self: start; }
}