:root{
  --trame-aefe:url("trame-aefe.png");
  --ink:#323232; --muted:#505050; --line:#cfcfcf; --bg:#ffffff; --paper:#ffffff;
  --grey:#e6e6e6; --dark:#323232;
  --blue:#0096c8; --blue-text:#00648a; --blue-soft:#eaf5fa;
  --perm:#323232; --perm-soft:#e6e6e6;
  --accent:#f0a03c; --accent-soft:#fdf3e3;
  --radius:4px;
  --f-body:Arial,Helvetica,sans-serif;
  --f-head:"PT Sans Narrow","Arial Narrow","Liberation Sans Narrow","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--grey);color:var(--ink);font:16px/1.55 var(--f-body)}
a{color:inherit}
:focus-visible{outline:3px solid #2a6fdb;outline-offset:2px}
#stage{padding:24px 12px 48px;display:flex;justify-content:center}
#site{container-type:inline-size;container-name:site;width:100%;max-width:1040px;background:var(--bg);box-shadow:0 2px 18px rgba(0,0,0,.18);transition:max-width .2s}
@media (max-width:700px){#stage{padding:0}#site{box-shadow:none}}
.top{background:var(--perm);color:#fff}
.top-in{display:flex;align-items:center;gap:16px;padding:12px 24px}
.brand{font-weight:650;font-size:18px;line-height:1.2}
.brand small{display:block;font-weight:400;font-size:12px;opacity:.85}
.menu-btn{display:none;margin-left:auto;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.6);border-radius:6px;padding:6px 10px;font:inherit;cursor:pointer}
.nav{background:#17304f;border-top:1px solid rgba(255,255,255,.12)}
.nav ul{list-style:none;margin:0;padding:0 16px;display:flex;flex-wrap:wrap}
.nav a{display:block;padding:11px 14px;color:#fff;text-decoration:none;font-size:15px;border-bottom:3px solid transparent}
.nav a:hover{background:rgba(255,255,255,.08)}
.nav a[aria-current="page"]{border-bottom-color:#fff;font-weight:600}
main{padding:24px}
.eyebrow{margin:0;font-size:13px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;color:var(--perm)}
h1{margin:4px 0 12px;font-size:32px;line-height:1.15;color:var(--perm)}
h1 .session{color:var(--annual);white-space:nowrap}
.intro{max-width:62ch;margin:0 0 24px}
.intro p{margin:0 0 8px}
.moment{background:var(--annual-soft);border:2px solid var(--annual-line);border-radius:var(--radius);padding:16px 18px;margin:0 0 32px}
.moment h2{margin:0 0 8px;font-size:17px;color:var(--annual);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.moment h2::before{content:"";width:14px;height:14px;border:2px solid var(--annual);border-radius:3px;border-top-width:5px}
.moment p{margin:0 0 8px}
.moment p:last-child{margin:0}
h2.sec{margin:0 0 14px;font-size:22px;color:var(--ink)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;list-style:none;margin:0 0 28px;padding:0}
.card{display:flex;flex-direction:column;height:100%;background:var(--paper);border:1px solid var(--line);border-top:5px solid var(--perm);border-radius:var(--radius);padding:16px 18px;text-decoration:none;transition:box-shadow .15s,transform .15s}
.card:hover{box-shadow:0 6px 18px rgba(31,58,95,.18);transform:translateY(-2px)}
.card h3{margin:0 0 6px;font-size:18px;line-height:1.25;color:var(--perm)}
.card p{margin:0 0 14px;color:var(--ink)}
.card .sess{display:inline-block;background:var(--annual-soft);color:var(--annual);border:1px solid var(--annual-line);border-radius:6px;padding:1px 8px;font-size:14px}
.card .go{margin-top:auto;font-weight:650;color:var(--perm);font-size:15px}
.card .go::after{content:" →"}
.card.first{border-top-width:5px;background:#fbfcfe;box-shadow:0 0 0 2px var(--perm-soft)}
footer{background:#16202b;color:#cfd7df;padding:18px 24px;font-size:14px}
footer ul{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px}
footer a{color:#fff}
@container site (max-width:640px){
  .top-in{padding:10px 14px}
  .menu-btn{display:block}
  .nav{display:none}
  .nav.open{display:block}
  .nav ul{flex-direction:column;padding:0}
  .nav a{padding:13px 18px;border-bottom:1px solid rgba(255,255,255,.1);border-left:4px solid transparent}
  .nav a[aria-current="page"]{border-left-color:#fff;border-bottom-color:rgba(255,255,255,.1)}
  main{padding:16px 14px}
  h1{font-size:25px}
  .grid{grid-template-columns:1fr}
  .brand{font-size:16px}
}
.brand-a{display:block;color:inherit;text-decoration:none}
.brand-a:hover,.brand-a:focus-visible{text-decoration:underline}
.crumbs{font-size:14px;color:var(--muted);margin:0 0 14px}
.crumbs a{color:var(--perm)}
.pg h1{margin:4px 0 14px}
.pg h2{margin:28px 0 10px;font-size:22px;line-height:1.25;color:var(--perm)}
.pg h3.q{margin:18px 0 4px;font-size:17px;line-height:1.3;color:var(--ink)}
.pg p{margin:0 0 10px;max-width:72ch}
.pg ul.bul{margin:0 0 12px;padding-left:22px;max-width:72ch}
.pg ul.bul li{margin:0 0 4px}
.pg a{color:var(--perm)}
.pg p.linkp{margin:6px 0 12px}
.linkbtn{display:inline-block;padding:8px 14px;border:1px solid var(--perm);border-radius:8px;background:#fff;color:var(--perm);text-decoration:none;font-weight:650}
.linkbtn::after{content:" →"}
.linkbtn:hover{background:var(--perm-soft)}
.callout{background:var(--perm-soft);border:1px solid #c6d4e6;border-left:5px solid var(--perm);border-radius:var(--radius);padding:12px 16px;margin:14px 0;max-width:72ch}
.callout p{margin:0 0 8px}
.callout p:last-child{margin-bottom:0}
.callout .ct{font-weight:650;color:var(--perm)}
.callout ul.bul{margin-bottom:0}
.tw{overflow-x:auto;margin:12px 0}
.pg table{border-collapse:collapse;width:100%;background:var(--paper);font-size:15px}
.pg th,.pg td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.pg th{background:var(--perm-soft);color:var(--perm)}
.pg ul.grid{margin:14px 0 24px}
.pg .card p{margin:0 0 10px}
.back{margin:32px 0 0;font-size:15px}
.back a{color:var(--perm)}
@container site (max-width:640px){
  .pg h2{font-size:20px}
  .pg table{font-size:14px}
  .pg th,.pg td{padding:6px 8px}
  .callout{padding:10px 12px}
}
.pg a,.pg p,.pg li,.pg td,.pg th,.callout{overflow-wrap:anywhere}

/* ===== Mise en conformité graphique AEFE ===== */
h1,h2,h3,.eyebrow,.brand,.nav a,.card h3,.callout .ct,.idband{font-family:var(--f-head);font-weight:700}
.idband{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;background:#fff;border-bottom:4px solid var(--blue)}
.id-l,.id-r{display:flex;align-items:center;min-height:56px}
.id-l span,.id-r span{display:block;color:var(--dark);padding:10px 16px;font-size:20px;line-height:1.1;letter-spacing:.02em}
.id-r span{font-size:16px;text-align:right}
.top{background:#fff;color:var(--dark)}
.top-in{background:var(--dark);color:#fff}
.brand{font-size:22px}
.brand small{font-family:var(--f-body);font-weight:400;opacity:1;color:var(--grey)}
.menu-btn{border-color:#fff;border-radius:var(--radius)}
.nav{background:var(--grey);border-top:0;border-bottom:1px solid #c4c4c4}
.nav a{color:var(--dark);font-size:17px;border-bottom:4px solid transparent}
.nav a:hover{background:#d4d4d4}
.nav a[aria-current="page"]{border-bottom-color:var(--blue);font-weight:700}
.eyebrow{color:var(--blue-text);letter-spacing:.08em}
h1{color:var(--dark);font-size:36px;padding-bottom:8px;border-bottom:3px solid var(--blue)}
h1 .session{color:inherit}
h2.sec,.pg h2{color:var(--dark);font-size:26px;border-left:6px solid var(--blue);padding-left:10px}
.pg h3.q,.card h3{color:var(--dark)}
.pg h3.q{font-size:19px;color:var(--blue-text)}
.moment{background:var(--grey);border:1px solid #c4c4c4;border-left:6px solid var(--accent)}
.moment h2{color:var(--dark);font-size:20px;border-left:0;padding-left:0}
.moment h2::before{border-color:var(--dark)}
.card{border:1px solid var(--line);border-top:5px solid var(--blue);box-shadow:none}
.card:hover{box-shadow:0 3px 10px rgba(50,50,50,.2);transform:none}
.card .sess{background:var(--grey);color:var(--dark);border:1px solid #bdbdbd}
.card .go{color:var(--blue-text)}
.card.first{background:#fff;box-shadow:0 0 0 2px var(--grey)}
.crumbs{color:var(--muted)}
.crumbs a,.pg a,.back a{color:var(--blue-text)}
.linkbtn{background:var(--blue-text);color:#fff;border:1px solid var(--blue-text)}
.linkbtn:hover{background:var(--dark);border-color:var(--dark)}
.pg a.linkbtn{color:#fff}
.callout{background:var(--blue-soft);border:1px solid #bcdcea;border-left:6px solid var(--blue)}
.callout .ct{color:var(--dark)}
.pg th{background:var(--dark);color:#fff;font-family:var(--f-head);font-size:16px}
.pg tr:nth-child(even) td{background:#f4f4f4}
footer{background:var(--dark);color:var(--grey);border-top:4px solid var(--blue)}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
@container site (max-width:640px){
  .idband{padding:10px 14px}
  .id-l,.id-r{min-height:44px}
  .id-l span{font-size:17px;padding:8px 12px}
  .id-r span{font-size:13px;padding:6px 10px}
  .nav a{border-bottom:1px solid #c4c4c4;border-left:4px solid transparent}
  .nav a[aria-current="page"]{border-left-color:var(--blue);border-bottom-color:#c4c4c4}
  h1{font-size:28px}
  h2.sec,.pg h2{font-size:22px}
  .brand{font-size:18px}
}
.moment h2::before{display:none}
/* ===== Passe finale conformité AEFE ===== */
/* Menu principal : Arial Bold (charte AEFE) */
.nav a{font-family:var(--f-body);font-weight:700;font-size:16px}
/* Libellés provisoires LIAD / AEFE : sobres, sans cadre */
.id-l span,.id-r span{border:0;padding:0;color:var(--dark)}
.id-l span{font-family:var(--f-head);font-weight:700;font-size:28px;letter-spacing:.02em}
.id-r span{font-family:var(--f-body);font-weight:700;font-size:15px;text-align:right}
/* Marqueur de statut EGD */
.id-r span{border-right:5px solid #0097c8;padding-right:12px}

.idband{background-image:none}
@container site (max-width:640px){
  .id-l span{font-size:22px}
  .id-r span{font-size:12px;padding-right:8px;border-right-width:4px}
}
/* ===== Bandeau d'identité : image officielle LIAD / EGD / AEFE ===== */
.idband{justify-content:flex-start;border-right:12px solid #0097c8;padding:12px 24px}
.id-l{min-height:0}
.id-l img{display:block;width:331px;height:auto;max-width:100%;image-rendering:auto}
@container site (max-width:640px){
  .idband{padding:10px 14px;border-right-width:8px}
  .id-l{min-height:0}
  .id-l img{width:260px}
}
/* ===== Trame graphique officielle AEFE (charte Web 2015, p. 7) ===== */
.idband{position:relative;isolation:isolate}
.idband::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:var(--trame-aefe,none);background-repeat:no-repeat;background-position:center;background-size:cover;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}


/* Ligne de présentation des épreuves */
.epcar{display:flex;flex-wrap:wrap;gap:6px 0;margin:0 0 14px;font-weight:700}
.epcar .epsep{margin:0 .7em;font-weight:400}

/* ===== Direction graphique sobre (référence : maquette d'accueil V5) ===== */
:root{
  --f-head:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --f-body:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --v-bg:#FCFBF8;--v-head:#F4EFF8;--v-card:#fffdf9;--v-line:#e3dfd4;--v-text:#2b2d31;--v-muted:#555b63;
  --v-ui:#2368AE;--v-sky:#4E9FE6;--v-sage:#eef2ec;--v-box:#e9eef2;--v-boxline:#d5dde4;
  --c-bg:#0033CC;--c-bg-pale:#edeff6;--c-ea:#660033;--c-ea-pale:#f4e9ed;--c-dnb:#2C601A;--c-dnb-pale:#ebf0e6;
  --ex:var(--v-ui);--ex-bar:var(--v-sky);
}
body.pe-bg{--ex:var(--c-bg);--ex-bar:var(--c-bg)}
body.pe-ea{--ex:var(--c-ea);--ex-bar:var(--c-ea)}
body.pe-dnb{--ex:var(--c-dnb);--ex-bar:var(--c-dnb)}
body{background:var(--v-bg);color:var(--v-text);font:17px/1.6 var(--f-body)}
#stage{padding:0;display:block}
#site{max-width:none;box-shadow:none;background:var(--v-bg);transition:none}
:focus-visible,a:focus-visible{outline:3px solid var(--v-ui);outline-offset:2px}
/* En-tête */
.top{background:var(--v-head);color:var(--v-text);border-bottom:1px solid var(--v-line);display:grid;grid-template-columns:auto 1fr;padding:0 max(20px,calc((100% - 1040px)/2 + 20px))}
.idband{grid-column:1/-1;background:none;border:0;padding:14px 0 10px}
.idband::before{display:none}
.id-l img{width:331px;height:auto;max-width:100%}
.top-in{grid-column:1;background:none;color:inherit;padding:10px 0 14px}
.brand{font-family:var(--f-head);font-weight:700;font-size:19px}
.brand-a{color:var(--v-ui)}
.brand small{font-family:var(--f-body);font-weight:400;font-size:14px;color:var(--v-muted)}
.menu-btn{background:transparent;color:var(--v-ui);border:1px solid var(--v-ui);border-radius:6px}
.nav{grid-column:2;justify-self:end;align-self:center;background:none;border:0}
.nav ul{padding:0;gap:4px 20px}
.nav a{padding:4px 0;font-family:var(--f-body);font-weight:400;font-size:15.5px;color:var(--v-ui);border-bottom:2px solid transparent}
.nav a:hover{background:none;border-bottom-color:var(--v-sky)}
.nav a.x-bg{color:var(--c-bg)}.nav a.x-ea{color:var(--c-ea)}.nav a.x-dnb{color:var(--c-dnb)}
.nav a.x-bg:hover{border-bottom-color:var(--c-bg)}.nav a.x-ea:hover{border-bottom-color:var(--c-ea)}.nav a.x-dnb:hover{border-bottom-color:var(--c-dnb)}
.nav a[aria-current="page"]{font-weight:700;border-bottom-color:var(--v-ui)}
.nav a.x-bg[aria-current="page"]{border-bottom-color:var(--c-bg)}.nav a.x-ea[aria-current="page"]{border-bottom-color:var(--c-ea)}.nav a.x-dnb[aria-current="page"]{border-bottom-color:var(--c-dnb)}
/* Contenu */
main{padding:32px max(20px,calc((100% - 1040px)/2 + 20px)) 48px}
.eyebrow{color:var(--v-muted);font-size:14px;letter-spacing:.06em;font-weight:400;margin:0 0 4px}
h1,.pg h1{font-family:var(--f-head);font-weight:700;color:var(--ex);font-size:30px;line-height:1.25;margin:0 0 18px;padding:0;border:0}
h1 .session{color:inherit}
h2.sec,.pg h2{font-family:var(--f-head);font-weight:700;color:var(--ex);font-size:22px;line-height:1.3;border:0;padding:0}
h2.sec{color:var(--v-ui);margin:32px 0 14px}
.pg h3.q{font-family:var(--f-head);color:var(--ex);font-size:18px}
.crumbs{color:var(--v-muted)}
.crumbs a,.pg a,.back a{color:var(--v-ui)}
.pg a.x-bg,.back a.x-bg,.crumbs a.x-bg{color:var(--c-bg)}
.pg a.x-ea,.back a.x-ea,.crumbs a.x-ea{color:var(--c-ea)}
.pg a.x-dnb,.back a.x-dnb,.crumbs a.x-dnb{color:var(--c-dnb)}
/* Boutons-liens */
.linkbtn,.pg a.linkbtn{background:var(--v-ui);border:1px solid var(--v-ui);color:#fff;border-radius:6px}
.linkbtn:hover{background:var(--v-ui);border-color:var(--v-ui);filter:brightness(.88)}
.pg a.linkbtn.x-bg{background:var(--c-bg);border-color:var(--c-bg)}
.pg a.linkbtn.x-ea{background:var(--c-ea);border-color:var(--c-ea)}
.pg a.linkbtn.x-dnb{background:var(--c-dnb);border-color:var(--c-dnb)}
/* Encadrés */
.callout{background:var(--v-box);border:1px solid var(--v-boxline);border-left:4px solid var(--ex-bar);border-radius:6px}
.callout .ct{font-family:var(--f-head);color:var(--v-text)}
.moment{background:var(--v-box);border:1px solid var(--v-boxline);border-radius:6px;padding:16px 20px;margin:24px 0 8px}
.moment h2{color:var(--v-ui);font-size:18px}
.moment p{font-size:16px}
.moment strong.x-bg{color:var(--c-bg)}.moment strong.x-ea{color:var(--c-ea)}.moment strong.x-dnb{color:var(--c-dnb)}
/* Tableaux */
.pg th{background:var(--v-box);color:var(--ex);font-family:var(--f-head);font-size:15px}
.pg th,.pg td{border-color:var(--v-line)}
.pg table{background:var(--v-card)}
.pg tr:nth-child(even) td{background:#f8f6f0}
/* Cartes */
.card{background:var(--v-card);border:1px solid var(--v-line);border-radius:6px;box-shadow:none;transform:none}
.card:hover{border-color:var(--v-sky);box-shadow:none;transform:none}
.card h3{font-family:var(--f-head);color:var(--v-ui)}
.card p{color:#444a52;font-size:15.5px}
.card .go{color:var(--v-ui)}
.card.first{background:var(--v-sage);border-color:#d3dccd;box-shadow:none}
.card .sess{display:inline;padding:1px 8px;border:1px solid var(--v-ui);border-radius:999px;background:var(--v-box);color:var(--v-ui);font-size:14.5px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.card.x-bg:hover{border-color:var(--c-bg)}.card.x-ea:hover{border-color:var(--c-ea)}.card.x-dnb:hover{border-color:var(--c-dnb)}
.card.x-bg h3,.card.x-bg .go,.card.x-bg .sess{color:var(--c-bg)}
.card.x-ea h3,.card.x-ea .go,.card.x-ea .sess{color:var(--c-ea)}
.card.x-dnb h3,.card.x-dnb .go,.card.x-dnb .sess{color:var(--c-dnb)}
.card.x-bg .sess{border-color:var(--c-bg);background:var(--c-bg-pale)}
.card.x-ea .sess{border-color:var(--c-ea);background:var(--c-ea-pale)}
.card.x-dnb .sess{border-color:var(--c-dnb);background:var(--c-dnb-pale)}
/* Pied de page */
footer{background:var(--v-card);color:#444a52;border-top:1px solid var(--v-line);padding:18px max(20px,calc((100% - 1040px)/2 + 20px));font-size:15px}
footer a{color:var(--v-ui)}
@container site (max-width:640px){
  .top{grid-template-columns:1fr;padding:0 14px}
  .idband{padding:10px 0 8px}
  .id-l img{width:260px}
  .top-in{padding:8px 0 12px}
  .nav{grid-column:1;justify-self:stretch;background:var(--v-head);border-top:1px solid var(--v-line)}
  .nav a{padding:13px 4px;border-bottom:1px solid var(--v-line);border-left:4px solid transparent;padding-left:10px}
  .nav a:hover{border-bottom-color:var(--v-line);background:none}
  .nav a[aria-current="page"]{border-left-color:var(--v-ui);border-bottom-color:var(--v-line)}
  .nav a.x-bg[aria-current="page"]{border-left-color:var(--c-bg);border-bottom-color:var(--v-line)}
  .nav a.x-ea[aria-current="page"]{border-left-color:var(--c-ea);border-bottom-color:var(--v-line)}
  .nav a.x-dnb[aria-current="page"]{border-left-color:var(--c-dnb);border-bottom-color:var(--v-line)}
  main{padding:24px 16px 40px}
  h1,.pg h1{font-size:25px}
  h2.sec,.pg h2{font-size:20px}
  footer{padding:18px 16px}
}
.grid{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}
.card,.card.first{border-top-width:1px}
