/* Voussoir Formation — feuille de style unique */
:root{
  --bleu:#32587c;
  --bleu-fonce:#23415e;
  --ocre:#c99332;
  --ocre-clair:#f3e3bf;
  --creme:#faf9f4;
  --pierre:#efebe1;
  --texte:#26313b;
  --gris:#5d6873;
  --trait:#ddd6c6;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--creme);color:var(--texte);font-family:var(--sans);font-size:17px;line-height:1.6}
img{max-width:100%;height:auto}
a{color:var(--bleu);text-underline-offset:3px}
a:hover{color:var(--bleu-fonce)}
a:focus-visible,button:focus-visible{outline:3px solid var(--ocre);outline-offset:2px}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:10}

/* En-tête */
header.site{background:#fff;border-bottom:1px solid var(--trait)}
header.site .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:76px;flex-wrap:wrap}
.marque{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--bleu)}
.marque img{width:52px;height:auto}
.marque span{font-family:var(--serif);font-size:1.45rem;line-height:1.1}
.marque small{display:block;font-family:var(--sans);font-size:.68rem;letter-spacing:.32em;text-transform:uppercase;color:var(--bleu)}
nav.principale ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 18px}
nav.principale a{text-decoration:none;color:var(--texte);font-size:.95rem;padding:6px 0;border-bottom:2px solid transparent}
nav.principale a:hover,nav.principale a[aria-current="page"]{color:var(--bleu);border-bottom-color:var(--ocre)}

/* Typo */
h1,h2,h3{font-family:var(--serif);color:var(--bleu);font-weight:600;line-height:1.2}
h1{font-size:2.1rem;margin:0 0 .4em}
h2{font-size:1.5rem;margin:1.8em 0 .5em}
h3{font-size:1.15rem;margin:1.4em 0 .4em}
.chapo{font-size:1.15rem;color:var(--gris);max-width:46em}
main{padding:40px 0 64px}
main p,main li{max-width:46em}

/* Accueil */
.hero{display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center;padding:24px 0 8px}
.hero img{width:100%;max-width:380px;justify-self:center}
.hero h1{font-size:2.4rem}
.bandeau{background:var(--pierre);border-left:4px solid var(--ocre);padding:18px 22px;margin:32px 0;border-radius:2px}
.bandeau p{margin:0}

/* Cartes */
.cartes{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:20px 0}
.carte{background:#fff;border:1px solid var(--trait);border-top:4px solid var(--bleu);padding:22px 24px;border-radius:2px;display:flex;flex-direction:column}
.carte h3{margin-top:0}
.carte .meta{font-size:.92rem;color:var(--gris);margin:0 0 12px}
.carte .plus{margin-top:auto;font-weight:600}

/* Fiche formation */
.fil{font-size:.9rem;color:var(--gris);margin-bottom:18px}
.resume{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--trait);border:1px solid var(--trait);margin:24px 0}
.resume div{background:#fff;padding:14px 16px}
.resume dt{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--gris)}
.resume dd{margin:2px 0 0;font-weight:600;color:var(--bleu-fonce)}
table{border-collapse:collapse;width:100%;max-width:46em;margin:12px 0 20px;background:#fff}
th,td{border:1px solid var(--trait);padding:10px 12px;text-align:left;vertical-align:top}
th{background:var(--pierre);font-weight:600}
td.num{text-align:center;font-weight:600;color:var(--bleu-fonce);white-space:nowrap}
.seq{border-left:3px solid var(--ocre-clair);padding-left:16px;margin:14px 0}
.seq h3{margin:0 0 4px;font-size:1.05rem}
.seq .duree{font-family:var(--sans);font-weight:400;color:var(--gris);font-size:.9rem}
.note{font-size:.92rem;color:var(--gris)}
.encadre{background:#fff;border:1px solid var(--trait);padding:18px 22px;margin:20px 0;max-width:46em}
.encadre h2,.encadre h3{margin-top:0}

/* Pied de page */
footer.site{background:var(--bleu-fonce);color:#e8edf2;font-size:.9rem;padding:36px 0 28px}
footer.site a{color:#fff}
footer.site .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px}
footer.site h2{color:#fff;font-size:1rem;margin:0 0 8px;font-family:var(--sans);text-transform:uppercase;letter-spacing:.1em}
footer.site ul{list-style:none;margin:0;padding:0}
footer.site li{margin:3px 0}
footer.site .legal{border-top:1px solid rgba(255,255,255,.2);margin-top:24px;padding-top:16px;font-size:.82rem;color:#c9d3dc}

@media (max-width:760px){
  body{font-size:16px}
  .hero{grid-template-columns:1fr}
  .hero img{max-width:240px;order:-1}
  .hero h1,h1{font-size:1.75rem}
  header.site .wrap{padding-top:10px;padding-bottom:10px}
  nav.principale ul{gap:2px 14px}
  table{font-size:.92rem}
  .resume{grid-template-columns:repeat(2,1fr)}
  th,td{padding:8px}
}
@media print{
  header.site nav,footer.site{display:none}
  body{background:#fff}
}

/* Bouton */
.bouton{display:inline-block;background:var(--bleu);color:#fff;text-decoration:none;padding:10px 20px;border-radius:3px;font-weight:600}
.bouton:hover{background:var(--bleu-fonce);color:#fff}
