/*
Theme Name: Pôle de Formation Pasteur
Theme URI: https://cfpast.wait.lu
Author: wait: agency
Author URI: https://wait.agency
Description: Thème sur-mesure pour le Pôle de Formation Pasteur
Version: 3.09.74
License: GNU General Public License v2 or later
Text Domain: pole-pasteur
*/

/* Google Fonts chargées via <link> dans header.php */

/* ============================================================
   CSS CUSTOM PROPERTIES
============================================================ */
:root {
  /* Dark palette */
  --color-bg:            #080717;
  --color-bg-soft:       #0E0D20;
  --color-surface:       #161528;
  --color-surface-2:     #1E1D30;

  /* Teal accent */
  --color-accent:        #7BE0D6;
  --color-green:         #41EB82;   /* vert CTA / nav indicator */
  --color-text-dark:     #0D1F29;   /* texte sur fond clair */
  --color-accent-dark:   #4EC4B8;
  --color-accent-light:  rgba(123,224,214,.12);

  /* Text on dark */
  --color-text:          #FFFFFF;
  --color-text-muted:    rgba(255,255,255,.55);
  --color-text-light:    rgba(255,255,255,.30);

  /* Light sections (formations, actualités…) */
  --color-light-bg:      #F5F7FA;
  --color-light-surface: #FFFFFF;
  --color-light-text:    #080717;
  --color-light-muted:   #5A6C7A;
  --color-light-border:  #E5E7EB;

  /* Compat aliases */
  --color-primary:       #080717;
  --color-primary-dark:  #07111A;
  --color-primary-light: #1A3040;
  --color-border:        rgba(255,255,255,.08);

  --font-heading: 'Space Grotesk', system-ui, -apple-system, sans-serif;
  --font-body:    'Inter',  system-ui, -apple-system, sans-serif;

  --radius-sm:  6px;
  --radius-md:  12px;
  --radius-lg:  20px;
  --radius-xl:  40px;
  --radius-pill:999px;

  --shadow-sm:  0 1px 3px rgba(0,0,0,.2);
  --shadow-md:  0 4px 16px rgba(0,0,0,.3);
  --shadow-lg:  0 10px 40px rgba(0,0,0,.4);
  --shadow-xl:  0 20px 60px rgba(0,0,0,.5);

  --transition:      .25s cubic-bezier(.4,0,.2,1);
  --transition-slow: .4s  cubic-bezier(.4,0,.2,1);

  --container:        1440px;
  --container-narrow: 800px;
  --header-height:    72px;
  --topbar-height:    36px;

  /* Misc helpers */
  --color-bg-blue:    #0D1F45;
  --color-success:    #10B981;
}

/* ============================================================
   RESET & BASE
============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  font-size: 16px;
}

body {
  font-family:            var(--font-body);
  color:                  var(--color-text);
  background:             var(--color-bg);
  line-height:            1.65;
  -webkit-font-smoothing: antialiased;
  overflow-x:             hidden;
  min-width:              320px;
}

img, video { max-width: 100%; height: auto; display: block; }
a         { color: inherit; text-decoration: none; }
button    { cursor: pointer; border: none; background: none; font-family: inherit; }
ul, ol    { list-style: none; }
input, textarea, select { font-family: inherit; }

/* ============================================================
   TYPOGRAPHY
============================================================ */
h1,h2,h3,h4,h5,h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.15;
  color: var(--color-text);
}

h1 { font-size: clamp(1.9rem, 3vw, 2.6rem); }
h2 { font-size: clamp(1.6rem, 2.8vw, 2.2rem); }
h3 { font-size: clamp(1.1rem, 1.8vw, 1.35rem); }
h4 { font-size: 1.25rem; }

p { margin-bottom: 1rem; }
p:last-child { margin-bottom: 0; }
strong { font-weight: 600; }

/* Dark headings inside light sections */
.section-light h2,
.section-light h3,
.section-light h4 { color: var(--color-light-text); }

/* ============================================================
   LAYOUT
============================================================ */
.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
}
.container-narrow {
  max-width: var(--container-narrow);
  margin: 0 auto;
  padding: 0 32px;
}

.section       { padding: 64px 0; }
.section-sm    { padding: 40px 0; }
.section-lg    { padding: 96px 0; }
.section-light { background: var(--color-light-bg); color: var(--color-light-text); }
.section-light p, .section-light li { color: var(--color-light-muted); }

.section-header { text-align: center; margin-bottom: 40px; }
.section-header .label {
  display: inline-block;
  font-family: var(--font-heading);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--color-accent);
  background: var(--color-accent-light);
  padding: 6px 14px;
  border-radius: var(--radius-pill);
  margin-bottom: 16px;
}
.section-header h2 { margin-bottom: 16px; }
.section-header p  { color: var(--color-text-muted); font-size: 1.1rem; }
.section-light .section-header p { color: var(--color-light-muted); }

/* ============================================================
   ACCESSIBILITY
============================================================ */
.hidden { display: none !important; }
.sr-only {
  position: absolute; width: 1px; height: 1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap;
}

/* ============================================================
   BUTTONS
============================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: .95rem;
  padding: 13px 28px;
  border-radius: var(--radius-pill);
  transition: var(--transition);
  white-space: nowrap;
  cursor: pointer;
  border: 2px solid transparent;
}

/* Mint solid (Candidater) */
.btn-accent {
  background: var(--color-accent);
  color: var(--color-bg);
  border-color: var(--color-accent);
}
.btn-accent:hover {
  background: var(--color-accent-dark);
  border-color: var(--color-accent-dark);
}
/* Green variant — Figma centres CTA #41EB82 */
.btn-accent-green {
  background: #41EB82;
  color: #0D1F29;
  border-color: #41EB82;
}
.btn-accent-green:hover {
  background: #2fd470;
  border-color: #2fd470;
  
  
}

/* Mint outline */
.btn-outline-accent {
  background: transparent;
  color: #41EB82;
  border-color: #41EB82;
}
.btn-outline-accent:hover {
  background: #41EB82;
  color: #080717;
}

/* Light blue solid — Figma: #c5e1f3 */
.btn-light-blue {
  background: #c5e1f3;
  color: #0d1f29;
  border-color: #c5e1f3;
}
.btn-light-blue:hover {
  background: #aad0ea;
  border-color: #aad0ea;
}

/* White solid */
.btn-white {
  background: #fff;
  color: var(--color-bg);
  border-color: #fff;
}
.btn-white:hover { background: rgba(255,255,255,.9); }


.btn-sm  { padding: 9px 20px;  font-size: .875rem; }
.btn-lg  { padding: 16px 36px; font-size: 1.05rem; }

/* ============================================================
   TOP BAR
============================================================ */
.top-bar {
  position: relative;
  z-index: 1002; /* au-dessus du header (1000) et du hero (1/2) */
  background: var(--color-bg-soft);
  height: var(--topbar-height);
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--color-border);
}
.top-bar .container {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 24px;
}
.top-bar a {
  font-size: .8rem;
  font-family: var(--font-heading);
  font-weight: 500;
  color: var(--color-text-muted);
  transition: color var(--transition);
  display: flex;
  align-items: center;
  gap: 4px;
}
.top-bar a:hover { color: var(--color-accent); }
.top-bar a .ext-icon { width: 18px; height: 18px; flex-shrink: 0; opacity: .6; }

/* ============================================================
   HEADER
============================================================ */
.site-header {
  position: relative;
  z-index: 1000;
  background: var(--color-bg);
  height: var(--header-height);
  display: flex;
  align-items: center;
}

/* Compatibilité barre admin WordPress (décale le sticky sous la barre fixe de 32px) */
.admin-bar .mobile-nav  { top: calc(var(--wp-admin--admin-bar--height, 32px) + var(--topbar-height) + var(--header-height)); }
/* Pages fond sombre : header + top-bar transparents (texte blanc) */
.home .site-header,
.post-type-archive-formation .site-header,
.single-formation .site-header,
.page-template-template-alternance .site-header,
.page-template-template-le-pole .site-header,
.page-template-template-mentions-legales .site-header,
.page-formation-continue .site-header,
.tax-domaine .site-header,
.error404 .site-header {
  background: transparent;
  box-shadow: none;
}
.home .top-bar,
.post-type-archive-formation .top-bar,
.single-formation .top-bar,
.page-template-template-alternance .top-bar,
.page-template-template-le-pole .top-bar,
.page-template-template-mentions-legales .top-bar,
.page-formation-continue .top-bar,
.tax-domaine .top-bar,
.error404 .top-bar {
  background: transparent;
  border-bottom-color: transparent;
}
.home .top-bar a,
.post-type-archive-formation .top-bar a,
.single-formation .top-bar a,
.page-template-template-alternance .top-bar a,
.page-template-template-le-pole .top-bar a,
.page-template-template-mentions-legales .top-bar a,
.page-formation-continue .top-bar a,
.tax-domaine .top-bar a,
.error404 .top-bar a { color: rgba(255,255,255,0.85); }
.home .top-bar a:hover,
.post-type-archive-formation .top-bar a:hover,
.single-formation .top-bar a:hover,
.page-template-template-alternance .top-bar a:hover,
.page-template-template-le-pole .top-bar a:hover,
.page-template-template-mentions-legales .top-bar a:hover,
.page-formation-continue .top-bar a:hover,
.tax-domaine .top-bar a:hover,
.error404 .top-bar a:hover { color: #fff; }
.home .top-bar .ext-icon,
.post-type-archive-formation .top-bar .ext-icon,
.single-formation .top-bar .ext-icon,
.page-template-template-alternance .top-bar .ext-icon,
.page-template-template-le-pole .top-bar .ext-icon,
.page-template-template-mentions-legales .top-bar .ext-icon,
.page-formation-continue .top-bar .ext-icon,
.tax-domaine .top-bar .ext-icon,
.error404 .top-bar .ext-icon { opacity: 1; }

/* Pages fond clair : header + top-bar transparents (texte sombre) */
.page-template-template-contact .site-header,
.post-type-archive-centre .site-header,
.post-type-archive-offre .site-header,
.single-offre .site-header,
.single-centre .site-header,
.page-template-page-candidater .site-header,
.page-template-template-faq .site-header,
.page-template-template-vie-etudiante .site-header,
.post-type-archive-rejoindre .site-header,
.single-rejoindre .site-header,
.page-template-page-rechercher .site-header,
.post-type-archive-actualite .site-header,
.single-actualite .site-header {
  background: transparent;
  box-shadow: none;
}
.page-template-template-contact .top-bar,
.post-type-archive-centre .top-bar,
.post-type-archive-offre .top-bar,
.single-offre .top-bar,
.single-centre .top-bar,
.page-template-page-candidater .top-bar,
.page-template-template-faq .top-bar,
.page-template-template-vie-etudiante .top-bar,
.post-type-archive-rejoindre .top-bar,
.single-rejoindre .top-bar,
.page-template-page-rechercher .top-bar,
.post-type-archive-actualite .top-bar,
.single-actualite .top-bar {
  background: transparent;
  border-bottom-color: transparent;
}
.page-template-template-contact .top-bar a,
.post-type-archive-centre .top-bar a,
.post-type-archive-offre .top-bar a,
.single-offre .top-bar a,
.single-centre .top-bar a,
.page-template-page-candidater .top-bar a,
.page-template-template-faq .top-bar a,
.page-template-template-vie-etudiante .top-bar a,
.post-type-archive-rejoindre .top-bar a,
.single-rejoindre .top-bar a,
.page-template-page-rechercher .top-bar a,
.post-type-archive-actualite .top-bar a,
.single-actualite .top-bar a { color: rgba(13,31,41,0.75); }
.page-template-template-contact .top-bar a:hover,
.post-type-archive-centre .top-bar a:hover,
.post-type-archive-offre .top-bar a:hover,
.single-offre .top-bar a:hover,
.single-centre .top-bar a:hover,
.page-template-page-candidater .top-bar a:hover,
.page-template-template-faq .top-bar a:hover,
.page-template-template-vie-etudiante .top-bar a:hover,
.post-type-archive-rejoindre .top-bar a:hover,
.single-rejoindre .top-bar a:hover,
.page-template-page-rechercher .top-bar a:hover,
.post-type-archive-actualite .top-bar a:hover,
.single-actualite .top-bar a:hover { color: #0d1f29; }
.page-template-template-contact .top-bar .ext-icon,
.post-type-archive-centre .top-bar .ext-icon,
.post-type-archive-offre .top-bar .ext-icon,
.single-offre .top-bar .ext-icon,
.single-centre .top-bar .ext-icon,
.page-template-page-candidater .top-bar .ext-icon,
.page-template-template-faq .top-bar .ext-icon,
.page-template-template-vie-etudiante .top-bar .ext-icon,
.post-type-archive-rejoindre .top-bar .ext-icon,
.single-rejoindre .top-bar .ext-icon,
.page-template-page-rechercher .top-bar .ext-icon,
.post-type-archive-actualite .top-bar .ext-icon,
.single-actualite .top-bar .ext-icon { opacity: 0.75; }

/* ============================================================
   PAGE HERO HEADER — structure unifiée toutes pages intérieures
   breadcrumb · h1 · sous-titre — mêmes coordonnées partout
============================================================ */
.ph-header { background: transparent; padding: 40px 0 48px; }
.ph-inner {
  max-width: var(--container);
  padding: 0 80px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
/* ── BREADCRUMB GLOBAL (site-bc) ────────────────────────────── */
.site-bc {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f8f8ff;
  border-radius: 128px;
  padding: 8px 16px;
  margin-bottom: 32px;
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 400;
  color: #0d1f29;
  text-decoration: none;
}
.site-bc a         { color: #0d1f29; text-decoration: none; }
.site-bc a:hover   { opacity: .7; text-decoration: none; }
.site-bc-home      { display: flex; align-items: center; }
.site-bc-sep       { opacity: .45; flex-shrink: 0; color: #0d1f29; }
.site-bc-cur       { font-weight: 600; }
.site-bc-link      { font-weight: 400; }
/* alias rétro-compat (conservé le temps de la migration) */
.ph-bc { display:inline-flex;align-items:center;gap:6px;background:#f8f8ff;border-radius:128px;padding:8px 16px;margin-bottom:32px;font-family:var(--font-heading);font-size:14px;font-weight:400;color:#0d1f29;text-decoration:none; }
.ph-bc a{color:#0d1f29;text-decoration:none;} .ph-bc a:hover{opacity:.7;} .ph-bc-home{display:flex;align-items:center;} .ph-bc-sep{opacity:.45;flex-shrink:0;} .ph-bc-cur{font-weight:600;} .ph-bc-link{font-weight:400;}
/* Titre */
.ph-h1 {
  font-family: var(--font-heading);
  font-size: 48px;
  font-weight: 600;
  line-height: 1.125;
  color: #0d1f29;
  margin: 0 0 16px;
  max-width: 784px;
  text-align: center;
}
/* Sous-titre */
.ph-sub {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.55;
  color: rgba(13,31,41,0.75);
  max-width: 640px;
  margin: 0;
  text-align: center;
}
/* Variante fond sombre (alternance, le-pole, formations) — pill garde son fond clair */
.ph-header--dark .ph-h1,
.ph-inner.ph-header--dark .ph-h1  { color: #fff; }
.ph-header--dark .ph-sub,
.ph-inner.ph-header--dark .ph-sub { color: rgba(255,255,255,0.75); }
/* Responsive */
@media (max-width: 1280px) { .ph-inner { padding: 0 48px; } }
@media (max-width: 1024px) { .ph-inner { padding: 0 32px; } }
@media (max-width: 640px) {
  .ph-header { padding: 28px 0 36px; }
  .ph-inner  { padding: 0 20px; }
  .ph-bc, .site-bc { margin-bottom: 24px; }
  .ph-h1     { font-size: 28px; line-height: 1.2; }
  .ph-sub    { font-size: 16px; }
}
@media (max-width: 480px) { .ph-h1 { font-size: 24px; } }

.site-header .container {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 12px;
}

/* Logo — pousse tout le reste vers la droite */
.logo-svg { display: block; height: 56px; width: auto; }
.site-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  flex-shrink: 0;
  margin-right: auto; /* nav + search + actions restent groupés à droite */
}

/* Nav pill */
.nav-pill {
  display: flex;
  align-items: center;
  gap: 4px;
  background: rgba(255,255,255,.95);
  border-radius: var(--radius-pill);
  padding: 4px;
  list-style: none;
  margin: 0;
}
.nav-pill li { list-style: none; margin: 0; padding: 0; }
.nav-pill a {
  font-family: var(--font-heading);
  font-size: .875rem;
  font-weight: 600;
  color: var(--color-primary);
  padding: 8px 18px;
  border-radius: var(--radius-pill);
  transition: var(--transition);
  display: block;
  white-space: nowrap;
}
.nav-pill a:hover             { background: rgba(0,0,0,.07); }
.nav-pill .current-menu-item > a,
.nav-pill .current-menu-ancestor > a,
.nav-pill .current-menu-parent > a,
.nav-pill .current_page_item > a,
.nav-pill .current_page_ancestor > a,
.nav-pill .current_page_parent > a {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
}
.nav-pill .current-menu-item > a::before,
.nav-pill .current-menu-ancestor > a::before,
.nav-pill .current-menu-parent > a::before,
.nav-pill .current_page_item > a::before,
.nav-pill .current_page_ancestor > a::before,
.nav-pill .current_page_parent > a::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-green);
  flex-shrink: 0;
}
/* ── Bouton Rechercher — pill expandable hors de la nav ── */
.header-search-btn {
  display: flex;
  align-items: center;
  gap: 0;
  height: 48px;               /* aligne avec la hauteur du nav-pill */
  padding: 6px 12px;
  border-radius: var(--radius-pill);
  background: rgba(255,255,255,.95);
  color: var(--color-primary);
  border: none;
  cursor: pointer;
  font-family: var(--font-heading);
  font-size: .875rem;
  font-weight: 600;
  white-space: nowrap;
  flex-shrink: 0;
  transition: gap .35s ease, padding .35s ease, background var(--transition);
}
.header-search-icon {
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.header-search-label {
  max-width: 0;
  opacity: 0;
  overflow: hidden;
  white-space: nowrap;
  transition: max-width .35s ease, opacity .25s ease;
}
.header-search-btn:hover .header-search-label,
.header-search-btn:focus-visible .header-search-label {
  max-width: 130px;
  opacity: 1;
}
.header-search-btn:hover {
  gap: 6px;
  padding: 5px 16px;
}
/* Nav peut se comprimer quand le search btn s'expand */
.main-nav { display: flex; align-items: center; flex-shrink: 1; min-width: 0; }

/* ── Bouton Candidater — vert #41EB82 ── */
.btn-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 20px;
  border-radius: var(--radius-pill);
  font-family: var(--font-heading);
  font-size: .875rem;
  font-weight: 700;
  background: var(--color-green);
  color: var(--color-primary);
  border: 2px solid var(--color-green);
  cursor: pointer;
  text-decoration: none;
  transition: background var(--transition), border-color var(--transition), transform var(--transition);
  white-space: nowrap;
  flex-shrink: 0;
}
.btn-cta:hover { background: #2dd46d; border-color: #2dd46d; }

/* Header actions */
.header-actions { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

/* Burger */
.burger-btn {
  display: none;
  flex-direction: column;
  gap: 5px;
  width: 40px; height: 40px;
  align-items: center; justify-content: center;
  border-radius: var(--radius-sm);
  transition: var(--transition);
}
.burger-btn span {
  display: block;
  width: 22px; height: 2px;
  background: var(--color-text);
  border-radius: 2px;
  transition: var(--transition);
}
.burger-btn.active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger-btn.active span:nth-child(2) { opacity: 0; }
.burger-btn.active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile Nav */
.mobile-nav {
  position: fixed;
  top: calc(var(--topbar-height) + var(--header-height));
  left: 0; right: 0;
  background: var(--color-bg-soft);
  border-bottom: 1px solid var(--color-border);
  padding: 24px 20px;
  /* Recule au-delà du header pour sortir entièrement de l'écran */
  transform: translateY(calc(-100% - var(--topbar-height) - var(--header-height)));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform var(--transition-slow), opacity var(--transition-slow), visibility 0s var(--transition-slow);
  z-index: 999;
}
.mobile-nav.open {
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: transform var(--transition-slow), opacity var(--transition-slow), visibility 0s;
}

/* Header sombre quand menu mobile ouvert (corrige les pages fond clair) */
.site-header { transition: background var(--transition-slow); }
.site-header.menu-open {
  background: var(--color-bg-soft) !important;
}
.site-header.menu-open .logo-svg,
.site-header.menu-open .custom-logo {
  filter: none !important;
}
.mobile-nav .mobile-nav-list { display: flex; flex-direction: column; gap: 4px; margin-bottom: 20px; }
.mobile-nav .mobile-nav-list li { list-style: none; }
.mobile-nav .mobile-nav-list a {
  display: block;
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: 1.1rem;
  color: var(--color-text);
  padding: 12px 0;
  border-bottom: 1px solid var(--color-border);
}
.mobile-nav .mobile-nav-list a:hover { color: var(--color-accent); }

/* ============================================================
   HERO
============================================================ */
.hero {
  position: relative;
  background: var(--color-bg);
  min-height: calc(100vh - var(--topbar-height) - var(--header-height));
  display: flex;
  align-items: center;
  overflow: hidden;
}

/* ── Homepage hero : Figma exact ── */
@keyframes heroFadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: none; }
}
.home .hero {
  margin-top: calc(-1 * (var(--header-height) + var(--topbar-height)));
  min-height: calc(100vh - 220px);
  padding-top: 0;
  align-items: flex-start;
  overflow: visible; /* domains-section z-index:2 s'empile par-dessus */
}
/* Photo : inset:0 conservé, object-position décale l'image
   pour que la tête de l'infirmière soit visible juste sous le header */
.home .hero .hero-content {
  padding-top: calc(var(--header-height) + var(--topbar-height) + 80px);
  padding-bottom: 80px;
  max-width: 580px;
  animation: heroFadeIn .8s ease .1s both;
}

/* Zone texte — aligné à gauche comme le logo, pas de max-width centering */
.hero > .container {
  position: relative;
  z-index: 2;
  /* Même marge gauche que le header/logo, s'étend vers la droite */
  max-width: none;
  width: 100%;
  /* Même départ que le logo : (100vw - 1440px) / 2 + 32px de padding */
  padding-left: max(32px, calc((100vw - 1440px) / 2 + 32px));
  padding-right: 0;
}
.hero-content {
  max-width: 560px;
  padding: 80px 0 40px;
}


.hero h1 {
  /* Figma H1/Desktop — Space Grotesk 600 48px/54px */
  font-family: 'Space Grotesk', sans-serif;
  font-size: 48px;
  font-weight: 600;
  line-height: 54px;
  color: #EAEFF3;
  margin-bottom: 20px;
  letter-spacing: 0;
}
.hero h1 span { color: var(--color-accent); }

.hero-subtitle {
  /* Figma H4/Desktop — Space Grotesk 600 22px/28px */
  font-family: 'Space Grotesk', sans-serif;
  font-size: 22px;
  font-weight: 600;
  line-height: 28px;
  color: #FFFFFF;
  margin-bottom: 36px;
  max-width: 520px;
}

.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }

/* Bouton hero — Figma exact : fond teal plein, texte sombre */
.btn-hero-cta {
  display:         inline-flex;
  justify-content: center;
  align-items:     center;
  gap:             8px;
  padding:         14px 24px;
  border-radius:   200px;
  background:      #7BE0D6;
  color:           #080717;
  font-family:     'Space Grotesk', sans-serif;
  font-weight:     600;
  font-size:       1rem;
  line-height:     1;
  border:          none;
  text-decoration: none;
  transition:      background var(--transition), transform var(--transition);
  white-space:     nowrap;
}
.btn-hero-cta:hover {
  background:  #4EC4B8;
  
}

/* Photo plein-format — la nurse est cadrée à droite via object-position
   Le dégradé gauche très fort crée la zone sombre pour le texte */
.hero-photo-wrap {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}
.hero-photo {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: 70% top;
}
/* Homepage : photo plein-format depuis le haut de la page (derrière le header) */
/* Dégradé gauche opaque → zone texte bien lisible, comme dans le Figma */
.hero-photo-gradient {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    rgba(8,7,23,1)    0%,
    rgba(8,7,23,0.98) 20%,
    rgba(8,7,23,0.85) 38%,
    rgba(8,7,23,0.50) 52%,
    rgba(8,7,23,0.15) 68%,
    transparent       82%
  );
}
/* Fondu bas → transition vers la section domaines */
.hero-photo-gradient-bottom {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 180px;
  background: linear-gradient(to top, var(--color-bg) 0%, transparent 100%);
}

/* ============================================================
   DOMAIN CAROUSEL
============================================================ */
.domains-section {
  background: transparent; /* photo hero visible derrière les cards */
  position: relative;
  z-index: 2; /* au-dessus du hero-photo-wrap (z-index:1) → cards visibles */
  padding: 0 0 80px;
}
.domains-section .section-intro {
  max-width: 600px;
  padding: 60px 0 40px;
}
.domains-section .section-intro .label {
  display: inline-block;
  font-family: var(--font-heading);
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--color-accent);
  background: var(--color-accent-light);
  padding: 6px 14px;
  border-radius: var(--radius-pill);
  margin-bottom: 14px;
}
.domains-section .section-intro h2 {
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  color: #fff;
  margin-bottom: 0;
}

.carousel-outer {
  position: relative;
  overflow: hidden;
}
.carousel-track {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding: 0 60px 0 0;
  /* snap chaque card au même bord gauche que le container */
  scroll-padding-left: max(32px, calc((100vw - 1440px) / 2 + 32px));
  cursor: grab;
  scrollbar-width: none;
}
.carousel-track::-webkit-scrollbar { display: none; }
.carousel-track.grabbing { cursor: grabbing; }

/* Spacer universel — aligne le 1er élément avec le container (logo, titres)
   flex:none + width car max() dans flex shorthand est mal supporté */
.track-offset {
  flex: none;
  width: max(32px, calc((100vw - 1440px) / 2 + 32px));
  scroll-snap-align: none !important;
  pointer-events: none;
}

/* Domain image card
   Desktop (≥1024px): toujours 4 + 1/6 cards visibles, alignées avec le container
   Formule: W = (viewport - padding-left - 4×gap) × 6/25
   La hauteur est dérivée de l'aspect-ratio Figma 94/167
*/
.domain-img-card {
  /* Mobile par défaut : ~1.5 cards (W+gap+0.5W → W=(vw-32-20)×2/3) */
  flex: 0 0 calc((100vw - 52px) * 2 / 3);
  height: auto;
  aspect-ratio: 94 / 167;
  border-radius: var(--radius-lg);
  overflow: hidden;
  position: relative;
  scroll-snap-align: start;
  flex-shrink: 0;
  transition: transform var(--transition);
  text-decoration: none;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
}
@media (min-width: 600px) {
  /* Tablette : ~2.5 cards */
  .domain-img-card { flex-basis: calc((100vw - 72px) * 2 / 5); }
}
@media (min-width: 1024px) {
  /* Desktop : exactement 4 + 1/6 cards, alignées avec le logo */
  .domain-img-card {
    /* --_pad = max(32px, (100vw-1440px)/2+32px) — left offset = container edge */
    /* W = (100vw - _pad - 4×gap) × 6/25 */
    flex-basis: calc(
      (100vw - max(32px, calc((100vw - 1440px) / 2 + 32px)) - 80px) * 6 / 25
    );
  }
}
.domain-img-card:hover { transform: none; }

/* Image statique — z-index 1, disparaît au hover si vidéo présente */
.domain-card-img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 1;
  transition: opacity .45s ease;
}
.domain-img-card:hover .domain-card-img { transform: none; }
.domain-img-card.has-video:hover .domain-card-img { opacity: 0; }

/* Vidéo — z-index 0, monte en opacité au hover */
.domain-card-video {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
  opacity: 0;
  transition: opacity .45s ease;
}
.domain-img-card.has-video:hover .domain-card-video { opacity: 1; }
.domain-img-card-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(
    to top,
    rgba(7,17,26,.9) 0%,
    rgba(7,17,26,.4) 50%,
    transparent 100%
  );
}
.domain-img-card-body {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 24px;
  z-index: 3;
  background: linear-gradient(to top, rgba(8,7,23,.85) 0%, rgba(8,7,23,.4) 60%, transparent 100%);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.domain-img-card-body h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
}
.domain-img-card-body p {
  font-size: .85rem;
  color: rgba(255,255,255,.7);
  margin-bottom: 0;
}

.carousel-btn {
  width: 52px; height: 52px;
  border-radius: 50%;
  background: rgba(255,255,255,.12);
  color: rgba(255,255,255,.35);
  display: flex; align-items: center; justify-content: center;
  border: none;
  cursor: pointer;
  transition: var(--transition);
  font-size: 1.2rem;
}
.carousel-btn:hover { opacity: .85; transform: scale(1.05); }
.carousel-btn:disabled { background: rgba(255,255,255,.08); color: rgba(255,255,255,.2); cursor: not-allowed; transform: none; }

/* Bouton expandable avec label (carousel domaines) */
.carousel-btn-lbl {
  width: auto;
  min-width: 52px;
  height: 52px;
  border-radius: 9999px;
  padding: 0 16px;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  background: rgba(255,255,255,.12);
  color: rgba(255,255,255,.35);
  transition: background .25s, color .25s, transform .2s;
}
/* Actif = couleur accent (classe JS) */
.carousel-btn-lbl.cbtn-active {
  background: var(--color-accent);
  color: var(--color-bg);
}
.carousel-btn-lbl.cbtn-active:hover { background: var(--color-accent-dark); transform: scale(1.02); }
/* Au bout = #DEF7F5 (classe JS) */
.carousel-btn-lbl.cbtn-limit {
  background: #F8FBFE;
  color: rgba(8,7,23,.35);
  cursor: not-allowed;
  transform: none !important;
  pointer-events: none; /* désactive aussi le hover label */
}
/* Label caché par défaut, révélé au hover */
.cbtn-label {
  display: block;
  max-width: 0;
  overflow: hidden;
  white-space: nowrap;
  font-size: .875rem;
  font-weight: 600;
  opacity: 0;
  padding: 0;
  transition: max-width .3s ease, opacity .25s ease, padding .3s ease;
}
.carousel-btn-lbl:not(:disabled):hover .cbtn-label {
  max-width: 110px;
  opacity: 1;
  padding: 0 6px;
}

/* Jauge de progression */
.carousel-progress-wrap {
  width: 100%;
  height: 3px;
  background: rgba(255,255,255,.12);
  border-radius: 2px;
  margin-top: 14px;
  overflow: hidden;
}
.carousel-progress-bar {
  height: 100%;
  background: var(--color-accent);
  border-radius: 2px;
  width: 0%;
  transition: width .15s ease;
}

/* ============================================================
   STATS BAND — 5 icon cards
============================================================ */
.stats-band {
  background: #080717;
  padding: 40px 0 56px;
}
.stats-band .container {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
}
.keystat-card {
  padding: 32px 24px;
  text-align: left;
  border-radius: 16px;
  background: #ffffff;
  border: none;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.keystat-card:last-child { border-right: none; }
.keystat-qualiopi-logo {
  max-width: 180px;
  width: 100%;
  height: auto;
  display: block;
  margin-top: 2px;
  align-self: center;
}
.keystat-icon {
  width: 60px; height: 60px;
  border-radius: 8px;
  background: #E2F0F9;
  color: #0D1F29;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-bottom: 4px;
  transition: transform var(--transition);
}
.keystat-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
  text-align: left;
}
/* .keystat-card:hover .keystat-icon — zoom retiré */
.keystat-num {
  font-family: var(--font-heading);
  font-size: clamp(1rem, 1.4vw, 1.375rem);
  font-weight: 700;
  color: #0D1F29;
  line-height: 1.2;
}
.keystat-label {
  font-size: clamp(.8rem, .9vw, 1rem);
  color: #0D1F29;
  font-weight: 400;
  line-height: 1.4;
  max-width: 180px;
}

/* ============================================================
   FORMATIONS GRID (light section)
============================================================ */
.formations-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.formation-card {
  background: var(--color-light-surface);
  border: 1px solid var(--color-light-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: var(--transition);
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
}
.formation-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
}
.formation-card-thumb,
.formation-card-img {
  width: 100%; aspect-ratio: 16/9;
  background: var(--color-light-bg);
  overflow: hidden;
  position: relative;
}
.formation-card-thumb img,
.formation-card-img img { width: 100%; height: 100%; object-fit: cover; }
.formation-card-domain {
  position: absolute;
  top: 12px; left: 12px;
  background: var(--color-accent);
  color: var(--color-bg);
  font-size: .7rem;
  font-weight: 700;
  font-family: var(--font-heading);
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: var(--radius-pill);
}
.formation-card-body {
  padding: 20px 24px 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.formation-card-body h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-light-text);
  margin-bottom: 8px;
  line-height: 1.3;
}
.formation-card-body p {
  font-size: .85rem;
  color: var(--color-light-muted);
  margin-bottom: 16px;
  flex: 1;
}
.formation-card-meta {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.formation-card-meta span {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: .8rem;
  color: var(--color-light-muted);
}

/* ============================================================
   FILTER BAR
============================================================ */
.filter-bar {
  background: var(--color-light-surface);
  border: 1px solid var(--color-light-border);
  border-radius: var(--radius-lg);
  padding: 20px 24px;
  display: flex;
  align-items: flex-end;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}
.filter-group { flex: 1; min-width: 180px; }
.filter-group label {
  display: block;
  font-size: .8rem;
  font-weight: 600;
  font-family: var(--font-heading);
  color: var(--color-light-muted);
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.filter-group select,
.filter-group input {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--color-light-border);
  border-radius: var(--radius-md);
  font-size: .9rem;
  background: var(--color-light-bg);
  color: var(--color-light-text);
  transition: var(--transition);
}
.filter-group select:focus,
.filter-group input:focus {
  outline: none;
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px var(--color-accent-light);
}
#filter-submit {
  background: var(--color-accent);
  color: var(--color-bg);
  border: none;
  padding: 11px 24px;
  border-radius: var(--radius-md);
  font-family: var(--font-heading);
  font-weight: 600;
  font-size: .9rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: var(--transition);
  white-space: nowrap;
}
#filter-submit:hover { background: var(--color-accent-dark); }
.spinner {
  width: 16px; height: 16px;
  border: 2px solid rgba(0,0,0,.2);
  border-top-color: var(--color-bg);
  border-radius: 50%;
  animation: spin .6s linear infinite;
  display: inline-block;
}
@keyframes spin { to { transform: rotate(360deg); } }

#results-count { font-size: .9rem; color: var(--color-light-muted); margin-bottom: 20px; }

/* Pagination */
.pagination-wrapper, #ajax-pagination {
  display: flex; justify-content: center; gap: 8px; margin-top: 48px;
}
.pagination-btn, .page-numbers {
  width: 42px; height: 42px;
  display: flex; align-items: center; justify-content: center;
  border-radius: var(--radius-sm);
  font-family: var(--font-heading);
  font-size: .9rem;
  font-weight: 600;
  border: 1px solid var(--color-light-border);
  color: var(--color-light-text);
  background: var(--color-light-surface);
  cursor: pointer;
  transition: var(--transition);
}
.pagination-btn:hover, .page-numbers:hover { border-color: var(--color-accent); color: var(--color-accent); }
.pagination-btn.current, .page-numbers.current {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: var(--color-bg);
}

/* ============================================================
   CENTRES GRID
============================================================ */
.centres-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.centre-card {
  background: var(--color-light-surface);
  border: 1px solid var(--color-light-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: var(--transition);
  text-decoration: none;
  color: inherit;
}
.centre-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }
.centre-card-map,
.centre-card-img { height: 180px; background: var(--color-light-bg); position: relative; overflow: hidden; }
.centre-card-map img,
.centre-card-img img { width: 100%; height: 100%; object-fit: cover; }
.centre-card-body { padding: 20px 24px; }
.centre-card-body h3 { font-size: 1rem; color: var(--color-light-text); margin-bottom: 6px; }
.centre-card-body p { font-size: .85rem; color: var(--color-light-muted); }

/* ============================================================
   ACTUALITÉS — grille 4 colonnes (Figma pixel-perfect)
============================================================ */
.actus-section {
  background: #ffffff;
  padding: 64px 0;
}
.actus-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 32px;
}
.actus-header h2 {
  margin: 0;
  font-size: 2.25rem;
  font-weight: 600;
  color: #0d1f29;
  line-height: 1.2;
}



@media (max-width: 768px) {
  .actus-section { padding: 32px 0; }
  .actus-header { margin-bottom: 24px; }
}

/* ============================================================
   CTA BANNER
============================================================ */
.cta-banner {
  background: linear-gradient(135deg, var(--color-surface) 0%, var(--color-surface-2) 100%);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: 72px 80px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.cta-banner::before {
  content: '';
  position: absolute;
  top: -60px; right: -60px;
  width: 240px; height: 240px;
  background: radial-gradient(circle, rgba(0,229,154,.15) 0%, transparent 70%);
  pointer-events: none;
}
.cta-banner h2 { color: #fff; margin-bottom: 16px; }
.cta-banner p { color: var(--color-text-muted); margin-bottom: 36px; font-size: 1.1rem; }
.cta-banner .btn-group { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* ============================================================
   SINGLE FORMATION — TABS
============================================================ */
.tabs {
  border-bottom: 1px solid rgba(255,255,255,.1);
  display: flex;
  gap: 0;
  margin-bottom: 40px;
  overflow-x: auto;
}
.section-light .tabs { border-bottom-color: var(--color-light-border); }
.tab-btn {
  font-family: var(--font-heading);
  font-size: .9rem;
  font-weight: 600;
  color: var(--color-text-muted);
  padding: 14px 24px;
  border-bottom: 3px solid transparent;
  transition: var(--transition);
  white-space: nowrap;
  background: none;
  border-left: none; border-right: none; border-top: none;
  cursor: pointer;
}
.section-light .tab-btn { color: var(--color-light-muted); }
.tab-btn.active, .tab-btn:hover { color: var(--color-accent); border-bottom-color: var(--color-accent); }
.tab-panel { display: none; }
.tab-panel.active { display: block; }

/* Formation sidebar */
.formation-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 40px;
  align-items: start;
}
.formation-sidebar {
  position: sticky;
  top: calc(var(--topbar-height) + var(--header-height) + 24px);
}
.formation-sidebar .price {
  font-family: var(--font-heading);
  font-size: 2rem;
  font-weight: 800;
  color: var(--color-light-text);
  margin-bottom: 8px;
}
.formation-sidebar .price-note { font-size: .85rem; color: var(--color-light-muted); margin-bottom: 24px; }
.formation-sidebar .btn { width: 100%; justify-content: center; margin-bottom: 12px; }
.formation-meta-list { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.formation-meta-list li {
  display: flex; align-items: center; gap: 10px;
  font-size: .875rem; color: var(--color-light-muted);
}
.formation-meta-list li svg { flex-shrink: 0; color: var(--color-accent); }

/* ============================================================
   CONTACT FORM
============================================================ */
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-group { display: flex; flex-direction: column; gap: 6px; }
.form-group.full { grid-column: 1/-1; }
.form-group label { font-size: .85rem; font-weight: 600; font-family: var(--font-heading); color: var(--color-light-muted); }
.form-group input,
.form-group select,
.form-group textarea {
  padding: 12px 16px;
  border: 1.5px solid var(--color-light-border);
  border-radius: var(--radius-md);
  font-size: .95rem;
  background: var(--color-light-bg);
  color: var(--color-light-text);
  transition: var(--transition);
  resize: vertical;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: none;
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px rgba(0,229,154,.15);
}

/* ============================================================
   PAGE HERO
============================================================ */
.page-hero {
  background: var(--color-bg-soft);
  padding: 64px 0 56px;
  border-bottom: 1px solid var(--color-border);
}
.page-hero h1 { color: #fff; margin-bottom: 0; }
.page-hero .subtitle { color: var(--color-text-muted); margin-top: 12px; }

/* ============================================================
   ALTERNANCE PAGE — Steps & Grid
============================================================ */
.alternance-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.step-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  position: relative;
}
.step-number {
  width: 44px; height: 44px;
  background: var(--color-accent);
  color: var(--color-bg);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 1.1rem;
  font-family: var(--font-heading);
  margin-bottom: 20px;
}
.step-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; }

/* Avantages 6-grid */
.avantages-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* CTA banner actions flex wrapper */
.cta-banner-actions { display: flex; gap: 12px; flex-wrap: wrap; }

@media (max-width: 1024px) {
  .alternance-steps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .alternance-steps { grid-template-columns: 1fr; }
  .avantages-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   CONTACT PAGE
============================================================ */
.contact-layout {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 64px;
  align-items: start;
}
.contact-info-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  padding: 40px;
}
.contact-info-card h3 {
  font-size: 1.2rem;
  margin-bottom: 28px;
  color: #fff;
}
.contact-item {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 16px 0;
  border-bottom: 1px solid var(--color-border);
}
.contact-item:last-child { border-bottom: none; }
.contact-item svg { flex-shrink: 0; color: var(--color-accent); margin-top: 2px; }
.contact-item strong { display: block; font-size: .85rem; font-weight: 600; color: var(--color-text-muted); margin-bottom: 4px; }
.contact-item p, .contact-item a { color: #fff; font-size: .95rem; margin: 0; text-decoration: none; }
.contact-item a:hover { color: var(--color-accent); }
.form-note { font-size: .8rem; color: var(--color-text-muted); line-height: 1.5; }

@media (max-width: 1024px) {
  .contact-layout { grid-template-columns: 1fr; gap: 40px; }
}

/* ============================================================
   CONTACT V2 — Figma redesign
============================================================ */
/* ── Header ── */
.ctv2-header {
  background: transparent;
  padding: 40px 0 48px;
  text-align: center;
  position: relative;
}
.ctv2-breadcrumb-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f8f8ff;
  border-radius: 128px;
  padding: 8px 16px;
  margin-bottom: 32px;
  font-size: 0.875rem;
  font-weight: 600;
  color: #0d1f29;
}
.ctv2-bc-sep { opacity: .45; }
.ctv2-header h1 {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 700;
  color: #0d1f29;
  margin: 0 0 16px;
  line-height: 1.125;
  font-family: var(--font-heading);
}
.ctv2-header > p {
  font-size: 1.125rem;
  color: #5a6c7a;
  margin: 0;
}

/* ── Layout ── */
.ctv2-content {
  background: transparent;
  padding: 64px 0;
}
.ctv2-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 160px;
  display: flex;
  gap: 64px;
  align-items: flex-start;
}

/* ── Left column — contact cards ── */
.ctv2-left {
  display: flex;
  flex-direction: column;
  gap: 64px;
  flex-shrink: 0;
  width: 240px;
}
.ctv2-card {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.ctv2-card-icon {
  width: 60px;
  height: 60px;
  background: #f0f8fc;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #2d9cdb;
}
.ctv2-card-text h3 {
  font-size: 1.375rem;
  font-weight: 700;
  color: #0d1f29;
  margin: 0 0 8px;
  line-height: 1.27;
  font-family: var(--font-heading);
}
.ctv2-card-text p {
  font-size: 1.125rem;
  color: #0d1f29;
  margin: 0;
  line-height: 1.44;
}
.ctv2-card-text a {
  color: #0d1f29;
  text-decoration: none;
}
.ctv2-card-text a:hover { text-decoration: underline; }
.ctv2-card-text span { font-size: 1rem; color: #5a6c7a; }

/* ── Right column — form box ── */
.ctv2-right {
  flex: 1;
  min-width: 0;
  background: linear-gradient(to bottom, #e2f0f9 0%, #f8fbfe 100%);
  border-radius: 16px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.ctv2-form-title {
  font-size: 1.375rem;
  font-weight: 700;
  color: #0d1f29;
  margin: 0;
  text-align: center;
  line-height: 1.27;
  font-family: var(--font-heading);
}

/* ── Alert messages ── */
.ctv2-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  border-radius: 10px;
  font-size: .9rem;
  font-weight: 500;
}
.ctv2-alert-success { background: #ecfdf5; color: #065f46; }
.ctv2-alert-error   { background: #fef2f2; color: #991b1b; }

/* ── Form fields ── */
.ctv2-form { display: contents; }
.ctv2-fields {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.ctv2-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.ctv2-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ctv2-field label {
  font-size: 1rem;
  font-weight: 600;
  color: #0d1f29;
  line-height: 1.375;
  font-family: var(--font-heading);
}
.ctv2-field input,
.ctv2-field textarea {
  background: #fff;
  border: none;
  border-radius: 999px;
  padding: 14px 16px;
  font-size: 1rem;
  color: #0d1f29;
  font-family: var(--font-body);
  line-height: 1.5;
  width: 100%;
  box-sizing: border-box;
  transition: outline .15s;
}
.ctv2-field textarea {
  border-radius: 14px;
  min-height: 80px;
  resize: vertical;
}
.ctv2-field input:focus,
.ctv2-field textarea:focus,
.ctv2-select-wrap select:focus {
  outline: 2px solid #5ad8cc;
  outline-offset: 0;
}
/* Select wrapper */
.ctv2-select-wrap {
  position: relative;
}
.ctv2-select-wrap select {
  background: #fff;
  border: none;
  border-radius: 999px;
  padding: 14px 48px 14px 16px;
  font-size: 1rem;
  color: #0d1f29;
  font-family: var(--font-body);
  line-height: 1.5;
  width: 100%;
  box-sizing: border-box;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}
.ctv2-chevron {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: #0d1f29;
}

/* ── Checkboxes ── */
.ctv2-checks {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ctv2-check {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  cursor: pointer;
}
.ctv2-check input[type="checkbox"] {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  margin-top: 1px;
  cursor: pointer;
  accent-color: #0d1f29;
  border: 1px solid #0d1f29;
  border-radius: 4px;
}
.ctv2-check span {
  font-size: .875rem;
  color: #0d1f29;
  line-height: 1.43;
}
.ctv2-check a {
  color: #0d1f29;
  text-decoration: underline;
}

/* ── Submit + note ── */
.ctv2-form-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.ctv2-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #67ef9b;
  color: #0d1f29;
  border: none;
  border-radius: 200px;
  padding: 14px 24px;
  font-size: 1rem;
  font-weight: 600;
  font-family: var(--font-heading);
  cursor: pointer;
  transition: background .2s, transform .15s;
  text-decoration: none;
}
.ctv2-btn:hover { background: #41eb82;  }
.ctv2-note {
  font-size: .875rem;
  color: #0d1f29;
  text-align: center;
  line-height: 1.43;
  margin: 0;
}
.ctv2-note a { color: #0d1f29; text-decoration: underline; }

/* ── Responsive ── */
@media (max-width: 1280px) {
  .ctv2-inner { padding: 0 80px; }
}
@media (max-width: 1024px) {
  .ctv2-inner { padding: 0 40px; flex-direction: column; }
  .ctv2-left { width: 100%; flex-direction: row; flex-wrap: wrap; gap: 32px; }
  .ctv2-card { flex-direction: row; align-items: flex-start; gap: 16px; flex: 1; min-width: 200px; }
  .ctv2-card-icon { flex-shrink: 0; }
}
@media (max-width: 640px) {
  .ctv2-inner    { padding: 0 20px; }
  .ctv2-content  { padding: 24px 0 40px; }
  /* Cards : icône gauche + texte droite, fond coloré */
  .ctv2-left       { flex-direction: column; gap: 12px; }
  .ctv2-card       { flex-direction: row; align-items: flex-start; gap: 16px; padding: 20px; background: #f0f8fc; border-radius: 14px; }
  .ctv2-card-icon  { width: 48px; height: 48px; flex-shrink: 0; }
  .ctv2-card-text h3 { font-size: 1.05rem; margin-bottom: 4px; }
  .ctv2-card-text p  { font-size: .9rem; }
  .ctv2-row      { grid-template-columns: 1fr; }
  .ctv2-right    { padding: 24px 20px; }
  .ctv2-header   { padding: 40px 20px 48px; }
}

/* ============================================================
   BREADCRUMB
============================================================ */
.breadcrumb {
  background: var(--color-bg);
  border-bottom: 1px solid var(--color-border);
  padding: 14px 0;
}
.breadcrumb-list { display: flex; align-items: center; gap: 8px; list-style: none; flex-wrap: wrap; }
.breadcrumb-list li { font-size: .8rem; color: var(--color-text-muted); }
.breadcrumb-list a { color: var(--color-text-muted); }
.breadcrumb-list a:hover { color: var(--color-accent); }
.breadcrumb-list .separator { opacity: .4; }

/* ============================================================
   CENTRES — INTERACTIVE MAP (Grand Est)
============================================================ */
.centres-section {
  background: #ffffff;
  padding: 64px 0;
}
.centres-section .section-label {
  display: inline-block;
  margin-bottom: 12px;
  color: #0D1F29;
}
.centres-section h2 { margin-bottom: 12px; color: #0D1F29; }
/* centres: alt-subtitle blue override */
.centres-section .alt-subtitle { border-bottom-color: #b6daf0; margin-bottom: 12px; }
.centres-section .alt-subtitle__dot { background: #b6daf0; }
.centres-section .alt-subtitle span:last-child { color: #0d1f29; }
.centres-section .centres-intro {
  font-size: 1rem;
  color: #0D1F29;
  max-width: 460px;
  margin-bottom: 48px;
  line-height: 1.6;
}

/* Layout — deux colonnes égales, gap 64px, centrage vertical (Figma desktop exact) */
.centres-grand-est {
  display: flex;
  gap: 64px;
  align-items: center;
}

/* Map side — colonne gauche, centre la carte de 580px */
.centres-map-side {
  flex: 1;
  display: flex;
  justify-content: center;
}
.centres-map-wrap {
  position: relative;
  overflow: visible;
  width: 100%;
  max-width: 580px;
  aspect-ratio: 580 / 464.816;
  flex-shrink: 1;
}
.centres-map-img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}
.centres-pins {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
/* Pins — icônes SVG inline (halo + cercle + étoile Figma) */
.cpin {
  position: absolute;
  transform: translate(-50%, -50%);
  width: 32px; height: 32px;
  border: none;
  background: transparent;
  cursor: pointer;
  pointer-events: all;
  padding: 0;
  line-height: 0;
}
/* Tous les pins exactement à 32px, quel que soit l'état (hover/active)
   — le feedback visuel passe uniquement par la couleur (cf. pin-halo / pin-bg) */
.cpin:hover,
.cpin.active { transform: translate(-50%, -50%); }

/* Picto SVG interne — taille fixe 32×32 */
.cpin-icon { display: block; width: 32px; height: 32px; }

/* Halo extérieur (stroke OUTSIDE 4px de Figma) */
.cpin .pin-halo { fill: rgba(182,218,240,0.32); transition: fill .2s; }
.cpin:hover .pin-halo,
.cpin.active .pin-halo { fill: rgba(65,235,130,0.16); }

/* Cercle de fond : bleu par défaut → vert actif/hover */
.cpin .pin-bg { fill: #B6DAF0; transition: fill .2s; }
.cpin:hover .pin-bg,
.cpin.active .pin-bg { fill: #41EB82; }

/* Navigation — hors colonnes, pleine largeur, centré (Figma : 1600px, arrows centrées, gap 24px) */
.centres-map-nav {
  width: 100%;
  padding-top: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
/* Flèches : 136px centrées, gap 32px (Figma exact) */
.centres-nav-btns {
  display: flex;
  gap: 32px;
  align-items: center;
}
/* Boutons nav — pill expandable au hover (même charte que carousel domaines) */
.centres-map-nav .carousel-btn-sm {
  width: auto;
  min-width: 52px;
  height: 52px;
  border-radius: 9999px;
  color: #0D1F29;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
/* Neutralise le hover scale/opacity du .carousel-btn parent sans !important */
.centres-map-nav .carousel-btn-sm,
.centres-map-nav .carousel-btn-sm:hover { opacity: 1; transform: none; }
.centres-map-nav .carousel-btn-sm.cbtn-active {
  background: #B6DAF0;
  cursor: pointer;
}
.centres-map-nav .carousel-btn-sm.cbtn-active:hover {
  background: #9dcfe6;
}
.centres-map-nav .carousel-btn-sm.cbtn-limit {
  background: #E2F0F9;
  color: rgba(13,31,41,.25);
  cursor: default;
}
/* Jauge pleine largeur, 2px (Figma : 1600×2px) */
.centres-progress-wrap {
  width: 100%;
  height: 2px;
  background: #B6DAF0;
  border-radius: 2px;
  overflow: hidden;
}
.centres-progress-bar {
  height: 100%;
  background: #0D1F29;
  border-radius: 2px;
  width: 0%;
  transition: width .3s ease;
}
/* Domain carousel — overrides couleurs Figma (vert teal, fond sombre) */
.domains-section .centres-map-nav .carousel-btn-sm.cbtn-active {
  background: #5AD8CC;
  color: #0D1F29;
}
.domains-section .centres-map-nav .carousel-btn-sm.cbtn-active:hover {
  background: #4EC4B8;
}
.domains-section .centres-map-nav .carousel-btn-sm.cbtn-limit {
  background: #DEF7F5;
  color: rgba(13,31,41,.35);
}
.domains-section .centres-progress-wrap {
  background: rgba(222,247,245,.18);
}
.domains-section .centres-progress-bar {
  background: #5AD8CC;
}

/* Detail card side */
.centres-card-side {
  flex: 1;
  min-width: 0;
  position: relative;
}
/* ══ CARD CENTRE — pixel-perfect Figma ══ */
.ccentre-card {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 24px;
  border-radius: 16px;
  background: linear-gradient(180deg, #C2DFF0 0%, transparent 100%);
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  transition: opacity .3s;
}
.ccentre-card.fading { opacity: 0; }

/* ── Bloc photo + info (haut) ── */
.ccentre-card-top {
  display: flex;
  gap: 20px;
  align-items: flex-start;
  width: 100%;
}
.ccentre-card-photo {
  width: 295px;
  height: 198px;
  object-fit: cover;
  border-radius: 10px;
  flex-shrink: 0;
  display: block;
}
/* Campus partenaires : l'image est un logo (SVG ALAJI/ORAKIN) → afficher entier, centré, non rogné */
.ccentre-card-photo--logo {
  object-fit: contain;
  background: #ffffff;
  padding: 26px;
}
.ccentre-card-photo-placeholder {
  width: 295px;
  height: 198px;
  border-radius: 10px;
  background: #E2F0F9;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.ccentre-card-topinfo {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 4px;
}
.ccentre-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: nowrap;
}
.ccentre-card-name {
  font-size: 1.75rem;
  font-weight: 700;
  color: #0D1F29;
  margin: 0;
  font-family: var(--font-heading);
  line-height: 1.2;
}

/* ── Badge ── */
.badge-campus-main {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  background: #41EB82;
  color: #0D1F29;
  border: none;
  border-radius: 100px;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  white-space: nowrap;
  flex-shrink: 0;
  margin-top: 2px;
}

/* ── Contacts ── */
.ccentre-contacts {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ccentre-contact-line {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: .9rem;
  color: #0D1F29;
  line-height: 1.4;
}
.ccentre-contact-line svg {
  flex-shrink: 0;
  width: 20px; height: 20px;
  margin-top: 1px;
}
.ccentre-contact-line a { color: inherit; text-decoration: none; }
.ccentre-contact-line a:hover { opacity: .7; }

/* ── Bloc formations (bas) — remonte aux bords via marges négatives ── */
.ccentre-card-body {
  display: flex;
  flex-direction: column;
  background: transparent;
  margin: 20px -24px -24px;
  padding: 20px 24px 28px;
  border-top: 1px solid rgba(13,31,41,0.1);
}
.ccentre-formations-title {
  font-size: .9rem;
  font-weight: 700;
  color: #0D1F29;
  margin: 0 0 12px 0;
}
.ccentre-formations-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  border: none;
  border-radius: 0;
  overflow: visible;
  background: transparent;
}
.ccentre-formation-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  gap: 12px;
  border: 1px solid rgba(13,31,41,0.1);
  border-radius: 10px;
  background: rgba(255,255,255,0.6);
  font-size: .86rem;
}
.ccentre-formation-row:last-child { border-bottom: 1px solid rgba(13,31,41,0.1); }
.ccentre-formation-row span { color: #0D1F29; flex: 1; font-weight: 500; }
.ccentre-formation-meta {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
  align-items: center;
  white-space: nowrap;
}
.ccentre-formation-meta em {
  font-style: normal;
  font-size: .82rem;
  color: #5a7a86;
}
.ccentre-formation-meta em:not(:last-child)::after { content: ' -'; margin-right: 2px; }
/* ─── Lignes de formation cliquables (formations phares liées au campus) ─── */
.ccentre-formation-row { position: relative; transition: background .15s ease, border-color .15s ease; }
.ccentre-formation-name { flex: 1; color: #0D1F29; font-weight: 500; text-decoration: none; }
.ccentre-formation-name::after { content: ''; position: absolute; inset: 0; z-index: 1; border-radius: 10px; }
.ccentre-formation-row:has(.ccentre-formation-name):hover { background: rgba(255,255,255,0.95); border-color: rgba(90,122,134,0.45); cursor: pointer; }

/* ─── Liste libre de formations sur la page single-centre (même rendu que la card map) ─── */
.sc-formations--liste .sc-formations-rows {
  list-style: none;
  margin: 32px auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-width: 880px;
}
.sc-formations--liste .sc-formation-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  gap: 12px;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 10px;
  background: rgba(255,255,255,0.04);
  font-size: .92rem;
  color: #fff;
}
.sc-formations--liste .sc-formation-row__name {
  flex: 1;
  font-weight: 500;
  color: #fff;
}
.sc-formations--liste .sc-formation-row__domain {
  flex-shrink: 0;
  font-size: .82rem;
  color: rgba(255,255,255,0.6);
  white-space: nowrap;
}

/* Scroll vertical si beaucoup de formations (ex. Bétheny 20 lignes) */
.ccentre-formations-list { max-height: 280px; overflow-y: auto; padding-right: 4px; }
.ccentre-formations-list::-webkit-scrollbar { width: 6px; }
.ccentre-formations-list::-webkit-scrollbar-thumb { background: rgba(13,31,41,0.18); border-radius: 3px; }

.ccentre-cta {
  margin-top: 20px;
  text-align: center;
}
.ccentre-cta .btn {
  padding: 15px 32px;
  font-size: .95rem;
}

@media (max-width: 1100px) {
  .centres-grand-est { flex-direction: column; gap: 32px; }
  .centres-map-side { justify-content: flex-start; }
  .centres-map-wrap { width: 100%; height: auto; }
  .centres-map-img { width: 100%; height: auto; }
}
@media (max-width: 768px) {
  .centres-section { padding: 32px 0; }
  .cpin { width: 26px; height: 26px; }
  .cpin-icon { width: 26px; height: 26px; }
}
@media (max-width: 600px) {
  .ccentre-card-top { flex-direction: column; }
  .ccentre-card-photo,
  .ccentre-card-photo-placeholder { width: 100%; height: 200px; flex-shrink: unset; }
  .ccentre-card-name { font-size: 1.4rem; }
  .ccentre-card-head { flex-wrap: wrap; }
}

/* ============================================================
   ALTERNANCE SECTION — light background
============================================================ */
/* Wrapper externe — espace autour du bloc */
/* ── Alternance section ──────────────────────────────────── */
.alternance-section-wrap {
  background: #F8F8FF;
  padding: 64px 0;
  border-radius: 24px;
  margin: 0 16px;
}

/* Zone blanche autour des sections Alternance + Pourquoi */
.light-zone {
  background: #FFFFFF;
  padding: 48px 0;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

/* Full-bleed section — no card appearance, content padded inside container */
.alternance-box {
  display:         flex;
  flex-direction:  column;
  justify-content: center;
  align-items:     flex-start;
  gap:             32px; /* gap entre eyebrow et les blocs suivants */
  padding:         0;
  align-self:      stretch;
  width:           100%;
}
/* L'eyebrow dans alternance-box n'a pas besoin de son propre margin-bottom */
.alternance-box .alt-eyebrow { margin-bottom: 0; }

/* Label "• Alternance" avec ligne */
.alt-eyebrow {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding-bottom: 12px;
  border-bottom: 1px solid #D4D6FF;
  margin-bottom: 40px; /* gap uniforme eyebrow → h2 dans toutes les sections */
}
.alt-eyebrow span {
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: #0D1F29;
  display: flex;
  align-items: center;
  gap: 8px;
}
.alt-eyebrow span::before {
  content: '';
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #B7BBFF;
  display: inline-block;
  flex-shrink: 0;
}
.alt-eyebrow::after { display: none; }

/* Header : titre gauche, boutons droite */
.alternance-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
  width: 100%;
}
.alternance-text { flex: 1 1 400px; }
.alternance-text h2 {
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  color: var(--color-light-text);
  margin-bottom: 12px;
}
.alternance-text p { color: var(--color-light-muted); line-height: 1.7; margin: 0; }
.alternance-ctas {
  display: flex;
  flex-direction: row;
  gap: 12px;
  flex-shrink: 0;
  align-items: center;
}

/* Boutons alternance */
.btn-alt-primary {
  background: rgba(100,100,200,.15);
  color: #3a3a8c;
  border: none;
  font-weight: 600;
}
.btn-alt-primary:hover { background: rgba(100,100,200,.25); }
.btn-alt-outline {
  background: #e8e8f0;
  color: #3a3a6a;
  border: none;
  font-weight: 600;
}
.btn-alt-outline:hover { background: #d8d8e8; }

/* 3 cartes — flex row, chaque carte flex: 1 0 0 */
.alternance-avantages {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-self: stretch;
  width: 100%;
}

/* Carte — Figma exact */
.avantage-card {
  display:         flex;
  flex-direction:  column;
  align-items:     flex-start;
  gap:             16px;
  flex:            1 0 0;
  padding:         20px;
  border-radius:   16px;
  background:      #F1F1FF;
  border:          none;
}

.avantage-icon {
  width: 60px; height: 60px; flex-shrink: 0;
  border-radius: 12px;
  background: transparent;
  color: #5a5ab0;
  display: flex; align-items: center; justify-content: center;
}
.avantage-card h3 { font-size: 1rem; font-weight: 700; color: var(--color-light-text); margin: 0; }
.avantage-card p  { font-size: .86rem; color: var(--color-light-muted); margin: 0; line-height: 1.55; }

@media (max-width: 1100px) {
  .alternance-box { padding: 0; }
}
@media (max-width: 900px) {
  .alternance-avantages { flex-direction: column; }
  .alternance-box { padding: 0; }
}
@media (max-width: 768px) {
  .alternance-header { flex-direction: column; align-items: flex-start; }
  .alternance-text { flex: 0 0 auto; }
  .alternance-ctas { flex-direction: column; width: 100%; }
  .alternance-section-wrap { padding: 32px 0; }
  .alternance-box { gap: 24px; }
  .alternance-avantages { gap: 12px; }
  .avantage-card { padding: 16px; gap: 12px; }
}

/* ============================================================
   POURQUOI PASTEUR
============================================================ */
/* ── Pourquoi Pasteur — screenshot exact ── */
.pourquoi-section {
  background: #EBF8F6;
  border-radius: 24px;
  margin: 0 16px;
}
.pourquoi-titre {
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  font-weight: 700;
  color: var(--color-light-text);
  text-align: center;
  margin-bottom: 32px;
}
.pourquoi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.pourquoi-card {
  background: #FFFFFF;
  border: none;
  border-radius: 14px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.pourquoi-icon {
  width: 60px; height: 60px;
  border-radius: 12px;
  background: transparent;
  color: var(--color-accent-dark);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.pourquoi-card h3 { font-size: 1rem; font-weight: 700; color: var(--color-light-text); margin: 0; }
.pourquoi-card p  { font-size: .86rem; color: var(--color-light-muted); line-height: 1.6; margin: 0; }
@media (max-width: 1024px) { .pourquoi-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .pourquoi-grid { grid-template-columns: 1fr; } }
@media (max-width: 768px) {
  .pourquoi-titre { margin-bottom: 24px; }
  .pourquoi-grid { gap: 12px; }
  .pourquoi-card { padding: 16px; }
}

/* ============================================================
   SECTION HEADER ROW (titre gauche, actions droite)
============================================================ */
.section-header-row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 40px;
  flex-wrap: wrap;
}
.section-header-row > div:first-child { flex: 1; }
.section-header-row h2 { margin-bottom: 0; }
.section-header-row-end {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

/* Shared slider nav arrows (small version) */
.slider-nav { display: flex; gap: 8px; }
.carousel-btn-sm {
  width: 44px; height: 44px;
  font-size: 1rem;
}

/* ============================================================
   SHARED SLIDER PATTERN
   (témoignages, actualités — overflow right, aligned left)
============================================================ */
.slider-outer {
  width: 100%;
  overflow: hidden;
}
.slider-track {
  display: flex;
  gap: 24px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  padding: 8px 60px 20px 0;
  scroll-padding-left: max(32px, calc((100vw - 1440px) / 2 + 32px));
  scrollbar-width: none;
  cursor: grab;
}
.slider-track::-webkit-scrollbar { display: none; }
.slider-track.grabbing { cursor: grabbing; }

/* ============================================================
   TÉMOIGNAGES — Figma pixel-perfect
   bg #080717 · cards #b6daf0 · 4 visible · arrows 52px
============================================================ */
.temoignages-section { display: none; }
.temoignages-section {
  background: #080717;
  padding: 64px 0;
  overflow: hidden; /* clip au bord droit de l'écran */
}

/* alt-eyebrow overrides pour fond sombre (section témoignages) */
.temoignages-section .alt-eyebrow {
  border-bottom-color: rgba(255,255,255,.18);
}
.temoignages-section .alt-eyebrow span {
  color: rgba(255,255,255,.85);
}
.temoignages-section .alt-eyebrow span::before {
  background: var(--color-accent);
}
/* alt-subtitle overrides for dark temoignages section */
.temoignages-section .alt-subtitle { border-bottom-color: rgba(255,255,255,.18); }
.temoignages-section .alt-subtitle__dot { background: var(--color-accent); }
.temoignages-section .alt-subtitle span:last-child { color: rgba(255,255,255,.75); }

/* Title */
.temo-titre {
  font-size: clamp(1.6rem, 2.5vw, 2.25rem);
  font-weight: 700;
  color: #ffffff;
  text-align: center;
  margin: 0 0 32px;
}

/* ── Viewport : overflow hidden ── */
.temo-viewport {
  overflow: visible; /* clip géré par .temoignages-section overflow:hidden */
}

/* ── Track : flex slider, JS translate ── */
.temo-track {
  display: flex;
  gap: 24px;
  transition: transform .4s cubic-bezier(.25,.46,.45,.94);
  will-change: transform;
}

/* ── Cards — Figma: #b6daf0, radius 16, padding 32, gap 24 ── */
.temoignage-card {
  flex-shrink: 0;
  flex-grow: 0;
  min-height: 340px;
  background: #b6daf0;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  box-sizing: border-box;
  transition: transform .2s ease;
}
/* .temoignage-card:hover — effet "vers le haut" retiré */

/* ── Quote — Figma: 18px/400, #0d1f29 ── */
.temo-quote {
  flex: 1;
  font-size: 1.125rem;
  font-weight: 400;
  color: #0d1f29;
  line-height: 1.6;
  margin: 0;
}

/* ── Author block ── */
.temoignage-author {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

/* ── Avatar — Figma: 56×56, circle ── */
.temoignage-avatar {
  width: 56px;
  height: 56px;
  flex-shrink: 0;
  border-radius: 50%;
  overflow: hidden;
  background: rgba(13,31,41,.15);
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(13,31,41,.4);
}
.temoignage-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
}

/* ── Author text — Figma: name 16/600 #0d1f29 · role 14/400 #495760 ── */
.temoignage-author strong {
  display: block;
  font-size: 1rem;
  font-weight: 600;
  color: #0d1f29;
  line-height: 1.3;
}
.temoignage-author span {
  display: block;
  font-size: .875rem;
  font-weight: 400;
  color: #495760;
  line-height: 1.4;
}

/* ── Video card — Figma: same padding/gap as text card (pad=T32 B32 L32 R32) ── */
/* No overrides: .temoignage-card--video inherits padding:32px and gap:24px */

/* Content-Wrapper: Figma gap=32 between thumb and author */
.temo-content-wrapper {
  display: flex;
  flex-direction: column;
  gap: 32px;
  width: 100%;
  flex: 1;
}

/* Thumb — Figma: cr=8, inside the 32px card padding */
.temo-video-thumb {
  position: relative;
  aspect-ratio: 16 / 9;
  flex-shrink: 0;
  width: 100%;
  overflow: hidden;
  border-radius: 8px;
}
.temo-video-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.temo-play-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(8,7,23,.18);
}
/* Play button — Figma: 48×48, #41eb82, icon WHITE #ffffff */
.temo-play-btn {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #41eb82;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  transition: transform .2s ease;
  padding-left: 2px; /* optical center for triangle */
}
.temo-play-btn:hover { transform: scale(1.1); }
.temoignage-author--video {
  flex-shrink: 0;
  margin-top: auto;
}

/* ── Navigation arrows — Figma: 52×52 circles ── */
.temo-nav {
  display: flex;
  justify-content: center;
  gap: 32px;
  margin-top: 40px;
}


/* ── Responsive ── */
@media (max-width: 900px) {
  .temoignage-card { min-height: 300px; }
}
@media (max-width: 768px) {
  .temoignages-section { padding: 32px 0; }
  .temoignage-card { padding: 20px; }
  .temo-titre { margin: 0 0 24px; }
}
@media (max-width: 520px) {
  .temo-nav { gap: 16px; }
}

/* ============================================================
   DOMAINE PAGE  (taxonomy-domaine.php)
   Fidèle au Figma node 9416:7828 — canvas 1920, container 1600
============================================================ */

/* Container 1600px centré */
.dpage-container {
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 clamp(20px, 4vw, 160px);
}

/* ── 1. HEADER ─────────────────────────────────────────────── */
.dpage-header {
  background: var(--color-bg);       /* #080717 */
  padding: 40px 0 60px;
}

/* Breadcrumb pill — rgba(222,247,245) mint */
.dpage-breadcrumb { margin-bottom: 32px; text-align: center; }
.dpage-breadcrumb-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgb(222,247,245);
  color: #0d1f29;
  border-radius: 99px;
  padding: 8px 16px;
  font-size: .875rem;
  line-height: 1.25rem;
}
.dpage-bc-home { display: flex; align-items: center; color: #0d1f29; transition: color .2s; }
.dpage-bc-home:hover { color: var(--color-accent); }
.dpage-bc-sep { color: #0d1f29; opacity: .45; flex-shrink: 0; }
.dpage-bc-link { color: #0d1f29; text-decoration: none; font-weight: 400; transition: color .2s; }
.dpage-bc-link:hover { color: #0d6b5e; }
.dpage-bc-current { font-weight: 600; color: #0d1f29; }

/* Title */
.dpage-title-block { max-width: 784px; margin: 0 auto; text-align: center; }
.dpage-h1 {
  font-size: clamp(2rem, 3.3vw, 3rem);  /* Figma fs=48 */
  font-weight: 600;
  line-height: 1.125;
  color: #fff;
  margin: 0 0 12px;
}
.dpage-subtitle {
  font-size: clamp(1rem, 1.25vw, 1.125rem);  /* Figma fs=18 */
  font-weight: 400;
  color: rgba(255,255,255,.85);
  line-height: 1.55;
  margin: 0;
}

/* ── 2. CAROUSEL ────────────────────────────────────────────── */
/*
  Figma exact :
  - Frame: 1920×523
  - 3 images de 784px chacune, gap=32px entre elles
  - track total = 3×784 + 2×32 = 2416px → overflow de (2416-1920)/2 = 248px de chaque côté
  - Ellipse HAUT  : x=-248 y=-187 w=2416 h=235 → visible 48px en haut  (235-187=48)
  - Ellipse BAS   : x=-248 y= 476 w=2416 h=235 → visible 47px en bas   (523-476=47)
*/
.dpage-carousel {
  position: relative;
  height: clamp(220px, 27.2vw, 523px);   /* 523/1920 = 27.2% */
  overflow: hidden;
}
.dpage-carousel-track {
  display: flex;
  justify-content: center;
  height: 100%;
  gap: clamp(8px, 1.67vw, 32px);
}
.dpage-carousel-slide {
  flex: 0 0 clamp(180px, 40.83vw, 784px);
  height: 100%;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/*
  Courbes responsive — tout en % du carousel.
  Slides maintenant contenues dans le carousel (pas de débordement horizontal).
  Courbes à 100% de largeur → arc doux centré sur le carousel.
  -80% → 20% de l'ellipse visible (même proportion que Figma).
*/

/* Courbe HAUT */
.dpage-carousel-curve-top {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -80%);
  width: 171%;
  height: 45%;
  background: var(--color-bg);
  border-radius: 0 0 50% 50% / 0 0 100% 100%;
  pointer-events: none;
  z-index: 2;
}

/* Courbe BAS */
.dpage-carousel-curve-bottom {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 80%);
  width: 171%;
  height: 45%;
  background: var(--color-bg);
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  pointer-events: none;
  z-index: 2;
}

/* ── 3. INTRO ───────────────────────────────────────────────── */
/* Figma: dark bg, 2 colonnes: content(1024) + video(512), gap 64px */
.dpage-intro {
  background: var(--color-bg);
  padding: 80px 0 100px;
}
.dpage-intro-grid {
  display: grid;
  grid-template-columns: 64fr 32fr;  /* ~1024 vs ~512 */
  gap: 64px;
  align-items: start;
}

/* Colonne texte */
.dpage-intro-left {}
.dpage-intro-h2 {
  font-size: clamp(1.5rem, 2.25vw, 2.25rem);  /* Figma fs=36 */
  font-weight: 600;
  line-height: 1.167;
  color: #fff;
  margin: 0 0 24px;
}
.dpage-intro-body p {
  font-size: 1rem;            /* Figma fs=16 */
  font-weight: 400;
  line-height: 1.375rem;      /* Figma lh=22px */
  color: rgba(255,255,255,.8);
  margin: 0 0 20px;
}
.dpage-pourquoi-titre {
  font-size: 1.375rem;        /* Figma fs=22 */
  font-weight: 600;
  line-height: 1.75rem;
  color: #fff;
  margin: 40px 0 20px;
}
.dpage-pourquoi-row {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
/* Argument cards — Figma: rgba(239,251,250), w=320, h=254 */
.dpage-arg-card {
  flex: 1;
  min-width: 200px;
  background: rgb(239,251,250);
  border-radius: 12px;
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.dpage-arg-icon {
  width: 60px; height: 60px;
  flex-shrink: 0;
  background: rgb(222,247,245);  /* Figma icon bg */
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dpage-arg-card strong {
  display: block;
  font-size: 1.375rem;   /* Figma fs=22 */
  font-weight: 600;
  color: #0d1f29;
  line-height: 1.75rem;
  margin-bottom: 8px;
}
.dpage-arg-card p {
  font-size: 1.125rem;   /* Figma fs=18 */
  font-weight: 400;
  color: #0d1f29;
  line-height: 1.625rem;
  margin: 0;
}

/* Colonne vidéo — Figma: 512×668, play btn centré */
.dpage-intro-right { align-self: stretch; }
.dpage-video-block {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 400px;
  border-radius: 16px;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dpage-video-overlay {
  position: absolute;
  inset: 0;
  background: rgba(8,7,23,.45);
}
.dpage-play-btn {
  position: relative;
  z-index: 1;
  width: 64px; height: 64px;
  border-radius: 50%;
  background: rgba(255,255,255,1);  /* Figma: white */
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0d1f29;
  transition: transform .2s, background .2s;
  box-shadow: 0 4px 24px rgba(0,0,0,.3);
}
.dpage-play-btn:hover { transform: scale(1.1); background: var(--color-accent); }
.dpage-play-btn svg { margin-left: 3px; }
/* Video element inside video-block */
.dpage-video-block video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/* ── 4. FORMATIONS ──────────────────────────────────────────── */
/* Figma: dark background, groupes rgba(13,31,41) */
.dpage-formations {
  background: var(--color-bg);
  padding: 0 0 100px;
}

/* Tabs — Figma: texte fs=22 fw=600 blanc, pas de fond */
.dpage-tabs {
  display: flex;
  align-items: center;
  gap: 40px;
  padding: 40px 0 32px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  margin-bottom: 32px;
}
.dpage-tab {
  background: none;
  border: none;
  padding: 0;
  font-family: var(--font-heading);
  font-size: 1.375rem;   /* Figma fs=22 */
  font-weight: 600;
  color: rgba(255,255,255,.4);
  cursor: pointer;
  transition: color .2s;
  text-decoration: none;
  line-height: 1.75rem;
}
.dpage-tab:hover { color: rgba(255,255,255,.75); }
.dpage-tab--active { color: #fff; }

/* Group heading — Figma fs=28 fw=600 white */
.dpage-group-heading {
  font-size: 1.75rem;   /* Figma fs=28 */
  font-weight: 600;
  color: #fff;
  line-height: 2.125rem;
  padding: 32px 32px 16px;
  margin: 0;
}

/* Group container — Figma fill=rgba(13,31,41) */
.dpage-group {
  background: rgb(13,31,41);
  border-radius: 16px;
  margin-bottom: 24px;
  overflow: hidden;
}

/* Formation card — Figma: w=1536 h=135, horizontal, image 240×135 */
.dpage-fcard {
  display: flex;
  align-items: center;
  gap: 0;
  text-decoration: none;
  color: inherit;
  border-top: 1px solid rgba(255,255,255,.06);
  transition: background .2s;
  min-height: 135px;
}
.dpage-fcard:first-of-type { border-top: none; }
.dpage-fcard:hover { background: rgba(255,255,255,.03); }

/* Image gauche — Figma: 240×135 */
.dpage-fcard-img {
  flex: 0 0 240px;
  height: 135px;
  overflow: hidden;
  background: rgba(255,255,255,.05);
}
.dpage-fcard-img img {
  width: 100%; height: 100%;
  object-fit: cover;
}
.dpage-fcard-img-placeholder {
  width: 100%; height: 100%;
  background: linear-gradient(135deg, rgba(123,224,214,.06), rgba(255,255,255,.03));
}

/* Content middle — flex-1 */
.dpage-fcard-content {
  flex: 1;
  padding: 16px 32px;
  min-width: 0;
}
.dpage-fcard-tags {
  display: flex;
  gap: 8px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
/* Badge purple — Figma: rgba(197,201,255), text rgba(13,31,41) */
.dpage-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  border-radius: 99px;
  font-size: .875rem;
  font-weight: 500;
  line-height: 1rem;
}
.dpage-badge--purple { background: rgb(197,201,255); color: #0d1f29; }
.dpage-badge--teal   { background: rgb(123,224,214); color: #0d1f29; }

/* Card title — Figma: fs=22 fw=600 white */
.dpage-fcard-title {
  font-size: 1.375rem;
  font-weight: 600;
  color: #fff;
  line-height: 1.75rem;
  margin: 0 0 6px;
}
/* Card desc — Figma: fs=16 fw=400 white */
.dpage-fcard-desc {
  font-size: 1rem;
  font-weight: 400;
  color: rgba(255,255,255,.7);
  line-height: 1.375rem;
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Button right — Figma: 52×52, fill=rgba(90,216,204) = #5AD8CC */
/* Button right — accordion expand (like form-card-btn) */
.dpage-fcard-btn {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0;
  max-width: 44px;
  min-width: 44px;
  height: 44px;
  margin-right: 32px;
  border-radius: 200px;
  background: #5ad8cc;
  color: #0d1f29;
  padding: 10px;
  overflow: hidden;
  flex-shrink: 0;
  transition: max-width .35s ease, padding .35s ease, gap .35s ease, background .2s;
}
.dpage-fcard-btn-label {
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
  color: #0d1f29;
  white-space: nowrap;
  max-width: 0;
  overflow: hidden;
  transition: max-width .35s ease;
  font-family: inherit;
}
.dpage-fcard-btn svg { flex-shrink: 0; }
.dpage-fcard:hover .dpage-fcard-btn {
  max-width: calc(100% + 24px);
  gap: 8px;
  padding: 10px 14px 10px 16px;
}
.dpage-fcard:hover .dpage-fcard-btn-label { max-width: none; }

/* Empty state */
.dpage-empty {
  padding: 80px 32px;
  text-align: center;
  color: rgba(255,255,255,.5);
  font-size: 1rem;
}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 1200px) {
  .dpage-intro-grid { grid-template-columns: 1fr 380px; gap: 40px; }
  .dpage-pourquoi-row { flex-direction: column; }
  .dpage-arg-card { min-width: unset; }
}
@media (max-width: 900px) {
  .dpage-intro-grid { grid-template-columns: 1fr; }
  .dpage-intro-right { display: none; }
  .dpage-pourquoi-row { flex-direction: row; }
  .dpage-fcard-img { flex: 0 0 160px; height: 100%; }
  .dpage-fcard-title { font-size: 1.1rem; }
  .dpage-fcard-desc { white-space: normal; }
}
@media (max-width: 640px) {
  .dpage-carousel { height: 200px; }
  .dpage-carousel-slide:not(:first-child) { display: none; }
  .dpage-carousel-slide:first-child { flex: 0 0 90%; }
  .dpage-tabs { gap: 20px; overflow-x: auto; padding-bottom: 12px; }
  .dpage-tab { font-size: 1rem; white-space: nowrap; }
  .dpage-fcard { flex-direction: column; align-items: flex-start; }
  .dpage-fcard-img { flex: none; width: 100%; height: 180px; }
  .dpage-fcard-content { padding: 16px 20px 12px; }
  .dpage-fcard-btn { margin: 0 0 16px 20px; }
  .dpage-pourquoi-row { flex-direction: column; }
  .dpage-arg-card strong { font-size: 1rem; }
  .dpage-arg-card p { font-size: .9rem; }
}

/* ============================================================
   BROCHURES SECTION — Figma: dark page bg + inner card #0d1f29
============================================================ */
.brochures-section {
  background: #ffffff;
  padding: 32px 0 0;
}
/* Inner dark card — Figma: #0d1f29, radius 16px, padding 64px */
.brochures-inner {
  background: #0d1f29;
  border-radius: 16px;
  padding: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.brochures-text h2 {
  font-size: 2.25rem;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 8px;
  line-height: 1.2;
}
.brochures-text p {
  font-size: 1.125rem;
  font-weight: 400;
  color: rgba(255,255,255,.75);
  max-width: 480px;
  line-height: 1.6;
  margin: 0;
}
/* Boutons côte à côte — Figma: gap 16px, horizontal */
.brochures-actions {
  display: flex;
  flex-direction: row;
  gap: 16px;
  flex-shrink: 0;
  align-items: center;
}
@media (max-width: 900px) {
  .brochures-inner { flex-direction: column; text-align: center; padding: 40px 32px; }
  .brochures-actions { flex-wrap: wrap; justify-content: center; }
}

/* ============================================================
   PARTENAIRES
============================================================ */
/* ── Partenaires — Figma: fond #fff, 5 cartes grises, hauteur uniforme ── */
.partenaires-section {
  background: #ffffff;
  padding: 64px 0;
}
.partenaires-header {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 24px;
}
.partenaires-header h2 {
  font-size: clamp(1.5rem, 2.2vw, 2rem);
  font-weight: 700;
  color: #080717;
  margin: 0 0 12px;
}
.partenaires-header p {
  font-size: .95rem;
  line-height: 1.6;
  color: #4b5c6b;
  margin: 0;
}
.partenaires-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 24px;
  max-width: 1100px;   /* Figma: inner logos area = 1328px/1600px × 1440px */
  margin: 0 auto;
  align-items: stretch;
}
.partenaire-logo {
  background: #f2f5f7;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 150px;        /* hauteur fixe = toutes les cartes identiques */
  padding: 0 20px;
}

.partenaire-logo img {
  max-width: 100%;
  max-height: 90px;     /* logo uniformément contenu dans la carte */
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}
@media (max-width: 900px) {
  .partenaires-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .partenaires-section { padding: 32px 0; }
  .partenaires-header { margin-bottom: 16px; }
}
@media (max-width: 540px) {
  .partenaires-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================================
   FOOTER — Figma exact
============================================================ */
/* ── Outer wrapper — white bg, 16px outer margin ── */
.site-footer {
  background: #ffffff;
  padding: 16px;
}

.tax-domaine .ph-header { padding-bottom: 16px; }
body.post-type-archive-formation .site-footer,
body.single-formation .site-footer,
body.tax-domaine .site-footer,
body.error404 .site-footer {
  background: transparent;
}

/* ── Dark card — floats on white, all-corner border-radius ── */
.footer-inner {
  background: #0d1f29;
  border-radius: 16px;
  max-width: 1888px;
  margin: 0 auto;
  padding: 64px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* ── Top row (grid: logo | nav 1fr | emailing fixed) ── */
.footer-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 32px;
}

/* Brand / logo */
.footer-brand {
  display: flex;
  flex-direction: column;
}
.footer-logo {
  height: 64px;
  width: auto;
  filter: brightness(0) invert(1);
}

/* Nav columns wrapper (3 cols, auto gap via flex) */
.footer-nav {
  display: flex;
  gap: 48px;
  min-width: 0;
}
.footer-col {
  display: flex;
  flex-direction: column;
}
.footer-col-title {
  color: #5ad8cc;
  font-size: 1rem;
  font-weight: 500;
  margin: 0 0 16px;
}
.footer-nav-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.footer-nav-list a {
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
  text-decoration: none;
  transition: color .2s;
}
.footer-nav-list a:hover { color: #5ad8cc; }

.badge-hiring {
  display: inline-flex;
  align-items: center;
  padding: 4px;
  background: #67ef9b;
  color: #0d1f29;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .05em;
  vertical-align: middle;
  margin-left: 8px;
  text-transform: uppercase;
}

/* ── Emailing box (512px, 24px padding, 12px radius) ── */
.footer-emailing {
  background: #25353e;
  border-radius: 12px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 460px;
  flex-shrink: 0;
}
.footer-emailing-title {
  color: #ffffff;
  font-size: 22px;
  font-weight: 600;
  line-height: 28px;
}
.footer-emailing-intro {
  color: #ffffff;
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
}
/* Field row: label above input, circular button bottom-aligned */
.footer-emailing-field-row {
  display: flex;
  align-items: flex-end;
  gap: 0;
}
.footer-emailing-field {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}
.footer-emailing-label {
  color: #ffffff;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}
.footer-emailing-field input[type="email"] {
  height: 52px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 8px;
  padding: 0 16px;
  color: #ffffff;
  font-size: 14px;
  font-family: inherit;
  outline: none;
  width: 100%;
}
.footer-emailing-field input[type="email"]::placeholder { color: rgba(255,255,255,.4); }
.footer-emailing-btn {
  height: 52px;
  min-width: 52px;
  border-radius: 200px;
  background: #41eb82;
  border: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  flex-shrink: 0;
  margin-left: 12px;
  color: #0d1f29;
  padding: 14px;
  overflow: hidden;
  transition: padding .3s cubic-bezier(.34,1.56,.64,1), gap .3s cubic-bezier(.34,1.56,.64,1);
}
.footer-emailing-btn:hover {
  padding: 14px 20px;
  gap: 8px;
}
.footer-emailing-btn-label {
  font-size: 15px;
  font-weight: 600;
  color: #0d1f29;
  white-space: nowrap;
  max-width: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-width .35s cubic-bezier(.34,1.56,.64,1), opacity .2s ease;
}
.footer-emailing-btn:hover .footer-emailing-btn-label {
  max-width: 80px;
  opacity: 1;
}
.footer-check {
  display: flex;
  gap: 8px;
  align-items: center;
  cursor: pointer;
}
.footer-check input[type="checkbox"] {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  accent-color: #41eb82;
  cursor: pointer;
}
.footer-check span {
  font-size: 14px;
  font-weight: 400;
  color: #ffffff;
  line-height: 20px;
}
.footer-check a { color: #ffffff; text-decoration: underline; }
.footer-check a:hover { color: #5ad8cc; }
.footer-brochure-success {
  background: rgba(65,235,130,.15);
  border: 1px solid rgba(65,235,130,.3);
  border-radius: 8px;
  padding: 12px 16px;
  color: #41eb82;
  font-size: .875rem;
}
.footer-brochure-error {
  background: rgba(255,80,60,.12);
  border: 1px solid rgba(255,80,60,.25);
  border-radius: 8px;
  padding: 12px 16px;
  color: #ff5c4a;
  font-size: .875rem;
}

/* ── Bottom bar ── */
.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.08);
  padding-top: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}

/* Social icons */
.footer-social {
  display: flex;
  gap: 8px;
}
.footer-social-btn {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #25353e;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  text-decoration: none;
  transition: background .2s;
}
.footer-social-btn:hover { background: #5ad8cc; }

/* Copyright */
.footer-copyright {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  margin: 0;
}
.footer-copyright span,
.footer-copyright a {
  color: #868f94;
  font-size: 13px;
  font-weight: 400;
  text-decoration: none;
  white-space: nowrap;
}
.footer-copyright a:hover { color: #5ad8cc; }

/* ── Responsive ── */
@media (max-width: 1100px) {
  .footer-inner { padding: 48px; }
  .footer-emailing { width: 360px; }
  .footer-nav { gap: 32px; }
}
@media (max-width: 900px) {
  .footer-inner { padding: 40px 32px; }
  .footer-top { flex-wrap: wrap; gap: 32px; }
  .footer-brand { width: 100%; }
  .footer-emailing { width: 100%; flex-shrink: 1; }
}
@media (max-width: 640px) {
  .site-footer { padding: 10px; }
  .footer-inner { padding: 32px 20px; border-radius: 12px; }
  .footer-top { flex-direction: column; gap: 28px; }
  .footer-emailing { width: 100%; }
  .footer-nav { gap: 24px; flex-wrap: wrap; }
  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    padding-top: 20px;
  }
  .footer-copyright { justify-content: flex-start; gap: 12px; }
  .footer-copyright span,
  .footer-copyright a { font-size: 12px; white-space: normal; }
}

/* Qualiopi badge */
.qualiopi-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--color-accent-light);
  border: 1px solid rgba(0,229,154,.2);
  border-radius: var(--radius-md);
  padding: 8px 16px;
  margin-top: 20px;
  font-size: .8rem;
  font-weight: 600;
  color: var(--color-accent);
  font-family: var(--font-heading);
}

/* ============================================================
   ENTRY CONTENT
============================================================ */
/* entry-content: dark-mode default (most sections are dark) */
.entry-content { color: var(--color-text-muted); line-height: 1.75; }
.entry-content h2,
.entry-content h3 { color: var(--color-text); margin: 32px 0 16px; }
.entry-content p   { margin-bottom: 20px; }
.entry-content ul  { list-style: disc; padding-left: 24px; margin-bottom: 20px; }
.entry-content ol  { list-style: decimal; padding-left: 24px; margin-bottom: 20px; }
.entry-content ul li,
.entry-content ol li { margin-bottom: 8px; }
.entry-content a   { color: var(--color-accent); text-decoration: underline; text-underline-offset: 3px; }
.entry-content a:hover { color: var(--color-accent-dark); }
.entry-content strong { color: var(--color-text); }
.entry-content blockquote {
  border-left: 4px solid var(--color-accent);
  padding-left: 20px;
  margin: 24px 0;
  font-style: italic;
  color: var(--color-text-muted);
}
/* Light section override */
.section-light .entry-content { color: var(--color-light-muted); }
.section-light .entry-content h2,
.section-light .entry-content h3 { color: var(--color-light-text); }
.section-light .entry-content a { color: var(--color-primary); }
.section-light .entry-content strong { color: var(--color-light-text); }
.section-light .entry-content blockquote { color: var(--color-light-muted); }

/* ============================================================
   ANIMATE IN
============================================================ */
.animate-in {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .6s ease, transform .6s ease;
}
.animate-in.visible {
  opacity: 1;
  transform: none;
}

/* ============================================================
   SINGLE CENTRE — galerie + layout + formations sombres
============================================================ */
.sc-galerie {
  padding: 32px 0 0;
  background: var(--color-bg-soft);
}
.sc-galerie-grid {
  display: grid;
  gap: 12px;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.sc-galerie-3 { grid-template-columns: repeat(3, 1fr); }
.sc-galerie-2 { grid-template-columns: repeat(2, 1fr); }
.sc-galerie-1 { grid-template-columns: 1fr; }
.sc-galerie-item {
  height: 280px;
  overflow: hidden;
}
.sc-galerie-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}
.sc-galerie-item:hover img { transform: scale(1.04); }
.sc-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 64px;
  align-items: start;
}
.sc-main h2 { font-size: 1.4rem; margin-bottom: 20px; }
.sc-desc { margin-bottom: 28px; }
.sc-quick-info {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin-top: 28px;
  padding-top: 28px;
  border-top: 1px solid var(--color-border);
}
.sc-quick-item {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: .9rem;
  color: var(--color-text-muted);
}
.sc-quick-item svg { flex-shrink: 0; color: var(--color-accent); }
.sc-quick-item a { color: var(--color-accent); text-decoration: none; }
.sc-quick-item a:hover { text-decoration: underline; }
.sc-sidebar { position: sticky; top: calc(var(--header-height) + 24px); }

/* Section formations — fond sombre */
.sc-formations-section {
  background: var(--color-bg);
  padding: 80px 0;
}
.sc-formations-section .section-header { text-align: center; }
.sc-formations-track-outer { position: relative; margin-top: 40px; }
.sc-formations-track {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  padding-bottom: 8px;
}
.sc-formations-track::-webkit-scrollbar { display: none; }
.sc-fcard {
  flex: 0 0 300px;
  display: flex;
  flex-direction: column;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  scroll-snap-align: start;
  transition: box-shadow .2s, transform .2s;
}
.sc-fcard:hover { box-shadow: 0 8px 24px rgba(0,0,0,.3); transform: translateY(-4px); }
.sc-fcard-img {
  height: 180px;
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, var(--color-primary), #1a3a5c);
  display: flex;
  align-items: center;
  justify-content: center;
}
.sc-fcard-img img { width: 100%; height: 100%; object-fit: cover; }
.sc-fcard-img-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(8,7,23,.6) 0%, transparent 60%);
}
.sc-fcard-img-placeholder { font-size: 3rem; color: rgba(255,255,255,.3); }
.sc-fcard-body { padding: 20px; flex: 1; }
.sc-fcard-badge {
  display: inline-block;
  background: var(--color-accent-light);
  color: var(--color-accent);
  border-radius: 40px;
  padding: 2px 10px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  margin-bottom: 10px;
}
.sc-fcard-body h3 {
  font-size: .95rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
  line-height: 1.3;
}
.sc-fcard-duree {
  font-size: .8rem;
  color: var(--color-text-muted);
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0;
}
.sc-fcard-btn {
  padding: 12px 20px;
  border-top: 1px solid var(--color-border);
  color: var(--color-accent);
  display: flex;
  justify-content: flex-end;
}
.sc-formations-nav {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 28px;
}

@media (max-width: 1024px) {
  .sc-layout { grid-template-columns: 1fr; gap: 40px; }
  .sc-sidebar { position: static; }
  .sc-galerie-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .sc-galerie-3,
  .sc-galerie-2 { grid-template-columns: 1fr; }
  .sc-galerie-item { height: 200px; }
}

/* ============================================================
   OFFRES D'EMPLOI — archive + detail
============================================================ */
.offres-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 48px;
  align-items: start;
}
.offres-filter-card {
  background: var(--color-bg-soft);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  position: sticky;
  top: calc(var(--header-height) + 24px);
}
.offres-filter-title {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--color-border);
}
.offres-filter-group {
  margin-bottom: 16px;
}
.offres-filter-group label {
  display: block;
  font-size: .8rem;
  font-weight: 600;
  color: var(--color-text-muted);
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.offres-filter-group select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--color-light-border);
  border-radius: var(--radius-sm);
  font-size: .875rem;
  background: #fff;
  color: var(--color-light-text);
}
.offres-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.offre-card {
  display: flex;
  flex-direction: column;
  background: var(--color-bg-soft);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: box-shadow .2s, transform .2s;
}
.offre-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.1); transform: translateY(-4px); }
.offre-card-img {
  height: 160px;
  overflow: hidden;
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light));
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.offre-card-img img { width: 100%; height: 100%; object-fit: cover; }
.offre-card-img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(8,7,23,.6) 0%, transparent 60%);
}
.offre-card-img-placeholder {
  background: linear-gradient(135deg, var(--color-primary) 0%, #1a3a5c 100%);
}
.offre-card-body { padding: 20px; display: flex; flex-direction: column; flex: 1; }
.offre-card-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.offre-tag {
  background: var(--color-accent-light);
  color: var(--color-accent);
  border-radius: 40px;
  padding: 2px 10px;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .06em;
}
.offre-card-title { font-size: 1rem; font-weight: 700; margin-bottom: 6px; line-height: 1.3; }
.offre-card-lieu { font-size: .8rem; color: var(--color-text-muted); margin-bottom: 8px; display: flex; align-items: center; gap: 4px; }
.offre-card-excerpt { font-size: .8rem; color: var(--color-text-muted); margin: 0 0 12px; line-height: 1.5; flex: 1; }
.offre-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 12px;
  border-top: 1px solid var(--color-border);
  font-size: .78rem;
}
.offre-card-date { color: var(--color-text-muted); }
.offre-card-cta { color: var(--color-accent); font-weight: 600; display: flex; align-items: center; gap: 4px; }

/* Single offre detail */
.offre-detail-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 64px;
  align-items: start;
}
.offre-intro {
  font-size: 1.05rem;
  font-weight: 500;
  color: var(--color-text);
  border-left: 4px solid var(--color-accent);
  padding-left: 20px;
  margin-bottom: 32px;
  line-height: 1.6;
}
.offre-section {
  margin-bottom: 36px;
  padding-bottom: 36px;
  border-bottom: 1px solid var(--color-border);
}
.offre-section:last-child { border-bottom: none; }
.offre-section h2 { font-size: 1.2rem; margin-bottom: 16px; }

/* ============================================================
   VIE ÉTUDIANTE
============================================================ */
.ve-galerie {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 8px;
}
.ve-galerie-item {
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 4/3;
  background: var(--color-bg-soft);
}
.ve-galerie-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}
.ve-galerie-item:hover img { transform: scale(1.05); }
.ve-galerie-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  background: linear-gradient(135deg, var(--color-bg-blue), var(--color-accent-light));
}
.ve-assos-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 8px;
}
.ve-asso-card {
  background: var(--color-bg-soft);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  text-align: center;
  transition: box-shadow .2s, transform .2s;
}
.ve-asso-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-3px); }
.ve-asso-logo {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  overflow: hidden;
  margin: 0 auto 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-accent-light);
}
.ve-asso-logo img { width: 100%; height: 100%; object-fit: cover; }
.ve-asso-logo-placeholder { font-size: 2rem; }
.ve-asso-card h4 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; }
.ve-asso-card p { font-size: .875rem; color: var(--color-text-muted); margin-bottom: 12px; line-height: 1.5; }
.ve-asso-tags { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; }

/* ============================================================
   SEARCH — tabs + résultats
============================================================ */
.search-hero {
  background: var(--color-bg);
  border-bottom: 1px solid var(--color-border);
  padding: 60px 0 40px;
}
.search-hero h1 { color: #fff; margin-bottom: 24px; }
.search-count {
  margin-top: 12px;
  font-size: .9rem;
  color: var(--color-text-muted);
}
.search-form {
  display: flex;
  gap: 0;
  max-width: 640px;
  background: #fff;
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid var(--color-border);
}
.search-form input[type="search"] {
  flex: 1;
  padding: 14px 20px;
  border: none;
  outline: none;
  font-size: 1rem;
  background: transparent;
}
.search-form button {
  background: var(--color-accent);
  color: #000;
  border: none;
  padding: 14px 20px;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  transition: background .2s;
}
.search-form button:hover { background: var(--color-accent-hover, #00c97a); }
.search-tabs {
  display: flex;
  gap: 0;
  border-bottom: 2px solid var(--color-light-border);
  margin-bottom: 32px;
}
.search-tab {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 20px;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  font-size: .9rem;
  font-weight: 600;
  color: var(--color-light-muted);
  cursor: pointer;
  transition: color .15s;
}
.search-tab:hover { color: var(--color-light-text); }
.search-tab.active {
  color: var(--color-primary);
  border-bottom-color: var(--color-primary);
}
.search-tab-count {
  background: var(--color-light-bg);
  border-radius: 40px;
  padding: 1px 8px;
  font-size: .75rem;
  font-weight: 700;
  color: var(--color-light-muted);
}
.search-tab.active .search-tab-count {
  background: rgba(0,0,0,.07);
  color: var(--color-primary);
}
.search-results-list { display: flex; flex-direction: column; gap: 12px; }
.search-result-card {
  display: flex;
  gap: 20px;
  align-items: center;
  padding: 20px;
  background: #fff;
  border: 1px solid var(--color-light-border);
  border-radius: var(--radius-lg);
  text-decoration: none;
  color: inherit;
  transition: box-shadow .2s, transform .15s;
}
.search-result-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); transform: translateX(4px); }
.search-result-thumb {
  width: 100px;
  height: 72px;
  flex-shrink: 0;
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.search-result-thumb img { width: 100%; height: 100%; object-fit: cover; }
.search-result-body { flex: 1; }
.search-result-type {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--color-accent);
  margin-bottom: 4px;
}
.search-result-body h3 { font-size: 1rem; margin-bottom: 4px; color: var(--color-light-text); }
.search-result-body p { font-size: .875rem; color: var(--color-light-muted); margin: 0; }
.search-result-arrow { flex-shrink: 0; color: var(--color-light-muted); transition: color .15s; }
.search-result-card:hover .search-result-arrow { color: var(--color-accent); }

/* ============================================================
   CONTACT PAGE — sidebar + form layout
============================================================ */
.contact-sidebar {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.contact-method {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px;
  background: var(--color-bg-soft);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
}
.contact-method-icon {
  width: 44px;
  height: 44px;
  background: var(--color-accent-light);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--color-accent);
}
.contact-method strong {
  display: block;
  font-size: .9rem;
  font-weight: 700;
  color: var(--color-light-text);
  margin-bottom: 4px;
}
.contact-method a {
  display: block;
  color: var(--color-primary);
  font-weight: 600;
  text-decoration: none;
  font-size: .95rem;
}
.contact-method a:hover { text-decoration: underline; }
.contact-method span {
  display: block;
  font-size: .8rem;
  color: var(--color-text-muted);
  margin-top: 2px;
}
.contact-form-wrap h2 {
  font-size: 1.4rem;
  margin-bottom: 28px;
}
.form-checks {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.form-check-label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: .85rem;
  color: var(--color-text-muted);
  cursor: pointer;
}
.form-check-label input[type="checkbox"] {
  margin-top: 2px;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  accent-color: var(--color-accent);
}
.required { color: var(--color-accent); font-size: .85rem; }
.form-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  border-radius: var(--radius-md);
  font-size: .9rem;
  margin-bottom: 24px;
}
.form-alert-success {
  background: var(--color-accent-light);
  border: 1px solid rgba(0,229,154,.3);
  color: var(--color-accent);
}
.form-alert-error {
  background: #fff5f5;
  border: 1px solid #fecaca;
  color: #dc2626;
}

/* ============================================================
   ALTERNANCE — salary table + aides + FAQ
============================================================ */
.alt-salary-table-wrap {
  overflow-x: auto;
  border-radius: var(--radius-lg);
  border: 1px solid var(--color-border);
}
.alt-salary-table {
  width: 100%;
  border-collapse: collapse;
  font-size: .9rem;
}
.alt-salary-table th,
.alt-salary-table td {
  padding: 14px 20px;
  text-align: left;
  border-bottom: 1px solid var(--color-border);
}
.alt-salary-table thead th {
  background: var(--color-primary);
  color: #fff;
  font-weight: 700;
  font-family: var(--font-heading);
}
.alt-salary-table tbody tr:last-child td { border-bottom: none; }
.alt-salary-table tbody tr:nth-child(even) { background: var(--color-bg-soft); }
.alt-salary-table small { font-size: .75rem; opacity: .75; }
.alt-salary-note {
  padding: 12px 20px;
  font-size: .78rem;
  color: var(--color-text-muted);
  background: var(--color-bg-soft);
  border-top: 1px solid var(--color-border);
}
.alt-aides-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 8px;
}
.alt-aide-card {
  background: var(--color-bg-soft);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  transition: box-shadow .2s, transform .2s;
}
.alt-aide-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-3px); }
.alt-aide-tag {
  display: inline-block;
  background: var(--color-accent-light);
  color: var(--color-accent);
  border-radius: 40px;
  padding: 3px 12px;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-bottom: 12px;
}
.alt-aide-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; }
.alt-aide-card p { font-size: .875rem; color: var(--color-text-muted); margin: 0; line-height: 1.55; }

/* ============================================================
   FAQ ACCORDION (Alternance, Centres, …)
============================================================ */
.faq-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.faq-item {
  border-bottom: 1px solid var(--color-border);
}
.faq-item:last-child { border-bottom: none; }
.faq-question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px;
  background: #fff;
  border: none;
  cursor: pointer;
  text-align: left;
  font-size: .95rem;
  font-weight: 600;
  color: var(--color-light-text);
  transition: background .15s;
}
.faq-question:hover { background: var(--color-bg-soft); }
.faq-question[aria-expanded="true"] { background: var(--color-bg-soft); }
.faq-chevron {
  flex-shrink: 0;
  transition: transform .25s ease;
  color: var(--color-text-muted);
}
.faq-question[aria-expanded="true"] .faq-chevron { transform: rotate(180deg); }
.faq-answer {
  padding: 0 24px 20px;
  background: var(--color-bg-soft);
}
.faq-answer[hidden] { display: none; }
.faq-answer p {
  font-size: .9rem;
  color: var(--color-text-muted);
  margin: 0;
  line-height: 1.65;
}

/* ============================================================
   LE PÔLE — stats, certifications, accessibilité, partenaires
============================================================ */
.pole-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 8px;
}
.pole-stat-card {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 36px 24px;
  text-align: center;
  transition: box-shadow .2s, transform .2s;
}
.pole-stat-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-3px); }
.pole-stat-val {
  font-size: 2.6rem;
  font-weight: 800;
  font-family: var(--font-heading);
  color: var(--color-primary);
  line-height: 1;
}
.pole-stat-label {
  font-size: .9rem;
  color: var(--color-text-muted);
  margin-top: 8px;
}
.certifs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 8px;
}
.certif-card {
  background: var(--color-bg-soft);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  text-align: center;
  transition: box-shadow .2s, transform .2s;
}
.certif-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-3px); }
.certif-logo {
  width: 72px;
  height: 72px;
  background: var(--color-accent-light);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}
.certif-card h3 { font-size: 1.05rem; font-weight: 700; margin-bottom: 10px; }
.certif-card p { font-size: .875rem; color: var(--color-text-muted); margin: 0; line-height: 1.55; }
.pole-accessi-wrap {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 80px;
  align-items: center;
}
.pole-accessi-visual {
  display: flex;
  align-items: center;
  justify-content: center;
}
.pole-accessi-icon {
  width: 160px;
  height: 160px;
  background: var(--color-accent-light);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.partenaire-item {
  padding: 16px 28px;
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 64px;
  transition: box-shadow .2s;
}
.partenaire-item:hover { box-shadow: 0 4px 16px rgba(0,0,0,.08); }
.partenaire-item img { max-height: 40px; max-width: 120px; object-fit: contain; }
.partenaire-item-text {
  font-size: .9rem;
  font-weight: 600;
  color: var(--color-text-muted);
  text-align: center;
}

/* ============================================================
   CENTRES — why choose us grid
============================================================ */
.centres-why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 8px;
}
.centres-why-card {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 32px 24px;
  text-align: center;
  transition: box-shadow .2s, transform .2s;
}
.centres-why-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-3px); }
.centres-why-icon {
  width: 64px;
  height: 64px;
  background: var(--color-accent-light);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}
.centres-why-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; }
.centres-why-card p { font-size: .875rem; color: var(--color-text-muted); margin: 0; line-height: 1.55; }

/* ============================================================
   RESPONSIVE
============================================================ */
@media (max-width: 1024px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
  .formations-grid { grid-template-columns: repeat(2, 1fr); }
  .centres-grid { grid-template-columns: repeat(2, 1fr); }
  .stats-band .container { grid-template-columns: repeat(3, 1fr); }
  .formation-layout { grid-template-columns: 1fr; }
  .formation-sidebar { position: static; }
  .nav-pill { gap: 0; }
  .nav-pill a { padding: 8px 12px; font-size: .82rem; }
  .pole-stats-grid { grid-template-columns: repeat(3, 1fr); }
  .certifs-grid { grid-template-columns: 1fr 1fr; }
  .pole-accessi-wrap { grid-template-columns: 1fr; gap: 40px; }
  .alt-aides-grid { grid-template-columns: 1fr 1fr; }
  .centres-why-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  :root { --header-height: 68px; --topbar-height: 0px; }
  .container { padding: 0 16px; }
  .section { padding: 32px 0; }
  .section-sm { padding: 24px 0; }
  .section-lg { padding: 48px 0; }
  .main-nav, .header-actions .btn-cta { display: none; }
  .burger-btn { display: flex; }
  /* ── Header mobile — Figma pixel-perfect ── */
  .logo-svg           { height: 32px; }
  .header-actions     { gap: 8px; }
  /* Bouton Search — cercle blanc 44×44, icône 20px */
  .header-search-btn  { background: #ffffff; border-radius: 200px; width: 44px; height: 44px; padding: 0; justify-content: center; color: var(--color-primary); transition: none; }
  .header-search-icon { width: 20px; height: 20px; }
  .header-search-btn:hover { padding: 0; gap: 0; background: #ffffff; }
  /* Burger — cercle blanc 44×44, barres sombres */
  .burger-btn         { background: #ffffff; border-radius: 200px; width: 44px; height: 44px; padding: 0; gap: 5px; justify-content: center; }
  .burger-btn span    { background: var(--color-primary); }
  .formations-grid { grid-template-columns: 1fr; }
  .centres-grid { grid-template-columns: 1fr; }
  .stats-band .container { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .form-grid { grid-template-columns: 1fr; }
  .cta-banner { padding: 48px 28px; }
  .hero { min-height: 90vh; align-items: flex-end; padding-bottom: 60px; }
  .hero > .container { padding-left: 20px; padding-right: 20px; }
  .hero-photo-gradient { background: linear-gradient(to right, rgba(8,7,23,1) 0%, rgba(8,7,23,.95) 50%, rgba(8,7,23,.7) 100%); }
  .hero-content { max-width: 100%; padding: 40px 0; }
  /* tracks : padding géré par .track-offset */
  .track-offset { flex: none; width: 20px; }
  .carousel-track { padding-right: 20px; }
  .slider-track { padding-right: 20px; }
  .temoignage-card { flex: 0 0 calc(100vw - 48px); }
  .section-header-row { flex-direction: column; align-items: flex-start; }
  .top-bar { display: none; }
  .contact-layout { grid-template-columns: 1fr; gap: 40px; }
  .pole-stats-grid { grid-template-columns: 1fr 1fr; }
  .certifs-grid { grid-template-columns: 1fr; }
  .alt-aides-grid { grid-template-columns: 1fr; }
  .centres-why-grid { grid-template-columns: 1fr 1fr; }
  .offres-layout { grid-template-columns: 1fr; }
  .offres-grid { grid-template-columns: 1fr 1fr; }
  .offre-detail-layout { grid-template-columns: 1fr; }
  .ve-galerie { grid-template-columns: repeat(2, 1fr); }
  .ve-assos-grid { grid-template-columns: 1fr 1fr; }
  .search-tabs { overflow-x: auto; }
}

@media (max-width: 480px) {
  .hero-actions { flex-direction: column; }
  .hero-actions .btn { width: 100%; justify-content: center; }
  .domain-img-card { flex: 0 0 240px; height: 320px; }
  .pole-stats-grid { grid-template-columns: 1fr; }
  .centres-why-grid { grid-template-columns: 1fr; }
  .offres-grid { grid-template-columns: 1fr; }
  .ve-galerie { grid-template-columns: 1fr; }
  .ve-assos-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════════
   LE PÔLE — v2.51.0
   ══════════════════════════════════════════════════════════════ */

/* ─── Hero ──────────────────────────────────────────────────── */
.pole-hero {
  background: var(--color-primary);
  padding: 80px 0;
  overflow: hidden;
}
.pole-hero-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}
.pole-hero-content h1 { color: #fff; }
.pole-hero-content .subtitle { color: rgba(255,255,255,.78); }
.pole-hero-photos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  gap: 12px;
}
.pole-hero-photo { border-radius: var(--radius-md); overflow: hidden; }
.pole-hero-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pole-hero-photo-1 { grid-column: 1; grid-row: 1 / 3; min-height: 280px; }
.pole-hero-photo-2 { grid-column: 2; grid-row: 1; min-height: 130px; }
.pole-hero-photo-3 { grid-column: 2; grid-row: 2; min-height: 130px; }
.pole-hero-photo-empty { background: rgba(255,255,255,.08); }

/* ─── Ce qu'on fait pour vous ───────────────────────────────── */
.pole-mission-grid {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 64px;
  align-items: start;
  margin-top: 8px;
}
.pole-mission-left h2 { margin-top: 0; }
.pole-mission-texte p { color: var(--color-text-muted); margin-bottom: 16px; line-height: 1.7; }
.pole-mission-card {
  background: var(--color-bg-soft);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
}
.pole-mission-card h4 {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 16px;
  color: var(--color-primary);
}
.pole-mission-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pole-mission-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: .9rem;
  color: var(--color-text-muted);
  line-height: 1.5;
}
.pole-mission-list li::before {
  content: '';
  flex-shrink: 0;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--color-accent-light);
  border: 2px solid var(--color-accent);
  margin-top: 1px;
}

/* ─── Notre histoire ────────────────────────────────────────── */
.pole-histoire-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}
.pole-annee-stat { margin-bottom: 8px; }
.pole-annee-num {
  font-size: clamp(3rem, 6vw, 5rem);
  font-weight: 800;
  font-family: var(--font-heading);
  color: var(--color-primary);
  line-height: 1;
}
.pole-annee-sub {
  font-size: .95rem;
  color: var(--color-text-muted);
  margin-top: 8px;
  line-height: 1.5;
}
.pole-chiffres-row {
  display: flex;
  gap: 32px;
  flex-wrap: wrap;
}
.pole-chiffre-item { min-width: 80px; }
.pole-chiffre-val {
  font-size: 1.8rem;
  font-weight: 800;
  font-family: var(--font-heading);
  color: var(--color-primary);
  line-height: 1;
}
.pole-chiffre-lbl {
  font-size: .78rem;
  color: var(--color-text-muted);
  margin-top: 4px;
  line-height: 1.3;
}
.pole-histoire-right img {
  width: 100%;
  border-radius: var(--radius-xl);
  object-fit: cover;
  max-height: 420px;
}
.pole-histoire-placeholder {
  background: linear-gradient(135deg, var(--color-primary), var(--color-primary-light));
  border-radius: var(--radius-xl);
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 4rem;
}

/* ─── Certifications ────────────────────────────────────────── */
.pole-certifs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.pole-certif-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  transition: box-shadow .25s, transform .25s;
}
.pole-certif-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-3px); }
.pole-certif-icon {
  width: 56px; height: 56px;
  background: var(--color-bg-soft);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.pole-certif-card h3 { font-size: 1.05rem; font-weight: 700; margin: 0 0 8px; }
.pole-certif-desc1 {
  font-size: .82rem;
  color: var(--color-accent);
  font-weight: 600;
  margin: 0 0 8px;
}
.pole-certif-card p {
  font-size: .85rem;
  color: var(--color-text-muted);
  margin: 0 0 6px;
  line-height: 1.55;
}
.pole-certif-link {
  display: inline-block;
  margin-top: 12px;
  font-size: .82rem;
  font-weight: 600;
  color: var(--color-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.pole-certif-link:hover { color: var(--color-primary); }

/* ─── Accessibilité ─────────────────────────────────────────── */
.pole-accessi-section {
  background: #f0fdf4;
  padding: 80px 0;
}
.pole-accessi-section h2 { margin: 8px 0 0; }
.pole-accessi-sous {
  font-size: 1rem;
  color: #16a34a;
  font-weight: 500;
  margin: 4px 0 32px;
}
.pole-accessi-inner { max-width: 640px; }
.pole-accessi-body p { color: var(--color-text-muted); margin-bottom: 20px; line-height: 1.7; }
.pole-accessi-body strong { display: block; margin-bottom: 12px; color: var(--color-primary); }
.pole-accessi-liste {
  list-style: none;
  padding: 0;
  margin: 0 0 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pole-accessi-liste li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: .9rem;
  color: var(--color-text-muted);
}
.pole-accessi-liste li::before {
  content: '';
  flex-shrink: 0;
  width: 20px; height: 20px;
  background: #22c55e;
  border-radius: 50%;
  background-image: url(data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23fff' stroke-width='2.5' viewBox='0 0 24 24'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E);
  background-repeat: no-repeat;
  background-position: center;
}

/* ─── Nos valeurs ───────────────────────────────────────────── */
.pole-valeurs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 8px;
}
.pole-valeur-card {
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  transition: box-shadow .25s, transform .25s;
}
.pole-valeur-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.08); transform: translateY(-3px); }
.pole-valeur-icon {
  width: 52px; height: 52px;
  background: var(--color-bg-soft);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}
.pole-valeur-card h3 { font-size: 1.05rem; font-weight: 700; margin: 0 0 10px; }
.pole-valeur-desc { font-size: .875rem; color: var(--color-text-muted); line-height: 1.6; margin-bottom: 16px; }
.pole-valeur-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pole-valeur-card ul li {
  font-size: .82rem;
  color: var(--color-text-muted);
  padding-left: 14px;
  position: relative;
}
.pole-valeur-card ul li::before {
  content: '•';
  position: absolute;
  left: 0;
  color: var(--color-accent);
}

/* ─── Erasmus+ ──────────────────────────────────────────────── */
.pole-erasmus-section {
  background: var(--color-light-bg);
  padding: 80px 0;
}
.pole-erasmus-left h2 { color: var(--color-light-text); }
.pole-erasmus-left > p { color: var(--color-light-muted); }
.pole-erasmus-card-icon { background: rgba(0,184,122,.1) !important; }
.pole-erasmus-liste li { color: var(--color-light-muted) !important; }
.pole-erasmus-grid {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 64px;
  align-items: start;
}
.pole-erasmus-left h2 { margin-top: 0; }
.pole-erasmus-card {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
}
.pole-erasmus-card-icon {
  width: 52px; height: 52px;
  background: var(--color-bg-soft);
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}
.pole-erasmus-card h4 { font-size: 1rem; font-weight: 700; margin: 0 0 8px; }
.pole-erasmus-card > p { font-size: .875rem; color: var(--color-text-muted); margin-bottom: 16px; }
.pole-erasmus-liste {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.pole-erasmus-liste li {
  font-size: .85rem;
  color: var(--color-text-muted);
  padding-left: 16px;
  position: relative;
  line-height: 1.5;
}
.pole-erasmus-liste li::before {
  content: '→';
  position: absolute;
  left: 0;
  color: var(--color-accent);
  font-size: .75rem;
}

/* ══════════════════════════════════════════════════════════════
   ALTERNANCE — v2.51.0
   ══════════════════════════════════════════════════════════════ */

.alt-comment-section {
  background: var(--color-primary);
  padding: 64px 0;
}
.alt-comment-section h2 { color: #fff; margin-top: 0; }
.alt-comment-body { max-width: 680px; margin-top: 20px; }
.alt-comment-body p { color: rgba(255,255,255,.78); line-height: 1.75; margin-bottom: 16px; font-size: 1.05rem; }
.alt-salary-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start;
}
.alt-salary-intro h2 { margin-top: 0; }
.alt-aide-montant {
  font-size: 1.5rem;
  font-weight: 800;
  font-family: var(--font-heading);
  color: var(--color-primary);
  margin-bottom: 8px;
}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE — v2.51.0
   ══════════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
  .pole-hero-inner { grid-template-columns: 1fr; gap: 40px; }
  .pole-mission-grid { grid-template-columns: 1fr; gap: 32px; }
  .pole-histoire-grid { grid-template-columns: 1fr; gap: 40px; }
  .pole-certifs-grid { grid-template-columns: 1fr 1fr; }
  .pole-valeurs-grid { grid-template-columns: 1fr 1fr; }
  .pole-erasmus-grid { grid-template-columns: 1fr; gap: 32px; }
  .alt-salary-layout { grid-template-columns: 1fr; gap: 32px; }
}

@media (max-width: 768px) {
  .pole-hero { padding: 48px 0; }
  .pole-hero-photos { display: none; }
  .pole-certifs-grid { grid-template-columns: 1fr; }
  .pole-valeurs-grid { grid-template-columns: 1fr; }
  .alt-aides-grid { grid-template-columns: 1fr; }
}

/* actu-card-v2 styles consolidated below in ACTUALITÉS section */

/* ── Actus grid homepage — Figma: gap 32px ────────────────────────── */
.actus-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
.actus-grid--2cols { grid-template-columns: repeat(2, 1fr) !important; }
.actus-grid--3cols { grid-template-columns: repeat(3, 1fr) !important; }
@media (max-width: 1100px) {
  .actus-grid,
  .actus-grid--3cols,
  .actus-grid--4cols { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}
@media (max-width: 640px) {
  .actus-grid,
  .actus-grid--2cols,
  .actus-grid--3cols,
  .actus-grid--4cols { grid-template-columns: 1fr !important; gap: 16px; }
  .actus-header { flex-direction: column; align-items: flex-start; gap: 16px; }
  .actus-header h2 { font-size: 1.75rem; }
}



/* ── Brochure footer feedback messages ────────────────────────────── */
.footer-brochure-success {
  background: rgba(123,224,214,.15);
  border: 1px solid var(--color-accent);
  color: var(--color-accent);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-size: .85rem;
  font-weight: 600;
  margin-bottom: 12px;
}
.footer-brochure-error {
  background: rgba(239,68,68,.12);
  border: 1px solid #ef4444;
  color: #ef4444;
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-size: .85rem;
  font-weight: 600;
  margin-bottom: 12px;
}

/* ════════════════════════════════════════════════════════════════════
   Carte Grand Est — page Centres
═══════════════════════════════════════════════════════════════════════ */
.centres-map-section { background: #fff; }

.centres-map-wrap {
  /* pas de card — la carte flotte sur le fond de section (Figma) */
}

.centres-map-svg {
  width: 100%;
  height: auto;
  display: block;
}

/* Contour région */
.grand-est-outline {
  filter: drop-shadow(0 2px 8px rgba(26,107,62,.15));
}

/* Pins */
.map-pin {
  cursor: pointer;
  transition: transform .2s;
  transform-origin: center;
}
.map-pin:hover {
  transform: scale(1.12);
}
.map-pin:hover circle:first-child {
  fill: rgba(16,185,129,.35);
}

/* Labels */
.map-pin-label {
  font-size: 10.5px;
  font-family: var(--font-body), system-ui, sans-serif;
  font-weight: 600;
  fill: #334155;
  text-anchor: middle;
  pointer-events: none;
  letter-spacing: .01em;
}
.map-pin-label-main {
  fill: #0d6b5e;
  font-size: 11.5px;
}

@media (max-width: 640px) {
  .centres-map-wrap { border-radius: var(--radius-md); }
  .map-pin-label { font-size: 8px; }
}

/* ============================================================
   FOOTER — séparateurs et certifications
============================================================ */
.footer-sep {
  opacity: .3;
  margin: 0 2px;
}
.footer-cert {
  color: rgba(255,255,255,.5);
  text-decoration: none;
  transition: color .2s;
}
.footer-cert:hover { color: var(--color-accent); }

/* ============================================================
   CONTACT PAGE — section claire (Figma : fond blanc)
============================================================ */
.contact-page-header {
  background: #fff;
  padding: 56px 0 48px;
  border-bottom: 1px solid var(--color-light-border);
}
.contact-page-header h1 {
  font-size: clamp(2rem, 3vw, 2.8rem);
  font-weight: 700;
  color: var(--color-light-text);
  margin-bottom: 10px;
}
.contact-page-header p {
  color: var(--color-light-muted);
  font-size: 1.05rem;
  margin: 0;
}

/* Contact section light overrides */
.section-light .contact-method {
  background: #fff;
  border-color: var(--color-light-border);
}
.section-light .contact-method strong {
  color: var(--color-light-text);
}
.section-light .contact-method a {
  color: var(--color-light-text);
}
.section-light .contact-method span {
  color: var(--color-light-muted);
}
.section-light .contact-method-icon {
  background: rgba(0,184,122,.1);
  color: #00B87A;
}
.section-light .contact-form-wrap h2 {
  color: var(--color-light-text);
}
.section-light .form-check-label {
  color: var(--color-light-muted);
}
.section-light .form-check-label a {
  color: var(--color-light-text);
}
.section-light .required {
  color: var(--color-accent-dark);
}
.section-light .form-group label {
  color: var(--color-light-muted);
}

/* FAQ — fond sombre sur sections avec dark bg */
.section:not(.section-light) .faq-question {
  background: var(--color-surface);
  color: var(--color-text);
}
.section:not(.section-light) .faq-question:hover,
.section:not(.section-light) .faq-question[aria-expanded="true"] {
  background: var(--color-surface-2);
}
.section:not(.section-light) .faq-answer {
  background: var(--color-surface);
}
.section:not(.section-light) .faq-answer p {
  color: var(--color-text-muted);
}

/* ============================================================
   PAGE HERO LIGHT — pages internes à fond clair
============================================================ */
.page-hero-light {
  background: var(--color-light-bg);
  border-bottom: 1px solid var(--color-light-border);
}
.page-hero-light h1 {
  font-size: clamp(1.8rem, 3vw, 2.4rem);
  color: var(--color-light-text);
}
.page-hero-light p {
  color: var(--color-light-muted);
}

/* ============================================================
   LE PÔLE — section-light overrides
   Ensures components with hardcoded dark-theme colors render
   correctly when placed inside .section-light sections.
============================================================ */
.section-light .pole-mission-texte p,
.section-light .pole-mission-list li { color: var(--color-light-muted); }
.section-light .pole-mission-card {
  background: #fff;
  border-color: var(--color-light-border);
}

.section-light .pole-annee-sub,
.section-light .pole-chiffre-lbl { color: var(--color-light-muted); }
.section-light .pole-histoire-placeholder { color: var(--color-light-muted); }

.section-light .pole-certif-card {
  background: #fff;
  border-color: var(--color-light-border);
}
.section-light .pole-certif-card p { color: var(--color-light-muted); }
.section-light .pole-certif-icon {
  background: var(--color-light-bg);
}

.section-light .pole-valeur-card {
  background: #fff;
  border-color: var(--color-light-border);
}
.section-light .pole-valeur-desc { color: var(--color-light-muted); }
.section-light .pole-valeur-card ul li { color: var(--color-light-muted); }
.section-light .pole-valeur-icon { background: rgba(0,184,122,.1); }

.section-light .partenaire-item { border-color: var(--color-light-border); }
.section-light .partenaire-item-text { color: var(--color-light-muted); }

/* Single Centre — section-light overrides */
.section-light .sc-quick-item { color: var(--color-light-muted); }
.section-light .sc-quick-item a { color: var(--color-primary); }
.section-light .sc-quick-info { border-top-color: var(--color-light-border); }
.section-light .sc-main h2 { color: var(--color-light-text); }

/* Vie Étudiante — section-light overrides */
.section-light .ve-asso-card { background: #fff; border-color: var(--color-light-border); }
.section-light .ve-asso-card h4 { color: var(--color-light-text); }
.section-light .ve-asso-card p { color: var(--color-light-muted); }
.section-light .ve-galerie-item { background: var(--color-light-border); }
.section-light .ve-asso-logo { background: rgba(0,184,122,.1); }

/* ============================================================
   SIDEBAR CARD — single-formation, single-centre, single-offre
============================================================ */
.sidebar-card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  overflow: hidden;
}
.sidebar-card-header {
  background: var(--color-primary);
  padding: 24px 28px;
}
.sidebar-card-header .price-label,
.sidebar-card-header > .price-label {
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.7);
  margin: 0 0 6px;
}
.sidebar-card-header .price {
  font-size: 2rem;
  font-weight: 800;
  font-family: var(--font-heading);
  color: #fff;
  line-height: 1.1;
  margin: 0;
}
.sidebar-card-body {
  padding: 24px 28px;
}

/* Sidebar meta rows (icon + label + value) */
.sidebar-meta {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--color-border);
}
.sidebar-meta-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: .875rem;
}
.sidebar-meta-item svg {
  flex-shrink: 0;
  color: var(--color-accent);
  margin-top: 2px;
}
.sidebar-meta-item > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.sidebar-meta-item strong {
  display: block;
  font-weight: 600;
  font-size: .8rem;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.sidebar-meta-item span,
.sidebar-meta-item a {
  color: var(--color-text);
  font-weight: 500;
  text-decoration: none;
}
.sidebar-meta-item a:hover { color: var(--color-accent); }

/* Formation single — meta bar above tabs */
.formation-meta-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  padding: 16px 20px;
  background: var(--color-bg-soft);
  border-radius: var(--radius-md);
  margin-bottom: 28px;
}
.meta-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 100px;
}
.meta-label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.meta-label svg { flex-shrink: 0; }
.meta-value {
  font-size: .9rem;
  font-weight: 600;
  color: var(--color-text);
}

/* ============================================================
   TAGS / BADGES — used in single-formation, actu cards, etc.
============================================================ */
.tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 12px;
  border-radius: 40px;
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .04em;
  line-height: 1.4;
  white-space: nowrap;
}
.tag-domain {
  background: var(--color-accent-light);
  color: var(--color-accent);
}
.formation-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
/* Tag color variants */
.tag-modalite {
  background: rgba(255,255,255,.12);
  color: rgba(255,255,255,.9);
}
.tag-niveau {
  background: rgba(123,224,214,.15);
  color: var(--color-accent);
}
.tag-certif {
  background: #10B981;
  color: #fff;
}

/* Formation main area */
.formation-main { min-width: 0; }

/* ============================================================
   BTN-OUTLINE — generic bordered button (used sitewide)
============================================================ */
.btn-outline {
  background: transparent;
  border: 2px solid rgba(255,255,255,.25);
  color: var(--color-text);
}
.btn-outline:hover {
  background: rgba(255,255,255,.07);
  border-color: var(--color-accent);
  color: var(--color-accent);
  transform: translateY(-1px);
}
/* On light backgrounds */
.section-light .btn-outline,
.page-hero-light .btn-outline {
  border-color: var(--color-light-border);
  color: var(--color-light-text);
}
.section-light .btn-outline:hover,
.page-hero-light .btn-outline:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
  background: rgba(0,79,61,.06);
}

/* ============================================================
   PAGINATION — .pagination wrapper (used in archive pages)
============================================================ */
.pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 48px;
}
.pagination a, .pagination span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 10px;
  border-radius: var(--radius-sm);
  font-size: .9rem;
  font-weight: 600;
  font-family: var(--font-heading);
  border: 1px solid var(--color-border);
  color: var(--color-text);
  background: var(--color-surface);
  text-decoration: none;
  transition: var(--transition);
}
.pagination a:hover { border-color: var(--color-accent); color: var(--color-accent); }
.pagination .current { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-bg); }
.pagination .dots { background: transparent; border-color: transparent; color: var(--color-text-muted); }

/* ============================================================
   OFFRES ARCHIVE — offres-sidebar, offres-main, offres-count
   OFFRE SINGLE   — offre-detail-sidebar
   (Used in archive-offre.php and single-offre.php)
============================================================ */
.offres-sidebar { /* the filter aside — layout done by .offres-layout grid */ }
.offres-main { min-width: 0; }
.offres-count { color: var(--color-text-muted); font-size: .9rem; }
.offre-detail-sidebar {
  position: sticky;
  top: calc(var(--header-height) + 24px);
}
@media (max-width: 1024px) {
  .offre-detail-layout { grid-template-columns: 1fr !important; }
  .offre-detail-sidebar { position: static; }
}

/* ============================================================
   SEARCH PAGE — search-hero, search-form
   (Used in search.php)
============================================================ */
.search-hero {
  background: var(--color-bg-soft);
  padding: 60px 0 48px;
}
.search-hero h1 { color: var(--color-text); margin-bottom: 24px; }
.search-form {
  display: flex;
  align-items: center;
  gap: 12px;
  max-width: 600px;
}
.search-form input[type="search"] {
  flex: 1;
  padding: 14px 20px;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  color: var(--color-text);
  font-size: 1rem;
  outline: none;
  font-family: var(--font-body);
}
.search-form input[type="search"]::placeholder { color: var(--color-text-muted); }
.search-form input[type="search"]:focus { border-color: var(--color-accent); }
.search-form button {
  padding: 14px 20px;
  background: var(--color-accent);
  color: var(--color-bg);
  border-radius: var(--radius-md);
  border: none;
  cursor: pointer;
  transition: var(--transition);
}
.search-form button:hover { background: var(--color-accent-dark); }
.search-count { color: var(--color-text-muted); font-size: .9rem; margin-top: 12px; }

/* ============================================================
   PAGE RECHERCHE — fond clair + header transparent + sr-*
============================================================ */
body.page-template-page-rechercher {
  background:
    radial-gradient(ellipse 1600px 1400px at 50% -80px, rgba(182,218,240,0.62) 0%, rgba(210,235,247,0.32) 50%, transparent 72%),
    #ffffff;
}
.page-template-page-rechercher .site-main,
.page-template-page-rechercher main,
.page-template-page-rechercher #main,
.page-template-page-rechercher .site-content,
.page-template-page-rechercher #content { background: transparent; }
.page-template-page-rechercher .logo-svg,
.page-template-page-rechercher .custom-logo { filter: brightness(0); }

/* ── Barre de recherche centrée ── */
.sr-search-wrapper { padding: 0 0 48px; }
.sr-search-wrapper .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
.sr-search-form {
  display: flex;
  align-items: center;
  width: 100%;
  max-width: 700px;
  background: #ffffff;
  border-radius: 999px;
  padding: 6px 6px 6px 24px;
  box-shadow: 0 2px 16px rgba(13,31,41,0.08);
}
.sr-search-input {
  flex: 1;
  border: none;
  background: transparent;
  font-size: 1rem;
  color: #0d1f29;
  outline: none;
  font-family: var(--font-body);
  min-width: 0;
}
.sr-search-input::placeholder { color: #8fa3af; }
.sr-search-submit {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #7be0d6;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #0d1f29;
  transition: background .15s;
}
.sr-search-submit:hover { background: #5ad8cc; }

/* ── Tags de filtre ── */
.sr-tags { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.sr-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 0.875rem;
  font-weight: 600;
  font-family: var(--font-heading);
  text-decoration: none;
  color: #0d1f29;
  transition: opacity .15s;
}
.sr-tag:hover { opacity: .8; text-decoration: none; }
.sr-tag--teal   { background: #b6f0eb; }
.sr-tag--blue   { background: #c5e1f3; }
.sr-tag--purple { background: #c5c9ff; }
.sr-tag-count { background: rgba(13,31,41,0.12); border-radius: 999px; padding: 1px 7px; font-size: 0.75rem; }

/* ── Résultats ── */
.sr-results { padding: 0 0 80px; }
.sr-results .container { display: flex; flex-direction: column; gap: 48px; }
.sr-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 80px 0;
  text-align: center;
  color: #5a6c7a;
}
.sr-empty-icon {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: #f0f8fc;
  display: flex; align-items: center; justify-content: center;
}
.sr-empty h2 { font-size: 1.375rem; color: #0d1f29; margin: 0; font-family: var(--font-heading); }
.sr-empty p  { font-size: 1rem; margin: 0; }
.sr-section { display: flex; flex-direction: column; gap: 20px; }
.sr-section-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #0d1f29;
  font-family: var(--font-heading);
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}
.sr-section-count {
  font-size: 0.875rem;
  font-weight: 500;
  background: #e2f0f9;
  color: #0d1f29;
  border-radius: 999px;
  padding: 2px 10px;
}
.sr-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sr-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-radius: 12px;
  background: #ffffff;
  padding: 20px;
  text-decoration: none;
  color: #0d1f29;
  border: 1px solid #e2f0f9;
  transition: box-shadow .15s, transform .15s;
}
.sr-card:hover { box-shadow: 0 4px 20px rgba(13,31,41,0.08); transform: translateY(-2px); text-decoration: none; }
.sr-card-body { display: flex; flex-direction: column; gap: 6px; }
.sr-card-type { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: #3d7a8f; font-family: var(--font-heading); }
.sr-card-title { font-size: 1rem; font-weight: 600; color: #0d1f29; font-family: var(--font-heading); line-height: 1.35; margin: 0; }
.sr-card-excerpt { font-size: 0.875rem; color: #5a6c7a; line-height: 1.5; margin: 0; }
.sr-card-footer { display: flex; justify-content: flex-end; padding-top: 12px; }
.sr-card-btn {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: #b6daf0;
  display: flex; align-items: center; justify-content: center;
  color: #0d1f29;
  transition: background .15s;
}
.sr-card:hover .sr-card-btn { background: #7be0d6; }
.sr-see-more-wrap { display: flex; justify-content: flex-end; }
.sr-see-more {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 0.875rem; font-weight: 600; color: #0d1f29;
  text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: 2px;
  transition: opacity .15s;
}
.sr-see-more:hover { opacity: .7; text-decoration: none; }
@media (max-width: 1024px) { .sr-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px)  { .sr-grid { grid-template-columns: 1fr; } .sr-search-wrapper { padding: 0 0 32px; } }

/* ============================================================
   OFFRE SIDEBAR — confidentialité bloc
============================================================ */
.offre-confidentialite {
  margin-top: 16px;
  padding: 16px;
  background: var(--color-bg-soft);
  border-radius: var(--radius-md);
  font-size: .78rem;
  color: var(--color-text-muted);
  line-height: 1.55;
}
.offre-confidentialite a { color: var(--color-accent); }

/* ══════════════════════════════════════════════════════════════════
   ACTUALITÉS — archive hero · grille · carte · pagination
   Figma node 9229:6267 — pixel-perfect
══════════════════════════════════════════════════════════════════ */

/* ── Hero d'archive — Figma: 1920×254px, padding 32px 160px, centré */
.archive-actualite-hero {
  background: #f8fbfe;
  padding: 32px 160px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

/* Breadcrumb pill — Figma: bg #f8fbfe, radius 128, padding 8/16 */
.archive-bc-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f8fbfe;
  border-radius: 128px;
  padding: 8px 16px;
  color: #0d1f29;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: none;
}
.archive-bc-pill a {
  color: #0d1f29;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: color .2s;
}
.archive-bc-pill a:hover { color: #5ad8cc; }
.archive-bc-sep { opacity: .45; font-size: 12px; }
.archive-bc-current { font-weight: 500; }

.archive-actualite-hero h1 {
  font-size: 48px;
  font-weight: 600;
  line-height: 54px;
  color: #0d1f29;
  text-align: center;
  margin: 0;
}
.archive-actualite-hero .archive-actualite-subtitle {
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  color: #0d1f29;
  text-align: center;
  max-width: 784px;
  margin: 0;
}

/* ── Section grille — Figma: padding 64px 160px */
.archive-actualite-section {
  background: #ffffff;
  padding: 64px 160px;
}

/* ── Grille — Figma: 4 × 376px, gap 32px */
.actualites-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}

/* ══════════════════════════════════════════════════════════════
   CARTE ACTUALITÉ — Figma: 376×452px, radius 16, bg #f8fbfe
══════════════════════════════════════════════════════════════ */
.actu-card-v2 {
  background: #f8fbfe;
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  /* No hover on card itself — only button animates */
}
.actu-card-v2-link {
  display: flex;
  flex-direction: column;
  flex: 1;
  text-decoration: none;
  color: inherit;
}

/* Image — Figma: 376×212px, ratio 376/212 */
.actu-card-v2-img {
  position: relative;
  width: 100%;
  aspect-ratio: 376 / 212;
  overflow: hidden;
  flex-shrink: 0;
  background: #dce8f0;
}
.actu-card-v2-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.actu-card-v2-placeholder {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #dce8f0, #b6daf0);
}

/* Badges — Figma: en HAUT de l'image */
.actu-card-v2-badges {
  position: absolute;
  top: 12px;
  left: 12px;
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
/* Date badge — Figma: bg #ffffff, cornerRadius 999 */
.actu-card-v2-date {
  display: inline-block;
  background: #ffffff;
  color: #0d1f29;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  padding: 6px 10px;
  border-radius: 999px;
  white-space: nowrap;
}
/* Catégorie badge — Figma: bg #7be0d6, cornerRadius 4 */
.actu-card-v2-cat {
  display: inline-block;
  background: #7be0d6;
  color: #0d1f29;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  padding: 6px 10px;
  border-radius: 4px;
  white-space: nowrap;
}

/* Wrapper corps — Figma: 376×240px, padding 16px, space-between */
.actu-card-v2-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 16px;
  gap: 16px;
}

/* Texte — variante template-parts */
.actu-card-v2-text h3 {
  font-size: 18px;
  font-weight: 600;
  line-height: 26px;
  color: #0d1f29;
  margin: 0 0 8px;
}
.actu-card-v2-text p {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #5a6b78;
  margin: 0;
}

/* Texte — variante front-page.php (.actu-card-v2-body) */
.actu-card-v2-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
}
.actu-card-v2-body h3 {
  font-size: 18px;
  font-weight: 600;
  line-height: 26px;
  color: #0d1f29;
  margin: 0;
}
.actu-card-v2-body p {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #5a6b78;
  margin: 0;
}
.actu-card-v2-footer {
  padding: 0 16px 16px;
  display: flex;
  justify-content: flex-end;
}

/* Bouton — Figma: 52×52, bg #b6daf0, cornerRadius 200, aligné à droite */
.actu-card-v2-btn {
  display: flex;
  justify-content: flex-end;
}

/* Default: cercle 52×52 avec "+" */
.actu-card-v2-plus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  min-width: 52px;
  border-radius: 200px;
  background: #b6daf0;
  color: #0d1f29;
  overflow: hidden;
  padding: 0 14px;
  gap: 0;
  transition: min-width .3s ease, padding .3s ease, gap .3s ease, background .2s ease;
  cursor: pointer;
}

/* Label "Découvrir" masqué par défaut */
.actu-plus-label {
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  max-width: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-width .3s ease, opacity .25s ease;
}

/* Icône "+" toujours visible */
.actu-plus-icon {
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 20px;
  font-weight: 300;
  line-height: 1;
}

/* Hover sur la carte → le bouton s'élargit, "Découvrir" apparaît */
.actu-card-v2:hover .actu-card-v2-plus {
  gap: 8px;
  padding: 0 20px;
  background: #9fcce8;
}
.actu-card-v2:hover .actu-plus-label {
  max-width: 90px;
  opacity: 1;
}

/* Pagination */
.archive-actualite-section .navigation.pagination {
  margin-top: 48px;
}
/* WordPress enveloppe les items dans .nav-links — c'est lui le vrai flex parent */
.archive-actualite-section .pagination .nav-links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  width: 100%;
}
.archive-actualite-section .pagination .nav-links .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;          /* écrase le .page-numbers global qui force width:42px */
  height: auto;
  min-width: 40px;
  min-height: 40px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  color: #0d1f29;
  background: #f0f7fb;
  border: none;
  text-decoration: none;
  padding: 8px 14px;
  transition: background .2s, color .2s;
  white-space: nowrap;
  flex-shrink: 0;
  box-sizing: border-box;
}
.archive-actualite-section .pagination .nav-links .page-numbers.current {
  background: #0d1f29;
  color: #ffffff;
}
.archive-actualite-section .pagination .nav-links .page-numbers:not(.current):hover {
  background: #b6daf0;
}
/* Prev / Next plus larges */
.archive-actualite-section .pagination .nav-links .prev.page-numbers,
.archive-actualite-section .pagination .nav-links .next.page-numbers {
  padding: 8px 20px;
  font-weight: 600;
}

/* ── Responsive */
@media (max-width: 1400px) {
  .archive-actualite-hero    { padding: 32px 80px; }
  .archive-actualite-section { padding: 64px 80px; }
}
@media (max-width: 1200px) {
  .archive-actualite-hero    { padding: 32px 40px; }
  .archive-actualite-section { padding: 48px 40px; }
  .archive-actualite-hero h1 { font-size: 36px; line-height: 44px; }
  .actualites-grid           { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 860px) {
  .archive-actualite-hero    { padding: 24px 24px; }
  .archive-actualite-section { padding: 40px 24px; }
  .archive-actualite-hero h1 { font-size: 28px; line-height: 36px; }
  .archive-actualite-hero .archive-actualite-subtitle { font-size: 16px; line-height: 24px; }
  .actualites-grid           { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 540px) {
  .archive-actualite-hero    { padding: 20px 16px; }
  .archive-actualite-section { padding: 32px 16px; }
  .archive-actualite-hero h1 { font-size: 24px; line-height: 32px; }
  .actualites-grid           { grid-template-columns: 1fr; gap: 16px; }
}


/* ══════════════════════════════════════════════════════════════════
   SINGLE ACTUALITÉ — détail article
   Figma node 9229:6943 — pixel-perfect
══════════════════════════════════════════════════════════════════ */

/* Lien intermédiaire dans le breadcrumb (Actualités) */
.archive-bc-link {
  color: #0d1f29;
  text-decoration: none;
  font-weight: 400;
  font-size: 14px;
  transition: color .2s;
}
.archive-bc-link:hover { color: #5ad8cc; }

/* ── Header — Figma: 1920×308, pad 32/160, gap 32, VERTICAL CENTER */
.actu-detail-header {
  background: transparent;
  padding: 32px 160px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

/* Title block — Figma: 784×176, VERTICAL, crossAlign=CENTER, gap 16 */
.actu-detail-header-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  max-width: 784px;
  width: 100%;
  text-align: center;
}
.actu-detail-header-title h1 {
  font-size: 48px;
  font-weight: 600;
  line-height: 54px;
  color: #0d1f29;
  margin: 0;
}
.actu-detail-header-intro {
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  color: #0d1f29;
  margin: 0;
}

/* ── Content — Figma: 1920×1322, pad 64/160, gap 32, VERTICAL CENTER */
.actu-detail-content {
  background: #ffffff;
  padding: 64px 160px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

/* Centrage de tous les enfants directs à 784px */
.actu-detail-content > * {
  width: 100%;
  max-width: 784px;
}

/* Badges — Figma: date pill blanc r=999, cat teal r=4 */
.actu-detail-badges {
  width: 100%;
  max-width: 784px;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0;
  flex-wrap: wrap;
  justify-content: center;
}
.actu-detail-date-badge {
  display: inline-block;
  background: #ffffff;
  color: #0d1f29;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  padding: 4px 8px;
  border-radius: 999px;
  white-space: nowrap;
}
.actu-detail-cat-badge {
  display: inline-block;
  background: #7be0d6;
  color: #0d1f29;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  padding: 4px 8px;
  border-radius: 4px;
  white-space: nowrap;
}

/* Image principale — Figma: 784×484px, r=16 */
.actu-detail-image {
  width: 100%;
  max-width: 784px;
  aspect-ratio: 784 / 484;
  object-fit: cover;
  border-radius: 16px;
  display: block;
}

/* Corps article — Figma: 18px/400/26px, color #0d1f29 */
.actu-detail-body {
  color: #0d1f29;
}
.actu-detail-body p {
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  color: #0d1f29;
  margin: 0 0 16px;
}
.actu-detail-body p:last-child { margin-bottom: 0; }
.actu-detail-body h2 {
  font-size: 28px;
  font-weight: 600;
  line-height: 34px;
  color: #0d1f29;
  margin: 32px 0 16px;
}
.actu-detail-body h3 {
  font-size: 22px;
  font-weight: 600;
  line-height: 28px;
  color: #0d1f29;
  margin: 24px 0 12px;
}
.actu-detail-body ul,
.actu-detail-body ol {
  padding-left: 24px;
  margin: 0 0 16px;
}
.actu-detail-body li {
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  color: #0d1f29;
  margin-bottom: 8px;
}
.actu-detail-body a {
  color: #0d1f29;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.actu-detail-body a:hover { color: #5ad8cc; }
.actu-detail-body strong { font-weight: 600; }
.actu-detail-body blockquote {
  border-left: 3px solid #b6daf0;
  padding: 8px 0 8px 20px;
  margin: 24px 0;
  font-style: italic;
}

/* Bouton S'inscrire — Figma: bg #c5e1f3, r=200, pad 14/24, gap 8 */
.actu-detail-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #c5e1f3;
  color: #0d1f29;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  padding: 14px 24px;
  border-radius: 200px;
  text-decoration: none;
  align-self: center;
  transition: background .2s;
}
.actu-detail-cta-btn:hover { background: #b6daf0; }

/* ── Section "Encore plus d'actualités"
   Figma: 1920×660, pad 64/160, gap 64, VERTICAL */
.actu-detail-related {
  background: #ffffff;
  padding: 64px 160px;
  display: flex;
  flex-direction: column;
  gap: 64px;
}

/* Heading row — Figma: HORIZONTAL, SPACE_BETWEEN, crossAlign=CENTER */
.actu-detail-related-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

/* "Encore plus d'actualités" — Figma: 28px/600/34px */
.actu-detail-related-title {
  font-size: 28px;
  font-weight: 600;
  line-height: 34px;
  color: #0d1f29;
  margin: 0;
}

/* "Toutes les actualités" button — Figma: bg #c5e1f3, r=200, pad 14/24, gap 8 */
.actu-detail-all-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #c5e1f3;
  color: #0d1f29;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  padding: 14px 24px;
  border-radius: 200px;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .2s;
}
.actu-detail-all-btn:hover { background: #b6daf0; }

/* ── Responsive */
@media (max-width: 1400px) {
  .actu-detail-header  { padding: 32px 80px; }
  .actu-detail-content { padding: 64px 80px; }
  .actu-detail-related { padding: 64px 80px; }
}
@media (max-width: 1200px) {
  .actu-detail-header  { padding: 32px 40px; }
  .actu-detail-content { padding: 48px 40px; }
  .actu-detail-related { padding: 48px 40px; gap: 48px; }
  .actu-detail-header-title h1 { font-size: 36px; line-height: 44px; }
}
@media (max-width: 860px) {
  .actu-detail-header  { padding: 24px; gap: 20px; }
  .actu-detail-content { padding: 40px 24px; }
  .actu-detail-related { padding: 40px 24px; gap: 40px; }
  .actu-detail-header-title h1 { font-size: 28px; line-height: 36px; }
  .actu-detail-header-intro { font-size: 16px; line-height: 24px; }
  .actu-detail-body p, .actu-detail-body li { font-size: 16px; line-height: 24px; }
  .actu-detail-related-heading { flex-direction: column; align-items: flex-start; gap: 16px; }
}
@media (max-width: 540px) {
  .actu-detail-header  { padding: 20px 16px; }
  .actu-detail-content { padding: 32px 16px; }
  .actu-detail-related { padding: 32px 16px; gap: 32px; }
  .actu-detail-header-title h1 { font-size: 24px; line-height: 32px; }
  .actu-detail-body h2 { font-size: 22px; line-height: 28px; }
  .actu-detail-image { aspect-ratio: auto; max-height: 280px; }
}


/* ══════════════════════════════════════════════════════
   FORMATIONS ARCHIVE — Figma node 8975:3598
   v2.63.0 — dark page #080717, filter sidebar, 3-col cards
══════════════════════════════════════════════════════ */

/* ── Dark page background */
/* Gradient vert/teal depuis la topbar jusqu'à la section formations */
body.tax-domaine {
  background:
    radial-gradient(ellipse 1600px 900px at 50% 0px, rgba(36,86,82,0.65) 0%, rgba(90,216,204,0.16) 50%, transparent 72%),
    #080717;
}
.tax-domaine .site-main,
.tax-domaine main,
.tax-domaine #main,
.tax-domaine .site-content,
.tax-domaine #content,
.tax-domaine .dpage-intro,
.tax-domaine .dpage-formations {
  background: transparent;
}
/* Masque courbe sur carousel : remplace les divs opaques, laisse le gradient passer */
.tax-domaine .dpage-carousel-curve-top,
.tax-domaine .dpage-carousel-curve-bottom { display: none; }
.tax-domaine .dpage-carousel {
  -webkit-mask-image:
    radial-gradient(ellipse 85.5% 45% at 50% -36%, transparent 99%, black 100%),
    radial-gradient(ellipse 85.5% 45% at 50% 136%, transparent 99%, black 100%);
  -webkit-mask-composite: destination-in;
  mask-image:
    radial-gradient(ellipse 85.5% 45% at 50% -36%, transparent 99%, black 100%),
    radial-gradient(ellipse 85.5% 45% at 50% 136%, transparent 99%, black 100%);
  mask-composite: intersect;
}




body.post-type-archive-formation {
  background:
    radial-gradient(ellipse 1600px 900px at 50% 0px, rgba(36,86,82,0.65) 0%, rgba(90,216,204,0.16) 50%, transparent 72%),
    #080717;
}
.post-type-archive-formation .site-main,
.post-type-archive-formation main,
.post-type-archive-formation #main,
.post-type-archive-formation .site-content,
.post-type-archive-formation #content {
  background: transparent;
}

/* ── Hero */
.form-archive-hero {
  background: transparent;
  padding: 64px 160px 48px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}

/* Breadcrumb pill — bg #def7f5 teal, unique to formations */
.form-bc-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f8f8ff;
  border-radius: 128px;
  padding: 8px 16px;
  color: #0d1f29;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-decoration: none;
}
.form-bc-pill a {
  color: #0d1f29;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.form-bc-sep {
  opacity: 0.45;
  display: inline-flex;
  align-items: center;
}
.form-bc-current {
  font-weight: 600;
}
.form-archive-hero h1 {
  font-size: 48px;
  font-weight: 600;
  line-height: 54px;
  color: #ffffff;
  margin: 0;
}
.form-archive-subtitle {
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  color: #ffffff;
  margin: 0;
  max-width: 640px;
}

/* ── Content wrapper — sidebar + grid */
.form-archive-content {
  background: transparent;
  padding: 64px 160px;
  display: flex;
  gap: 32px;
  align-items: flex-start;
}

/* ── Filter sidebar — gradient #245652 → #080717, r=16, pad 24 */
.form-filter-sidebar {
  width: 320px;
  min-width: 320px;
  background: linear-gradient(to bottom, #245652, #080717);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 0;
  flex-shrink: 0;
  align-self: flex-start;
}
.form-filter-sidebar form {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}
.form-filter-groups {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
}
.form-filter-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.form-filter-label {
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: #ffffff;
}
.form-filter-select-wrap {
  position: relative;
}
.form-filter-chevron {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  flex-shrink: 0;
}
.form-filter-input {
  width: 100%;
  background: #ffffff;
  border: none;
  border-radius: 999px;
  padding: 11px 44px 11px 16px;
  font-size: 15px;
  font-weight: 400;
  line-height: 22px;
  color: #0d1f29;
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  font-family: inherit;
}
.form-filter-input:focus {
  box-shadow: 0 0 0 2px #7be0d6;
  outline: none;
}
/* Filter sidebar header — Figma: "Filtrer par :" fs=18/600, white */
.form-filter-header {
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
  color: #ffffff;
}

/* Results: count + active badges */
.form-filter-results {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.form-filter-count {
  font-size: 16px;
  font-weight: 600;
  color: #ffffff;
  line-height: 1.4;
}
.form-filter-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
/* Active filter badge — bg #5ad8cc, r=999, pad 4/8, fs=14/500 */
.form-filter-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #5ad8cc;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  color: #0d1f29;
  text-decoration: none;
  transition: background .2s;
}
.form-filter-badge:hover { background: #41c8be; color: #0d1f29; text-decoration: none; }
.form-filter-badge svg { flex-shrink: 0; }

.form-filter-actions {
  display: flex;
  gap: 12px;
  width: 100%;
  justify-content: center;
}
.form-filter-btn-apply {
  flex: 1;
  background: #7be0d6;
  border: none;
  border-radius: 999px;
  padding: 14px 24px;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  color: #0d1f29;
  cursor: pointer;
  transition: background 0.2s;
  font-family: inherit;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.form-filter-btn-apply:hover { background: #5ad8cc; }
.form-filter-btn-clear {
  flex: 1;
  background: #c5e1f3;
  border-radius: 999px;
  padding: 14px 24px;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  color: #0d1f29;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: background 0.2s;
}
.form-filter-btn-clear:hover { background: #a8d4ed; color: #0d1f29; text-decoration: none; }

/* ── Main grid area */
.form-archive-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

/* 3-col grid: 3 × 376px + 2 × 32px = 1192px */
.formations-grid-v2 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

/* ── Formation card — 376×668, image fills card, r=16 */
.form-card {
  border-radius: 16px;
  overflow: hidden;
  aspect-ratio: 376 / 668;
  position: relative;
  display: block;
  background: #1a1a2e;
}
.form-card-link {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  text-decoration: none;
}
.form-card-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.form-card-link img { /* fallback for the_post_thumbnail */
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.form-card-bg-placeholder {
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, #245652 0%, #080717 100%);
}

/* Tags — top right: format pill #c5c9ff + domain r=4 #7be0d6 */
.form-card-tags {
  position: absolute;
  top: 16px;
  right: 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-end;
  max-width: calc(100% - 32px);
  z-index: 2;
}
.form-card-tag-format {
  background: #c5c9ff;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  color: #0d1f29;
  white-space: nowrap;
}
.form-card-tag-domain {
  background: #7be0d6;
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  color: #0d1f29;
  white-space: normal;
  word-break: break-word;
  text-align: right;
  width: fit-content;
  max-width: 230px;
}

/* Bottom gradient panel — h=280, grad transparent → #080717, pad 64/32 */
.form-card-panel {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 340px;
  padding: 64px 28px 32px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 8px;
  z-index: 1;
  overflow: hidden;
}
.form-card-panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom,
    transparent 0%,
    rgba(8,7,23,0.55) 35%,
    rgba(8,7,23,0.88) 65%,
    #080717 100%
  );
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 55%);
  mask-image: linear-gradient(to bottom, transparent 0%, black 55%);
  z-index: 0;
  pointer-events: none;
}
.form-card-panel-text,
.form-card-btn {
  position: relative;
  z-index: 1;
}
.form-card-panel-text {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
  align-self: stretch;
}
.form-card-panel h3 {
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  color: #ffffff;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* Cards "Nous rejoindre" : titre affiché en entier (pas de troncature 2 lignes) */
.form-card--rejoindre .form-card-panel h3 {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
}
/* Le panneau s'adapte à un titre plus long sans rogner le haut */
.form-card--rejoindre .form-card-panel {
  height: auto;
  min-height: 340px;
}
.form-card-panel p {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: rgba(255,255,255,0.8);
  margin: 0;
}

/* Button — accordion expand-left on hover */
.form-card-btn {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 0;
  max-width: 44px;
  min-width: 44px;
  height: 44px;
  border-radius: 200px;
  background: #5ad8cc;
  padding: 10px;
  color: #080717;
  overflow: hidden;
  flex-shrink: 0;
  transition: max-width 0.35s ease, padding 0.35s ease, gap 0.35s ease, background 0.2s;
  cursor: pointer;
  text-decoration: none;
}
.form-card-btn-label {
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
  color: #0d1f29;
  white-space: nowrap;
  max-width: 0;
  overflow: hidden;
  transition: max-width 0.35s ease;
  font-family: inherit;
}
.form-card-btn svg {
  flex-shrink: 0;
}
.form-card:hover .form-card-btn {
  max-width: calc(100% + 24px);
  width: auto;
  gap: 8px;
  padding: 10px 14px 10px 16px;
  /* PAS de changement de background — on garde #5ad8cc de la règle de base */
  margin-right: -12px;
}
.form-card:hover .form-card-btn-label {
  max-width: none;
}

/* Empty state */
.form-archive-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 80px 0;
  color: rgba(255,255,255,0.45);
  font-size: 18px;
}

/* ── Alternance section — bg #080717, pad 64, gap 64 */
.form-alternance-section {
  background: #080717;
  padding: 64px 160px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 64px;
}
.form-alternance-title {
  font-size: 28px;
  font-weight: 600;
  line-height: 34px;
  color: #ffffff;
  text-align: center;
  margin: 0;
}

/* 4-col mode grid: 4 × 376px + 3 × 32px = 1600px */
.form-mode-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  width: 100%;
}

/* Mode card — 376×376, bg #f1f1ff, r=16, pad 32, gap 24 */
.form-mode-card {
  background: #f1f1ff;
  border-radius: 16px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-height: 376px;
}
.form-mode-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.form-mode-card-text {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.form-mode-icon-wrap {
  width: 64px;
  height: 64px;
  border-radius: 8px;
  background: #e2e4ff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.form-mode-badge {
  display: inline-flex;
  align-items: center;
  background: #b7bbff;
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  color: #0d1f29;
  white-space: nowrap;
}
.form-mode-card h3 {
  font-size: 28px;
  font-weight: 600;
  line-height: 34px;
  color: #0d1f29;
  margin: 0;
}
.form-mode-card p {
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  color: #0d1f29;
  margin: 0;
}

/* ── Pagination formations */
.form-pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
}
.form-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 500;
  color: grey;
  border: 1px solid grey;
  text-decoration: none;
  background: transparent;
  transition: background 0.2s;
}
.form-pagination .page-numbers.current,
.form-pagination .page-numbers:hover {
  background: #7be0d6;
  color: #0d1f29;
  border-color: #7be0d6;
}

/* ── Responsive formations */
@media (max-width: 1600px) {
  .form-archive-hero     { padding: 64px 80px 48px; }
  .form-archive-content  { padding: 64px 80px; }
  .form-alternance-section { padding: 64px 80px; }
}
@media (max-width: 1400px) {
  .form-mode-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 1200px) {
  .form-archive-hero     { padding: 48px 40px 32px; }
  .form-archive-content  { padding: 48px 40px; flex-direction: column; }
  .form-filter-sidebar   { width: 100%; min-width: 0; max-width: 100%; }
  .form-archive-main     { width: 100%; }
  .form-alternance-section { padding: 48px 40px; }
  .formations-grid-v2    { grid-template-columns: repeat(2, 1fr); }
  .form-archive-hero h1  { font-size: 38px; line-height: 46px; }
}
@media (max-width: 860px) {
  .form-archive-hero     { padding: 40px 24px 32px; gap: 12px; }
  .form-archive-hero h1  { font-size: 30px; line-height: 38px; }
  .form-archive-content  { padding: 32px 24px; gap: 24px; }
  .form-alternance-section { padding: 40px 24px; gap: 40px; }
  .form-mode-grid        { grid-template-columns: 1fr; }
  .form-mode-card        { min-height: 0; }
  .form-alternance-title { font-size: 22px; line-height: 28px; }
}
@media (max-width: 600px) {
  .form-archive-hero h1  { font-size: 26px; line-height: 34px; }
  .form-archive-content  { padding: 24px 16px; }
  .formations-grid-v2    { grid-template-columns: 1fr; }
  .form-archive-subtitle { font-size: 16px; line-height: 24px; }
}

/* ── Filter sidebar toggle — mobile collapse */
.form-filter-toggle { display: none; }

@media (max-width: 860px) {
  /* Collapse sidebar behind a toggle button */
  .form-filter-sidebar {
    padding: 0;
    overflow: hidden;
  }
  .form-filter-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    background: transparent;
    border: none;
    padding: 16px 20px;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
    color: #ffffff;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
  }
  .form-filter-toggle-icon {
    flex-shrink: 0;
    transition: transform 0.3s ease;
  }
  .form-filter-sidebar.is-open .form-filter-toggle-icon {
    transform: rotate(180deg);
  }
  /* The form collapses via max-height animation */
  .form-filter-sidebar form {
    overflow: hidden;
    max-height: 0;
    padding: 0 20px;
    transition: max-height 0.4s ease, padding 0.3s ease;
  }
  .form-filter-sidebar.is-open form {
    max-height: 900px;
    padding: 4px 20px 20px;
  }
}


/* ══════════════════════════════════════════════════════
   FORMATION DETAIL — Figma node 9013-1997
   v2.64.0 — dark page, image hero, 2-col layout, sidebar
══════════════════════════════════════════════════════ */

/* ── Dark page background */
body.single-formation {
  background:
    radial-gradient(ellipse 1600px 900px at 50% 0px, rgba(36,86,82,0.65) 0%, rgba(90,216,204,0.16) 50%, transparent 72%),
    #080717;
}
.single-formation .site-main,
.single-formation main,
.single-formation #main,
.single-formation .site-content,
.single-formation #content {
  background: transparent;
}

/* ══ HERO
   Figma: 1920×832, padding 32px top / 0 bottom / 160px sides
   Inner container 1600×800, position relative, r=16, overflow hidden
   ───────────────────────────────────────────────────── */
.form-detail-hero {
  background: #080717;
  padding: 32px 160px 0;
}
.form-detail-hero-inner {
  position: relative;
  width: 100%;
  height: 800px;
  border-radius: 16px;
  overflow: hidden;
}

/* Background image fills the container */
.form-detail-hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.form-detail-hero-inner img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.form-detail-hero-bg-placeholder {
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, #245652 0%, #080717 100%);
}

/* Subtle gradient overlay for readability */
.form-detail-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(8, 7, 23, 0.15) 0%,
    rgba(8, 7, 23, 0.55) 60%,
    rgba(8, 7, 23, 0.85) 100%
  );
  z-index: 1;
}

/* Breadcrumb pill — Figma: bg #f0f8fc, r=128, pad 8/16, gap 4 */
.form-detail-bc-pill {
  position: absolute;
  top: 28px;
  left: 32px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #f0f8fc;
  border-radius: 128px;
  padding: 8px 16px;
  color: #0d1f29;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-decoration: none;
}
.form-detail-bc-pill a {
  color: #0d1f29;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.form-detail-bc-sep {
  opacity: 0.45;
  display: inline-flex;
  align-items: center;
}
.form-detail-bc-link {
  color: #0d1f29;
  text-decoration: none;
}
.form-detail-bc-current {
  font-weight: 600;
}

/* Title card — Figma: 681×290, dark bg, r=16, pad 64, gap 16 */
.form-detail-hero-card {
  position: absolute;
  bottom: 32px;
  left: 32px;
  width: 681px;
  background: rgba(8, 7, 23, 0.82);
  border-radius: 16px;
  padding: 64px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  z-index: 2;
  backdrop-filter: blur(2px);
}
.form-detail-hero-card h1 {
  font-size: 48px;
  font-weight: 600;
  line-height: 54px;
  color: #ffffff;
  margin: 0;
}
.form-detail-hero-desc {
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  color: rgba(255, 255, 255, 0.9);
  margin: 0;
}

/* Tags row */
.form-detail-hero-tags {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
/* Format tag — Figma: bg #c5c9ff, r=999 */
.form-dh-tag-format {
  background: #c5c9ff;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  color: #0d1f29;
}
/* Duration tag — Figma: bg #7be0d6, r=4 */
.form-dh-tag-duration {
  background: #7be0d6;
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  color: #0d1f29;
}

/* ══ CONTENT AREA
   Figma: 1920×5066, HORIZONTAL gap=64, pad=64/64/160/160
   Left (1160px) | Right (376px)
   ───────────────────────────────────────────────────── */
.form-detail-content {
  background: #080717;
  padding: 64px 160px;
  display: flex;
  gap: 64px;
  align-items: flex-start;
}

/* LEFT COLUMN — 1160px */
.form-detail-sections {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 64px;
}

/* Individual section block — Figma: pad 32, r=16, gap 24 */
.form-detail-section {
  padding: 32px;
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Section body — white text on dark */
.form-detail-section .form-ds-title h2 {
  font-size: 28px;
  font-weight: 600;
  line-height: 34px;
  color: #ffffff;
  margin: 0 0 8px;
}
.form-detail-section .form-ds-title p {
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  color: #ffffff;
  margin: 0;
}

/* entry-content (the_content) in dark context */
.form-detail-section .form-ds-body h2,
.form-detail-section .form-ds-body h3 {
  font-size: 28px;
  font-weight: 600;
  line-height: 34px;
  color: #ffffff;
  margin: 0 0 8px;
}
.form-detail-section .form-ds-body h3 {
  font-size: 22px;
  line-height: 28px;
}
.form-detail-section .form-ds-body p {
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: rgba(255, 255, 255, 0.9);
  margin: 0 0 16px;
}
.form-detail-section .form-ds-body ul,
.form-detail-section .form-ds-body ol {
  padding-left: 20px;
  margin: 0 0 16px;
  color: rgba(255, 255, 255, 0.9);
}
.form-detail-section .form-ds-body li {
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  margin-bottom: 8px;
}
.form-detail-section .form-ds-body strong {
  color: #ffffff;
  font-weight: 600;
}

/* Info tab boxes — Figma: bg #def7f5, r=8, pad 16, gap 8 */
.form-detail-section .form-info-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.form-detail-section .form-info-tab {
  background: #def7f5;
  border-radius: 8px;
  padding: 16px;
  flex: 1;
  min-width: 200px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.form-detail-section .form-info-tab strong {
  font-size: 14px;
  font-weight: 600;
  color: #0d1f29;
}
.form-detail-section .form-info-tab p {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #0d1f29;
  margin: 0;
}

/* ══ RIGHT SIDEBAR (376px) ── */
.form-detail-sidebar {
  width: 376px;
  min-width: 376px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: 32px;
  flex-shrink: 0;
}

/* En bref card — Figma: gradient #245652→#080717, r=16, pad 24, gap 24 */
.form-sidebar-enbref {
  background: linear-gradient(to bottom, #245652, #080717);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.form-sidebar-title {
  font-size: 28px;
  font-weight: 600;
  line-height: 34px;
  color: #ffffff;
  margin: 0;
}

/* En bref items list */
.form-enbref-items {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.form-enbref-item {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px 0;
}
.form-enbref-item:first-child { padding-top: 0; }
.form-enbref-item-title {
  display: flex;
  align-items: center;
  gap: 8px;
}
.form-enbref-item-title svg {
  color: #7be0d6;
  flex-shrink: 0;
}
.form-enbref-item-title span {
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  color: #ffffff;
}
.form-enbref-item p {
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: rgba(255, 255, 255, 0.85);
  margin: 0;
  padding-left: 28px; /* align with icon */
}
/* Separator line between items */
.form-enbref-sep {
  width: 100%;
  height: 1px;
  background: rgba(255, 255, 255, 0.12);
}

/* Download button — Figma: bg #7be0d6, r=200, pad 14/24 */
.form-sidebar-dl-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #7be0d6;
  border-radius: 200px;
  padding: 14px 24px;
  font-size: 15px;
  font-weight: 600;
  line-height: 20px;
  color: #0d1f29;
  text-decoration: none;
  text-align: center;
  transition: background 0.2s;
}
.form-sidebar-dl-btn:hover { background: #5ad8cc; }

/* Modalités / Contact card — Figma: gradient #245652→#080717, r=16, pad 24, gap 24 */
.form-sidebar-contact {
  background: linear-gradient(to bottom, #245652, #080717);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.form-sidebar-contact-title {
  font-size: 28px;
  font-weight: 600;
  line-height: 34px;
  color: #ffffff;
  margin: 0;
}
.form-sidebar-contact-text {
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: rgba(255, 255, 255, 0.85);
  margin: 0;
}

/* Candidater button — Figma: bg #67ef9b (green), r=200, pad 14/24 */
.form-candidat-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #67ef9b;
  border-radius: 200px;
  padding: 14px 24px;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  color: #0d1f29;
  text-decoration: none;
  transition: background 0.2s;
}
.form-candidat-btn:hover { background: #41eb82; }

/* ── Responsive formation detail */
@media (max-width: 1600px) {
  .form-detail-hero { padding: 32px 80px 0; }
  .form-detail-content { padding: 64px 80px; }
}
@media (max-width: 1400px) {
  .form-detail-hero-inner { height: 640px; }
  .form-detail-hero-card { width: 580px; padding: 48px; }
  .form-detail-hero-card h1 { font-size: 38px; line-height: 46px; }
  .form-detail-content { gap: 48px; }
}
@media (max-width: 1200px) {
  .form-detail-hero { padding: 24px 40px 0; }
  .form-detail-hero-inner { height: 560px; }
  .form-detail-hero-card { width: 480px; padding: 40px; }
  .form-detail-hero-card h1 { font-size: 32px; line-height: 40px; }
  .form-detail-content { padding: 48px 40px; flex-direction: column; }
  .form-detail-sidebar { width: 100%; min-width: 0; position: static; }
  .form-sidebar-enbref,
  .form-sidebar-contact { border-radius: 16px; }
}
@media (max-width: 860px) {
  .form-detail-hero { padding: 16px 20px 0; }
  .form-detail-hero-inner { height: 480px; }
  .form-detail-hero-card {
    width: calc(100% - 40px);
    left: 20px;
    bottom: 20px;
    padding: 28px;
  }
  .form-detail-hero-card h1 { font-size: 26px; line-height: 34px; }
  .form-detail-hero-desc { font-size: 15px; line-height: 22px; }
  .form-detail-content { padding: 32px 20px; gap: 32px; }
  .form-sidebar-title,
  .form-sidebar-contact-title { font-size: 22px; line-height: 28px; }
  .form-detail-section { padding: 24px 16px; }
}
@media (max-width: 600px) {
  .form-detail-hero-inner { height: 400px; }
  .form-detail-hero-card h1 { font-size: 22px; line-height: 30px; }
  .form-detail-content { padding: 24px 16px; }
  .form-enbref-item p { padding-left: 0; }
}


/* ══════════════════════════════════════════════════════
   FORMATION DETAIL — section cards v2.65.0
   Chaque h2 devient une card distincte (structure Figma)
══════════════════════════════════════════════════════ */

/* Section card — subtle bg sur fond dark, séparation visuelle */
.form-detail-section {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.07);
}

/* ── Body text dans chaque section ── */
.form-ds-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.form-ds-body h2 {
  font-size: 28px !important;
  font-weight: 600 !important;
  line-height: 34px !important;
  color: #ffffff !important;
  margin: 0 0 8px !important;
}
.form-ds-body h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 28px !important;
  color: #ffffff !important;
  margin: 0 !important;
}
.form-ds-body p {
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  color: rgba(255,255,255,0.85) !important;
  margin: 0 !important;
}
.form-ds-body ul,
.form-ds-body ol {
  padding-left: 20px !important;
  margin: 0 !important;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.form-ds-body li {
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 22px !important;
  color: rgba(255,255,255,0.85) !important;
}
.form-ds-body strong,
.form-ds-body b {
  color: #ffffff !important;
  font-weight: 600 !important;
}
.form-ds-body a {
  color: #7be0d6 !important;
  text-decoration: underline;
}



/* =====================================================
   LE PÔLE — template-le-pole.php  v2.68.0
   Source: Figma 9158-4306  1920×6917
   All measurements pixel-exact from API
===================================================== */

/* ─── SHARED PRIMITIVES ──────────────────────────── */
body.page-template-template-le-pole {
  background: radial-gradient(ellipse 1600px 900px at 50% 0px, rgba(182,218,240,0.35) 0%, rgba(210,235,247,0.10) 50%, transparent 72%), #080717;
}
.page-template-template-le-pole .lp-header {
  background: transparent;
}
.page-template-template-le-pole .alt-subtitle {
  margin-bottom: -32px;
}

/* ============================================================
   PAGE 404
============================================================ */
body.error404 {
  background: radial-gradient(ellipse 1600px 900px at 50% 0px, rgba(183,187,255,0.50) 0%, rgba(197,201,255,0.14) 50%, transparent 72%), #080717;
}
.error-404 {
  padding: 40px 0 48px;
  text-align: center;
  /* Remplit l'espace entre header et footer pour éviter
     le fond #080717 qui apparaît sous le footer */
  min-height: calc(100vh - var(--topbar-height) - var(--header-height) - 360px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.error-code {
  font-size: 120px;
  font-weight: 700;
  font-family: var(--font-heading);
  color: var(--color-accent);
  line-height: 1;
  margin-bottom: 24px;
}
.error-404 h1 {
  font-size: 36px;
  font-weight: 600;
  color: #fff;
  margin: 0 0 16px;
}
.error-404 > p {
  font-size: 18px;
  color: rgba(255,255,255,0.65);
  margin: 0 0 40px;
}
body.error404 .btn-outline:hover {
  transform: none;
}

/* ============================================================
   MENTIONS LÉGALES — dark theme
============================================================ */
body.page-template-template-mentions-legales {
  background: radial-gradient(ellipse 1600px 900px at 50% 0px, rgba(183,187,255,0.50) 0%, rgba(197,201,255,0.14) 50%, transparent 72%), #080717;
}
body.page-template-template-mentions-legales .site-footer {
  background: transparent;
}
.page-template-template-mentions-legales .ph-h1 { color: #fff; }

/* Bloc identité */
.page-template-template-mentions-legales .ml-intro__block {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
}
.page-template-template-mentions-legales .ml-intro__block p { color: rgba(255,255,255,0.80); }
.page-template-template-mentions-legales .ml-intro__block a { color: var(--color-accent); }

/* Cards hébergement / directeur / design */
.page-template-template-mentions-legales .ml-intro__card {
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.10);
}
.page-template-template-mentions-legales .ml-intro__card-title { color: var(--color-accent); }
.page-template-template-mentions-legales .ml-intro__card p { color: rgba(255,255,255,0.75); }
.page-template-template-mentions-legales .ml-intro__card a { color: rgba(255,255,255,0.85); }

/* Sections légales */
.page-template-template-mentions-legales .ml-section { border-top-color: rgba(255,255,255,0.10); }
.page-template-template-mentions-legales .ml-section:last-child { border-bottom-color: rgba(255,255,255,0.10); }
.page-template-template-mentions-legales .ml-section__title { color: #fff; }
.page-template-template-mentions-legales .ml-section__text p { color: rgba(255,255,255,0.65); }
.page-template-template-mentions-legales .ml-section__text a { color: rgba(255,255,255,0.80); }
.page-template-template-le-pole .site-main,
.page-template-template-le-pole main,
.page-template-template-le-pole #main,
.page-template-template-le-pole .site-content,
.page-template-template-le-pole #content {
  background: transparent;
}

/* Eyebrow row — dot + label */
.lp-eyebrow {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: #0d1f29;
  width: 100%;
  padding-bottom: 12px;
  border-bottom: 1px solid #d4d6ff;
  margin-bottom: -24px;
}
.lp-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.lp-dot-blue  { background: #B7BBFF; }
.lp-dot-green { background: #41eb82; }

/* Typography primitives */
.lp-h2 {
  font-size: 36px;
  font-weight: 600;
  line-height: 1.2;
  color: #0d1f29;
  margin: 0;
}
.lp-p {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.55;
  color: #0d1f29;
  margin: 0;
}
.lp-p-sm {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  color: #0d1f29;
  margin: 0;
}

/* Section-top (eyebrow + h2 + p stacked, gap=16) */
.lp-section-top {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Card shared — icon-box */
.lp-icon-box {
  width: 60px;
  height: 60px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.lp-ib-light { background: #e2f0f9; }
.lp-ib-mid   { background: #f0f8fc; }

/* arg-text (h3 + p inside a card) */
.lp-arg-text { display: flex; flex-direction: column; gap: 8px; }
.lp-arg-h {
  font-size: 22px;
  font-weight: 600;
  line-height: 1.3;
  color: #0d1f29;
  margin: 0;
}
.lp-arg-p {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  color: #0d1f29;
  margin: 0;
}

/* Buttons */
.lp-btn-green {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: #67ef9b;
  color: #0d1f29;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  padding: 14px 24px;
  border-radius: 200px;
  text-decoration: none;
  transition: opacity .2s;
  width: fit-content;
}
.lp-btn-green:hover { opacity: .85; color: #0d1f29; text-decoration: none; }


/* ─── HEADER ──────────────────────────────────────── */
/*  Figma: 1920×914 · bg #080717 · flex-col gap=32 · pad t=32 r=0 b=0 l=0 */
.lp-header {
  background: transparent;
  display: flex;
  flex-direction: column;
  gap: 32px;
  padding-top: 40px;
  overflow: hidden;
}

/* Centred text block — breadcrumb + h1 */
.lp-header-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  padding: 0 160px;
}

/* Breadcrumb pill — 128×36 bg #f8fbfe r=128 pad 8/16 gap=4 */
.lp-bc {
  display: flex;
  align-items: center;
  gap: 4px;
  background: #f8fbfe;
  border-radius: 128px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 500;
  color: #0d1f29;
  text-decoration: none;
}
.lp-bc a { color: #0d1f29; text-decoration: none; }
.lp-bc-home { display: flex; align-items: center; }
.lp-bc-label { color: #0d1f29; }

/* Title — 784×176 centred within text block */
.lp-header-title {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 784px;
  text-align: center;
}
.lp-hero-h1 {
  font-size: 48px;
  font-weight: 600;
  line-height: 1.125;
  color: #ffffff;
  margin: 0;
}
.lp-hero-sub {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.55;
  color: rgba(255,255,255,.75);
  margin: 0;
}

/* Image strip — 5 photos full-bleed */
.lp-hero-imgs {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  width: 100%;
  padding: 0 16px 56px;
}
.lp-ph {
  flex: 1;
  /* padding-top is set inline per image for stagger */
}
.lp-ph img {
  width: 100%;
  height: 478px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
}


/* ─── MISSIONS ────────────────────────────────────── */
/*  outer: bg #ffffff pad=16
    inner: bg #f8fbfe r=16 pad 64/144 gap=64 vertical */
.lp-missions {
  background: #ffffff;
  padding: 16px;
}
.lp-missions-in {
  background: #f8fbfe;
  border-radius: 16px;
  padding: 64px max(48px, calc((100% - 1600px) / 2));
  display: flex;
  flex-direction: column;
  gap: 64px;
}
/* Row: Left 376px + Items 1160px gap=64 */
.lp-missions-row {
  display: flex;
  gap: 64px;
  align-items: flex-start;
}
.lp-missions-left {
  width: 376px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.lp-missions-items {
  flex: 1;
  display: flex;
  gap: 16px;
}
/* arg-card shared — 376×262 bg #f0f8fc r=16 pad=32 gap=24 */
.lp-arg-card {
  flex: 1;
  background: #f0f8fc;
  border-radius: 16px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}


/* ─── HISTOIRE ────────────────────────────────────── */
/*  bg #ffffff pad 64/160 gap=64 */
.lp-hist {
  background: #ffffff;
  padding: 64px 0;
}
.lp-hist-in {
  padding: 0 max(64px, calc((100% - 1600px) / 2));
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.lp-hist-content {
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.lp-hist-top {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  text-align: center;
}
/* 3 chiffres dots — gap=64 */
/* Frise : pleine largeur (full-bleed) + navigation flèches/progress */
.lp-hist-items {
  margin-left: calc(-50vw + 50%);
  margin-right: calc(-50vw + 50%);
  padding: 0 max(64px, calc((100vw - 1600px) / 2));
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  cursor: grab;
}
.lp-hist-items.grabbing { cursor: grabbing; }
.lp-hist-items::-webkit-scrollbar { display: none; }
.lp-hist-carousel { display: flex; flex-direction: column; gap: 24px; }
.lp-hist-track {
  display: flex;
  align-items: flex-start;
  gap: 56px;
  width: max-content;
  min-width: 100%;
  position: relative;
  padding-bottom: 12px;
}
.lp-hist-track::before {
  content: '';
  position: absolute;
  top: 5px;
  left: 6px;
  right: 6px;
  height: 1px;
  background: linear-gradient(90deg, transparent, #d4d6ff 4%, #d4d6ff 96%, transparent);
  pointer-events: none;
}
.lp-hist-item {
  flex: 0 0 auto;
  width: 240px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  text-align: center;
}
.lp-hist-item--mini { width: 200px; }
.lp-hist-dot {
  display: block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #0d1f29;
  position: relative;
  z-index: 1;
}
.lp-hist-dot--mini {
  width: 8px;
  height: 8px;
  margin-top: 2px;
  background: #8b8fc7;
}
.lp-hist-num {
  font-size: 48px;
  font-weight: 600;
  line-height: 1.1;
  color: #0d1f29;
}
.lp-hist-lbl {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.45;
  color: #0d1f29;
}


/* ─── CTA BAR ─────────────────────────────────────── */
/*  bg #ffffff pad t=32 b=32 centré */
.lp-cta {
  background: #ffffff;
  padding: 32px 160px;
  display: flex;
  justify-content: center;
}


/* ─── CHIFFRES ────────────────────────────────────── */
/*  outer: bg #ffffff pad=16
    inner: gradient #e2f0f9→#f8fbfe r=16 pad 64/144 gap=64 */
.lp-chiffres {
  background: #ffffff;
  padding: 16px;
}
.lp-chiffres-in {
  background: linear-gradient(135deg, #e2f0f9 0%, #f8fbfe 100%);
  border-radius: 16px;
  padding: 64px max(48px, calc((100% - 1600px) / 2));
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.lp-chiffres-body {
  display: flex;
  flex-direction: column;
  gap: 64px;
}
/* Row: Photo 512px + Stats flex-1 */
.lp-chiffres-row {
  display: flex;
  gap: 64px;
  align-items: center;
}
.lp-chiffres-img-col {
  flex-shrink: 0;
  width: 512px;
}
.lp-chiffres-img {
  width: 512px;
  height: 612px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
}
/* Stats grid — 3 cols × 2 rows gap-row=64 gap-col auto */
.lp-stats-grid {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  row-gap: 64px;
  column-gap: 32px;
  align-content: start;
}
.lp-stat {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  text-align: center;
}
.lp-stat-n {
  font-size: 48px;
  font-weight: 600;
  line-height: 1.1;
  color: #0d1f29;
}
.lp-stat-l {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.45;
  color: #0d1f29;
}


/* ─── CERTIFICATIONS ──────────────────────────────── */
/*  bg #ffffff pad 64/160 gap=64
    Items: 3 cards 512×366 bg #f8fbfe r=16 pad=32 gap=32 */
.lp-certifs {
  background: #ffffff;
  padding: 64px max(64px, calc((100% - 1600px) / 2));
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.lp-certifs-in {
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.lp-certifs-items {
  display: flex;
  gap: 32px;
}
.lp-certif-card {
  flex: 1;
  background: #f8fbfe;
  border-radius: 16px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}


/* ─── HANDICAP / ACCESSIBILITÉ ────────────────────── */
/*  bg gradient #ecfdf3→#ffffff pad 64/160 gap=64
    Row: Left 1024px + Photo 512px */
.lp-handi {
  background: linear-gradient(180deg, #ecfdf3 0%, #ffffff 100%);
  padding: 64px max(64px, calc((100% - 1600px) / 2));
}
.lp-handi-in {
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.lp-handi-row {
  display: flex;
  gap: 64px;
  align-items: flex-start;
}
.lp-handi-left {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.lp-handi-title {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.lp-handi-para {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
/* List — label + rows */
.lp-handi-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.lp-list-label {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #0d1f29;
  margin: 0;
}
.lp-list-rows {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.lp-list-row {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 16px;
  font-weight: 400;
  color: #0d1f29;
}
.lp-list-dot {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--color-green);
  flex-shrink: 0;
}
/* Photo */
.lp-handi-img-col { flex-shrink: 0; }
.lp-handi-img {
  width: 512px;
  height: 612px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
}


/* ─── VALEURS ─────────────────────────────────────── */
/*  outer: bg #ffffff pad=16
    inner: bg #f8fbfe r=16 pad 64/144 gap=64
    Items: 3 cards bg #ffffff r=16 pad=32 gap=32 */
.lp-valeurs {
  background: #ffffff;
  padding: 16px;
}
.lp-valeurs-in {
  background: #f8fbfe;
  border-radius: 16px;
  padding: 64px max(48px, calc((100% - 1600px) / 2));
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.lp-valeurs-items {
  display: flex;
  gap: 32px;
}
.lp-valeur-card {
  flex: 1;
  background: #ffffff;
  border-radius: 16px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
/* Bulleted list inside valeur card */
.lp-vlist {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.lp-vlist li {
  font-size: 14px;
  font-weight: 400;
  color: #0d1f29;
  padding-left: 20px;
  position: relative;
}
.lp-vlist li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 5px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #41eb82;
}


/* ─── ERASMUS+ ────────────────────────────────────── */
/*  outer: bg #ffffff pad=16
    inner: bg #f8fbfe r=16 pad 64/144 gap=64
    Row: Left 376px + Items 1160px 3 cards 376×368 gap=16 */
.lp-erasmus {
  background: #ffffff;
  padding: 16px;
}
.lp-erasmus-in {
  background: #f8fbfe;
  border-radius: 16px;
  padding: 64px max(48px, calc((100% - 1600px) / 2));
  display: flex;
  flex-direction: column;
  gap: 64px;
}
.lp-erasmus-row {
  display: flex;
  gap: 64px;
  align-items: flex-start;
}
.lp-erasmus-left {
  width: 376px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.lp-erasmus-items {
  flex: 1;
  display: flex;
  gap: 16px;
}
.lp-erasmus-card {
  /* inherits .lp-arg-card: bg #f0f8fc r=16 pad=32 gap=24 */
}


/* Centred headings for chiffres / certifs / valeurs */
.lp-chiffres .lp-section-top,
.lp-certifs .lp-section-top,
.lp-valeurs .lp-section-top {
  align-items: center;
  text-align: center;
}


/* Green dot override in handi section */
.lp-handi .alt-subtitle__dot { background: #41eb82; }

/* Bullet dots inside arg-cards (missions, erasmus) */
.lp-arg-bullets {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.lp-arg-bullet {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  color: #0d1f29;
}
.lp-bullet-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #3d3fad;
  flex-shrink: 0;
}

/* ─── RESPONSIVE — Le Pôle ───────────────────────── */
@media (max-width: 1280px) {
  .lp-header-text { padding: 0 80px; }
  .lp-missions-in,
  .lp-chiffres-in,
  .lp-valeurs-in,
  .lp-erasmus-in { padding: 48px 64px; }
  .lp-certifs { padding: 48px 80px; }
  .lp-handi { padding: 48px 80px; }
  .lp-hist-in { padding: 0 80px; }
  .lp-hist-items { padding-left: 80px; padding-right: 80px; }
  .lp-hero-h1 { font-size: 44px; }
}

@media (max-width: 960px) {
  .lp-hero-imgs { gap: 8px; padding: 0 8px; }
  .lp-ph img { height: 280px; }
  .lp-missions-row,
  .lp-chiffres-row,
  .lp-handi-row,
  .lp-erasmus-row { flex-direction: column; }
  .lp-missions-left,
  .lp-erasmus-left { width: 100%; }
  .lp-missions-items,
  .lp-erasmus-items { flex-wrap: wrap; }
  .lp-certifs-items,
  .lp-valeurs-items { flex-wrap: wrap; }
  .lp-chiffres-img-col,
  .lp-handi-img-col { width: 100%; }
  .lp-chiffres-img,
  .lp-handi-img { width: 100%; height: auto; }
  .lp-stats-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .lp-hero-h1 { font-size: 32px; }
  /* ── Carrousel horizontal — Figma 9410:8239 */
  .lp-hero-imgs {
    display: flex;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    /* padding lat. = (100vw - cardWidth) / 2  → center first/last card */
    padding: 0 calc((100vw - 67.5vw) / 2) 32px;
    align-items: flex-start;
    scrollbar-width: none;
    -ms-overflow-style: none;
    width: 100%;
  }
  .lp-hero-imgs::-webkit-scrollbar { display: none; }
  .lp-ph {
    flex: 0 0 67.5vw;
    scroll-snap-align: center;
    padding-top: 0 !important;
  }
  .lp-ph img {
    width: 100%;
    height: auto;
    aspect-ratio: 253 / 322;
  }
  .lp-ph:last-child { display: block; }
  .lp-missions-in,
  .lp-chiffres-in,
  .lp-valeurs-in,
  .lp-erasmus-in { padding: 32px 24px; }
  .lp-certifs { padding: 32px 24px; }
  .lp-handi { padding: 32px 24px; }
  .lp-hist-in { padding: 0 24px; }
  .lp-hist-items { padding-left: 24px; padding-right: 24px; }
  .lp-cta { padding: 24px; }
  .lp-header-text { padding: 0 24px; }
  .lp-h2 { font-size: 28px; }
  .lp-stats-grid { grid-template-columns: 1fr 1fr; }
}

/* ALTERNANCE v2.77.0 - Figma node 8991:6055 */

/* -- Gradient body -- */
body.page-template-template-alternance {
  background:
    radial-gradient(ellipse 1600px 900px at 50% 0px, rgba(183,187,255,0.65) 0%, rgba(197,201,255,0.16) 50%, transparent 72%),
    #080717;
}
.alt-dark-wrap { background: none; }




/* Page Contact : identique à la page Centres (dégradé bleu + logo noir) */
body.page-template-template-contact {
  background:
    radial-gradient(ellipse 1600px 1400px at 50% -80px, rgba(182,218,240,0.62) 0%, rgba(210,235,247,0.32) 50%, transparent 72%),
    #ffffff;
}
.page-template-template-contact .site-main,
.page-template-template-contact main,
.page-template-template-contact #main,
.page-template-template-contact .site-content,
.page-template-template-contact #content {
  background: transparent;
}
.page-template-template-contact .logo-svg,
.page-template-template-contact .custom-logo {
  filter: brightness(0);
}

/* PAGE CANDIDATER — fond clair identique à archive-centre */
body.page-template-page-candidater {
  background:
    radial-gradient(ellipse 1600px 1400px at 50% -80px, rgba(182,218,240,0.65) 0%, rgba(210,235,247,0.16) 50%, transparent 72%),
    #ffffff;
}
.page-template-page-candidater .site-main,
.page-template-page-candidater main,
.page-template-page-candidater #main,
.page-template-page-candidater .site-content,
.page-template-page-candidater #content {
  background: transparent;
}
.page-template-page-candidater .logo-svg,
.page-template-page-candidater .custom-logo {
  filter: brightness(0);
}


/* -- Header -- */
.alt-header { background:none; padding:40px 0 48px; position:relative; }
.alt-header__inner { max-width:1440px; padding:0 80px; margin:0 auto; display:flex; flex-direction:column; align-items:center; }

/* Breadcrumb */
.alt-breadcrumb { display:inline-flex; align-items:center; gap:6px; background:#f8f8ff; border-radius:128px; padding:8px 16px; margin-bottom:32px; }
.alt-breadcrumb__home { display:flex; align-items:center; }
.alt-breadcrumb span { font-size:14px; font-weight:600; line-height:20px; color:#0d1f29; }

/* Hero title */
.alt-header__title { text-align:center; }
.alt-header__title h1 { font-size:48px; font-weight:600; line-height:54px; color:#fff; margin:0 0 16px; max-width:784px; }
.alt-header__title p { font-size:18px; font-weight:400; line-height:26px; color:#fff; margin:0; max-width:784px; }

/* Subtitle */
.alt-subtitle { display:flex; align-items:center; gap:10px; padding-bottom:16px; border-bottom:1px solid #d4d6ff; width:100%; margin-bottom:32px; }
.alt-subtitle__dot { width:8px; height:8px; border-radius:50%; background:#b7bbff; flex-shrink:0; }
.alt-subtitle span:last-child { font-size:16px; font-weight:400; color:#0d1f29; }

/* Buttons */
.alt-btn { display:inline-flex; align-items:center; gap:12px; padding:14px 24px; border-radius:100px; font-size:16px; font-weight:600; line-height:20px; text-decoration:none; cursor:pointer; border:none; white-space:nowrap; transition:opacity .2s,transform .15s; font-family:inherit; }
.alt-btn:hover { opacity:.88; }
.alt-btn--green { background:#67ef9b; color:#0d1f29; }
.alt-btn--lavender { background:#c5c9ff; color:#0d1f29; }

/* Cards */
.alt-card { display:flex; flex-direction:column; gap:24px; padding:32px; border-radius:16px; background:#f1f1ff; }
.alt-card__icon { width:60px; height:60px; border-radius:12px; background:#e2e4ff; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.alt-card__text h3 { font-size:22px; font-weight:600; line-height:28px; color:#0d1f29; margin:0 0 8px; }
.alt-card__text p { font-size:18px; font-weight:400; line-height:26px; color:#0d1f29; margin:0; }
.alt-card--wide { flex-direction:column; }
.alt-card--wide .alt-card__text p { font-weight:400; }
.alt-card__btns { display:flex; flex-wrap:wrap; gap:10px; }

/* Intro */
.alt-intro { background:none; padding:64px 0; }
.alt-intro__inner { max-width:1440px; padding:0 80px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.alt-intro__content { display:flex; flex-direction:column; gap:32px; }
.alt-intro__text-block h2 { font-size:36px; font-weight:600; line-height:42px; color:#fff; margin:0 0 16px; }
.alt-intro__text-block p { font-size:18px; font-weight:400; line-height:26px; color:#fff; margin:0; }
.alt-intro__image img { width:100%; height:432px; border-radius:16px; object-fit:cover; display:block; }
.alt-intro__image-placeholder { width:100%; height:432px; border-radius:16px; background:#1a2d3e; }
.alt-intro__buttons { display:flex; gap:16px; flex-wrap:wrap; }

/* Avantages -- outer 8px + inner 72px = 80px total; padding-top for spacing from intro */
.alt-avantages { background:#fff; padding:48px 8px 0; }
.alt-avantages__wrapper { background:#f8f8ff; border-radius:16px; max-width:1440px; margin:0 auto; padding:80px 72px; }
.alt-avantages__content { display:flex; gap:64px; align-items:flex-start; }
.alt-avantages__heading { font-size:36px; font-weight:600; line-height:42px; color:#0d1f29; margin:0; width:376px; flex-shrink:0; }
.alt-avantages__items { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; flex:1; min-width:0; }

/* Remuneration */
.alt-remuneration { background:#fff; padding:80px 0; }
.alt-remuneration__inner { max-width:1440px; padding:0 80px; margin:0 auto; }
.alt-remuneration__content { display:grid; grid-template-columns:1.3fr 2fr; gap:32px; align-items:start; }
.alt-remuneration__left { display:flex; flex-direction:column; gap:32px; align-items:flex-start; }
.alt-remuneration__text h2 { font-size:36px; font-weight:600; line-height:42px; color:#0d1f29; margin:0 0 16px; }
.alt-remuneration__text p { font-size:18px; font-weight:400; line-height:26px; color:#0d1f29; margin:0; }
.alt-remuneration__cards { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-self:start; }
.alt-remuneration__cards .alt-remun-card { align-self:stretch; }
.alt-remun-card {
  background: rgba(102,102,240,.08);
  border-radius: 16px;
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.alt-remun-card h3 { font-size:22px; font-weight:600; line-height:28px; color:#0d1f29; margin:0 0 8px; font-family:inherit; }
.alt-remun-card p { font-size:18px; font-weight:400; line-height:26px; color:#0d1f29; margin:0; font-family:inherit; }

/* Aides -- outer 8px + inner 72px = 80px total */
.alt-aide { background:#fff; padding:0 8px; }
.alt-aide__wrapper { background:#f8f8ff; border-radius:16px; max-width:1440px; margin:0 auto; padding:80px 72px; }
.alt-aide__content { display:flex; flex-direction:column; gap:48px; }
.alt-aide__top { display:flex; justify-content:space-between; align-items:flex-end; gap:40px; }
.alt-aide__title-block h2 { font-size:36px; font-weight:600; line-height:42px; color:#0d1f29; margin:0 0 12px; }
.alt-aide__title-block p { font-size:18px; font-weight:400; line-height:26px; color:#0d1f29; margin:0; max-width:784px; }
.alt-aide__items { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }

/* FAQ */
.alt-faq { background:#fff; padding:80px 0; }
.alt-faq__inner { max-width:1440px; padding:0 80px; margin:0 auto; }
.alt-faq__heading { font-size:28px; font-weight:600; line-height:34px; color:#0d1f29; margin:0 0 48px; }
.alt-faq__items { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.alt-faq__col { display:flex; flex-direction:column; gap:8px; }
.alt-accordion { border-radius:16px; overflow:hidden; background:#f8f8ff; }
.alt-accordion__btn { width:100%; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px; background:transparent; border:none; cursor:pointer; text-align:left; font-size:16px; font-weight:600; line-height:22px; color:#0d1f29; font-family:inherit; }
.alt-accordion__btn span { flex:1; }
.alt-accordion__icon { flex-shrink:0; color:#0d1f29; transition:transform .3s ease; }
.alt-accordion[data-open] .alt-accordion__icon { transform:rotate(45deg); }
.alt-accordion__body { max-height:0; overflow:hidden; transition:max-height .35s ease, padding .35s ease; padding:0 16px; font-size:16px; font-weight:400; line-height:22px; color:#0d1f29; }
.alt-accordion[data-open] .alt-accordion__body { max-height:500px; padding:8px 16px 16px; }
.alt-accordion__body p { margin:0; }

/* CTA -- outer 8px + inner 72px = 80px total */
.alt-cta { background:#fff; padding:16px 8px; }
.alt-cta__wrapper { background:#0d1f29; border-radius:16px; max-width:1440px; margin:0 auto; padding:64px 72px; display:flex; align-items:center; justify-content:space-between; gap:40px; }
.alt-cta__text h2 { font-size:36px; font-weight:600; line-height:42px; color:#fff; margin:0 0 8px; }
.alt-cta__text p { font-size:18px; font-weight:400; line-height:26px; color:#fff; margin:0; }
.alt-cta__actions { display:flex; gap:16px; flex-wrap:wrap; }

/* -- Responsive -- */
@media (max-width:1440px) {
  .alt-header__inner,.alt-intro__inner,.alt-remuneration__inner,.alt-faq__inner { padding:0 48px; }
  .alt-avantages__wrapper,.alt-aide__wrapper { padding:56px 40px; }
  .alt-cta__wrapper { padding:64px 40px; }
  .alt-avantages__heading { width:260px; font-size:28px; line-height:34px; }
  .alt-remuneration__content { grid-template-columns: 1.3fr 2fr; }
  .alt-header__title h1 { font-size:36px; line-height:42px; }
}
@media (max-width:1200px) {
  .alt-avantages__content { flex-direction:column; }
  .alt-avantages__heading { width:100%; font-size:28px; line-height:34px; }
  .alt-remuneration__content { grid-template-columns: 1fr; }
  .alt-remuneration__cards { grid-template-columns: 1fr; }
  .alt-aide__top { flex-wrap:wrap; }
}
@media (max-width:1024px) {
  .alt-intro__inner { grid-template-columns:1fr; }
  .alt-intro__image { display:none; }
  .alt-faq__items { grid-template-columns:1fr; gap:0; }
  .alt-avantages__items { grid-template-columns:repeat(2,1fr); }
  .alt-aide__items { grid-template-columns:repeat(2,1fr); }
  .alt-header__inner,.alt-intro__inner,.alt-remuneration__inner,.alt-faq__inner { padding:0 32px; }
  .alt-avantages__wrapper,.alt-aide__wrapper { padding:48px 24px; }
  .alt-cta__wrapper { padding:48px 24px; }
}
@media (max-width:768px) {
  .alt-header { padding:32px 0; }
  .alt-header__inner,.alt-intro__inner,.alt-remuneration__inner,.alt-faq__inner { padding:0 20px; }
  .alt-avantages { padding:32px 4px 0; }
  .alt-aide { padding:0 4px; }
  .alt-cta { padding:12px 4px; }
  .alt-avantages__wrapper,.alt-aide__wrapper { padding:40px 20px; }
  .alt-cta__wrapper { padding:32px 20px; flex-direction:column; align-items:flex-start; }
  .alt-header__title h1 { font-size:28px; line-height:34px; }
  .alt-intro__text-block h2 { font-size:24px; line-height:30px; }
  .alt-avantages__items,.alt-aide__items { grid-template-columns:1fr; }
  .alt-aide__top { flex-direction:column; align-items:flex-start; }
  .alt-remun-card { padding: 20px; }
  .alt-faq__col { gap:4px; }
}
@media (max-width:480px) {
  .alt-header__title h1 { font-size:24px; line-height:30px; }
  .alt-btn { font-size:14px; padding:12px 16px; }
}

/* ═══════════════════════════════════════════════════════════════
   CENTRES ARCHIVE PAGE — post-type-archive-centre
════════════════════════════════════════════════════════════════ */

/* Gradient bleu clair couvrant topbar + header + hero */
body.post-type-archive-centre {
  background:
    radial-gradient(ellipse 1600px 1400px at 50% -80px, rgba(182,218,240,0.65) 0%, rgba(210,235,247,0.16) 50%, transparent 72%),
    #ffffff;
}
.post-type-archive-centre .site-main,
.post-type-archive-centre main,
.post-type-archive-centre #main,
.post-type-archive-centre .site-content,
.post-type-archive-centre #content {
  background: transparent;
}

/* Topbar transparente, police et flèches noires */
.post-type-archive-centre .logo-svg,
.post-type-archive-centre .custom-logo,
.post-type-archive-actualite .logo-svg,
.post-type-archive-actualite .custom-logo,
.single-actualite .logo-svg,
.single-actualite .custom-logo {
  filter: brightness(0);
}

/* ── Hero ── */
.ctr-archive-hero {
  background: transparent;
  padding: 64px 160px 72px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}
.ctr-bc-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #f8f8ff;
  border-radius: 128px;
  padding: 8px 16px;
  color: #0d1f29;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-decoration: none;
  margin-bottom: 8px;
}
.ctr-bc-home {
  display: flex;
  align-items: center;
}
.ctr-bc-pill span {
  font-size: 14px;
  font-weight: 600;
  color: #0d1f29;
}
.ctr-archive-hero h1 {
  font-size: 48px;
  font-weight: 600;
  line-height: 54px;
  color: #0d1f29;
  margin: 0;
  max-width: 720px;
}
.ctr-archive-subtitle {
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  color: #0d1f29;
  margin: 0;
  max-width: 560px;
}

/* ── Map section ── */
.ctr-map-section {
  background: transparent;
  padding: 80px 0;
}
.ctr-map-header {
  text-align: center;
  margin-bottom: 48px;
}
.ctr-map-header h2 {
  font-size: 36px;
  font-weight: 600;
  line-height: 42px;
  color: #0d1f29;
  margin: 0 0 12px;
}
.ctr-map-intro {
  font-size: 16px;
  color: rgba(13,31,41,0.7);
  max-width: 520px;
  line-height: 1.6;
  margin: 0 auto;
}

/* ── Pourquoi ── */
.ctr-why-section {
  background: #ffffff;
  padding: 80px 0;
}
.ctr-why-header {
  text-align: center;
  margin-bottom: 48px;
}
.ctr-why-header h2 {
  font-size: 36px;
  font-weight: 600;
  line-height: 42px;
  color: #0d1f29;
  margin: 0 0 12px;
}
.ctr-why-header p {
  font-size: 16px;
  color: rgba(13,31,41,0.65);
  max-width: 520px;
  margin: 0 auto;
  line-height: 1.6;
}
.ctr-why-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.ctr-why-card {
  background: #ecfdf3;
  border-radius: 16px;
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ctr-why-icon {
  width: 52px;
  height: 52px;
  background: #d9fbe6;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.ctr-why-card h3 {
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  color: #0d1f29;
  margin: 0;
}
.ctr-why-card p {
  font-size: 15px;
  font-weight: 400;
  line-height: 22px;
  color: rgba(13,31,41,0.7);
  margin: 0;
}

/* ── FAQ (même style que alternance) ── */
.ctr-faq-section { background:#fff; padding:80px 0; }
.ctr-faq-inner { max-width:1440px; padding:0 80px; margin:0 auto; }
.ctr-faq-heading { font-size:28px; font-weight:600; line-height:34px; color:#0d1f29; margin:0 0 48px; }
.ctr-faq-items { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.ctr-faq-col { display:flex; flex-direction:column; gap:8px; }

@media (max-width: 1100px) {
  .ctr-why-grid { grid-template-columns: repeat(2, 1fr); }
  .ctr-faq-items { grid-template-columns: 1fr; }
  .ctr-archive-hero { padding: 48px 40px 48px; }
  .ctr-faq-inner { padding: 0 40px; }
}
@media (max-width: 768px) {
  .ctr-why-grid { grid-template-columns: 1fr; }
  .ctr-archive-hero { padding: 40px 24px; }
  .ctr-archive-hero h1 { font-size: 32px; line-height: 38px; }
  .ctr-faq-inner { padding: 0 24px; }
}

/* ═══════════════════════════════════════════════════════════════
   OFFRES D'EMPLOI — archive + single
   Préfixes : oe-* (archive listing) · oed-* (single détail)
════════════════════════════════════════════════════════════════ */

/* ── Body gradient + header transparents (identique Centres) ── */
body.post-type-archive-offre,
body.single-offre {
  background:
    radial-gradient(ellipse 1600px 1400px at 50% -80px, rgba(182,218,240,0.62) 0%, rgba(210,235,247,0.32) 50%, transparent 72%),
    #ffffff;
}
.post-type-archive-offre .site-main,
.post-type-archive-offre main,
.post-type-archive-offre #main,
.single-offre .site-main,
.single-offre main,
.single-offre #main { background: transparent; }

.post-type-archive-offre .logo-svg,
.post-type-archive-offre .custom-logo,
.single-offre .logo-svg,
.single-offre .custom-logo { filter: brightness(0); }

/* Sidebar filtre — dégradé bleu clair sur archive offres & nous rejoindre */
.post-type-archive-offre .form-filter-sidebar,
.post-type-archive-rejoindre .form-filter-sidebar {
  background: linear-gradient(to bottom, #b6daf0, #f8fbfe);
}
.post-type-archive-offre .form-filter-header,
.post-type-archive-offre .form-filter-label,
.post-type-archive-rejoindre .form-filter-header,
.post-type-archive-rejoindre .form-filter-label { color: #0d1f29; }

/* Nous rejoindre — fond clair + header transparent */
body.post-type-archive-rejoindre,
body.single-rejoindre {
  background:
    radial-gradient(ellipse 1600px 1400px at 50% -80px, rgba(182,218,240,0.62) 0%, rgba(210,235,247,0.32) 50%, transparent 72%),
    #ffffff;
}
.post-type-archive-rejoindre .site-main,
.post-type-archive-rejoindre main,
.post-type-archive-rejoindre #main,
.single-rejoindre .site-main,
.single-rejoindre main,
.single-rejoindre #main { background: transparent; }
.post-type-archive-rejoindre .logo-svg,
.post-type-archive-rejoindre .custom-logo,
.single-rejoindre .logo-svg,
.single-rejoindre .custom-logo { filter: brightness(0); }

/* ══════════════════════════════
   ARCHIVE — oe-*
══════════════════════════════ */

/* ── Header ── */
.oe-header {
  background: transparent;
  padding: 48px 0 64px;
  text-align: center;
}
.oe-header-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 160px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

/* Breadcrumb pill */
.oe-bc-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #f8fbfe;
  border-radius: 128px;
  padding: 8px 16px;
  margin-bottom: 32px;
  font-size: 0.875rem;
  font-weight: 600;
  color: #0d1f29;
  text-decoration: none;
}
.oe-bc-home {
  display: flex;
  align-items: center;
  color: #0d1f29;
}
.oe-bc-chevron { opacity: 0.45; flex-shrink: 0; }
.oe-bc-cur { font-weight: 600; }

/* H1 + lead */
.oe-h1 {
  font-size: clamp(2rem, 3.5vw, 3rem);
  font-weight: 600;
  line-height: 1.125;
  color: #0d1f29;
  font-family: var(--font-heading);
  max-width: 784px;
  margin: 0 0 16px;
  text-align: center;
}
.oe-lead {
  font-size: 1.125rem;
  line-height: 1.6;
  color: #0d1f29;
  max-width: 784px;
  margin: 0;
  text-align: center;
}

/* ── Body layout ── */
.oe-body {
  background: transparent;
  padding: 0 0 80px;
}
.oe-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 160px 0;
  display: flex;
  gap: 32px;
  align-items: flex-start;
}

/* ── Sidebar filtres ── */
.oe-filters {
  width: 376px;
  flex-shrink: 0;
  background: linear-gradient(to bottom, #b6daf0 0%, #f8fbfe 100%);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: 120px;
}
.oe-filters-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: #0d1f29;
  font-family: var(--font-heading);
  margin: 0;
}
.oe-filters-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.oe-fgroup {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.oe-flabel {
  font-size: 1rem;
  font-weight: 500;
  color: #0d1f29;
  font-family: var(--font-heading);
}
.oe-fselect-wrap {
  position: relative;
}
.oe-fselect {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  background: #fff;
  border: none;
  border-radius: 999px;
  padding: 14px 44px 14px 16px;
  font-size: 1rem;
  font-family: var(--font-body);
  color: #0d1f29;
  cursor: pointer;
  outline: none;
  line-height: 1.5;
}
.oe-fselect:focus { box-shadow: 0 0 0 2px rgba(90,216,204,0.4); }
.oe-fselect-icon {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: #0d1f29;
}

/* Boutons */
.oe-filters-btns {
  display: flex;
  align-items: center;
  margin-top: 16px;
  gap: 0;
}
.oe-btn-apply,
.oe-btn-clear {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: none;
  border-radius: 200px;
  padding: 14px 24px;
  font-size: 1rem;
  font-weight: 600;
  font-family: var(--font-heading);
  color: #0d1f29;
  cursor: pointer;
  text-decoration: none;
  line-height: 1.25;
  transition: opacity .15s;
}
.oe-btn-apply { background: #7be0d6; }
.oe-btn-clear { background: #c5e1f3; }
.oe-btn-apply:hover,
.oe-btn-clear:hover { opacity: .85; }

/* ── Grille cards ── */
.oe-grid {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  align-content: flex-start;
}

/* ── Card offre ── */
.oe-card {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  height: 668px;
  width: calc(33.333% - 22px); /* 3 cols in a flex-wrap with gap 32 */
  min-width: 240px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  text-decoration: none;
  color: inherit;
  flex-shrink: 0;
}
.oe-card-bg {
  position: absolute;
  inset: 0;
  background-color: #1a2e3a;
  background-size: cover;
  background-position: center;
  z-index: 0;
}
.oe-card-overlay-top {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(8,7,23,0.48) 0%, rgba(8,7,23,0) 14%);
  z-index: 1;
  pointer-events: none;
}
.oe-card-tags {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
  padding: 16px;
}
.oe-badge-loc {
  background: #c5c9ff;
  color: #0d1f29;
  border-radius: 999px;
  padding: 4px 8px;
  font-size: 0.875rem;
  font-weight: 500;
  font-family: var(--font-heading);
  text-transform: uppercase;
  white-space: nowrap;
  letter-spacing: .03em;
}
.oe-card-bottom {
  position: relative;
  z-index: 2;
  backdrop-filter: blur(50px);
  -webkit-backdrop-filter: blur(50px);
  background: linear-gradient(to bottom, rgba(8,7,23,0) 0%, #080717 100%);
  padding: 64px 32px 32px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
}
.oe-card-content {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  color: #fff;
}
.oe-card-content h3 {
  font-size: 1.375rem;
  font-weight: 600;
  line-height: 1.27;
  color: #fff;
  font-family: var(--font-heading);
  margin: 0;
}
.oe-card-content p {
  font-size: 1rem;
  line-height: 1.375;
  color: #fff;
  margin: 0;
}
.oe-card-plus {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #5ad8cc;
  color: #0d1f29;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background .15s, transform .15s;
}
.oe-card:hover .oe-card-plus {
  background: #41eb82;
  transform: scale(1.08);
}

/* Empty state */
.oe-empty {
  grid-column: 1 / -1;
  padding: 64px 0;
  text-align: center;
  color: #5a6c7a;
  font-size: 1.125rem;
}

/* Pagination */
.oe-pagination {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 160px 80px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
}

/* ══════════════════════════════
   SINGLE DÉTAIL — oed-*
══════════════════════════════ */

/* ── Header ── */
.oed-header {
  background: transparent;
  padding: 32px 0 64px;
  text-align: center;
}
.oed-header-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 160px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

/* Breadcrumb pill */
.oed-bc-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #f8fbfe;
  border-radius: 128px;
  padding: 8px 16px;
  font-size: 0.875rem;
  font-weight: 600;
  color: #0d1f29;
}
.oed-bc-home {
  display: flex;
  align-items: center;
  color: #0d1f29;
}
.oed-bc-chevron { opacity: 0.45; flex-shrink: 0; }
.oed-bc-link {
  color: #0d1f29;
  text-decoration: none;
  font-weight: 400;
}
.oed-bc-link:hover { text-decoration: underline; }
.oed-bc-cur { font-weight: 600; }

/* H1 */
.oed-h1 {
  font-size: clamp(1.75rem, 3.5vw, 3rem);
  font-weight: 600;
  line-height: 1.125;
  color: #0d1f29;
  font-family: var(--font-heading);
  max-width: 784px;
  margin: 0;
  text-align: center;
}

/* Badges row */
.oed-badges-row {
  display: flex;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
  justify-content: center;
}
.oed-badge-group {
  display: flex;
  align-items: center;
}
.oed-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  font-size: 0.875rem;
  font-weight: 500;
  font-family: var(--font-heading);
  text-transform: uppercase;
  letter-spacing: .03em;
  white-space: nowrap;
}
.oed-badge--white {
  background: #fff;
  color: #0d1f29;
  border-radius: 999px;
}
.oed-badge--teal {
  background: #7be0d6;
  color: #0d1f29;
  border-radius: 4px;
}

/* ── Body layout ── */
.oed-body {
  background: transparent;
  padding: 0 0 80px;
}
.oed-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 160px;
  display: flex;
  gap: 32px;
  align-items: flex-start;
}

/* ── Contenu principal ── */
.oed-main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.oed-intro {
  font-size: 1.125rem;
  line-height: 1.6;
  color: #0d1f29;
  margin: 0 0 32px;
}
.oed-section {
  margin-bottom: 32px;
}
.oed-section h2 {
  font-size: 1rem;
  font-weight: 600;
  color: #0d1f29;
  font-family: var(--font-heading);
  margin: 0 0 8px;
}
.oed-rich {
  font-size: 1rem;
  line-height: 1.625;
  color: #0d1f29;
}
.oed-rich p,
.oed-rich ul,
.oed-rich ol { margin: 0 0 8px; }
.oed-rich ul { padding-left: 20px; }
.oed-rich li { margin-bottom: 4px; }

/* ── Sidebar candidature ── */
.oed-aside {
  width: 376px;
  flex-shrink: 0;
  position: sticky;
  top: 120px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.oed-cand-card {
  background: linear-gradient(to bottom, #5ad8cc 0%, #effbfa 100%);
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.oed-cand-title {
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1.2;
  color: #0d1f29;
  font-family: var(--font-heading);
  margin: 0;
}
.oed-cand-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.oed-cand-body p {
  font-size: 1rem;
  line-height: 1.5;
  color: #0d1f29;
  margin: 0;
}
.oed-cand-body a {
  color: #0d1f29;
  font-weight: 600;
  text-decoration: underline;
}
.oed-cand-body a:hover { opacity: .75; }

/* Retour listing */
.oed-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #0d1f29;
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
  opacity: .7;
  transition: opacity .15s;
}
.oed-back:hover { opacity: 1; }

/* ══════════════════════════════
   RESPONSIVE — Offres
══════════════════════════════ */
@media (max-width: 1280px) {
  .oe-header-inner,
  .oe-inner,
  .oed-header-inner,
  .oed-inner { padding-left: 80px; padding-right: 80px; }
  .oe-pagination { padding-left: 80px; padding-right: 80px; }
  .oe-card { width: calc(50% - 16px); }
}
@media (max-width: 1024px) {
  .oe-header-inner,
  .oe-inner,
  .oed-header-inner,
  .oed-inner { padding-left: 40px; padding-right: 40px; flex-direction: column; }
  .oe-filters,
  .oed-aside { width: 100%; position: static; }
  .oe-card { width: calc(50% - 16px); }
}
@media (max-width: 640px) {
  .oe-header-inner,
  .oe-inner,
  .oed-header-inner,
  .oed-inner { padding-left: 20px; padding-right: 20px; }
  .oe-card { width: 100%; height: 400px; }
  .oe-h1,
  .oed-h1 { font-size: 1.75rem; }
  .oed-badges-row { gap: 12px; }
}

/* ============================================================
   PAGE FAQ — dégradé + logo noir (même pattern que Centres)
============================================================ */
body.page-template-template-faq {
  background:
    radial-gradient(ellipse 1600px 1400px at 50% -80px, rgba(182,218,240,0.62) 0%, rgba(210,235,247,0.32) 50%, transparent 72%),
    #ffffff;
}
.page-template-template-faq .site-main,
.page-template-template-faq #page,
.page-template-template-faq .site-content { background: transparent; }

.page-template-template-faq .logo-svg,
.page-template-template-faq .custom-logo { filter: brightness(0); }



/* ============================================================
   PAGE FAQ — HEADER (breadcrumb · h1 · sous-titre)
============================================================ */
.faq-header { background: transparent; padding: 40px 0 48px; }
.faq-header__inner {
  max-width: 1440px;
  padding: 0 80px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* Titre + sous-titre centrés, texte sombre (fond clair) */
.faq-header__title { text-align: center; }
.faq-header__title h1 { font-size: 48px; font-weight: 600; line-height: 54px; color: #0d1f29; margin: 0 0 16px; max-width: 784px; }
.faq-header__title p  { font-size: 18px; font-weight: 400; line-height: 26px; color: #0d1f29; margin: 0; max-width: 784px; }

/* ============================================================
   PAGE FAQ — BODY (catégories + accordéons)
============================================================ */
.faq-body { background: transparent; padding-bottom: 80px; }

.faq-cat { background: transparent; padding: 80px 0; }
.faq-cat + .faq-cat { border-top: none; padding-top: 0; }

.faq-cat__inner { max-width: 1440px; padding: 0 80px; margin: 0 auto; }

.faq-cat__title { font-size: 28px; font-weight: 600; line-height: 34px; color: #0d1f29; margin: 0 0 48px; }

.faq-cat__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; }
.faq-cat__col  { display: flex; flex-direction: column; gap: 8px; }

/* Variante bleue des accordéons */
.alt-accordion--blue { background: #f8fbfe; }

/* ============================================================
   PAGE FAQ — RESPONSIVE
============================================================ */
@media (max-width: 1280px) {
  .faq-header__inner,
  .faq-cat__inner { padding-left: 48px; padding-right: 48px; }
}
@media (max-width: 1024px) {
  .faq-header__inner,
  .faq-cat__inner { padding-left: 32px; padding-right: 32px; }
  .faq-cat__grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .faq-header { padding: 32px 0; }
  .faq-header__inner,
  .faq-cat__inner { padding-left: 20px; padding-right: 20px; }
  .faq-header__title h1 { font-size: 28px; line-height: 34px; }
  .faq-cat { padding: 40px 0; }
}



/* ── Formation continue : fond sombre + topbar transparent ── */
body.page-formation-continue {
  background: radial-gradient(ellipse 1600px 900px at 50% 0px, rgba(183,187,255,0.38) 0%, rgba(197,201,255,0.10) 50%, transparent 72%), #080717;
}

/* ============================================================
   FORMATION CONTINUE — fc-* / fc-av-*   (v3.08.0)
   Figma node 9831:10191 — pixel-perfect
============================================================ */

/* ── HERO ──────────────────────────────────────────────── */
.fc-hero {
  position: relative;
  padding: 32px 0;
}
.fc-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 80px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

/* Breadcrumb pill */
.fc-bc {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #f8f8ff;
  border-radius: 128px;
  padding: 8px 16px;
  text-decoration: none;
  white-space: nowrap;
}
.fc-bc a {
  display: inline-flex;
  align-items: center;
  gap: 0;
  color: #0d1f29;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}
.fc-bc-sep { color: #0d1f29; margin: 0 4px; }
.fc-bc-sep {
  display: inline-flex;
  align-items: center;
  color: #b7bbff;
  line-height: 1;
}
.fc-bc-cur {
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: #0d1f29;
}

/* H1 */
.fc-h1 {
  font-size: 48px;
  font-weight: 600;
  line-height: 54px;
  color: #ffffff;
  margin: 0;
  max-width: 784px;
  text-align: center;
}

/* ── INTRO ─────────────────────────────────────────────── */
.fc-intro {
  padding: 64px 0;
}
.fc-intro-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 80px;
  display: flex;
  gap: 64px;
  align-items: center;
}
.fc-intro-left {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.fc-intro-body {
  color: #ffffff;
  font-size: 18px;
  line-height: 26px;
  margin-bottom: 32px;
}
.fc-intro-body p {
  font-size: 18px;
  line-height: 26px;
  color: #ffffff;
  margin: 0 0 8px;
}
.fc-intro-body ul {
  margin: 8px 0 0;
  padding-left: 20px;
  list-style-type: disc;
}
.fc-intro-body li {
  font-size: 18px;
  line-height: 26px;
  color: #ffffff;
  margin-bottom: 8px;
}
/* Green button */
.fc-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 52px;
  padding: 0 24px;
  background: #67ef9b;
  color: #0d1f29;
  border-radius: 200px;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  text-decoration: none;
  white-space: nowrap;
  align-self: flex-start;
  transition: background .18s;
}
.fc-btn:hover { background: #4de888; }

/* Right image */
.fc-intro-right {
  flex: 1;
  min-width: 0;
}
.fc-intro-right img,
.fc-intro-right .wp-post-image {
  width: 100%;
  height: 432px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
}
.fc-intro-ph {
  width: 100%;
  height: 432px;
  background: rgba(255,255,255,.05);
  border-radius: 16px;
  border: 1.5px dashed rgba(255,255,255,.12);
}

/* ── AVANTAGES ─────────────────────────────────────────── */
.fc-av {
  background: #ffffff;
  padding: 16px 0;
}
/* Inner wrapper — aligned to same content width as hero/intro */
.fc-av-wrap {
  background: #f8f8ff;
  border-radius: 16px;
  padding: 64px 80px;
  max-width: 1440px;
  margin: 0 auto;
  box-sizing: border-box;
}

/* Solutions label row — border-bottom IS the separator line */
.fc-av-label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-bottom: 16px;
  border-bottom: 1px solid #d4d6ff;
  margin-bottom: 64px;
}
.fc-av-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #b7bbff;
  flex-shrink: 0;
}
.fc-av-label-text {
  font-size: 16px;
  font-weight: 400;
  line-height: 16px;
  color: #0d1f29;
}

/* Two-column body */
.fc-av-body {
  display: flex;
  gap: 64px;
  align-items: flex-start;
}
.fc-av-left {
  width: 376px;
  flex-shrink: 0;
}
.fc-av-h2 {
  font-size: 36px;
  font-weight: 600;
  line-height: 42px;
  color: #0d1f29;
  margin: 0;
}

/* Cards grid 2×2 */
.fc-av-cards {
  flex: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.fc-av-card {
  background: #f1f1ff;
  border-radius: 16px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.fc-av-card-icon {
  width: 60px;
  height: 60px;
  background: #e2e4ff;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.fc-av-card-text {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.fc-av-card-title {
  font-size: 22px;
  font-weight: 600;
  line-height: 28px;
  color: #0d1f29;
  margin: 0;
}
.fc-av-card-body {
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  color: #0d1f29;
  margin: 0;
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 1400px) {
  .fc-av-left { width: 280px; }
}
@media (max-width: 1280px) {
  .fc-hero-inner, .fc-intro-inner { padding: 0 80px; }
}
@media (max-width: 1100px) {
  .fc-h1 { font-size: 40px; line-height: 46px; }
  .fc-hero-inner, .fc-intro-inner { padding: 0 48px; }
  .fc-av-wrap { padding: 48px 40px; }
  .fc-av-body { gap: 40px; }
  .fc-av-h2 { font-size: 30px; line-height: 36px; }
}
@media (max-width: 900px) {
  .fc-intro-inner { flex-direction: column; gap: 40px; }
  .fc-intro-right img,
  .fc-intro-right .wp-post-image,
  .fc-intro-ph { height: 300px; }
  .fc-av-body { flex-direction: column; gap: 32px; }
  .fc-av-left { width: 100%; }
}
@media (max-width: 640px) {
  .fc-hero { padding: 32px 0 24px; }
  .fc-hero-inner, .fc-intro-inner { padding: 0 20px; }
  .fc-h1 { font-size: 28px; line-height: 34px; }
  .fc-intro { padding: 40px 0; }
  .fc-intro-body, .fc-intro-body p, .fc-intro-body li {
    font-size: 16px; line-height: 24px;
  }
  .fc-av { padding: 12px; }
  .fc-av-wrap { padding: 32px 20px; border-radius: 12px; }
  .fc-av-label { margin-bottom: 32px; }
  .fc-av-cards { grid-template-columns: 1fr; }
  .fc-av-h2 { font-size: 26px; line-height: 32px; }
  .fc-av-card-body { font-size: 16px; line-height: 24px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   VIE ÉTUDIANTE — ve-*
   Gradient / topbar / logo : identiques à Contact, FAQ, Centres
════════════════════════════════════════════════════════════════════════ */

/* -- Fond de page -- */
body.page-template-template-vie-etudiante {
  background:
    radial-gradient(ellipse 1600px 1400px at 50% -80px, rgba(182,218,240,0.62) 0%, rgba(210,235,247,0.32) 50%, transparent 72%),
    #ffffff;
}
.page-template-template-vie-etudiante .site-main,
.page-template-template-vie-etudiante main,
.page-template-template-vie-etudiante #main,
.page-template-template-vie-etudiante .site-content,
.page-template-template-vie-etudiante #content {
  background: transparent;
}
.page-template-template-vie-etudiante .logo-svg,
.page-template-template-vie-etudiante .custom-logo {
  filter: brightness(0);
}


/* -- Header -- */
.ve-header {
  display: flex;
  flex-direction: column;
  gap: 32px;
  padding-top: 40px;
}
.ve-header__inner {
  max-width: 1440px;
  padding: 0 80px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ve-header__h1 {
  font-size: 48px;
  font-weight: 600;
  line-height: 54px;
  color: #0d1f29;
  text-align: center;
  margin: 0;
}

/* -- Bande de 5 photos --
   Technique Figma : wrappers avec padding-top pour le décalage.
   Le wrapper est un flex-item — sa hauteur = padding-top + photo_height.
----------------------------------------------------------------------- */
.ve-photos {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  width: 100%;
  padding: 0 16px 56px;
}

/* Wrappers — tous les 5 photos, padding-top via inline style */
.ve-pw {
  flex: 1;
}

/* Photo dans wrapper — identique à .lp-ph img */
.ve-photo {
  width: 100%;
  height: 478px;
  object-fit: cover;
  border-radius: 16px;
  display: block;
  box-shadow: 0 4px 24px rgba(13,31,41,0.14);
}
.ve-photo--empty {
  background: #e8eaf0;
}
/* Images insérées dans le contenu (réseau / WALT) — même radius + ombre que les visuels de la page */
.ve-img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(13,31,41,0.14);
  margin-top: 16px;
}
.ve-img--logo {
  width: auto;
  max-width: 320px;
  margin-left: auto;
  margin-right: auto;
}

/* -- Contenu principal -- */
.ve-content { padding: 64px 0 80px; }
.ve-content__inner {
  max-width: 784px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  gap: 48px;
}

/* -- Section générique -- */
.ve-section { display: flex; flex-direction: column; gap: 16px; }
.ve-section__title {
  font-size: 28px;
  font-weight: 600;
  line-height: 34px;
  color: #0d1f29;
  margin: 0;
}
.ve-section__text {
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  color: #0d1f29;
  margin: 0;
}

/* Rich text BDE */
.ve-section__rich {
  font-size: 18px;
  font-weight: 400;
  line-height: 26px;
  color: #0d1f29;
}
.ve-section__rich p  { margin: 0 0 8px; }
.ve-section__rich ul { list-style: disc; margin: 0 0 8px; padding-left: 27px; }
.ve-section__rich li { list-style-type: disc; margin-bottom: 0; }

/* -- Boutons -- */
.ve-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.ve-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #c5e1f3;
  border-radius: 200px;
  padding: 14px 24px;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  color: #0d1f29;
  text-decoration: none;
  transition: background 0.2s;
  white-space: nowrap;
}
.ve-btn:hover { background: #aed3ed; color: #0d1f29; text-decoration: none; }
.ve-btn svg   { flex-shrink: 0; }

/* -- Duo images -- */
.ve-duo {
  display: flex;
  gap: 32px;
  height: 484px;
}
.ve-duo__photo {
  flex: 1;
  border-radius: 16px;
  background-color: #ddeef8;
  background-size: cover;
  background-position: center;
}
.ve-duo__bde {
  flex: 1;
  border-radius: 16px;
  background-color: #f1f1ff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ve-duo__bde-logo {
  width: 65%;
  height: auto;
  display: block;
}

/* -- Responsive -- */
@media (max-width: 1280px) {
  .ve-header__inner { padding-left: 48px; padding-right: 48px; }
}
@media (max-width: 960px) {
  .ve-photos { gap: 8px; padding: 0 8px 40px; }
  .ve-photo { height: 280px; }
  .ve-duo { height: 320px; }
}
@media (max-width: 600px) {
  .ve-header { padding-top: 24px; }
  .ve-header__inner { padding-left: 20px; padding-right: 20px; padding-bottom: 20px; }
  .ve-header__h1 { font-size: 32px; line-height: 38px; }
  /* ── Carrousel horizontal — même design que Le Pôle ── */
  .ve-photos {
    display: flex;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 16px;
    padding: 0 calc((100vw - 67.5vw) / 2) 32px;
    align-items: flex-start;
    scrollbar-width: none;
    -ms-overflow-style: none;
    width: 100%;
  }
  .ve-photos::-webkit-scrollbar { display: none; }
  .ve-pw {
    flex: 0 0 67.5vw;
    scroll-snap-align: center;
    padding-top: 0 !important;
  }
  .ve-photo {
    width: 100%;
    height: auto;
    aspect-ratio: 253 / 322;
  }
  /* Reset negative margins single-centre */
  .sc-header .ve-photos { width: 100%; margin-left: 0; margin-right: 0; }
  .ve-content { padding: 40px 0 60px; }
  .ve-content__inner { gap: 32px; }
  .ve-section__title { font-size: 22px; line-height: 28px; }
  .ve-section__text, .ve-section__rich { font-size: 16px; line-height: 24px; }
  .ve-btn { font-size: 15px; padding: 12px 18px; }
  .ve-duo { flex-direction: column; height: auto; gap: 16px; }
  .ve-duo__photo, .ve-duo__bde { aspect-ratio: 4/3; height: auto; flex: none; width: 100%; }
}

/* ============================================================
   PAGE MENTIONS LEGALES — ml-*
============================================================ */
.page-template-template-mentions-legales .site-main,
.page-template-template-mentions-legales #page,
.page-template-template-mentions-legales .site-content { background: transparent; }



/* Header */
.ml-header { background: transparent; padding: 40px 0 48px; }
.ml-header__inner {
  max-width: 1440px;
  padding: 0 80px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
.ml-header__h1 {
  font-size: 48px;
  font-weight: 600;
  line-height: 54px;
  color: #0d1f29;
  margin: 0;
  width: 100%;
  text-align: center;
}

/* Body */
.ml-body { background: transparent; padding-bottom: 96px; }
.ml-body__inner {
  max-width: 1440px;
  padding: 0 80px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 64px;
}

/* Bloc identité */
.ml-intro {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.ml-intro__block {
  background: #f0f8fc;
  border-radius: 16px;
  padding: 32px 40px;
}
.ml-intro__block p {
  font-size: 16px;
  line-height: 26px;
  color: #0d1f29;
  margin: 0;
}
.ml-intro__block a {
  color: #0d1f29;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.ml-intro__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.ml-intro__card {
  background: #ffffff;
  border: 1px solid #e2f0f9;
  border-radius: 16px;
  padding: 28px 32px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ml-intro__card-title {
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #3d3fad;
  margin: 0;
}
.ml-intro__card p {
  font-size: 15px;
  line-height: 24px;
  color: #0d1f29;
  margin: 0;
}
.ml-intro__card a {
  color: #0d1f29;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Sections légales */
.ml-sections {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.ml-section {
  border-top: 1px solid #e2f0f9;
  padding: 40px 0;
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 64px;
  align-items: start;
}
.ml-section:last-child { border-bottom: 1px solid #e2f0f9; }
.ml-section__title {
  font-size: 18px;
  font-weight: 600;
  line-height: 26px;
  color: #0d1f29;
  margin: 0;
  padding-top: 2px;
}
.ml-section__text p {
  font-size: 16px;
  line-height: 26px;
  color: rgba(13,31,41,0.75);
  margin: 0 0 16px;
}
.ml-section__text p:last-child { margin-bottom: 0; }
.ml-section__text a {
  color: #0d1f29;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Responsive */
@media (max-width: 1024px) {
  .ml-header__inner,
  .ml-body__inner { padding-left: 48px; padding-right: 48px; }
  .ml-intro__grid { grid-template-columns: repeat(2, 1fr); }
  .ml-section { grid-template-columns: 220px 1fr; gap: 40px; }
}
@media (max-width: 768px) {
  .ml-header__inner,
  .ml-body__inner { padding-left: 32px; padding-right: 32px; }
  .ml-header__h1 { font-size: 32px; line-height: 40px; }
  .ml-intro__grid { grid-template-columns: 1fr; }
  .ml-section { grid-template-columns: 1fr; gap: 12px; padding: 32px 0; }
  .ml-body { padding-bottom: 60px; }
  .ml-body__inner { gap: 40px; }
}
@media (max-width: 480px) {
  .ml-header__inner,
  .ml-body__inner { padding-left: 20px; padding-right: 20px; }
  .ml-intro__block { padding: 24px 20px; }
  .ml-intro__card { padding: 20px 20px; }
}

/* ── Temoignages : flèches pill identiques "Nos centres de formation" ── */
.temo-arrow {
  width: auto !important;
  min-width: 52px;
  height: 52px;
  border-radius: 200px;
  padding: 0 16px;
  gap: 0;
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  font-family: var(--font-heading);
  font-size: .875rem;
  font-weight: 600;
  white-space: nowrap;
  transition: gap .3s ease, padding .3s ease, background .2s;
}
.temo-arrow-prev { background: #b6daf0; color: #0d1f29; }
.temo-arrow-next { background: #b6daf0; color: #0d1f29; }
.temo-arrow:disabled { opacity: .35; cursor: not-allowed; }
.temo-arrow:not(:disabled):hover { gap: 8px; padding: 0 20px; transform: none !important; }
.temo-arrow-prev:not(:disabled):hover { background: #9dcfe6; }
.temo-arrow-next:not(:disabled):hover { background: #9dcfe6; }
.temo-arrow-label {
  max-width: 0; opacity: 0; overflow: hidden; white-space: nowrap;
  transition: max-width .3s ease, opacity .25s ease;
}
.temo-arrow:not(:disabled):hover .temo-arrow-label { max-width: 90px; opacity: 1; }

/* == Single actualite : fond degrade bleu clair == */
body.single-actualite {
  background:
    radial-gradient(ellipse 1600px 1400px at 50% -80px, rgba(182,218,240,0.65) 0%, rgba(210,235,247,0.16) 50%, transparent 72%),
    #ffffff;
}
.single-actualite .site-main,
.single-actualite main,
.single-actualite #main,
.single-actualite .site-content,
.single-actualite #content { background: transparent; }

/* == Single actualite : texte sombre sur fond blanc == */
.single-actualite .entry-content,
.single-actualite .entry-content p,
.single-actualite .entry-content li,
.single-actualite .entry-content h2,
.single-actualite .entry-content h3,
.single-actualite .entry-content strong { color: #0d1f29; }

/* == Centrage des enfants de .actu-detail-content == */
.actu-detail-content > * { margin-left: auto; margin-right: auto; }

/* == Liens dans le corps des articles : style uniforme (écrase Gutenberg inline) == */
.actu-detail-body a { color: #0d1f29 !important; text-decoration: underline; text-underline-offset: 3px; }

/* ============================================================
   HOMEPAGE — Nos formations phares
============================================================ */
.hp-phares-section {
  padding: 80px 0;
  background: var(--color-bg-dark, #0d1f29);
}
.hp-phares-titre {
  font-size: 36px;
  font-weight: 700;
  color: #fff;
  margin: 8px 0 40px;
}
.hp-phares-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  width: 100%;
}
.hp-phares-cta {
  margin-top: 40px;
  display: flex;
  justify-content: center;
}
@media (max-width: 1024px) {
  .hp-phares-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .hp-phares-section { padding: 56px 0; }
  .hp-phares-titre { font-size: 28px; }
  .hp-phares-grid { grid-template-columns: 1fr; }
}
.actu-detail-body a:hover { color: #5ad8cc !important; text-decoration: none; }

/* ── Boutons dans les articles actualites ───────────────────────────────── */
.actu-detail-body .btn {
  text-decoration: none !important;
  color: #0d1f29 !important;
}
.actu-detail-body .btn:hover {
  color: #0d1f29 !important;
  text-decoration: none !important;
}
.actu-detail-body .btn-light-blue:hover {
  background: #aad0ea;
  border-color: #aad0ea;
}

/* ── Centrage des images dans les articles actualites ───────────────────── */
.actu-detail-body figure {
  text-align: center;
  margin: 20px auto;
  display: block;
}
.actu-detail-body figure img {
  display: inline-block;
  max-width: 100%;
  height: auto;
}
.actu-detail-body img:not(figure img) {
  display: block;
  margin: 20px auto;
  max-width: 100%;
  height: auto;
}