/* Page formation : réutilise les cartes du catalogue (style.css) et le ticket (fin.css) */

/* Hero : la carte du catalogue, en grand */
.f-hero{padding:24px 0 16px}
.f-hero-carte{background:var(--brume-2)}
.f-hero-carte:hover{transform:none;box-shadow:none}
.f-hero-carte .band{min-height:0;padding:48px 56px 64px}
.f-hero-carte .disc{width:460px;height:460px;right:-120px;top:-60px}
.f-hero-carte h1{font-size:clamp(34px,4.6vw,58px);line-height:1.04;max-width:760px}
.f-accroche{font-size:clamp(17px,1.6vw,20px);max-width:680px;opacity:.95}
.f-hero-carte .tag{margin-left:56px}
.f-hero-carte .body{padding:48px 56px 44px;gap:28px}
.f-resume{font-size:18px;font-weight:600;max-width:820px}
.f-promesse{font:700 clamp(20px,2.2vw,26px)/1.3 Poppins,Inter,sans-serif;color:var(--violet);max-width:820px;margin:0 0 12px}
.faits{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0;border-top:1px solid var(--filet);border-bottom:1px solid var(--filet)}
.faits div{padding:18px 20px 18px 0}
.faits div+div{padding-left:20px;border-left:1px solid var(--filet)}
.faits dt{font:500 11px/1.4 'JetBrains Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--violet);margin-bottom:6px}
.faits dd{margin:0;font-size:14.5px;font-weight:500}
.faits small{display:block;font-size:12px;color:var(--texte-2);font-weight:400}

/* Sections */
.f-sec{padding:72px 0 0}
.f-sec h2{font-size:clamp(26px,2.8vw,36px);margin-bottom:28px}
.f-sec .info h2{font-size:22px;margin-bottom:16px}
.puces{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.puces li{position:relative;padding-left:22px}
.puces li::before{content:"";position:absolute;left:0;top:.5em;width:9px;height:9px;border-radius:2px;background:var(--violet)}
/* Objectifs : tuiles de couleur */
.obj-tuiles{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.obj-tuiles li{border-radius:var(--r);padding:26px 26px 30px;display:flex;flex-direction:column;gap:22px;min-height:220px;position:relative;overflow:hidden;font-size:17px;font-weight:600;line-height:1.4}
.obj-tuiles li::after{content:"";position:absolute;right:-50px;top:-50px;width:140px;height:140px;border-radius:50%;opacity:.9}
.obj-tuiles b{font-size:44px;line-height:1;position:relative;z-index:1}
.obj-tuiles span{margin-top:auto;position:relative;z-index:1}
.obj-tuiles .c-violet{background:var(--violet);color:#fff}.obj-tuiles .c-violet::after{background:var(--violet-2)}
.obj-tuiles .c-peche{background:var(--peche)}.obj-tuiles .c-peche::after{background:var(--peche-2)}
.obj-tuiles .c-lavande{background:var(--lavande)}.obj-tuiles .c-lavande::after{background:var(--lavande-2)}
.obj-tuiles .c-encre{background:var(--encre);color:#fff}.obj-tuiles .c-encre::after{background:var(--violet)}
.obj-tuiles .c-violet b,.obj-tuiles .c-encre b{color:var(--peche)}
.grille-infos{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.info{background:var(--brume-2);border-radius:var(--r);padding:28px 30px}
.info h3{font-size:17px;margin-bottom:10px}
.info.large{grid-column:1/-1;background:var(--peche);font-size:17px}
.deux-cartes{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.info .lien-fleche{display:inline-block;margin-top:18px}

/* Programme en accordéon */
.seances{display:grid;gap:14px}
.seance{border:3px solid var(--encre);border-radius:24px;overflow:hidden}
.seance summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:64px 1fr auto 24px;gap:16px;align-items:center;padding:20px 26px;transition:background .3s}
.seance summary::-webkit-details-marker{display:none}
.seance summary:focus-visible{outline-offset:-7px}
.seance[open] summary:focus-visible{outline-color:#fff}
.seance summary::after{content:"+";font-size:26px;line-height:1;color:var(--violet);transition:rotate .25s var(--ease)}
.seance[open] summary{background:var(--violet);color:#fff}
.seance[open] summary::after{rotate:45deg;color:var(--peche)}
.s-num{font-weight:700;font-size:28px;color:var(--violet)}
.seance[open] .s-num{color:var(--peche)}
.s-titre{font-weight:700;font-size:19px}
.s-duree{font:500 12px/1 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase}
.s-corps{display:grid;grid-template-columns:1fr 1fr;gap:28px 40px;padding:28px 26px 30px 106px}
.s-corps h3{font-size:13px;text-transform:uppercase;letter-spacing:.08em;margin:0 0 12px;color:var(--texte-2)}
.s-idee{grid-column:1/-1;margin:0;font-weight:600;color:var(--violet);font-size:17px}
.s-mission{grid-column:1/-1;background:var(--peche);border-radius:16px;padding:16px 20px}
.s-mission b{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}

/* Encadrés */
.encadre-violet{background:var(--violet);color:#fff;border-radius:30px;padding:48px 56px;position:relative;overflow:hidden}
.encadre-violet::after{content:"";position:absolute;right:-80px;bottom:-120px;width:300px;height:300px;border-radius:50%;background:var(--violet-2)}
.encadre-violet>*{position:relative;z-index:1;max-width:720px}
.encadre-violet .label{color:#fff}
.encadre-violet p:not(.label){font-size:18px;margin-bottom:22px}
.lien-blanc{color:#fff;font-weight:600;text-decoration:none;border-bottom:2px solid var(--peche)}
.encadre-peche{background:var(--peche);border-radius:30px;padding:36px 44px}
.encadre-peche h2{font-size:22px;margin-bottom:10px}
.livrables{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.livrables li{border:3px solid var(--encre);border-radius:18px;padding:20px 22px 20px 56px;position:relative;font-weight:600}
.livrables li::before{content:"✓";position:absolute;left:18px;top:16px;width:26px;height:26px;border-radius:8px;background:var(--peche);display:grid;place-items:center;font-size:14px}
.prix-grand{font-size:22px;font-weight:700;line-height:1.35}
.petit{font-size:13px;color:var(--texte-2);margin-top:8px}
.f-faq-sec .f-faq{margin-top:0}
.fin-seule{padding:72px 0 24px}
.f3-corps h2{font-size:clamp(24px,2.4vw,32px);margin:0}
.rdv-mobile{display:none}
/* Prochaines sessions */
.ses-vide{font-size:18px;margin-bottom:22px}
.sessions{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:10px}
.sessions li{display:flex;flex-wrap:wrap;gap:6px 18px;border:3px solid var(--encre);border-radius:18px;padding:16px 22px}

@media (max-width:900px){
  .f-hero-carte .band,.f-hero-carte .body{padding-inline:24px}
  .f-hero-carte .tag{margin-left:24px}
  .faits,.obj-tuiles,.grille-infos,.deux-cartes,.s-corps{grid-template-columns:1fr}
  .faits div+div{padding-left:0;border-left:0;border-top:1px solid var(--filet)}
  .s-corps{padding:24px}
  .seance summary{grid-template-columns:44px 1fr 24px;padding:18px}
  .s-duree{display:none}
  .encadre-violet{padding:36px 26px}
  .obj-tuiles li{min-height:0}
  .rdv-mobile{display:flex;justify-content:center;position:fixed;left:16px;right:16px;bottom:16px;z-index:5;box-shadow:0 12px 30px -10px rgba(33,26,51,.5)}
}
.prog-pdf{margin-top:22px}

/* Mise en situation fictive (catalogue et fiches) : pièce d'entrée, sortie fausse, contrôle, pièce produite. */
.scene{border:3px solid var(--encre);border-radius:30px;padding:36px clamp(22px,4vw,48px) 40px;background:var(--brume-2)}
.scene-mention{display:inline-block;margin-bottom:18px;padding:7px 14px;border-radius:999px;background:var(--encre);color:#fff;font-weight:600;font-size:13px}
.scene h2{font-size:clamp(24px,2.6vw,34px)}
.scene-qui{margin-top:10px;font-weight:600;font-size:18px}
.scene-etapes{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;counter-reset:scene}
.scene-etapes li{counter-increment:scene;display:flex;flex-direction:column;gap:8px;padding:20px;background:#fff;border:1px solid var(--filet);border-radius:16px;font-size:15px;line-height:1.5}
.scene-etapes b{font-size:13px;color:var(--violet)}
.scene-etapes b::before{content:counter(scene) ". "}
/* L'erreur n'est pas signalée par la seule couleur : son intitulé le dit, et le texte est barré. */
.scene-etapes .scene-faux{border-color:var(--peche-2);background:#FFF4EE}
.scene-etapes .scene-faux b{color:#9A3E12}
.scene-etapes .scene-faux span{text-decoration:line-through;text-decoration-color:#9A3E12;text-decoration-thickness:2px}
.scene .btn{margin-top:26px}
.obj-preuves small{display:block;margin-top:10px;font-size:13px;line-height:1.45;opacity:.9}
.obj-preuves small i{display:block;font-style:normal;font-weight:700;font-size:11px;letter-spacing:.04em;text-transform:uppercase}
.f-version{margin-top:14px;font-size:13px;color:var(--texte-2)}
@media (max-width:900px){.scene-etapes{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.scene-etapes{grid-template-columns:1fr}}
