/* =========================================================================
   LPE FORMATION : lpeformation.fr
   ========================================================================= */

/* ------------------------------- Tokens -------------------------------- */
:root{
  --navy:#0b1f4b;
  --navy-ink:#0c2350;
  --navy-deep:#071633;
  --blue:#1a5cd8;
  --blue-strong:#1450c8;
  --blue-dark:#123f9e;
  --gold:#e9a92e;
  --gold-soft:#f0be55;
  --body:#33436b;
  --line:#e7e9ed;

  --page:#f4f7fc;
  --hero-bg:#f5f8fc;

  --shell:1280px;
  --header-h:108px;

  --r-sm:14px;
  --r-md:22px;
  --r-lg:28px;

  --shadow-sm:0 6px 20px rgba(11,31,75,.06);
  --shadow-md:0 14px 40px rgba(11,31,75,.10);
  --shadow-lg:0 26px 70px rgba(11,31,75,.16);

  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ------------------------------- Reset --------------------------------- */
*,*::before,*::after{box-sizing:border-box}
/* Garantit que l'attribut hidden masque toujours l'élément, même quand une
   règle plus bas fixe elle-même sa propriété display (ex. display:flex sur
   un bouton) : sans ce !important, cette règle-là l'emporterait sur celle,
   par défaut, du navigateur pour [hidden] et l'élément resterait visible. */
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 24px)}
body{
  margin:0;
  background:var(--page);
  color:var(--body);
  font-family:"Figtree",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,p{margin:0}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
svg{display:block}
:focus-visible{outline:3px solid var(--gold);outline-offset:4px;border-radius:6px}

.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}
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:#fff;color:var(--navy);padding:12px 20px;border-radius:0 0 12px 0;font-weight:700}
.skip-link:focus{left:0}

.shell{width:min(var(--shell),100% - 48px);margin-inline:auto}

/* Shared icon stroke style */
.nav__icon svg,.cta svg,
.flink__icon svg,.legal__icon svg,.flink__chev,.btn svg,.round-arrow svg{
  fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;
}
.gold{stroke:var(--gold)}
.gold-fill{fill:var(--gold);stroke:var(--gold)}

/* Utility accents */
.is-blue{color:var(--blue)}
.is-gold{color:var(--gold)}

/* Decorative dot grid */
.deco-dots{
  position:absolute;
  background-image:radial-gradient(currentColor 1.6px,transparent 1.7px);
  background-size:18px 18px;
  opacity:.28;
  pointer-events:none;
}

/* ============================ HEADER FIXE ============================== */
.site-header{
  position:fixed;
  inset:14px 0 auto 0;
  z-index:120;
  padding-inline:16px;
  pointer-events:none;
  transition:transform .34s var(--ease),opacity .24s var(--ease);
}
.site-header.is-away{transform:translateY(calc(-100% - 20px));opacity:0}
.header-card{
  pointer-events:auto;
  width:min(1600px,100%);
  margin-inline:auto;
  display:grid;
  grid-template-columns:190px minmax(0,1fr) auto;
  align-items:center;
  gap:24px;
  padding:14px 22px 14px 26px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border:1px solid #e3e6eb;
  border-radius:var(--r-lg);
  box-shadow:0 8px 26px rgba(13,35,72,.09);
  transition:box-shadow .25s var(--ease),padding .25s var(--ease);
}
.site-header.is-stuck .header-card{box-shadow:0 12px 34px rgba(13,35,72,.16)}

.brand{display:flex;align-items:center}
/* hauteur pilotée (et non largeur) pour garder une bannière de hauteur stable */
.brand img{height:62px;width:auto}

.nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:center}
.nav__item{
  display:flex;align-items:center;justify-content:center;gap:14px;
  min-height:56px;padding:8px 14px;
  color:var(--navy);
  font-size:clamp(15px,1.05vw,19px);font-weight:600;white-space:nowrap;
  border-left:2px solid var(--line);
  transition:color .2s var(--ease),transform .2s var(--ease);
}
.nav__item:hover{color:var(--blue);transform:translateY(-2px)}
.nav__icon{flex:0 0 auto}
.nav__icon svg{width:32px;height:32px;stroke-width:2.6}

.cta{
  display:inline-flex;align-items:center;justify-content:center;gap:14px;
  min-height:58px;padding:12px 26px;
  color:#fff;background:linear-gradient(110deg,#174894,#2362b7);
  border-radius:999px;
  box-shadow:0 8px 18px rgba(23,72,148,.22);
  font-size:clamp(15px,1.05vw,18px);font-weight:600;white-space:nowrap;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease);
}
.cta:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(23,72,148,.32)}
.cta svg{width:26px;height:26px;stroke-width:2.6}
.cta--nav{display:none}

.burger{display:none;width:46px;height:46px;padding:11px;border-radius:12px;justify-self:end}
.burger span{display:block;height:2.6px;border-radius:99px;background:var(--navy);transition:transform .28s var(--ease),opacity .2s var(--ease)}
.burger span+span{margin-top:6px}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(8.6px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-8.6px) rotate(-45deg)}

.nav-backdrop{position:fixed;inset:0;z-index:110;background:rgba(8,22,52,.42);backdrop-filter:blur(2px)}

/* ================================ HERO ================================= */
.hero{
  position:relative;
  isolation:isolate;
  min-height:min(96vh,940px);
  display:flex;align-items:center;
  padding:calc(var(--header-h) + 56px) 0 90px;
  background:var(--hero-bg);
  overflow:hidden;
}
.hero__bg{
  position:absolute;inset:0;z-index:-2;
  background:
    radial-gradient(120% 90% at 8% 0%,#ffffff 0%,rgba(255,255,255,0) 55%),
    radial-gradient(90% 80% at 100% 100%,#e8eef8 0%,rgba(232,238,248,0) 60%),
    linear-gradient(160deg,#fbfcfe 0%,#eef3fa 100%);
}
.hero__bg::after{
  content:"";position:absolute;inset:-10% -20% auto -30%;height:120%;
  background:radial-gradient(60% 60% at 30% 20%,rgba(255,255,255,.95),rgba(255,255,255,0) 70%);
}

.hero__media{
  position:absolute;
  z-index:-1;
  top:0;right:0;bottom:0;
  width:58%;
}
/* Effet fondu : dégradé elliptique unique (une seule couche de masque,
   pour éviter les différences de `mask-composite` entre navigateurs). */
.hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:26% 50%;
  -webkit-mask-image:radial-gradient(90% 150% at 93% 46%,#000 36%,rgba(0,0,0,.92) 54%,rgba(0,0,0,.5) 73%,transparent 92%);
  mask-image:radial-gradient(90% 150% at 93% 46%,#000 36%,rgba(0,0,0,.92) 54%,rgba(0,0,0,.5) 73%,transparent 92%);
}

/* pas de `position` ici : la photo et le badge, en absolu, se calent sur `.hero` */
.hero__content{max-width:640px}
.hero__title{
  color:var(--navy-ink);
  font-size:clamp(38px,4.6vw,66px);
  font-weight:800;
  line-height:1.08;
  letter-spacing:-.02em;
}
.hero__lead{
  margin-top:clamp(26px,2.6vw,38px);
  color:var(--navy-ink);
  font-size:clamp(16px,1.32vw,20px);
  line-height:1.55;
}

.pillars{display:flex;align-items:stretch;margin:40px 0 44px}
.pillar{
  display:flex;flex-direction:column;align-items:center;gap:14px;
  flex:0 0 auto;
  padding:0 clamp(18px,2.4vw,34px);
  text-align:center;
}
.pillar+.pillar{border-left:1px solid #ccd6e6}
.pillar__stat{
  color:var(--blue);font-weight:800;line-height:1;
  font-size:clamp(26px,3vw,38px);letter-spacing:-.01em;
  font-variant-numeric:tabular-nums;
}
.pillar__label{color:var(--navy-ink);font-size:clamp(14px,1.05vw,17px);line-height:1.35}

.hero__actions{display:flex;align-items:center;gap:36px;flex-wrap:wrap}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:14px;
  font-weight:600;border-radius:999px;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s var(--ease);
}
.btn--primary{
  padding:19px 40px;
  color:#fff;
  background:linear-gradient(105deg,var(--blue-strong),#2264d8);
  box-shadow:0 12px 28px rgba(20,80,200,.28);
  font-size:clamp(16px,1.15vw,19px);
}
.btn--primary:hover{transform:translateY(-2px);box-shadow:0 16px 36px rgba(20,80,200,.38)}
.btn--link{color:var(--blue);font-size:clamp(16px,1.15vw,19px);gap:16px}
.btn--link svg{width:26px;height:26px;stroke-width:2.4;transition:transform .2s var(--ease)}
.btn--link:hover svg{transform:translateX(5px)}
.btn--gold{
  padding:17px 34px;
  color:var(--navy-ink);
  background:linear-gradient(105deg,#f2bd4d,#e9a72a);
  box-shadow:0 12px 26px rgba(0,0,0,.22);
  font-size:clamp(16px,1.1vw,19px);font-weight:700;
}
.btn--gold:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(0,0,0,.3)}
.btn--gold svg{width:24px;height:24px;stroke-width:2.4;transition:transform .2s var(--ease)}
.btn--gold:hover svg{transform:translateX(4px)}

/* --------------------------- Badge Qualiopi ----------------------------
   Le logo officiel est utilisé tel quel, sans retouche : sur fond marine il
   est posé sur une pastille blanche, comme le prévoit la charte Qualiopi. */
.hero__badge{position:absolute;right:clamp(20px,4vw,72px);bottom:clamp(20px,4vw,54px);z-index:2}
.qualiopi{
  display:flex;align-items:center;justify-content:center;
  padding:18px 24px;
  background:#fff;
  border-radius:16px;
  box-shadow:var(--shadow-md);
}
.qualiopi img{width:clamp(168px,14vw,214px);height:auto}

/* ============================ NOS FORMATIONS =========================== */
.formations{
  position:relative;
  isolation:isolate;
  padding:clamp(70px,7vw,110px) 0 clamp(60px,6vw,96px);
  background:
    radial-gradient(90% 70% at 12% 6%,#12305f 0%,rgba(18,48,95,0) 55%),
    linear-gradient(165deg,#0c2450 0%,#0a1c3f 45%,#061530 100%);
  overflow:hidden;
}
.formations__deco{position:absolute;inset:0;z-index:-1}
.formations__deco .deco-dots--left{left:-10px;bottom:0;width:180px;height:60%;color:#2f5da8;opacity:.35}
.deco-arcs{position:absolute;top:-40px;right:-60px;width:min(420px,42vw);height:auto;opacity:.75}

.section-head{max-width:760px}
.section-head--center{max-width:900px;margin-inline:auto;text-align:center}
.eyebrow{
  color:var(--blue);font-weight:800;font-size:clamp(14px,1.05vw,18px);
  letter-spacing:.14em;text-transform:uppercase;margin-bottom:14px;
}
.eyebrow--blue{color:#2f7bf0}
.section-title{
  color:var(--navy-ink);
  font-size:clamp(32px,3.9vw,56px);
  font-weight:800;line-height:1.1;letter-spacing:-.02em;
}
.section-title--light{color:#fff}
.section-title--tight{font-size:clamp(34px,4.4vw,62px);letter-spacing:.01em;text-transform:uppercase}
.section-lead{
  margin-top:22px;
  color:var(--body);
  font-size:clamp(16px,1.25vw,20px);line-height:1.6;
}
.section-lead--light{color:rgba(255,255,255,.86)}

.carousel{margin-top:clamp(40px,4.5vw,62px)}
.cards{
  width:min(var(--shell),100% - 48px);
  margin-inline:auto;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:clamp(14px,1.5vw,24px);
}
.card{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:34px 20px 38px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
  border-radius:var(--r-md);
  transition:transform .3s var(--ease),background .3s var(--ease),border-color .3s var(--ease);
}
.card:hover{transform:translateY(-6px);background:rgba(255,255,255,.09);border-color:rgba(233,169,46,.45)}
/* médaillon photo du domaine, à la place de l'ancienne icône */
.card__media{
  display:block;overflow:hidden;
  width:clamp(78px,7vw,104px);aspect-ratio:1;
  margin-bottom:22px;
  border-radius:50%;
  box-shadow:0 0 0 2px rgba(233,169,46,.55),0 10px 26px rgba(0,0,0,.3);
}
.card__media img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .5s var(--ease);
}
.card:hover .card__media img{transform:scale(1.08)}
/* cadrage propre de chaque photo dans le cercle */
.card--ia         .card__media img{object-position:62% 46%}
.card--finance    .card__media img{object-position:56% 52%}
.card--commercial .card__media img{object-position:50% 48%}
.card--management .card__media img{object-position:52% 40%}
.card--gestion    .card__media img{object-position:44% 52%}
.card__title{color:#fff;font-size:clamp(19px,1.6vw,25px);font-weight:700;line-height:1.2;margin-bottom:18px}
.card__text{color:rgba(255,255,255,.82);font-size:clamp(14px,1.02vw,16px);line-height:1.62;max-width:24ch}

.carousel-ui{display:none;margin-top:30px;text-align:center}
.dots{display:flex;align-items:center;justify-content:center;gap:10px}
.dots button{width:9px;height:9px;border-radius:99px;background:#c6cedd;transition:all .28s var(--ease)}
.dots button[aria-current="true"]{width:26px;background:var(--blue)}
.dots button:hover{background:#9fb0c8}

/* ============================= POURQUOI LPE ============================ */
.pourquoi{
  position:relative;
  isolation:isolate;
  padding:clamp(80px,7vw,120px) 0 clamp(70px,6vw,110px);
  background:linear-gradient(150deg,#fbfcfe 0%,#eef3fa 55%,#e9eff9 100%);
  overflow:hidden;
}
.pourquoi__blob{
  position:absolute;z-index:-2;
  top:50%;right:-24%;
  width:min(1000px,82vw);aspect-ratio:1;
  transform:translateY(-50%);
  border-radius:50%;
  background:linear-gradient(140deg,#2a6ae0 0%,#1450c8 45%,#0e3ba0 100%);
}
.pourquoi__blob .deco-dots{inset:12% 6% auto auto;width:170px;height:180px;color:#fff;opacity:.22}

.pourquoi__media{
  position:absolute;z-index:-1;
  top:50%;right:2.5%;
  width:min(620px,44vw);aspect-ratio:1;
  transform:translateY(-50%);
}
.pourquoi__media img{
  width:100%;height:100%;object-fit:cover;object-position:50% 50%;
  border-radius:50%;
  /* fondu circulaire décentré : le bord gauche se fond dans la page */
  -webkit-mask-image:radial-gradient(circle at 63% 50%,#000 40%,rgba(0,0,0,.88) 56%,rgba(0,0,0,.4) 74%,transparent 90%);
  mask-image:radial-gradient(circle at 63% 50%,#000 40%,rgba(0,0,0,.88) 56%,rgba(0,0,0,.4) 74%,transparent 90%);
}

/* Bannière plein format, uniquement affichée sur mobile (voir plus bas) */
.pourquoi__media-mobile{display:none}

.pourquoi__inner{position:relative}
.pourquoi .section-head{max-width:600px}
.pourquoi .section-lead{max-width:600px;color:var(--navy-ink)}

.reasons{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(16px,1.8vw,26px);
  max-width:830px;
  margin-top:clamp(40px,4.5vw,58px);
}
.reason{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  overflow:hidden;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.reason:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.reason__photo{
  display:block;overflow:hidden;flex:0 0 auto;width:100%;
  aspect-ratio:4/3;
}
.reason__photo img{width:100%;height:100%;object-fit:cover}
.reason__body{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:26px 22px 30px;
}
.reason__title{color:var(--navy-ink);font-size:clamp(18px,1.42vw,22px);font-weight:800;line-height:1.25;margin-bottom:16px}
.reason__text{color:var(--body);font-size:clamp(14px,1.02vw,16px);line-height:1.62}

/* =========================== PASSEZ À L'ACTION ========================= */
.action{
  position:relative;
  isolation:isolate;
  padding:clamp(76px,7vw,112px) 0 clamp(76px,7vw,112px);
  background:linear-gradient(150deg,#f7f9fd 0%,#eef2fa 60%,#e9eff8 100%);
  overflow:hidden;
}
.action__deco{position:absolute;inset:0;z-index:-1}
.waves{position:absolute;width:min(420px,34vw);height:min(420px,34vw);opacity:.22}
.waves--tl{top:-40px;left:-60px}
.waves--br{right:-60px;bottom:-40px}
.action__deco .deco-dots--tr{top:20px;right:30px;width:190px;height:150px;color:#9fb4d8;opacity:.5}

.action__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(20px,2.4vw,34px);
  margin-top:clamp(44px,4.6vw,64px);
  align-items:stretch;
}
.acard{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:clamp(34px,3.4vw,50px) clamp(24px,2.6vw,44px);
  border-radius:var(--r-lg);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.acard--light{background:#fafbfd;box-shadow:var(--shadow-sm)}
.acard--light:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}
.acard--blue{
  color:#fff;
  background:linear-gradient(150deg,#1f63dd 0%,#1450c8 38%,#0b2a7c 100%);
  box-shadow:var(--shadow-lg);
}
.acard--blue:hover{transform:translateY(-5px)}

.acard__icon{display:grid;place-items:center;margin-bottom:26px}
.acard__icon svg{width:clamp(96px,9vw,124px);height:auto}
.acard__icon--circle{
  width:clamp(112px,10vw,142px);aspect-ratio:1;
  background:#fff;border-radius:50%;
  box-shadow:0 14px 32px rgba(4,20,60,.28);
}
.acard__icon--circle svg{width:58%;height:auto}
/* halo derrière l'icône € */
.acard--light .acard__icon{position:relative}
.acard--light .acard__icon::before{
  content:"";position:absolute;inset:6% 12%;
  border-radius:50%;
  background:radial-gradient(circle,#e6edfa 0%,rgba(230,237,250,0) 70%);
  z-index:-1;
}

.acard__title{
  font-size:clamp(20px,1.85vw,28px);font-weight:800;line-height:1.3;
  color:var(--navy-ink);
  margin-bottom:30px;
}
.acard__title--light{color:#fff}
.acard__text{color:var(--body);font-size:clamp(15px,1.1vw,17px);line-height:1.6;margin-top:26px;max-width:32ch}
.acard__text--light{color:rgba(255,255,255,.9)}

.round-arrow{
  display:grid;place-items:center;
  width:62px;height:62px;border-radius:50%;
  background:#e9effb;color:var(--blue);
  transition:transform .2s var(--ease),background .2s var(--ease);
}
.round-arrow:hover{transform:translateY(-3px);background:#dbe6fa}
.round-arrow svg{width:26px;height:26px;stroke-width:2.4}

/* ========================= PAGES LÉGALES (texte) ======================= */
.legal-page{
  padding:calc(var(--header-h) + 56px) 0 clamp(60px,6vw,96px);
  background:linear-gradient(160deg,#fbfcfe 0%,#eef3fa 100%);
}
.legal-page .shell{max-width:820px}
.legal-page h2{
  margin:clamp(34px,3.4vw,48px) 0 12px;
  color:var(--navy-ink);
  font-size:clamp(20px,1.7vw,25px);font-weight:800;line-height:1.3;
}
.legal-page p{margin-bottom:14px;max-width:70ch}
.legal-page a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.lien-bouton{
  background:none;border:none;padding:0;cursor:pointer;
  font:inherit;color:var(--blue);text-decoration:underline;text-underline-offset:3px;
}
.legal-maj{
  margin-top:clamp(34px,3.4vw,48px);
  padding-top:clamp(18px,1.8vw,24px);
  border-top:1px solid #dde4ee;
  color:var(--body);font-size:14px;opacity:.8;
}
.legal-note{
  padding:16px 20px;border-left:4px solid var(--gold);border-radius:0 12px 12px 0;
  background:#fff;color:var(--navy-ink);font-weight:600;box-shadow:var(--shadow-sm);
}

/* ============================== BAS DE PAGE ============================= */
.site-footer{padding:0 clamp(14px,2.6vw,42px) clamp(20px,2.6vw,40px);background:var(--page)}
.footer-card{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  max-width:1860px;margin-inline:auto;
  padding:clamp(40px,4vw,62px) clamp(26px,4vw,72px) clamp(28px,2.6vw,42px);
  color:#fff;
  background:radial-gradient(80% 100% at 20% 0%,#0e2a5e 0%,rgba(14,42,94,0) 60%),linear-gradient(150deg,#0b2150 0%,#091c44 60%,#071634 100%);
  border-radius:var(--r-lg);
}
.footer__deco{position:absolute;inset:0;z-index:-1}
.footer__deco .deco-dots--left{left:14px;top:16%;width:120px;height:66%;color:#2f5da8;opacity:.35}
.waves--foot{position:absolute;right:-40px;bottom:-50px;width:min(420px,36vw);height:min(420px,36vw);opacity:.45}

.footer__top{
  display:grid;
  grid-template-columns:auto auto auto minmax(0,1fr);
  align-items:center;
  gap:clamp(24px,3vw,52px);
}
.footer__brand img{width:clamp(150px,11vw,200px)}
.footer__qualiopi{
  display:flex;align-items:center;justify-content:center;
  padding:13px 18px;
  background:#fff;
  border-radius:14px;
  box-shadow:0 8px 22px rgba(0,0,0,.22);
}
.footer__qualiopi img{width:clamp(148px,12vw,186px);height:auto}
.footer__sep{width:2px;align-self:stretch;min-height:110px;background:linear-gradient(180deg,rgba(233,169,46,0),var(--gold),rgba(233,169,46,0))}

.footer__nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(10px,1.3vw,22px)}
.flink{
  display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;
  padding:8px;border-radius:var(--r-sm);
  font-size:clamp(15px,1.1vw,18px);line-height:1.35;
  transition:color .2s var(--ease),transform .2s var(--ease);
}
.flink:hover{color:var(--gold-soft);transform:translateY(-3px)}
.flink__icon{color:var(--gold)}
.flink__icon svg{width:38px;height:38px;stroke-width:2.3}
.flink__chev{display:none;width:20px;height:20px;color:var(--gold);stroke-width:2.6}
.only-desktop{display:inline}

.footer__hr{display:none}
.footer__legal{display:flex;align-items:center;justify-content:center;gap:clamp(20px,3vw,42px);flex-wrap:wrap;margin-top:clamp(14px,1.6vw,22px)}
.legal{display:inline-flex;align-items:center;gap:12px;font-size:clamp(15px,1.05vw,17px);transition:color .2s var(--ease)}
.legal:hover{color:var(--gold-soft)}
.legal__icon{display:none;color:var(--gold)}
.legal__icon svg{width:26px;height:26px;stroke-width:2.2}
.footer__pipe{display:none}

/* ---- Pied de page plus compact en hauteur sur grand écran ---- */
@media (min-width:1001px){
  .footer-card{padding:clamp(24px,2.6vw,36px) clamp(26px,4vw,72px) clamp(18px,1.8vw,26px)}
  .footer__top{gap:clamp(18px,2vw,32px)}
  .footer__formations{margin:clamp(10px,1.2vw,16px) 0 0;padding-bottom:clamp(12px,1.4vw,18px)}
}

/* ========================================================================
   RESPONSIVE
   ======================================================================== */

/* ---- Grands écrans intermédiaires ---- */
@media (max-width:1180px){
  .header-card{grid-template-columns:auto minmax(0,1fr) auto;gap:16px;padding:12px 16px}
  .brand img{height:54px}
  .nav__item{gap:10px;padding:8px 10px}
  .nav__icon svg{width:26px;height:26px}
  .cta{min-height:52px;padding:10px 20px;gap:10px}
  .cta svg{width:22px;height:22px}
  .hero__media{width:52%}
  .hero__content{max-width:52%}
  /* on garde les 5 colonnes de la maquette desktop jusqu'au passage en carrousel */
  .cards{gap:12px}
  .card{padding:28px 14px 32px}
  .card__media{width:clamp(70px,7vw,92px);margin-bottom:18px}
  .pourquoi__blob{right:-30%}
  .reasons{max-width:min(62%,720px);gap:14px}
  .reason__body{padding:22px 16px 26px}
  .reason__title{font-size:16.5px;margin-bottom:12px}
  .reason__text{font-size:13.5px;line-height:1.55}
  .footer__top{gap:22px}
  .footer__sep{min-height:96px}
}

/* ---- Tablette ---- */
@media (max-width:1000px){
  :root{--header-h:78px}
  .shell{width:min(var(--shell),100% - 36px)}

  /* ---- Bannière mobile : barre fine flottante ---- */
  .site-header{
    inset:12px 0 auto 0;
    padding-inline:14px;
  }
  .header-card{
    grid-template-columns:1fr auto;
    gap:10px;
    padding:7px 8px 7px 18px;
    border-radius:999px;
    background:rgba(255,255,255,.86);
    border-color:rgba(255,255,255,.7);
    box-shadow:0 6px 22px rgba(11,31,75,.10);
  }
  .site-header.is-stuck .header-card{
    background:rgba(255,255,255,.94);
    box-shadow:0 8px 26px rgba(11,31,75,.14);
  }
  .brand img{height:42px}

  .nav{
    position:absolute;top:calc(100% + 10px);left:0;right:0;
    grid-template-columns:1fr;
    padding:10px;
    background:rgba(255,255,255,.97);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
    border:1px solid #e6e9ee;border-radius:24px;
    box-shadow:0 18px 44px rgba(11,31,75,.18);
    opacity:0;visibility:hidden;
    transform:translateY(-10px) scale(.98);
    transform-origin:top center;
    transition:opacity .22s var(--ease),transform .26s var(--ease),visibility .26s;
  }
  .nav.is-open{opacity:1;visibility:visible;transform:none}
  .nav__item{
    justify-content:flex-start;gap:16px;min-height:58px;padding:10px 14px;
    border-left:0;border-radius:16px;font-size:17px;
  }
  .nav__item+.nav__item{border-top:1px solid var(--line)}
  .nav__item:hover{transform:none;background:#f2f6fc}
  .nav__icon svg{width:28px;height:28px}
  .cta--header{display:none}
  .cta--nav{display:inline-flex;margin-top:10px;width:100%;min-height:56px}
  .burger{
    display:grid;place-content:center;
    width:44px;height:44px;padding:0 11px;
    border-radius:999px;background:#eef2f9;
  }
  .burger span{width:22px}

  /* ---- Accueil mobile : titre puis photo (les deux visibles d'emblée),
         le reste du contenu vient ensuite ---- */
  .hero{
    min-height:0;
    display:block;
    padding:calc(var(--header-h) + 26px) 0 clamp(30px,5vw,48px);
  }
  .hero__content{max-width:none;display:flex;flex-direction:column}
  .hero__title{font-size:clamp(34px,7vw,52px);order:1}
  .hero__media{order:2}
  .hero__badge{order:3}
  .hero__lead{order:4}
  .pillars{order:5}
  .hero__actions{order:6}

  .hero__media{
    position:relative;
    width:100vw;
    margin:26px 0 0 calc(50% - 50vw);
    aspect-ratio:6/5;
  }
  .hero__media img{
    object-position:34% 46%;
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 9%,#000 24%,#000 80%,rgba(0,0,0,.5) 95%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 9%,#000 24%,#000 80%,rgba(0,0,0,.5) 95%,transparent 100%);
  }
  .hero__badge{
    position:relative;right:auto;bottom:auto;
    align-self:center;
    margin:-70px 0 0;
    width:max-content;max-width:100%;
  }
  .hero__lead{margin-top:34px}
  .pillars{margin:32px 0 36px}
  .pillar{flex:1 1 0;padding:0 10px}

  /* formations : carrousel */
  .carousel{
    margin-inline:0;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-block:26px 10px;
  }
  .carousel::-webkit-scrollbar{display:none}
  .cards{
    width:max-content;
    display:flex;
    gap:18px;
    padding-inline:calc(50vw - 130px);
  }
  .card{
    scroll-snap-align:center;
    flex:0 0 260px;
    background:#f7f9fc;
    border-color:transparent;
    box-shadow:var(--shadow-sm);
    transform:scale(.92);
    opacity:.86;
    transition:transform .35s var(--ease),opacity .35s var(--ease),box-shadow .35s var(--ease);
  }
  .card:hover{transform:scale(.92);background:#f7f9fc;border-color:transparent}
  .card.is-active,.card.is-active:hover{transform:scale(1);opacity:1;box-shadow:var(--shadow-md);background:#fff}
  .card__media{
    width:92px;
    box-shadow:0 0 0 3px #fff,0 0 0 4px rgba(26,92,216,.18),0 8px 20px rgba(11,31,75,.16);
  }
  .card__title{color:var(--navy-ink)}
  .card__text{color:var(--body)}

  /* la moitié basse du bloc passe sur fond clair : les cartes chevauchent
     la limite, comme sur la maquette mobile */
  .formations{padding-bottom:0}
  .carousel{position:relative;z-index:2}
  .carousel-ui{
    display:block;
    position:relative;
    z-index:1;
    margin-top:-170px;
    padding:190px 20px 34px;
  }
  .carousel-ui::before{
    content:"";position:absolute;inset:0;z-index:-1;
    background:linear-gradient(180deg,#f6f9fd 0%,#fbfcfe 100%);
  }
  .formations__deco{bottom:230px}
  .formations__deco .deco-dots--left{left:auto;right:0;top:0;bottom:auto;width:150px;height:150px}
  .deco-arcs{top:auto;bottom:-30px;right:-90px;width:min(300px,52vw)}

  /* pourquoi */
  .pourquoi{padding-top:clamp(60px,7vw,90px)}
  .pourquoi__blob{top:-8%;right:-50%;width:min(760px,98vw);transform:none}
  .pourquoi__media{
    position:absolute;
    top:clamp(40px,6vw,64px);right:0;
    transform:none;            /* annule le centrage vertical du desktop */
    width:min(340px,52vw);
  }
  /* la photo est en 3/2 : recadrée en cercle, il faut décaler le cadrage vers
     la gauche pour garder le formateur au centre du disque */
  .pourquoi__media img{
    object-position:50% 50%;
    -webkit-mask-image:radial-gradient(circle at 50% 50%,#000 62%,rgba(0,0,0,.7) 78%,transparent 94%);
    mask-image:radial-gradient(circle at 50% 50%,#000 62%,rgba(0,0,0,.7) 78%,transparent 94%);
  }
  .pourquoi .section-head{max-width:min(46%,420px)}
  .pourquoi .section-title--tight{font-size:clamp(28px,6.4vw,46px)}
  .pourquoi .section-lead{font-size:clamp(15px,2.1vw,18px);max-width:min(78%,520px)}
  .reasons{
    grid-template-columns:1fr;
    max-width:min(520px,86%);
    margin-inline:auto;
    margin-top:clamp(46px,7vw,70px);
    gap:22px;
  }
  .reason__body{
    padding:clamp(24px,3.6vw,32px) clamp(20px,3vw,30px) clamp(28px,4vw,36px);
  }
  .reason__title{font-size:clamp(18px,2.8vw,24px)}
  .reason__text{font-size:clamp(14px,2vw,17px)}

  /* action */
  .action__grid{grid-template-columns:1fr;max-width:640px;margin-inline:auto}
  .acard--blue{order:-1}
  /* le semis de points ne doit pas passer derrière le titre */
  .action__deco .deco-dots--tr{top:6px;right:-24px;width:130px;height:104px;opacity:.32}

  /* footer */
  .footer__top{grid-template-columns:1fr;justify-items:center;text-align:center;gap:26px}
  .footer__sep{display:block;width:min(300px,60%);min-height:0;height:2px;background:linear-gradient(90deg,rgba(233,169,46,0),var(--gold),rgba(233,169,46,0))}
  .footer__brand img{width:min(220px,52vw)}
  .footer__nav{grid-template-columns:1fr;width:100%;gap:0;margin-top:8px}
  .flink{
    flex-direction:row;align-items:center;text-align:left;
    gap:18px;padding:20px 6px;
    border-bottom:1px solid rgba(255,255,255,.14);
  }
  .flink:last-child{border-bottom:0}
  .flink:hover{transform:none}
  .flink__label{flex:1;font-size:clamp(16px,2.4vw,19px)}
  .flink__chev{display:block}
  .only-desktop{display:none}
  .footer__deco .deco-dots--left{left:auto;right:10px;top:20px;width:130px;height:150px}
  .legal__icon{display:inline-flex}
}

/* ---- Mobile ---- */
@media (max-width:640px){
  :root{--header-h:72px}
  body{font-size:16px}
  .shell{width:calc(100% - 40px)}

  .site-header{inset:10px 0 auto 0;padding-inline:10px}
  .header-card{padding:6px 7px 6px 15px}
  .brand img{height:38px}
  .burger{width:40px;height:40px;padding:0 10px}
  .burger span{width:20px;height:2.4px}
  .burger span+span{margin-top:5px}
  .burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7.4px) rotate(45deg)}
  .burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.4px) rotate(-45deg)}
  .nav{top:calc(100% + 8px)}

  .hero{padding-top:calc(var(--header-h) + 22px)}
  .hero__title{font-size:clamp(34px,10.4vw,46px);line-height:1.12}
  .hero__lead{font-size:17px;max-width:none}
  .hero__lead br{display:none}
  .pillars{margin:30px 0 34px}
  .pillar{padding:0 6px;gap:10px}
  .pillar__stat{font-size:22px}
  .pillar__label{font-size:13.5px}
  .hero__actions{flex-direction:column;align-items:stretch;gap:22px}
  .btn--primary{padding:18px 28px;font-size:17px}
  .btn--link{justify-content:flex-start;font-size:17px;padding-left:4px}
  .hero__media{aspect-ratio:5/4;margin-top:22px}
  .hero__badge{margin-top:-62px}
  .hero__lead{margin-top:30px}

  .formations{padding-top:clamp(56px,10vw,80px)}
  .section-title{font-size:clamp(30px,8.4vw,42px)}
  .section-lead{font-size:16.5px;margin-top:18px}
  .qualiopi{padding:15px 19px}
  .qualiopi img{width:min(196px,58vw)}
  .cards{padding-inline:calc(50vw - 122px);gap:14px}
  .card{flex-basis:244px;padding:30px 18px 34px}

  .pourquoi{padding-top:clamp(52px,9vw,74px)}
  /* le cadrage circulaire du desktop laisse place à une bannière plein
     format, sous le texte d'intro et au-dessus des trois atouts */
  .pourquoi__blob,.pourquoi__media{display:none}
  .pourquoi .section-head{max-width:none}
  .pourquoi .section-title--tight{font-size:clamp(22px,6vw,30px)}
  .pourquoi .eyebrow{font-size:13px;margin-bottom:10px}
  .pourquoi .section-lead{font-size:15px;margin-top:16px;max-width:none}
  .pourquoi .section-lead br{display:none}

  .pourquoi__media-mobile{
    display:block;
    position:relative;
    width:100vw;height:auto;
    aspect-ratio:5/4;
    margin:clamp(24px,5vw,36px) 0 clamp(4px,1vw,10px) calc(50% - 50vw);
  }
  .pourquoi__media-mobile img{
    width:100%;height:100%;object-fit:cover;object-position:50% 38%;
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 9%,#000 24%,#000 82%,rgba(0,0,0,.5) 96%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 9%,#000 24%,#000 82%,rgba(0,0,0,.5) 96%,transparent 100%);
  }
  .reasons{max-width:none}
  .reason__body{padding:22px 18px 26px}
  .reason__title{font-size:19px;margin-bottom:10px}
  .reason__text{font-size:15px}

  .action{padding-block:clamp(60px,10vw,86px)}
  .acard{padding:34px 24px 38px}
  .acard__title{font-size:clamp(20px,5.4vw,26px);margin-bottom:24px}
  .acard__text{font-size:15.5px;margin-top:22px}
  .round-arrow{width:54px;height:54px}

  .footer-card{padding:38px 22px 30px;border-radius:var(--r-md)}
  .footer__brand img{width:min(240px,58vw)}
  .legal{font-size:15px;gap:9px}
  .legal__icon svg{width:24px;height:24px}
}

@media (max-width:380px){
  .shell{width:calc(100% - 28px)}
  .pillar__label{font-size:12.5px}
  .cards{padding-inline:calc(50vw - 112px)}
  .card{flex-basis:224px}
}

/* ------------------------- Préférences système ------------------------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

/* ------------------------------ Impression ----------------------------- */
@media print{
  .site-header,.carousel-ui,.hero__bg,.formations__deco,.action__deco,.footer__deco{display:none}
  body{background:#fff}
  .hero{padding-top:0}
}

/* =========================================================================
   PAGE NOS FORMATIONS
   ========================================================================= */

/* ------------------------- Ouverture (fond marine) --------------------- */
.nf-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:calc(var(--header-h) + clamp(44px,5vw,76px)) 0 clamp(72px,7vw,112px);
  color:#fff;
  background:
    radial-gradient(65% 55% at 80% 4%,#173a72 0%,rgba(23,58,114,0) 62%),
    radial-gradient(60% 50% at 6% 30%,#122b5c 0%,rgba(18,43,92,0) 60%),
    linear-gradient(165deg,#0d2350 0%,#0a1c42 52%,#071733 100%);
}
.nf-hero__deco{position:absolute;inset:0;z-index:-2}
.nf-hero__deco .deco-dots--bl{left:-6px;bottom:8%;width:170px;height:190px;color:#3f7ae0;opacity:.32}
.nf-hero__deco .deco-dots--mr{right:12px;top:22%;width:110px;height:190px;color:#3f7ae0;opacity:.30}
.nf-hero__lines{position:absolute;top:-10px;right:-40px;width:min(360px,32vw);height:auto;opacity:.5}

.nf-hero__media{
  position:absolute;
  z-index:-1;
  top:clamp(52px,6vw,88px);right:0;
  width:50%;height:58%;
  -webkit-mask-image:radial-gradient(80% 116% at 94% 30%,#000 26%,rgba(0,0,0,.85) 48%,rgba(0,0,0,.32) 72%,transparent 93%);
  mask-image:radial-gradient(80% 116% at 94% 30%,#000 26%,rgba(0,0,0,.85) 48%,rgba(0,0,0,.32) 72%,transparent 93%);
}
.nf-hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:70% 42%;
  filter:brightness(.68) saturate(.7) contrast(1.06);
}
/* voile bleu pour fondre la photo dans le bleu nuit de la maquette */
.nf-hero__media::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(100deg,#0a1c42 2%,rgba(10,28,66,.66) 28%,rgba(10,28,66,.06) 64%),
    linear-gradient(0deg,#0a1c42 0%,rgba(10,28,66,.34) 20%,rgba(10,28,66,0) 44%),
    radial-gradient(64% 64% at 66% 36%,rgba(37,99,235,.34),rgba(37,99,235,0) 74%);
}

.nf-hero__curve{position:absolute;left:0;right:0;bottom:0;width:100%;height:clamp(80px,11vw,168px);z-index:0}

/* pas de `position` ici : la photo, en absolu, se cale sur `.nf-hero` */
.nf-hero__text{max-width:min(58%,760px)}
.nf-hero__title{
  font-size:clamp(40px,5.6vw,80px);
  font-weight:800;line-height:1;letter-spacing:-.025em;
}
.nf-hero__subtitle{
  margin-top:clamp(8px,1vw,16px);
  font-size:clamp(21px,2.7vw,40px);
  font-weight:700;line-height:1.3;letter-spacing:-.01em;
}
.is-brightblue{color:#3b82f6}
.nf-hero__lead{
  margin-top:clamp(22px,2.4vw,36px);
  color:rgba(255,255,255,.82);
  font-size:clamp(15px,1.25vw,19px);line-height:1.6;
}

.promises{
  position:relative;z-index:1;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(14px,1.6vw,26px);
  margin-top:clamp(46px,6vw,96px);
}
.promise{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:clamp(26px,2.4vw,36px) clamp(16px,1.6vw,26px) clamp(28px,2.6vw,38px);
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.11);
  border-radius:var(--r-md);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  transition:transform .3s var(--ease),background .3s var(--ease),border-color .3s var(--ease);
}
.promise:hover{transform:translateY(-5px);background:rgba(255,255,255,.09);border-color:rgba(233,169,46,.4)}
.promise__icon{
  display:grid;place-items:center;
  width:clamp(70px,6.2vw,92px);aspect-ratio:1;
  margin-bottom:clamp(18px,1.8vw,26px);
  border-radius:50%;
  background:rgba(43,89,175,.4);
  color:var(--gold);
}
.promise__icon svg{
  width:54%;height:54%;
  fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
}
.promise__title{
  color:#fff;
  font-size:clamp(17px,1.35vw,21px);font-weight:700;line-height:1.25;
  margin-bottom:clamp(12px,1.2vw,18px);
}
.promise__text{color:rgba(255,255,255,.78);font-size:clamp(13.5px,1vw,15.5px);line-height:1.6}

/* --------------------- Choisissez votre domaine ------------------------ */
.domaines{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(24px,3vw,44px) 0 clamp(72px,7vw,112px);
  background:linear-gradient(170deg,#f4f7fc 0%,#eef3fa 55%,#f7f9fd 100%);
}
.domaines__deco{position:absolute;inset:0;z-index:-1}
.domaines__deco .deco-dots--left{left:2px;top:26%;width:130px;height:46%;color:#9fb4d8;opacity:.55}
.waves--tr{position:absolute;top:-30px;right:-50px;width:min(360px,30vw);height:min(360px,30vw);opacity:.2}

.domaine-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:clamp(12px,1.5vw,24px);
  margin-top:clamp(38px,4.4vw,60px);
}
.domaine{display:flex}
.domaine__link{
  display:flex;flex-direction:column;width:100%;
  background:#fff;
  border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.domaine__link:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.domaine__photo{
  display:block;overflow:hidden;
  aspect-ratio:4/5;
  border-radius:var(--r-md) var(--r-md) 0 0;
}
.domaine__photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.domaine__link:hover .domaine__photo img{transform:scale(1.05)}
.domaine__body{
  position:relative;flex:1;
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:clamp(46px,4vw,58px) clamp(14px,1.4vw,22px) clamp(24px,2.4vw,34px);
}
.domaine__icon{
  position:absolute;top:clamp(-42px,-3.4vw,-34px);left:50%;transform:translateX(-50%);
  display:grid;place-items:center;
  width:clamp(66px,5.6vw,84px);aspect-ratio:1;
  border-radius:50%;
  background:#fff;color:var(--gold);
  box-shadow:0 8px 22px rgba(11,31,75,.16);
}
.domaine__icon svg{
  width:52%;height:52%;
  fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
}
.domaine__title{
  color:var(--navy-ink);
  font-size:clamp(16.5px,1.35vw,21px);font-weight:800;line-height:1.25;
  margin-bottom:clamp(12px,1.2vw,18px);
}
.domaine__text{flex:1;color:var(--body);font-size:clamp(13px,1vw,15.5px);line-height:1.6}
.domaine__arrow{
  display:grid;place-items:center;
  margin-top:clamp(18px,2vw,28px);
  color:var(--gold);
}
.domaine__arrow svg{
  width:clamp(24px,2vw,30px);height:auto;
  fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
  transition:transform .2s var(--ease);
}
.domaine__link:hover .domaine__arrow svg{transform:translateX(6px)}

/* --------------------------- Responsive page --------------------------- */
@media (max-width:1180px){
  .nf-hero__text{max-width:min(54%,600px)}
  .promises{gap:12px}
  .promise{padding:24px 14px 28px}
}

@media (max-width:1080px){
  /* domaines : passage en lignes, image à gauche, comme sur la maquette mobile */
  .domaine-grid{
    grid-template-columns:1fr;
    gap:clamp(14px,2vw,20px);
    max-width:760px;margin-inline:auto;
  }
  .domaine__link{flex-direction:row;align-items:stretch}
  .domaine__photo{
    flex:0 0 clamp(120px,32%,240px);
    aspect-ratio:auto;
    border-radius:var(--r-md) 0 0 var(--r-md);
  }
  .domaine__body{
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    grid-template-areas:
      "icon title arrow"
      "icon text  arrow";
    align-items:center;
    column-gap:clamp(12px,2.4vw,22px);
    padding:clamp(18px,2.6vw,26px) clamp(14px,2.4vw,22px);
    text-align:left;
  }
  .domaine__icon{
    grid-area:icon;
    position:static;transform:none;
    width:clamp(56px,10vw,72px);
    box-shadow:none;background:#f3f6fb;
  }
  .domaine__title{grid-area:title;align-self:end;margin-bottom:8px;font-size:clamp(18px,2.8vw,23px)}
  .domaine__text{grid-area:text;align-self:start;flex:none;font-size:clamp(14px,2.1vw,16px)}
  .domaine__arrow{grid-area:arrow;margin:0}
}

@media (max-width:1000px){
  /* ouverture : titre, accroche, photo, puis les 4 promesses en 2 colonnes */
  .nf-hero{
    padding:calc(var(--header-h) + 30px) 0 clamp(56px,8vw,80px);
  }
  .nf-hero__text{max-width:none}
  .nf-hero__title{font-size:clamp(38px,9vw,62px)}
  .nf-hero__subtitle{font-size:clamp(20px,5vw,34px)}
  .nf-hero__lead{font-size:clamp(15px,2.3vw,18px)}
  .nf-hero__lead br{display:none}

  .nf-hero__media{
    position:relative;
    width:100vw;height:auto;
    aspect-ratio:5/4;
    margin:clamp(24px,4vw,36px) 0 0 calc(50% - 50vw);
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 10%,#000 26%,#000 82%,rgba(0,0,0,.5) 96%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 10%,#000 26%,#000 82%,rgba(0,0,0,.5) 96%,transparent 100%);
  }
  .nf-hero__media img{object-position:74% 44%;filter:brightness(.72) saturate(.8) contrast(1.04)}
  .nf-hero__media::after{
    background:
      linear-gradient(180deg,rgba(11,31,75,.55) 0%,rgba(11,31,75,0) 34%),
      radial-gradient(70% 60% at 52% 42%,rgba(37,99,235,.24),rgba(37,99,235,0) 74%);
  }

  .promises{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:clamp(30px,5vw,46px)}
  .promise{padding:26px 16px 30px}
  .promise__title{font-size:clamp(16px,2.6vw,20px)}
  .promise__text{font-size:clamp(13.5px,2.1vw,15.5px)}

  .nf-hero__curve{height:clamp(54px,9vw,90px)}
  .nf-hero__deco .deco-dots--bl{bottom:auto;top:4%;left:auto;right:-4px;width:130px;height:130px}
  .nf-hero__deco .deco-dots--mr{display:none}
  .nf-hero__lines{width:min(240px,44vw);opacity:.35}
}

@media (max-width:640px){
  .nf-hero__title{font-size:clamp(36px,11vw,52px)}
  .nf-hero__subtitle{font-size:clamp(19px,5.4vw,28px);line-height:1.34}
  .nf-hero__media{aspect-ratio:1/1}
  .promises{gap:12px}
  .promise{padding:22px 12px 26px;border-radius:var(--r-sm)}
  .promise__icon{width:56px;margin-bottom:14px}
  .promise__title{font-size:15.5px;margin-bottom:9px}
  .promise__text{font-size:13px;line-height:1.5}

  .domaines{padding-bottom:clamp(58px,10vw,80px)}
  /* on récupère de la largeur pour garder l'icône, comme sur la maquette */
  .domaines .shell{width:calc(100% - 24px)}
  .domaine__photo{flex-basis:clamp(92px,27%,124px)}
  .domaine__body{column-gap:10px;padding:14px 10px}
  .domaine__icon{width:46px}
  .domaine__icon svg{width:58%;height:58%}
  .domaine__title{font-size:17px;margin-bottom:5px}
  .domaine__text{font-size:13.5px;line-height:1.42}
  .domaine__arrow svg{width:20px}
}

@media (max-width:350px){
  .domaine__icon{display:none}
  .domaine__body{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"title arrow" "text arrow"}
}

/* état actif dans la bannière */
.nav__item.is-current{color:var(--blue)}
.nav__item.is-current span:last-child{position:relative}
.nav__item.is-current span:last-child::after{
  content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:var(--gold);
}

/* =========================================================================
   PAGE POURQUOI LPE
   ========================================================================= */

/* ------------------------ Ouverture (fond clair) ----------------------- */
.pq-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:calc(var(--header-h) + clamp(40px,4.6vw,72px)) 0 clamp(60px,6vw,96px);
}
.pq-hero__bg{
  position:absolute;inset:0;z-index:-2;
  background:
    radial-gradient(110% 80% at 4% 0%,#ffffff 0%,rgba(255,255,255,0) 58%),
    linear-gradient(160deg,#fbfcfe 0%,#eef3fa 62%,#e9eff8 100%);
}

.pq-hero__media{
  position:absolute;
  z-index:-1;
  top:0;right:0;
  width:56%;height:74%;
  -webkit-mask-image:radial-gradient(86% 124% at 92% 40%,#000 30%,rgba(0,0,0,.88) 52%,rgba(0,0,0,.38) 74%,transparent 94%);
  mask-image:radial-gradient(86% 124% at 92% 40%,#000 30%,rgba(0,0,0,.88) 52%,rgba(0,0,0,.38) 74%,transparent 94%);
}
.pq-hero__media img{width:100%;height:100%;object-fit:cover;object-position:52% 42%}

.pq-hero__text{max-width:min(52%,680px)}
.pq-hero__title{
  color:var(--navy-ink);
  font-size:clamp(38px,5.2vw,72px);
  font-weight:800;line-height:1.06;letter-spacing:-.025em;
}
.pq-hero__lead{
  margin-top:clamp(24px,2.6vw,38px);
  color:var(--navy-ink);
  font-size:clamp(16px,1.35vw,21px);line-height:1.7;
}

.atouts{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:clamp(12px,1.5vw,24px);
  margin-top:clamp(46px,6vw,104px);
}
.atout{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:clamp(28px,2.6vw,40px) clamp(14px,1.4vw,24px) clamp(30px,2.8vw,42px);
  background:#fff;
  border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.atout:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.atout__icon{color:var(--blue);margin-bottom:clamp(18px,1.8vw,26px)}
.atout__icon svg{
  width:clamp(48px,4.2vw,60px);height:auto;
  fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;
}
.atout__icon .dot{fill:currentColor;stroke:none}
.atout__title{
  color:var(--navy-ink);
  font-size:clamp(16px,1.35vw,21px);font-weight:800;line-height:1.25;
  margin-bottom:clamp(14px,1.4vw,20px);
}
.atout__text{color:var(--body);font-size:clamp(13px,1vw,15.5px);line-height:1.6}


.recits{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(12px,1.4vw,22px);
  max-width:min(58%,880px);
  margin-top:clamp(38px,4.2vw,58px);
}
.recit{
  display:flex;flex-direction:column;
  padding:clamp(12px,1.1vw,16px) clamp(12px,1.1vw,16px) clamp(24px,2.2vw,32px);
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.recit:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}
.recit__photo{
  display:block;overflow:hidden;
  aspect-ratio:16/11;
  border-radius:var(--r-sm);
}
.recit__photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.recit:hover .recit__photo img{transform:scale(1.05)}
.recit__body{padding:clamp(16px,1.6vw,24px) clamp(4px,.6vw,10px) 0}
.recit__title{
  color:var(--navy-ink);
  font-size:clamp(15.5px,1.3vw,20px);font-weight:800;line-height:1.28;
  margin-bottom:clamp(12px,1.2vw,18px);
}
.recit__text{color:var(--body);font-size:clamp(13px,.98vw,15.5px);line-height:1.65}

.objectif{
  display:flex;align-items:center;
  gap:clamp(20px,2.6vw,40px);
  max-width:min(58%,880px);
  margin-top:clamp(20px,2.2vw,34px);
  padding:clamp(22px,2.4vw,34px) clamp(24px,2.8vw,44px);
  color:#fff;
  background:linear-gradient(120deg,#0d2350 0%,#0a1c42 60%,#08183a 100%);
  border-radius:var(--r-md);
  box-shadow:var(--shadow-md);
}
.objectif__icon{flex:0 0 auto}
.objectif__icon svg{width:clamp(62px,5.6vw,84px);height:auto}
.objectif__sep{width:1px;align-self:stretch;background:rgba(255,255,255,.3)}
.objectif__title{font-size:clamp(19px,1.6vw,25px);font-weight:800;margin-bottom:8px}
.objectif__text{color:rgba(255,255,255,.86);font-size:clamp(14px,1.05vw,16.5px);line-height:1.6}

/* --------------------------- Responsive page --------------------------- */
@media (max-width:1180px){
  .pq-hero__text{max-width:min(50%,560px)}
  .atouts{gap:10px}
  .atout{padding:24px 12px 28px}
  .atout__title{font-size:15.5px;margin-bottom:12px}
  .atout__text{font-size:12.8px;line-height:1.55}
  .recits,.objectif{max-width:min(66%,780px)}
  .recit__title{font-size:15px}
  .recit__text{font-size:12.8px;line-height:1.55}
}

@media (max-width:1000px){
  /* ouverture : titre, accroche, photo, puis les atouts en liste */
  .pq-hero{padding:calc(var(--header-h) + 28px) 0 clamp(52px,7vw,76px)}
  .pq-hero__inner{display:flex;flex-direction:column}
  .pq-hero__text{max-width:none;order:1}
  .pq-hero__media{order:2}
  .atouts{order:3}

  .pq-hero__title{font-size:clamp(36px,9vw,58px)}
  .pq-hero__lead{font-size:clamp(15px,2.3vw,18px);margin-top:22px}
  .pq-hero__lead br{display:none}

  .pq-hero__media{
    position:relative;
    width:100vw;height:auto;
    aspect-ratio:5/4;
    margin:clamp(22px,4vw,34px) 0 0 calc(50% - 50vw);
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 9%,#000 24%,#000 82%,rgba(0,0,0,.5) 96%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 9%,#000 24%,#000 82%,rgba(0,0,0,.5) 96%,transparent 100%);
  }
  .pq-hero__media img{object-position:52% 44%}

  .atouts{
    grid-template-columns:1fr;
    gap:clamp(12px,2vw,18px);
    margin-top:clamp(28px,4vw,44px);
  }
  .atout{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    column-gap:clamp(16px,3vw,28px);
    text-align:left;
    padding:clamp(18px,2.6vw,26px) clamp(16px,2.6vw,26px);
  }
  .atout__icon{
    grid-row:1 / span 2;
    display:grid;place-items:center;
    width:clamp(76px,13vw,104px);aspect-ratio:1;
    margin:0;
    border-radius:50%;
    background:#f1f4fa;
  }
  .atout__icon svg{width:52%}
  .atout__title{align-self:end;margin-bottom:8px;font-size:clamp(17px,2.8vw,22px)}
  .atout__title br{display:none}
  .atout__text{align-self:start;font-size:clamp(14px,2.1vw,16.5px);line-height:1.55}

  /* bandeau pleine largeur, fondu en haut et en bas, entre l'accroche et les cartes */

  .recits{grid-template-columns:1fr;max-width:none;margin-top:clamp(24px,4vw,38px)}
  .recit{flex-direction:row;align-items:stretch;gap:0;padding:clamp(12px,2vw,16px)}
  .recit__photo{
    flex:0 0 clamp(120px,34%,260px);
    aspect-ratio:auto;
  }
  .recit__body{
    flex:1;
    display:flex;flex-direction:column;justify-content:center;
    padding:clamp(4px,1.6vw,16px) clamp(14px,2.6vw,24px);
  }
  .recit__title{font-size:clamp(17px,2.8vw,22px)}
  .recit__text{font-size:clamp(13.5px,2vw,16px);line-height:1.55}

  .objectif{max-width:none;gap:clamp(16px,3vw,26px)}
  .objectif__icon svg{width:clamp(56px,11vw,72px)}
  .objectif__title{font-size:clamp(18px,3vw,22px)}
  .objectif__text{font-size:clamp(14px,2.1vw,16px)}
  .objectif__text br{display:none}
}

@media (max-width:640px){
  .pq-hero__title{font-size:clamp(31px,9.6vw,46px)}
  .pq-hero__media{aspect-ratio:1/1}
  .atout{column-gap:14px;padding:16px 14px}
  .atout__icon{width:72px}
  .atout__title{font-size:17px;margin-bottom:6px}
  .atout__text{font-size:14px;line-height:1.45}

  .recit{padding:10px}
  .recit__photo{flex-basis:clamp(104px,32%,150px)}
  .recit__body{padding:8px 12px}
  .recit__title{font-size:17px;margin-bottom:8px}
  .recit__text{font-size:13.5px;line-height:1.45}
  .objectif{padding:20px 18px;gap:14px}
  .objectif__icon svg{width:56px}
  .objectif__title{font-size:18px}
  .objectif__text{font-size:14px}
}

@media (max-width:380px){
  .atout__icon{width:60px}
  .atout__text{font-size:13.5px}
}

/* =========================================================================
   PAGE FINANCEMENT
   ========================================================================= */

/* ------------------------ Ouverture (fond clair) ----------------------- */
.fi-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:calc(var(--header-h) + clamp(40px,4.6vw,76px)) 0 clamp(52px,5vw,84px);
}
.fi-hero__bg{
  position:absolute;inset:0;z-index:-2;
  background:
    radial-gradient(100% 76% at 2% 0%,#ffffff 0%,rgba(255,255,255,0) 56%),
    linear-gradient(160deg,#fbfcfe 0%,#eef2f8 60%,#e8edf6 100%);
}
.fi-hero__rings{
  position:absolute;z-index:-1;pointer-events:none;
  top:-6%;left:34%;
  width:min(620px,52vw);height:auto;
  opacity:.75;
}

.fi-hero__media{
  position:absolute;
  z-index:-1;
  top:0;right:0;
  width:58%;height:78%;
  -webkit-mask-image:radial-gradient(82% 120% at 92% 36%,#000 30%,rgba(0,0,0,.86) 52%,rgba(0,0,0,.34) 74%,transparent 94%);
  mask-image:radial-gradient(82% 120% at 92% 36%,#000 30%,rgba(0,0,0,.86) 52%,rgba(0,0,0,.34) 74%,transparent 94%);
}
.fi-hero__media img{width:100%;height:100%;object-fit:cover;object-position:50% 44%}

.fi-hero__text{max-width:min(52%,700px)}
.fi-hero__title{
  color:var(--navy-ink);
  font-size:clamp(30px,3.9vw,55px);
  font-weight:800;line-height:1.16;letter-spacing:-.01em;
  text-transform:uppercase;
}
.fi-hero__lead{
  margin-top:clamp(22px,2.4vw,36px);
  color:var(--navy-ink);
  font-size:clamp(15px,1.28vw,20px);line-height:1.75;
}
.fi-hero__lead strong{font-weight:800}

/* bandeau marine des 4 garanties */
.garanties{
  position:relative;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-top:clamp(40px,5vw,80px);
  padding:clamp(28px,3.2vw,50px) clamp(18px,2.2vw,38px);
  background:linear-gradient(140deg,#14396f 0%,#0f2f5c 55%,#0c2749 100%);
  border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);
}
.garanties::after{
  content:"";position:absolute;z-index:-1;
  left:2.5%;right:2.5%;bottom:calc(-1 * clamp(7px,.8vw,11px));
  height:clamp(14px,1.5vw,22px);
  background:linear-gradient(90deg,#c08c14,#e0b444 55%,#c08c14);
  border-radius:0 0 20px 20px;
}
.garantie{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:0 clamp(12px,1.8vw,28px);
}
.garantie+.garantie{border-left:1px solid rgba(255,255,255,.22)}
.garantie__icon{color:#fff;margin-bottom:clamp(14px,1.6vw,22px)}
.garantie__icon svg{
  width:clamp(44px,3.9vw,58px);height:auto;
  fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;
}
.garantie__icon .dot{fill:currentColor;stroke:none}
.garantie__title{
  color:#fff;
  font-size:clamp(14px,1.3vw,20px);font-weight:700;line-height:1.32;
  text-transform:uppercase;
}
.garantie__text{display:none}

/* --------------------------- Les 4 étapes ------------------------------ */
.parcours{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(64px,6.5vw,104px) 0 clamp(66px,6.5vw,104px);
  background:
    radial-gradient(70% 55% at 50% 0%,#12305f 0%,rgba(18,48,95,0) 62%),
    linear-gradient(168deg,#0c2450 0%,#0a1c3f 52%,#07162f 100%);
  color:#fff;
}
.parcours__deco{position:absolute;inset:0;z-index:-1;color:#3f7ae0;opacity:.28}
.parcours__rings{position:absolute;top:-90px;right:-90px;width:min(420px,38vw);height:auto}

.parcours__title{
  color:#fff;
  font-size:clamp(26px,3.5vw,50px);
  font-weight:800;line-height:1.14;letter-spacing:-.01em;
  text-transform:uppercase;
}
.parcours__subtitle{
  margin-top:clamp(8px,1vw,16px);
  color:#4d90e8;
  font-size:clamp(16px,1.85vw,27px);font-weight:700;letter-spacing:.01em;
  text-transform:uppercase;
}

.etapes{
  --etape-gap:clamp(14px,2vw,30px);
  --arrow-w:clamp(46px,5.4vw,88px);
  --arrow-y:clamp(50px,4.9vw,71px);
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--etape-gap);
  margin-top:clamp(44px,5vw,80px);
  counter-reset:none;
}
.etape{
  position:relative;
  display:flex;flex-direction:column;align-items:center;text-align:center;
}
/* liaison entre les étapes : trait plein et pointe, sans pointillés */
.etape:not(:last-child)::before{
  content:"";position:absolute;z-index:1;
  top:var(--arrow-y);
  right:calc(-1 * (var(--etape-gap) / 2) - var(--arrow-w) / 2);
  width:var(--arrow-w);height:2px;
  background:rgba(255,255,255,.5);
}
.etape:not(:last-child)::after{
  content:"";position:absolute;z-index:1;
  top:calc(var(--arrow-y) - 4px);
  right:calc(-1 * (var(--etape-gap) / 2) - var(--arrow-w) / 2);
  width:10px;height:10px;
  border-top:2px solid rgba(255,255,255,.5);
  border-right:2px solid rgba(255,255,255,.5);
  transform:rotate(45deg);
}
.etape__badge{
  position:relative;
  display:grid;place-items:center;
  width:clamp(104px,10.2vw,148px);aspect-ratio:1;
  margin-bottom:clamp(28px,2.8vw,42px);
  border-radius:50%;
  background:#eef3fa;
  border:clamp(6px,.72vw,10px) solid #2a6fc4;
}
.etape__icon{display:grid;place-items:center;width:52%;height:52%;color:#123a6b}
.etape__icon svg{
  width:100%;height:100%;
  fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
}
.etape__num{
  position:absolute;left:50%;bottom:calc(-1 * clamp(13px,1.2vw,18px));
  transform:translateX(-50%);
  display:grid;place-items:center;
  min-width:clamp(34px,3.2vw,46px);
  padding:clamp(4px,.4vw,6px) clamp(7px,.7vw,11px);
  border-radius:999px;
  background:var(--gold);color:#0c2450;
  font-size:clamp(13px,1.1vw,17px);font-weight:800;line-height:1;
}
.etape__title{
  color:#fff;
  font-size:clamp(14px,1.3vw,20px);font-weight:700;line-height:1.3;
  text-transform:uppercase;
  margin-bottom:clamp(14px,1.4vw,20px);
}
.etape__text{color:rgba(255,255,255,.82);font-size:clamp(13px,1vw,15.5px);line-height:1.65}

.rassurance{
  display:flex;align-items:center;
  gap:clamp(18px,2.4vw,34px);
  margin-top:clamp(44px,5vw,80px);
  padding:clamp(20px,2.2vw,32px) clamp(22px,3vw,46px);
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.1);
  border-radius:var(--r-md);
}
.rassurance__check{
  flex:0 0 auto;
  display:grid;place-items:center;
  width:clamp(46px,4.2vw,60px);aspect-ratio:1;
  border-radius:50%;
  background:#091b3b;
  border:2px solid var(--gold);
  color:var(--gold);
}
.rassurance__check svg{
  width:52%;height:52%;
  fill:none;stroke:currentColor;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;
}
.rassurance__sep{display:none}
.rassurance__text{color:#fff;font-size:clamp(15px,1.35vw,21px);line-height:1.5}

/* --------------------------- Responsive page --------------------------- */
@media (max-width:1180px){
  .fi-hero__text{max-width:min(50%,600px)}
  .garantie{padding:0 12px}
  .garantie__title{font-size:14px}
  .etape__title{font-size:14px}
  .etape__text{font-size:13px;line-height:1.55}
}

@media (max-width:1000px){
  /* ouverture : titre, accroche, photo, puis les garanties en lignes */
  .fi-hero{padding:calc(var(--header-h) + 26px) 0 clamp(48px,7vw,72px)}
  .fi-hero__inner{display:flex;flex-direction:column}
  .fi-hero__text{max-width:none;order:1}
  .fi-hero__media{order:2}
  .garanties{order:3}

  .fi-hero__title{font-size:clamp(28px,7.4vw,46px);line-height:1.2}
  .fi-hero__lead{font-size:clamp(15px,2.3vw,18px);margin-top:20px}
  .fi-hero__lead br{display:none}
  .fi-hero__rings{top:2%;left:22%;width:min(460px,74vw);opacity:.6}

  .fi-hero__media{
    position:relative;
    width:100vw;height:auto;
    aspect-ratio:16/11;
    margin:clamp(22px,4vw,32px) 0 0 calc(50% - 50vw);
    -webkit-mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 9%,#000 24%,#000 82%,rgba(0,0,0,.5) 96%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.5) 9%,#000 24%,#000 82%,rgba(0,0,0,.5) 96%,transparent 100%);
  }
  .fi-hero__media img{object-position:52% 46%}

  .garanties{
    grid-template-columns:1fr;
    margin-top:clamp(26px,4vw,40px);
    padding:clamp(6px,1.6vw,16px) clamp(16px,3vw,28px);
  }
  .garantie{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    text-align:left;
    padding:clamp(20px,3.4vw,30px) 0;
  }
  .garantie+.garantie{border-left:0;border-top:1px solid rgba(255,255,255,.16)}
  .garantie__icon{
    display:grid;place-items:center;
    width:clamp(76px,17vw,108px);aspect-ratio:1;
    margin:0;
    border-radius:50%;
    background:rgba(48,96,182,.26);
    color:var(--gold);
  }
  .garantie__icon svg{width:48%;height:48%}
  .garantie__body{
    padding-left:clamp(16px,3.4vw,28px);
    margin-left:clamp(14px,3vw,24px);
    border-left:1px solid rgba(255,255,255,.32);
  }
  .garantie__title{font-size:clamp(17px,3vw,23px)}
  .garantie__text{
    display:block;
    margin-top:8px;
    color:rgba(255,255,255,.82);
    font-size:clamp(14px,2.1vw,16.5px);line-height:1.55;
    text-transform:none;font-weight:400;
  }

  /* les étapes passent sur fond clair, en cartes blanches numérotées */
  .parcours{
    background:linear-gradient(170deg,#f7f9fd 0%,#e9eff9 55%,#f1f5fb 100%);
    color:var(--navy-ink);
  }
  .parcours__deco{color:#7fa2d8;opacity:.5}
  .parcours__rings{top:-70px;right:-70px;width:min(300px,54vw)}
  .parcours__title{color:var(--navy-ink);font-size:clamp(26px,7vw,42px)}
  .parcours__subtitle{color:#2f7bf0;font-size:clamp(15px,3.6vw,24px)}

  .etapes{grid-template-columns:1fr;gap:clamp(14px,2.4vw,20px);margin-top:clamp(28px,4.4vw,44px)}
  .etape{
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    column-gap:clamp(16px,3.4vw,28px);
    text-align:left;
    padding:clamp(18px,3vw,28px);
    background:#fff;
    border-radius:var(--r-md);
    box-shadow:var(--shadow-sm);
  }
  .etape:not(:last-child)::before,
  .etape:not(:last-child)::after{display:none}
  .etape__badge{
    grid-row:1 / span 2;
    width:clamp(86px,20vw,124px);
    margin:0;
    background:none;
    border-width:clamp(6px,1.5vw,9px);
  }
  .etape__icon{display:none}
  .etape__num{
    position:static;transform:none;
    min-width:0;padding:0;
    background:none;
    font-size:clamp(26px,6.4vw,40px);font-weight:800;
  }
  .etape__title{align-self:end;color:var(--navy-ink);margin-bottom:10px;font-size:clamp(16px,3vw,22px)}
  .etape__text{align-self:start;color:var(--body);font-size:clamp(14px,2.1vw,16.5px);line-height:1.55}

  /* une couleur de cercle par étape, comme sur la maquette mobile */
  .etape:nth-child(1) .etape__badge{border-color:#154a8f}
  .etape:nth-child(1) .etape__num{color:#154a8f}
  .etape:nth-child(2) .etape__badge{border-color:#3f7ad4}
  .etape:nth-child(2) .etape__num{color:#3f7ad4}
  .etape:nth-child(3) .etape__badge{border-color:#83aeea}
  .etape:nth-child(3) .etape__num{color:#83aeea}
  .etape:nth-child(4) .etape__badge{border-color:#d9a020}
  .etape:nth-child(4) .etape__num{color:#d9a020}

  .rassurance{
    gap:clamp(14px,3vw,22px);
    margin-top:clamp(20px,3vw,30px);
    padding:clamp(20px,3vw,28px) clamp(18px,3vw,28px);
    background:linear-gradient(140deg,#0d2350 0%,#0a1c42 100%);
    border-color:transparent;
    box-shadow:var(--shadow-md);
  }
  .rassurance__check{background:none;width:clamp(46px,10vw,58px)}
  .rassurance__sep{display:block;width:1px;align-self:stretch;background:rgba(255,255,255,.35)}
  .rassurance__text{font-size:clamp(14.5px,2.2vw,17px)}
}

@media (max-width:640px){
  .fi-hero__title{font-size:clamp(26px,7.8vw,40px)}
  .fi-hero__media{aspect-ratio:4/3}
  .garanties{padding:4px clamp(14px,3.4vw,22px)}
  .garantie{padding:18px 0}
  .garantie__icon{width:68px}
  .garantie__body{padding-left:14px;margin-left:13px}
  .garantie__title{font-size:16.5px}
  .garantie__text{font-size:14px;line-height:1.45}

  .etape{padding:16px 14px;column-gap:14px}
  .etape__badge{width:76px;border-width:6px}
  .etape__num{font-size:25px}
  .etape__title{font-size:16px;margin-bottom:7px}
  .etape__text{font-size:14px;line-height:1.45}
  .rassurance{padding:18px 16px;gap:13px}
  .rassurance__check{width:46px}
  .rassurance__text{font-size:14.5px}
}

/* =========================================================================
   PAGE PRENDRE RENDEZ-VOUS
   ========================================================================= */
.rdv{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:calc(var(--header-h) + clamp(34px,4.4vw,74px)) 0 clamp(56px,6vw,92px);
  color:#fff;
  background:
    radial-gradient(60% 40% at 50% 0%,#123362 0%,rgba(18,51,98,0) 62%),
    linear-gradient(172deg,#0b2048 0%,#081934 52%,#050f24 100%);
}

/* photo de fond : teintée bleu nuit et fondue dans le fond de section */
.rdv__media{
  position:absolute;z-index:-1;
  top:0;left:0;right:0;
  height:clamp(400px,50vw,760px);
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 52%,rgba(0,0,0,.5) 78%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 52%,rgba(0,0,0,.5) 78%,transparent 100%);
}
.rdv__media img{
  width:100%;height:100%;object-fit:cover;object-position:50% 46%;
  filter:brightness(.48) saturate(.5) contrast(1.06);
}
.rdv__media::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(7,22,52,.72) 0%,rgba(7,22,52,.22) 34%,rgba(7,22,52,.62) 100%),
    radial-gradient(70% 60% at 50% 30%,rgba(31,88,190,.3),rgba(31,88,190,0) 72%);
}
.rdv__rings{
  position:absolute;z-index:-1;pointer-events:none;
  top:calc(-1 * clamp(20px,3vw,50px));right:calc(-1 * clamp(30px,4vw,70px));
  width:min(400px,42vw);height:auto;
  opacity:.5;
}

.rdv__head{text-align:center}
.rdv__title{
  font-size:clamp(40px,6.6vw,94px);
  font-weight:800;line-height:1.02;letter-spacing:-.02em;
  text-transform:uppercase;
  text-shadow:0 6px 30px rgba(3,12,30,.5);
}
.rdv__lead{
  margin-top:clamp(18px,2vw,32px);
  color:rgba(255,255,255,.92);
  font-size:clamp(15px,1.4vw,21px);line-height:1.6;
  text-shadow:0 3px 18px rgba(3,12,30,.55);
}

/* Le même bloc, replacé après le formulaire et le bandeau de réassurance :
   un texte de clôture plus discret, pas un second grand titre de page. */
footer.rdv__head{
  margin-top:clamp(36px,4.4vw,60px);
  padding-top:clamp(30px,3.4vw,46px);
  border-top:1px solid rgba(255,255,255,.16);
}
footer.rdv__head .rdv__title{
  font-size:clamp(22px,2.6vw,34px);
  text-transform:none;letter-spacing:-.01em;
}
footer.rdv__head .rdv__lead{
  font-size:clamp(14px,1.1vw,16.5px);
  margin-top:12px;
}

/* ------------------------------ Formulaire ----------------------------- */
.rdv-form{
  width:min(720px,100%);
  margin:clamp(34px,4vw,62px) auto 0;
  padding:clamp(26px,3.2vw,50px) clamp(20px,3vw,48px) clamp(28px,3.4vw,52px);
  background:#f8fafc;
  border-radius:clamp(20px,2vw,30px);
  box-shadow:0 30px 70px rgba(3,12,30,.45);
}
.rdv-form__title{
  margin-bottom:clamp(20px,2.4vw,34px);
  color:var(--navy-ink);
  font-size:clamp(18px,1.7vw,26px);font-weight:800;letter-spacing:.01em;
  text-align:center;text-transform:uppercase;
}
.field{display:block;margin:0 0 clamp(15px,1.7vw,23px)}
.field__label{
  display:block;margin-bottom:9px;
  color:var(--navy-ink);
  font-size:clamp(13.5px,1.05vw,16px);font-weight:700;
}
.field__control{
  display:block;width:100%;
  padding:clamp(12px,1.15vw,17px) clamp(14px,1.3vw,20px);
  color:var(--navy-ink);
  background:#fdfdfe;
  border:1px solid #dbe2ec;
  border-radius:12px;
  font:inherit;
  font-size:clamp(14.5px,1.1vw,17px);
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.field__control::placeholder{color:#8fa0bd}
.field__control:focus{
  outline:none;
  border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(26,92,216,.16);
}
.field__control:user-invalid{border-color:#d05252;box-shadow:0 0 0 3px rgba(208,82,82,.14)}
textarea.field__control{min-height:clamp(104px,9vw,138px);resize:vertical;line-height:1.55}
select.field__control{
  appearance:none;-webkit-appearance:none;
  padding-right:46px;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230c2350' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right clamp(14px,1.3vw,18px) center;
  background-size:20px 20px;
}
select.field__control:invalid{color:#8fa0bd}

.rdv-form__submit{
  display:block;width:100%;
  margin-top:clamp(10px,1.4vw,20px);
  padding:clamp(15px,1.5vw,21px);
  color:#fff;
  background:linear-gradient(100deg,#c0900f,#dcaa32 52%,#c0900f);
  border-radius:12px;
  font-size:clamp(14.5px,1.25vw,19px);font-weight:800;letter-spacing:.02em;
  text-transform:uppercase;
  box-shadow:0 12px 26px rgba(150,110,14,.3);
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),filter .2s var(--ease);
}
.rdv-form__submit:hover{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 16px 32px rgba(150,110,14,.38)}
.rdv-form__note{
  margin-top:12px;
  color:var(--body);opacity:.75;
  font-size:clamp(12.5px,.95vw,14px);line-height:1.5;
  text-align:center;
}
.rdv-form__status{
  margin-top:14px;
  color:var(--body);
  font-size:clamp(13.5px,1vw,15.5px);line-height:1.5;
  text-align:center;
}
.rdv-form__status.is-error{color:#b83a3a;font-weight:600}
.rdv-form__status.is-succes{color:#1f7a4d;font-weight:600}
.rdv-form.est-en-cours .rdv-form__submit{opacity:.6;pointer-events:none}
/* Piege a robots : sorti de l'ecran plutot que masque, pour que les
   programmes automatiques le voient et le remplissent. Un visiteur ne le
   rencontre jamais, ni a l'oeil ni au clavier. */
.piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* ------------------ Formulaire de rendez-vous : étapes ------------------
   Sans JavaScript, tout reste visible et le formulaire fonctionne comme
   une longue page classique (étape 1 masquée, elle n'a aucune utilité sans
   script). Avec JavaScript, main.js révèle l'étape 1 et le fil d'étapes,
   masque les étapes 2 à 4 et pilote la navigation.                        */
.rdv-progress{margin-bottom:clamp(20px,2.4vw,28px)}
.rdv-progress__label{
  margin-bottom:8px;
  color:var(--body);font-size:13px;font-weight:700;text-align:center;
  text-transform:uppercase;letter-spacing:.04em;
}
.rdv-progress__bar{height:5px;border-radius:999px;background:#e5eaf3;overflow:hidden}
.rdv-progress__fill{
  display:block;height:100%;width:25%;border-radius:999px;
  background:linear-gradient(90deg,var(--blue),var(--gold));
  transition:width .3s var(--ease);
}

.rdv-step{margin-bottom:clamp(18px,2vw,26px)}
.rdv-step__title{
  margin-bottom:clamp(14px,1.6vw,20px);
  color:var(--navy-ink);
  font-size:clamp(15px,1.2vw,18px);font-weight:800;
}
.rdv-step__optional{color:var(--body);font-weight:600;text-transform:none;font-size:.85em}

.rdv-fieldset{border:0;margin:0 0 clamp(16px,1.8vw,22px);padding:0}
.rdv-fieldset:last-child{margin-bottom:0}
.rdv-fieldset__legend{
  padding:0 0 10px;
  color:var(--blue-strong);font-size:12.5px;font-weight:800;
  text-transform:uppercase;letter-spacing:.05em;
}

.rdv-badges{display:flex;flex-wrap:wrap;gap:10px}
.rdv-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:11px 18px;
  background:#fdfdfe;
  border:1.5px solid #dbe2ec;
  border-radius:999px;
  color:var(--navy-ink);
  font:inherit;font-size:clamp(13.5px,1vw,15px);font-weight:700;line-height:1.3;
  cursor:pointer;
  transition:border-color .2s var(--ease),background .2s var(--ease),color .2s var(--ease),transform .15s var(--ease),box-shadow .2s var(--ease);
}
.rdv-badge em{font-style:normal;font-weight:600;opacity:.75;font-size:.92em}
button.rdv-badge:hover,
.rdv-badge--radio:hover{border-color:var(--blue);transform:translateY(-1px)}
button.rdv-badge.is-active{
  color:#fff;background:var(--blue);border-color:var(--blue);
  box-shadow:0 8px 18px rgba(26,92,216,.28);
}
button.rdv-badge.is-active em{opacity:.85}

.rdv-badge--radio{position:relative}
.rdv-badge--radio input{
  position:absolute;width:1px;height:1px;margin:-1px;
  opacity:0;pointer-events:none;
}
.rdv-badge--radio input:checked + span{color:inherit}
.rdv-badge--radio:has(input:checked),
.rdv-badge--radio.is-checked{
  color:#fff;background:var(--blue);border-color:var(--blue);
  box-shadow:0 8px 18px rgba(26,92,216,.28);
}
.rdv-badge--radio:has(input:checked) em,
.rdv-badge--radio.is-checked em{opacity:.85}
.rdv-badge--radio:has(input:focus-visible){outline:2px solid var(--blue);outline-offset:2px}

.rdv-form__nav{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:clamp(14px,1.6vw,20px)}
.rdv-form__back,
.rdv-form__next{
  padding:13px 26px;
  border-radius:999px;
  font:inherit;font-size:clamp(13.5px,1vw,15.5px);font-weight:700;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),filter .2s var(--ease);
}
.rdv-form__back{
  color:var(--navy-ink);
  background:#eef1f6;
}
.rdv-form__back:hover{background:#e3e8f0}
.rdv-form__back.is-invisible{visibility:hidden;pointer-events:none}
.rdv-form__next{
  color:#fff;
  background:linear-gradient(105deg,var(--blue-strong),#2264d8);
  box-shadow:0 10px 22px rgba(20,80,200,.26);
  margin-left:auto;
}
.rdv-form__next:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(20,80,200,.34)}
.rdv-form__next:disabled{opacity:.5;pointer-events:none;transform:none;box-shadow:none}


/* --------------------------- Bandeau réassurance ----------------------- */
.rdv-atouts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  width:min(1080px,100%);
  margin:clamp(26px,3vw,46px) auto 0;
  padding:clamp(20px,2.2vw,32px) clamp(14px,2vw,30px);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.13);
  border-radius:var(--r-md);
}
.rdv-atout{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(13px,1.5vw,22px);
  padding:0 clamp(8px,1.5vw,24px);
}
.rdv-atout+.rdv-atout{border-left:1px solid rgba(255,255,255,.2)}
.rdv-atout__icon{
  flex:0 0 auto;
  display:grid;place-items:center;
  width:clamp(50px,4.6vw,64px);aspect-ratio:1;
  border-radius:50%;
  background:rgba(20,52,110,.55);
  border:1.5px solid rgba(96,146,224,.55);
  color:var(--gold);
}
.rdv-atout__icon svg{
  width:52%;height:52%;
  fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
}
.rdv-atout__body{display:flex;flex-direction:column;gap:3px;min-width:0}
.rdv-atout__title{color:#fff;font-size:clamp(14.5px,1.2vw,19px);font-weight:800;line-height:1.25}
.rdv-atout__sub{color:rgba(255,255,255,.78);font-size:clamp(13.5px,1.05vw,17px);line-height:1.25}

/* --------------------------- Responsive page --------------------------- */
@media (max-width:1000px){
  .rdv{padding:calc(var(--header-h) + 26px) 0 clamp(48px,7vw,74px)}
  .rdv__title{font-size:clamp(38px,10.4vw,64px)}
  .rdv__lead{font-size:clamp(15px,2.4vw,19px);margin-top:16px}
  /* la poignée de main reste lisible sous le titre en version mobile */
  .rdv__media{height:clamp(360px,80vw,600px)}
  .rdv__media img{filter:brightness(.6) saturate(.55) contrast(1.05);object-position:50% 42%}
  .rdv__media::after{
    background:
      linear-gradient(180deg,rgba(7,22,52,.7) 0%,rgba(7,22,52,.14) 42%,rgba(7,22,52,.55) 100%),
      radial-gradient(70% 60% at 50% 26%,rgba(31,88,190,.24),rgba(31,88,190,0) 74%);
  }
  .rdv__rings{top:-10px;right:-40px;width:min(280px,56vw)}

  /* icône au-dessus du texte, colonnes conservées comme sur la maquette */
  .rdv-atouts{padding:clamp(18px,3vw,26px) clamp(6px,2vw,18px)}
  .rdv-atout{
    flex-direction:column;text-align:center;
    gap:clamp(10px,2vw,16px);
    padding:0 clamp(6px,1.6vw,14px);
  }
  .rdv-atout__body{align-items:center}
  .rdv-atout__title{font-size:clamp(13.5px,2.7vw,17px)}
  .rdv-atout__sub{font-size:clamp(13px,2.5vw,16px)}
}

@media (max-width:640px){
  .rdv__title{font-size:clamp(34px,11.4vw,52px)}
  .rdv__lead br{display:none}
  .rdv-form{padding:24px 18px 26px;border-radius:20px}
  .rdv-form__title{font-size:18px;margin-bottom:20px}
  .field{margin-bottom:15px}
  .field__label{font-size:14px}
  .field__control{font-size:16px;padding:13px 15px}
  .rdv-form__submit{font-size:15px;padding:16px}
  .rdv-badge{padding:10px 15px;font-size:13.5px}
  .rdv-form__back,.rdv-form__next{padding:12px 20px;font-size:13.5px}
  .rdv-atout__icon{width:46px}
  .rdv-atout__title{font-size:13.5px}
  .rdv-atout__sub{font-size:13px}
}

@media (max-width:400px){
  .rdv-atout{padding:0 4px;gap:9px}
  .rdv-atout__icon{width:40px}
  .rdv-atout__title{font-size:12.5px}
  .rdv-atout__sub{font-size:12px}
}

/* -------------------- Pages à fond sombre jusqu'en bas ------------------
   Sur la page Prendre rendez-vous, la section se termine en marine foncé.
   Le pourtour clair du pied de page dessinait alors un cadre blanc autour
   de la carte : on prolonge ici le fond sombre jusqu'au bas de la page. */
.page-sombre{background:#050f24}
.page-sombre .site-footer{background:transparent}
.page-sombre .footer-card{
  border:1px solid rgba(255,255,255,.07);
  box-shadow:0 18px 50px rgba(0,0,0,.35);
}

/* =========================================================================
   PAGES DE FORMATION
   ========================================================================= */
.fx-titre{
  margin-bottom:clamp(30px,3.4vw,50px);
  color:var(--navy-ink);
  font-size:clamp(22px,2.5vw,34px);font-weight:800;letter-spacing:.01em;
  text-align:center;text-transform:uppercase;
}

/* ------------------------------- Ouverture ------------------------------ */
.fx-hero{
  position:relative;isolation:isolate;overflow:hidden;
  padding:calc(var(--header-h) + clamp(30px,3.4vw,58px)) 0 clamp(44px,4.6vw,74px);
  color:#fff;
  background:linear-gradient(150deg,#0b2048 0%,#081a38 55%,#061228 100%);
}
.fx-hero__media{position:absolute;inset:0;z-index:-1}
.fx-hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:60% 40%;
  filter:brightness(.42) saturate(.55) contrast(1.05);
  -webkit-mask-image:linear-gradient(95deg,transparent 6%,rgba(0,0,0,.55) 34%,#000 68%);
  mask-image:linear-gradient(95deg,transparent 6%,rgba(0,0,0,.55) 34%,#000 68%);
}
.fx-hero__qualiopi{
  position:absolute;z-index:2;
  top:calc(var(--header-h) + 10px);right:clamp(16px,3vw,44px);
  padding:9px 13px;background:#fff;border-radius:12px;
  box-shadow:0 10px 26px rgba(0,0,0,.28);
}
.fx-hero__qualiopi img{width:clamp(104px,9vw,132px);height:auto}

.fx-hero__inner{
  position:relative;
  display:grid;grid-template-columns:minmax(0,1fr) clamp(280px,26vw,360px);
  align-items:start;gap:clamp(24px,3vw,52px);
}
.fx-hero__tags{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:clamp(18px,2vw,28px)}
.fx-tag{
  display:inline-block;padding:7px 18px;border-radius:999px;
  border:1.5px solid var(--gold);color:var(--gold);
  font-size:clamp(11.5px,.9vw,13.5px);font-weight:800;letter-spacing:.09em;text-transform:uppercase;
}
.fx-tag--plein{background:var(--gold);color:#0b2048;border-color:var(--gold)}
.fx-hero__title{
  font-size:clamp(30px,4.1vw,58px);
  font-weight:800;line-height:1.08;letter-spacing:-.015em;text-transform:uppercase;
}
.fx-hero__lead{
  margin-top:clamp(18px,2vw,30px);max-width:46ch;
  color:rgba(255,255,255,.88);
  font-size:clamp(15px,1.2vw,19px);line-height:1.6;
}

.fx-atouts{display:flex;flex-wrap:wrap;gap:clamp(14px,2vw,30px);margin-top:clamp(24px,2.8vw,40px)}
.fx-atout{display:flex;align-items:center;gap:12px;min-width:0}
.fx-atout__icon{
  flex:0 0 auto;display:grid;place-items:center;
  width:clamp(40px,3.4vw,50px);aspect-ratio:1;border-radius:50%;
  border:1.5px solid rgba(214,167,42,.55);background:rgba(214,167,42,.1);
  color:var(--gold);
}
.fx-atout__icon svg{width:54%;height:54%;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.fx-atout__body{display:flex;flex-direction:column;gap:2px;min-width:0}
.fx-atout__title{font-size:clamp(12.5px,1vw,15px);font-weight:800;line-height:1.25}
.fx-atout__sub{color:rgba(255,255,255,.72);font-size:clamp(12px,.95vw,14px);line-height:1.25}

.fx-prix{
  padding:clamp(22px,2.2vw,32px);
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.16);
  border-radius:var(--r-md);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
}
.fx-prix__label{font-size:clamp(12px,.95vw,14px);font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.82)}
.fx-prix__montant{margin:6px 0 10px;color:#fff;font-size:clamp(30px,3.2vw,46px);font-weight:800;line-height:1.05}
.fx-prix__note{color:rgba(255,255,255,.78);font-size:clamp(13px,1vw,15.5px);line-height:1.5}
.fx-prix__cta{width:100%;margin-top:clamp(16px,1.8vw,24px);text-transform:uppercase;font-size:clamp(13px,1vw,16px)}

/* ----------------------------- Modules abordés -------------------------- */
.modules{padding:clamp(52px,5.4vw,86px) 0 clamp(50px,5vw,80px);background:linear-gradient(180deg,#f6f9fd,#fbfcfe)}
.modules__liste{
  width:min(var(--shell),100% - 48px);margin-inline:auto;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));
  gap:clamp(12px,1.4vw,22px);
}
.module{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:clamp(22px,2.2vw,32px) clamp(14px,1.4vw,22px) clamp(24px,2.4vw,34px);
  background:#fff;border:1px solid #e7ebf2;border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);
}
.module:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:rgba(214,167,42,.5)}
.module__icon{
  display:grid;place-items:center;
  width:clamp(52px,4.4vw,64px);aspect-ratio:1;margin-bottom:clamp(14px,1.6vw,22px);
  border-radius:50%;background:#0d2350;color:#fff;
}
.module__icon svg{width:52%;height:52%;fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
.module__title{color:var(--navy-ink);font-size:clamp(14px,1.1vw,17px);font-weight:800;line-height:1.3;margin-bottom:clamp(12px,1.2vw,18px)}
.module__text{color:var(--body);font-size:clamp(12.5px,.95vw,14.5px);line-height:1.6}
.modules__ui{display:none;margin-top:26px;text-align:center}

/* -------------------------- Objectifs et public ------------------------- */
.objectifs{padding:clamp(10px,1.4vw,20px) 0 clamp(52px,5.4vw,86px);background:#fbfcfe}
.objectifs__grille{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,30px);align-items:start}
.bloc{padding:clamp(26px,2.8vw,44px);border-radius:var(--r-md)}
.bloc--clair{background:#f4f7fc;border:1px solid #e5eaf3}
.bloc--marine{color:#fff;background:linear-gradient(150deg,#0d2350,#0a1c42 60%,#08183a);box-shadow:var(--shadow-md)}
.bloc__titre{
  margin-bottom:clamp(20px,2.2vw,30px);
  font-size:clamp(17px,1.5vw,23px);font-weight:800;letter-spacing:.01em;text-transform:uppercase;
}
.bloc--clair .bloc__titre{color:var(--navy-ink)}
.objectifs__liste,.cibles{display:flex;flex-direction:column;gap:clamp(14px,1.5vw,20px)}
.fx-objectif,.cible{display:flex;gap:14px;font-size:clamp(14px,1.05vw,16.5px);line-height:1.55}
.fx-objectif{color:var(--body)}
.cible{color:rgba(255,255,255,.9)}
.fx-objectif__puce,.cible__puce{flex:0 0 auto;color:var(--gold);margin-top:1px}
.fx-objectif__puce svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cible__puce svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}

/* --------------------------- Programme détaillé ------------------------- */
.programme{padding:clamp(52px,5.4vw,86px) 0;background:linear-gradient(180deg,#fbfcfe,#f4f7fc)}
.prog{
  display:grid;grid-template-columns:clamp(230px,26vw,320px) minmax(0,1fr);
  background:#fff;border:1px solid #e5eaf3;border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);overflow:hidden;
}
.prog__tabs{display:flex;flex-direction:column;background:#f4f7fc;border-right:1px solid #e5eaf3}
.prog__tab{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:clamp(15px,1.4vw,20px) clamp(16px,1.5vw,22px);
  color:var(--navy-ink);text-align:left;
  font-size:clamp(13px,1.02vw,15.5px);font-weight:600;line-height:1.3;
  border-bottom:1px solid #e5eaf3;
  transition:background .2s var(--ease),color .2s var(--ease);
}
.prog__tab:last-child{border-bottom:0}
.prog__tab:hover{background:#eaf0f9}
.prog__tab.is-active{
  background:linear-gradient(100deg,#c8951c,#dcab34);
  color:#0b2048;font-weight:800;
}
.prog__chev{flex:0 0 auto;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.prog__panel{display:none;grid-template-columns:minmax(0,1fr) clamp(180px,22vw,300px)}
.prog__panel.is-active{display:grid}
.prog__body{padding:clamp(24px,2.6vw,40px)}
.prog__title{color:var(--navy-ink);font-size:clamp(15px,1.35vw,20px);font-weight:800;text-transform:uppercase;margin-bottom:clamp(12px,1.3vw,18px)}
.prog__points{display:flex;flex-direction:column;gap:clamp(10px,1.1vw,15px)}
.prog__points li{display:flex;gap:12px;color:var(--body);font-size:clamp(13.5px,1.02vw,16px);line-height:1.55}
.prog__check{flex:0 0 auto;color:var(--gold);margin-top:2px}
.prog__check svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.prog__photo{display:block;overflow:hidden}
.prog__photo img{width:100%;height:100%;object-fit:cover}

/* ------------------------- Informations pratiques ----------------------- */
.pratiques{padding:clamp(52px,5.4vw,86px) 0;background:#f4f7fc}
.pratiques__liste{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  padding:clamp(22px,2.4vw,36px) clamp(14px,1.8vw,28px);
  background:#fff;border:1px solid #e5eaf3;border-radius:var(--r-md);box-shadow:var(--shadow-sm);
}
.pratique{display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;padding:0 clamp(10px,1.4vw,22px)}
.pratique+.pratique{border-left:1px solid #e5eaf3}
.pratique__icon{color:var(--navy-ink);margin-bottom:8px}
.pratique__icon svg{width:clamp(34px,3vw,42px);height:auto;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.pratique__icon .dot{fill:currentColor;stroke:none}
.pratique__label{color:var(--navy-ink);font-size:clamp(11.5px,.95vw,14px);font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.pratique__value{color:var(--body);font-size:clamp(13px,1vw,15.5px);line-height:1.4}
.pratique__sub{color:var(--body);font-size:clamp(12.5px,.95vw,14.5px);line-height:1.4;opacity:.85}

/* ---------------------------- Passer à l'action ------------------------- */
.fx-cta{padding:clamp(20px,2.4vw,40px) 0 clamp(56px,5.6vw,90px);background:#fbfcfe}
.fx-cta__carte{
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;
  gap:clamp(22px,3vw,50px);
  padding:clamp(26px,2.8vw,44px) clamp(26px,3vw,50px);
  color:#fff;background:linear-gradient(120deg,#0d2350,#0a1c42 60%,#08183a);
  border-radius:var(--r-md);box-shadow:var(--shadow-md);
}
.fx-cta__titre{font-size:clamp(19px,1.9vw,28px);font-weight:800;text-transform:uppercase;margin-bottom:10px}
.fx-cta__lead{color:rgba(255,255,255,.84);font-size:clamp(14px,1.1vw,17px);line-height:1.55;max-width:52ch}
.fx-cta__actions{display:flex;flex-direction:column;align-items:center;gap:14px}
.fx-cta__actions .btn--gold{text-transform:uppercase;font-size:clamp(13px,1vw,16px);white-space:nowrap}
.fx-cta__note{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.86);font-size:clamp(13px,1vw,15.5px)}
.fx-cta__check{color:var(--gold);flex:0 0 auto}
.fx-cta__check svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.fx-plus-liste{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  margin-top:clamp(22px,2.4vw,38px);
}
.fx-plus{display:flex;align-items:center;justify-content:center;gap:12px;padding:0 clamp(10px,1.4vw,22px)}
.fx-plus+.fx-plus{border-left:1px solid #dde4ee}
.fx-plus__icon{flex:0 0 auto;color:var(--navy-ink)}
.fx-plus__icon svg{width:clamp(26px,2.3vw,34px);height:auto;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.fx-plus__body{display:flex;flex-direction:column;min-width:0}
.fx-plus__title{color:var(--navy-ink);font-size:clamp(12.5px,1vw,15px);font-weight:800;line-height:1.3}
.fx-plus__sub{color:var(--body);font-size:clamp(12px,.95vw,14.5px);line-height:1.3}

/* --------------------------- Responsive formation ----------------------- */
@media (max-width:1180px){
  .fx-hero__inner{grid-template-columns:minmax(0,1fr) clamp(250px,28vw,320px)}
  .fx-atouts{gap:14px}
}

@media (max-width:1000px){
  /* ouverture : titre, accroche, carte tarif, puis les atouts */
  .fx-hero{padding:calc(var(--header-h) + 22px) 0 clamp(36px,5vw,56px)}
  .fx-hero__inner{display:flex;flex-direction:column;gap:0}
  .fx-hero__media img{
    object-position:66% 38%;
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 42%,rgba(0,0,0,.45) 72%,transparent 100%);
    mask-image:linear-gradient(180deg,#000 0%,#000 42%,rgba(0,0,0,.45) 72%,transparent 100%);
  }
  .fx-hero__qualiopi{display:none}
  .fx-hero__title{font-size:clamp(28px,7.4vw,46px)}
  .fx-hero__lead{font-size:clamp(14.5px,2.3vw,18px);max-width:none}
  .fx-prix{margin-top:clamp(24px,3.6vw,34px)}
  .fx-atouts{
    display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;
    margin-top:clamp(26px,4vw,38px);
  }
  .fx-atout{
    flex-direction:column;text-align:center;gap:10px;
    padding:0 clamp(4px,1.4vw,12px);
  }
  .fx-atout+.fx-atout{border-left:1px solid rgba(255,255,255,.16)}
  .fx-atout__body{align-items:center}
  .fx-atout__title{font-size:clamp(11.5px,2.4vw,14px)}
  .fx-atout__sub{font-size:clamp(11px,2.2vw,13.5px)}

  /* modules : carrousel */
  .modules__piste{
    overflow-x:auto;overflow-y:hidden;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;
    padding-block:8px 12px;
  }
  .modules__piste::-webkit-scrollbar{display:none}
  .modules__liste{
    width:max-content;display:flex;gap:16px;
    padding-inline:calc(50vw - 132px);
  }
  .module{
    scroll-snap-align:center;flex:0 0 264px;
    transform:scale(.94);opacity:.86;
    transition:transform .35s var(--ease),opacity .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease);
  }
  .module:hover{transform:scale(.94)}
  .module.is-active,.module.is-active:hover{transform:scale(1);opacity:1;border-color:var(--gold);box-shadow:var(--shadow-md)}
  .modules__ui{display:block}

  .objectifs__grille{grid-template-columns:1fr}

  /* programme : les onglets deviennent un accordéon */
  .prog{grid-template-columns:1fr;background:none;border:0;box-shadow:none;overflow:visible;gap:12px}
  .prog__tabs{display:contents}
  .prog__tab{
    order:var(--ordre);
    background:#fff;border:1px solid #e5eaf3;border-radius:var(--r-sm);
    padding:16px 18px;font-size:15px;
  }
  .prog__tab .prog__chev{transition:transform .25s var(--ease)}
  .prog__tab.is-active{border-color:transparent;border-radius:var(--r-sm) var(--r-sm) 0 0}
  .prog__tab.is-active .prog__chev{transform:rotate(90deg)}
  .prog__panels{display:contents}
  .prog__panel{
    order:var(--ordre);
    grid-template-columns:1fr;
    margin-top:-12px;
    background:#fff;border:1px solid #e5eaf3;border-top:0;
    border-radius:0 0 var(--r-sm) var(--r-sm);
  }
  .prog__body{padding:18px}
  .prog__photo{height:clamp(140px,32vw,220px);order:-1;border-radius:0}

  .pratiques__liste{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,3vw,26px) 0}
  .pratique:nth-child(odd){border-left:0}
  .pratique:nth-child(n+3){padding-top:clamp(18px,3vw,26px);border-top:1px solid #e5eaf3}

  .fx-cta__carte{grid-template-columns:1fr;gap:22px}
  .fx-cta__actions{align-items:stretch}
  .fx-cta__actions .btn--gold{justify-content:center}
  .fx-cta__note{justify-content:center}

  .fx-plus-liste{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 0}
  .fx-plus{justify-content:flex-start}
  .fx-plus:nth-child(odd){border-left:0}
}

@media (max-width:640px){
  .fx-titre{font-size:clamp(19px,5.2vw,26px)}
  .fx-hero__title{font-size:clamp(26px,8vw,40px)}
  .fx-prix__montant{font-size:clamp(28px,8vw,40px)}
  .modules__liste{padding-inline:calc(50vw - 124px)}
  .module{flex-basis:248px}
  .bloc{padding:22px 18px}
  .fx-plus-liste{grid-template-columns:1fr;gap:14px}
  .fx-plus+.fx-plus{border-left:0}
}

@media (max-width:430px){
  .fx-atouts{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 0}
  .fx-atout:nth-child(odd){border-left:0}
  .fx-atout:nth-child(n+3){padding-top:18px;border-top:1px solid rgba(255,255,255,.16)}
}

/* ------------------- Page de liste d'une famille ----------------------- */
.fl-hero{
  position:relative;isolation:isolate;overflow:hidden;
  padding:calc(var(--header-h) + clamp(28px,3.4vw,54px)) 0 clamp(38px,4vw,62px);
  color:#fff;
  background:linear-gradient(150deg,#0b2048 0%,#081a38 55%,#061228 100%);
}
.fl-hero__media{position:absolute;inset:0;z-index:-1}
.fl-hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:60% 42%;
  filter:brightness(.4) saturate(.5) contrast(1.05);
  -webkit-mask-image:linear-gradient(95deg,transparent 4%,rgba(0,0,0,.5) 32%,#000 70%);
  mask-image:linear-gradient(95deg,transparent 4%,rgba(0,0,0,.5) 32%,#000 70%);
}
.fil{display:flex;align-items:center;gap:10px;margin-bottom:clamp(14px,1.6vw,22px);font-size:clamp(13px,1vw,15px)}
.fil a{color:rgba(255,255,255,.78);transition:color .2s var(--ease)}
.fil a:hover{color:var(--gold)}
.fil__sep{color:rgba(255,255,255,.45)}
.fil [aria-current]{color:var(--gold);font-weight:700}
.fl-hero__titre{font-size:clamp(32px,4.6vw,66px);font-weight:800;line-height:1.04;letter-spacing:-.02em;text-transform:uppercase}
.fl-hero__lead{margin-top:clamp(14px,1.6vw,24px);max-width:52ch;color:rgba(255,255,255,.88);font-size:clamp(15px,1.25vw,20px);line-height:1.6}
.fl-hero__lead--sub{margin-top:clamp(8px,1vw,14px);font-size:clamp(13.5px,1.05vw,16px);color:rgba(255,255,255,.62)}
.fl-hero__compte{margin-top:12px;color:var(--gold);font-size:clamp(13px,1.05vw,16px);font-weight:700}

.fl-liste{padding:clamp(44px,4.6vw,76px) 0 clamp(56px,5.6vw,92px);background:linear-gradient(180deg,#f6f9fd,#fbfcfe)}
.fl-groupe+.fl-groupe{margin-top:clamp(36px,4vw,60px)}
.fl-groupe__titre{
  margin-bottom:10px;
  color:var(--navy-ink);font-size:clamp(17px,1.6vw,24px);font-weight:800;
}
.fl-groupe__texte{
  margin-bottom:clamp(18px,2vw,28px);max-width:65ch;
  color:var(--body);font-size:clamp(13.5px,1.02vw,15.5px);line-height:1.6;
}
.fl-cartes{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:clamp(14px,1.6vw,24px)}
.fl-carte{display:flex}
.fl-carte__lien{
  display:flex;flex-direction:column;width:100%;
  padding:clamp(20px,2vw,28px);
  background:#fff;border:1px solid #e5eaf3;border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);
}
.fl-carte__lien:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:rgba(214,167,42,.55)}
.fl-carte__haut{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:clamp(14px,1.5vw,20px)}
.fl-carte .fx-tag{color:var(--navy-ink);border-color:#c8951c;font-size:11px;padding:5px 13px}
.fl-carte .fx-tag--plein{background:#0d2350;color:#fff;border-color:#0d2350}
.fl-carte__duree{color:var(--body);font-size:clamp(12.5px,.95vw,14px)}
.fl-carte__titre{color:var(--navy-ink);font-size:clamp(16px,1.35vw,20px);font-weight:800;line-height:1.3;margin-bottom:10px}
.fl-carte__texte{flex:1;color:var(--body);font-size:clamp(13.5px,1vw,15.5px);line-height:1.6}
.fl-carte__bas{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:clamp(18px,1.8vw,24px)}
.fl-carte__prix{color:var(--navy-ink);font-size:clamp(13.5px,1.05vw,16px);font-weight:800}
.fl-carte__fleche{
  display:grid;place-items:center;flex:0 0 auto;
  width:38px;height:38px;border-radius:50%;
  background:#f2f6fc;color:var(--gold);
  transition:transform .2s var(--ease),background .2s var(--ease);
}
.fl-carte__fleche svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.fl-carte__lien:hover .fl-carte__fleche{transform:translateX(4px);background:#e9eff9}

@media (max-width:1000px){
  .fl-hero{padding:calc(var(--header-h) + 22px) 0 clamp(32px,5vw,48px)}
  .fl-hero__media img{
    object-position:64% 40%;
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 46%,rgba(0,0,0,.45) 76%,transparent 100%);
    mask-image:linear-gradient(180deg,#000 0%,#000 46%,rgba(0,0,0,.45) 76%,transparent 100%);
  }
  .fl-hero__titre{font-size:clamp(30px,8vw,48px)}
  .fl-hero__lead{font-size:clamp(15px,2.4vw,18px);max-width:none}
  .fl-cartes{grid-template-columns:1fr}
}

@media (max-width:640px){
  .fl-carte__lien{padding:18px}
  .fl-carte__titre{font-size:17px}
  .fl-carte__texte{font-size:14px}
}

/* ------------- Cartes de domaine cliquables sur l'accueil --------------- */
.card{position:relative}
.card__lien{color:inherit;text-decoration:none}
/* la zone cliquable couvre toute la carte, sans toucher à la mise en page */
.card__lien::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit}
.card__lien:focus-visible{outline:none}
.card:has(.card__lien:focus-visible){outline:3px solid var(--gold);outline-offset:4px}
.card:has(.card__lien:hover) .card__title{color:var(--gold)}
@media (max-width:1000px){
  .card:has(.card__lien:hover) .card__title{color:var(--blue)}
}

/* ------------------ Groupes de la liste des formations ----------------- */
.field__control optgroup{color:var(--navy-ink);font-weight:800;font-style:normal}
.field__control option{color:var(--navy-ink);font-weight:400}

/* ------------------------------ Bouton retour --------------------------- */
.retour{
  position:fixed;z-index:115;
  left:clamp(12px,2vw,26px);top:calc(var(--header-h) + 18px);
  display:inline-flex;align-items:center;gap:9px;
  padding:11px 18px 11px 15px;
  color:var(--navy-ink);
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid #dde4ee;
  border-radius:999px;
  box-shadow:0 8px 24px rgba(11,31,75,.18);
  font-size:clamp(13px,1vw,15px);font-weight:700;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s var(--ease);
}
.retour:hover{transform:translateY(-2px);background:#fff;box-shadow:0 12px 30px rgba(11,31,75,.26)}
.retour svg{
  width:18px;height:18px;flex:0 0 auto;color:var(--blue);
  fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;
}
@media (max-width:640px){
  .retour{top:auto;bottom:clamp(12px,2vw,26px);padding:10px 15px 10px 12px;font-size:13px;gap:7px}
  .retour svg{width:16px;height:16px}
}
@media print{.retour{display:none}}

/* ------------- Programme détaillé : volet et photo mieux calés ----------- */
@media (min-width:1001px){
  .prog{min-height:clamp(300px,25vw,380px)}
  .prog__panels{display:grid}
  .prog__panel.is-active{height:100%}
  .prog__panel{grid-template-columns:minmax(0,1fr) clamp(210px,25vw,340px)}
  .prog__photo img{min-height:100%}
}

/* --------- Les quatre atouts en 2 colonnes jusqu'en petit écran ---------- */
@media (max-width:640px){
  .fx-plus-liste{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 0}
  .fx-plus{justify-content:flex-start;padding:0 10px}
  .fx-plus:nth-child(odd){border-left:0}
  .fx-plus:nth-child(even){border-left:1px solid #dde4ee}
  .fx-plus__icon svg{width:24px}
  .fx-plus__title{font-size:12.5px}
  .fx-plus__sub{font-size:11.5px}
}
@media (max-width:380px){
  .fx-plus{gap:8px;padding:0 6px}
  .fx-plus__icon svg{width:21px}
  .fx-plus__title{font-size:11.5px}
  .fx-plus__sub{font-size:11px}
}

/* =========================================================================
   NOS FORMATEURS (page Pourquoi LPE)
   ========================================================================= */
.eyebrow--or{color:var(--gold)}

/* ------------------------- Ouverture, fond marine ----------------------- */
.fo-hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(56px,6vw,96px) 0 clamp(52px,5.4vw,86px);
  color:#fff;
  background:
    radial-gradient(70% 60% at 78% 30%,#12305f 0%,rgba(18,48,95,0) 62%),
    linear-gradient(155deg,#0b2048 0%,#08183a 55%,#061228 100%);
}
.fo-hero__media{
  position:absolute;z-index:-1;
  right:clamp(-40px,-2vw,0px);bottom:0;
  width:min(620px,50%);
}
.fo-hero__media img{width:100%;height:auto;display:block}

.fo-hero__texte{max-width:min(52%,660px)}
.fo-hero__titre{
  margin-top:6px;
  font-size:clamp(30px,4vw,58px);
  font-weight:800;line-height:1.1;letter-spacing:-.02em;
}
.fo-hero__lead{
  margin-top:clamp(18px,2vw,28px);
  color:rgba(255,255,255,.86);
  font-size:clamp(15px,1.25vw,19px);line-height:1.65;
}

.fo-atouts{
  display:flex;flex-direction:column;
  gap:clamp(18px,2.2vw,30px);
  margin-top:clamp(26px,3vw,44px);
}
.fo-atout{display:flex;align-items:center;gap:clamp(14px,1.6vw,24px)}
.fo-atout__icone{
  flex:0 0 auto;
  display:grid;place-items:center;
  width:clamp(48px,4.4vw,62px);aspect-ratio:1;
  border-radius:50%;
  border:1.6px solid rgba(214,167,42,.65);
  color:var(--gold);
}
.fo-atout__icone svg{
  width:56%;height:56%;
  fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;
}
.fo-atout__corps{display:flex;flex-direction:column;gap:3px;min-width:0}
.fo-atout__titre{font-size:clamp(15px,1.3vw,19px);font-weight:800;line-height:1.3}
.fo-atout__sous{color:rgba(255,255,255,.78);font-size:clamp(13.5px,1.05vw,16px);line-height:1.4}

.fo-hero__cta{
  margin-top:clamp(28px,3.2vw,46px);
  padding:clamp(16px,1.6vw,22px) clamp(26px,2.6vw,40px);
  text-transform:uppercase;letter-spacing:.02em;
  font-size:clamp(14px,1.1vw,17px);
}

/* --------------------- Découvrez nos formateurs ------------------------- */
.equipe{
  padding:clamp(56px,6vw,96px) 0 clamp(60px,6.4vw,100px);
  background:linear-gradient(180deg,#f6f9fd 0%,#fbfcfe 100%);
}
.equipe .section-head{max-width:760px}
.equipe .section-lead{color:var(--navy-ink)}

.equipe__liste{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(16px,2vw,30px);
  margin-top:clamp(34px,4vw,58px);
}
.formateur{display:flex}
.formateur__lien{
  display:grid;
  grid-template-columns:clamp(170px,31%,264px) minmax(0,1fr);
  gap:clamp(16px,2vw,30px);
  width:100%;
  padding:clamp(16px,1.8vw,26px);
  background:#fff;
  border:1px solid #e6ebf3;
  border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);
}
.formateur__lien:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:rgba(214,167,42,.5)}
.formateur__photo{
  display:block;overflow:hidden;align-self:start;
  aspect-ratio:4/5;
  border-radius:var(--r-sm);
  background:#eef2f8;
}
.formateur__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 42%}
.formateur__corps{display:flex;flex-direction:column;min-width:0}
.formateur__nom{
  color:var(--navy-ink);
  font-size:clamp(19px,1.7vw,26px);font-weight:800;line-height:1.2;
  margin-bottom:10px;
}
.formateur__role{
  color:#d08b1a;
  font-size:clamp(13px,1.05vw,15.5px);font-weight:800;line-height:1.35;
}
.formateur__role:last-of-type{margin-bottom:clamp(12px,1.4vw,18px)}
.formateur__texte{
  color:var(--body);
  font-size:clamp(13.5px,1.02vw,15.5px);line-height:1.62;
  margin-bottom:clamp(10px,1.2vw,16px);
}
.formateur__linkedin{
  display:inline-flex;align-items:center;gap:12px;
  margin-top:auto;padding-top:clamp(8px,1vw,14px);
  color:var(--navy-ink);
  font-size:clamp(13.5px,1.05vw,16px);font-weight:700;
}
.formateur__linkedin svg{
  width:clamp(22px,2vw,27px);height:auto;flex:0 0 auto;
  color:#0a66c2;
  transition:transform .2s var(--ease);
}
.formateur__lien:hover .formateur__linkedin svg{transform:scale(1.08)}

/* ---------------------------- Responsive -------------------------------- */
@media (max-width:1180px){
  .fo-hero__texte{max-width:min(56%,560px)}
  .fo-hero__media{width:min(520px,46%)}
  .formateur__lien{grid-template-columns:clamp(130px,28%,200px) minmax(0,1fr)}
}

@media (max-width:1000px){
  /* la photo passe dans le flux, entre les atouts et le bouton */
  .fo-hero{padding:clamp(44px,7vw,64px) 0 clamp(40px,6vw,60px)}
  .fo-hero__texte{max-width:none;display:flex;flex-direction:column}
  .fo-hero__titre{font-size:clamp(30px,8vw,48px)}
  .fo-hero__lead{font-size:clamp(15px,2.4vw,18px)}
  .fo-hero__lead br{display:none}
  .fo-hero__media{
    position:relative;right:auto;bottom:auto;
    width:100vw;margin:clamp(24px,4vw,36px) 0 0 calc(50% - 50vw);
  }
  .fo-hero__cta{justify-content:center;text-align:center}

  .equipe__liste{grid-template-columns:1fr}
  .formateur__lien{grid-template-columns:clamp(120px,32%,190px) minmax(0,1fr)}
  .equipe .section-lead br{display:none}
}

@media (max-width:640px){
  .fo-atout__icone{width:46px}
  .fo-atout__titre{font-size:16px}
  .fo-atout__sous{font-size:14px}
  .fo-hero__cta{font-size:13.5px;padding:15px 20px}
  .formateur__lien{padding:14px;gap:14px;grid-template-columns:clamp(104px,34%,150px) minmax(0,1fr)}
  .formateur__nom{font-size:19px}
  .formateur__role{font-size:13px}
  .formateur__texte{font-size:13.5px;line-height:1.55}
  .formateur__linkedin{font-size:13.5px;gap:9px}
}

/* ------------------------------------------------------- Bandeau cookies */
.cookies{
  position:fixed;left:0;right:0;bottom:0;z-index:300;
  display:flex;justify-content:center;
  padding:clamp(12px,2vw,20px);
  transform:translateY(120%);
  transition:transform .32s cubic-bezier(.22,.9,.32,1);
  pointer-events:none;
}
.cookies.is-visible{transform:translateY(0);pointer-events:auto}
.cookies__boite{
  width:min(720px,100%);
  display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;
  background:var(--navy-deep,#071633);
  color:#fff;
  border-radius:16px;
  padding:clamp(16px,2vw,22px) clamp(18px,2.4vw,26px);
  box-shadow:0 20px 48px rgba(4,12,32,.38);
}
.cookies__texte{flex:1 1 320px;font-size:14.5px;line-height:1.55;color:rgba(255,255,255,.88);margin:0}
.cookies__lien{color:var(--gold);text-decoration:underline;text-underline-offset:2px}
.cookies__actions{display:flex;gap:10px;flex:0 0 auto;margin-left:auto}
.cookies__bouton{
  border-radius:999px;padding:11px 20px;font-size:14.5px;font-weight:700;
  cursor:pointer;border:1.5px solid transparent;white-space:nowrap;
}
.cookies__bouton--discret{background:transparent;border-color:rgba(255,255,255,.35);color:#fff}
.cookies__bouton--discret:hover{border-color:#fff}
.cookies__bouton--plein{background:var(--gold);color:var(--navy-ink);}
.cookies__bouton--plein:hover{filter:brightness(1.06)}

@media (max-width:640px){
  .cookies__boite{flex-direction:column;align-items:stretch;text-align:left}
  .cookies__actions{margin-left:0;justify-content:flex-end}
}

/* --------------------------------- FAQ formation -------------------------- */
.faq{padding:clamp(52px,5.4vw,86px) 0;background:#fff}
.faq__liste{max-width:820px;margin-inline:auto;display:flex;flex-direction:column;gap:12px}
.faq__item{
  background:#f4f7fc;border:1px solid #e5eaf3;border-radius:var(--r-md);
  padding:clamp(14px,1.6vw,20px) clamp(16px,2vw,24px);
}
.faq__question{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  cursor:pointer;list-style:none;
  color:var(--navy-ink);font-weight:700;font-size:clamp(15px,1.15vw,17.5px);line-height:1.4;
}
.faq__question::-webkit-details-marker{display:none}
.faq__chev{flex:0 0 auto;width:20px;height:20px;color:var(--gold);stroke-width:2.6;transition:transform .2s var(--ease)}
.faq__item[open] .faq__chev{transform:rotate(90deg)}
.faq__reponse{margin-top:12px;color:var(--body);font-size:clamp(14px,1.05vw,16px);line-height:1.6;max-width:70ch}
.faq__reponse a{color:var(--blue);font-weight:700;text-decoration:underline;text-underline-offset:2px}

.cibles-intro{margin-bottom:clamp(16px,1.8vw,22px);color:rgba(255,255,255,.9);font-size:clamp(14px,1.05vw,16.5px);line-height:1.6;max-width:60ch}
.prerequis{margin-top:clamp(20px,2.2vw,28px);padding-top:clamp(16px,1.8vw,22px);border-top:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.85);font-size:clamp(13.5px,1vw,15.5px);line-height:1.6;max-width:60ch}
.prerequis strong{color:#fff;font-weight:800}

/* ------------------------------ Formations (pied de page) ---------------- */
.footer__formations{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:10px clamp(14px,2vw,26px);
  /* aligne la rangee sur la portion Qualiopi -> telephone plutot que sur
     toute la largeur du pied de page (colonnes 3 et 4 de .footer__top) */
  grid-column:3 / -1;
  margin:clamp(18px,2.2vw,28px) 0 0;
  padding-bottom:clamp(22px,2.6vw,34px);
  border-bottom:1px solid rgba(255,255,255,.14);
}
.footer__formations a{
  color:rgba(255,255,255,.78);
  font-size:clamp(13px,1vw,14.5px);font-weight:700;
  transition:color .2s var(--ease);
}
.footer__formations a:hover{color:var(--gold)}
@media (max-width:1000px){
  .footer__formations{grid-column:1 / -1;gap:8px 18px;padding-bottom:24px}
}

.footer__brand-bloc{display:flex;flex-direction:column;gap:14px;max-width:240px}
.footer__caption{color:rgba(255,255,255,.7);font-size:clamp(12.5px,.95vw,14px);line-height:1.55}
@media (max-width:1000px){
  .footer__brand-bloc{align-items:center;text-align:center;max-width:340px}
}

/* ------------------- Pourquoi se former (fiche formation) --------------- */
.section-pourquoi{padding:clamp(52px,5.4vw,86px) 0;background:#fff}
.section-pourquoi .bloc{max-width:820px;margin-inline:auto}
.section-pourquoi .fx-titre{color:#fff;margin-bottom:clamp(20px,2.2vw,28px)}
.section-pourquoi p{color:rgba(255,255,255,.85)}

/* =========================================================================
   PAGE BLOG / ARTICLE ÉDITORIAL
   ========================================================================= */
.art-hero{
  padding:calc(var(--header-h) + clamp(34px,4vw,54px)) 0 clamp(28px,3vw,40px);
  background:linear-gradient(160deg,#fbfcfe 0%,#eef3fa 100%);
}
.art-hero__inner{max-width:800px;margin-inline:auto}
.art-fil{
  display:flex;align-items:center;flex-wrap:wrap;gap:8px;
  margin-bottom:clamp(16px,2vw,24px);
  font-size:13.5px;color:var(--body);
}
.art-fil a{color:var(--blue);font-weight:700}
.art-fil a:hover{text-decoration:underline}
.art-fil__sep{color:#b7c0d4}
.art-fil [aria-current]{color:var(--navy-ink);font-weight:700}
.art-label{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 16px;margin-bottom:18px;
  background:#fff;border:1px solid #dfe6f2;border-radius:999px;
  color:var(--blue-strong);font-size:13px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;
  box-shadow:var(--shadow-sm);
}
.art-h1{
  color:var(--navy-ink);
  font-size:clamp(30px,4vw,48px);font-weight:800;line-height:1.14;letter-spacing:-.01em;
  margin-bottom:clamp(16px,2vw,22px);
}
.art-lead{
  color:var(--body);
  font-size:clamp(16px,1.5vw,20px);line-height:1.65;
  max-width:68ch;
  margin-bottom:clamp(16px,2vw,22px);
}
.art-meta{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  color:var(--body);font-size:14px;font-weight:600;
}
.art-meta svg{width:17px;height:17px;color:var(--blue);flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.art-hero__media{
  margin-top:clamp(28px,3.4vw,44px);
  border-radius:var(--r-lg);
  overflow:hidden;
  box-shadow:var(--shadow-lg);
}
.art-hero__media img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}

.art-section{padding:clamp(40px,4.6vw,64px) 0;background:#fff}
.art-narrow{max-width:760px;margin-inline:auto}
.art-narrow p{color:var(--body);font-size:clamp(15px,1.08vw,17px);line-height:1.75;margin-bottom:18px;max-width:72ch}
.art-narrow > p a,
.usecase__row a,
.art-sources a{color:var(--blue);font-weight:700;text-decoration:underline;text-underline-offset:2px}
.art-narrow > p a:hover,
.usecase__row a:hover,
.art-sources a:hover{color:var(--blue-strong)}
.art-narrow h2{
  color:var(--navy-ink);font-size:clamp(22px,2.1vw,30px);font-weight:800;line-height:1.28;
  margin:clamp(40px,4.2vw,58px) 0 16px;
}
.art-narrow > h2:first-child{margin-top:0}
.art-narrow h3{color:var(--navy-ink);font-size:clamp(17px,1.35vw,19px);font-weight:800;line-height:1.35;margin-bottom:8px}
.art-narrow ul{margin:0 0 18px;padding-left:0;list-style:none}
.art-narrow ul li{
  position:relative;padding-left:26px;margin-bottom:10px;
  color:var(--body);font-size:clamp(15px,1.08vw,17px);line-height:1.65;max-width:72ch;
}
.art-narrow ul li::before{
  content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;border-radius:2px;
  background:var(--gold);
}
.art-narrow ol.art-steps{margin:0 0 18px;padding-left:0;list-style:none;counter-reset:art-step}
.art-steps li{
  counter-increment:art-step;
  position:relative;padding-left:40px;margin-bottom:16px;
  color:var(--body);font-size:clamp(15px,1.08vw,17px);line-height:1.65;max-width:72ch;
}
.art-steps li::before{
  content:counter(art-step);
  position:absolute;left:0;top:0;
  display:grid;place-items:center;
  width:26px;height:26px;border-radius:50%;
  background:var(--blue);color:#fff;font-size:13px;font-weight:800;
}
.art-steps strong{color:var(--navy-ink)}

/* ---- Sommaire ---- */
.art-toc{
  margin:clamp(28px,3vw,40px) 0 clamp(8px,1vw,12px);
  padding:clamp(20px,2.4vw,28px) clamp(22px,2.6vw,30px);
  background:#f4f7fc;border:1px solid #e5eaf3;border-radius:var(--r-md);
}
.art-toc__title{
  color:var(--navy-ink);font-size:15px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;
  margin-bottom:14px;
}
.art-toc ol{margin:0;padding:0;list-style:none;columns:1;column-gap:28px}
.art-toc li{margin-bottom:9px;break-inside:avoid}
.art-toc a{
  color:var(--blue-strong);font-weight:700;font-size:14.5px;line-height:1.4;
  text-decoration:none;
}
.art-toc a:hover{text-decoration:underline}
@media (min-width:701px){
  .art-toc ol{columns:2}
}

/* ---- Cas d'usage ---- */
.usecases{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:16px}
.usecase{
  padding:clamp(20px,2.4vw,28px) clamp(20px,2.6vw,30px);
  background:#fafbfd;border:1px solid #e9edf5;border-left:4px solid var(--gold);
  border-radius:0 var(--r-md) var(--r-md) 0;
}
.usecase__head{display:flex;align-items:baseline;gap:12px;margin-bottom:12px}
.usecase__num{
  flex:0 0 auto;color:var(--blue);font-size:15px;font-weight:800;
  font-variant-numeric:tabular-nums;
}
.usecase__row{padding:8px 0;border-top:1px solid #e9edf5}
.usecase__row:first-of-type{border-top:0;padding-top:0}
.usecase__label{
  display:block;color:var(--navy-ink);font-size:12.5px;font-weight:800;
  text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px;
}
.usecase__row p{color:var(--body);font-size:clamp(14.5px,1.02vw,16px);line-height:1.6;margin:0;max-width:none}
.usecase__row--vigilance .usecase__label{color:#a3721c}

/* ---- CTA intermédiaire ---- */
.art-cta-mid{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;
  margin:clamp(28px,3vw,40px) 0;
  padding:clamp(20px,2.2vw,26px) clamp(22px,2.6vw,30px);
  background:#eef3fc;border:1px solid #dbe4f5;border-radius:var(--r-md);
}
.art-cta-mid p{margin:0;color:var(--navy-ink);font-size:clamp(14.5px,1.05vw,16.5px);font-weight:600;line-height:1.5;max-width:52ch}
.art-cta-mid .btn{flex:0 0 auto}

/* ---- Section navy de rythme ---- */
.art-navy{
  padding:clamp(48px,5vw,72px) 0;
  color:#fff;
  background:linear-gradient(150deg,#0b2150 0%,#091c44 60%,#071634 100%);
}
.art-navy .art-narrow h2{color:#fff}
.art-navy .art-narrow h3{color:#fff}
.art-navy .art-narrow p{color:rgba(255,255,255,.86)}
.art-navy .art-narrow a{color:var(--gold-soft);font-weight:700}
.art-navy .art-narrow ul li,
.art-navy .art-narrow .art-steps li{color:rgba(255,255,255,.86)}
.art-navy .art-narrow .btn--gold{color:var(--navy-ink)}

.art-subcards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:24px 0}
.art-subcard{padding:clamp(18px,2vw,24px) clamp(18px,2.2vw,26px);background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:var(--r-md)}
.art-subcard h3{margin-bottom:8px;font-size:clamp(16px,1.3vw,18.5px)}
.art-subcard p{margin-bottom:18px;font-size:clamp(13.5px,1vw,15.5px)}
@media (max-width:640px){.art-subcards{grid-template-columns:1fr}}

/* ---- CTA final ---- */
.art-cta-final{
  margin-top:clamp(28px,3vw,40px);
  padding:clamp(32px,3.6vw,48px) clamp(26px,3.2vw,42px);
  background:linear-gradient(150deg,#1f63dd 0%,#1450c8 38%,#0b2a7c 100%);
  border-radius:var(--r-lg);
  color:#fff;text-align:center;
  box-shadow:var(--shadow-lg);
}
.art-cta-final__title{font-size:clamp(22px,2.4vw,30px);font-weight:800;margin-bottom:14px}
.art-cta-final__text{color:rgba(255,255,255,.88);font-size:clamp(14.5px,1.1vw,17px);line-height:1.6;max-width:56ch;margin-inline:auto 0;margin-bottom:26px}
.art-cta-final__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.art-cta-final .btn--link{color:#fff}

/* ---- Sources ---- */
.art-sources{
  margin-top:clamp(32px,3.4vw,44px);
  padding-top:clamp(24px,2.6vw,32px);
  border-top:1px solid #e5eaf3;
}
.art-sources__title{color:var(--navy-ink);font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;margin-bottom:14px}
.art-sources ul{list-style:none;margin:0;padding:0}
.art-sources li{color:var(--body);font-size:13.5px;line-height:1.6;margin-bottom:10px;max-width:72ch}
.art-sources strong{color:var(--navy-ink)}

.art-media-inline{margin:clamp(28px,3vw,40px) 0;border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-md)}
.art-media-inline img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.art-media-inline figcaption{padding:12px 18px;background:#f4f7fc;color:var(--body);font-size:13px;text-align:center}

@media (max-width:640px){
  .art-h1{font-size:clamp(27px,7.4vw,34px)}
  .art-lead{font-size:15.5px}
  .usecase{border-left-width:3px}
  .art-cta-mid{flex-direction:column;align-items:flex-start}
  .art-cta-final__actions{flex-direction:column;align-items:stretch}
  .art-cta-final__actions .btn{justify-content:center}
}

/* ---- Bloc éditorial "à lire" (silo blog ↔ formations) ---- */
.blog-teaser{padding:0 0 clamp(40px,4.2vw,60px);background:#fff}
.blog-teaser__inner{
  max-width:820px;margin-inline:auto;
  display:flex;align-items:flex-start;gap:18px;flex-wrap:wrap;
  padding:clamp(22px,2.6vw,30px);
  background:#f4f7fc;border:1px solid #e5eaf3;border-radius:var(--r-md);
}
.blog-teaser__icon{
  flex:0 0 auto;display:grid;place-items:center;
  width:44px;height:44px;border-radius:50%;
  background:#fff;color:var(--blue);box-shadow:var(--shadow-sm);
}
.blog-teaser__icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.blog-teaser__body{flex:1 1 260px;min-width:0}
.blog-teaser__title{color:var(--navy-ink);font-size:clamp(16px,1.3vw,19px);font-weight:800;line-height:1.3;margin-bottom:8px}
.blog-teaser p{margin:0 0 14px;color:var(--body);font-size:14.5px;line-height:1.6;max-width:60ch}
.blog-teaser__link{
  display:inline-flex;align-items:center;gap:10px;
  color:var(--blue);font-weight:700;font-size:14.5px;
}
.blog-teaser__link svg{width:20px;height:20px;stroke-width:2.4;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s var(--ease)}
.blog-teaser__link:hover svg{transform:translateX(4px)}

/* =========================================================================
   PAGE BLOG : liste des articles
   ========================================================================= */
.blog-liste{padding:clamp(48px,5.2vw,76px) 0 clamp(72px,7vw,110px);background:#fff}
.blog-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(22px,2.4vw,32px);
  max-width:1000px;margin-inline:auto;
  list-style:none;padding:0;
}
.blog-card__link{
  display:flex;flex-direction:column;height:100%;
  background:#fff;border:1px solid #e5eaf3;border-radius:var(--r-md);
  box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}
.blog-card__link:hover{transform:translateY(-6px);box-shadow:var(--shadow-md)}
.blog-card__photo{display:block;overflow:hidden;aspect-ratio:4/3;border-radius:var(--r-md) var(--r-md) 0 0}
.blog-card__photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.blog-card__link:hover .blog-card__photo img{transform:scale(1.05)}
.blog-card__body{display:flex;flex-direction:column;flex:1;padding:clamp(20px,2.2vw,28px)}
.blog-card__meta{color:var(--blue);font-size:12.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px}
.blog-card__titre{color:var(--navy-ink);font-size:clamp(17px,1.5vw,20px);font-weight:800;line-height:1.3;margin-bottom:10px}
.blog-card__texte{color:var(--body);font-size:14.5px;line-height:1.6;margin-bottom:18px;flex:1}
.blog-card__cta{display:inline-flex;align-items:center;gap:8px;color:var(--blue);font-weight:700;font-size:14.5px}
.blog-card__cta svg{width:19px;height:19px;stroke-width:2.4;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s var(--ease)}
.blog-card__link:hover .blog-card__cta svg{transform:translateX(4px)}

@media (max-width:700px){
  .blog-grid{grid-template-columns:1fr;max-width:560px}
}

/* ===================== LANDING — FORMATION IA ENTREPRISE ===================== */
.lp-h2{color:var(--navy-ink);font-size:clamp(22px,2.4vw,32px);font-weight:800;line-height:1.3;text-align:center;margin-bottom:14px}
.lp-h2--left{text-align:left}

/* Points de navigation des carrousels mobiles (voir carrousel() dans main.js) : masqués tant que la grille n'est pas devenue un carrousel */
.lp-carousel-ui{display:none;margin-top:18px}
@media (max-width:640px){.lp-carousel-ui{display:block}}

/* ---- Hero ---- */
.lp-hero{
  position:relative;isolation:isolate;overflow:hidden;
  padding:calc(var(--header-h) + clamp(40px,4.4vw,68px)) 0 clamp(56px,6vw,96px);
  color:#fff;
  background:linear-gradient(150deg,#0b2048 0%,#081a38 55%,#061228 100%);
}
.lp-hero__media{position:absolute;inset:0;z-index:-1}
.lp-hero__media img{
  width:100%;height:100%;object-fit:cover;object-position:82% 38%;
  filter:brightness(.5) saturate(.65);
  -webkit-mask-image:linear-gradient(100deg,#000 0%,#000 55%,rgba(0,0,0,.85) 64%,rgba(0,0,0,.3) 80%,transparent 97%);
  mask-image:linear-gradient(100deg,#000 0%,#000 55%,rgba(0,0,0,.85) 64%,rgba(0,0,0,.3) 80%,transparent 97%);
}
.lp-hero__inner{position:relative;max-width:700px}
.lp-hero__kicker{display:block;color:rgba(255,255,255,.78);font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:clamp(12px,.95vw,14px);margin-bottom:16px}
.lp-hero__title{font-size:clamp(30px,3.6vw,46px);font-weight:800;line-height:1.18;margin-bottom:20px}
.lp-hero__lead{color:rgba(255,255,255,.86);font-size:clamp(15px,1.15vw,18px);line-height:1.65;max-width:56ch;margin-bottom:32px}
.lp-hero__actions{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:36px}
.lp-hero__btn-outline{
  display:inline-flex;align-items:center;gap:12px;
  padding:14px 26px;border-radius:999px;
  border:1.5px solid rgba(255,255,255,.55);background:rgba(255,255,255,.06);
  color:#fff;font-weight:700;font-size:clamp(14.5px,1.05vw,16.5px);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  transition:transform .2s var(--ease),background .2s var(--ease);
}
.lp-hero__btn-outline:hover{transform:translateY(-2px);background:rgba(255,255,255,.14)}
.lp-hero__btn-outline svg{width:20px;height:20px;stroke-width:2.4;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.lp-hero__checks{display:flex;flex-wrap:wrap;align-items:center;gap:18px 0;list-style:none;margin:0;padding:0}
.lp-hero__check{
  display:flex;align-items:center;gap:10px;
  color:#fff;font-size:clamp(12.5px,.92vw,14.5px);font-weight:600;
  padding-right:20px;margin-right:20px;border-right:1px solid rgba(255,255,255,.28);
}
.lp-hero__check:last-child{border-right:0;padding-right:0;margin-right:0}
.lp-hero__check svg{width:20px;height:20px;flex:0 0 auto;color:var(--gold);stroke-width:2.3;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:900px){
  .lp-hero__media img{object-position:70% 40%}
}
@media (max-width:640px){
  .lp-hero__media img{
    object-position:60% 32%;
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 55%,rgba(0,0,0,.4) 80%,transparent 100%);
    mask-image:linear-gradient(180deg,#000 0%,#000 55%,rgba(0,0,0,.4) 80%,transparent 100%);
  }
  .lp-hero__actions{margin-bottom:24px}
  .lp-hero__check{border-right:0;padding-right:0;margin-right:0;width:50%}
}

/* ---- Pourquoi former vos collaborateurs ---- */
.lp-pourquoi{padding:clamp(50px,5.2vw,80px) 0;background:#fff}
.lp-pourquoi__intro{max-width:700px;margin:0 auto clamp(30px,3.4vw,46px);color:var(--body);font-size:clamp(14.5px,1.05vw,16.5px);line-height:1.7;text-align:center}
.lp-reasons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2vw,28px)}
.lp-reason{text-align:center}
.lp-reason__icon{width:60px;height:60px;margin:0 auto 18px;border-radius:50%;background:var(--page);display:flex;align-items:center;justify-content:center;color:var(--blue)}
.lp-reason__icon svg{width:26px;height:26px;stroke-width:2;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.lp-reason__title{color:var(--navy-ink);font-size:clamp(15.5px,1.1vw,17.5px);font-weight:800;margin-bottom:8px}
.lp-reason__text{color:var(--body);font-size:13.8px;line-height:1.6}
@media (max-width:900px){.lp-reasons{grid-template-columns:repeat(2,1fr);row-gap:32px}}
/* En dessous de 640px, la grille devient un carrousel défilant (voir carrousel() dans main.js) */
@media (max-width:640px){
  .lp-reasons__piste{overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:6px}
  .lp-reasons__piste::-webkit-scrollbar{display:none}
  .lp-reasons{display:flex;gap:14px;width:max-content}
  .lp-reason{scroll-snap-align:center;flex:0 0 76vw;max-width:280px;text-align:left;background:#fff;border:1px solid #e5eaf3;border-radius:var(--r-md);padding:20px;box-shadow:var(--shadow-sm)}
  .lp-reason__icon{margin:0 0 14px}
}

/* ---- Des formations concrètes (bandeau sombre) ---- */
.lp-usages{padding:clamp(48px,5vw,74px) 0;color:#fff;background:linear-gradient(150deg,#0b2150 0%,#091c44 60%,#071634 100%)}
.lp-usages__grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(28px,4vw,54px);align-items:center}
.lp-usages__title{font-size:clamp(22px,2.2vw,28px);font-weight:800;line-height:1.3;margin-bottom:14px}
.lp-usages__text{color:rgba(255,255,255,.82);font-size:clamp(14px,1.02vw,16px);line-height:1.65}
.lp-usages__tags{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.lp-usages__tag{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:16px 8px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--r-md);transition:transform .25s var(--ease),background .25s var(--ease)}
.lp-usages__tag:hover{transform:translateY(-3px);background:rgba(255,255,255,.1)}
.lp-usages__tag svg{width:22px;height:22px;color:var(--gold-soft);stroke-width:2;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.lp-usages__tag span{font-size:12px;font-weight:700;line-height:1.3;color:rgba(255,255,255,.92)}
@media (max-width:900px){
  .lp-usages__grid{grid-template-columns:1fr}
  .lp-usages__tags{grid-template-columns:repeat(2,1fr)}
}
/* En dessous de 640px, les tags deviennent un carrousel défilant (voir carrousel() dans main.js) */
@media (max-width:640px){
  .lp-usages__piste{overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:6px}
  .lp-usages__piste::-webkit-scrollbar{display:none}
  .lp-usages__tags{display:flex;gap:12px;width:max-content}
  .lp-usages__tag{scroll-snap-align:center;flex:0 0 150px}
  .lp-usages .dots button{background:rgba(255,255,255,.3)}
  .lp-usages .dots button:hover{background:rgba(255,255,255,.5)}
  .lp-usages .dots button[aria-current="true"]{background:var(--gold)}
}

/* ---- Choisissez le niveau (cartes formation) ---- */
.lp-niveaux{padding:clamp(52px,5.4vw,86px) 0;background:#fff}
.lp-niveaux__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(22px,2.6vw,32px)}
.lp-niveau{display:grid;grid-template-columns:minmax(0,1fr) 150px;background:#fff;border-radius:var(--r-lg);box-shadow:var(--shadow-md);overflow:hidden}
.lp-niveau__body{padding:clamp(20px,2.2vw,28px)}
.lp-niveau__badge{display:inline-block;padding:5px 14px;border-radius:99px;font-size:11.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;margin-bottom:14px}
.lp-niveau__badge--initiation{background:#e9effb;color:var(--blue)}
.lp-niveau__badge--expertise{background:var(--gold);color:var(--navy-ink)}
.lp-niveau__title{color:var(--navy-ink);font-size:clamp(17.5px,1.4vw,21px);font-weight:800;line-height:1.32;margin-bottom:14px}
.lp-niveau__meta{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:14px;color:var(--body);font-size:13px;font-weight:700}
.lp-niveau__meta span{display:inline-flex;align-items:center;gap:6px}
.lp-niveau__meta svg{width:15px;height:15px;stroke-width:2.2;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.lp-niveau__text{color:var(--body);font-size:13.8px;line-height:1.6;margin-bottom:16px}
.lp-niveau__points{list-style:none;margin:0 0 22px;padding:0;display:flex;flex-direction:column;gap:7px}
.lp-niveau__points li{display:flex;gap:8px;color:var(--navy-ink);font-size:13.3px;line-height:1.5}
.lp-niveau__points svg{width:16px;height:16px;flex:0 0 auto;color:var(--blue);stroke-width:2.6;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
.lp-niveau__media{align-self:stretch}
.lp-niveau__media img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:900px){.lp-niveaux__grid{grid-template-columns:1fr}}
/* En dessous de 640px, les 2 cartes deviennent un carrousel défilant, une carte à la fois (voir carrousel() dans main.js) */
@media (max-width:640px){
  .lp-niveau{grid-template-columns:1fr}
  .lp-niveau__media{order:-1;aspect-ratio:16/9}
  .lp-niveaux__piste{overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:6px}
  .lp-niveaux__piste::-webkit-scrollbar{display:none}
  .lp-niveaux__grid{display:flex;gap:16px;width:max-content}
  .lp-niveau{scroll-snap-align:center;flex:0 0 86vw;max-width:360px}
}

/* ---- Une formation adaptée aux besoins de votre entreprise ---- */
.lp-adapter{padding:clamp(52px,5.4vw,86px) 0;background:var(--page)}
.lp-adapter__grid{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1fr) minmax(0,1.25fr);gap:clamp(24px,3.2vw,44px);align-items:center}
.lp-adapter__media{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-md);aspect-ratio:4/5}
.lp-adapter__media img{width:100%;height:100%;object-fit:cover;display:block}
.lp-adapter__title{color:var(--navy-ink);font-size:clamp(20px,2vw,25px);font-weight:800;line-height:1.3;margin-bottom:14px}
.lp-adapter__text{color:var(--body);font-size:clamp(13.5px,1vw,15.5px);line-height:1.65;margin-bottom:14px}
.lp-adapter__items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 22px}
.lp-adapter__item-icon{color:var(--blue);margin-bottom:6px}
.lp-adapter__item-icon svg{width:20px;height:20px;stroke-width:2.2;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.lp-adapter__item-title{color:var(--navy-ink);font-weight:800;font-size:13.5px;margin-bottom:4px}
.lp-adapter__item-text{color:var(--body);font-size:12.8px;line-height:1.5}
@media (max-width:1000px){.lp-adapter__grid{grid-template-columns:1fr;gap:28px}.lp-adapter__media{max-width:320px;margin-inline:auto}}
@media (max-width:520px){.lp-adapter__items{grid-template-columns:1fr}}

/* ---- Trio : public / méthode / ressources ---- */
.lp-trio{padding:clamp(48px,5vw,74px) 0 0;background:#fff}
.lp-trio__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,3.4vw,44px)}
.lp-trio__col h3{color:var(--navy-ink);font-size:clamp(16px,1.25vw,19px);font-weight:800;line-height:1.32;margin-bottom:18px}

.lp-public__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px;margin-bottom:18px}
.lp-public__item{display:flex;align-items:center;gap:8px;color:var(--navy-ink);font-size:13px;font-weight:700}
.lp-public__item svg{width:18px;height:18px;color:var(--blue);stroke-width:2.2;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.lp-public__note{display:flex;align-items:flex-start;gap:10px;padding:13px 16px;background:var(--page);border-radius:var(--r-md);color:var(--body);font-size:12.8px;line-height:1.5}
.lp-public__note svg{width:17px;height:17px;color:var(--blue);flex:0 0 auto;margin-top:1px;stroke-width:2.2;fill:none;stroke:currentColor}

.lp-methode__liste{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:14px}
.lp-methode__label{display:block;color:var(--blue);font-weight:800;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:4px}
.lp-methode__text{color:var(--body);font-size:13.3px;line-height:1.55}
.lp-methode__link{display:inline-flex;align-items:center;gap:8px;color:var(--blue);font-weight:700;font-size:13.8px}
.lp-methode__link svg{width:18px;height:18px;stroke-width:2.3;transition:transform .2s var(--ease)}
.lp-methode__link:hover svg{transform:translateX(4px)}

.lp-articles__liste{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.lp-article{display:flex;gap:12px;align-items:flex-start}
.lp-article__photo{flex:0 0 auto;width:64px;height:64px;border-radius:12px;overflow:hidden}
.lp-article__photo img{width:100%;height:100%;object-fit:cover;display:block}
.lp-article__eyebrow{display:block;color:var(--blue);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px}
.lp-article__titre{display:block;color:var(--navy-ink);font-size:13.5px;font-weight:800;line-height:1.35;margin-bottom:5px}
.lp-article__cta{display:inline-flex;align-items:center;gap:5px;color:var(--blue);font-weight:700;font-size:12.5px}
.lp-article__cta svg{width:15px;height:15px;stroke-width:2.4}

@media (max-width:900px){.lp-trio__grid{grid-template-columns:1fr;gap:36px}}

/* ---- FAQ (grille 2 colonnes) ---- */
.lp-faq{padding:clamp(40px,4.2vw,60px) 0 clamp(56px,5.6vw,84px);background:#fff}
.lp-faq__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:760px){.lp-faq__grid{grid-template-columns:1fr}}

/* ---- CTA final ---- */
.lp-cta-final{padding:clamp(42px,4.6vw,64px) 0;color:#fff;text-align:center;background:linear-gradient(150deg,#0b2150 0%,#091c44 60%,#071634 100%)}
.lp-cta-final__title{font-size:clamp(22px,2.4vw,30px);font-weight:800;margin-bottom:12px}
.lp-cta-final__text{color:rgba(255,255,255,.86);font-size:clamp(14px,1.05vw,16.5px);line-height:1.6;max-width:56ch;margin:0 auto 26px}
.lp-cta-final__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.lp-cta-final .btn--link{color:#fff}

/* ---- Mobile uniquement : sections resserrées pour raccourcir la page (desktop/tablette non modifiés) ---- */
@media (max-width:640px){
  .lp-pourquoi{padding:32px 0}
  .lp-pourquoi__intro{margin-bottom:24px}
  .lp-usages{padding:32px 0}
  .lp-niveaux{padding:34px 0}
  .lp-adapter{padding:34px 0}
  .lp-trio{padding:32px 0 0}
  .lp-trio__grid{gap:26px}
  .lp-faq{padding:26px 0 40px}
  .lp-cta-final{padding:30px 0}
}