:root{--primaire:#0f3c66;
    --primaire-2:#155692;
    --bouton:#103f6b;
    --bleu:#2792fa;
    --bleu-clair:#b1d9ff;
    --bleu-clair-01:#f6fbff;
    --nav-top:#e6f3ff;
    --nav-under:#f8f7f2;
    --beige:#edebdf;
    --inscription:#d9ecff;
    --jaune:#ffc614;
    --actif:#ff5400;
    --texte:#000;
    --gris:#8e8e8f;
    --container:1110px;}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Poppins",system-ui,sans-serif;color:var(--texte);background:#fff;font-size:12px;font-weight:500;line-height:1.5}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.container{width:100%;max-width:calc(var(--container) + 32px);margin:0 auto;padding:0 16px}
.h2{font-size:24px;font-weight:400;color:var(--bleu);line-height:1.5}
.label{display:flex;align-items:center;gap:15px;color:var(--bleu);font-size:12px;font-weight:500}
.label::before{content:"";width:8px;height:18px;border-radius:20px;background:var(--bleu);flex:none}
.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}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--actif);outline-offset:2px}
/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 15px;border-radius:5px;font-family:inherit;font-size:18px;font-weight:400;line-height:1.5;cursor:pointer;border:2px solid var(--bouton);transition:background .2s,color .2s;white-space:nowrap}
.btn-primary{background:var(--bouton);color:#fff}
.btn-primary:hover{background:var(--primaire-2);border-color:var(--primaire-2)}
.btn-secondary{background:transparent;color:var(--bouton)}
.btn-secondary:hover{background:var(--bouton);color:#fff}
.btn-sm{font-size:15px;padding:5px 15px}
.btn-blue{background:#0f60ab;border-color:#0f60ab;color:#fff}
.btn-blue:hover{background:#3a71a3;border-color:#3a71a3}
.btn-light{background:#fff;color:var(--bouton);border-color:#fff}
.btn-light:hover{background:var(--bleu-clair);border-color:var(--bleu-clair)}
/* ===== Navigation (identique à l’accueil) ===== */
main{display:flex;flex-direction:column;gap:45px}
/* ===== Fil d’Ariane ===== */
.ariane{background:#f7fbff;padding:12px 0}
.ariane ol{display:flex;flex-wrap:wrap;gap:12px;list-style:none;font-weight:600;font-size:15px;letter-spacing:.02em;color:var(--primaire)}
.ariane li+li::before{content:"/";margin-right:12px;color:var(--gris)}
.ariane a:hover{color:var(--actif)}
/* ===== Hero catégorie ===== */
.hero{position:relative;overflow:hidden;background:linear-gradient(120deg,#0f3c66 0%,#124a7d 60%,#155692 100%);color:#fff;padding:60px 0 64px}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(177,217,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(177,217,255,.07) 1px,transparent 1px);background-size:32px 32px}
.hero .container{display:flex;align-items:center;justify-content:space-between;gap:40px}
.hero-illu{flex:0 0 420px;max-width:420px}
.hero-illu svg{width:100%;height:auto;display:block}
.hero .container{position:relative}
.hero-content{max-width:640px}
.kicker{font-size:14px;letter-spacing:.02em;color:var(--bleu-clair);margin-bottom:8px}
.hero h1{font-size:35px;font-weight:400;line-height:1.3}
.hero .desc{font-size:14px;margin-top:14px;max-width:580px}
.hero-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;list-style:none}
.hero-meta li{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);border:1px solid rgba(177,217,255,.4);border-radius:7px;padding:5px 10px;font-size:12px}
.hero-meta svg{width:16px;height:16px;flex:none}
.hero .btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero .btn-secondary{color:#fff;border-color:#fff}
.hero .btn-secondary:hover{background:#fff;color:var(--bouton)}
/* ===== Navigation interne (sous-catégories) ===== */
.souscat{position:sticky;top:0;z-index:5;background:#fff;border-bottom:1px solid rgba(39,146,250,.25);margin-top:-45px}
.souscat ul{display:flex;gap:6px;list-style:none;padding:12px 0;overflow-x:auto;scrollbar-width:thin}
.souscat a{display:block;white-space:nowrap;background:var(--primaire-2);color:#fff;border-radius:7px;padding:5px 12px;font-size:13px;transition:background .2s}
.souscat a:hover{background:var(--bleu)}
.souscat a small{opacity:.75;font-size:11px;margin-left:4px}
/* ===== Intro + parcours ===== */
.intro{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
.intro p{font-size:13px;margin-top:8px}
.intro p + p{margin-top:10px}
.intro ul.pour{list-style:none;margin-top:12px;display:flex;flex-direction:column;gap:8px}
.intro ul.pour li{display:flex;gap:10px;font-size:13px}
.intro ul.pour li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--bleu);margin-top:6px;flex:none}
.parcours{background:var(--bleu-clair-01);border:1px solid var(--bleu);border-radius:30px;padding:20px 25px}
.parcours h2{font-size:20px;font-weight:500;color:var(--primaire);margin-bottom:12px}
.parcours ol{list-style:none;display:flex;flex-direction:column;gap:10px;counter-reset:etape}
.parcours li{counter-increment:etape;display:flex;gap:14px;align-items:flex-start;background:rgba(177,217,255,.3);border-radius:18px;padding:12px 16px}
.parcours li::before{content:"0" counter(etape);font-size:26px;font-weight:400;color:var(--primaire-2);line-height:1}
.parcours strong{display:block;font-size:14px;font-weight:600}
.parcours span{font-size:12px}
.parcours a{color:var(--primaire-2);text-decoration:underline}
/* ===== Liste des formations ===== */
.catalogue-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.filtres{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.filtres span{font-size:12px;color:var(--gris);margin-right:4px}
.filtres button{font:500 12px "Poppins",sans-serif;background:#fff;border:1px solid var(--bleu);color:var(--primaire);border-radius:20px;padding:4px 12px;cursor:pointer}
.filtres button[aria-pressed="true"]{background:var(--primaire);border-color:var(--primaire);color:#fff}
.groupe{scroll-margin-top:70px;margin-top:30px}
.groupe-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;border-bottom:3px solid var(--primaire);padding-bottom:6px;margin-bottom:15px}
.groupe-head h3{font-size:21px;font-weight:500;color:var(--primaire)}
.groupe-head p{font-size:12px;color:#333;max-width:520px;text-align:right}
.cours{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;list-style:none}
.card{background:#fff;border:1px solid var(--bleu);border-radius:15px;padding:14px 12px;display:flex;flex-direction:column;gap:10px;transition:box-shadow .2s,transform .2s}
.card:hover{box-shadow:0 6px 18px rgba(15,60,102,.14);transform:translateY(-2px)}
.tag{display:flex;align-items:center;gap:5px;background:rgba(177,217,255,.2);border-radius:5px;padding:4px 10px;font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;align-self:flex-start}
.tag::before{content:"";width:5px;height:16px;border-radius:10px;background:var(--primaire-2)}
.tag.ia::before{background:var(--actif)}
.card h4{font-size:15px;font-weight:500;line-height:1.35}
.card h4 a:hover{color:var(--primaire-2)}
.card p{font-family:"Inter",sans-serif;font-weight:400;font-size:12px;color:#222;flex:1}
.card .infos{display:flex;flex-wrap:wrap;gap:6px}
.card .infos span{display:inline-flex;align-items:center;gap:5px;border:1px solid rgba(39,146,250,.35);background:rgba(177,217,255,.2);border-radius:10px;padding:3px 9px;font-size:11px;letter-spacing:.04em}
.card .infos svg{width:13px;height:13px}
.card .voir{align-self:flex-start;font-size:13px;font-weight:600;color:var(--primaire-2);display:inline-flex;align-items:center;gap:4px}
.card .voir:hover{color:var(--bleu)}
.card.cache{display:none}
.autres{margin-top:18px;font-size:13px}
.autres a{color:var(--primaire-2);text-decoration:underline}
.vide{display:none;font-size:13px;color:#333;margin-top:10px}
/* ===== Encadré formation d’équipe ===== */
.info{max-width:922px;margin:0 auto;width:100%;background:var(--bleu-clair-01);border:1px solid var(--bleu);border-radius:30px;padding:15px 25px 25px;display:flex;flex-direction:column;gap:20px}
.info .row{display:flex;gap:27px}
.info .ico{width:64px;height:64px;border-radius:8px;background:var(--bleu-clair);display:grid;place-items:center;flex:none;color:var(--primaire)}
.info .ico svg{width:36px;height:36px}
.info h2{font-size:15px;font-weight:600;margin-bottom:4px;color:var(--primaire-2)}
.info p,.info li{font-family:"Inter","Poppins",sans-serif;font-weight:400;font-size:12px;line-height:1.7}
.info ul{padding-left:18px;margin-top:4px}
.info .btns{display:flex;gap:10px;flex-wrap:wrap}
/* ===== Bandeau IA ===== */
.pub{background:var(--primaire);color:var(--bleu-clair)}
.pub .container{display:flex;align-items:center;gap:50px;min-height:202px}
.pub img{width:286px;height:202px;object-fit:cover;flex:none}
.pub .txt{flex:1;padding:15px 0}
.pub h2{font-size:30px;font-weight:600;line-height:1.3}
.pub p{font-size:16px;margin-top:12px;max-width:560px}
.pub .btn{border-color:var(--bleu-clair)}
/* ===== Pourquoi (bleu marine, style page formation) ===== */
.details{border-top:3px solid var(--primaire);border-bottom:3px solid var(--primaire);padding:5px 0}
.details-inner{background:var(--primaire);padding:20px 15px}
.details h2{font-weight:600;font-size:30px;text-transform:uppercase;color:var(--bleu-clair);margin-bottom:20px;letter-spacing:.03em;padding-left:15px}
.points{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 70px;padding:0 39px 10px;list-style:none}
.point-head{display:flex;align-items:center;gap:20px;color:var(--bleu-clair)}
.point-head .num{font-weight:300;font-size:35px;line-height:1.3}
.point-head h3{font-weight:500;font-size:19px;line-height:1.35}
.points p{font-size:12px;color:var(--beige);padding-left:65px;margin-top:4px}
/* ===== Formateurs ===== */
.head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.lien{display:flex;align-items:center;gap:5px}
.lien svg{width:24px;height:24px}
.lien:hover{color:var(--bleu)}
.trainers{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}
.card-form{background:rgba(177,217,255,.3);border-radius:25px;padding:15px;display:flex;align-items:center;gap:15px;transition:background .2s}
.card-form:hover{background:rgba(177,217,255,.55)}
.card-form img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none}
.card-form .txt{display:flex;flex-direction:column;gap:6px}
.card-form strong{font-size:21px;font-weight:500;line-height:1.3}
/* ===== Témoignage ===== */
.temoignage{border-top:1px solid var(--primaire);border-bottom:1px solid var(--primaire);padding:20px 0;display:grid;grid-template-columns:1fr 280px;gap:40px;align-items:center}
.temoignage blockquote p{font-size:20px;font-weight:400;line-height:1.5;color:var(--primaire)}
.temoignage figcaption{margin-top:12px;font-style:italic;color:var(--bleu)}
.temoignage .meta{display:flex;flex-direction:column;gap:6px;color:var(--bleu)}
.temoignage .meta strong{font-size:17px;font-weight:500}
.satisfaction{font-size:17px;color:var(--bleu);margin-top:10px}
.satisfaction a{text-decoration:underline}
/* ===== FAQ (style accueil) ===== */
.faq .list{display:flex;flex-direction:column;gap:10px;margin-top:10px}
.faq details{background:var(--bleu-clair-01);border:1px solid rgba(39,146,250,.35);border-radius:15px;padding:0 20px}
.faq summary{cursor:pointer;list-style:none;padding:16px 30px 16px 0;font-size:15px;font-weight:500;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:24px;color:var(--bleu);font-weight:400}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 0 16px;font-size:13px;max-width:900px}
.faq a{color:var(--primaire-2);text-decoration:underline}
/* ===== Autres domaines ===== */
.section-cat{background:var(--bleu-clair-01);border:1px solid var(--bleu);border-radius:30px;padding:25px;display:flex;flex-direction:column;gap:15px}
.cats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.card-cat{background:rgba(177,217,255,.3);border-radius:25px;padding:15px 25px;display:flex;flex-direction:column;gap:8px;transition:background .2s}
.card-cat:hover{background:rgba(177,217,255,.6)}
.card-cat p{font-size:20px;line-height:1.3}
.card-cat small{font-size:12px;color:#333;font-weight:400}
/* ===== Inscription ===== */
.inscription{background:var(--inscription);padding:84px 16px 76px;text-align:center}
.inscription h2{font-size:35px;font-weight:400;line-height:1.4}
.inscription p{font-size:14px;margin-top:10px}
.inscription .btns{display:flex;gap:25px;justify-content:center;flex-wrap:wrap;margin-top:36px}
/* ===== Pied de page (identique à l’accueil) ===== */
/* ===== Responsive ===== */
@media (max-width:1100px){
  .cours{grid-template-columns:repeat(3,1fr)}
  .points{padding:0 0 10px;gap:22px 40px}
}
@media (max-width:900px){
  .hero-illu{display:none}
  .intro{grid-template-columns:1fr;gap:25px}
  .cours{grid-template-columns:repeat(2,1fr)}
  .groupe-head{flex-direction:column;align-items:flex-start;gap:4px}
  .groupe-head p{text-align:left}
  .pub .container{flex-direction:column;align-items:flex-start;gap:16px;padding-top:24px;padding-bottom:24px}
  .pub img{width:100%;height:220px}
  .points{grid-template-columns:1fr}
  .trainers,.cats{grid-template-columns:1fr}
  .temoignage{grid-template-columns:1fr;gap:16px}
  .info .row{flex-direction:column;gap:12px}
  .hero h1,.inscription h2,.pub h2{font-size:28px}
}
@media (max-width:560px){
  .cours{grid-template-columns:1fr}
  .hero{padding:40px 0 48px}
  .hero h1{font-size:25px}
  .details h2{font-size:22px;padding-left:0}
  .points p{padding-left:0}
  .btn{font-size:15px;white-space:normal}
  .temoignage blockquote p{font-size:16px}
}