/* ESIAU : nouveau design (branche refonte-design). Palette du logo : bleu, bleu foncé, rouge. Coins carrés, filets fins, aucune ombre. */
  /* ---------- Palette ESIAU uniquement ---------- */
:root{
  --bleu:#2126CA;      /* bleu du site */
  --nuit:#121568;      /* bleu foncé */
  --rouge:#C90000;     /* le « A » du logo */
  --encre:#1C1A17;     /* texte */
  --blanc:#FFFFFF;
  --voile:#EEF0FB;     /* très léger bleu : teinte du bleu ESIAU */
  --filet:rgba(28,26,23,.85);
  --sans:'Archivo',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,monospace;
  --marge:clamp(18px,4vw,56px);
}
*{box-sizing:border-box;margin:0;padding:0;border-radius:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-size:18px;line-height:1.6;color:var(--encre);background:var(--blanc);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--rouge);outline-offset:3px}
.page{max-width:1600px;margin:0 auto}
.marge{padding-left:var(--marge);padding-right:var(--marge)}

.etiquette{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:500}
h1,h2,h3{font-weight:800;letter-spacing:-.025em;line-height:1.02}

/* ---------- Boutons : carrés ---------- */
.btn{display:inline-flex;align-items:center;gap:12px;font-family:var(--sans);font-weight:700;font-size:16px;line-height:1;padding:18px 24px;text-decoration:none;border:2px solid var(--encre);background:transparent;color:var(--encre);cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn:hover{background:var(--encre);color:var(--blanc)}
.btn--rouge{background:var(--rouge);border-color:var(--rouge);color:var(--blanc)}
.btn--rouge:hover{background:var(--nuit);border-color:var(--nuit)}
.btn--blanc{background:var(--blanc);border-color:var(--blanc);color:var(--nuit)}
.btn--blanc:hover{background:transparent;color:var(--blanc)}
.btn--contour-blanc{border-color:var(--blanc);color:var(--blanc)}
.btn--contour-blanc:hover{background:var(--blanc);color:var(--nuit)}
.fleche{display:inline-block;transition:transform .15s}
a:hover>.fleche,.btn:hover .fleche{transform:translateX(4px)}

/* ---------- Bloc du haut : fixe, et séparé de la page par un espace de même hauteur ----------
   Il peut donc rétrécir sans jamais faire bouger le contenu (c'est ce qui évite le tremblement). */
.haut-fixe{position:fixed;top:0;left:0;right:0;z-index:50;background:var(--blanc)}
.haut-fixe .annonce{overflow:hidden;max-height:100px;transition:max-height .25s ease}
.haut-fixe.reduit .annonce{max-height:0}
.sans-anim,.sans-anim *{transition:none!important}
html{scroll-padding-top:96px}

/* ---------- Bande d'annonce (information seulement) ---------- */
.annonce{background:var(--rouge);color:var(--blanc)}
.annonce .page{padding:10px var(--marge)}
.annonce p{font-family:var(--mono);font-size:13px;letter-spacing:.04em;line-height:1.4}

/* ---------- En-tête : logo grand, visible ---------- */
.entete{border-bottom:1px solid var(--filet);background:var(--blanc)}
.entete .page{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px var(--marge);transition:padding .25s ease}
.entete .logo img{height:76px;width:auto;transition:height .25s ease}
.haut-fixe.reduit .entete .page{padding-top:8px;padding-bottom:8px}
.haut-fixe.reduit .entete .logo img{height:50px}
.haut-fixe.reduit .entete .btn{padding:11px 18px}
.haut-fixe.reduit .liens-rapides a{font-size:15px}
.entete .actions{display:flex;gap:10px;align-items:center}
.entete .btn{padding:14px 20px;font-size:14px;letter-spacing:.02em;text-transform:uppercase}
.entete .btn--menu{border-color:var(--nuit);color:var(--nuit)}
.entete .btn--menu:hover{background:var(--nuit);color:var(--blanc)}
.liens-rapides{display:flex;gap:26px;margin-right:18px}
.liens-rapides a{font-weight:500;font-size:16px;text-decoration:none;border-bottom:2px solid transparent;padding:4px 0}
.liens-rapides a:hover{border-bottom-color:var(--rouge)}
@media (max-width:900px){.liens-rapides{display:none}}
@media (max-width:560px){
  .entete .logo img{height:56px}
  .haut-fixe.reduit .entete .logo img{height:42px}
  .haut-fixe.reduit .entete .btn{padding:9px 12px}
  .entete .btn{padding:12px 14px;font-size:12px}
}

/* ---------- Menu plein écran ---------- */
.menu{position:fixed;inset:0;z-index:100;background:var(--nuit);color:var(--blanc);overflow:auto;padding:0 var(--marge) 40px;
  background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:64px 64px}
.menu[hidden]{display:none}
.menu__haut{display:flex;justify-content:space-between;align-items:center;padding:20px 0}
.menu__haut img{height:64px;width:auto;background:var(--blanc);padding:6px 14px}
.menu__haut .btn{border-color:var(--blanc);color:var(--blanc);padding:14px 20px;font-size:14px;text-transform:uppercase}
.menu__haut .btn:hover{background:var(--blanc);color:var(--nuit)}
.menu ol{list-style:none;max-width:1100px;margin:5vh auto 0}
.menu li{border-top:1px solid rgba(255,255,255,.35)}
.menu li:last-child{border-bottom:1px solid rgba(255,255,255,.35)}
.menu .principal{display:flex;align-items:baseline;gap:24px;text-decoration:none;padding:14px 0;font-weight:800;font-size:clamp(2rem,5.5vw,4.2rem);letter-spacing:-.03em;line-height:1.05}
.menu .principal span{font-family:var(--mono);font-weight:400;font-size:14px;letter-spacing:.06em;color:rgba(255,255,255,.7);min-width:2.2em}
.menu .principal:hover{color:var(--blanc);background:var(--rouge);padding-left:16px;transition:padding .15s}
.menu__pied{max-width:1100px;margin:28px auto 0;font-family:var(--mono);font-size:13px;color:rgba(255,255,255,.8);display:flex;gap:28px;flex-wrap:wrap}

/* ---------- Premier écran ---------- */
.hero{display:grid;grid-template-columns:repeat(12,1fr);align-items:stretch;border-bottom:1px solid var(--filet)}
.hero__texte{grid-column:1 / span 7;padding:clamp(36px,6vw,84px) var(--marge) clamp(36px,5vw,64px);display:flex;flex-direction:column;justify-content:space-between;gap:36px}
.hero__texte .etiquette{color:var(--nuit)}
.hero h1{font-size:clamp(2.7rem,6.4vw,6rem);margin-top:18px;color:var(--nuit)}
.hero h1 em{font-style:normal;color:var(--rouge)}
.hero__texte p.intro{max-width:34em;font-size:clamp(18px,1.6vw,21px);margin-top:26px}
.hero__texte p.intro strong{font-weight:800;color:var(--nuit)}
.hero__boutons{display:flex;gap:14px;flex-wrap:wrap}
.hero__photo{grid-column:8 / span 5;position:relative;min-height:520px;border-left:1px solid var(--filet);overflow:hidden}
.hero__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.legende{position:absolute;left:0;bottom:0;max-width:78%;background:var(--blanc);padding:16px 20px;border-top:1px solid var(--filet);border-right:1px solid var(--filet)}
.legende .etiquette{color:var(--rouge);display:block;margin-bottom:4px}
.legende strong{font-weight:700;font-size:16px;line-height:1.3;display:block}
@media (max-width:960px){
  .hero__texte{grid-column:1 / -1}
  .hero__photo{grid-column:1 / -1;min-height:420px;border-left:0;border-top:1px solid var(--filet)}
}

/* Badge rond « Candidater » */
.badge{position:absolute;top:22px;left:22px;width:150px;height:150px;z-index:3;display:block;text-decoration:none}
.badge svg{width:100%;height:100%;display:block;overflow:visible}
.badge .fond{fill:var(--rouge)}
.badge text{fill:var(--blanc);font-family:var(--mono);font-size:15px;font-weight:500;letter-spacing:.06em}
.badge .tourne{transform-origin:100px 100px;animation:tourne 22s linear infinite}
.badge:hover .fond{fill:var(--nuit)}
.badge .cible{fill:none;stroke:var(--blanc);stroke-width:5;stroke-linecap:square;stroke-linejoin:miter}
@keyframes tourne{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.badge .tourne{animation:none}html{scroll-behavior:auto}}
@media (max-width:960px){.badge{width:120px;height:120px;top:16px;left:16px}}

/* ---------- Quatre tuiles sur une grille alignée (7 | 5 sur les deux rangées) ---------- */
.tuiles{display:grid;grid-template-columns:repeat(12,1fr);border-left:1px solid var(--filet)}
.tuile{border-right:1px solid var(--filet);border-bottom:1px solid var(--filet);padding:clamp(22px,2.6vw,36px);display:flex;flex-direction:column;justify-content:space-between;gap:26px;min-height:470px;position:relative;text-decoration:none;color:inherit;overflow:hidden}
.t-7{grid-column:span 7}.t-5{grid-column:span 5}
.tuile--rouge{background:var(--rouge);color:var(--blanc)}
.tuile--photo{padding:0}
.tuile--photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.tuile--photo:hover img{transform:scale(1.03)}
.tuile--photo .legende{z-index:2}

/* Tuile rouge : admissions */
.tuile--rouge h2{font-size:clamp(2.2rem,3.8vw,3.6rem);margin-top:14px}
.infos-cles{list-style:none;border-top:1px solid rgba(255,255,255,.55)}
.infos-cles li{display:grid;grid-template-columns:120px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.55);align-items:baseline}
.infos-cles strong{font-weight:700;font-size:19px;line-height:1.3}
.infos-cles span.sous{display:block;font-weight:400;font-size:15px;opacity:.92}
.tuile--rouge .tel{font-family:var(--mono);font-size:clamp(18px,2vw,24px);font-weight:500;letter-spacing:.02em;display:flex;justify-content:space-between;align-items:baseline;gap:12px}

/* Tuile actualités : dates en grand, comme un agenda */
.actus{list-style:none;border-top:2px solid var(--encre)}
.actus li{border-bottom:1px solid var(--filet)}
.actus a{display:grid;grid-template-columns:96px 1fr;gap:18px;align-items:start;text-decoration:none;padding:16px 0}
.actus .jour{font-family:var(--mono);font-size:13px;letter-spacing:.04em;text-transform:uppercase;line-height:1.35;color:var(--nuit)}
.actus .jour b{display:block;font-family:var(--sans);font-weight:900;font-size:34px;letter-spacing:-.03em;line-height:1;color:var(--encre)}
.actus .etiquette{color:var(--rouge);display:block;margin-bottom:2px}
.actus strong{font-size:20px;font-weight:700;line-height:1.25;display:block}
.actus a:hover strong{text-decoration:underline;text-underline-offset:4px}
.lien{font-weight:700;font-size:16px;text-decoration:none;display:inline-flex;gap:10px;align-items:center;border-bottom:2px solid currentColor;padding-bottom:3px;align-self:flex-start}
@media (max-width:960px){
  .t-7,.t-5{grid-column:1 / -1}
  .tuiles{border-left:0}
  .tuile{border-left:1px solid var(--filet);min-height:400px}
  .infos-cles li{grid-template-columns:1fr;gap:2px}
}

/* ---------- Sections ---------- */
.section{padding-top:clamp(56px,8vw,112px);padding-bottom:clamp(56px,8vw,112px)}
.section__tete{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.section__tete h2{font-size:clamp(2.2rem,4.6vw,4.2rem);max-width:15em;color:var(--nuit)}
.section__tete .etiquette{display:block;margin-bottom:14px;color:var(--rouge)}

/* Filières : liste simple */
.filieres{border-top:2px solid var(--encre)}
.filiere{display:grid;grid-template-columns:70px 1.1fr 1.4fr 1fr;gap:28px;align-items:start;padding:30px 0;border-bottom:1px solid var(--filet);text-decoration:none;transition:background .15s}
.filiere:hover{background:var(--voile)}
.filiere .num{font-family:var(--mono);font-size:14px;color:var(--rouge);padding-top:10px}
.filiere h3{font-size:clamp(1.9rem,3.2vw,3rem);color:var(--nuit)}
.filiere p{font-size:17px;max-width:32em}
.filiere .infos{font-family:var(--mono);font-size:13px;line-height:1.7;text-transform:uppercase;letter-spacing:.04em}
.filiere .infos b{font-weight:500;color:var(--nuit)}
.filiere:hover h3{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:7px;text-decoration-color:var(--rouge)}
@media (max-width:960px){.filiere{grid-template-columns:1fr;gap:10px;padding:26px 0}.filiere .num{padding-top:0}}

/* Chiffres */
.chiffres{display:grid;grid-template-columns:4fr 3fr 5fr;border-top:1px solid var(--filet);border-bottom:1px solid var(--filet)}
.chiffre{padding:36px var(--marge);border-right:1px solid var(--filet)}
.chiffre:last-child{border-right:0}
.chiffre b{display:block;font-size:clamp(3.4rem,8vw,7rem);font-weight:900;letter-spacing:-.04em;line-height:.95;color:var(--bleu)}
.chiffre span{display:block;margin-top:10px;font-weight:500}
@media (max-width:960px){.chiffres{grid-template-columns:1fr}.chiffre{border-right:0;border-bottom:1px solid var(--filet)}.chiffre:last-child{border-bottom:0}}

/* Savoir-faire : photo + texte */
.duo{display:grid;grid-template-columns:repeat(12,1fr);border-top:1px solid var(--filet);border-bottom:1px solid var(--filet)}
.duo__photo{grid-column:1 / span 6;position:relative;min-height:520px;border-right:1px solid var(--filet);overflow:hidden}
.duo__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.duo__texte{grid-column:7 / span 6;padding:clamp(32px,5vw,72px) var(--marge);display:flex;flex-direction:column;justify-content:center;gap:24px}
.duo__texte h2{font-size:clamp(2.2rem,4.2vw,3.8rem);color:var(--nuit)}
.duo__texte .etiquette{color:var(--rouge)}
.duo__texte p{max-width:32em}
@media (max-width:960px){.duo__photo,.duo__texte{grid-column:1 / -1}.duo__photo{min-height:380px;border-right:0;border-bottom:1px solid var(--filet)}}

/* Galeries (maquettes, sorties) : photos nettes sur une grille de traits fins */
.section__tete .chapo{max-width:30em;font-size:19px}
.galerie{display:grid;grid-template-columns:repeat(12,1fr);border-left:1px solid var(--filet);border-top:1px solid var(--filet)}
.cellule{position:relative;overflow:hidden;margin:0;border-right:1px solid var(--filet);border-bottom:1px solid var(--filet)}
.cellule img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.cellule:hover img{transform:scale(1.03)}
.cellule--portrait{aspect-ratio:3/4}
.cellule--paysage{aspect-ratio:4/3}
.g-3{grid-column:span 3}.g-6{grid-column:span 6}
.cellule .num{position:absolute;top:0;left:0;z-index:2;background:var(--blanc);padding:6px 12px;border-right:1px solid var(--filet);border-bottom:1px solid var(--filet);font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.cellule .legende{z-index:2}
.cellule--nuit{background:var(--nuit);color:var(--blanc);padding:clamp(24px,3vw,44px);display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.cellule--nuit h3{font-size:clamp(1.8rem,3vw,2.8rem);margin-top:14px}
.cellule--nuit p{font-size:18px;max-width:28em}
@media (max-width:960px){.g-3{grid-column:span 6}.g-6{grid-column:span 12}.cellule--nuit{min-height:300px}}

/* Vidéo : image fixe, la lecture ne démarre que sur clic */
.video{position:relative;aspect-ratio:16/9;background:var(--nuit);border:1px solid var(--filet);overflow:hidden}
.video img,.video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.video video{background:#000}
.video .lire{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:104px;height:104px;border:0;background:var(--rouge);cursor:pointer;display:grid;place-items:center;transition:background .15s,transform .15s;z-index:3}
.video .lire:hover{background:var(--nuit);transform:translate(-50%,-50%) scale(1.05)}
.video .lire svg{width:40px;height:40px;fill:var(--blanc);margin-left:6px}
.video .legende{z-index:2}
@media (max-width:560px){.video .lire{width:76px;height:76px}.video .lire svg{width:30px;height:30px}}

/* Diplômés : grille à zones */
.galerie--dipl{grid-template-rows:460px 360px}
.dipl-a{grid-column:1 / span 5;grid-row:1 / span 2}
.dipl-b{grid-column:6 / span 7;grid-row:1}
.dipl-c{grid-column:6 / span 4;grid-row:2}
.dipl-d{grid-column:10 / span 3;grid-row:2}
.cellule--bleu{background:var(--bleu);color:var(--blanc);padding:clamp(22px,2.6vw,36px);display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.cellule--bleu h3{font-size:clamp(1.7rem,2.6vw,2.4rem);margin-top:14px}
.cellule--bleu p{font-size:18px;line-height:1.45}
@media (max-width:960px){
  .galerie--dipl{grid-template-rows:none}
  .dipl-a,.dipl-b,.dipl-c,.dipl-d{grid-column:1 / -1;grid-row:auto}
  .dipl-a{aspect-ratio:3/4}.dipl-b{aspect-ratio:4/3}.dipl-d{aspect-ratio:3/4}.dipl-c{min-height:240px}
}

/* Mot du directeur */
.directeur{border-top:1px solid var(--filet);border-bottom:1px solid var(--filet);background:var(--voile)}
.directeur__grille{display:grid;grid-template-columns:repeat(12,1fr)}
.directeur__photo{grid-column:1 / span 4;position:relative;min-height:540px;border-right:1px solid var(--filet);overflow:hidden}
.directeur__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.directeur__texte{grid-column:5 / span 8;padding:clamp(32px,5vw,72px) var(--marge);display:flex;flex-direction:column;justify-content:center;gap:24px}
.directeur .etiquette{color:var(--rouge)}
.directeur blockquote p{font-weight:800;font-size:clamp(2.2rem,4.8vw,4.6rem);line-height:1.02;letter-spacing:-.03em;color:var(--nuit)}
.directeur .suite{font-size:clamp(18px,1.6vw,21px);max-width:30em}
.directeur .signature{font-size:16px;line-height:1.5}
.directeur .signature b{display:block;font-size:20px;font-weight:800;color:var(--nuit)}
@media (max-width:960px){.directeur__photo,.directeur__texte{grid-column:1 / -1}.directeur__photo{min-height:420px;border-right:0;border-bottom:1px solid var(--filet)}}

/* Candidater : aplat bleu avec trame de plan, en pleine largeur */
.candidater{background:var(--bleu);color:var(--blanc);position:relative;overflow:hidden;
  background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px);background-size:72px 72px}
.candidater h2{font-size:clamp(2.4rem,5.4vw,5rem);max-width:12em}
.candidater .etiquette{display:block;margin-bottom:16px;opacity:.9}
.etapes{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);margin-top:56px;border-top:2px solid var(--blanc)}
.etapes li{padding:22px 22px 0 0}
.etapes b{font-family:var(--mono);font-weight:500;font-size:14px;display:block;margin-bottom:16px;color:var(--blanc);opacity:.85}
.etapes strong{display:block;font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.1;margin-bottom:8px}
.etapes p{font-size:16px;line-height:1.5;opacity:.92}
.candidater__actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:52px}
@media (max-width:960px){.etapes{grid-template-columns:1fr 1fr;row-gap:20px}}
@media (max-width:560px){.etapes{grid-template-columns:1fr}}

/* Partenaires */
.partenaires{display:flex;flex-wrap:wrap;align-items:center;gap:34px 52px;margin-top:8px}
.partenaires img{height:54px;width:auto;max-width:150px;object-fit:contain;filter:grayscale(1);opacity:.75;transition:opacity .15s,filter .15s}
.partenaires img:hover{filter:none;opacity:1}

/* ---------- Page Partenariats : grille de logos ---------- */
.logos{list-style:none;display:grid;grid-template-columns:repeat(var(--n,3),1fr);border-top:2px solid var(--encre);border-left:1px solid var(--filet)}
.logos>li{border-right:1px solid var(--filet);border-bottom:1px solid var(--filet);padding:clamp(22px,2.4vw,34px);min-height:280px;display:flex;flex-direction:column;justify-content:space-between;gap:26px}
.logos__image{flex:1;display:flex;align-items:center;justify-content:center;min-height:120px}
.logos img{width:auto;height:auto;max-width:80%;max-height:clamp(90px,9vw,140px);object-fit:contain}
.logos__nom{border-top:1px solid var(--filet);padding-top:16px;display:flex;flex-direction:column;gap:6px}
.logos__nom strong{font-size:18px;line-height:1.25;color:var(--nuit)}
.logos__nom .etiquette{opacity:.75}
@media (hover:hover){
  .logos img{filter:grayscale(1);opacity:.85;transition:opacity .15s,filter .15s}
  .logos>li:hover img{filter:none;opacity:1}
}
@media (max-width:960px){.logos{grid-template-columns:1fr 1fr}.logos>li{min-height:240px}}
@media (max-width:560px){.logos{grid-template-columns:1fr}}

/* ---------- Page introuvable (404) ---------- */
.perdu{display:grid;grid-template-columns:5fr 7fr;border-bottom:1px solid var(--filet);margin-bottom:clamp(40px,6vw,88px)}
.perdu__chiffre{display:flex;align-items:center;justify-content:center;background:var(--nuit);color:var(--blanc);font-weight:900;letter-spacing:-.06em;line-height:.8;font-size:clamp(7rem,17vw,16rem);padding:clamp(40px,6vw,90px) 0;overflow:hidden}
.perdu__texte{padding:clamp(28px,4vw,64px) var(--marge);display:flex;flex-direction:column;justify-content:center;gap:24px}
.perdu__texte h1{font-size:clamp(2.6rem,5.4vw,5rem);color:var(--nuit)}
.perdu__texte h1 em{font-style:normal;color:var(--rouge)}
.perdu__texte .intro{font-size:clamp(1.1rem,1.5vw,1.35rem);max-width:30em}
.liens-utiles{list-style:none;border-top:2px solid var(--encre)}
.liens-utiles a{display:grid;grid-template-columns:60px minmax(160px,1fr) 2fr auto;gap:20px;align-items:center;padding:24px 0;border-bottom:1px solid var(--filet);text-decoration:none}
.liens-utiles .etiquette{color:var(--rouge)}
.liens-utiles strong{font-size:clamp(1.3rem,2vw,1.8rem);font-weight:800;letter-spacing:-.02em;color:var(--nuit)}
.liens-utiles__texte{font-size:17px}
.liens-utiles a:hover{background:var(--voile)}
.liens-utiles .fleche{font-size:24px;font-weight:700;padding-right:12px}
@media (max-width:960px){
  .perdu{grid-template-columns:1fr}
  .liens-utiles a{grid-template-columns:44px 1fr auto;row-gap:4px}
  .liens-utiles__texte{grid-column:2 / 3;grid-row:2}
  .liens-utiles .fleche{grid-column:3;grid-row:1 / 3}
}

/* ---------- Page FAQ : questions par thème ---------- */
.faq-groupe{display:grid;grid-template-columns:4fr 8fr;gap:clamp(20px,4vw,64px);border-top:2px solid var(--encre);padding:clamp(28px,3.4vw,48px) 0 clamp(36px,4.5vw,64px)}
.faq-groupe__titre .etiquette{display:block;margin-bottom:14px;color:var(--rouge)}
.faq-groupe__titre h2{font-size:clamp(1.8rem,3.2vw,2.8rem);color:var(--nuit);max-width:10em}
.faq-liste details{border-bottom:1px solid var(--filet)}
.faq-liste details:first-child{border-top:1px solid var(--filet)}
.faq-liste summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font-weight:700;font-size:clamp(1.05rem,1.4vw,1.25rem);line-height:1.3;color:var(--encre)}
.faq-liste summary::-webkit-details-marker{display:none}
.faq-liste summary::after{content:'+';flex:none;width:36px;height:36px;display:grid;place-items:center;border:2px solid var(--encre);font-size:22px;font-weight:700;line-height:1;transition:background .15s,color .15s}
.faq-liste summary:hover::after{background:var(--encre);color:var(--blanc)}
.faq-liste details[open] summary{color:var(--nuit)}
.faq-liste details[open] summary::after{content:'−';background:var(--rouge);border-color:var(--rouge);color:var(--blanc)}
.faq-reponse{padding:0 60px 26px 0;font-size:18px;line-height:1.6;max-width:44em}
.faq-reponse .lien{font-weight:700}
@media (max-width:960px){.faq-groupe{grid-template-columns:1fr}.faq-groupe__titre h2{max-width:none}.faq-reponse{padding-right:0}}

/* ---------- Page Galerie : albums et visionneuse ---------- */
.albums{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);border-top:2px solid var(--encre);border-left:1px solid var(--filet)}
.albums>li{border-right:1px solid var(--filet);border-bottom:1px solid var(--filet);display:flex}
.album{display:flex;flex-direction:column;width:100%;text-align:left;background:transparent;border:0;font:inherit;color:inherit;cursor:pointer}
.album:disabled{cursor:default}
.album__image{display:block;position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--voile);border-bottom:1px solid var(--filet)}
.album__image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.album:hover .album__image img{transform:scale(1.03)}
.album__vide{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--nuit)}
.album__texte{display:flex;flex-direction:column;gap:10px;padding:clamp(18px,2vw,28px);flex:1}
.album__texte .etiquette{color:var(--rouge)}
.album__texte strong{font-size:clamp(1.3rem,1.9vw,1.7rem);font-weight:800;letter-spacing:-.02em;line-height:1.1;color:var(--nuit)}
.album__desc{font-size:16px;line-height:1.45}
.album__voir{margin-top:auto;padding-top:8px;font-weight:700;font-size:16px}
.album:hover .album__voir .fleche{transform:translateX(4px)}
@media (max-width:960px){.albums{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.albums{grid-template-columns:1fr}}

.visionneuse{position:fixed;inset:0;z-index:200;background:var(--nuit);color:var(--blanc);display:flex;flex-direction:column}
.visionneuse[hidden]{display:none}
.visionneuse__cadre{flex:1;min-height:0;position:relative}
.visionneuse__cadre img{position:absolute;top:clamp(12px,3vw,40px);left:clamp(12px,3vw,40px);width:calc(100% - 2 * clamp(12px,3vw,40px));height:calc(100% - clamp(12px,3vw,40px) - 12px);object-fit:contain}
.visionneuse__barre{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:14px clamp(12px,3vw,40px) 18px;border-top:1px solid rgba(255,255,255,.4)}
.visionneuse__legende{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.visionneuse__boutons{display:flex;gap:10px;flex-wrap:wrap}
.visionneuse__boutons button{font:inherit;font-weight:700;font-size:16px;line-height:1;padding:14px 18px;background:transparent;color:var(--blanc);border:2px solid var(--blanc);cursor:pointer;transition:background .15s,color .15s}
.visionneuse__boutons button:hover{background:var(--blanc);color:var(--nuit)}
.visionneuse__boutons #visionneuse-fermer{background:var(--rouge);border-color:var(--rouge)}
.visionneuse__boutons #visionneuse-fermer:hover{background:var(--blanc);border-color:var(--blanc);color:var(--rouge)}
.visionneuse :focus-visible{outline-color:var(--blanc)}

/* ---------- Pied de page : cartouche de plan ---------- */
.pied{background:var(--nuit);color:var(--blanc);padding:clamp(48px,7vw,96px) 0 0}
.pied__actions{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(255,255,255,.55);margin-bottom:56px}
.pied__actions a{padding:26px 24px;text-decoration:none;border-right:1px solid rgba(255,255,255,.55);display:flex;justify-content:space-between;align-items:center;font-weight:800;font-size:clamp(1.3rem,2.4vw,2rem);letter-spacing:-.02em}
.pied__actions a:last-child{border-right:0}
.pied__actions a:hover{background:var(--rouge)}
.cartouche{display:grid;grid-template-columns:repeat(12,1fr);border:1px solid rgba(255,255,255,.55)}
.cartouche>div{padding:20px 22px;border-right:1px solid rgba(255,255,255,.55);border-bottom:1px solid rgba(255,255,255,.55)}
.cartouche .etiquette{display:block;opacity:.7;margin-bottom:8px}
.cartouche .nom{grid-column:1 / span 6;display:flex;gap:28px;align-items:center}
.cartouche .nom img{height:72px;width:auto;background:var(--blanc);padding:6px 14px}
.cartouche .nom strong{font-size:20px;line-height:1.25;font-weight:700}
.cartouche .c3{grid-column:span 3}
.cartouche a{text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4);color:inherit}
.cartouche a:hover{border-bottom-color:var(--blanc);color:var(--blanc);background:var(--rouge)}
.cartouche p{font-size:16px;line-height:1.6}
.cartouche>div:last-child{border-right:0}
.pied__bas{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:22px 0 30px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;opacity:.85}
@media (max-width:960px){
  .pied__actions{grid-template-columns:1fr}
  .pied__actions a{border-right:0;border-bottom:1px solid rgba(255,255,255,.55)}
  .pied__actions a:last-child{border-bottom:0}
  .cartouche .nom,.cartouche .c3{grid-column:1 / -1;border-right:0}
}

/* ================= Ajouts pour le vrai site ================= */
.lien-evitement{position:absolute;left:-999px;top:0;background:var(--nuit);color:var(--blanc);padding:12px 18px;z-index:300;font-weight:700}
.lien-evitement:focus{left:0}
main{display:block}
.annonce a{color:inherit}

/* Menu : sous-liens */
.menu li{list-style:none}
.menu .sous{list-style:none;display:flex;flex-wrap:wrap;gap:4px 26px;padding:0 0 18px calc(2.2em + 24px)}
.menu .sous li,.menu .sous li:last-child{border:0}
.menu ol .sous a{font-family:var(--mono);font-size:14px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:rgba(255,255,255,.85);padding:4px 0;border-bottom:1px solid transparent}
.menu ol .sous a:hover{color:var(--blanc);border-bottom-color:var(--blanc)}
.liens-rapides a[aria-current="page"]{border-bottom-color:var(--rouge)}

/* Sorties : le contenu vient de la base ; sans photo, une tuile de couleur */
.g-12{grid-column:span 12}
.voyage{min-height:340px;padding:clamp(22px,2.6vw,36px);display:flex;flex-direction:column;justify-content:space-between;gap:22px;color:var(--blanc)}
.voyage--1{background:var(--nuit)}.voyage--2{background:var(--bleu)}.voyage--3{background:var(--rouge)}.voyage--4{background:var(--encre)}
.voyage .lieu{font-weight:900;font-size:clamp(3rem,7vw,6rem);letter-spacing:-.045em;line-height:.92}
.voyage h3{font-size:clamp(1.3rem,2vw,1.8rem);margin-top:6px}
.voyage p{font-size:16px;line-height:1.5;max-width:32em;opacity:.95}
.voyage .etiquette{opacity:.9}
.cellule .legende p{font-size:14px;line-height:1.4;font-weight:400;margin-top:4px;max-width:26em}

/* Fenêtre d'annonce (affichée seulement si une annonce est active dans l'administration) */
.popup{position:fixed;inset:0;z-index:120;background:rgba(18,21,104,.72);display:none;align-items:center;justify-content:center;padding:18px}
.popup.ouvert{display:flex}
.popup__carte{background:var(--blanc);max-width:440px;width:100%;border:1px solid var(--filet);position:relative;max-height:92vh;overflow:auto}
.popup__carte img{width:100%;height:auto}
.popup__corps{padding:22px 24px 26px;display:flex;flex-direction:column;gap:12px}
.popup__corps h3{font-size:26px;color:var(--nuit)}
.popup__corps p{font-size:17px;line-height:1.5}
.popup__fermer{position:absolute;top:0;right:0;width:46px;height:46px;background:var(--blanc);border:0;border-left:1px solid var(--filet);border-bottom:1px solid var(--filet);font-size:22px;line-height:1;cursor:pointer;z-index:2}
.popup__fermer:hover{background:var(--rouge);color:var(--blanc)}

/* Barre d'actions collée en bas, sur téléphone seulement */
.barre-mobile{display:none}
@media (max-width:760px){
  .barre-mobile{position:fixed;left:0;right:0;bottom:0;z-index:45;display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--filet)}
  .barre-mobile a{padding:16px 10px;text-align:center;font-weight:800;font-size:15px;text-decoration:none;color:var(--blanc)}
  .barre-mobile .rouge{background:var(--rouge)}
  .barre-mobile .nuit{background:var(--nuit)}
  body{padding-bottom:54px}
}


  .g-12.cellule--paysage{aspect-ratio:16/7}
  .g-12.voyage{min-height:300px}

  @media (max-width:600px){.lieu-bandeau{display:none}}

/* ================= Pages intérieures ================= */
.fil{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;display:flex;gap:10px;flex-wrap:wrap;color:var(--nuit)}
.fil a{text-decoration:none;border-bottom:1px solid transparent}
.fil a:hover{border-bottom-color:var(--rouge)}
.fil [aria-current]{color:var(--rouge)}

.entete-page{display:grid;grid-template-columns:repeat(12,1fr);border-bottom:1px solid var(--filet)}
.entete-page__texte{grid-column:1 / span 7;padding:clamp(32px,5vw,72px) var(--marge) clamp(36px,5vw,64px);display:flex;flex-direction:column;gap:26px}
.entete-page h1{font-size:clamp(2.6rem,6vw,5.6rem);color:var(--nuit)}
.entete-page h1 em{font-style:normal;color:var(--rouge)}
.entete-page .intro{max-width:34em;font-size:clamp(18px,1.6vw,21px)}
.entete-page__boutons{display:flex;gap:14px;flex-wrap:wrap}
.entete-page__resume{grid-column:8 / span 5;background:var(--nuit);color:var(--blanc);border-left:1px solid var(--filet);padding:clamp(28px,3.4vw,52px);display:flex;flex-direction:column;justify-content:flex-end;gap:22px}
.entete-page__resume .etiquette{opacity:.85}
@media (max-width:960px){
  .entete-page__texte,.entete-page__resume{grid-column:1 / -1}
  .entete-page__resume{border-left:0;border-top:1px solid var(--filet)}
}

/* Parcours en 4 étapes */
.parcours{list-style:none;display:grid;grid-template-columns:repeat(var(--n,4),1fr);border-top:2px solid var(--encre);border-left:1px solid var(--filet)}
.parcours>li{padding:clamp(22px,2.4vw,34px);border-right:1px solid var(--filet);border-bottom:1px solid var(--filet);display:flex;flex-direction:column;gap:14px;min-height:300px}
.parcours b{display:block;font-size:clamp(3.6rem,6.4vw,6rem);font-weight:900;letter-spacing:-.05em;line-height:.9;color:var(--bleu)}
.parcours h3{font-size:clamp(1.4rem,2vw,1.8rem);color:var(--nuit)}
.parcours p{font-size:17px;line-height:1.5}
@media (max-width:960px){.parcours{grid-template-columns:1fr 1fr}.parcours>li{min-height:240px}}
@media (max-width:560px){.parcours{grid-template-columns:1fr}}

/* Pièces à fournir + téléchargements */
.dossier{display:grid;grid-template-columns:repeat(12,1fr);border-top:2px solid var(--encre)}
.pieces{grid-column:1 / span 7;grid-row:1;list-style:none;padding-right:clamp(0px,3vw,48px)}
.pieces li{display:grid;grid-template-columns:54px 1fr;gap:14px;padding:17px 0;border-bottom:1px solid var(--filet);align-items:baseline;font-size:19px;font-weight:500;line-height:1.4}
.pieces li b{font-family:var(--mono);font-size:13px;font-weight:500;color:var(--rouge)}
.dossier__note{grid-column:1 / span 7;grid-row:2;padding:22px 0 0;max-width:34em;font-size:17px}
.telecharger{grid-column:8 / span 5;grid-row:1 / span 2;background:var(--voile);border:1px solid var(--filet);border-top:0;padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:18px;align-self:start;margin-top:-1px}
.telecharger h3{font-size:clamp(1.6rem,2.4vw,2.2rem);color:var(--nuit)}
.telecharger p{font-size:17px}
.telecharger .btn{justify-content:space-between}
@media (max-width:960px){.pieces,.dossier__note,.telecharger{grid-column:1 / -1;grid-row:auto}.pieces{padding-right:0}.telecharger{margin-top:28px;border-top:1px solid var(--filet)}}

/* Frais de scolarité */
.frais{width:100%;border-collapse:collapse;border-top:2px solid var(--encre)}
.frais th{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;text-align:left;color:var(--nuit);padding:14px 14px 14px 0;border-bottom:1px solid var(--filet);vertical-align:bottom}
.frais td{padding:18px 14px 18px 0;border-bottom:1px solid var(--filet);font-size:19px;white-space:nowrap}
.frais td.nom-filiere{font-weight:800;font-size:clamp(1.3rem,2vw,1.8rem);letter-spacing:-.02em;color:var(--nuit);white-space:normal}
.frais td.total{font-weight:800}
.frais td.niveau{font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.nom-mobile{display:none}
@media (max-width:820px){
  .frais thead{display:none}
  .frais,.frais tbody,.frais tr{display:block}
  .frais tr{border-bottom:1px solid var(--filet);padding:14px 0}
  .frais td{display:flex;justify-content:space-between;gap:16px;border:0;padding:5px 0;white-space:normal;font-size:18px}
  .frais td::before{content:attr(data-label);font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--nuit);flex:0 0 auto}
  .frais td.nom-filiere{display:none}
  .nom-mobile{display:inline}
}
.regles{margin-top:28px}
.regles .cellule--nuit,.regles .cellule--bleu{min-height:200px}
.regles p{font-size:18px}

/* Comptes bancaires (page Admissions) */
.g-7{grid-column:span 7}.g-5{grid-column:span 5}
@media (max-width:960px){.g-7,.g-5{grid-column:span 12}}
.cellule--voile{background:var(--voile);padding:clamp(22px,2.6vw,36px);display:grid;grid-template-columns:5fr 7fr;gap:18px clamp(20px,3vw,48px);align-items:start}
.cellule--voile h3{font-size:clamp(1.6rem,2.4vw,2.2rem);color:var(--nuit);margin-top:14px}
.cellule--voile p{font-size:18px;line-height:1.5;max-width:36em}
@media (max-width:960px){.cellule--voile{grid-template-columns:1fr}}
.comptes{list-style:none;border-top:1px solid rgba(255,255,255,.5)}
.comptes li{display:grid;grid-template-columns:1fr auto auto;gap:14px 22px;align-items:center;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.5)}
.comptes strong{display:block;font-size:22px;font-weight:800;letter-spacing:-.01em}
.comptes .sous{display:block;font-size:14px;opacity:.85}
.comptes .numero .etiquette{display:block;opacity:.75;margin-bottom:2px}
.comptes code{font-family:var(--mono);font-size:clamp(17px,1.7vw,21px);font-weight:500;letter-spacing:.03em;word-break:break-all}
.copier{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:500;color:var(--blanc);background:transparent;border:1px solid var(--blanc);padding:10px 14px;cursor:pointer;transition:background .15s,color .15s}
.copier:hover,.copier.fait{background:var(--blanc);color:var(--nuit)}
@media (max-width:640px){.comptes li{grid-template-columns:1fr auto}.comptes .numero{grid-column:1 / -1;order:3}}


/* ================= Pages de filières ================= */
.entete-page__photo{grid-column:8 / span 5;position:relative;min-height:460px;border-left:1px solid var(--filet);overflow:hidden}
.entete-page__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:960px){.entete-page__photo{grid-column:1 / -1;border-left:0;border-top:1px solid var(--filet);min-height:340px}}

.presentation{display:grid;grid-template-columns:repeat(12,1fr);gap:20px 0;align-items:end}
.presentation>div{grid-column:1 / span 6;padding-right:clamp(0px,3vw,48px)}
.presentation>p{grid-column:7 / span 6;font-size:clamp(18px,1.6vw,21px);max-width:32em}
.presentation h2{font-size:clamp(2.2rem,4.6vw,4.2rem);color:var(--nuit);margin-top:14px}
@media (max-width:960px){.presentation>div,.presentation>p{grid-column:1 / -1;padding-right:0}}

.programme{list-style:none;border-top:2px solid var(--encre)}
.programme li{display:grid;grid-template-columns:140px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid var(--filet);align-items:baseline}
.programme b{font-size:clamp(2rem,3.4vw,3rem);font-weight:900;letter-spacing:-.04em;color:var(--bleu);line-height:1}
.programme span{font-size:19px;line-height:1.5;max-width:46em}
@media (max-width:640px){.programme li{grid-template-columns:1fr;gap:4px}}

.montant{font-size:clamp(2.4rem,5vw,4.6rem);font-weight:900;letter-spacing:-.04em;line-height:1}
.montant span{font-size:.3em;font-weight:700;letter-spacing:0;opacity:.9}

.fiches{display:grid;grid-template-columns:repeat(5,1fr);border-top:2px solid var(--encre);border-left:1px solid var(--filet)}
.fiche-pdf{display:flex;flex-direction:column;justify-content:space-between;gap:28px;min-height:220px;padding:clamp(18px,2vw,28px);border-right:1px solid var(--filet);border-bottom:1px solid var(--filet);text-decoration:none;position:relative;transition:background .15s,color .15s}
.fiche-pdf b{font-size:clamp(2.6rem,4.4vw,4.2rem);font-weight:900;letter-spacing:-.05em;line-height:.9;color:var(--bleu)}
.fiche-pdf>span:nth-child(2){display:flex;flex-direction:column;gap:2px}
.fiche-pdf .fleche{position:absolute;top:16px;right:18px;font-size:22px}
.fiche-pdf:hover{background:var(--nuit);color:var(--blanc)}
.fiche-pdf:hover b{color:var(--blanc)}
.fiche-pdf:hover .fleche{transform:translateY(4px)}
@media (max-width:960px){.fiches{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.fiches{grid-template-columns:1fr}.fiche-pdf{min-height:150px}}
.cellule--nuit .montant,.cellule--bleu .montant{font-size:clamp(2.6rem,5.2vw,4.8rem);max-width:none;line-height:1}
.cellule--nuit .montant span,.cellule--bleu .montant span{font-size:.28em;font-weight:700;letter-spacing:0;opacity:.9}

.parcours--court>li{min-height:170px}

/* ================= Page « Nos filières » ================= */
.rangs{border-top:2px solid var(--encre)}
.rang{display:grid;grid-template-columns:repeat(12,1fr);border-bottom:1px solid var(--filet)}
.rang__photo{grid-column:1 / span 5;grid-row:1;position:relative;min-height:440px;border-right:1px solid var(--filet);overflow:hidden;display:block}
.rang__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.rang:hover .rang__photo img{transform:scale(1.03)}
.rang__texte{grid-column:6 / span 7;grid-row:1;padding:clamp(24px,3.4vw,52px);display:flex;flex-direction:column;justify-content:space-between;gap:28px}
.rang--inverse .rang__photo{grid-column:8 / span 5;border-right:0;border-left:1px solid var(--filet)}
.rang--inverse .rang__texte{grid-column:1 / span 7}
.rang__num{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--rouge);font-weight:500}
.rang h2{font-size:clamp(2.6rem,5.4vw,5rem);margin:10px 0 14px}
.rang h2 a{text-decoration:none;color:var(--nuit)}
.rang h2 a:hover{text-decoration:underline;text-decoration-thickness:4px;text-underline-offset:8px;text-decoration-color:var(--rouge)}
.rang__texte p{font-size:clamp(18px,1.6vw,21px);max-width:30em}
.tags{list-style:none;display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.tags li{border:1px solid var(--filet);padding:7px 12px;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.rang__bas{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap}
.rang__frais{font-family:var(--mono);font-size:13px;line-height:1.8;text-transform:uppercase;letter-spacing:.04em}
.rang__frais b{font-weight:500;color:var(--nuit)}
@media (max-width:960px){
  .rang__photo,.rang__texte,.rang--inverse .rang__photo,.rang--inverse .rang__texte{grid-column:1 / -1;grid-row:auto}
  .rang__photo,.rang--inverse .rang__photo{min-height:300px;border:0;border-bottom:1px solid var(--filet)}
}

/* ================= Page Contact ================= */
.lien-clair{color:inherit;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.45)}
.lien-clair:hover{border-bottom-color:var(--blanc);background:var(--rouge)}

.contact-grille{display:grid;grid-template-columns:repeat(12,1fr);border-top:2px solid var(--encre);border-bottom:1px solid var(--filet)}
.contact-aide{grid-column:1 / span 4;padding:clamp(24px,3vw,44px) clamp(20px,2.4vw,36px) clamp(24px,3vw,44px) 0;border-right:1px solid var(--filet);display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.contact-aide h3{font-size:clamp(1.6rem,2.4vw,2.2rem);color:var(--nuit)}
.contact-aide p{font-size:17px}
.contact-aide .btn{width:100%;justify-content:space-between}
.note{font-size:15px;line-height:1.5;opacity:.85}
.note a{text-decoration:underline;text-underline-offset:3px}
.formulaire{grid-column:5 / span 8;padding:clamp(24px,3vw,44px) 0 clamp(24px,3vw,44px) clamp(20px,3vw,48px)}
.champs{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.champ{display:flex;flex-direction:column;gap:8px}
.champ--plein{grid-column:1 / -1}
.champ label{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--nuit)}
.champ input,.champ select,.champ textarea{font:inherit;font-size:18px;width:100%;padding:15px 16px;border:2px solid var(--encre);background:var(--blanc);color:var(--encre);border-radius:0;transition:border-color .15s}
.champ textarea{resize:vertical;min-height:160px;line-height:1.5}
.champ input::placeholder,.champ textarea::placeholder{color:#6b6b78}
.champ input:focus,.champ select:focus,.champ textarea:focus{outline:3px solid var(--bleu);outline-offset:0;border-color:var(--bleu)}
.champ select{appearance:none;-webkit-appearance:none;padding-right:44px;
  background-image:linear-gradient(45deg,transparent 50%,var(--encre) 50%),linear-gradient(135deg,var(--encre) 50%,transparent 50%);
  background-position:calc(100% - 22px) 52%,calc(100% - 16px) 52%;background-size:6px 6px,6px 6px;background-repeat:no-repeat}
.champ [aria-invalid="true"]{border-color:var(--rouge)}
.piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.formulaire__bas{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:26px}
.formulaire__bas .btn:disabled{opacity:.6;cursor:wait}
.alerte{display:none;margin-top:22px;padding:16px 18px;border:2px solid;font-weight:700;font-size:17px;line-height:1.4}
.alerte.ok{display:block;border-color:var(--bleu);background:var(--voile);color:var(--nuit)}
.alerte.erreur{display:block;border-color:var(--rouge);background:var(--blanc);color:var(--rouge)}
@media (max-width:960px){
  .contact-aide,.formulaire{grid-column:1 / -1;padding-left:0;padding-right:0}
  .contact-aide{border-right:0;border-bottom:1px solid var(--filet)}
  .champs{grid-template-columns:1fr}
}

.carte{position:relative;aspect-ratio:21/9;min-height:320px;border:1px solid var(--filet);background:var(--voile);overflow:hidden;
  background-image:linear-gradient(rgba(33,38,202,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(33,38,202,.12) 1px,transparent 1px);background-size:48px 48px}
.carte iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.carte__invite{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:16px;padding:clamp(22px,4vw,56px)}
.carte__invite p{font-weight:800;font-size:clamp(1.6rem,3.2vw,3rem);letter-spacing:-.02em;line-height:1.05;color:var(--nuit);max-width:16em}
@media (max-width:640px){.carte{aspect-ratio:auto;min-height:380px}}

.g-4{grid-column:span 4}
@media (max-width:960px){.g-4{grid-column:span 12}}

/* ================= Actualités ================= */
.entete-page--simple{display:block}
.teinte-1{background:var(--nuit);color:var(--blanc)}
.teinte-2{background:var(--bleu);color:var(--blanc)}
.teinte-3{background:var(--rouge);color:var(--blanc)}
.teinte-4{background:var(--encre);color:var(--blanc)}

.actu__visuel{position:relative;aspect-ratio:4/3;overflow:hidden;display:block;border:1px solid var(--filet)}
.actu__visuel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.actu__visuel--date{display:flex;flex-direction:column;justify-content:space-between;padding:clamp(18px,2vw,28px)}
.actu__jour{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.actu__jour b{font-size:clamp(4rem,8vw,7rem);font-weight:900;letter-spacing:-.05em;line-height:.85}
.actu__jour span{font-family:var(--mono);font-size:14px;letter-spacing:.08em;text-transform:uppercase}
.actu__meta{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}
.actu__meta .etiquette{color:var(--nuit)}
.actu__meta .actu__cat{color:var(--rouge)}

.actus-grille{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,44px) clamp(18px,2.4vw,36px)}
.actu{display:flex;flex-direction:column;gap:18px}
.actu__lien{display:block;text-decoration:none}
.actu:hover .actu__visuel img{transform:scale(1.03)}
.actu__corps{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.actu h3{font-size:clamp(1.3rem,1.8vw,1.65rem);line-height:1.12}
.actu h3 a{text-decoration:none;color:var(--encre)}
.actu h3 a:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:5px;text-decoration-color:var(--rouge)}
.actu__extrait{font-size:17px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:960px){.actus-grille{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.actus-grille{grid-template-columns:1fr}}

.actu-une{display:grid;grid-template-columns:repeat(12,1fr);border:1px solid var(--filet);margin-bottom:clamp(30px,4vw,56px)}
.actu-une__visuel{grid-column:1 / span 7;display:block;min-width:0;overflow:hidden;position:relative;min-height:clamp(320px,34vw,560px);border-right:1px solid var(--filet)}
.actu-une__visuel .actu__visuel{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;border:0}
.actu-une__texte{grid-column:8 / span 5;padding:clamp(24px,3.4vw,52px);display:flex;flex-direction:column;justify-content:center;gap:18px;align-items:flex-start}
.actu-une h2{font-size:clamp(2rem,3.6vw,3.4rem);color:var(--nuit)}
.actu-une h2 a{text-decoration:none}
.actu-une h2 a:hover{text-decoration:underline;text-decoration-thickness:4px;text-underline-offset:7px;text-decoration-color:var(--rouge)}
.actu-une .actu__extrait{-webkit-line-clamp:5;font-size:clamp(17px,1.4vw,19px)}
@media (max-width:960px){.actu-une__visuel,.actu-une__texte{grid-column:1 / -1}.actu-une__visuel{border-right:0;border-bottom:1px solid var(--filet);min-height:0;aspect-ratio:16/10}}

.pagination{display:flex;gap:0;margin-top:clamp(36px,5vw,64px);border:1px solid var(--filet);width:max-content;max-width:100%;flex-wrap:wrap}
.pagination a{min-width:52px;height:52px;display:grid;place-items:center;padding:0 14px;text-decoration:none;font-family:var(--mono);font-size:15px;font-weight:500;border-right:1px solid var(--filet)}
.pagination a:last-child{border-right:0}
.pagination a:hover{background:var(--voile)}
.pagination a[aria-current="page"]{background:var(--nuit);color:var(--blanc)}

/* Page d'un article */
.article__tete{padding-bottom:clamp(24px,3vw,40px)}
.article__titre{font-size:clamp(2.2rem,5vw,4.6rem);color:var(--nuit);max-width:20em;margin-top:6px}
.article__tete .intro{max-width:36em;margin-top:22px;font-size:clamp(18px,1.6vw,21px)}
.article__couverture{margin:0 var(--marge);border:1px solid var(--filet);overflow:hidden}
.article__couverture>img{display:block;width:100%;height:clamp(300px,36vw,620px);object-fit:cover}
.article__couverture .actu__visuel{aspect-ratio:auto;height:clamp(170px,15vw,250px);border:0}
.article__couverture .actu__jour b{font-size:clamp(3.2rem,5vw,5rem)}
.article__corps{max-width:760px;margin:0 auto;padding-top:clamp(32px,5vw,64px);padding-bottom:clamp(24px,3vw,40px)}
.article__corps p{font-size:clamp(18px,1.5vw,20px);line-height:1.75;margin:0 0 1.2em}
.article__corps strong{font-weight:800}
.article__corps figure{margin:2em 0}
.article__corps figure img{display:block;width:100%;height:auto;border:1px solid var(--filet)}
.article__media{margin:2em 0}
.article__media iframe{display:block;width:100%;aspect-ratio:16/9;height:auto;border:0}
.article__pied{max-width:760px;margin:0 auto;padding-top:20px;padding-bottom:clamp(40px,6vw,80px);display:flex;gap:12px;align-items:center;flex-wrap:wrap;border-top:1px solid var(--filet)}
.article__pied .etiquette{margin-left:auto;color:var(--nuit)}
@media (max-width:620px){.article__pied .etiquette{margin-left:0;width:100%}}

.actu-une__visuel{text-decoration:none}

.actu__jour--texte b{font-size:clamp(1.9rem,3.4vw,3.2rem);letter-spacing:-.03em;line-height:1}
.article__couverture .actu__jour--texte b{font-size:clamp(2rem,3.6vw,3.6rem)}

/* ================= L'école (À propos) ================= */
.directeur .message p{font-size:clamp(18px,1.5vw,20px);line-height:1.7;max-width:36em;margin:0 0 1em}
.directeur .message .citation{font-weight:800;font-size:clamp(1.3rem,2vw,1.8rem);line-height:1.25;letter-spacing:-.015em;color:var(--nuit);border-left:4px solid var(--rouge);padding-left:20px;margin-top:1.4em}
.texte-long p{font-size:clamp(18px,1.5vw,20px);line-height:1.7;max-width:36em;margin:0 0 1em}
.presentation>.texte-long{grid-column:7 / span 6;align-self:start}
@media (max-width:960px){.presentation>.texte-long{grid-column:1 / -1}}
.chiffres--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:960px){.chiffres--4{grid-template-columns:1fr 1fr}.chiffres--4 .chiffre:nth-child(2){border-right:0}.chiffres--4 .chiffre:nth-child(-n+2){border-bottom:1px solid var(--filet)}}
@media (max-width:560px){.chiffres--4{grid-template-columns:1fr}.chiffres--4 .chiffre{border-right:0;border-bottom:1px solid var(--filet)}.chiffres--4 .chiffre:last-child{border-bottom:0}}

.chronologie{list-style:none;border-top:2px solid var(--encre)}
.chronologie>li{display:grid;grid-template-columns:200px 1fr;gap:20px clamp(20px,3vw,48px);padding:clamp(22px,3vw,36px) 0;border-bottom:1px solid var(--filet);align-items:start}
.chronologie b{font-size:clamp(3rem,6vw,5.4rem);font-weight:900;letter-spacing:-.05em;line-height:.9;color:var(--bleu)}
.chronologie h3{font-size:clamp(1.5rem,2.4vw,2.2rem);color:var(--nuit);margin-bottom:10px}
.chronologie p{font-size:18px;line-height:1.6;max-width:42em;margin:0 0 .8em}
@media (max-width:760px){.chronologie>li{grid-template-columns:1fr;gap:6px}}

/* ================= Équipe pédagogique ================= */
.recherche{display:flex;flex-direction:column;gap:8px;max-width:640px}
.recherche .etiquette{color:var(--nuit)}
.recherche input{font:inherit;font-size:18px;width:100%;padding:15px 16px;border:2px solid var(--encre);background:var(--blanc);border-radius:0;-webkit-appearance:none;appearance:none}
.recherche input:focus{outline:3px solid var(--bleu);outline-offset:0;border-color:var(--bleu)}
.recherche__info{font-family:var(--mono);font-size:13px;letter-spacing:.04em;min-height:1.4em;color:var(--rouge)}

.equipe-grille{display:grid;grid-template-columns:repeat(3,1fr);border-top:2px solid var(--encre);border-left:1px solid var(--filet)}
.enseignant{padding:clamp(20px,2vw,30px);border-right:1px solid var(--filet);border-bottom:1px solid var(--filet);display:flex;flex-direction:column;gap:12px;min-width:0}
.enseignant[hidden]{display:none}
.enseignant__haut{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.enseignant__num{font-family:var(--mono);font-size:13px;font-weight:500;color:var(--rouge)}
.enseignant__annees{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--nuit);border:1px solid var(--filet);padding:4px 9px}
.enseignant h3{font-size:clamp(1.35rem,1.8vw,1.75rem);line-height:1.12;color:var(--nuit);font-weight:700;letter-spacing:-.02em}
.enseignant h3 strong{font-weight:900}
.enseignant__role{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;opacity:.8}
.enseignant .modules{list-style:none;border-top:1px solid var(--filet);margin-top:auto}
.enseignant .modules li{padding:9px 0;border-bottom:1px solid var(--filet);font-size:16px;line-height:1.35}
.enseignant details summary{cursor:pointer;list-style:none;font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;padding:11px 0;border-top:1px solid var(--filet);display:flex;justify-content:space-between;color:var(--nuit)}
.enseignant details summary::-webkit-details-marker{display:none}
.enseignant details summary::after{content:"+";font-size:18px;line-height:1}
.enseignant details[open] summary::after{content:"−"}
.enseignant--court{gap:8px}
.aucun-resultat{margin-top:24px;font-size:18px;font-weight:700}
@media (max-width:960px){.equipe-grille{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.equipe-grille{grid-template-columns:1fr}}

.chiffres--4 .chiffre b{font-size:clamp(2.6rem,4.6vw,5.4rem);white-space:nowrap}
