/* ============================================================
   BIFA INSTITUTE — Pôle Formation
   Feuille de style MUTUALISÉE des 10 pages du pôle Formation
   (1 catalogue + 9 landing pages).

   Elle reprend à l'identique le CSS validé par le client, jusque-là
   dupliqué en ligne dans chacune des 10 pages (~300 Ko cumulés).
   Il est ici servi une seule fois et mis en cache par le navigateur.

   Ordre du fichier :
     1. Design validé des landing pages  — INCHANGÉ
     2. Composants du catalogue          — INCHANGÉ
     3. Fiche « visuel officiel »        — INCHANGÉ
     4. Couche de compaction             — AJOUT (espaces uniquement)
   ============================================================ */


/* ============================================================
   BIFA INSTITUTE — Certification Contrôle de gestion & Reporting
   Système : les deux bleus officiels du logo — #0A4470 / #198ECE
   Signature : « la ligne de relevé » — filets, chiffres tabulaires
   ============================================================ */
:root{
  /* Les deux bleus officiels du logo BIFA Institute */
  --bifa-blue:#0A4470;      /* bleu institutionnel — couleur principale */
  --bifa-sky:#198ECE;       /* bleu ciel — accent, CTA, éléments actifs */

  /* Déclinaisons de profondeur du bleu institutionnel */
  --blue-deep:#062E4D;      /* fonds sombres majeurs */
  --blue-mid:#083A61;       /* carte d'offre principale */

  /* Déclinaisons du bleu ciel calibrées pour le contraste (WCAG AA) */
  --sky-cta:#1179B4;        /* fond de bouton portant du texte blanc */
  --sky-ink:#0F6FA6;        /* petit texte d'accent sur fond clair */
  --sky-light:#7CC6EE;      /* petit texte d'accent sur fond sombre */

  /* Fonds */
  --paper:#FFFFFF;
  --paper-soft:#F5F8FB;
  --paper-blue:#E9F1F8;

  /* Textes et filets */
  --text:#1B2E3D;
  --muted:#556B7E;
  --line:#DDE7EF;
  --line-strong:#C3D3E1;

  --on-dark:#FFFFFF;
  --on-dark-muted:#A9C4DA;
  --on-dark-line:rgba(255,255,255,.15);

  --maxw:1180px;
  --gutter:clamp(20px, 5vw, 40px);
  --radius:4px;
  --ease:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;scroll-padding-top:88px;-webkit-text-size-adjust:100%;}
body{
  font-family:'Inter',system-ui,sans-serif;
  color:var(--text);
  background:var(--paper);
  line-height:1.65;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;}
ul{list-style:none;}

/* ---------- Typographie ---------- */
h1,h2,h3,h4{
  font-family:'Source Serif 4',Georgia,serif;
  font-weight:600;
  color:var(--bifa-blue);
  line-height:1.14;
  letter-spacing:-0.015em;
}
.h-display{font-size:clamp(34px,5.6vw,60px);font-weight:700;letter-spacing:-0.028em;}
.h-section{font-size:clamp(26px,3.6vw,42px);}
.h-sub{font-size:clamp(19px,2.1vw,23px);}
.mono{font-family:'IBM Plex Mono',ui-monospace,monospace;font-variant-numeric:tabular-nums;}
.lead{font-size:clamp(16px,1.6vw,18.5px);color:var(--muted);line-height:1.7;}

.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;
  color:var(--sky-ink);
  display:flex;align-items:center;gap:12px;
}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--bifa-sky);flex:none;}
.eyebrow--onDark{color:var(--sky-light);}

/* ---------- Structure ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter);}
.wrap--narrow{max-width:840px;}
.band{padding:clamp(60px,8vw,108px) 0;position:relative;}
.band--paper{background:var(--paper);}
.band--soft{background:var(--paper-soft);}
.band--blue{background:var(--paper-blue);}
.band--dark{background:var(--bifa-blue);color:var(--on-dark);}
.band--deep{background:var(--blue-deep);color:var(--on-dark);}
.band--dark h1,.band--dark h2,.band--dark h3,.band--dark h4,
.band--deep h1,.band--deep h2,.band--deep h3,.band--deep h4{color:var(--on-dark);}
.band--dark .lead,.band--deep .lead{color:var(--on-dark-muted);}

.sec-head{max-width:680px;margin-bottom:clamp(34px,4.5vw,56px);}
.sec-head .h-section{margin-top:18px;}
.sec-head .lead{margin-top:16px;}

/* Filet de séparation « relevé » */
.rule{height:1px;background:var(--line);border:0;}
.rule--dark{background:var(--on-dark-line);}

/* ---------- Boutons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 26px;border-radius:var(--radius);
  font-family:'Inter',sans-serif;font-weight:600;font-size:15px;letter-spacing:.005em;
  border:1px solid transparent;
  transition:background-color .25s var(--ease), color .25s var(--ease),
             border-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease);
  will-change:transform;
}
.btn .arw{transition:transform .3s var(--ease);}
.btn:hover .arw{transform:translateX(4px);}
.btn--sky{background:var(--sky-cta);color:#fff;box-shadow:0 10px 24px -14px rgba(25,142,206,.55);}
.btn--sky:hover{background:var(--bifa-blue);transform:translateY(-2px);box-shadow:0 16px 30px -14px rgba(10,68,112,.55);}
.btn--navy{background:var(--bifa-blue);color:#fff;}
.btn--navy:hover{background:var(--blue-deep);transform:translateY(-2px);}
.btn--ghost{border-color:var(--line-strong);color:var(--bifa-blue);background:transparent;}
.btn--ghost:hover{border-color:var(--bifa-blue);background:var(--bifa-blue);color:#fff;}
.btn--ghostLight{border-color:rgba(255,255,255,.35);color:#fff;}
.btn--ghostLight:hover{border-color:#fff;background:#fff;color:var(--bifa-blue);}
.btn--full{width:100%;}
.btn--sm{padding:11px 18px;font-size:14px;}

.link-under{
  display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:15px;
  color:var(--sky-ink);padding-bottom:3px;border-bottom:1px solid var(--line-strong);
  transition:border-color .25s var(--ease),color .25s var(--ease);
}
.link-under:hover{border-color:var(--sky-ink);}
.link-under--light{color:var(--sky-light);border-color:rgba(255,255,255,.3);}
.link-under--light:hover{border-color:var(--sky-light);}

/* ---------- Accessibilité ---------- */
:focus-visible{outline:2px solid var(--bifa-sky);outline-offset:3px;border-radius:2px;}
.band--dark :focus-visible,.band--deep :focus-visible,.hero :focus-visible,.site-footer :focus-visible{outline-color:var(--sky-light);}
.skip{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--blue-deep);color:#fff;padding:12px 20px;font-weight:600;
}
.skip:focus{left:12px;top:12px;}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* ============================================================
   EN-TÊTE
   ============================================================ */
.site-header{
  position:sticky;top:0;z-index:80;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
  transition:box-shadow .3s var(--ease);
}
.site-header.is-stuck{box-shadow:0 6px 24px -18px rgba(6,46,77,.5);}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:14px;}
.brand{display:flex;align-items:center;padding:2px 0;}
.brand img{height:40px;width:auto;}
.nav-links{display:flex;gap:30px;font-size:14.5px;font-weight:500;color:var(--bifa-blue);}
.nav-links a{position:relative;padding:4px 0;transition:color .2s var(--ease);}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--bifa-sky);
  transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);
}
.nav-links a:hover{color:var(--sky-ink);}
.nav-links a:hover::after{transform:scaleX(1);}
.nav-end{display:flex;align-items:center;gap:16px;}
.tag-fdfp{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;font-weight:600;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);border:1px solid var(--line);
  border-radius:2px;padding:6px 11px;white-space:nowrap;
}
.burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;}
.burger-bars{display:block;position:relative;width:22px;height:1.5px;background:var(--bifa-blue);transition:background .2s;}
.burger-bars::before,.burger-bars::after{
  content:"";position:absolute;left:0;width:22px;height:1.5px;background:var(--bifa-blue);
  transition:transform .3s var(--ease),top .2s var(--ease);
}
.burger-bars::before{top:-7px;}
.burger-bars::after{top:7px;}
.burger[aria-expanded="true"] .burger-bars{background:transparent;}
.burger[aria-expanded="true"] .burger-bars::before{top:0;transform:rotate(45deg);}
.burger[aria-expanded="true"] .burger-bars::after{top:0;transform:rotate(-45deg);}
.mobile-panel{display:none;}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  background:var(--blue-deep);
  color:var(--on-dark);
  padding:clamp(48px,6.5vw,88px) 0 clamp(56px,7vw,96px);
  position:relative;overflow:hidden;
}
/* Trame « papier millimétré comptable », très discrète */
.hero::before{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(120% 90% at 20% 0%, #000 20%, transparent 78%);
  -webkit-mask-image:radial-gradient(120% 90% at 20% 0%, #000 20%, transparent 78%);
  pointer-events:none;
}
.hero::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,var(--bifa-sky) 0%, rgba(25,142,206,0) 55%);
}
.hero .wrap{position:relative;z-index:2;}
.hero-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(36px,5vw,72px);align-items:center;}
.hero h1{margin:22px 0 22px;color:#fff;}
.hero h1 em{font-style:normal;color:var(--bifa-sky);display:block;}
.hero .lead{max-width:540px;color:#C6DCEC;}
.hero-proof{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:30px;}
.hero-proof li{
  font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.06em;
  color:var(--on-dark-muted);text-transform:uppercase;display:flex;align-items:center;gap:9px;
}
.hero-proof li::before{content:"";width:5px;height:5px;background:var(--bifa-sky);flex:none;transform:rotate(45deg);}
.hero-scroll{margin-top:34px;}

/* Fiche de session — élément signature */
.fiche{
  background:#fff;color:var(--text);
  border-radius:var(--radius);
  padding:clamp(24px,3vw,34px);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.75);
  border-top:3px solid var(--bifa-sky);
}
.fiche-title{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding-bottom:16px;border-bottom:1px solid var(--line);
}
.fiche-row{
  display:flex;justify-content:space-between;align-items:baseline;gap:18px;
  padding:13px 0;border-bottom:1px solid var(--line);
}
.fiche-row dt{font-size:13.5px;color:var(--muted);}
.fiche-row dd{font-size:14.5px;font-weight:600;text-align:right;color:var(--bifa-blue);}
.fiche-actions{margin-top:28px;display:flex;flex-direction:column;gap:12px;}
.fiche-note{font-size:12.5px;color:var(--muted);text-align:center;line-height:1.5;}

/* ============================================================
   TÉMOIGNAGE VIDÉO — façade YouTube (l'iframe n'est chargée qu'au clic)
   ============================================================ */
.video-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(32px,5vw,72px);align-items:center;}
.video-intro .h-section{margin-top:18px;}
.video-intro .lead{margin-top:16px;}
.video-meta{
  margin-top:26px;padding-top:20px;border-top:1px solid var(--line-strong);
  font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);
}
.video{
  position:relative;aspect-ratio:16/9;width:100%;
  background:var(--blue-deep);border-radius:var(--radius);overflow:hidden;
  border-top:3px solid var(--bifa-sky);
  box-shadow:0 40px 80px -44px rgba(6,46,77,.75);
}
.video-facade{
  position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;
  display:flex;align-items:center;justify-content:center;cursor:pointer;background:none;
}
.video-thumb{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform .6s var(--ease),opacity .3s var(--ease);
}
.video-facade::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(6,46,77,.15) 0%, rgba(6,46,77,.6) 100%);
}
.video-facade:hover .video-thumb{transform:scale(1.03);}
.video-play{
  position:relative;z-index:2;width:74px;height:74px;border-radius:50%;
  background:var(--sky-cta);display:flex;align-items:center;justify-content:center;
  box-shadow:0 14px 34px -14px rgba(6,46,77,.9);
  transition:transform .3s var(--ease),background-color .3s var(--ease);
}
.video-facade:hover .video-play{transform:scale(1.07);background:var(--bifa-sky);}
.video-play svg{width:22px;height:24px;margin-left:4px;fill:#fff;}
.video-label{
  position:absolute;z-index:2;left:0;right:0;bottom:0;padding:20px 24px;color:#fff;
  display:flex;justify-content:space-between;align-items:flex-end;gap:16px;text-align:left;
}
.video-label b{
  font-family:'Source Serif 4',serif;font-size:17px;font-weight:600;color:#fff;line-height:1.3;
}
.video-label span{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sky-light);white-space:nowrap;
}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
@media (max-width:1024px){
  .video-grid{grid-template-columns:1fr;gap:32px;}
}
@media (max-width:520px){
  .video-play{width:60px;height:60px;}
  .video-play svg{width:18px;height:20px;}
  .video-label{padding:16px;flex-direction:column;align-items:flex-start;gap:6px;}
  .video-label b{font-size:15.5px;}
}

/* ============================================================
   ENJEU — trois questions, pas de cartes
   ============================================================ */
.enjeu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);}
.enjeu-item{padding:34px 34px 34px 0;border-right:1px solid var(--line);}
.enjeu-item:last-child{border-right:none;padding-right:0;}
.enjeu-item:not(:first-child){padding-left:34px;}
.enjeu-item .idx{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.16em;
  color:var(--sky-ink);text-transform:uppercase;
}
.enjeu-item .q{
  font-family:'Source Serif 4',serif;font-size:clamp(19px,2.1vw,22px);line-height:1.32;
  color:var(--bifa-blue);margin:14px 0 12px;font-weight:600;
}
.enjeu-item p{font-size:14.5px;color:var(--muted);}

/* ============================================================
   OBJECTIFS (fond foncé) — relevé numéroté
   ============================================================ */
.obj-list{border-top:1px solid var(--on-dark-line);}
.obj-item{
  display:grid;grid-template-columns:92px 1fr;gap:clamp(16px,3vw,44px);
  padding:clamp(24px,3vw,34px) 0;border-bottom:1px solid var(--on-dark-line);
  align-items:start;position:relative;
}
.obj-item::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--bifa-sky);
  transform:scaleY(0);transform-origin:top;transition:transform .4s var(--ease);
}
.obj-item:hover::before{transform:scaleY(1);}
.obj-num{
  font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:.14em;
  color:var(--sky-light);font-weight:600;padding-top:8px;
}
.obj-body h3{font-size:clamp(20px,2.4vw,27px);margin-bottom:10px;}
.obj-body p{color:var(--on-dark-muted);font-size:15.5px;max-width:720px;}
.obj-foot{
  margin-top:clamp(28px,4vw,44px);display:flex;flex-wrap:wrap;gap:18px 30px;
  align-items:center;justify-content:space-between;
}
.obj-foot p{color:var(--on-dark-muted);font-size:14.5px;max-width:560px;}

/* ============================================================
   PROGRAMME — relevé de modules
   ============================================================ */
.prog{border-top:1px solid var(--line-strong);}
.prog-item{
  display:grid;grid-template-columns:72px 1fr 150px;gap:clamp(14px,2.5vw,32px);
  align-items:center;padding:clamp(22px,2.6vw,30px) 0;
  border-bottom:1px solid var(--line);position:relative;
  transition:padding-left .35s var(--ease);
}
.prog-item::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--bifa-sky);
  transform:scaleY(0);transform-origin:top;transition:transform .4s var(--ease);
}
.prog-item:hover::before{transform:scaleY(1);}
.prog-item:hover{padding-left:18px;}
.prog-idx{
  font-family:'IBM Plex Mono',monospace;font-size:clamp(20px,2.4vw,26px);font-weight:500;
  color:#55708A;transition:color .35s var(--ease);letter-spacing:-.02em;
}
.prog-item:hover .prog-idx{color:var(--bifa-sky);}
.prog-body h3{font-size:clamp(18px,2vw,22px);margin-bottom:7px;}
.prog-body p{font-size:14.5px;color:var(--muted);max-width:620px;}
.prog-meta{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);text-align:right;
}

/* ============================================================
   PUBLIC
   ============================================================ */
.public-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,5vw,72px);align-items:start;}
.public-list{border-top:1px solid var(--line-strong);}
.public-list li{
  display:flex;align-items:baseline;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);
  font-size:15.5px;color:var(--bifa-blue);font-weight:500;
}
.public-list li span{
  font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--sky-ink);flex:none;letter-spacing:.1em;
}
.public-note{
  margin-top:26px;padding:20px 22px;background:#fff;border-left:2px solid var(--bifa-sky);
  font-size:14.5px;color:var(--muted);
}

/* ============================================================
   CHIFFRES (fond foncé)
   ============================================================ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(20px,3vw,36px);margin-top:clamp(30px,4vw,52px);}
.stat{border-top:1px solid var(--on-dark-line);padding-top:20px;}
.stat-n{
  font-family:'IBM Plex Mono',monospace;font-size:clamp(28px,4vw,40px);font-weight:500;
  color:#fff;letter-spacing:-.03em;line-height:1;
}
.stat-n{word-spacing:-.3em;}
.stat-l{font-size:13.5px;color:var(--on-dark-muted);margin-top:12px;line-height:1.5;}
.partners{
  margin-top:clamp(36px,5vw,58px);padding-top:28px;border-top:1px solid var(--on-dark-line);
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;
}
.partners .lbl{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--on-dark-muted);margin-right:6px;
}
.pill{
  border:1px solid var(--on-dark-line);border-radius:2px;padding:9px 18px;
  font-size:13.5px;font-weight:500;color:#DCE9F3;
  transition:border-color .3s var(--ease),color .3s var(--ease);
}
.pill:hover{border-color:var(--bifa-sky);color:#fff;}

/* ============================================================
   TÉMOIGNAGES
   ============================================================ */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,28px);}
.testi{
  background:#fff;border:1px solid var(--line);border-top:2px solid var(--line-strong);
  padding:clamp(24px,2.6vw,30px);display:flex;flex-direction:column;
  transition:border-top-color .35s var(--ease),transform .35s var(--ease),box-shadow .35s var(--ease);
}
.testi:hover{border-top-color:var(--bifa-sky);transform:translateY(-3px);box-shadow:0 24px 40px -32px rgba(6,46,77,.6);}
.testi .mark{font-family:'Source Serif 4',serif;font-size:38px;line-height:.6;color:var(--bifa-sky);margin-bottom:18px;}
.testi blockquote{
  font-family:'Source Serif 4',serif;font-size:17px;line-height:1.56;color:var(--bifa-blue);
  flex-grow:1;margin-bottom:22px;
}
.testi figcaption{border-top:1px solid var(--line);padding-top:16px;}
.testi .who{font-weight:600;font-size:14px;color:var(--bifa-blue);}
.testi .role{font-size:13px;color:var(--muted);margin-top:2px;}

/* ============================================================
   OFFRE / CONVERSION
   ============================================================ */
.offer-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,2.6vw,30px);align-items:stretch;}
.offer{padding:clamp(28px,3.4vw,44px);display:flex;flex-direction:column;border-radius:var(--radius);}
.offer--main{background:var(--blue-mid);color:#fff;border-top:3px solid var(--bifa-sky);box-shadow:0 40px 70px -46px rgba(6,46,77,.9);}
.offer--main h3{color:#fff;}
.offer--alt{background:#fff;border:1px solid var(--line);border-top:3px solid var(--line-strong);}
.offer-kicker{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--sky-light);margin-bottom:14px;
}
.offer--alt .offer-kicker{color:var(--sky-ink);}
.offer h3{font-size:clamp(21px,2.3vw,26px);margin-bottom:10px;}
.offer .sub{font-size:14.5px;color:var(--muted);margin-bottom:26px;}
.offer--main .sub{color:var(--on-dark-muted);}
.offer-price{
  font-family:'IBM Plex Mono',monospace;font-weight:600;letter-spacing:-.03em;
  font-size:clamp(36px,5.6vw,54px);line-height:1;color:#fff;display:flex;align-items:baseline;gap:10px;
}
.offer-price > span:first-child{word-spacing:-.34em;}
.offer-price .cur{font-size:16px;font-weight:500;color:var(--sky-light);letter-spacing:.06em;}
.offer-price--quote{font-family:'Source Serif 4',serif;font-size:clamp(28px,3.6vw,38px);color:var(--bifa-blue);letter-spacing:-.02em;}
.offer-rule{height:2px;background:var(--bifa-sky);margin:16px 0 0;transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--ease) .15s;}
.is-inview .offer-rule{transform:scaleX(1);}
/* Compteur de places — 15 traits, ligne de relevé */
.seatbar{display:flex;align-items:center;gap:14px;margin-top:20px;flex-wrap:wrap;}
.ticks{display:flex;gap:7px;align-items:flex-end;}
.ticks i{
  display:block;width:1.5px;height:15px;background:var(--bifa-sky);opacity:.85;
  transform:scaleY(0);transform-origin:bottom;
  transition:transform .5s var(--ease);
}
.is-inview .ticks i{transform:scaleY(1);}
.seatbar span{font-size:13.5px;color:var(--on-dark-muted);}
.offer-list{margin:26px 0;flex-grow:1;}
.offer-list li{
  display:flex;gap:12px;padding:11px 0;font-size:14.5px;color:var(--on-dark-muted);
  border-bottom:1px solid var(--on-dark-line);
}
.offer--alt .offer-list li{color:var(--muted);border-bottom-color:var(--line);}
.offer-list li::before{content:"—";color:var(--sky-light);flex:none;}
.offer--alt .offer-list li::before{color:var(--bifa-sky);}
.offer-foot{font-size:12.5px;color:var(--muted);margin-top:14px;text-align:center;}
.offer--main .offer-foot{color:#8FAEC8;}

/* ============================================================
   FAQ
   ============================================================ */
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%;display:flex;justify-content:space-between;align-items:center;gap:24px;
  padding:22px 0;text-align:left;
  font-family:'Source Serif 4',serif;font-size:clamp(17px,1.9vw,20px);font-weight:600;color:var(--bifa-blue);
  transition:color .2s var(--ease);
}
.faq-q:hover{color:var(--sky-ink);}
.faq-sign{position:relative;width:14px;height:14px;flex:none;}
.faq-sign::before,.faq-sign::after{
  content:"";position:absolute;background:var(--sky-ink);transition:transform .35s var(--ease);
}
.faq-sign::before{top:6px;left:0;width:14px;height:1.5px;}
.faq-sign::after{left:6px;top:0;width:1.5px;height:14px;}
.faq-q[aria-expanded="true"] .faq-sign::after{transform:rotate(90deg);}
.faq-a{overflow:hidden;height:0;transition:height .35s var(--ease);}
.faq-a > div{padding:0 0 24px;max-width:720px;}
.faq-a p{font-size:15px;color:var(--muted);}
.faq-a p + p{margin-top:10px;}

/* ============================================================
   CTA FINAL & PIED DE PAGE
   ============================================================ */
.final{text-align:center;position:relative;overflow:hidden;}
.final::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(80% 120% at 50% 0%, rgba(25,142,206,.26) 0%, transparent 62%);
  pointer-events:none;
}
.final .wrap{position:relative;z-index:2;}
.final .h-section{margin:20px auto 16px;max-width:780px;}
.final .lead{max-width:600px;margin:0 auto 34px;}
.final .eyebrow{justify-content:center;}
.final-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.final-meta{
  margin-top:30px;font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--on-dark-muted);
}

.site-footer{background:var(--bifa-blue);color:#B6CEE0;padding:clamp(44px,6vw,64px) 0 28px;font-size:14px;}
.footer-top{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:clamp(28px,4vw,48px);padding-bottom:34px;}
.footer-top h2{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:#fff;margin-bottom:16px;font-weight:600;
}
.footer-logo{height:44px;width:auto;margin-bottom:22px;}
.footer-top p{color:#9FBBD2;line-height:1.85;}
.footer-top a:hover{color:var(--sky-light);}
.footer-about{font-size:14.5px;max-width:460px;}
.footer-bottom{
  border-top:1px solid var(--on-dark-line);padding-top:20px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
  font-size:12.5px;color:#9BB7CF;
}

/* ============================================================
   BARRE DE CONVERSION MOBILE
   ============================================================ */
.mobile-bar{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:90;
  background:rgba(255,255,255,.97);backdrop-filter:blur(10px);
  border-top:1px solid var(--line);padding:10px var(--gutter);
  padding-bottom:calc(10px + env(safe-area-inset-bottom));
  gap:10px;transform:translateY(110%);transition:transform .4s var(--ease);
  box-shadow:0 -8px 30px -22px rgba(6,46,77,.8);
}
.mobile-bar.is-visible{transform:translateY(0);}
.mobile-bar .price-mini{
  font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600;color:var(--bifa-blue);
  display:flex;flex-direction:column;justify-content:center;line-height:1.25;flex:none;
}
.mobile-bar .price-mini small{font-size:10px;font-weight:500;color:var(--muted);letter-spacing:.06em;}

/* ============================================================
   ANIMATIONS AU DÉFILEMENT
   ============================================================ */
.js .reveal{opacity:0;transform:translateY(16px);}
.js .reveal.is-inview{
  opacity:1;transform:none;
  transition:opacity .8s var(--ease) var(--d,0ms), transform .8s var(--ease) var(--d,0ms);
}

/* Repli sans JavaScript */
.no-js .faq-a{height:auto;}
.no-js .offer-rule,.no-js .ticks i{transform:none;}
.no-js .mobile-bar{display:none !important;}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  .hero-grid{grid-template-columns:1fr;gap:40px;}
  .fiche{max-width:520px;}
  .public-grid{grid-template-columns:1fr;gap:32px;}
  .offer-grid{grid-template-columns:1fr;}
  .enjeu-grid{grid-template-columns:1fr;border-top:none;}
  .enjeu-item{border-right:none;border-top:1px solid var(--line);padding:26px 0;}
  .enjeu-item:not(:first-child){padding-left:0;}
  .enjeu-item:last-child{padding-bottom:0;}
}
@media (max-width:860px){
  html{scroll-padding-top:74px;}
  .nav-links,.tag-fdfp,.nav-end .btn{display:none;}
  .burger{display:flex;}
  .mobile-panel{
    display:block;overflow:hidden;height:0;transition:height .35s var(--ease);
    border-top:1px solid var(--line);background:#fff;
  }
  .mobile-panel ul{padding:8px 0 18px;}
  .mobile-panel li a{
    display:block;padding:14px var(--gutter);font-size:16px;font-weight:500;color:var(--bifa-blue);
    border-bottom:1px solid var(--line);
  }
  .mobile-panel .btn{margin:16px var(--gutter) 0;width:calc(100% - var(--gutter)*2);}
  .mobile-bar{display:flex;}
  body{padding-bottom:76px;}

  .stats{grid-template-columns:repeat(2,1fr);gap:24px 20px;}
  .testi-grid{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr;gap:26px;}
  .obj-item{grid-template-columns:1fr;gap:8px;}
  .obj-num{padding-top:0;}
  .prog-item{grid-template-columns:44px 1fr;gap:16px;row-gap:8px;}
  .prog-meta{grid-column:2;text-align:left;}
  .prog-item:hover{padding-left:12px;}
  .fiche{max-width:none;}
  .hero-proof{gap:8px 20px;margin-top:24px;}
  .hero .lead{font-size:16px;line-height:1.62;}
  .hero-scroll{margin-top:26px;}
  .final-actions .btn{width:100%;}
}
@media (max-width:520px){
  .btn{padding:14px 20px;font-size:14.5px;width:100%;}
  .mobile-bar .btn{width:auto;flex:1;padding:13px 12px;font-size:13.5px;}
  .hero-scroll .link-under{font-size:14px;}
  .seatbar{gap:10px;}
  .ticks i{height:13px;}
  .testi blockquote{font-size:16px;}
  .footer-bottom{flex-direction:column;}
}

/* ============================================================
   MOUVEMENT RÉDUIT
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{
    animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .js .reveal{opacity:1 !important;transform:none !important;}
  .offer-rule,.ticks i{transform:none !important;}
  .mobile-bar{transition:none;}
}

/* ============================================================
   PAGE CATALOGUE — cartes de formation, filtres, timeline, carrousel
   ============================================================ */
/* — Hero catalogue : pleine largeur, sans carte latérale — */
.cat-hero{padding-bottom:0;}
.cat-lede{max-width:900px;}
.cat-h1{margin:22px 0 24px;color:#fff;}
.cat-h1 em{font-style:normal;color:var(--bifa-sky);display:block;}
.cat-hero .lead{max-width:720px;color:#C6DCEC;}
.cat-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px;}

.cat-figures{
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,3vw,40px);
  margin-top:clamp(44px,6vw,72px);padding-top:30px;border-top:1px solid var(--on-dark-line);
}
.cat-figures li{display:flex;flex-direction:column;gap:8px;}
.cat-figures b{
  font-family:'IBM Plex Mono',monospace;font-size:clamp(30px,4.4vw,46px);font-weight:500;
  color:#fff;line-height:1;letter-spacing:-.03em;
}
.cat-figures span{font-size:13.5px;color:var(--on-dark-muted);line-height:1.45;}

/* — Index des formations, en bas du hero — */
.cat-index{
  margin-top:clamp(44px,6vw,72px);
  border-top:1px solid var(--on-dark-line);background:rgba(255,255,255,.03);
}
.cat-index-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
}
.cat-index a{
  display:flex;align-items:baseline;gap:10px;padding:18px 16px 18px 0;
  border-right:1px solid var(--on-dark-line);
  font-size:14px;font-weight:500;color:#DCE9F3;line-height:1.3;
  transition:color .25s var(--ease);
}
.cat-index a:nth-child(4n),
.cat-index a:last-child{border-right:none;}
.cat-index a:nth-child(n+5){border-top:1px solid var(--on-dark-line);}
.cat-index a:hover{color:var(--bifa-sky);}
.cat-index a i{
  font-style:normal;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.1em;
  color:var(--sky-light);flex:none;
}
.cat-index a:not(:nth-child(4n)){padding-right:16px;}
.cat-index a:not(:nth-child(4n+1)){padding-left:20px;}

/* — Calendrier sur fond institutionnel — */
.band--dark .tl-head{border-bottom-color:var(--on-dark-line);}
.band--dark .tl-head span{color:var(--on-dark-muted);border-left-color:var(--on-dark-line);}
.band--dark .tl-row{border-bottom-color:var(--on-dark-line);}
.band--dark .tl-row:hover{background:rgba(255,255,255,.06);}
.band--dark .tl-name{color:#fff;}
.band--dark .tl-name em{color:var(--on-dark-muted);}
.band--dark .tl-track{background-image:linear-gradient(90deg,var(--on-dark-line) 1px,transparent 1px);}
.band--dark .tl-legend{color:var(--on-dark-muted);}

/* — Filtres — */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:clamp(28px,3.5vw,42px);}
.filter{
  font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  padding:10px 18px;border:1px solid var(--line-strong);border-radius:2px;color:var(--bifa-blue);
  background:transparent;transition:background-color .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease);
}
.filter:hover{border-color:var(--bifa-blue);}
.filter[aria-pressed="true"]{background:var(--bifa-blue);border-color:var(--bifa-blue);color:#fff;}

/* — Cartes formation — */
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(18px,2.4vw,26px);}
.card{
  display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);
  border-top:3px solid var(--line-strong);border-radius:var(--radius);overflow:hidden;
  transition:border-top-color .35s var(--ease),transform .35s var(--ease),box-shadow .35s var(--ease);
}
.card:hover{border-top-color:var(--bifa-sky);transform:translateY(-4px);box-shadow:0 30px 50px -34px rgba(6,46,77,.55);}
.card.is-hidden{display:none;}
.card-media{position:relative;background:var(--blue-deep);overflow:hidden;}
.card-media img{width:100%;height:auto;display:block;transition:transform .6s var(--ease);}
.card:hover .card-media img{transform:scale(1.03);}
.card-rank{
  position:absolute;top:0;left:0;z-index:2;
  font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;letter-spacing:.1em;
  color:#fff;background:rgba(6,46,77,.82);padding:7px 12px;
}
.card-body{padding:clamp(20px,2.4vw,28px);display:flex;flex-direction:column;flex-grow:1;}
.card-cats{
  font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--sky-ink);margin-bottom:12px;
}
.card-body h3{font-size:clamp(19px,2.1vw,23px);margin-bottom:10px;}
.card-body p.pitch{font-size:14.5px;color:var(--muted);flex-grow:1;margin-bottom:20px;}
.card-facts{
  display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:20px;
}
.card-facts .when{font-size:13px;color:var(--muted);}
.card-facts .price{
  font-family:'IBM Plex Mono',monospace;font-size:16px;font-weight:600;color:var(--bifa-blue);
  white-space:nowrap;letter-spacing:-.02em;
}
.card-facts .price small{font-size:10.5px;font-weight:500;color:var(--muted);letter-spacing:.06em;margin-left:4px;}
.card .btn{width:100%;}

/* — Timeline — */
.tl{margin-top:clamp(26px,3.5vw,40px);}
.tl-head{
  display:grid;grid-template-columns:var(--cols);gap:0;
  margin-left:var(--label);border-bottom:1px solid var(--line-strong);padding-bottom:10px;margin-bottom:6px;
}
.tl-head span{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);padding-left:10px;border-left:1px solid var(--line-strong);
}
.tl-head span:first-child{border-left:none;padding-left:0;}
.tl-row{
  display:grid;grid-template-columns:var(--label) 1fr;align-items:center;gap:0;
  padding:13px 0;border-bottom:1px solid var(--line);transition:background-color .3s var(--ease);
}
.tl-row:hover{background:rgba(25,142,206,.05);}
.tl-name{padding-right:18px;font-size:14.5px;font-weight:600;color:var(--bifa-blue);line-height:1.3;}
.tl-name em{display:block;font-style:normal;font-family:'IBM Plex Mono',monospace;font-size:10.5px;
  letter-spacing:.1em;color:var(--muted);margin-top:4px;text-transform:uppercase;}
.tl-track{
  position:relative;height:30px;
  background-image:linear-gradient(90deg,var(--line-strong) 1px,transparent 1px);
  background-size:var(--month) 100%;
}
.tl-bar{
  position:absolute;top:5px;height:20px;left:var(--l);width:var(--w);
  background:var(--sky-cta);border-radius:2px;
  display:flex;align-items:center;padding:0 10px;
  transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease) var(--d,0ms),background-color .3s var(--ease);
  min-width:80px;
}
.is-inview .tl-bar{transform:scaleX(1);}
.tl-row:hover .tl-bar{background:var(--bifa-blue);}
.tl-bar span{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.06em;color:#fff;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.tl-legend{margin-top:20px;font-size:13.5px;color:var(--muted);}

/* — Vidéo sur fond sombre : le cadre doit se détacher du bandeau — */
.band--deep .video{background:var(--bifa-blue);box-shadow:0 40px 80px -40px rgba(0,0,0,.65);}

/* — Carrousel témoignages — */
.carousel{position:relative;}
.car-track{
  display:flex;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;-ms-overflow-style:none;
}
.car-track::-webkit-scrollbar{display:none;}
.car-slide{flex:0 0 100%;scroll-snap-align:center;padding:0 clamp(4px,1vw,10px);}
.car-card{
  background:#fff;border:1px solid var(--line);border-top:3px solid var(--bifa-sky);
  border-radius:var(--radius);padding:clamp(28px,4vw,52px);max-width:860px;margin:0 auto;
}
.car-tag{
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--sky-ink);margin-bottom:18px;
}
.car-card blockquote{
  font-family:'Source Serif 4',serif;font-size:clamp(19px,2.3vw,26px);line-height:1.45;
  color:var(--bifa-blue);margin-bottom:26px;
}
.car-card .who{font-weight:600;font-size:14.5px;color:var(--bifa-blue);}
.car-card .role{font-size:13px;color:var(--muted);margin-top:2px;}
.car-nav{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:28px;}
.car-btn{
  width:44px;height:44px;border:1px solid var(--line-strong);border-radius:50%;
  display:flex;align-items:center;justify-content:center;color:var(--bifa-blue);
  transition:background-color .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease);
}
.car-btn:hover{background:var(--bifa-blue);border-color:var(--bifa-blue);color:#fff;}
.car-dots{display:flex;gap:9px;}
.car-dot{width:8px;height:8px;border-radius:50%;background:var(--line-strong);
  transition:background-color .25s var(--ease),transform .25s var(--ease);}
.car-dot[aria-current="true"]{background:var(--bifa-sky);transform:scale(1.35);}

@media (max-width:1024px){
  .cat-figures{grid-template-columns:repeat(2,1fr);gap:26px 30px;}
  .cat-index-grid{grid-template-columns:repeat(2,1fr);}
  .cat-index a:nth-child(4n){border-right:1px solid var(--on-dark-line);}
  .cat-index a:nth-child(2n){border-right:none;}
  .cat-index a:nth-child(n+3){border-top:1px solid var(--on-dark-line);}
  .cat-index a:not(:nth-child(4n)){padding-right:16px;}
  .cat-index a:not(:nth-child(4n+1)){padding-left:0;}
  .cat-index a:nth-child(2n){padding-left:20px;}
}
@media (max-width:860px){
  .cards{grid-template-columns:1fr;}
  .cat-actions .btn{width:100%;}
  .tl-head{display:none;}
  .tl-row{grid-template-columns:1fr;gap:10px;padding:16px 0;}
  .tl-name{padding-right:0;}
  .tl-track{background-image:none;height:24px;}
  .tl-bar{position:static;width:100% !important;height:24px;min-width:0;}
}
@media (max-width:520px){
  .cat-index-grid{grid-template-columns:1fr;}
  .cat-index a{border-right:none !important;padding-left:0 !important;padding-right:0 !important;}
  .cat-index a:nth-child(n+2){border-top:1px solid var(--on-dark-line);}
  .cat-index a:first-child{border-top:none;}
  .filters{gap:8px;}
  .filter{padding:9px 13px;font-size:10px;}
  .car-nav{gap:14px;}
}

/* ============================================================
   FICHE DU PROGRAMME — visuel officiel de la formation
   ============================================================ */
.fiche-visuel{
  position:relative;border-radius:var(--radius);overflow:hidden;
  background:var(--paper);border:1px solid var(--line);
  border-top:3px solid var(--bifa-sky);
  box-shadow:0 40px 80px -46px rgba(6,46,77,.55);
  padding:clamp(14px,1.8vw,22px);
}
.fiche-visuel img{
  width:100%;height:auto;display:block;border-radius:2px;
}
.fiche-visuel figcaption{
  display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding-top:14px;margin-top:14px;border-top:1px solid var(--line);
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);
}
.fiche-visuel figcaption a{
  color:var(--sky-ink);border-bottom:1px solid var(--line-strong);padding-bottom:2px;
  transition:border-color .25s var(--ease);white-space:nowrap;
}
.fiche-visuel figcaption a:hover{border-color:var(--sky-ink);}
@media (max-width:520px){
  .fiche-visuel figcaption{flex-direction:column;align-items:flex-start;gap:8px;}
}

/* ============================================================
   COMPACTION — couche additive, posée APRÈS le design validé.
   Principe : on ne retire ni contenu ni composant. On agit
   uniquement sur les espaces verticaux excessifs, les hauteurs
   de blocs et les gouttières, dans l'ordre de priorité demandé.
   Cible : environ -22 % de hauteur totale, respiration conservée.
   ============================================================ */

/* 1 — Espaces verticaux entre sections (le premier gisement) */
.band{padding:clamp(46px,5.6vw,76px) 0;}
.band + .band{padding-top:clamp(42px,5.2vw,70px);}
.hero{padding:clamp(34px,4.4vw,60px) 0 clamp(38px,4.8vw,64px);}

/* 2 — En-têtes de section : le titre reste large, l'air se resserre */
.sec-head{margin-bottom:clamp(24px,3vw,38px);}
.sec-head .h-section{margin-top:12px;}
.sec-head .lead{margin-top:12px;}

/* 3 — Gouttières des grilles : -25 % environ */
.hero-grid{gap:clamp(28px,3.6vw,52px);}
.video-grid{gap:clamp(26px,3.6vw,52px);}
.public-grid{gap:clamp(26px,3.6vw,52px);}
.stats{gap:clamp(16px,2.2vw,28px);margin-top:clamp(22px,2.8vw,36px);}
.testi-grid{gap:clamp(14px,1.8vw,22px);}
.offer-grid{gap:clamp(16px,2vw,24px);}
.cards{gap:clamp(14px,1.8vw,22px);}
.footer-top{gap:clamp(22px,3vw,38px);padding-bottom:26px;}
.filters{margin-bottom:clamp(20px,2.6vw,32px);}
.tl{margin-top:clamp(20px,2.6vw,30px);}

/* 4 — Hauteurs des blocs : padding intérieur resserré */
.offer{padding:clamp(22px,2.6vw,34px);}
.card-body{padding:clamp(16px,2vw,23px);}
.enjeu-item{padding:clamp(18px,2.2vw,26px);}
.fiche{padding:clamp(20px,2.4vw,28px);}
.faq-a > div{padding-bottom:16px;}
.site-footer{padding:clamp(34px,4.4vw,50px) 0 22px;}

/* 5 — Répétitions : la ligne d'accroche du hero suffit une fois */
.hero-scroll{margin-top:14px;}
.hero-proof{margin-top:18px;}

/* 6 — Rythme typographique légèrement resserré sur les longs textes */
.band p.lead{line-height:1.6;}
.prog-item{padding-block:clamp(15px,1.8vw,20px);}

/* Mobile : on compacte davantage, la lecture y est déjà séquentielle */
@media (max-width:860px){
  .band{padding:38px 0;}
  .band + .band{padding-top:34px;}
  .hero{padding:26px 0 32px;}
  .sec-head{margin-bottom:22px;}
  .offer{padding:20px;}
}

/* Mouvement réduit : on neutralise animations et parallaxe */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
  .reveal{opacity:1!important;transform:none!important;}
}

/* ============================================================
   COMPACTION — niveau 2 : regroupements sur petit écran
   Priorité 2 (« regrouper des contenus complémentaires ») et 5
   (« transformer certains contenus secondaires en accordéon /
   défilement lorsque pertinent ») de la consigne de compaction.

   Sur mobile, deux blocs répétitifs empilaient jusqu'à 1 500 px :
   les cartes du constat et les témoignages. Ils adoptent ici le
   défilement horizontal à aimantation — le même geste que le
   carrousel déjà validé sur la page catalogue. Aucun contenu
   n'est retiré : tout reste accessible, en un balayage.
   ============================================================ */
@media (max-width:860px){
  .enjeu-grid,
  .testi-grid{
    display:flex;
    gap:12px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    /* débord maîtrisé : les cartes affleurent les marges de la page */
    margin-inline:calc(var(--gutter) * -1);
    padding-inline:var(--gutter);
    padding-bottom:6px;
  }
  .enjeu-grid::-webkit-scrollbar,
  .testi-grid::-webkit-scrollbar{display:none}
  .enjeu-grid > *,
  .testi-grid > *{
    flex:0 0 86%;
    scroll-snap-align:center;
    min-width:0;
  }
  .enjeu-grid > :last-child,
  .testi-grid > :last-child{margin-right:2px}

  /* Repère de balayage, discret */
  .enjeu-grid::after,
  .testi-grid::after{
    content:"";flex:0 0 1px;
  }
  .swipe-hint{
    display:block;margin-top:10px;
    font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.16em;
    text-transform:uppercase;color:var(--muted);
  }
  .band--dark .swipe-hint,.band--deep .swipe-hint{color:var(--on-dark-muted)}

  /* Blocs resserrés une fois le défilement en place */
  .enjeu-item{padding:16px 18px}
  .testi{padding:20px}
  .prog-item{padding-block:13px}
  .fiche{padding:18px}
  .offer{padding:18px}
}
@media (min-width:861px){.swipe-hint{display:none}}

/* Repère visible uniquement au doigt/souris, jamais au clavier seul */
.enjeu-grid:focus-visible,.testi-grid:focus-visible{
  outline:2px solid var(--sky-cta);outline-offset:4px;border-radius:6px;
}