/* ===== 00-tokens.css ===== */
/* Charte DA v2 — tokens. Toute couleur, police ou rayon du site vient d'ici. */
/* Polices hébergées sur le site (src/polices/, licence OFL) : aucun appel à Google Fonts (RGPD). Caractères latins (français). */
@font-face { font-family: "Libre Caslon Display"; src: url("/polices/libre-caslon-display.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Literata"; src: url("/polices/literata.woff2") format("woff2"); font-weight: 200 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Literata"; src: url("/polices/literata-italique.woff2") format("woff2"); font-weight: 200 900; font-style: italic; font-display: swap; }

:root {
  color-scheme: light;
  --c-fond: #FBF8F3;  --c-creme: #F3EDE3;  --c-vert-pale: #E6EDDF;  --c-vert-teinte: #F2F6F1;  --c-blanc: #FFFFFF;
  --c-texte: #2B2622; --c-texte-2: #5F574F;
  --c-vert: #3D632D;  --c-vert-fonce: #2F5323;  --c-ocre: #9A5525;
  --c-dore: #E9C79B;  --c-vert-clair: #C9DDB8;
  --c-filet: #E3DACB; --c-bordure-ui: #8A8178;

  --f-titre: "Libre Caslon Display", Georgia, "Times New Roman", serif;
  --f-texte: "Literata", Georgia, "Times New Roman", serif;

  --t-xs: .8125rem; --t-s: .9375rem; --t-m: 1.0625rem; --t-l: 1.25rem;
  --t-surtitre: clamp(1.0625rem, .98rem + .4vw, 1.3125rem);   /* surtitres marron (repères de section), agrandis en v1.45 */
  --t-h2: clamp(1.875rem, 1.4rem + 1.6vw, 2.75rem);
  --t-h1: clamp(2.75rem, 1.6rem + 4.6vw, 5.25rem);

  --e-1: .25rem; --e-2: .5rem; --e-3: .75rem; --e-4: 1rem; --e-5: 1.5rem; --e-6: 2.25rem; --e-7: 3.5rem; --e-8: 5rem;
  --r-pilule: 999px; --r-carte: 1.25rem;
  --gouttiere: clamp(1.25rem, 4vw, 3rem);
  --conteneur: 72rem;
  --ease: cubic-bezier(.22, .8, .24, 1);
  --hauteur-entete: 5rem;
  interpolate-size: allow-keywords;
}
@media (max-width: 76em) { :root { --hauteur-entete: 4.5rem; } }


/* ===== 01-base.css ===== */
/* Base : typographie, liens, focus, utilitaires. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--hauteur-entete) + 1rem); }
body { margin: 0; background: var(--c-fond); color: var(--c-texte); font: 400 var(--t-m)/1.65 var(--f-texte); overflow-x: hidden; }
h1, h2 { font-family: var(--f-titre); font-weight: 400; line-height: 1.08; margin: 0; text-wrap: balance; }
h2 { font-size: var(--t-h2); }
h3, h4 { font-size: 1.125rem; font-weight: 600; line-height: 1.35; margin: 0; }
h1 em, h2 em, h3 em { font-style: italic; color: var(--c-vert); }
p, ul, ol, dl, dd, figure { margin: 0; }
img, svg { display: block; max-width: 100%; height: auto; }
a { color: var(--c-vert); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { color: var(--c-vert-fonce); text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--c-texte); outline-offset: 3px; border-radius: 3px; }
main:focus { outline: none; }

.visuellement-masque { position: absolute !important; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.conteneur { width: 100%; max-width: var(--conteneur); margin-inline: auto; padding-inline: var(--gouttiere); }
.conteneur--etroit { max-width: 52rem; }
.note { font-size: var(--t-s); color: var(--c-texte-2); }

.evitement { position: absolute; left: var(--e-4); top: -4rem; z-index: 100; padding: var(--e-3) var(--e-5); background: var(--c-vert-fonce); color: var(--c-fond); border-radius: var(--r-pilule); font-weight: 600; transition: top .2s; }
.evitement:focus { top: var(--e-4); color: var(--c-fond); }


/* ===== 05-composants.css ===== */
/* Composants réutilisables : boutons, listes à coches, en-tête de chapitre. */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--e-2);
  min-height: 2.875rem; padding: var(--e-3) var(--e-6);
  border: 1.5px solid transparent; border-radius: var(--r-pilule);
  font: 600 var(--t-s)/1.2 var(--f-texte); text-decoration: none; text-align: center; cursor: pointer;
  transition: background-color .2s, color .2s, transform .2s var(--ease), box-shadow .2s;
}
.btn:hover { transform: translateY(-2px); text-decoration: none; }
.btn--plein { background: var(--c-vert); color: var(--c-fond); box-shadow: 0 6px 16px -8px rgba(47, 83, 35, .6); }
.btn--plein:hover { background: var(--c-vert-fonce); color: var(--c-fond); }
.btn--contour { border-color: var(--c-vert); color: var(--c-vert); background: transparent; }
.btn--contour:hover { background: var(--c-vert); color: var(--c-fond); }
.actions { display: flex; flex-wrap: wrap; gap: var(--e-3); justify-content: center; }

.liste-coches { list-style: none; padding: 0; display: grid; gap: var(--e-2); }
.liste-coches li { position: relative; padding-left: 2rem; }
.liste-coches li::before { content: ""; position: absolute; left: .2rem; top: .4em; width: .45rem; height: .85rem; border: solid var(--c-vert); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }

/* Chapitres : bandes pleine largeur, numérotées */
.chapitre { padding-block: var(--e-8); }
.chapitre--vert { background: var(--c-vert-pale); }
.chapitre--creme { background: var(--c-creme); }
.chapitre-entete { display: grid; gap: var(--e-4); max-width: 46rem; margin-bottom: var(--e-7); }
.chapitre-entete__repere { display: flex; align-items: center; gap: var(--e-3); font-size: var(--t-surtitre); font-weight: 600; color: var(--c-ocre); }
.chapitre-entete__num { /* petite arche numérotée : motif de l'exèdre */
  display: grid; place-items: end center; width: 2.25rem; height: 2.75rem; padding-bottom: .3rem;
  border-radius: var(--r-pilule) var(--r-pilule) .3rem .3rem; background: var(--c-vert); color: var(--c-fond);
  font: 400 1.25rem/1 var(--f-titre);
}
.chapitre-entete__texte { font-size: var(--t-l); color: var(--c-texte-2); line-height: 1.55; }
.chapitre-entete--clair .chapitre-entete__repere { color: var(--c-dore); }
.chapitre-entete--clair .chapitre-entete__num { background: var(--c-vert-clair); color: var(--c-vert-fonce); }
.chapitre-entete--clair h2 em { color: var(--c-vert-clair); }
.chapitre-entete--clair .chapitre-entete__texte { color: var(--c-vert-clair); }

/* Fil d'Ariane (séparateur chevron dessiné en CSS, non lu par les lecteurs d'écran) */
.fil-ariane { padding-block: var(--e-4); font-size: var(--t-xs); }
.fil-ariane ol { display: flex; flex-wrap: wrap; gap: var(--e-2); list-style: none; padding: 0; margin: 0; }
.fil-ariane li { display: flex; align-items: center; gap: var(--e-2); }
.fil-ariane li + li::before { content: ""; width: .4em; height: .4em; border-top: 1px solid var(--c-texte-2); border-right: 1px solid var(--c-texte-2); transform: rotate(45deg); }
.fil-ariane a { color: var(--c-texte-2); }
.fil-ariane [aria-current="page"] { color: var(--c-texte); text-decoration: none; }

/* Logo Exedra (version claire) dans les arches décoratives sur fond sombre : accueil « Entreprises », contact, bandeaux « Candidater »
   — remplace le laurier seul. Apparition douce quand le bloc entre à l'écran. */
.decor-logo { display: block; width: 72%; height: auto; }
@media (prefers-reduced-motion: no-preference) {
  .js .decor-logo { opacity: 0; transform: translateY(10px) scale(.94); transition: opacity .9s var(--ease) .2s, transform .9s var(--ease) .2s; }
  .js .est-visible .decor-logo, .js .est-visible.decor-logo { opacity: 1; transform: none; }
}


/* ===== 10-entete.css ===== */
/* En-tête : logo, navigation à sous-menus, menu mobile, barre de progression. */
.progression { position: fixed; inset: 0 0 auto; height: 3px; z-index: 60; pointer-events: none; }
.progression__barre { display: block; height: 100%; width: 100%; background: var(--c-ocre); transform-origin: 0 50%; transform: scaleX(var(--avancement, 0)); }


/* Hauteur constante (--hauteur-entete) : la photo du haut de page se cale exactement dessous. */
.entete { position: sticky; top: 0; z-index: 50; background: rgba(251, 248, 243, .96); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: box-shadow .3s; }
.entete.est-reduit { box-shadow: 0 1px 0 var(--c-filet), 0 10px 30px -22px rgba(43, 38, 34, .45); }
.entete__contenu { display: flex; align-items: center; justify-content: space-between; gap: var(--e-5); height: var(--hauteur-entete); }
.entete__logo { flex: none; }
.entete__logo img { width: auto; max-width: none; height: 4rem; }

.navigation { display: flex; align-items: center; gap: var(--e-5); }
.menu { display: flex; gap: var(--e-1); list-style: none; padding: 0; }
.menu__item { position: relative; }
.menu__bouton {
  display: inline-flex; align-items: center; gap: var(--e-2); padding: var(--e-3) var(--e-4);
  background: none; border: 0; border-radius: var(--r-pilule); cursor: pointer;
  font: 600 var(--t-s)/1.2 var(--f-texte); color: var(--c-texte); transition: background-color .2s, color .2s;
}
.menu__bouton::after { content: ""; width: .4rem; height: .4rem; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: translateY(-2px) rotate(45deg); transition: transform .25s var(--ease); }
.menu__bouton:hover, .menu__bouton[aria-expanded="true"] { background: var(--c-creme); color: var(--c-vert-fonce); }
/* Entrée de menu simple (sans sous-menu), ex. « Accueil » */
.menu__lien {
  display: inline-flex; align-items: center; padding: var(--e-3) var(--e-4); border-radius: var(--r-pilule);
  font: 600 var(--t-s)/1.2 var(--f-texte); color: var(--c-texte); text-decoration: none; transition: background-color .2s, color .2s;
}
.menu__lien:hover { background: var(--c-creme); color: var(--c-vert-fonce); }
/* Page en cours : souligné vert, comme sur le site actuel */
.menu__lien.est-actif, .menu__bouton.est-actif { color: var(--c-vert-fonce); box-shadow: inset 0 -2px 0 var(--c-vert); border-radius: 0; }
.menu__bouton[aria-expanded="true"]::after { transform: translateY(2px) rotate(-135deg); }

.sous-menu {
  position: absolute; top: calc(100% + .75rem); left: 50%; min-width: 17rem;
  padding: var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  box-shadow: 0 24px 50px -24px rgba(43, 38, 34, .35);
  opacity: 0; visibility: hidden; transform: translate(-50%, -8px);
  transition: opacity .25s var(--ease), transform .25s var(--ease), visibility 0s .25s;
}
.sous-menu.est-ouvert { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s; }
.sous-menu__titre { margin-bottom: var(--e-3); font-size: var(--t-s); font-weight: 600; color: var(--c-ocre); }
.sous-menu__liste { list-style: none; padding: 0; display: grid; gap: var(--e-1); }
.sous-menu__liste--2col { grid-template-columns: repeat(2, minmax(11rem, auto)); column-gap: var(--e-6); }
.sous-menu__liste--2col a { white-space: nowrap; } /* un intitulé sur une seule ligne : pas de trou dans la colonne voisine */
.sous-menu__liste--themes { grid-template-columns: repeat(2, 15.5rem); } /* v1.50 : thématiques d'Exedra Formation, intitulés longs sur deux lignes */
.sous-menu__liste--themes a { white-space: normal; line-height: 1.35; }
.sous-menu__liste a { display: block; padding: var(--e-2) 0; color: var(--c-texte); text-decoration: none; font-size: var(--t-s); transition: color .2s, transform .2s var(--ease); }
.sous-menu__liste a:hover { color: var(--c-vert); transform: translateX(4px); }
.sous-menu__tous { display: inline-block; margin-top: var(--e-4); font-size: var(--t-s); font-weight: 600; }
.sous-menu__bouton { /* bouton dédié (ex. « CACES et Sécurité »), v1.45 */
  display: flex; align-items: center; gap: var(--e-1); width: max-content; margin-top: var(--e-3); padding: .55rem 1.15rem;
  border-radius: var(--r-pilule); background: var(--c-vert); color: var(--c-fond); font-size: var(--t-s); font-weight: 600; text-decoration: none;
  transition: background .2s, transform .2s var(--ease);
}
.sous-menu__bouton:hover { background: var(--c-vert-fonce); color: var(--c-fond); transform: translateX(3px); }
.sous-menu__tous + .sous-menu__bouton { margin-top: var(--e-3); }

.entete__burger { display: none; align-items: center; gap: var(--e-3); padding: var(--e-2) var(--e-4); background: none; border: 1.5px solid var(--c-vert); border-radius: var(--r-pilule); color: var(--c-vert); font: 600 var(--t-s)/1 var(--f-texte); cursor: pointer; }
.entete__burger-trait, .entete__burger-trait::before, .entete__burger-trait::after { display: block; width: 1.1rem; height: 2px; background: currentColor; border-radius: 2px; transition: transform .3s var(--ease), background-color .2s; }
.entete__burger-trait { position: relative; }
.entete__burger-trait::before, .entete__burger-trait::after { content: ""; position: absolute; left: 0; }
.entete__burger-trait::before { top: -6px; } .entete__burger-trait::after { top: 6px; }
.entete__burger[aria-expanded="true"] .entete__burger-trait { background: transparent; }
.entete__burger[aria-expanded="true"] .entete__burger-trait::before { transform: translateY(6px) rotate(45deg); }
.entete__burger[aria-expanded="true"] .entete__burger-trait::after { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 76em) {
  .js .entete__burger { display: inline-flex; }
  .js .navigation {
    position: fixed; inset: var(--hauteur-entete) 0 auto; overflow-y: auto; flex-direction: column; align-items: stretch; gap: var(--e-4);
    padding: var(--e-5) var(--gouttiere) var(--e-7); background: var(--c-fond); border-top: 1px solid var(--c-filet);
    opacity: 0; visibility: hidden; transform: translateY(-12px);
    transition: opacity .3s var(--ease), transform .3s var(--ease), visibility 0s .3s;
  }
  .js .navigation.est-ouverte { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
  .menu { flex-direction: column; }
  .menu__bouton { width: 100%; justify-content: space-between; padding: var(--e-4); font-size: var(--t-m); }
  .menu__lien { width: 100%; padding: var(--e-4); font-size: var(--t-m); }
  .sous-menu { position: static; transform: none; box-shadow: none; border: 0; padding: 0 var(--e-4) var(--e-4); min-width: 0; display: none; opacity: 1; visibility: visible; background: transparent; }
  .sous-menu.est-ouvert { display: block; transform: none; }
  .sous-menu__liste--2col { grid-template-columns: 1fr; }
  .sous-menu__liste--2col a { white-space: normal; }
  .entete__cta { align-self: flex-start; }
  .entete__logo img,   .entete__contenu, .entete.est-reduit .entete__contenu { min-height: var(--hauteur-entete); }
}

/* v1.46 : 6 entrées de menu (CACES et Sécurité + Exedra Formation) — libellés sur une ligne, espacements resserrés (v1.51 : à toutes les largeurs, pour que le logo ne soit plus écrasé) */
.menu__bouton, .menu__lien, .entete__cta { white-space: nowrap; }
@media (min-width: 76.01em) {
  .entete__contenu { gap: var(--e-3); }
  .navigation { gap: var(--e-3); }
  .menu { gap: 0; }
  .menu__bouton, .menu__lien { padding-inline: var(--e-3); }
  .entete__cta { padding-inline: var(--e-4); }
}


/* ===== 20-hero.css ===== */
/* Hero : la photo du centre, en entier et dans ses proportions d'origine.
   EFFET RIDEAU (grand écran) : la photo est fixée sous l'en-tête par le navigateur lui-même
   (position: fixed découpée par clip-path) ; la page défile et vient la recouvrir.
   Aucun script : le mouvement est géré par le moteur de rendu, donc parfaitement fluide. */
.hero {
  position: relative; isolation: isolate; display: grid; align-items: center; overflow: hidden; color: var(--c-fond);
  /* Hauteur = celle de la photo à la largeur de l'écran (rien n'est coupé), au moins 40rem, au plus 64rem ou la hauteur de la fenêtre.
     Le bandeau garde TOUJOURS toute la largeur : même en dézoomant, la photo ne se coupe plus sur le côté. */
  --h-hero: clamp(40rem, calc(100vw * var(--ratio-inverse, .5625)), max(64rem, calc(100vh - var(--hauteur-entete))));
  width: 100%;
  height: var(--h-hero);
  min-height: min-content;                  /* sauf si le texte a besoin de plus de place */
  padding-block: var(--e-6) calc(var(--e-8) + var(--e-3));
  background: var(--c-vert-fonce);
  clip-path: inset(0);                      /* découpe la photo fixe aux limites du bandeau */
}
.hero__photo { /* par défaut (mobile, animations réduites) : photo en fond du bandeau */
  position: absolute; inset: 0; z-index: -2;
}
@media (min-width: 60em) and (prefers-reduced-motion: no-preference) {
  .hero__photo { /* effet rideau : photo fixe, calée sous l'en-tête, à la largeur de l'écran */
    position: fixed; top: var(--hauteur-entete); left: 0; right: 0; bottom: auto;
    height: max(calc(100vw * var(--ratio-inverse, .5625)), 40rem);
  }
}
.hero__photo img {
  width: 100%; height: 100%; object-fit: cover; object-position: var(--cadrage, center);
  filter: saturate(.9) contrast(1.03);      /* accorde légèrement la photo à la palette */
}
.hero::before { /* deux couches : ombre sous l'en-tête, vert à gauche pour le texte. Bord bas net, comme un rideau. */
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, rgba(25, 45, 18, .4) 0%, rgba(25, 45, 18, 0) 18%),
    linear-gradient(90deg, rgba(28, 51, 21, .92) 0%, rgba(31, 56, 23, .85) 32%, rgba(40, 70, 30, .7) 46%, rgba(47, 83, 35, .3) 60%, rgba(47, 83, 35, 0) 76%);
}

.hero__grille { position: relative; display: grid; gap: var(--e-5); }
.hero__texte { display: grid; gap: var(--e-4); max-width: 40rem; }
.hero__surtitre { font-size: var(--t-s); font-weight: 600; color: var(--c-dore); }
.hero__titre { font-size: clamp(2.5rem, 1.5rem + 3.4vw, 4.5rem); letter-spacing: -.015em; text-shadow: 0 2px 24px rgba(20, 36, 14, .35); }
.hero__titre .mot { display: inline-block; }
.hero__titre em { color: var(--c-vert-clair); }
.hero__accroche { font-size: var(--t-l); line-height: 1.55; color: var(--c-fond); max-width: 34ch; text-shadow: 0 1px 12px rgba(20, 36, 14, .5); }
.hero :focus-visible { outline-color: var(--c-fond); }

.recherche {
  display: grid; gap: var(--e-3); padding: var(--e-4); margin-top: var(--e-2); color: var(--c-texte);
  background: var(--c-blanc); border-radius: 1.5rem; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .55);
}
.recherche :focus-visible { outline-color: var(--c-texte); }
.recherche__champ { display: grid; gap: var(--e-1); }
.recherche label { font-size: var(--t-xs); font-weight: 600; color: var(--c-texte-2); padding-left: var(--e-2); }
.recherche select {
  appearance: none; width: 100%; min-height: 2.875rem; padding: var(--e-2) 2.5rem var(--e-2) var(--e-4);
  border: 1.5px solid var(--c-bordure-ui); border-radius: .875rem; background: var(--c-fond) no-repeat right 1rem center / .7rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%232B2622' stroke-width='1.6'/%3E%3C/svg%3E");
  font: 500 var(--t-s)/1.3 var(--f-texte); color: var(--c-texte); cursor: pointer; transition: border-color .2s;
}
.recherche select:hover { border-color: var(--c-vert); }
@media (min-width: 40em) { .recherche { grid-template-columns: 1fr 1fr; align-items: end; } .recherche__bouton { grid-column: 1 / -1; } }
@media (min-width: 64em) { /* grand écran : formulaire sur une ligne, pour garder la photo visible en entier */
  .hero__texte { max-width: 48rem; }
  .recherche { grid-template-columns: 1fr 1fr auto; }
  .recherche__bouton { grid-column: auto; }
}

/* Pastilles : sous le formulaire, en verre dépoli, pour ne pas masquer le bâtiment */
.hero__pastilles { display: flex; flex-wrap: wrap; gap: var(--e-2); list-style: none; padding: 0; max-width: 40rem; }
.pastille-flottante {
  padding: var(--e-1) var(--e-4); border-radius: var(--r-pilule);
  background: rgba(251, 248, 243, .14); border: 1px solid rgba(251, 248, 243, .45); color: var(--c-fond);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  font-size: var(--t-xs); font-weight: 600; white-space: nowrap;
}

/* Mobile : le texte prend toute la place, la photo devient le fond sous un voile uniforme */
@media (max-width: 60em) {
  .hero { height: auto; min-height: 0; }
  .hero::before {
    background:
      linear-gradient(180deg, rgba(28, 51, 21, .88), rgba(31, 56, 23, .82));
  }
}

/* v1.50 : slogan sur une seule ligne dès que la place le permet (il passe à la ligne sur téléphone) */
@media (min-width: 48em) { .hero__accroche { max-width: none; white-space: nowrap; } }


/* ===== 30-sommaire.css ===== */
/* Sommaire de la page : les 5 chapitres, juste sous le hero. */
.sommaire-page { position: relative; z-index: 2; margin-top: calc(var(--e-6) * -1); }
.sommaire-page__liste { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: var(--e-2); list-style: none; }
.sommaire-page a {
  display: flex; align-items: center; gap: var(--e-3); height: 100%; padding: var(--e-3) var(--e-4);
  background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  color: var(--c-texte); font-weight: 600; font-size: var(--t-s); text-decoration: none;
  box-shadow: 0 18px 30px -26px rgba(43, 38, 34, .5);
  transition: transform .3s var(--ease), border-color .3s, color .3s;
}
.sommaire-page a:hover, .sommaire-page a:focus-visible { transform: translateY(-4px); border-color: var(--c-vert); color: var(--c-vert-fonce); }
.sommaire-page__num {
  flex: none; display: grid; place-items: end center; width: 1.75rem; height: 2.125rem; padding-bottom: .2rem;
  border-radius: var(--r-pilule) var(--r-pilule) .25rem .25rem; background: var(--c-vert-pale); color: var(--c-vert-fonce);
  font: 400 1rem/1 var(--f-titre); transition: background-color .3s, color .3s;
}
.sommaire-page a:hover .sommaire-page__num, .sommaire-page a:focus-visible .sommaire-page__num { background: var(--c-vert); color: var(--c-fond); }


/* ===== 31-ecole.css ===== */
/* Chapitre 1 — L'école : piliers, vidéo, chiffres. */
.piliers { display: grid; gap: var(--e-5); grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); list-style: none; padding: 0; margin-bottom: var(--e-8); }
.pilier { display: grid; gap: var(--e-3); align-content: start; padding-top: var(--e-4); border-top: 2px solid var(--c-filet); transition: border-color .4s; }
.pilier:hover { border-color: var(--c-vert); }
.pilier h3 { font: 400 1.5rem/1.2 var(--f-titre); }
.pilier p { color: var(--c-texte-2); }

.video { display: grid; gap: var(--e-6); align-items: center; margin-bottom: var(--e-8); }
@media (min-width: 60em) { .video { grid-template-columns: .8fr 1.2fr; } }
.video__texte { display: grid; gap: var(--e-4); }
.video__titre { font: 400 var(--t-h2)/1.1 var(--f-titre); }
.video__texte > p:first-of-type { font-size: var(--t-l); color: var(--c-texte-2); }
.video__cadre { position: relative; aspect-ratio: 16 / 9; border-radius: var(--r-carte); overflow: hidden; background: var(--c-vert-fonce); box-shadow: 0 40px 70px -45px rgba(47, 83, 35, .8); }
.video__affiche { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.video__lecture { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: var(--e-4); width: 100%; background: transparent; border: 0; color: var(--c-fond); cursor: pointer; font: 600 var(--t-s)/1.3 var(--f-texte); }
.video__icone { position: relative; width: 5rem; height: 5rem; border-radius: 50%; background: var(--c-fond); transition: transform .35s var(--ease); }
.video__icone::before { content: ""; position: absolute; left: 54%; top: 50%; transform: translate(-50%, -50%); border-style: solid; border-width: .75rem 0 .75rem 1.2rem; border-color: transparent transparent transparent var(--c-vert-fonce); }
.video__icone::after { content: ""; position: absolute; inset: -.5rem; border-radius: 50%; border: 2px solid var(--c-dore); opacity: 0; transform: scale(.85); transition: opacity .3s, transform .4s var(--ease); }
.video__lecture:hover .video__icone, .video__lecture:focus-visible .video__icone { transform: scale(1.08); }
.video__lecture:hover .video__icone::after, .video__lecture:focus-visible .video__icone::after { opacity: 1; transform: scale(1); }
.video__lecture:focus-visible { outline: 3px solid var(--c-dore); outline-offset: -6px; }
.video__libelle { padding: var(--e-1) var(--e-4); border-radius: var(--r-pilule); background: rgba(47, 83, 35, .8); }
.video__mention { position: absolute; left: 0; right: 0; bottom: 0; padding: var(--e-2) var(--e-4); font-size: .75rem; color: var(--c-vert-clair); background: linear-gradient(transparent, rgba(30, 50, 22, .85)); }
.video__mention a { color: var(--c-fond); }
.video__cadre iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.chiffres { display: grid; gap: var(--e-5); grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
.chiffre { display: grid; align-content: start; gap: var(--e-2); padding-top: var(--e-4); border-top: 2px solid var(--c-vert); }
.chiffre dd { order: -1; font: 400 clamp(3rem, 2rem + 3vw, 4.5rem)/1 var(--f-titre); color: var(--c-vert); font-variant-numeric: tabular-nums; }
.chiffre dt { color: var(--c-texte-2); }

/* Symbole de l'exèdre à côté du texte « Pourquoi Exedra » (v1.39) */
.ecole-entete { display: grid; gap: var(--e-6); align-items: center; margin-bottom: var(--e-7); }
.ecole-entete .chapitre-entete { margin-bottom: 0; }
/* Maquette 3D des locaux, dans une arche (même cadre que la page Contact) — v1.45 */
.ecole-maquette { position: relative; width: min(100%, 26rem); aspect-ratio: 5 / 6; justify-self: center; }
@media (min-width: 52em) {
  .ecole-entete { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: var(--e-8); }
  .ecole-maquette { width: min(100%, 30rem); justify-self: end; }
}
.ecole-entete__texte { display: grid; gap: var(--e-6); }
.ecole-exedre { width: 9rem; height: auto; fill: none; stroke: var(--c-vert); stroke-width: 2.5; opacity: .75; }   /* v1.46 : en petit sous le texte */
@media (forced-colors: active) { .ecole-exedre { stroke: CanvasText; } }
@media print { .ecole-maquette { display: none; } }


/* ===== 32-defilement.css ===== */
/* Bandeau défilant des secteurs (avec bouton pause). */
.defilement { position: relative; padding-block: var(--e-5) var(--e-3); background: var(--c-vert-fonce); color: var(--c-fond); overflow: hidden; }
.defilement__piste { display: flex; width: max-content; animation: defiler 48s linear infinite; }
.defilement.est-en-pause .defilement__piste { animation-play-state: paused; }
.defilement__liste { display: flex; list-style: none; padding: 0; }
.defilement__liste li { display: flex; align-items: center; gap: var(--e-6); padding-right: var(--e-6); font: 400 1.75rem/1.2 var(--f-titre); white-space: nowrap; }
.defilement__liste li::after { content: ""; width: .5rem; height: .65rem; border-radius: var(--r-pilule) var(--r-pilule) 1px 1px; background: var(--c-dore); }
.defilement__pause { display: block; margin: var(--e-3) var(--gouttiere) 0 auto; padding: var(--e-1) var(--e-3); background: var(--c-vert-fonce); color: var(--c-vert-clair); border: 1px solid rgba(201, 221, 184, .5); border-radius: var(--r-pilule); font: 600 .75rem/1.2 var(--f-texte); cursor: pointer; }
.defilement__pause:focus-visible { outline-color: var(--c-fond); }
@keyframes defiler { to { transform: translateX(-50%); } }



/* ===== 33-formations.css ===== */
/* Chapitre 2 — Nos formations : les deux marques.
   Les styles .domaine* servent à la future page « Nos formations » (grille des domaines avec photo). */
.marques { display: grid; gap: var(--e-5); grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr)); margin-bottom: var(--e-8); }
.marques:last-child { margin-bottom: 0; }
/* Trois cartes (v1.45) : une colonne sur mobile, 2 + 1 sur tablette, 3 côte à côte sur grand écran */
.marques--3 { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 40em) { .marques--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .marques--3 > .marque:last-child { grid-column: 1 / -1; } }
@media (min-width: 64em) { .marques--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .marques--3 > .marque:last-child { grid-column: auto; } .marques--3 .marque { padding: var(--e-5); } .marques--3 .marque h3 { font-size: 1.75rem; } }
.marque { display: flex; flex-direction: column; gap: var(--e-4); padding: var(--e-6); background: var(--c-blanc); border: 1px solid var(--c-filet); border-top: 3px solid var(--c-ocre); border-radius: var(--r-carte); transition: transform .4s var(--ease), box-shadow .4s var(--ease); }
.marque:hover { transform: translateY(-6px); box-shadow: 0 30px 50px -36px rgba(47, 83, 35, .55); }
.marque__surtitre { font-size: var(--t-surtitre); font-weight: 600; color: var(--c-ocre); }
.marque h3 { font: 400 2rem/1.15 var(--f-titre); }
.marque > p:not(.marque__surtitre) { color: var(--c-texte-2); }
.marque .btn { align-self: stretch; margin-top: auto; min-height: 3.875rem; padding-inline: var(--e-4); } /* v1.50 : mêmes boutons, alignés en bas, verts au survol seulement */

.domaines__titre { font: 400 1.75rem/1.2 var(--f-titre); margin-bottom: var(--e-5); }
.domaines { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr)); list-style: none; padding: 0; }
.domaine a {
  display: flex; flex-direction: column; height: 100%; overflow: hidden;
  background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  color: var(--c-texte); text-decoration: none; transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .3s;
}
.domaine__image { position: relative; display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--c-creme); }
.domaine__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.domaine__image::after { /* arche verte qui monte sur la photo au survol */
  content: ""; position: absolute; inset: 0; background: rgba(47, 83, 35, .55);
  border-radius: var(--r-pilule) var(--r-pilule) 0 0; transform: translateY(101%); transition: transform .55s var(--ease), border-radius .55s var(--ease);
}
.domaine__texte { display: grid; gap: var(--e-1); padding: var(--e-4); }
.domaine__nom { font: 400 1.3rem/1.2 var(--f-titre); }
.domaine__detail { font-size: var(--t-xs); color: var(--c-texte-2); }
.domaine a:hover, .domaine a:focus-visible { transform: translateY(-5px); box-shadow: 0 26px 40px -30px rgba(47, 83, 35, .65); border-color: var(--c-vert-clair); }
.domaine a:hover .domaine__image img, .domaine a:focus-visible .domaine__image img { transform: scale(1.07); }
.domaine a:hover .domaine__image::after, .domaine a:focus-visible .domaine__image::after { transform: translateY(0); border-radius: 0; }
.domaine--formation a { border-style: dashed; border-color: var(--c-bordure-ui); }
.domaine--formation .domaine__detail { color: var(--c-ocre); font-weight: 600; }
@media (max-width: 40em) {
  .domaines { grid-template-columns: 1fr 1fr; gap: var(--e-3); }
  .domaine__texte { padding: var(--e-3); }
  .domaine__nom { font-size: 1.1rem; }
}


/* ===== 34-situations.css ===== */
/* Chapitre 3 — Votre situation : onglets, faits clés, frise d'étapes. */
.onglets__liste { display: inline-flex; flex-wrap: wrap; gap: var(--e-1); padding: var(--e-1); margin-bottom: var(--e-6); background: var(--c-creme); border-radius: var(--r-pilule); }
.onglets__liste[hidden] { display: none; }
.onglets__onglet { padding: var(--e-3) var(--e-5); background: transparent; border: 0; border-radius: var(--r-pilule); cursor: pointer; font: 600 var(--t-s)/1.2 var(--f-texte); color: var(--c-texte-2); transition: background-color .3s var(--ease), color .3s, box-shadow .3s; }
.onglets__onglet:hover { color: var(--c-vert-fonce); }
.onglets__onglet[aria-selected="true"] { background: var(--c-vert); color: var(--c-fond); box-shadow: 0 8px 18px -10px rgba(47, 83, 35, .8); }
.onglets__panneau { display: grid; gap: var(--e-7); }
.onglets__panneau + .onglets__panneau { margin-top: var(--e-8); }        /* sans JavaScript : panneaux empilés */
.js .onglets__panneau + .onglets__panneau { margin-top: 0; }
.onglets__panneau[hidden] { display: none; }
.onglets__panneau:focus-visible { outline-offset: 8px; border-radius: var(--r-carte); }

.situation { display: grid; gap: var(--e-6); align-items: start; }
@media (min-width: 56em) { .situation { grid-template-columns: 1fr 1fr; } }
.situation__intro { display: grid; gap: var(--e-4); justify-items: start; }
.situation__intro h3 { font: 400 clamp(1.5rem, 1.2rem + 1vw, 2rem)/1.2 var(--f-titre); }
.situation__intro p { font-size: var(--t-l); color: var(--c-texte-2); }
.situation__faits { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: var(--e-3); }
.situation__faits div { padding: var(--e-4) var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte); }
.situation__faits dt { font-size: var(--t-m); font-weight: 600; color: var(--c-ocre); margin-bottom: var(--e-1); }
.situation__faits dd { font-size: var(--t-s); line-height: 1.5; }

.frise { position: relative; display: grid; gap: var(--e-5); list-style: none; padding: 0; counter-reset: etape; }
.frise::before, .frise::after { content: ""; position: absolute; border-radius: 2px; left: 1.3rem; top: .5rem; bottom: .5rem; width: 3px; }
.frise::before { background: var(--c-filet); }
.frise::after { background: var(--c-vert); transform-origin: 0 0; transform: scaleY(1); }
.frise__etape { position: relative; counter-increment: etape; display: grid; gap: var(--e-2); padding-left: 4rem; }
.frise__etape::before {
  content: counter(etape); position: absolute; left: 0; top: -.25rem; display: grid; place-items: center; z-index: 1;
  width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--c-vert); border: 2px solid var(--c-vert); color: var(--c-fond); font: 400 1.25rem/1 var(--f-titre);
}
.frise__etape h4 { font: 400 1.375rem/1.2 var(--f-titre); }
.frise__etape p { color: var(--c-texte-2); font-size: var(--t-s); }
@media (min-width: 56em) {
  .frise { grid-template-columns: repeat(4, 1fr); }
  .frise__etape { padding-left: 0; padding-top: 4rem; }
  .frise__etape::before { top: 0; }
  .frise::before, .frise::after { left: 1.3rem; right: 1.3rem; top: 1.3rem; bottom: auto; width: auto; height: 3px; }
  .frise::after { transform: scaleX(1); }
}

/* Questions propres à un onglet (« Et si j'ai plus de 29 ans ? ») — v1.38 */
.situation__questions { margin-top: var(--e-6); }
.situation__questions .situation__puces { padding: 0 var(--e-5) var(--e-4) calc(var(--e-5) + .25rem); display: grid; gap: var(--e-2); color: var(--c-texte-2); font-size: var(--t-s); }
.faq__item p a { color: var(--c-vert); font-weight: 600; }


/* ===== 35-entreprises.css ===== */
/* Chapitre 4 — Entreprises : bandeau vert foncé, laurier, portes d'entrée. */
.entreprises { position: relative; background: var(--c-vert-fonce); color: var(--c-fond); overflow: hidden; }
.entreprises a { color: var(--c-fond); }
.entreprises :focus-visible { outline-color: var(--c-fond); }
.entreprises__grille { display: grid; gap: 0 var(--e-6); }
.entreprises__decor { display: none; }
.laurier { color: var(--c-vert-clair); }
.laurier__tige { fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; }
.laurier__feuille { fill: currentColor; }
@media (min-width: 60em) {
  .entreprises__grille { grid-template-columns: 1fr 16rem; align-items: center; }
  .entreprises__decor { display: grid; place-items: center; aspect-ratio: 4 / 5; margin-bottom: var(--e-7); border: 1.5px solid rgba(201, 221, 184, .4); border-bottom: 0; border-radius: var(--r-pilule) var(--r-pilule) 0 0; }
  .laurier { width: 80%; }
  .entreprises__logo { width: 72%; height: auto; opacity: .95; }
  .portes { grid-column: 1 / -1; }
}
.portes { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); list-style: none; padding: 0; }
.porte { display: flex; flex-direction: column; gap: var(--e-3); padding: var(--e-5); border: 1px solid rgba(201, 221, 184, .35); border-radius: var(--r-carte); background: rgba(255, 255, 255, .04); transition: background-color .35s, border-color .35s, transform .35s var(--ease); }
.porte:hover { background: rgba(255, 255, 255, .09); border-color: var(--c-vert-clair); transform: translateY(-4px); }
.porte h3 { font: 400 1.5rem/1.2 var(--f-titre); }
.porte p { color: var(--c-vert-clair); font-size: var(--t-s); }
.porte a { margin-top: auto; font-weight: 600; }

/* Bouton « Contactez-nous » sous les portes (v1.38) */
.entreprises__action { grid-column: 1 / -1; margin-top: var(--e-5); }
.entreprises a.btn--clair { color: var(--c-vert-fonce); }


/* ===== 36-questions.css ===== */
/* Chapitre 5 — Questions : FAQ, puis bloc contact. */
.faq { display: grid; gap: var(--e-3); }
.faq__item { background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte); transition: border-color .3s, box-shadow .3s; }
.faq__item[open] { border-color: var(--c-vert-clair); box-shadow: 0 18px 36px -30px rgba(47, 83, 35, .6); }
.faq__item summary { display: flex; justify-content: space-between; align-items: center; gap: var(--e-4); padding: var(--e-4) var(--e-5); cursor: pointer; list-style: none; font-weight: 600; border-radius: var(--r-carte); }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after {
  content: ""; flex: none; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--c-vert-pale) no-repeat center / .75rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 1v10M1 6h10' stroke='%232F5323' stroke-width='1.8'/%3E%3C/svg%3E");
  transition: transform .35s var(--ease);
}
.faq__item[open] summary::after { transform: rotate(135deg); }
.faq__item p { padding: 0 var(--e-5) var(--e-5); color: var(--c-texte-2); }
.faq__item::details-content { block-size: 0; overflow: hidden; transition: block-size .35s var(--ease), content-visibility .35s allow-discrete; }
.faq__item[open]::details-content { block-size: auto; }

.contact { padding-block: var(--e-8); }
.contact__contenu { display: grid; gap: var(--e-4); justify-items: center; text-align: center; }
.contact__contenu > p { font-size: var(--t-l); color: var(--c-texte-2); max-width: 40ch; }


/* ===== 37-partenaires.css ===== */
/* Partenaires : mention « Avec nos partenaires » (catalogue, onglet alternance) et bandeau défilant de l'accueil.
   Les logos sont posés sur une carte blanche : ils restent lisibles quel que soit leur fond d'origine. */

/* ---------- « Avec nos partenaires » + logo ---------- */
.partenariat { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2) var(--e-4); }
.partenariat .partenariat__libelle { font-size: var(--t-xs); font-weight: 600; color: var(--c-ocre); }
.partenariat__logos { display: flex; flex-wrap: wrap; gap: var(--e-3); list-style: none; padding: 0; }
.partenariat__logo {
  display: flex; align-items: center; justify-content: center; padding: var(--e-2) var(--e-4);
  background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  transition: border-color .2s, transform .2s, box-shadow .2s;
}
.partenariat__logo img { display: block; height: 4rem; width: auto; max-width: none; }
a.partenariat__logo:hover { border-color: var(--c-vert); transform: translateY(-2px); box-shadow: 0 .5rem 1.25rem -.75rem rgba(47, 83, 35, .35); }
.partenariat__nom { display: block; padding-block: var(--e-2); font: 400 1.25rem/1 var(--f-titre); color: var(--c-texte); }
.partenariat--compact .partenariat__logo img { height: 3rem; }

/* ---------- Bandeau « Nos partenaires » (accueil) ---------- */
.partenaires { padding-block: var(--e-8) var(--e-6); background: var(--c-creme); overflow: hidden; }
.partenaires__entete { display: grid; justify-items: center; gap: var(--e-3); text-align: center; margin-bottom: var(--e-6); }
.partenaires__surtitre { font-size: var(--t-s); font-weight: 600; color: var(--c-ocre); }
.partenaires__surtitre::before { /* petite arche, comme les repères de chapitre */
  content: ""; display: inline-block; width: .55rem; height: .7rem; margin-right: var(--e-2); vertical-align: baseline;
  border-radius: var(--r-pilule) var(--r-pilule) 1px 1px; background: var(--c-vert);
}
.partenaires h2 { font-size: var(--t-h2); }
.partenaires__texte { max-width: 52ch; color: var(--c-texte-2); }

/* Le bandeau reprend la mécanique du bandeau des secteurs (.defilement), en version claire */
.defilement--partenaires { padding-block: var(--e-2) 0; background: transparent; color: var(--c-texte); }
.defilement--partenaires .defilement__piste { animation-duration: 40s; }
.defilement--partenaires:hover .defilement__piste,
.defilement--partenaires:focus-within .defilement__piste { animation-play-state: paused; }
.defilement--partenaires .defilement__liste li { padding-right: var(--e-5); gap: 0; font: inherit; }
.defilement--partenaires .defilement__liste li::after { content: none; }
.logo-partenaire {
  display: flex; align-items: center; justify-content: center; width: 13rem; height: 7rem; padding: var(--e-3) var(--e-5);
  background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  text-decoration: none; transition: border-color .2s, transform .2s, box-shadow .2s;
}
.logo-partenaire img { display: block; width: auto; height: auto; max-width: 100%; max-height: 5.25rem; }
a.logo-partenaire:hover { border-color: var(--c-vert); transform: translateY(-3px); box-shadow: 0 .75rem 1.5rem -1rem rgba(47, 83, 35, .4); }
.logo-partenaire__nom { font: 400 1.5rem/1.15 var(--f-titre); color: var(--c-vert-fonce); text-align: center; white-space: normal; }
.defilement--partenaires .defilement__pause { margin-top: var(--e-5); background: var(--c-blanc); color: var(--c-vert-fonce); border-color: var(--c-bordure-ui); }
.defilement--partenaires .defilement__pause:focus-visible { outline-color: var(--c-vert); }

@media (forced-colors: active) {
  .partenariat__logo, .logo-partenaire { border: 1px solid CanvasText; }
}

/* Variante sans titre, sur le fond de la page (page « Recruter un alternant », v1.42) */
.partenaires--clair { background: var(--c-creme); padding-block: var(--e-5) var(--e-3); }
.partenaires__mention { margin-bottom: var(--e-4); text-align: center; font-size: var(--t-s); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--c-blanc); }
.partenaires--clair .logo-partenaire { border-color: var(--c-filet); background: var(--c-blanc); }


/* ===== 40-pied.css ===== */
/* Pied de page : coordonnées, liens, Qualiopi, mentions. */
.pied { background: var(--c-vert-fonce); color: var(--c-fond); padding-block: var(--e-7) var(--e-5); font-size: var(--t-s); }
.pied a { color: var(--c-fond); }
.pied :focus-visible { outline-color: var(--c-fond); }
.pied__grille { display: grid; gap: var(--e-6); grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
/* v1.53 : 4 colonnes de liens (Formations, Alternance, Employeurs, Informations) + coordonnées, sur une seule ligne
   à partir de 64em ; en dessous, les colonnes se replient d'elles-mêmes (règle ci-dessus). */
@media (min-width: 64em) { .pied__grille { grid-template-columns: minmax(14.5rem, 1.3fr) repeat(4, minmax(0, 1fr)); gap: var(--e-6) var(--e-5); } }
.pied__identite a[href^="mailto:"] { white-space: nowrap; }   /* l'adresse e-mail ne se coupe pas en deux */
.pied__identite { display: grid; gap: var(--e-4); align-content: start; color: var(--c-vert-clair); }
.pied__identite img { width: 8rem; }
.pied__reseaux { display: flex; gap: var(--e-4); list-style: none; padding: 0; }
.pied__colonne h2 { font: 600 var(--t-s)/1.3 var(--f-texte); color: var(--c-dore); margin-bottom: var(--e-3); }
.pied__colonne ul { list-style: none; padding: 0; display: grid; gap: var(--e-2); }
.pied__colonne a { text-decoration-color: rgba(251, 248, 243, .4); }
.pied__qualite { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-4) var(--e-5); margin-top: var(--e-7); padding-top: var(--e-5); border-top: 1px solid rgba(201, 221, 184, .3); color: var(--c-vert-clair); font-size: var(--t-xs); }
.pied__qualite img { width: 8rem; padding: .375rem; background: var(--c-blanc); border-radius: .5rem; }
.pied__qualite p { flex: 1 1 24rem; max-width: 60rem; }
.pied__bas { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--e-3); margin-top: var(--e-5); padding-top: var(--e-4); border-top: 1px solid rgba(201, 221, 184, .3); color: var(--c-vert-clair); font-size: var(--t-xs); }


/* ===== 50-catalogue.css ===== */
/* Page « Nos formations » : en-tête, domaines-filtres, filtres, cartes des titres, renvoi Exedra Formation. */

.js-seulement { display: none !important; }
.js .js-seulement { display: revert !important; }
.js .cat-domaines.js-seulement { display: flex !important; }
.js .cat-filtres.js-seulement { display: grid !important; }

/* En-tête */
.cat-entete { position: relative; overflow: hidden; padding-block: 0 var(--e-7); background: var(--c-vert-pale); }
.cat-entete__grille { display: grid; gap: var(--e-6); align-items: center; }
.cat-entete__texte { display: grid; gap: var(--e-4); }
.cat-entete__surtitre { font-size: var(--t-surtitre); font-weight: 600; color: var(--c-ocre); }
.cat-entete__titre { font-size: clamp(2.5rem, 1.6rem + 3.4vw, 4.25rem); }
.cat-entete__accroche { font-size: var(--t-l); color: var(--c-texte-2); max-width: 40ch; }
.cat-entete__chiffres { display: flex; flex-wrap: wrap; gap: var(--e-5) var(--e-7); margin-top: var(--e-3); }
.cat-entete__chiffres div { display: grid; }
.cat-entete__chiffres dd { order: -1; font: 400 2.75rem/1 var(--f-titre); color: var(--c-vert); }
.cat-entete__chiffres dt { font-size: var(--t-s); color: var(--c-texte-2); }
.cat-entete__visuel { display: none; }
@media (min-width: 60em) {
  .cat-entete__grille { grid-template-columns: 1.3fr .7fr; }
  .cat-entete__visuel { /* l'arche signature, avec une photo de domaine */
    display: block; position: relative; justify-self: end; width: min(100%, 20rem); aspect-ratio: 4 / 5; margin-top: var(--e-6);
  }
  .cat-entete__visuel img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--r-pilule) var(--r-pilule) var(--r-carte) var(--r-carte); }
  .cat-entete__visuel::after { content: ""; position: absolute; inset: -.875rem -.875rem 35%; border: 1.5px solid var(--c-vert); border-bottom: 0; border-radius: var(--r-pilule) var(--r-pilule) 0 0; }
}

/* Domaines-filtres : bande horizontale défilante de cartes photo */
.catalogue { padding-block: var(--e-7) var(--e-8); }
.cat-domaines {
  gap: var(--e-3); margin: 0 calc(var(--gouttiere) * -1) var(--e-5); padding: var(--e-3) var(--gouttiere) var(--e-4); scroll-padding-inline: var(--gouttiere);
  overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: thin;
}
.cat-domaine {
  position: relative; flex: 0 0 auto; display: grid; align-content: end; gap: 2px; width: 10.5rem; height: 7.5rem; padding: var(--e-3);
  overflow: hidden; isolation: isolate; scroll-snap-align: start; text-align: left; cursor: pointer;
  background: var(--c-vert-fonce); color: var(--c-fond); border: 2px solid transparent; border-radius: var(--r-carte);
  font: inherit; transition: transform .3s var(--ease), border-color .3s, box-shadow .3s;
}
.cat-domaine img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.cat-domaine::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(25, 45, 18, .1) 20%, rgba(25, 45, 18, .85) 100%); transition: background-color .3s; }
.cat-domaine__nom { font: 400 1.1rem/1.15 var(--f-titre); }
@media (min-width: 64em) { /* grand écran : deux rangées de 5, sans défilement */
  .js .cat-domaines.js-seulement { flex-wrap: wrap; overflow: visible; margin-inline: 0; padding-inline: 0; }
  .cat-domaine { width: calc((100% - 4 * var(--e-3)) / 5); height: 7rem; }
}
.cat-domaine__nb { font-size: .75rem; color: var(--c-vert-clair); }
.cat-domaine:hover { transform: translateY(-3px); }
.cat-domaine:hover img { transform: scale(1.06); }
.cat-domaine:focus-visible { outline-color: var(--c-texte); }
.cat-domaine[aria-pressed="true"] { border-color: var(--c-ocre); box-shadow: 0 0 0 3px var(--c-fond), 0 0 0 5px var(--c-ocre); }
.cat-domaine--tous { background: var(--c-vert); }
.cat-domaine--tous::before { display: none; }
.cat-domaine--tous .cat-domaine__nom { font-size: 1.25rem; }

/* Filtres */
.cat-filtres {
  gap: var(--e-3); align-items: end; padding: var(--e-4); margin-bottom: var(--e-4);
  background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: 1.25rem;
}
@media (min-width: 48em) { .cat-filtres { grid-template-columns: 1.4fr 1fr 1fr auto; } }
.cat-filtres__champ { display: grid; gap: var(--e-1); }
.cat-filtres label { font-size: var(--t-xs); font-weight: 600; color: var(--c-texte-2); padding-left: var(--e-2); }
.cat-filtres input, .cat-filtres select {
  width: 100%; min-height: 2.875rem; padding: var(--e-2) var(--e-4); appearance: none;
  border: 1.5px solid var(--c-bordure-ui); border-radius: .875rem; background: var(--c-fond);
  font: 500 var(--t-s)/1.3 var(--f-texte); color: var(--c-texte); transition: border-color .2s;
}
.cat-filtres select {
  padding-right: 2.5rem; cursor: pointer; background: var(--c-fond) no-repeat right 1rem center / .7rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%232B2622' stroke-width='1.6'/%3E%3C/svg%3E");
}
.cat-filtres input:hover, .cat-filtres select:hover { border-color: var(--c-vert); }
.cat-filtres input::placeholder { color: var(--c-texte-2); }
.cat-filtres__effacer { min-height: 2.875rem; padding: 0 var(--e-4); background: none; border: 0; color: var(--c-vert); font: 600 var(--t-s)/1 var(--f-texte); text-decoration: underline; text-underline-offset: .2em; cursor: pointer; }

/* État : nombre de résultats, message de situation */
.cat-etat { display: grid; gap: var(--e-2); margin-bottom: var(--e-5); }
.cat-etat__nombre { font: 400 1.5rem/1.2 var(--f-titre); }
.cat-etat__situation { padding: var(--e-3) var(--e-4); background: var(--c-vert-pale); border-left: 3px solid var(--c-vert); border-radius: .5rem; font-size: var(--t-s); }
.cat-etat__situation a { font-weight: 600; }

/* Cartes des titres */
.titres { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); list-style: none; padding: 0; }
.titre[hidden] { display: none; }
.titre__carte {
  position: relative; display: flex; flex-direction: column; height: 100%; overflow: hidden;
  background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  transition: transform .4s var(--ease), box-shadow .4s var(--ease), border-color .3s;
}
.titre__carte:hover, .titre__carte:focus-within { transform: translateY(-5px); box-shadow: 0 26px 44px -30px rgba(47, 83, 35, .6); border-color: var(--c-vert-clair); }
.titre__image { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--c-creme); }
.titre__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.titre__carte:hover .titre__image img { transform: scale(1.06); }
.titre__niveau {
  position: absolute; left: var(--e-3); bottom: var(--e-3); padding: var(--e-1) var(--e-3); border-radius: var(--r-pilule);
  background: var(--c-fond); color: var(--c-vert-fonce); font-size: .75rem; font-weight: 600;
}
.titre__corps { display: flex; flex-direction: column; gap: var(--e-3); flex: 1; padding: var(--e-4) var(--e-4) var(--e-5); }
.titre__domaine { font-size: .75rem; font-weight: 600; color: var(--c-ocre); }
.titre__nom { font: 400 1.4rem/1.2 var(--f-titre); }
.titre__nom a { color: var(--c-texte); text-decoration: none; }
.titre__nom a::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: var(--r-carte); } /* toute la carte est cliquable */
.titre__nom a:focus-visible { outline: none; }
.titre__carte:focus-within { outline: 2px solid var(--c-texte); outline-offset: 3px; }
.titre__faits { display: flex; flex-wrap: wrap; gap: var(--e-1) var(--e-5); font-size: var(--t-s); }
.titre__faits div { display: flex; gap: var(--e-1); }
.titre__faits dt { color: var(--c-texte-2); }
.titre__faits dt::after { content: " :"; }
.titre__faits dd { font-weight: 600; }
.titre__voies { display: flex; flex-wrap: wrap; gap: var(--e-1); list-style: none; padding: 0; }
.titre__voies li { padding: 2px .625rem; border-radius: var(--r-pilule); background: var(--c-creme); color: var(--c-ocre); font-size: .75rem; font-weight: 600; }
.titre__plus { margin-top: auto; padding-top: var(--e-2); font-size: var(--t-s); font-weight: 600; color: var(--c-vert); }
.titre__plus::after { content: ""; display: inline-block; width: .45rem; height: .45rem; margin-left: .5rem; border: solid currentColor; border-width: 1.5px 1.5px 0 0; transform: rotate(45deg) translateY(-1px); transition: transform .3s var(--ease); }
.titre__carte:hover .titre__plus::after { transform: rotate(45deg) translate(3px, -4px); }

.cat-vide { display: grid; justify-items: start; gap: var(--e-4); padding: var(--e-6); background: var(--c-creme); border-radius: var(--r-carte); }
.cat-vide[hidden] { display: none; }

/* Renvoi Exedra Formation */
.cat-courte { padding-bottom: var(--e-7); }
.cat-courte__carte {
  display: grid; gap: var(--e-5); align-items: center; padding: var(--e-6);
  background: var(--c-vert-fonce); color: var(--c-fond); border-radius: var(--r-carte);
}
.cat-courte__carte h2 { font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.25rem); margin-bottom: var(--e-2); }
.cat-courte__carte h2 em { color: var(--c-vert-clair); }   /* « dans vos locaux » : lisible sur le vert foncé (contraste 6,1:1), v1.45 */
.cat-courte__carte p:not(.cat-courte__surtitre) { color: var(--c-vert-clair); max-width: 52ch; }
.cat-courte__surtitre { font-size: var(--t-surtitre); font-weight: 600; color: var(--c-dore); margin-bottom: var(--e-2); }
.cat-courte :focus-visible { outline-color: var(--c-fond); }
.cat-courte__actions { display: flex; flex-wrap: wrap; gap: var(--e-3); }   /* v1.46 : deux boutons */
@media (min-width: 56em) { .cat-courte__carte { grid-template-columns: 1fr auto; } }
.btn--clair { background: var(--c-fond); color: var(--c-vert-fonce); }
.btn--clair:hover { background: var(--c-blanc); color: var(--c-vert-fonce); }

/* Apparition des cartes après un filtrage */
@media (prefers-reduced-motion: no-preference) {
  .titre.apparait { animation: carte-apparait .5s var(--ease) both; animation-delay: calc(var(--ordre, 0) * 40ms); }
}
@keyframes carte-apparait { from { opacity: 0; transform: translateY(14px) scale(.98); } }

@media (forced-colors: active) {
  .titre__carte, .cat-domaine, .cat-filtres { border: 1px solid CanvasText; }
  .cat-domaine[aria-pressed="true"] { outline: 3px solid Highlight; }
}

/* ==========================================================================
   Page Exedra Formation : même structure que le catalogue, déclinaison chaude de la palette.
   Vert = Exedra Académie (Titres Professionnels) · Crème et ocre = Exedra Formation (formations courtes).
   Les boutons restent verts (charte : pas d'aplat ocre sous un texte clair).
   ========================================================================== */
.cat-entete--formation { background: var(--c-creme); }
.cat-entete--formation .cat-entete__titre em,
.cat-entete--formation .cat-entete__chiffres dd { color: var(--c-ocre); }
.cat-entete--formation .cat-entete__visuel::after { border-color: var(--c-ocre); }

.catalogue--formation .cat-domaine { background: var(--c-texte); }
.catalogue--formation .cat-domaine::before { background: linear-gradient(180deg, rgba(43, 38, 34, .05) 20%, rgba(43, 38, 34, .88) 100%); }
.catalogue--formation .cat-domaine__nb { color: var(--c-dore); }
.catalogue--formation .cat-domaine--tous { background: var(--c-texte); }
.catalogue--formation .cat-filtres input:hover { border-color: var(--c-ocre); }
.catalogue--formation .cat-etat__situation { border-left-color: var(--c-ocre); background: var(--c-creme); }
.catalogue--formation .titre__carte:hover,
.catalogue--formation .titre__carte:focus-within { border-color: var(--c-dore); box-shadow: 0 26px 44px -30px rgba(154, 85, 37, .55); }
.catalogue--formation .titre__niveau { color: var(--c-ocre); }
.catalogue--formation .titre__plus { color: var(--c-ocre); }

/* « Pourquoi se former chez nous » : après la liste, bande crème, numéros ocre */
.form-atouts { padding-block: var(--e-8); background: var(--c-creme); }
.form-atouts__entete { margin-bottom: var(--e-6); }
.form-atouts__entete em { color: var(--c-ocre); }
.form-atouts__liste { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); list-style: none; padding: 0; }
.form-atout { display: grid; gap: var(--e-2); align-content: start; padding: var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-top: 3px solid var(--c-ocre); border-radius: var(--r-carte); }
.form-atout__num { font: 400 2rem/1 var(--f-titre); color: var(--c-ocre); }
.form-atout h3 { font: 400 1.3rem/1.2 var(--f-titre); }
.form-atout p { color: var(--c-texte-2); font-size: var(--t-s); }
.cat-courte { padding-top: var(--e-7); }
@media (min-width: 48em) { .cat-filtres--simple { grid-template-columns: 1fr auto; } }


/* Carte « document téléchargeable » (ex. catalogue PDF) */
.titre--document .titre__carte { border-style: dashed; border-color: var(--c-ocre); }
.titre__description { font-size: var(--t-s); color: var(--c-texte-2); }

/* ==========================================================================
   Document mis en avant (catalogue PDF) : bandeau vert foncé, couverture en volume
   ========================================================================== */
.titre--vedette { grid-column: 1 / -1; }
.vedette {
  position: relative; display: grid; gap: var(--e-6); align-items: center; overflow: hidden;
  padding: var(--e-6); border-radius: var(--r-carte);
  background: var(--c-vert-fonce); color: var(--c-fond);
}
.vedette::before { /* arche décorative en fond, motif de l'exèdre */
  content: ""; position: absolute; right: -4rem; bottom: -6rem; width: 22rem; height: 26rem; pointer-events: none;
  border: 1.5px solid rgba(201, 221, 184, .25); border-bottom: 0; border-radius: var(--r-pilule) var(--r-pilule) 0 0;
}
@media (min-width: 48em) { .vedette { grid-template-columns: minmax(11rem, 16rem) 1fr; padding: var(--e-7) var(--e-7) var(--e-7) var(--e-8); } }

/* Couverture : un livre légèrement incliné, avec l'épaisseur des pages */
.vedette__livre { perspective: 1400px; justify-self: center; width: min(100%, 15rem); }
.vedette__livre img {
  width: 100%; height: auto; border-radius: 3px 10px 10px 3px;
  transform: rotateY(-16deg) rotateX(3deg); transform-origin: left center;
  box-shadow:
    1px 1px 0 #f3ede3, 4px 4px 0 #e3dacb, 5px 5px 0 #f3ede3, 8px 8px 0 #d8cdb9,
    28px 34px 50px -18px rgba(0, 0, 0, .65);
  transition: transform .6s var(--ease), box-shadow .6s var(--ease);
}
.vedette:hover .vedette__livre img,
.vedette:focus-within .vedette__livre img { transform: rotateY(-4deg) rotateX(0deg) translateY(-6px); }

.vedette__texte { position: relative; display: grid; gap: var(--e-4); justify-items: start; }
.vedette__surtitre { font-size: var(--t-surtitre); font-weight: 600; color: var(--c-dore); }
.vedette__titre { font: 400 clamp(1.75rem, 1.3rem + 1.4vw, 2.5rem)/1.15 var(--f-titre); }
.vedette__description { font-size: var(--t-l); color: var(--c-vert-clair); max-width: 46ch; }
.vedette__themes { display: flex; flex-wrap: wrap; gap: var(--e-2); list-style: none; padding: 0; max-width: 44rem; }
.vedette__themes li { padding: 2px .75rem; border: 1px solid rgba(201, 221, 184, .45); border-radius: var(--r-pilule); font-size: .8125rem; color: var(--c-fond); }
.vedette__faits { display: flex; flex-wrap: wrap; gap: var(--e-1) var(--e-5); font-size: var(--t-s); }
.vedette__faits div { display: flex; gap: var(--e-1); }
.vedette__faits dt { color: var(--c-vert-clair); }
.vedette__faits dt::after { content: " :"; }
.vedette__faits dd { font-weight: 600; }
.vedette__actions { display: flex; flex-wrap: wrap; gap: var(--e-3); margin-top: var(--e-2); }
.vedette :focus-visible { outline-color: var(--c-fond); }
.btn--contour-clair { border-color: var(--c-fond); color: var(--c-fond); background: transparent; }
.btn--contour-clair:hover { background: var(--c-fond); color: var(--c-vert-fonce); }

@media (forced-colors: active) { .vedette { border: 1px solid CanvasText; } .vedette::before { display: none; } }
@media (prefers-reduced-motion: reduce) { .vedette__livre img { transform: none; } }

/* v1.45 — surtitres marron agrandis : bandeau partenaires et mention « Avec nos partenaires »
   (placé ici pour ne pas remplacer votre fichier 37-partenaires.css) */
.partenaires__surtitre { font-size: var(--t-surtitre); }
.partenariat .partenariat__libelle { font-size: var(--t-s); }

/* Page « Formations courtes » vide (v1.47) */
.fc-vide { padding-bottom: var(--e-8); }
.fc-vide__texte { display: grid; gap: var(--e-4); max-width: 44rem; padding-block: var(--e-6) var(--e-4); }
.fc-vide__actions { display: flex; flex-wrap: wrap; gap: var(--e-3); margin-top: var(--e-2); }

/* Page « Formations courtes » : thématiques du catalogue e-learning (v1.48)
   Couleur de chaque thème (--theme) : celle du sommaire du catalogue PDF, en touches décoratives uniquement. */
.fc-entete { padding-bottom: var(--e-6); }
.fc-themes { padding-block: var(--e-8); }
.fc-themes__titre { font-size: var(--t-h2); margin-bottom: var(--e-3); }
.fc-themes__titre em { color: var(--c-ocre); }
.fc-themes__texte { max-width: 60ch; margin-bottom: var(--e-6); color: var(--c-texte-2); font-size: var(--t-l); }
.fc-grille { display: grid; gap: var(--e-5); grid-template-columns: repeat(auto-fill, minmax(min(100%, 15.5rem), 1fr)); list-style: none; padding: 0; margin: 0 0 var(--e-8); }
.fc-theme { display: flex; }
.fc-theme__lien {
  display: flex; flex-direction: column; width: 100%; overflow: hidden; color: var(--c-texte); text-decoration: none;
  background: var(--c-blanc); border: 1px solid var(--c-filet); border-top: 5px solid var(--theme); border-radius: var(--r-carte);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease), border-color .2s;
}
.fc-theme__lien:hover { transform: translateY(-5px); box-shadow: 0 1.5rem 2.5rem -1.75rem color-mix(in srgb, var(--theme) 70%, #000); }
.fc-theme__lien:focus-visible { outline: 3px solid var(--c-texte); outline-offset: 3px; }
.fc-theme__visuel { position: relative; display: block; height: 9.5rem; overflow: hidden; background: color-mix(in srgb, var(--theme) 14%, var(--c-blanc)); }
.fc-theme__visuel img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; filter: grayscale(.15); transition: transform .6s var(--ease); }
.fc-theme__visuel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, color-mix(in srgb, var(--theme) 35%, transparent)); }
.fc-theme__lien:hover .fc-theme__visuel img { transform: scale(1.05); }
.fc-theme__corps { position: relative; display: grid; gap: var(--e-2); align-content: start; flex: 1; padding: var(--e-5); }
.fc-theme__num { position: absolute; top: calc(var(--e-5) * -1 - 1.1rem); right: var(--e-4); display: grid; place-items: center; width: 2.6rem; height: 2.6rem;
  border-radius: 50%; background: var(--theme); color: #fff; font: 400 1.05rem/1 var(--f-titre); box-shadow: 0 0 0 4px var(--c-blanc); }
.fc-theme__nom { font: 400 1.4rem/1.15 var(--f-titre); }
.fc-theme__sous { font-size: var(--t-s); color: var(--c-texte-2); }
.fc-theme__meta { margin-top: auto; padding-top: var(--e-3); font-size: var(--t-xs); font-weight: 600; color: var(--c-vert-fonce); }
.fc-theme__meta::after { content: " →"; transition: margin .2s; }
.fc-theme__lien:hover .fc-theme__meta::after { margin-left: .2rem; }
.fc-complet { display: grid; gap: var(--e-5); align-items: center; padding: var(--e-6); border-radius: var(--r-carte); background: var(--c-vert-fonce); color: var(--c-fond); }
.fc-complet h2 { font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.25rem); margin-bottom: var(--e-2); }
.fc-complet h2 em { color: var(--c-vert-clair); }
.fc-complet p:not(.cat-courte__surtitre) { color: var(--c-vert-clair); max-width: 56ch; }
.fc-complet :focus-visible { outline-color: var(--c-fond); }
@media (min-width: 56em) { .fc-complet { grid-template-columns: 1fr auto; } }

/* Fenêtre « Consulter en ligne / Télécharger » */
.fc-fenetre { width: min(30rem, calc(100% - 2 * var(--gouttiere, 1rem))); padding: var(--e-6); border: 0; border-radius: var(--r-carte); background: var(--c-fond); color: var(--c-texte); box-shadow: 0 2rem 4rem -1.5rem rgba(20, 30, 15, .55); }
.fc-fenetre::backdrop { background: rgba(25, 40, 18, .55); backdrop-filter: blur(3px); }
.fc-fenetre__fermer-form { position: absolute; top: var(--e-3); right: var(--e-3); }
.fc-fenetre__fermer { width: 2.5rem; height: 2.5rem; border: 0; border-radius: 50%; background: var(--c-creme); color: var(--c-texte); font-size: 1.5rem; line-height: 1; cursor: pointer; }
.fc-fenetre__fermer:hover { background: var(--c-vert-pale); }
.fc-fenetre__surtitre { font-size: var(--t-s); font-weight: 600; color: var(--c-ocre); }
.fc-fenetre__titre { margin: var(--e-2) var(--e-7) var(--e-2) 0; font-size: 1.75rem; }
.fc-fenetre__meta { margin-bottom: var(--e-5); font-size: var(--t-s); color: var(--c-texte-2); }
.fc-fenetre__actions { display: flex; flex-wrap: wrap; gap: var(--e-3); }
@media (forced-colors: active) { .fc-theme__lien { border: 1px solid CanvasText; } }

/* En-tête « Formations courtes » : symbole de l'exèdre à droite (v1.49) */
.fc-entete__grille { display: grid; gap: var(--e-6); align-items: center; }
.fc-exedre { display: none; width: 100%; max-width: 26rem; height: auto; justify-self: center; fill: none; stroke: var(--c-vert); stroke-width: 1.6; opacity: .8; }
.fc-exedre path:nth-child(even) { stroke: var(--c-ocre); }
@media (min-width: 52em) { .fc-entete__grille { grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); } .fc-exedre { display: block; } }
@media (prefers-reduced-motion: no-preference) {
  .fc-exedre path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: fc-arc 1.4s var(--ease) forwards; animation-delay: calc(.35s + var(--i) * .15s); }
  @keyframes fc-arc { to { stroke-dashoffset: 0; } }
}
@media (forced-colors: active) { .fc-exedre, .fc-exedre path { stroke: CanvasText; } }

/* v1.50 : arrivée depuis le menu « Exedra Formation » (#theme-…) : la carte s'arrête sous l'en-tête et se signale */
.fc-theme { scroll-margin-top: 1.5rem; }
.fc-theme:target .fc-theme__lien { box-shadow: 0 0 0 3px var(--theme), 0 1.5rem 2.5rem -1.75rem color-mix(in srgb, var(--theme) 70%, #000); animation: fc-signal 1.6s var(--ease) 2; }
@keyframes fc-signal { 50% { transform: translateY(-6px); } }
@media (prefers-reduced-motion: reduce) { .fc-theme:target .fc-theme__lien { animation: none; } }


/* ===== 60-contact.css ===== */
/* ==========================================================================
   Page Contact : en-tête (structure du catalogue), formulaire, coordonnées, accès
   ========================================================================== */

/* En-tête : accès rapides sous le titre */
.contact-rapide { display: flex; flex-wrap: wrap; gap: var(--e-3); list-style: none; padding: 0; margin-top: var(--e-2); }
.contact-rapide__lien {
  display: grid; gap: 2px; padding: var(--e-3) var(--e-5); min-width: 11rem;
  background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  color: var(--c-texte); text-decoration: none; transition: transform .3s var(--ease), border-color .3s, box-shadow .3s;
}
.contact-rapide__lien:hover, .contact-rapide__lien:focus-visible { transform: translateY(-3px); border-color: var(--c-vert); box-shadow: 0 18px 30px -24px rgba(47, 83, 35, .6); }
.contact-rapide__libelle { font-size: var(--t-s); font-weight: 600; color: var(--c-ocre); }
.contact-rapide__valeur { font: 400 1.2rem/1.25 var(--f-titre); color: var(--c-vert-fonce); }

/* Mise en page : formulaire + coordonnées */
.contact-page { padding-block: var(--e-7) var(--e-8); }
.contact-page__grille { display: grid; gap: var(--e-6); align-items: start; }
@media (min-width: 64em) { .contact-page__grille { grid-template-columns: minmax(0, 1.65fr) minmax(16rem, 1fr); } }

/* Formulaire */
.contact-form { padding: var(--e-6); background: var(--c-blanc); border: 1px solid var(--c-filet); border-top: 3px solid var(--c-vert); border-radius: var(--r-carte); }
@media (max-width: 40em) { .contact-form { padding: var(--e-5) var(--e-4); } }
.contact-form__titre { font-size: var(--t-h2); margin-bottom: var(--e-2); }
.contact-form__aide { font-size: var(--t-s); color: var(--c-texte-2); margin-bottom: var(--e-5); }
.contact-form form { display: grid; gap: var(--e-5); }

.champs-duo { display: grid; gap: var(--e-5); }
@media (min-width: 40em) { .champs-duo { grid-template-columns: 1fr 1fr; } }
.champ { display: grid; gap: var(--e-2); align-content: start; }
.champ label, .champ legend { font-weight: 600; font-size: var(--t-s); }
.champ__facultatif, .champ__indice { font-weight: 400; color: var(--c-texte-2); font-size: var(--t-xs); }
.champ input:not([type="radio"]):not([type="checkbox"]), .champ select, .champ textarea {
  width: 100%; min-height: 2.875rem; padding: var(--e-2) var(--e-4);
  border: 1.5px solid var(--c-bordure-ui); border-radius: .875rem; background: var(--c-fond);
  font: 500 var(--t-m)/1.4 var(--f-texte); color: var(--c-texte); transition: border-color .2s, box-shadow .2s;
}
.champ textarea { min-height: 9rem; resize: vertical; }
.champ select {
  appearance: none; padding-right: 2.5rem; cursor: pointer; background: var(--c-fond) no-repeat right 1rem center / .7rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%232B2622' stroke-width='1.6'/%3E%3C/svg%3E");
}
.champ input:hover, .champ select:hover, .champ textarea:hover { border-color: var(--c-vert); }
.champ input:focus-visible, .champ select:focus-visible, .champ textarea:focus-visible { outline: 2px solid var(--c-texte); outline-offset: 2px; border-color: var(--c-vert); }

/* Choix « Vous êtes » : pastilles cliquables */
.champ--choix { border: 0; padding: 0; margin: 0; }
.champ--choix legend { margin-bottom: var(--e-3); }
.choix { display: flex; flex-wrap: wrap; gap: var(--e-2); }
.choix label {
  position: relative; display: inline-flex; align-items: center; gap: var(--e-2); padding: var(--e-2) var(--e-4) var(--e-2) var(--e-3);
  border: 1.5px solid var(--c-filet); border-radius: var(--r-pilule); background: var(--c-fond);
  font-weight: 500; cursor: pointer; transition: border-color .2s, background-color .2s;
}
.choix input { width: 1.1rem; height: 1.1rem; margin: 0; accent-color: var(--c-vert); }
.choix label:hover { border-color: var(--c-vert); }
.choix label:has(input:checked) { border-color: var(--c-vert); background: var(--c-vert-pale); color: var(--c-vert-fonce); }
.choix label:has(input:focus-visible) { outline: 2px solid var(--c-texte); outline-offset: 2px; }

/* Formations : choix multiple (v1.45) — bouton repliable, recherche, cases groupées, puces des choix */
.champ--formations { border: 0; padding: 0; margin: 0; min-width: 0; }
.champ--formations > legend { margin-bottom: var(--e-1); }
.formations__ouvrir {
  display: flex; align-items: center; justify-content: space-between; gap: var(--e-3); width: 100%; min-height: 2.875rem;
  padding: var(--e-2) 2.5rem var(--e-2) var(--e-4); border: 1.5px solid var(--c-bordure-ui); border-radius: .875rem; text-align: left;
  background: var(--c-fond) no-repeat right 1rem center / .7rem; cursor: pointer; transition: border-color .2s;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%232B2622' stroke-width='1.6'/%3E%3C/svg%3E");
  font: 500 var(--t-m)/1.4 var(--f-texte); color: var(--c-texte);
}
.formations__ouvrir[aria-expanded="true"] { border-color: var(--c-vert); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 7l5-5 5 5' fill='none' stroke='%232B2622' stroke-width='1.6'/%3E%3C/svg%3E"); }
.formations__ouvrir:hover { border-color: var(--c-vert); }
.formations__ouvrir:focus-visible { outline: 2px solid var(--c-texte); outline-offset: 2px; }
.formations__choisies { display: flex; flex-wrap: wrap; gap: var(--e-2); list-style: none; padding: 0; margin: 0; }
.formations__choisies[hidden] { display: none; }
.formations__puce {
  display: inline-flex; align-items: center; gap: var(--e-2); max-width: 100%; padding: .3rem .4rem .3rem .8rem;
  border: 1.5px solid var(--c-vert); border-radius: var(--r-pilule); background: var(--c-vert-pale); color: var(--c-vert-fonce);
  font: 600 var(--t-xs)/1.3 var(--f-texte); text-align: left; cursor: pointer; transition: background-color .2s;
}
.formations__puce:hover { background: var(--c-blanc); }
.formations__puce:focus-visible { outline: 2px solid var(--c-texte); outline-offset: 2px; }
.formations__croix { display: grid; place-items: center; flex: none; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: var(--c-vert); color: var(--c-fond); font-size: 1rem; line-height: 1; }
.formations__panneau { display: grid; gap: var(--e-3); padding: var(--e-3); border: 1.5px solid var(--c-filet); border-radius: .875rem; background: var(--c-blanc); }
.formations__panneau[hidden] { display: none; }
.formations__groupes { display: grid; gap: var(--e-4); max-height: 22rem; overflow-y: auto; overscroll-behavior: contain; padding-right: var(--e-2); }
.champ--formations:not(.champ--formations-actif) .formations__groupes { max-height: none; }   /* sans JavaScript : liste entière */
.formations__groupe { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 2px; }
.formations__groupe[hidden] { display: none; }
.formations__groupe legend { padding: 0 0 var(--e-2); font-size: var(--t-xs); font-weight: 700; letter-spacing: .03em; color: var(--c-ocre); }
.formations__choix { display: flex; align-items: flex-start; gap: var(--e-3); padding: var(--e-2) var(--e-3); border-radius: .6rem; font-weight: 500; cursor: pointer; transition: background-color .15s; }
.formations__choix[hidden] { display: none; }
.formations__choix:hover { background: var(--c-vert-teinte); }
.formations__choix:has(input:checked) { background: var(--c-vert-pale); color: var(--c-vert-fonce); }
.formations__choix input { flex: none; width: 1.15rem; height: 1.15rem; margin: .2rem 0 0; accent-color: var(--c-vert); }
.formations__choix:has(input:focus-visible) { outline: 2px solid var(--c-texte); outline-offset: -2px; }
.formations__aucune { padding: var(--e-3); font-size: var(--t-s); color: var(--c-texte-2); }
.champ--erreur .formations__ouvrir { border-color: #A12C1C; border-width: 2px; }

/* Case de consentement */
.champ--case { grid-template-columns: auto 1fr; column-gap: var(--e-3); align-items: start; }
.champ--case input { width: 1.25rem; height: 1.25rem; margin-top: .15rem; accent-color: var(--c-vert); }
.champ--case label { font-weight: 500; }
.champ--case .champ__erreur { grid-column: 1 / -1; }
.contact-form__rgpd { margin-top: calc(var(--e-3) * -1); font-size: var(--t-xs); color: var(--c-texte-2); }

/* Erreurs : texte + bordure + icône dessinée (jamais la couleur seule) */
.champ__erreur { display: flex; gap: var(--e-2); align-items: baseline; font-size: var(--t-s); font-weight: 600; color: #A12C1C; }
.champ__erreur::before { content: "!"; flex: none; display: grid; place-items: center; width: 1.1rem; height: 1.1rem; border-radius: 50%; background: #A12C1C; color: #fff; font-size: .75rem; }
.champ__erreur[hidden] { display: none; }
.champ--erreur input:not([type="checkbox"]), .champ--erreur select, .champ--erreur textarea { border-color: #A12C1C; border-width: 2px; }
.contact-form__erreurs { padding: var(--e-4) var(--e-5); margin-bottom: var(--e-5); border: 2px solid #A12C1C; border-radius: .875rem; background: #FBEDEA; }
.contact-form__erreurs ul { margin: var(--e-2) 0 0; padding-left: 1.25em; }
.contact-form__erreurs a { color: #A12C1C; font-weight: 600; }

.contact-form__envoyer { justify-self: start; min-width: 14rem; }
.contact-form__envoyer:disabled { opacity: .7; cursor: progress; transform: none; }
.contact-form__statut { padding: var(--e-4) var(--e-5); border-radius: .875rem; font-weight: 600; }
.contact-form__statut--succes, .contact-form__statut--info { background: var(--c-vert-pale); border-left: 4px solid var(--c-vert); color: var(--c-vert-fonce); }
.contact-form__statut--erreur { background: #FBEDEA; border-left: 4px solid #A12C1C; color: #A12C1C; }

.champ-piege { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Coordonnées */
.contact-infos { display: grid; gap: var(--e-4); }
@media (min-width: 64em) { .contact-infos { position: sticky; top: calc(var(--hauteur-entete) + var(--e-4)); } }
.contact-carte { display: grid; gap: var(--e-2); padding: var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte); font-size: var(--t-s); }
.contact-carte h2 { font: 400 1.3rem/1.2 var(--f-titre); }
.contact-carte address { font-style: normal; }
.contact-carte--vert { background: var(--c-vert-fonce); border-color: var(--c-vert-fonce); color: var(--c-fond); }
.contact-carte--vert a { color: var(--c-fond); }
.contact-carte--vert :focus-visible { outline-color: var(--c-fond); }
.contact-carte--creme { background: var(--c-creme); border-color: transparent; }
.contact-carte__grand { font: 400 clamp(1.6rem, 1.3rem + 1vw, 2.1rem)/1.1 var(--f-titre); }
.contact-carte__grand a { text-decoration: none; }
.contact-carte__grand a:hover { text-decoration: underline; }
.contact-carte__petit { color: var(--c-texte-2); font-size: var(--t-xs); }
.contact-horaires { display: grid; gap: var(--e-1); margin-top: var(--e-2); color: var(--c-vert-clair); }
.contact-horaires dt { font-weight: 600; color: var(--c-fond); }
.contact-reseaux { display: flex; flex-wrap: wrap; gap: var(--e-2) var(--e-4); list-style: none; padding: 0; }

/* Accès : bandeau vert foncé, laurier (unique sur la page) */
.contact-acces { padding-bottom: var(--e-8); }   /* bloc arrondi : bien séparé du pied de page, lui aussi vert */
.contact-acces :focus-visible { outline-color: var(--c-fond); }
.contact-acces__grille {
  display: grid; gap: var(--e-6); align-items: center; overflow: hidden;
  padding-block: var(--e-7); border-radius: var(--r-carte); background: var(--c-vert-fonce); color: var(--c-fond);
  padding-inline: clamp(1.5rem, 4vw, 3.5rem);
}
.contact-acces__texte { display: grid; gap: var(--e-4); justify-items: start; }
.contact-acces h2 em { color: var(--c-vert-clair); }
.contact-acces__adresse { font: 400 1.5rem/1.3 var(--f-titre); font-style: normal; }
.contact-acces__texte > p { color: var(--c-vert-clair); max-width: 52ch; }
.contact-acces__actions { justify-content: flex-start; }
.contact-acces__decor { display: none; color: var(--c-vert-clair); }
@media (min-width: 60em) {
  .contact-acces__grille { grid-template-columns: 1fr 16rem; }
  .contact-acces__decor { display: grid; place-items: center; aspect-ratio: 4 / 5; border: 1.5px solid rgba(201, 221, 184, .4); border-bottom: 0; border-radius: var(--r-pilule) var(--r-pilule) 0 0; }
  .contact-acces__decor .laurier { width: 80%; }
}
/* Le laurier se dessine quand le bandeau apparaît (même mécanique que l'accueil) */
@media (prefers-reduced-motion: no-preference) {
  .js .contact-acces .laurier__tige { stroke-dasharray: 1; stroke-dashoffset: 1; }
  .js .contact-acces .laurier__feuille { opacity: 0; transform-box: fill-box; transform-origin: center; scale: .2; }
  .js .contact-acces.est-visible .laurier__tige { transition: stroke-dashoffset 1.6s var(--ease); stroke-dashoffset: 0; }
  .js .contact-acces.est-visible .laurier__feuille { opacity: 1; scale: 1; transition: opacity .5s var(--ease), scale .6s var(--ease); transition-delay: calc(.3s + var(--f) * 110ms); }
}

/* En-tête : la maquette 3D des locaux remplace la photo (arche plus grande, visible aussi sur mobile) */
.contact-entete .cat-entete__visuel.contact-maquette { display: block; position: relative; width: 100%; aspect-ratio: 1 / 1; margin-top: var(--e-2); }
.contact-maquette__cadre { position: absolute; inset: 0; overflow: hidden; isolation: isolate; background: #ecebe7;
  border-radius: 12rem 12rem var(--r-carte) var(--r-carte); box-shadow: 0 2.5rem 4rem -2.5rem rgba(47, 83, 35, .7); }
.contact-maquette__cadre iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; }
@media (min-width: 60em) {
  .contact-entete .cat-entete__grille { grid-template-columns: 1.15fr .85fr; }
  .contact-entete .cat-entete__visuel.contact-maquette { justify-self: end; width: min(100%, 32rem); aspect-ratio: 5 / 6; margin-top: var(--e-6); }
  .contact-maquette__cadre { border-radius: var(--r-pilule) var(--r-pilule) var(--r-carte) var(--r-carte); }
}

@media (forced-colors: active) {
  .contact-form, .contact-carte, .contact-rapide__lien, .choix label { border: 1px solid CanvasText; }
  .contact-acces__decor { display: none; }
}
@media print { .contact-form, .contact-acces__decor, .contact-rapide, .contact-maquette { display: none; } }


/* ===== 70-fiche.css ===== */
/* Fiches des Titres Professionnels (/formations/<slug>/)
   Vert de marque #3D632D (--c-vert) affirmé : chiffres clés, modalités d'accès, bandeau Candidater,
   numéros de rubrique, coches, filets de cartes. Rythme : sections alternées fond / vert teinté (#F2F6F1) / vert. */

/* ---------- Boutons de la fiche : soulèvement + ombre verte ---------- */
.btn--fiche { gap: var(--e-2); transition: transform .3s ease, box-shadow .3s ease, background-color .3s ease, color .3s ease, border-color .3s ease; }
.btn--fiche:hover { transform: translateY(-4px); box-shadow: 0 14px 28px -12px rgba(61, 99, 45, .55); }
.btn--fiche:active { transform: translateY(-1px); }
.btn__fleche { display: inline-block; transition: transform .3s ease; }
.btn--fiche:hover .btn__fleche { transform: translateX(4px); }
.btn__icone { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--c-vert); color: var(--c-fond); font-size: .8rem; transition: transform .3s ease; }
.btn--contour:hover .btn__icone { background: var(--c-fond); color: var(--c-vert); transform: translateY(2px); }
.btn--clair-fiche { background: var(--c-fond); color: var(--c-vert); border-color: var(--c-fond); }
.btn--clair-fiche:hover { background: var(--c-blanc); color: var(--c-vert-fonce); }
.btn--contour-clair-fiche { background: transparent; color: var(--c-fond); border-color: rgba(251, 248, 243, .7); }
.btn--contour-clair-fiche:hover { background: var(--c-fond); color: var(--c-vert); border-color: var(--c-fond); }
.btn--petit { min-height: 2.5rem; padding: var(--e-2) var(--e-5); }
.btn.est-desactive { opacity: .6; cursor: not-allowed; box-shadow: none; }
.btn.est-desactive:hover { transform: none; box-shadow: none; }

/* ---------- Haut de page ---------- */
.fiche-haut { position: relative; overflow: hidden; padding-block: var(--e-7); background: linear-gradient(160deg, var(--c-fond) 0%, var(--c-fond) 45%, var(--c-vert-teinte) 100%); }
.fiche-haut::after { /* filet vert de marque en bas du bandeau */
  content: ""; position: absolute; inset: auto 0 0; height: 4px; background: linear-gradient(90deg, var(--c-vert), var(--c-vert-clair) 70%, transparent);
}
.fiche-haut__grille { display: grid; gap: var(--e-6); align-items: start; }
.fiche-haut__principal { display: grid; gap: var(--e-5); justify-items: start; }
.fiche-haut__titre { font: 400 clamp(2.25rem, 1.6rem + 2.6vw, 3.5rem)/1.08 var(--f-titre); color: var(--c-vert); }
.fiche-haut__type { display: flex; width: fit-content; align-items: center; gap: var(--e-2); margin-bottom: var(--e-3); padding: .3rem var(--e-3); border-radius: var(--r-pilule); background: var(--c-vert-pale); font: 600 var(--t-xs)/1.3 var(--f-texte); color: var(--c-vert-fonce); letter-spacing: .02em; }
.fiche-haut__type::before { content: ""; width: .45rem; height: .6rem; border-radius: var(--r-pilule) var(--r-pilule) 1px 1px; background: var(--c-vert); }
.fiche-haut__dates { display: grid; gap: var(--e-1); padding-left: var(--e-4); border-left: 3px solid var(--c-vert); font-size: .875rem; color: var(--c-texte-2); }
.fiche-haut__dates dt { display: inline; font-weight: 600; color: var(--c-texte); }
.fiche-haut__dates dt::after { content: " : "; }
.fiche-haut__dates dd { display: inline; }
.fiche-haut__photo { width: min(100%, 30rem); aspect-ratio: 584 / 299; overflow: hidden; background: var(--c-creme);
  border-radius: var(--r-carte); box-shadow: 0 1.5rem 3rem -1.75rem rgba(61, 99, 45, .55); }
.fiche-haut__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.fiche-haut__photo:hover img { transform: scale(1.04); }
.fiche-haut__actions { display: flex; flex-wrap: wrap; gap: var(--e-3); }

/* Carte « chiffres clés » : fond vert de marque, arche signature */
.fiche-haut__carte { position: relative; display: grid; gap: var(--e-3); justify-items: center; text-align: center; padding: var(--e-7) var(--e-6) var(--e-6);
  background: radial-gradient(120% 80% at 50% 0%, #4A7538 0%, var(--c-vert) 55%, var(--c-vert-fonce) 100%); color: var(--c-fond);
  border-radius: 12rem 12rem var(--r-carte) var(--r-carte); box-shadow: 0 2rem 3.5rem -2rem rgba(47, 83, 35, .7); }
.fiche-haut__carte::before { /* deuxième arche, en filet doré */
  content: ""; position: absolute; inset: .75rem .75rem auto; height: 55%; border: 1px solid rgba(233, 199, 155, .5); border-bottom: 0; border-radius: 12rem 12rem 0 0; pointer-events: none; }
.fiche-haut__carte > * { position: relative; }
.fiche-haut__niveau { font: 400 3.75rem/1 var(--f-titre); color: var(--c-dore); }
.fiche-haut__equivalence { max-width: 26ch; margin-top: calc(-1 * var(--e-2)); font-size: .875rem; color: var(--c-vert-clair); }
.fiche-haut__carte a:not(.btn) { color: var(--c-fond); }
.fiche-haut__carte :focus-visible { outline-color: var(--c-fond); }

/* Étiquettes : informations clés */
.fiche-badges { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--e-2); }
.fiche-badge { display: inline-flex; align-items: baseline; gap: .35rem; padding: .4rem var(--e-4); border-radius: var(--r-pilule); background: rgba(251, 248, 243, .12); border: 1px solid rgba(251, 248, 243, .3); font-size: var(--t-s); }
.fiche-badge dt { color: var(--c-vert-clair); font-weight: 600; }
.fiche-badge dt::after { content: " :"; }
.fiche-badge dd { font-weight: 600; }
.fiche-badge--rncp { background: var(--c-fond); border-color: var(--c-fond); }
.fiche-badge--rncp a { color: var(--c-vert) !important; font-weight: 700; }
.fiche-haut__partenaire { display: grid; gap: var(--e-2); justify-items: center; margin-top: var(--e-3); }
.fiche-haut__partenaire p { font-size: var(--t-xs); font-weight: 600; color: var(--c-dore); }
.fiche-haut__logo { display: block; padding: var(--e-2) var(--e-4); background: var(--c-blanc); border-radius: var(--r-carte); transition: transform .3s ease, box-shadow .3s ease; }
a.fiche-haut__logo:hover { transform: translateY(-4px); box-shadow: 0 12px 24px -12px rgba(0, 0, 0, .45); }
.fiche-haut__logo img { height: 4.5rem; width: auto; }
.fiche-haut__logo-nom { display: block; padding-block: var(--e-3); font: 400 1.25rem/1 var(--f-titre); color: var(--c-texte); }
@media (min-width: 60em) {
  .fiche-haut__grille { grid-template-columns: 1.35fr 1fr; gap: var(--e-8); }
}

/* ---------- Corps : sommaire collant + rubriques ---------- */
.fiche-corps { display: grid; gap: var(--e-6); padding-block: var(--e-7) var(--e-8); }
@media (min-width: 64em) {
  .fiche-corps { grid-template-columns: 15rem minmax(0, 1fr); gap: var(--e-7); align-items: start; }
  .fiche-sommaire { position: sticky; top: calc(var(--hauteur-entete) + var(--e-5)); }
}
.fiche-sommaire { padding: var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-top: 4px solid var(--c-vert); border-radius: var(--r-carte); }
.fiche-sommaire__titre { margin-bottom: var(--e-4); font: 400 1.375rem/1.2 var(--f-titre); }
.fiche-sommaire ol { display: grid; gap: var(--e-1); list-style: none; padding: 0; counter-reset: som; font-size: var(--t-s); }
.fiche-sommaire li { counter-increment: som; }
.fiche-sommaire a { display: grid; grid-template-columns: 1.75rem 1fr; align-items: baseline; padding: .35rem var(--e-2); border-radius: .6rem; color: var(--c-texte); text-decoration: none; transition: background-color .25s ease, color .25s ease, padding .25s ease; }
.fiche-sommaire a::before { content: counter(som); font: 400 1.125rem/1 var(--f-titre); color: var(--c-ocre); transition: color .25s ease; }
.fiche-sommaire a:hover { background: var(--c-vert-teinte); color: var(--c-vert-fonce); }
.fiche-sommaire a.est-actif { background: var(--c-vert); color: var(--c-fond); padding-left: var(--e-3); }
.fiche-sommaire a.est-actif::before { color: var(--c-dore); }

.fiche-sections { display: grid; gap: var(--e-7); min-width: 0; }
.fiche-rubrique { display: grid; gap: var(--e-5); min-width: 0; scroll-margin-top: calc(var(--hauteur-entete) + var(--e-4)); }
.fiche-rubrique > h2 { display: flex; align-items: center; gap: var(--e-4); }
.fiche-rubrique__num { /* numéro dans une arche, en vert de marque */
  flex: none; display: grid; place-items: end center; width: 2.75rem; height: 3.25rem; padding-bottom: .35rem;
  border-radius: var(--r-pilule) var(--r-pilule) .375rem .375rem; background: var(--c-vert); color: var(--c-fond);
  font: 400 1.375rem/1 var(--f-titre); box-shadow: 0 8px 16px -10px rgba(61, 99, 45, .8);
}
.fiche-rubrique__intro { font-size: var(--t-l); }
.fiche-en-cours { justify-self: start; padding: var(--e-2) var(--e-4); border: 1.5px dashed var(--c-bordure-ui); border-radius: var(--r-pilule); font-size: var(--t-s); color: var(--c-texte-2); }

/* Rubriques en panneau : vert teinté ou vert de marque, pour casser la monotonie */
.fiche-rubrique--teinte, .fiche-rubrique--vert { padding: var(--e-6) var(--e-5); border-radius: calc(var(--r-carte) * 1.4); }
.fiche-rubrique--teinte { background: var(--c-vert-teinte); border: 1px solid var(--c-vert-pale); }
.fiche-rubrique--vert { background: linear-gradient(150deg, var(--c-vert) 0%, var(--c-vert-fonce) 100%); color: var(--c-fond); box-shadow: 0 2rem 3rem -2.25rem rgba(47, 83, 35, .8); }
.fiche-rubrique--vert .fiche-rubrique__num { background: var(--c-fond); color: var(--c-vert); }
.fiche-rubrique--vert a { color: var(--c-fond); }
@media (min-width: 40em) { .fiche-rubrique--teinte, .fiche-rubrique--vert { padding: var(--e-7) var(--e-6); } }

/* Puces : coches blanches dans des pastilles vertes */
.fiche-coches { display: grid; gap: var(--e-3); list-style: none; padding: 0; font-size: var(--t-l); }
.fiche-coches li { position: relative; padding-left: 2.5rem; }
.fiche-coches li::before { content: ""; position: absolute; left: 0; top: .15em; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--c-vert); }
.fiche-coches li::after { content: ""; position: absolute; left: .58rem; top: calc(.15em + .38rem); width: .38rem; height: .7rem; border: solid var(--c-fond); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.fiche-coches--petit { gap: var(--e-2); font-size: var(--t-s); }
.fiche-coches--petit li { padding-left: 2rem; }
.fiche-coches--petit li::before { width: 1.25rem; height: 1.25rem; top: .1em; }
.fiche-coches--petit li::after { left: .45rem; top: calc(.1em + .28rem); width: .3rem; height: .58rem; border-width: 0 2px 2px 0; }
.fiche-encart { display: flex; align-items: center; gap: var(--e-3); padding: var(--e-4) var(--e-5); background: var(--c-vert-teinte); border-left: 4px solid var(--c-vert); border-radius: .5rem var(--r-carte) var(--r-carte) .5rem; font-size: var(--t-s); font-weight: 600; color: var(--c-vert-fonce); }

/* Étapes d'accès : cartes blanches reliées, sur le panneau vert */
.fiche-etapes { position: relative; display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); list-style: none; padding: 0; counter-reset: etape; }
.fiche-etapes li { counter-increment: etape; display: grid; gap: var(--e-1); align-content: start; padding: var(--e-5) var(--e-4) var(--e-4); background: var(--c-fond); color: var(--c-texte); border-radius: var(--r-carte); font-size: var(--t-s); transition: transform .3s ease, box-shadow .3s ease; }
.fiche-etapes li:hover { transform: translateY(-4px); box-shadow: 0 1rem 2rem -1rem rgba(0, 0, 0, .45); }
.fiche-etapes li::before { content: counter(etape); display: grid; place-items: center; width: 2.25rem; height: 2.25rem; margin-bottom: var(--e-2); border-radius: 50%; background: var(--c-vert); color: var(--c-fond); font: 400 1.25rem/1 var(--f-titre); }
.fiche-etapes strong { display: block; font-size: var(--t-m); color: var(--c-vert-fonce); }

/* Cartes : blocs de compétences, tarifs — filet vert, soulèvement au survol */
.fiche-blocs { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); align-items: start; }
.fiche-bloc, .fiche-tarif { position: relative; overflow: hidden; background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte); transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.fiche-bloc::before, .fiche-tarif::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: var(--c-vert); transform-origin: left; transition: height .3s ease; }
.fiche-bloc:hover, .fiche-tarif:hover { transform: translateY(-4px); border-color: var(--c-vert-clair); box-shadow: 0 1.25rem 2.25rem -1.25rem rgba(61, 99, 45, .5); }
.fiche-bloc:hover::before, .fiche-tarif:hover::before { height: 6px; }
.fiche-bloc { display: grid; gap: var(--e-3); padding: var(--e-5); }
.fiche-bloc h3 { color: var(--c-texte); }
.fiche-bloc__num { display: inline-block; margin-bottom: var(--e-2); padding: .2rem var(--e-3); border-radius: var(--r-pilule); background: var(--c-vert-pale); font-size: var(--t-xs); color: var(--c-vert-fonce); }

.fiche-tarifs { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(11.5rem, 1fr)); list-style: none; padding: 0; }
.fiche-tarif { display: grid; gap: var(--e-2); align-content: start; padding: var(--e-5); }
.fiche-tarif h3 { font: 600 var(--t-xs)/1.3 var(--f-texte); color: var(--c-vert); text-transform: uppercase; letter-spacing: .06em; }
.fiche-tarif__prix { font: 400 1.75rem/1.15 var(--f-titre); color: var(--c-texte); }
.fiche-tarif__prix .compteur { color: var(--c-vert); font-variant-numeric: tabular-nums; }
.fiche-tarif__aide { display: inline-flex; justify-self: start; padding: .25rem var(--e-3); border-radius: var(--r-pilule); background: var(--c-vert-pale); font-size: var(--t-xs); font-weight: 600; color: var(--c-vert-fonce); }

/* Résultats : tuiles en arche, en pointillés tant que les taux sont « En cours » */
.fiche-taux { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr)); list-style: none; padding: 0; }
.fiche-taux li { display: grid; gap: var(--e-2); align-content: end; min-height: 10rem; padding: var(--e-5) var(--e-4) var(--e-4); background: var(--c-blanc);
  border: 1.5px dashed var(--c-vert-clair); border-radius: 6rem 6rem var(--r-carte) var(--r-carte); font-size: var(--t-s); text-align: center; transition: border-color .3s ease, transform .3s ease; }
.fiche-taux li:hover { border-color: var(--c-vert); transform: translateY(-3px); }
.fiche-taux__valeur { display: block; font: 400 1.375rem/1.1 var(--f-titre); color: var(--c-vert); }

/* Métiers : étiquettes vertes cochées */
.fiche-metiers { display: flex; flex-wrap: wrap; gap: var(--e-2); list-style: none; padding: 0; }
.fiche-metiers li { display: inline-flex; align-items: center; gap: .45rem; padding: .4rem var(--e-4) .4rem var(--e-3); border-radius: var(--r-pilule); background: var(--c-vert-teinte); border: 1px solid var(--c-vert-pale); color: var(--c-vert-fonce); font-size: var(--t-s); font-weight: 600; transition: background-color .3s ease, color .3s ease, transform .3s ease; }
.fiche-metiers li::before { content: ""; width: .32rem; height: .6rem; margin: 0 .2rem -.05rem .25rem; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.fiche-metiers li:hover { background: var(--c-vert); color: var(--c-fond); transform: translateY(-2px); }

/* ---------- Bandeau Candidater ---------- */
.fiche-cta { position: relative; overflow: hidden; padding-block: var(--e-8); background: linear-gradient(160deg, var(--c-vert-fonce) 0%, var(--c-vert) 60%, #4A7538 100%); color: var(--c-fond); }
.fiche-cta__grille { display: grid; gap: var(--e-6); align-items: center; }
.fiche-cta__texte { display: grid; gap: var(--e-4); justify-items: start; }
.fiche-cta h2 em { color: var(--c-dore); }
.fiche-cta p { max-width: 46ch; font-size: var(--t-l); color: var(--c-vert-clair); }
.fiche-cta__actions { display: flex; flex-wrap: wrap; gap: var(--e-3); margin-top: var(--e-2); }
.fiche-cta :focus-visible { outline-color: var(--c-fond); }
.fiche-cta__decor { display: none; }
@media (min-width: 52em) {
  .fiche-cta__grille { grid-template-columns: 1fr 16rem; }
  .fiche-cta__decor { display: grid; place-items: center; aspect-ratio: 4 / 5; border: 1.5px solid rgba(201, 221, 184, .4); border-bottom: 0; border-radius: var(--r-pilule) var(--r-pilule) 0 0; }
  .fiche-cta .laurier { width: 80%; }
}

/* Laurier du bandeau : se dessine à l'apparition (comme sur l'accueil) */
@media (prefers-reduced-motion: no-preference) {
  .js .fiche-cta.est-visible .laurier__tige { transition: stroke-dashoffset 1.6s var(--ease); stroke-dashoffset: 0; }
  .js .fiche-cta.est-visible .laurier__feuille { opacity: 1; scale: 1; transition: opacity .5s var(--ease), scale .6s var(--ease); transition-delay: calc(.3s + var(--f) * 110ms); }
  .js .fiche-cta.revele { opacity: 1; transform: none; } /* le bandeau reste en place, seul le laurier s'anime */
}
@media (prefers-reduced-motion: reduce) {
  .btn--fiche:hover, .fiche-bloc:hover, .fiche-tarif:hover, .fiche-etapes li:hover, .fiche-metiers li:hover, .fiche-taux li:hover, a.fiche-haut__logo:hover { transform: none; }
  .fiche-haut__photo:hover img { transform: none; }
}

@media print {
  .fiche-haut__actions, .fiche-haut__carte .btn, .fiche-sommaire, .fiche-cta { display: none; }
  .fiche-haut__carte, .fiche-rubrique--vert { background: none; color: #000; border: 1px solid #000; box-shadow: none; }
  .fiche-corps { display: block; }
}
@media (forced-colors: active) {
  .fiche-haut__carte, .fiche-bloc, .fiche-tarif, .fiche-etapes li, .fiche-sommaire, .fiche-rubrique--vert, .fiche-rubrique--teinte { border: 1px solid CanvasText; }
}

/* Taux : signe % à côté de « En cours » (v1.38) */
.fiche-taux__pct { display: block; font-size: 2.25rem; line-height: 1; margin-bottom: .15rem; }

/* ---------- Page « En savoir plus sur la certification » (v1.43, comme le site officiel) ---------- */
.certif { display: grid; gap: var(--e-5); max-width: 52rem; padding-block: var(--e-4) var(--e-8); }
.certif__titre { font: 400 clamp(2rem, 1.5rem + 2vw, 3rem)/1.15 var(--f-titre); color: var(--c-vert); }
.certif__formation { display: block; margin-top: var(--e-2); font: 600 var(--t-surtitre)/1.4 var(--f-texte); color: var(--c-ocre); }
.certif__texte { display: grid; gap: var(--e-4); color: var(--c-texte-2); line-height: 1.7; }
.certif__logos { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-6); list-style: none; padding: var(--e-4) 0 0; margin: 0; }
.certif__logos img { display: block; height: auto; max-height: 6rem; width: auto; max-width: 12rem; }
.certif__logos a { display: block; border-radius: var(--r-carte); transition: transform .3s var(--ease); }
.certif__logos a:hover { transform: translateY(-3px); }
.certif__actions { display: flex; flex-wrap: wrap; gap: var(--e-3); padding-top: var(--e-4); }
.fiche-certif-lien { justify-self: end; }


/* ===== 71-fiche-courte.css ===== */
/* Fiches des formations courtes (Exedra Formation, /formation/<slug>/) : même mise en page que les fiches
   des Titres Professionnels (70-fiche.css), aux couleurs d'Exedra Formation, comme son catalogue :
   crème + ocre pour les accents, anthracite + doré pour les grands aplats. Les boutons restent verts (charte). */
.theme-formation {
  --c-vert: #8F4A1E;          /* accents (numéros, coches, filets) : ocre foncé, lisible sous un texte clair */
  --c-vert-fonce: #2B2622;    /* aplats sombres : anthracite */
  --c-vert-pale: #F1E2D2;     /* étiquettes */
  --c-vert-teinte: #FAF3EB;   /* fonds de rubriques */
  --c-vert-clair: #E9C79B;    /* textes secondaires sur fond sombre : doré */
}
/* Boutons : brun-ocre d'Exedra Formation */
.theme-formation .btn--plein { background: linear-gradient(150deg, #8F4A1E 0%, #6E3A18 100%); border-color: #7A4119; color: var(--c-fond); }
.theme-formation .btn--plein:hover { background: #5A3A22; }
.theme-formation .btn--contour { border-color: #8F4A1E; color: #8F4A1E; }
.theme-formation .btn--contour:hover { background: #8F4A1E; color: var(--c-fond); }
.theme-formation .btn--fiche:hover { box-shadow: 0 14px 28px -12px rgba(154, 85, 37, .5); }

/* Haut de page */
.theme-formation .fiche-haut__ariane { margin-bottom: var(--e-4); }
.theme-formation .fiche-haut__carte { background: radial-gradient(130% 85% at 50% 0%, #7A4A28 0%, #5A3A22 38%, #2E2420 100%); box-shadow: 0 2rem 3.5rem -2rem rgba(90, 58, 34, .75); }
.theme-formation .fiche-haut__equivalence { font-size: 1rem; color: var(--c-fond); }
.theme-formation .fiche-haut__certif { margin-top: var(--e-2); font-size: var(--t-xs); font-weight: 600; letter-spacing: .04em; color: var(--c-dore); }
.theme-formation .fiche-haut__photo { box-shadow: 0 1.5rem 3rem -1.75rem rgba(154, 85, 37, .5); }

/* Rubriques : ombres et survols aux tons ocre */
.theme-formation .fiche-rubrique--vert { background: linear-gradient(150deg, #5A3A22 0%, #3A2A21 55%, #2E2420 100%); box-shadow: 0 2rem 3rem -2.25rem rgba(90, 58, 34, .8); }
.theme-formation .fiche-rubrique--vert .fiche-rubrique__num { background: var(--c-dore); color: #2B2622; }
.theme-formation .fiche-rubrique--vert .fiche-rubrique__intro strong { color: var(--c-dore); }
.theme-formation .fiche-bloc:hover, .theme-formation .fiche-tarif:hover { box-shadow: 0 1.25rem 2.25rem -1.25rem rgba(154, 85, 37, .45); }
.theme-formation .fiche-rubrique__num { box-shadow: 0 8px 16px -10px rgba(154, 85, 37, .8); }

/* « Les modalités » : quatre repères (public, prérequis, durée, lieu) */
.fc-modalites { display: grid; gap: var(--e-3); }
@media (min-width: 40em) { .fc-modalites { grid-template-columns: repeat(2, 1fr); } }
.fc-modalites > div { display: grid; gap: var(--e-1); align-content: start; padding: var(--e-4) var(--e-5); background: rgba(251, 248, 243, .07); border: 1px solid rgba(233, 199, 155, .3); border-radius: var(--r-carte); }
.fc-modalites dt { font-size: var(--t-xs); font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--c-dore); }
.fc-modalites dd { font-size: var(--t-s); color: var(--c-fond); }

/* « Les catégories » : code en arche (1A, 1B, 3…) + intitulé */
.fc-categories { display: grid; gap: var(--e-3); grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); list-style: none; padding: 0; }
.fc-categories li { display: grid; grid-template-columns: auto 1fr; gap: var(--e-4); align-items: center; padding: var(--e-4); background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte); transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.fc-categories li:hover { transform: translateY(-3px); border-color: var(--c-dore); box-shadow: 0 1rem 2rem -1.25rem rgba(154, 85, 37, .45); }
.fc-categories__code { display: grid; place-items: end center; width: 3rem; height: 3.5rem; padding-bottom: .4rem; border-radius: var(--r-pilule) var(--r-pilule) .375rem .375rem; background: var(--c-vert-pale); color: var(--c-vert); font: 400 1.25rem/1 var(--f-titre); transition: background-color .3s, color .3s; }
.fc-categories li:hover .fc-categories__code { background: var(--c-vert); color: var(--c-fond); }
.fc-categories__texte { display: grid; gap: .15rem; font-size: var(--t-s); color: var(--c-texte-2); }
.fc-categories__texte strong { font-size: var(--t-m); color: var(--c-texte); }

/* Tarifs : détail de chaque formule */
.fc-tarif__details { display: grid; gap: .3rem; margin: 0; padding: 0; list-style: none; font-size: var(--t-s); color: var(--c-texte-2); }
.fc-tarif__details li { position: relative; padding-left: 1.1rem; }
.fc-tarif__details li::before { content: ""; position: absolute; left: 0; top: .55em; width: .45rem; height: .55rem; border-radius: var(--r-pilule) var(--r-pilule) 1px 1px; background: var(--c-dore); }

/* Évaluation : trois étapes sur fond clair */

/* Bandeau final */
.theme-formation .btn--clair-fiche { color: #6E3A18; }
.theme-formation .btn--contour-clair-fiche:hover { color: #6E3A18; }




/* Titre : le code de la formation en ocre */
.theme-formation .fiche-haut__titre { color: var(--c-texte); }
.theme-formation .fiche-haut__titre em { font-style: normal; color: var(--c-ocre); }

/* Carte du haut : codes longs (ex. « B1-B1V-B2-… ») en plus petit */
.fc-code--moyen { font-size: 2.5rem; }
.fc-code--long { max-width: 14ch; font-size: 1.75rem; line-height: 1.15; overflow-wrap: anywhere; }

/* Carte du haut : validité en grand chiffre doré */
.fc-validite { display: flex; align-items: baseline; justify-content: center; gap: var(--e-2); margin-top: var(--e-1); padding-top: var(--e-4); border-top: 1px solid rgba(233, 199, 155, .3); width: 70%; }
.fc-validite__chiffre { font: 400 3rem/1 var(--f-titre); color: var(--c-dore); }
.fc-validite__texte { font-size: var(--t-s); font-weight: 600; color: var(--c-fond); }

/* Programme : onglets Théorie / Pratique, liste sur deux colonnes */
.fc-onglets__liste { margin-bottom: var(--e-5); background: var(--c-vert-pale); }
.fc-onglets__liste .onglets__onglet[aria-selected="true"] { box-shadow: 0 8px 18px -10px rgba(143, 74, 30, .8); }
.fc-onglets__nb { display: inline-grid; place-items: center; min-width: 1.5rem; height: 1.5rem; margin-left: var(--e-1); padding-inline: .35rem; border-radius: var(--r-pilule); background: rgba(43, 38, 34, .08); font-size: .75rem; }
.onglets__onglet[aria-selected="true"] .fc-onglets__nb { background: rgba(251, 248, 243, .2); }
.fc-onglets__panneau { padding: var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-top: 4px solid var(--c-vert); border-radius: var(--r-carte); }
.fc-onglets__panneau + .fc-onglets__panneau { margin-top: var(--e-4); }
.js .fc-onglets__panneau + .fc-onglets__panneau { margin-top: 0; }
.fc-onglets__panneau.est-actif { animation: fc-apparait .45s var(--ease); }
@keyframes fc-apparait { from { opacity: 0; transform: translateY(8px); } }
.fc-onglets__titre { margin-bottom: var(--e-4); font-size: var(--t-m); }
.js .fc-onglets__titre { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (min-width: 48em) { .fc-colonnes { display: block; columns: 2; column-gap: var(--e-6); } .fc-colonnes li { break-inside: avoid; margin-bottom: var(--e-3); } }

/* Tarifs : prix sur une ligne, unité dessous ; formule mise en avant */
.fc-tarif { display: flex; flex-direction: column; gap: var(--e-3); }
.fc-tarif__prix { display: grid; gap: .1rem; padding-bottom: var(--e-3); border-bottom: 1px dashed var(--c-filet); }
.fc-tarif__montant { font: 400 2.5rem/1 var(--f-titre); color: var(--c-vert); white-space: nowrap; }
/* v1.52 : prix en toutes lettres (« Consultez-nous ») : la taille suit la largeur de la carte (unité cqi),
   le texte peut passer à la ligne au besoin : il ne déborde plus jamais du cadre. */
.fc-tarif { container-type: inline-size; min-width: 0; }
.fc-tarif__montant--texte { display: flex; align-items: center; min-height: 2.5rem; white-space: normal; font-size: clamp(1.4rem, 14cqi, 2.25rem); line-height: 1.15; overflow-wrap: break-word; }
/* (une ligne d'unité vide est ajoutée sous le texte : le pointillé et les détails s'alignent sur les cartes voisines) */
.fc-tarif__unite { font-size: var(--t-xs); font-weight: 600; letter-spacing: .03em; color: var(--c-texte-2); }
.fc-tarif--vedette { border-color: var(--c-dore); box-shadow: 0 0 0 2px var(--c-dore), 0 1.5rem 2.5rem -1.5rem rgba(154, 85, 37, .5); }
.fc-tarif--vedette::before { background: var(--c-dore) !important; }

/* Financement : pastilles plus grandes */
.theme-formation #financement .fiche-metiers { gap: var(--e-3); }
.theme-formation #financement .fiche-metiers li { padding: .6rem var(--e-5) .6rem var(--e-4); font-size: var(--t-m); }

/* Évaluation : trois issues avec picto (pas de numéros) */
.fc-evaluation { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); list-style: none; padding: 0; }
.fc-evaluation__cas { display: grid; gap: var(--e-2); align-content: start; padding: var(--e-5) var(--e-4); background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte); font-size: var(--t-s); color: var(--c-texte-2); transition: transform .3s ease, box-shadow .3s ease; }
.fc-evaluation__cas:hover { transform: translateY(-4px); box-shadow: 0 1rem 2rem -1.25rem rgba(154, 85, 37, .45); }
.fc-evaluation__cas strong { font-size: var(--t-m); color: var(--c-texte); }
.fc-evaluation__picto { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; margin-bottom: var(--e-1); border-radius: 50%; background: var(--c-vert-pale); color: var(--c-vert); }
.fc-evaluation__picto svg { width: 1.4rem; height: 1.4rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.fc-evaluation__cas--reussite .fc-evaluation__picto { background: #3D632D; color: var(--c-fond); }
.fc-evaluation__cas--echec .fc-evaluation__picto { background: var(--c-dore); color: #5A3A22; }
.fc-evaluation__cas--document .fc-evaluation__picto { background: var(--c-vert); color: var(--c-fond); }

/* Bandeau final : carte brun-ocre posée sur le fond crème (transition douce avant le pied de page vert) */
.fc-cta { margin: 0 auto var(--e-8); width: min(100% - 2 * var(--gouttiere), var(--conteneur)); padding-block: var(--e-7); border-radius: 12rem 12rem var(--r-carte) var(--r-carte);
  background: radial-gradient(90% 120% at 85% 0%, #7A4A28 0%, #5A3A22 40%, #2E2420 100%); box-shadow: 0 2rem 3.5rem -2rem rgba(90, 58, 34, .6); }
@media (max-width: 48em) { .fc-cta { border-radius: 6rem 6rem var(--r-carte) var(--r-carte); } }
.fc-cta .fiche-cta__grille { padding-inline: var(--e-6); }
.fc-cta p { color: var(--c-dore); }
.fc-cta__decor img { width: 62%; height: auto; }

@media (prefers-reduced-motion: reduce) { .fc-categories li:hover, .fc-evaluation__cas:hover { transform: none; } .fc-onglets__panneau.est-actif { animation: none; } }
@media (forced-colors: active) { .fc-modalites > div, .fc-categories li, .fc-evaluation__cas, .fc-onglets__panneau { border: 1px solid CanvasText; } }

/* ---------- Pages de choix (ex. R485 : catégorie 1 ou 2 ; R486 : A ou B) ---------- */
.fc-groupe-haut { padding-block: var(--e-7) var(--e-8); }
.fc-groupe-haut__contenu { display: grid; justify-items: center; gap: var(--e-3); text-align: center; }
.fc-groupe-haut .fil-ariane ol { justify-content: center; }
.fc-groupe-haut .fiche-haut__titre { margin: 0; }
.fc-groupe-haut__code { font: 400 clamp(1.5rem, 1.2rem + 1vw, 2rem)/1.1 var(--f-titre); color: var(--c-ocre); }
.fc-groupe-haut__code::after { content: ""; display: block; width: 3rem; height: 3px; margin: var(--e-3) auto 0; border-radius: 3px; background: var(--c-dore); }
.fc-choix { padding-block: 0 var(--e-8); margin-top: calc(-1 * var(--e-6)); position: relative; }
.fc-choix__liste { display: grid; gap: var(--e-5); grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); max-width: 52rem; margin-inline: auto; list-style: none; padding: 0; }
.fc-choix__carte { display: flex; flex-direction: column; height: 100%; overflow: hidden; background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  color: var(--c-texte); text-decoration: none; box-shadow: 0 1.5rem 3rem -2rem rgba(90, 58, 34, .45); transition: transform .4s var(--ease), border-color .3s, box-shadow .4s var(--ease); }
.fc-choix__carte:hover { transform: translateY(-6px); border-color: var(--c-dore); box-shadow: 0 2rem 3rem -1.5rem rgba(90, 58, 34, .55); color: var(--c-texte); }
.fc-choix__carte:focus-visible { outline: 3px solid var(--c-vert); outline-offset: 3px; }
.fc-choix__image { position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: var(--c-vert-pale); }
.fc-choix__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.fc-choix__carte:hover .fc-choix__image img { transform: scale(1.06); }
.fc-choix__lettre { position: absolute; left: var(--e-5); bottom: 0; display: grid; place-items: end center; width: 3.5rem; height: 4.25rem; padding-bottom: .45rem;
  border-radius: var(--r-pilule) var(--r-pilule) .375rem .375rem; background: linear-gradient(150deg, #8F4A1E, #5A3A22); color: var(--c-dore); font: 400 1.875rem/1 var(--f-titre); }
.fc-choix__corps { display: flex; flex-direction: column; gap: var(--e-2); flex: 1; padding: var(--e-5); }
.fc-choix__titre { font-size: clamp(1.375rem, 1.2rem + .5vw, 1.625rem); line-height: 1.2; color: var(--c-texte); }
.fc-choix__categorie { justify-self: start; width: fit-content; padding: .2rem var(--e-3); border-radius: var(--r-pilule); background: var(--c-vert-pale); color: var(--c-vert); font-size: var(--t-xs); font-weight: 700; }
.fc-choix__texte { font-size: var(--t-s); color: var(--c-texte-2); }
.fc-choix__bouton { align-self: flex-start; margin-top: auto; }
.fc-choix__carte:hover .btn__fleche { transform: translateX(4px); }
.titre__choix { font-size: var(--t-xs); font-weight: 600; color: var(--c-ocre); }
@media (prefers-reduced-motion: reduce) { .fc-choix__carte:hover { transform: none; } }


/* ===== 75-alternance.css ===== */
/* Rubrique Alternance (/alternance/ et ses sous-pages) — DA Exèdre, vert de marque, animations légères.
   Réutilise : .cat-entete (en-tête en arche), .btn--fiche, .fiche-coches, .fiche-rubrique__num (70-fiche.css). */

/* ---------- Bandeau photo (titre centré, comme le site officiel, plus compact que l'accueil) ---------- */
.alt-bandeau { position: relative; display: grid; place-items: center; min-height: clamp(15rem, 28vw, 21rem); overflow: hidden; isolation: isolate;
  background: linear-gradient(135deg, var(--c-vert) 0%, var(--c-vert-fonce) 100%); color: var(--c-fond); text-align: center; }
.alt-bandeau__photo { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.alt-bandeau::after { /* voile vert de marque pour la lisibilité du titre */
  content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(47, 83, 35, .35) 0%, rgba(47, 83, 35, .55) 60%, rgba(47, 83, 35, .78) 100%); }
.alt-bandeau--sans-photo::after { background: radial-gradient(80% 120% at 50% 0%, rgba(233, 199, 155, .18), transparent 60%); }
.alt-bandeau__contenu { display: grid; gap: var(--e-3); justify-items: center; padding-block: var(--e-7); }
.alt-bandeau__titre { max-width: 22ch; font: 400 clamp(2.25rem, 1.6rem + 2.8vw, 3.75rem)/1.08 var(--f-titre); color: var(--c-fond); text-shadow: 0 2px 18px rgba(0, 0, 0, .25); }
.alt-bandeau__titre::after { content: ""; display: block; width: 3.5rem; height: 3px; margin: var(--e-4) auto 0; border-radius: 3px; background: var(--c-dore); }
.alt-bandeau__ariane ol { justify-content: center; }
.alt-bandeau__ariane a, .alt-bandeau__ariane [aria-current="page"] { color: var(--c-fond); }
.alt-bandeau__ariane li + li::before { border-color: var(--c-vert-clair); }
.alt-bandeau :focus-visible { outline-color: var(--c-fond); }
@media (prefers-reduced-motion: no-preference) {
  .alt-bandeau__photo { animation: alt-zoom 1.6s var(--ease) both; }
}
@keyframes alt-zoom { from { transform: scale(1.08); } to { transform: none; } }

/* ---------- Cartes des rubriques et des articles ---------- */
.alt-rubriques { padding-block: var(--e-7) var(--e-8); }
.alt-cartes { display: grid; gap: var(--e-5); grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); list-style: none; padding: 0; }
@media (min-width: 64em) { .alt-cartes { grid-template-columns: repeat(4, 1fr); } .alt-cartes--3 { grid-template-columns: repeat(3, 1fr); } }
.alt-carte__lien { display: flex; flex-direction: column; height: 100%; overflow: hidden; background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  color: var(--c-texte); text-decoration: none; transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.alt-carte__lien:hover { transform: translateY(-6px); border-color: var(--c-vert-clair); box-shadow: 0 1.5rem 2.5rem -1.25rem rgba(61, 99, 45, .5); color: var(--c-texte); }
.alt-carte__image { position: relative; aspect-ratio: 768 / 598; overflow: hidden; background: var(--c-vert-pale); }
.alt-carte__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.alt-carte__lien:hover .alt-carte__image img { transform: scale(1.06); }
.alt-carte__vide { position: absolute; inset: 18% 30% 0; border-radius: var(--r-pilule) var(--r-pilule) 0 0; background: var(--c-vert-teinte); border: 1.5px solid var(--c-vert-clair); border-bottom: 0; }
.alt-carte__num { position: absolute; left: var(--e-4); bottom: 0; display: grid; place-items: end center; width: 3rem; height: 3.5rem; padding-bottom: .4rem;
  border-radius: var(--r-pilule) var(--r-pilule) 0 0; background: var(--c-vert); color: var(--c-fond); font: 400 1.25rem/1 var(--f-titre); }
.alt-carte__corps { display: flex; flex-direction: column; gap: var(--e-3); flex: 1; padding: var(--e-5); }
.alt-carte__titre { font: 400 1.5rem/1.15 var(--f-titre); color: var(--c-vert); }
.alt-carte__corps p { font-size: var(--t-s); color: var(--c-texte-2); }
.alt-carte__bouton { align-self: flex-start; margin-top: auto; }
.alt-carte__lien:hover .alt-carte__bouton { transform: translateY(-2px); box-shadow: 0 12px 24px -12px rgba(61, 99, 45, .55); }
.alt-carte__lien:hover .btn__fleche { transform: translateX(4px); }
.alt-carte__lien:focus-visible { outline: 3px solid var(--c-vert); outline-offset: 3px; }

/* ---------- Pages contrat ---------- */
.alt-contrat { display: grid; gap: var(--e-7); max-width: 60rem; padding-block: var(--e-7) var(--e-8); }
.alt-intro { display: grid; gap: var(--e-4); }
.alt-intro__chapo { font-size: var(--t-l); }
.alt-section { display: grid; gap: var(--e-4); }
.alt-section h2 { position: relative; padding-left: var(--e-5); font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem); }
.alt-section h2::before { content: ""; position: absolute; left: 0; top: .2em; bottom: .2em; width: 5px; border-radius: 3px; background: var(--c-vert); }
.alt-section__intro { font-weight: 600; color: var(--c-vert-fonce); }

/* Vidéo explicative (CDI Apprentissage, v1.45) : cadre 16/9 prêt à recevoir la vidéo YouTube */
.alt-video { display: grid; gap: var(--e-4); }
.alt-video__texte { display: grid; gap: var(--e-2); }
.alt-video__texte h2 { font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem); }
.alt-video__texte p { color: var(--c-texte-2); }
.alt-video__cadre { width: 100%; }
.alt-video__attente { display: grid; place-items: center; align-content: center; gap: var(--e-4); color: var(--c-fond);
  background: radial-gradient(120% 90% at 50% 110%, rgba(201, 221, 184, .22), transparent 60%), var(--c-vert-fonce); }
.alt-video__attente .video__icone { opacity: .9; }
.alt-video__mention { padding: var(--e-1) var(--e-4); border-radius: var(--r-pilule); background: rgba(251, 248, 243, .14);
  border: 1px solid rgba(251, 248, 243, .4); font-size: var(--t-s); font-weight: 600; }
@media (min-width: 52em) { .alt-video { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: center; gap: var(--e-6); } }

/* Avantages : deux colonnes de cartes numérotées 01, 02… */
.alt-avantages { display: grid; gap: var(--e-6); }
@media (min-width: 52em) { .alt-avantages { grid-template-columns: 1fr 1fr; } }
.alt-avantages__groupe { display: grid; gap: var(--e-3); align-content: start; }
.alt-avantages__groupe h3 { font-size: var(--t-m); color: var(--c-ocre); }
.alt-numeros { display: grid; gap: var(--e-3); list-style: none; padding: 0; }
.alt-numeros li { display: flex; align-items: center; gap: var(--e-4); padding: var(--e-4) var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-left: 4px solid var(--c-vert);
  border-radius: .6rem var(--r-carte) var(--r-carte) .6rem; transition: transform .3s ease, box-shadow .3s ease; }
.alt-numeros li:hover { transform: translateX(6px); box-shadow: 0 1rem 2rem -1.25rem rgba(61, 99, 45, .55); }
.alt-numeros__num { flex: none; font: 400 1.75rem/1 var(--f-titre); color: var(--c-vert); min-width: 2.25rem; }

/* Sous-titre vert sous le bandeau */
.alt-sous-titre { font: 400 clamp(1.625rem, 1.3rem + 1.2vw, 2.25rem)/1.2 var(--f-titre); color: var(--c-vert); }

/* Rémunération : tableau à en-tête vert + encadré « À retenir » */
.alt-tableau { overflow-x: auto; border-radius: var(--r-carte); border: 1px solid var(--c-filet); background: var(--c-blanc); box-shadow: 0 1.25rem 2.5rem -1.75rem rgba(61, 99, 45, .45); }
.alt-tableau table { width: 100%; min-width: 34rem; border-collapse: collapse; font-size: var(--t-s); }
.alt-tableau thead th { padding: var(--e-4) var(--e-5); background: var(--c-vert); color: var(--c-fond); font-weight: 700; text-align: center; }
.alt-tableau thead th:first-child { text-align: left; }
.alt-tableau tbody th { padding: var(--e-4) var(--e-5); text-align: left; font-weight: 700; }
.alt-tableau td { padding: var(--e-4) var(--e-5); text-align: center; }
.alt-tableau tbody tr { border-top: 1px solid var(--c-filet); transition: background-color .25s ease; }
.alt-tableau tbody tr:hover { background: var(--c-vert-teinte); }
.alt-tableau__accent { background: var(--c-vert-pale); font-weight: 700; }
.alt-tableau tbody tr:has(.alt-tableau__accent[colspan]) th { background: var(--c-vert-pale); }
.alt-tableau:focus-visible { outline: 3px solid var(--c-vert); outline-offset: 3px; }
.alt-retenir { display: grid; gap: var(--e-3); padding: var(--e-5); background: var(--c-vert-teinte); border-left: 4px solid var(--c-vert); border-radius: .5rem var(--r-carte) var(--r-carte) .5rem; }
.alt-retenir__titre { font-weight: 700; color: var(--c-vert-fonce); font-size: var(--t-m); }

/* ---------- Articles « Nos conseils » ---------- */
.alt-article { display: grid; gap: var(--e-7); max-width: 52rem; padding-block: var(--e-7) var(--e-8); }
.alt-conseil { display: grid; gap: var(--e-4); }
.alt-conseil > h2 { display: flex; align-items: center; gap: var(--e-4); font-size: clamp(1.5rem, 1.25rem + 1vw, 2.125rem); }
.alt-sous-liste { margin-left: var(--e-6); }
.alt-encart { display: grid; gap: var(--e-1); padding: var(--e-4) var(--e-5); background: var(--c-vert-teinte); border-left: 4px solid var(--c-vert); border-radius: .5rem var(--r-carte) var(--r-carte) .5rem; }
.alt-encart__titre { font-weight: 700; color: var(--c-vert-fonce); }
.alt-parcours { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); }
.alt-parcours__carte { position: relative; overflow: hidden; display: grid; gap: var(--e-3); align-content: start; padding: var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  transition: transform .3s ease, box-shadow .3s ease; }
.alt-parcours__carte::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: var(--c-vert); }
.alt-parcours__carte:hover { transform: translateY(-4px); box-shadow: 0 1.25rem 2.25rem -1.25rem rgba(61, 99, 45, .5); }
.alt-parcours__carte h3 { color: var(--c-vert-fonce); }
.alt-article__action { justify-self: start; }
.alt-article__retour a { font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
  .alt-carte__lien:hover, .alt-numeros li:hover, .alt-parcours__carte:hover { transform: none; }
  .alt-carte__lien:hover .alt-carte__image img { transform: none; }
}
@media (forced-colors: active) { .alt-carte__lien, .alt-numeros li, .alt-parcours__carte, .alt-tableau { border: 1px solid CanvasText; } }

/* ---------- Nos conseils : onglets en cartes, posés à cheval sur le bandeau ---------- */
.alt-conseils { padding-block: 0 var(--e-8); }
.alt-onglets__liste { position: relative; z-index: 2; display: grid; grid-template-columns: 1fr; gap: var(--e-3); width: 100%; max-width: 64rem;
  margin: calc(-1 * var(--e-6)) auto var(--e-7); padding: 0; background: none; border-radius: 0; }
.alt-onglets__liste[hidden] { display: none; }
@media (min-width: 48em) { .alt-onglets__liste { grid-template-columns: repeat(3, 1fr); gap: var(--e-4); margin-top: calc(-1 * var(--e-7)); } }
.alt-onglets__liste .onglets__onglet { position: relative; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: var(--e-4);
  padding: var(--e-5); text-align: left; background: var(--c-blanc); color: var(--c-texte); border: 1px solid var(--c-filet); border-top: 4px solid var(--c-vert);
  border-radius: var(--r-carte); box-shadow: 0 1.25rem 2.5rem -1.5rem rgba(47, 83, 35, .45); font: 600 var(--t-m)/1.3 var(--f-texte);
  transition: transform .3s ease, box-shadow .3s ease, background-color .3s ease, color .3s ease; }
.alt-onglets__liste .onglets__onglet:hover { transform: translateY(-4px); color: var(--c-vert-fonce); box-shadow: 0 1.5rem 3rem -1.5rem rgba(61, 99, 45, .6); }
.alt-onglet__num { display: grid; place-items: end center; width: 2.75rem; height: 3.25rem; padding-bottom: .35rem; border-radius: var(--r-pilule) var(--r-pilule) .375rem .375rem;
  background: var(--c-vert-pale); color: var(--c-vert-fonce); font: 400 1.25rem/1 var(--f-titre); transition: background-color .3s ease, color .3s ease; }
.alt-onglets__liste .onglets__onglet[aria-selected="true"] { background: linear-gradient(150deg, var(--c-vert) 0%, var(--c-vert-fonce) 100%); color: var(--c-fond); border-color: var(--c-vert); border-top-color: var(--c-dore);
  box-shadow: 0 1.75rem 3rem -1.5rem rgba(47, 83, 35, .85); }
.alt-onglets__liste .onglets__onglet[aria-selected="true"] .alt-onglet__num { background: var(--c-fond); color: var(--c-vert); }
.alt-onglet__fleche { display: none; }
@media (min-width: 48em) {
  .alt-onglets__liste .onglets__onglet[aria-selected="true"] .alt-onglet__fleche { /* petite pointe sous l'onglet choisi */
    display: block; position: absolute; left: 50%; bottom: -.6rem; width: 1.2rem; height: 1.2rem; transform: translateX(-50%) rotate(45deg); background: var(--c-vert-fonce); border-radius: 0 0 .2rem 0; }
}
.alt-onglets__liste .onglets__onglet:focus-visible { outline: 3px solid var(--c-vert); outline-offset: 3px; }
.alt-onglets__panneau { gap: var(--e-6); }
.alt-onglets__tete { display: grid; gap: var(--e-5); align-items: center; max-width: 60rem; margin-inline: auto; width: 100%; }
@media (min-width: 52em) { .alt-onglets__tete:has(.alt-onglets__photo) { grid-template-columns: 18rem 1fr; } }
.alt-onglets__photo { aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--r-pilule) var(--r-pilule) var(--r-carte) var(--r-carte); box-shadow: 0 1.5rem 3rem -2rem rgba(61, 99, 45, .6); }
.alt-onglets__photo img { width: 100%; height: 100%; object-fit: cover; }
.alt-onglets__intro { display: grid; gap: var(--e-3); }
.alt-onglets__titre { font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem); color: var(--c-vert); }
.alt-onglets__intro p { font-size: var(--t-l); color: var(--c-texte-2); }
.alt-article--onglet { padding-block: var(--e-4) 0; margin-inline: auto; width: 100%; }
@media (prefers-reduced-motion: reduce) { .alt-onglets__liste .onglets__onglet:hover { transform: none; } }

/* ---------- Nos offres d'alternance : chiffres clés, filtres en pastilles, une carte par offre ---------- */
.offres { padding-block: var(--e-6) var(--e-8); }
.offres-chiffres { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--e-4); max-width: 40rem; margin: 0 auto var(--e-6); text-align: center; }
.offres-chiffres > div { display: flex; flex-direction: column-reverse; gap: var(--e-1); }
.offres-chiffres dd { font: 400 clamp(2.5rem, 1.8rem + 3vw, 3.75rem)/1 var(--f-titre); color: var(--c-vert); }
.offres-chiffres dt { font-size: var(--t-s); color: var(--c-texte-2); }
.offres-chiffres > div + div { border-left: 1px solid var(--c-filet); }

.offres-filtres { display: grid; gap: var(--e-4); padding: var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  box-shadow: 0 1.5rem 3rem -2.25rem rgba(61, 99, 45, .45); }
.js .offres-filtres.js-seulement { display: grid !important; }
@media (min-width: 60em) { .offres-filtres { grid-template-columns: 1fr 16rem; align-items: end; } }
.offres-filtres__formations { display: flex; flex-wrap: wrap; gap: var(--e-2); min-width: 0; min-inline-size: 0; border: 0; padding: 0; margin: 0; }
.offres-filtres > * { min-width: 0; }
.offres-pastille { position: relative; display: inline-flex; align-items: center; gap: var(--e-2); padding: .5rem var(--e-4); border: 1.5px solid var(--c-filet); border-radius: var(--r-pilule);
  background: var(--c-fond); font-size: var(--t-s); font-weight: 600; color: var(--c-texte); cursor: pointer; transition: border-color .25s, background-color .25s, color .25s, transform .25s var(--ease); }
.offres-pastille:hover { border-color: var(--c-vert); transform: translateY(-2px); }
.offres-pastille input { position: absolute; opacity: 0; pointer-events: none; }
.offres-pastille span { display: inline-grid; place-items: center; min-width: 1.5rem; height: 1.5rem; padding-inline: .35rem; border-radius: var(--r-pilule); background: var(--c-vert-pale); color: var(--c-vert-fonce); font-size: .75rem; }
.offres-pastille:has(input:checked) { background: var(--c-vert); border-color: var(--c-vert); color: var(--c-fond); box-shadow: 0 8px 18px -10px rgba(47, 83, 35, .8); }
.offres-pastille:has(input:checked) span { background: var(--c-fond); color: var(--c-vert); }
.offres-pastille:has(input:focus-visible) { outline: 3px solid var(--c-vert); outline-offset: 3px; }
.offres-filtres__ville { display: grid; gap: var(--e-1); }
.offres-filtres__ville label { font-size: var(--t-xs); font-weight: 600; color: var(--c-texte-2); padding-left: var(--e-2); }
.offres-filtres__ville input { width: 100%; min-height: 2.875rem; padding: var(--e-2) var(--e-4); border: 1.5px solid var(--c-bordure-ui); border-radius: .875rem; background: var(--c-fond); font: 500 var(--t-s)/1.3 var(--f-texte); color: var(--c-texte); }
.offres-filtres__ville input:hover, .offres-filtres__ville input:focus { border-color: var(--c-vert); }

.offres-etat { margin: var(--e-5) 0 var(--e-4); font: 400 1.5rem/1.2 var(--f-titre); color: var(--c-texte); }
.offres-grille { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); list-style: none; padding: 0; }
.offre-carte { position: relative; display: grid; grid-template-columns: auto 1fr; gap: var(--e-2) var(--e-4); align-content: start; padding: var(--e-5) var(--e-4) var(--e-4);
  background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte); overflow: hidden;
  transition: transform .35s var(--ease), border-color .3s, box-shadow .35s var(--ease); }
.offre-carte[hidden] { display: none; }
.offre-carte::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, var(--c-vert), var(--c-vert-clair)); transform: scaleX(.2); transform-origin: left; transition: transform .45s var(--ease); }
.offre-carte:hover { transform: translateY(-5px); border-color: var(--c-vert-clair); box-shadow: 0 1.5rem 2.5rem -1.5rem rgba(61, 99, 45, .5); }
.offre-carte:hover::before { transform: none; }
.offre-carte__arche { display: grid; place-items: end center; width: 3.25rem; height: 3.75rem; padding: 0 .2rem .45rem; border-radius: var(--r-pilule) var(--r-pilule) .375rem .375rem;
  background: var(--c-vert-pale); color: var(--c-vert); font: 400 1rem/1 var(--f-titre); text-align: center; transition: background-color .3s, color .3s; }
.offre-carte:hover .offre-carte__arche { background: var(--c-vert); color: var(--c-fond); }
.offre-carte__corps { display: grid; gap: .3rem; align-content: start; }
.offre-carte__type { font-size: .7rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--c-ocre); }
.offre-carte__titre { font-size: 1.3rem; line-height: 1.2; color: var(--c-texte); }
.offre-carte__ville { display: flex; align-items: center; gap: .35rem; font-size: var(--t-s); font-weight: 600; color: var(--c-vert-fonce); }
.offre-carte__ville svg { flex: none; width: 1rem; height: 1rem; fill: none; stroke: var(--c-vert); stroke-width: 2; }
.offre-carte__niveau { font-size: var(--t-xs); color: var(--c-texte-2); }
.offre-carte__lien { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; margin-top: var(--e-3); padding: .6rem var(--e-4);
  border-radius: var(--r-pilule); background: var(--c-vert-teinte); color: var(--c-vert-fonce); font-size: var(--t-s); font-weight: 700; text-decoration: none; transition: background-color .3s, color .3s; }
.offre-carte__lien span[aria-hidden] { transition: transform .3s var(--ease); }
.offre-carte:hover .offre-carte__lien, .offre-carte__lien:focus-visible { background: var(--c-vert); color: var(--c-fond); }
.offre-carte:hover .offre-carte__lien span[aria-hidden] { transform: translateX(4px); }
/* Réapparition en cascade après un filtre */
@media (prefers-reduced-motion: no-preference) {
  .offre-carte.est-filtree { animation: offre-apparait .5s var(--ease) both; animation-delay: calc(var(--ordre, 0) * 45ms); }
}
@keyframes offre-apparait { from { opacity: 0; transform: translateY(14px) scale(.98); } }
.offres-vide { display: grid; justify-items: center; gap: var(--e-4); padding: var(--e-7) var(--e-4); text-align: center; color: var(--c-texte-2); }
.offres-vide[hidden] { display: none; }
@media (max-width: 40em) {
  .offres-filtres__formations { flex-wrap: nowrap; overflow-x: auto; padding-bottom: var(--e-2); scrollbar-width: thin; }
  .offres-pastille { flex: none; }
}
@media (prefers-reduced-motion: reduce) { .offre-carte:hover, .offres-pastille:hover { transform: none; } }
@media (forced-colors: active) { .offre-carte, .offres-filtres { border: 1px solid CanvasText; } }

/* ---------- Pages contrats : « Les démarches à suivre » (encadré à part) et encart rémunération ---------- */
.alt-section--demarches { padding: var(--e-6) clamp(1.25rem, 4vw, 2.5rem); background: var(--c-vert-pale); border-radius: var(--r-carte); }
.alt-demarches { display: grid; gap: var(--e-4); list-style: none; padding: 0; counter-reset: none; }
@media (min-width: 52em) { .alt-demarches { grid-template-columns: repeat(3, 1fr); } }
.alt-demarches li { position: relative; display: grid; gap: var(--e-3); align-content: start; padding: var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.alt-demarches li:hover { transform: translateY(-4px); box-shadow: 0 1.25rem 2.25rem -1.5rem rgba(61, 99, 45, .6); }
.alt-demarches__num { display: inline-grid; place-items: center; width: 2.6rem; height: 3rem; padding-top: .25rem; border-radius: var(--r-pilule) var(--r-pilule) .4rem .4rem;
  background: var(--c-vert); color: var(--c-fond); font: 400 1.35rem/1 var(--f-titre); }

.alt-section--boost { padding: var(--e-6) clamp(1.25rem, 4vw, 2.5rem); background: linear-gradient(150deg, var(--c-vert) 0%, var(--c-vert-fonce) 100%); color: var(--c-fond); border-radius: var(--r-carte); }
.alt-section--boost h2::before { background: var(--c-dore); }
.alt-boost__chapo { font-size: var(--t-l); line-height: 1.55; color: var(--c-vert-clair); max-width: 60ch; }
.alt-boost__chapo strong { color: var(--c-fond); font-weight: 600; }
.alt-boost { display: grid; gap: var(--e-4); list-style: none; padding: 0; margin-block: var(--e-2); }
@media (min-width: 52em) { .alt-boost { grid-template-columns: 1fr 1fr; } }
.alt-boost__exemple { display: grid; gap: var(--e-3); align-content: start; padding: var(--e-5); background: rgba(251, 248, 243, .07); border: 1px solid rgba(201, 221, 184, .3); border-radius: var(--r-carte); }
.alt-boost__gain { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--e-2) var(--e-3); color: var(--c-vert-clair); }
.alt-boost__chiffre { font: 400 clamp(2.75rem, 2rem + 2.4vw, 3.75rem)/1 var(--f-titre); color: var(--c-dore); }
.alt-boost__salaires { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e-2) var(--e-3); font: 400 1.35rem/1.25 var(--f-titre); }
.alt-boost__salaires svg { width: 1.3rem; height: 1.3rem; color: var(--c-dore); flex: none; }
.alt-boost__salaires strong { font-weight: 400; color: var(--c-dore); }
.alt-boost__texte { font-size: var(--t-s); line-height: 1.6; color: var(--c-vert-clair); }
.alt-boost__lien a { color: var(--c-fond); font-weight: 600; }
.alt-boost__lien a:focus-visible { outline-color: var(--c-dore); }
.alt-boost__source { font-size: var(--t-xs); color: var(--c-vert-clair); opacity: .85; }
@media (prefers-reduced-motion: reduce) { .alt-demarches li:hover { transform: none; } }
@media (forced-colors: active) { .alt-demarches li, .alt-boost__exemple, .alt-section--boost, .alt-section--demarches { border: 1px solid CanvasText; } }

/* 5 cartes (avec « Nos offres d'alternance », v1.43) : 3 + 2 centrées sur grand écran */
@media (min-width: 64em) {
  .alt-cartes--5 { grid-template-columns: repeat(6, 1fr); }
  .alt-cartes--5 > li { grid-column: span 2; }
  .alt-cartes--5 > li:nth-child(4) { grid-column: 2 / span 2; }
}


/* ===== 76-employeurs.css ===== */
/* Rubrique Employeurs (/employeurs/ et ses 2 pages) — même DA que l'Alternance : bandeau photo, vert de marque, arches, animations légères.
   Le bandeau et les cartes de /employeurs/ réutilisent les styles de 75-alternance.css. */

.emp-cartes { max-width: 52rem; margin-inline: auto; }
@media (min-width: 64em) { .emp-cartes { grid-template-columns: repeat(2, 1fr); } }

.emp-page { display: grid; gap: var(--e-8); max-width: 66rem; padding-block: var(--e-7) var(--e-8); }

/* ---------- Recruter : les 4 engagements, en volets (clic = texte révélé, comme les questions de l'accueil) ---------- */
.emp-engagements { display: grid; gap: var(--e-4); align-items: start; }
.emp-engagements { width: 100%; max-width: 52rem; margin-inline: auto; } /* une colonne, comme la FAQ de l'accueil : pas de trou quand un volet s'ouvre */
.emp-engagement { position: relative; background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte); overflow: hidden;
  transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease; }
.emp-engagement::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, var(--c-vert), var(--c-vert-clair));
  transform: scaleX(.2); transform-origin: left; transition: transform .5s var(--ease); }
.emp-engagement:hover, .emp-engagement[open] { border-color: var(--c-vert-clair); box-shadow: 0 1.5rem 2.75rem -1.5rem rgba(61, 99, 45, .5); }
.emp-engagement:hover { transform: translateY(-4px); }
.emp-engagement:hover::before, .emp-engagement[open]::before { transform: none; }
.emp-engagement summary { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--e-4); padding: var(--e-5); cursor: pointer; list-style: none; }
.emp-engagement summary::-webkit-details-marker { display: none; }
.emp-engagement__num { display: grid; place-items: end center; width: 3rem; height: 3.5rem; padding-bottom: .4rem;
  border-radius: var(--r-pilule) var(--r-pilule) .375rem .375rem; background: var(--c-vert-pale); color: var(--c-vert);
  font: 400 1.375rem/1 var(--f-titre); transition: background-color .35s ease, color .35s ease; }
.emp-engagement:hover .emp-engagement__num, .emp-engagement[open] .emp-engagement__num { background: var(--c-vert); color: var(--c-fond); }
.emp-engagement__titre { font: 400 clamp(1.25rem, 1.1rem + .5vw, 1.5rem)/1.25 var(--f-titre); color: var(--c-vert); }
.emp-engagement summary::after { /* le « + » qui tourne, comme sur l'accueil */
  content: ""; flex: none; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--c-vert-pale) no-repeat center / .75rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M6 1v10M1 6h10' stroke='%232F5323' stroke-width='1.8'/%3E%3C/svg%3E");
  transition: transform .35s var(--ease); }
.emp-engagement[open] summary::after { transform: rotate(135deg); }
.emp-deroule__corps { padding: 0 var(--e-5) var(--e-5) calc(var(--e-5) + 3rem + var(--e-4)); }
.emp-deroule__corps p { font-size: var(--t-s); color: var(--c-texte-2); line-height: 1.7; }
@media (max-width: 40em) { .emp-deroule__corps { padding-left: var(--e-5); } }
/* Ouverture en douceur (navigateurs récents ; ailleurs, ouverture immédiate) */
.emp-engagement::details-content { block-size: 0; overflow: hidden; opacity: 0;
  transition: block-size .4s var(--ease), opacity .4s ease, content-visibility .4s allow-discrete; }
.emp-engagement[open]::details-content { block-size: auto; opacity: 1; }
@supports (interpolate-size: allow-keywords) { .emp-page { interpolate-size: allow-keywords; } }

/* ---------- Recruter : les 5 étapes, reliées par un fil (horizontal sur grand écran) ---------- */
.emp-etapes { position: relative; display: grid; gap: var(--e-4); list-style: none; padding: 0; }
.emp-etape { position: relative; display: grid; grid-template-columns: auto 1fr; column-gap: var(--e-4); row-gap: var(--e-2); align-items: start; align-content: start;
  padding: var(--e-4) var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte);
  transition: transform .35s ease, box-shadow .35s ease; }
.emp-etape:hover { transform: translateY(-4px); box-shadow: 0 1.25rem 2.25rem -1.25rem rgba(61, 99, 45, .5); }
.emp-etape__num { grid-row: span 2; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%;
  background: var(--c-vert); color: var(--c-fond); font: 400 1.375rem/1 var(--f-titre); box-shadow: 0 0 0 5px var(--c-vert-teinte); }
.emp-etape__titre { font-size: var(--t-m); line-height: 1.3; color: var(--c-vert-fonce); }
.emp-etape p { font-size: var(--t-s); color: var(--c-texte-2); }
@media (min-width: 64em) {
  .emp-etapes { grid-template-columns: repeat(5, 1fr); padding-top: var(--e-2); }
  .emp-etapes::before { content: ""; position: absolute; left: 10%; right: 10%; top: calc(var(--e-2) + var(--e-5) + 1.375rem); height: 2px;
    background: repeating-linear-gradient(90deg, var(--c-vert-clair) 0 8px, transparent 8px 14px); }
  .emp-etape { grid-template-columns: 1fr; justify-items: center; text-align: center; padding: var(--e-5) var(--e-4); background: transparent; border-color: transparent; }
  .emp-etape__num { grid-row: auto; position: relative; z-index: 1; margin-bottom: var(--e-2); box-shadow: 0 0 0 6px var(--c-fond); }
  .emp-etape:hover { background: var(--c-blanc); border-color: var(--c-filet); }
}

/* ---------- Recruter : les 2 questions ---------- */
.emp-questions { display: grid; gap: var(--e-5); margin-top: var(--e-4); }
@media (min-width: 52em) { .emp-questions { grid-template-columns: 1fr 1fr; } }
.emp-question { display: grid; gap: var(--e-3); align-content: start; padding: var(--e-5); background: var(--c-vert-teinte);
  border-left: 4px solid var(--c-vert); border-radius: .5rem var(--r-carte) var(--r-carte) .5rem; }
.emp-question h3 { font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem); color: var(--c-vert-fonce); }

/* ---------- Former : intro et objectifs ---------- */
.emp-intro { display: grid; gap: var(--e-4); max-width: 52rem; }
.emp-objectifs { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); list-style: none; padding: 0; }
@media (min-width: 64em) { .emp-objectifs { grid-template-columns: repeat(6, 1fr); } .emp-objectif { grid-column: span 2; } .emp-objectif:nth-child(4) { grid-column: 2 / span 2; } }
.emp-objectif { position: relative; display: grid; gap: var(--e-3); align-content: start; padding: var(--e-5); background: var(--c-blanc);
  border: 1px solid var(--c-filet); border-radius: var(--r-carte); overflow: hidden; transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease; }
.emp-objectif::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: var(--c-vert); transform: scaleX(.25); transform-origin: left; transition: transform .45s ease; }
.emp-objectif:hover { transform: translateY(-5px); border-color: var(--c-vert-clair); box-shadow: 0 1.5rem 2.75rem -1.5rem rgba(61, 99, 45, .5); }
.emp-objectif:hover::before { transform: none; }
.emp-objectif__num { font: 400 2rem/1 var(--f-titre); color: var(--c-vert-clair); }
.emp-objectif h3 { font-size: clamp(1.25rem, 1.1rem + .5vw, 1.5rem); line-height: 1.2; color: var(--c-vert); }
.emp-objectif p { font-size: var(--t-s); color: var(--c-texte-2); }

/* ---------- Appel à l'action (bandeau vert, bouton clair) ---------- */
.emp-appel { display: grid; justify-items: center; gap: var(--e-5); padding: var(--e-7) var(--e-5); text-align: center; color: var(--c-fond);
  background: radial-gradient(70% 120% at 50% 0%, rgba(233, 199, 155, .16), transparent 60%), linear-gradient(150deg, var(--c-vert) 0%, var(--c-vert-fonce) 100%);
  border-radius: var(--r-pilule) var(--r-pilule) var(--r-carte) var(--r-carte); }
.emp-appel__texte { max-width: 44rem; font: 400 clamp(1.375rem, 1.15rem + .9vw, 1.875rem)/1.35 var(--f-titre); }
.emp-appel .btn--plein { background: var(--c-fond); color: var(--c-vert-fonce); }
.emp-appel .btn--plein:hover { background: var(--c-blanc); color: var(--c-vert-fonce); }
.emp-appel :focus-visible { outline-color: var(--c-fond); }
.emp-appel:not(:has(.emp-appel__texte)) { padding: var(--e-6) var(--e-5); border-radius: var(--r-carte); } /* bouton seul : bandeau plus discret */

@media (prefers-reduced-motion: reduce) { .emp-engagement:hover, .emp-etape:hover, .emp-objectif:hover { transform: none; } }
@media (forced-colors: active) { .emp-engagement, .emp-etape, .emp-objectif, .emp-question, .emp-appel { border: 1px solid CanvasText; } }

/* ---------- Page « Recruter un(e) alternant(e) » dynamique (v1.42) ---------- */
.rec-hero { position: relative; overflow: hidden; padding-block: var(--e-5) var(--e-7);
  background: radial-gradient(60rem 30rem at 85% 10%, var(--c-vert-teinte), transparent 70%); }
.rec-hero::after { /* arches de l'exèdre en filigrane */
  content: ""; position: absolute; right: -6rem; bottom: -9rem; width: 26rem; aspect-ratio: 1; border-radius: 50%; pointer-events: none;
  box-shadow: 0 0 0 1.5px var(--c-vert-clair), 0 0 0 2.2rem var(--c-fond), 0 0 0 2.3rem var(--c-vert-clair), 0 0 0 4.4rem var(--c-fond), 0 0 0 4.5rem var(--c-vert-clair); opacity: .7; }
.rec-hero__grille { position: relative; z-index: 1; display: grid; gap: var(--e-6); align-items: center; }
@media (min-width: 60em) { .rec-hero__grille { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: var(--e-8); } }
.rec-hero__texte { display: grid; gap: var(--e-4); justify-items: start; }
.rec-hero__ariane { padding-block: 0 var(--e-2); }
.rec-hero__surtitre { font-size: var(--t-surtitre); font-weight: 600; color: var(--c-ocre); }
.rec-hero__titre { font: 400 clamp(2.25rem, 1.6rem + 2.8vw, 4rem)/1.08 var(--f-titre); color: var(--c-texte); }
.rec-hero__titre em { color: var(--c-vert); }
.rec-hero__chapo { max-width: 40ch; font-size: var(--t-l); color: var(--c-texte-2); line-height: 1.55; }
.rec-hero__actions { display: flex; flex-wrap: wrap; gap: var(--e-3); }

.rec-chiffres { display: grid; gap: var(--e-3); margin: 0; }
.rec-chiffre { display: flex; flex-direction: row-reverse; justify-content: flex-end; align-items: center; gap: var(--e-4); padding: var(--e-4) var(--e-5);
  background: var(--c-blanc); border: 1px solid var(--c-filet); border-radius: var(--r-carte); box-shadow: 0 1.25rem 2.5rem -2rem rgba(47, 83, 35, .45);
  transition: transform .35s var(--ease), border-color .35s; }
.rec-chiffre:nth-child(2) { margin-left: var(--e-6); }
.rec-chiffre:hover { transform: translateX(-6px); border-color: var(--c-vert-clair); }
.rec-chiffre dd { margin: 0; min-width: 3.5rem; font: 400 2.75rem/1 var(--f-titre); color: var(--c-vert); }
.rec-chiffre dt { color: var(--c-texte-2); }

.rec-page { display: grid; gap: var(--e-8); max-width: 70rem; padding-block: var(--e-6) var(--e-8); }
.rec-bloc { display: grid; gap: var(--e-5); }
.rec-bloc__titre { font: 400 clamp(1.85rem, 1.45rem + 1.4vw, 2.75rem)/1.15 var(--f-titre); }
.rec-bloc__titre em { color: var(--c-vert); }

.rec-avantages { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); list-style: none; padding: 0; }
.rec-avantage { position: relative; display: grid; gap: var(--e-2); align-content: start; padding: var(--e-5); background: var(--c-blanc); border: 1px solid var(--c-filet);
  border-radius: var(--r-carte); overflow: hidden; transition: transform .35s var(--ease), box-shadow .35s, border-color .35s; }
.rec-avantage::before { content: ""; position: absolute; inset: auto 0 0; height: 4px; background: var(--c-vert); transform: scaleX(0); transform-origin: left; transition: transform .45s var(--ease); }
.rec-avantage:hover { transform: translateY(-6px); border-color: var(--c-vert-clair); box-shadow: 0 1.5rem 2.75rem -1.75rem rgba(61, 99, 45, .55); }
.rec-avantage:hover::before { transform: none; }
.rec-avantage__icone { display: grid; place-items: center; width: 3.25rem; height: 3.75rem; margin-bottom: var(--e-2); border-radius: var(--r-pilule) var(--r-pilule) .5rem .5rem;
  background: var(--c-vert-teinte); color: var(--c-vert); transition: background-color .35s, color .35s; }
.rec-avantage:hover .rec-avantage__icone { background: var(--c-vert); color: var(--c-fond); }
.rec-avantage__icone svg { width: 1.5rem; height: 1.5rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.rec-avantage h3 { font: 400 1.4rem/1.2 var(--f-titre); color: var(--c-vert-fonce); }
.rec-avantage p { font-size: var(--t-s); color: var(--c-texte-2); }

.rec-contrats { display: grid; gap: var(--e-4); grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); list-style: none; padding: 0; }
.rec-contrat { position: relative; display: flex; flex-direction: column; gap: var(--e-3); padding: var(--e-6) var(--e-5) var(--e-5); border-radius: var(--r-carte);
  background: var(--c-vert-teinte); border: 1px solid var(--c-vert-pale); overflow: hidden; transition: background-color .4s, color .4s, transform .35s var(--ease); }
.rec-contrat__num { position: absolute; top: var(--e-3); right: var(--e-4); font: 400 3rem/1 var(--f-titre); color: var(--c-vert-clair); transition: color .4s; }
.rec-contrat h3 { font: 400 1.5rem/1.2 var(--f-titre); color: var(--c-vert-fonce); padding-right: 3rem; transition: color .4s; }
.rec-contrat p { color: var(--c-texte-2); font-size: var(--t-s); transition: color .4s; }
.rec-contrat__lien { margin-top: auto; font-weight: 600; color: var(--c-vert); transition: color .4s; }
.rec-contrat:hover, .rec-contrat:focus-within { background: var(--c-vert); transform: translateY(-4px); }
.rec-contrat:hover h3, .rec-contrat:hover p, .rec-contrat:hover .rec-contrat__lien,
.rec-contrat:focus-within h3, .rec-contrat:focus-within p, .rec-contrat:focus-within .rec-contrat__lien { color: var(--c-fond); }
.rec-contrat:hover .rec-contrat__num, .rec-contrat:focus-within .rec-contrat__num { color: rgba(255, 255, 255, .25); }
.rec-contrat__lien::after { content: ""; position: absolute; inset: 0; } /* toute la carte est cliquable */

.rec-frise { position: relative; display: grid; gap: var(--e-4); list-style: none; padding: 0; }
.rec-frise__etape { position: relative; display: grid; grid-template-columns: auto 1fr; column-gap: var(--e-4); align-items: start; }
.rec-frise__num { grid-row: span 2; display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; background: var(--c-blanc);
  border: 2px solid var(--c-vert); font: 400 1.25rem/1 var(--f-titre); color: var(--c-vert); transition: background-color .4s, color .4s; transition-delay: calc(var(--rang) * 180ms + .3s); }
.rec-frise__etape h3 { font: 600 var(--t-m)/1.3 var(--f-texte); color: var(--c-vert-fonce); }
.rec-frise__etape p { font-size: var(--t-s); color: var(--c-texte-2); }
.rec-frise.est-visible .rec-frise__num { background: var(--c-vert); color: var(--c-fond); }
@media (min-width: 56em) {
  .rec-frise { grid-template-columns: repeat(5, 1fr); }
  .rec-frise::before, .rec-frise::after { content: ""; position: absolute; left: 10%; right: 10%; top: 1.5rem; height: 2px; background: var(--c-filet); }
  .rec-frise::after { background: var(--c-vert); transform: scaleX(0); transform-origin: left; transition: transform 1.4s var(--ease) .2s; }
  .rec-frise.est-visible::after { transform: none; }
  .rec-frise__etape { grid-template-columns: 1fr; justify-items: center; text-align: center; row-gap: var(--e-2); z-index: 1; }
  .rec-frise__num { grid-row: auto; box-shadow: 0 0 0 6px var(--c-fond); }
}

.rec-engagements { display: grid; gap: var(--e-5); padding: var(--e-7) clamp(1.25rem, 4vw, 3rem); border-radius: var(--r-carte);
  background: linear-gradient(150deg, var(--c-vert-fonce), var(--c-vert)); color: var(--c-fond); }
.rec-engagements .rec-bloc__titre em { color: var(--c-dore); }
.rec-engagements ul { display: grid; gap: var(--e-4) var(--e-6); grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); list-style: none; padding: 0; }
.rec-engagements li { display: grid; gap: .3rem; padding-left: var(--e-4); border-left: 2px solid var(--c-dore); }
.rec-engagements strong { font: 400 1.3rem/1.2 var(--f-titre); }
.rec-engagements span { font-size: var(--t-s); color: var(--c-vert-clair); }
.rec-faq { max-width: 52rem; }

.rec-appel { display: grid; justify-items: center; gap: var(--e-4); text-align: center; padding: var(--e-7) var(--e-5); border-radius: var(--r-carte);
  background: var(--c-vert-fonce); color: var(--c-fond); }
.rec-appel h2 { font: 400 clamp(1.85rem, 1.45rem + 1.4vw, 2.75rem)/1.15 var(--f-titre); }
.rec-appel h2 em { color: var(--c-dore); }
.rec-appel p { color: var(--c-vert-clair); }
.rec-appel .btn--clair { color: var(--c-vert-fonce); }
.rec-appel .rec-hero__actions { justify-content: center; }
.rec-appel :focus-visible, .rec-engagements :focus-visible { outline-color: var(--c-fond); }

@media (prefers-reduced-motion: reduce) {
  .rec-avantage:hover, .rec-contrat:hover, .rec-chiffre:hover { transform: none; }
  .rec-frise::after { transition: none; } .rec-frise__num { transition: none; }
}
@media (forced-colors: active) { .rec-avantage, .rec-contrat, .rec-chiffre, .rec-engagements, .rec-appel { border: 1px solid CanvasText; } }


/* ===== 78-legal.css ===== */
/* Pages légales (/mentions-legales/, /confidentialite/) et page 404 : texte simple, lisible, dans la DA. */
.legal-entete { padding-block: var(--e-5) var(--e-7); }
.legal-entete .conteneur { display: grid; gap: var(--e-4); }
.legal-entete__titre { font-size: clamp(2.25rem, 1.6rem + 2.6vw, 3.5rem); max-width: 24ch; }
.legal { padding-block: var(--e-7) var(--e-8); display: grid; gap: var(--e-6); }
.legal__rubrique { display: grid; gap: var(--e-3); }
.legal__rubrique h2 { font-size: 1.6rem; padding-top: var(--e-4); border-top: 2px solid var(--c-filet); }
.legal__rubrique p { color: var(--c-texte-2); line-height: 1.7; max-width: 70ch; }
.legal__identite { display: grid; gap: 0; }
.legal__identite div { display: grid; gap: var(--e-1); padding-block: var(--e-3); border-bottom: 1px solid var(--c-filet); }
@media (min-width: 40em) { .legal__identite div { grid-template-columns: 13rem 1fr; gap: var(--e-5); } }
.legal__identite dt { font-size: var(--t-s); font-weight: 600; color: var(--c-ocre); }
.legal__identite dd { color: var(--c-texte); }
.legal__renvoi { padding: var(--e-4) var(--e-5); background: var(--c-vert-pale); border-left: 3px solid var(--c-vert); border-radius: .5rem; }

.page-404 { padding-block: var(--e-8); min-height: 60vh; display: grid; align-items: center; }
.page-404__actions { justify-content: flex-start; margin-top: var(--e-3); }

/* Page « Mais que veut dire blended ? » : texte à gauche, photo à droite */
.blended { display: grid; gap: var(--e-6); align-items: center; padding-block: var(--e-7) var(--e-8); }
@media (min-width: 48em) { .blended { grid-template-columns: 1.4fr 1fr; gap: var(--e-7); } }
.blended__texte { display: grid; gap: var(--e-4); }
.blended__texte p { font-size: var(--t-m); line-height: 1.7; color: var(--c-texte-2); }
.blended__texte strong { color: var(--c-texte); font-weight: 600; }
.blended__actions { margin-top: var(--e-3); }
.blended__photo img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border-radius: var(--r-pilule) var(--r-pilule) var(--r-carte) var(--r-carte);
  box-shadow: 0 2rem 3.5rem -2.25rem rgba(61, 99, 45, .55); }


/* ===== 90-animations.css ===== */
/* Animations : actives seulement avec JavaScript ET si l'utilisateur n'a pas demandé à réduire les mouvements. */
@media (prefers-reduced-motion: no-preference) {
  /* Hero */
  .js .hero__titre .mot { opacity: 0; transform: translateY(.6em) rotate(2deg); animation: monter .9s var(--ease) forwards; animation-delay: calc(.2s + var(--i) * .12s); }
  .js .apparition { opacity: 0; transform: translateY(16px); animation: monter .8s var(--ease) forwards; animation-delay: calc(var(--delai) * .12s + .1s); }
  .js .hero__photo img { animation: fondu-photo 1.4s var(--ease) both; }
  .js .pastille-flottante { opacity: 0; animation: pastille .8s var(--ease) forwards; animation-delay: calc(1.3s + var(--i) * .2s); }

  /* Apparition au défilement, en cascade selon --rang */
  .js .revele { opacity: 0; transform: translateY(28px); transition: opacity .8s var(--ease), transform .8s var(--ease); transition-delay: calc(var(--rang, 0) * 90ms); }
  .js .revele.est-visible { opacity: 1; transform: none; }

  /* Laurier : la tige se dessine, puis les feuilles éclosent */
  .js .laurier__tige { stroke-dasharray: 1; stroke-dashoffset: 1; }
  .js .laurier__feuille { opacity: 0; transform-box: fill-box; transform-origin: center; scale: .2; }
  .js .entreprises.est-visible .laurier__tige { transition: stroke-dashoffset 1.6s var(--ease); stroke-dashoffset: 0; }
  .js .entreprises.est-visible .laurier__feuille { opacity: 1; scale: 1; transition: opacity .5s var(--ease), scale .6s var(--ease); transition-delay: calc(.3s + var(--f) * 110ms); }

  /* Onglets : le panneau choisi apparaît, la frise se remplit, les étapes s'allument une à une */
  .js .onglets__panneau.est-actif { animation: monter .6s var(--ease) both; }
  .js .frise::after { transform: scaleY(0); }
  .js .frise__etape::before { background: var(--c-fond); border-color: var(--c-filet); color: var(--c-texte-2); transition: background-color .4s, border-color .4s, color .4s, transform .4s var(--ease); }
  .js .est-actif .frise::after { transform: scaleY(1); transition: transform 1.4s var(--ease) .2s; }
  .js .est-actif .frise__etape::before { background: var(--c-vert); border-color: var(--c-vert); color: var(--c-fond); transition-delay: calc(.25s + var(--rang) * .35s); }
  @media (min-width: 56em) {
    .js .frise::after { transform: scaleX(0); }
    .js .est-actif .frise::after { transform: scaleX(1); }
  }
}

@keyframes monter { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes zoom-photo { from { transform: scale(1.1); } }
@keyframes pastille { 0% { opacity: 0; transform: translateY(14px) scale(.9); } 70% { opacity: 1; transform: translateY(-3px) scale(1.02); } 100% { opacity: 1; transform: none; } }


/* ===== 95-perso.css ===== */
/* ==========================================================================
   VOS STYLES PERSONNELS — chargés sur toutes les pages, après tous les autres.
   Ce fichier vous appartient : aucune mise à jour ne le remplacera.
   Une règle écrite ici l'emporte sur celles des autres fichiers de src/styles/.

   Exemple : agrandir le texte des cartes de formation
   .titre__nom { font-size: 1.6rem; }
   /* Fond du bloc « Nos partenaires » (accueil) */
.partenaires { background: #3D632D; }
/* ===== Bloc « Nos partenaires » (accueil) sur fond vert Exedra ===== */
section.partenaires { background: #3D632D; }

/* Titre « Ils avancent avec nous » */
section.partenaires h2 { color: #FBF8F3; }          /* « Ils avancent » en crème */
section.partenaires h2 em { color: #E9C79B; }       /* « avec nous » en doré */

/* Petit texte sous le titre */
section.partenaires .partenaires__texte { color: #C9DDB8; }   /* vert clair */

/* Étiquette « Nos partenaires » et sa petite arche */
section.partenaires .partenaires__surtitre { color: #E9C79B; }
section.partenaires .partenaires__surtitre::before { background: #E9C79B; }

/* Bouton « Mettre en pause le défilement » */
section.partenaires .defilement__pause { background: transparent; color: #FBF8F3; border-color: rgba(251, 248, 243, .5); }


/* ===== 99-preferences.css ===== */
/* Préférences utilisateur et impression. */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .defilement__piste { flex-wrap: wrap; justify-content: center; width: auto; }
  .defilement__liste[aria-hidden="true"], .defilement__pause { display: none; }
  .defilement__liste { flex-wrap: wrap; justify-content: center; padding-inline: var(--gouttiere); row-gap: var(--e-2); }
  .defilement__liste li[aria-hidden="true"] { display: none; }
}
@media (forced-colors: active) {
  .btn, .marque, .domaine a, .porte, .faq__item, .recherche, .sommaire-page a, .situation__faits div, .onglets__onglet { border: 1px solid CanvasText; }
  .entreprises__decor { display: none; }
}
@media print {
  .bandeau-haut, .entete, .progression, .defilement, .video, .entreprises__decor, .recherche, .sommaire-page, .onglets__liste { display: none; }
  .revele, .apparition, .mot { opacity: 1 !important; transform: none !important; }
  .onglets__panneau[hidden] { display: grid !important; }
  .hero { color: #000; min-height: 0; } .hero::before, .hero__photo { display: none; }
  body { background: #fff; }
}