/* =============================================================
 * PC87 Formations 1.2.0 — design A « Trait oblique »
 *
 * Charte FNPC 2017 v2.2 : bleu #004080, orange #F08700 (décor seulement,
 * jamais de texte blanc dessus : texte nuit #001838), violet #AB0093 rare ;
 * titres Poppins, texte Arial. Seul ornement : le trait oblique orange.
 * Surfaces opaques, cartes à bord fin sans ombre, photos NETTES avec le
 * titre en blanc sur un aplat bleu qui épouse chaque ligne.
 *
 * Portées : .pc-cat (catalogue [pc87_formations], jetons communs),
 * .pc-av (bloc [pc87_formations_a_venir]), .pc-vit (vitrine
 * [pc87_formations_vitrine]). Jetons repris du design system du site
 * (--pc87-*) avec valeur de repli : l'extension reste autonome.
 * Mobile d'abord (375 px), puis 600, 768, 1024. Cibles de 48 px, focus
 * 3 px orange foncé, mouvement coupé sous prefers-reduced-motion.
 * Neutralise le reset de Hello Elementor (boutons roses, nowrap).
 * Contrôlé par tests/audit-classes.php (contraste AA, tailles, cibles).
 * 1.3.1 : carte compacte sous 768 px (ni photo ni résumé, même HTML) et
 * « Voir les N autres formations » sous la grille (catalogue.js) ; carte
 * repliée en hidden="until-found" (trouvée par Ctrl+F), réduite à rien.
 * ============================================================= */

/* ============ Jetons ============ */
.pc-cat {
  --brand:        var(--pc87-bleu, #004080);
  --brand-dark:   var(--pc87-bleu-f, #002b5c);
  --brand-darker: var(--pc87-nuit, #001838);
  --accent:       var(--pc87-orange, #F08700);
  --accent-hover: var(--pc87-orange-survol, #ff9a1f);
  --accent-dark:  var(--pc87-orange-f, #c26a00);
  --violet:       var(--pc87-violet, #AB0093);
  --text:         var(--pc87-texte, #1f2937);
  --text-soft:    var(--pc87-doux, #5c6479);
  --bg:           #ffffff;
  --bg-soft:      var(--pc87-fond, #f5f7fb);
  --bg-tint:      var(--pc87-teinte, #eef3fb);
  --border:       var(--pc87-bord, #d4dbe6);
  --border-soft:  var(--pc87-bord-l, #e3e8f0);
  --error:        var(--pc87-erreur, #c0392b);
  --error-bg:     var(--pc87-erreur-fond, #fdecec);
  --focus:        var(--pc87-focus, #c26a00);
  --voile:        var(--pc87-voile, rgba(0,24,56,.55));
  --radius-sm:    6px;
  --radius:       10px;
  --radius-lg:    14px;
  --shadow-lg:    var(--pc87-ombre-flottant, 0 8px 30px rgba(0,64,128,.14));
  --ease:         var(--pc87-ease, cubic-bezier(.4,0,.2,1));
  --duree:        var(--pc87-duree, .2s);
  --tap:          48px;
  --tap-row:      56px;
  --trait-angle:  var(--pc87-trait-angle, -20deg);
  --gouttiere:    var(--pc87-gouttiere, 15px);
  --font-title:   var(--pc87-police-titre, Poppins, "Helvetica Neue", Arial, sans-serif);
  --font-text:    var(--pc87-police-texte, Arial, "Helvetica Neue", Helvetica, sans-serif);

  box-sizing: border-box;
  max-width: var(--pc87-cadre, 1320px);
  margin: 0 auto;
  padding: 0 var(--gouttiere) 56px;
  color: var(--text);
  font-family: var(--font-text);
  font-size: 16px;
  line-height: 1.55;
}
/* Dans un widget Elementor, le conteneur porte déjà le gabarit (1290 px, gouttière 15 px). */
.elementor-widget-shortcode .pc-cat,
.elementor-shortcode > .pc-cat { max-width: none; padding-left: 0; padding-right: 0; padding-bottom: 0; }

.pc-cat *, .pc-cat *::before, .pc-cat *::after { box-sizing: border-box; }
.pc-cat [hidden]:not([hidden="until-found"]) { display: none !important; }
.pc-cat p, .pc-cat ul, .pc-cat h2, .pc-cat h3 { margin: 0; padding: 0; }
/* Thèmes qui espacent les lettres de tous les titres (pchv_theme : 1px). */
.pc-cat h2, .pc-cat h3, .pc-cat h4 { letter-spacing: normal; }
.pc-cat ul { list-style: none; }
.pc-cat img { display: block; max-width: none; border: 0; }
.pc-cat svg { display: block; flex: none; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
/* Correctif Hello : reset.css met white-space:nowrap et un rose #c36 sur tous les boutons. */
.pc-cat button, .pc-cat [type=button] {
  white-space: normal;
  text-transform: none;
  letter-spacing: normal;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  /* Hello anime « all » (.3 s) : le contour de focus glisserait ; seules les couleurs changent. */
  transition: color var(--duree) var(--ease), background-color var(--duree) var(--ease), border-color var(--duree) var(--ease);
}
.pc-cat :focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; box-shadow: none; }
.pc-cat .pc-cat-sr {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ============ 1.10.0 : maquettes « Former » et « Fiche » (choix de Léo, 30/10/2026) ============ */
/* Boutons pilules (bleu plein ou clair), liens soulignés d'orange, intertitres au trait oblique orange (−20°). Base +
   :hover + :focus déclarés ensemble : les boutons roses de Hello ne passent jamais. */
.pc-cat .pc-for-btn,
.pc-cat .pc-for-btn:hover,
.pc-cat .pc-for-btn:focus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 12px 22px;
  border: 1.5px solid var(--brand);
  border-radius: 999px;
  background: var(--brand);
  color: #ffffff;
  font: 600 15px/1.2 var(--font-title);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.pc-cat .pc-for-btn svg { width: 16px; height: 16px; }
.pc-cat .pc-for-btn--clair,
.pc-cat .pc-for-btn--clair:hover,
.pc-cat .pc-for-btn--clair:focus { background: var(--bg); color: var(--brand); }
.pc-cat .pc-for-lien,
.pc-cat .pc-for-lien:hover,
.pc-cat .pc-for-lien:focus {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 48px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--brand);
  font: 600 15px/1.3 var(--font-title);
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
  cursor: pointer;
}
.pc-cat .pc-for-titre,
.pc-cat .pc-for-carte-titre,
.pc-cat.pc-fiche .pc-fiche-section > h2 { position: relative; padding-left: .95em; }
.pc-cat .pc-for-titre::before,
.pc-cat .pc-for-carte-titre::before,
.pc-cat.pc-fiche .pc-fiche-section > h2::before {
  content: "";
  position: absolute;
  left: .5em;
  top: -.5em;
  width: 2px;
  height: 1.5em;
  background: var(--accent);
  transform: rotate(var(--trait-angle));
  transform-origin: 50% 100%;
}
.pc-cat .pc-for-titre { color: var(--brand); font: 700 28px/1.2 var(--font-title); letter-spacing: -.01em; text-transform: none; }

/* ============ Page Former : la recherche au centre ============ */
/* Bande gris clair étirée jusqu'aux bords de la fenêtre (ombre portée de même couleur, rognée en hauteur). */
.pc-cat .pc-for-heros { padding: 32px 0 48px; background: var(--bg-soft); box-shadow: 0 0 0 100vmax var(--bg-soft); clip-path: inset(0 -100vmax); }
.pc-cat .pc-for-heros-int { display: flex; flex-direction: column; align-items: center; gap: 20px; max-width: 760px; margin: 0 auto; text-align: center; }
.pc-cat .pc-for-intro { max-width: 62ch; color: var(--text); font-size: 17px; line-height: 1.55; }
.pc-cat .pc-for-form { display: flex; flex-direction: column; gap: 14px; width: 100%; margin-top: 12px; text-align: left; }
.pc-cat .pc-for-champ { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 0 8px 0 24px; border: 1.5px solid var(--text-soft); border-radius: 999px; background: var(--bg); transition: border-color var(--duree) var(--ease), box-shadow var(--duree) var(--ease); }
.pc-cat .pc-for-champ:focus-within { border-color: var(--brand); box-shadow: 0 8px 30px rgba(0, 64, 128, .14); }
.pc-cat .pc-for-champ > svg { width: 22px; height: 22px; color: var(--brand); }
.pc-cat .pc-for-champ input,
.pc-cat .pc-for-champ input:focus { flex: 1; min-width: 0; min-height: 60px; margin: 0; padding: 0; border: 0; outline: 0; background: transparent; box-shadow: none; color: var(--text); font: 400 18px/1.3 var(--font-text); }
.pc-cat .pc-for-champ input::placeholder { color: var(--text-soft); opacity: 1; }
.pc-cat .pc-for-effacer,
.pc-cat .pc-for-effacer:hover,
.pc-cat .pc-for-effacer:focus { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 999px; background: transparent; color: var(--brand); cursor: pointer; }
.pc-cat .pc-for-effacer svg { width: 20px; height: 20px; }
.pc-cat .pc-for-exemple { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 10px; min-height: 48px; }
.pc-cat .pc-for-exemple-label { color: var(--text-soft); font-size: 15px; }
.pc-cat .pc-for-phrase,
.pc-cat .pc-for-phrase:hover,
.pc-cat .pc-for-phrase:focus {
  min-height: 48px;
  padding: 0 4px;
  border: 0;
  background: none;
  color: var(--brand);
  font: 600 16px/1.3 var(--font-title);
  text-align: left;
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
  cursor: pointer;
  animation: pc-for-phrase-a .45s var(--ease) both;
}
.pc-cat .pc-for-phrase--b,
.pc-cat .pc-for-phrase--b:hover,
.pc-cat .pc-for-phrase--b:focus { animation-name: pc-for-phrase-b; }
@keyframes pc-for-phrase-a { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes pc-for-phrase-b { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.pc-cat .pc-for-pause,
.pc-cat .pc-for-pause:hover,
.pc-cat .pc-for-pause:focus { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0; border: 1px solid var(--border); border-radius: 999px; background: var(--bg); color: var(--brand); cursor: pointer; }
.pc-cat .pc-for-pause svg { width: 14px; height: 14px; fill: currentColor; stroke: none; }
/* Mots-clés fréquents : deux listes identiques qui défilent (la seconde, cachée aux lecteurs d'écran, fait la boucle). */
.pc-cat .pc-for-defile { width: 100%; padding: 4px 0; overflow: hidden; }
.pc-cat .pc-for-piste { display: flex; width: max-content; animation: pc-for-defile 60s linear infinite; }
.pc-cat .pc-for-defile:hover .pc-for-piste,
.pc-cat .pc-for-defile:focus-within .pc-for-piste,
.pc-cat .pc-for-defile--arret .pc-for-piste { animation-play-state: paused; }
@keyframes pc-for-defile { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.pc-cat .pc-for-mots { display: flex; gap: 8px; padding: 0 8px 0 0; }
.pc-cat .pc-for-puce,
.pc-cat .pc-for-puce:hover,
.pc-cat .pc-for-puce:focus { min-height: 48px; padding: 0 16px; border: 1px solid var(--border); border-radius: 999px; background: var(--bg); color: var(--brand); font: 400 15px/1 var(--font-text); white-space: nowrap; cursor: pointer; }

/* Résultats : cartes, seulement pendant une recherche. */
.pc-cat .pc-for-resultats { display: flex; flex-direction: column; gap: 24px; padding: 48px 0 56px; }
.pc-cat .pc-for-res-tete { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px; }
.pc-cat .pc-for-aucun { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 24px; border: 1px solid var(--border); border-radius: var(--radius-lg); }
.pc-cat .pc-for-cartes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.pc-cat .pc-for-carte { display: flex; flex-direction: column; gap: 14px; min-height: 200px; padding: 20px; border: 1px solid var(--border-soft); border-radius: var(--radius-lg); background: var(--bg); animation: pc-for-entree .4s var(--ease) both; }
@keyframes pc-for-entree { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.pc-cat .pc-for-cat { color: var(--brand); font: 600 13px/1.4 var(--font-title); letter-spacing: .08em; text-transform: uppercase; }
.pc-cat .pc-for-carte-titre { color: var(--brand); font: 600 17px/1.35 var(--font-title); letter-spacing: -.01em; text-transform: none; }
.pc-cat .pc-for-carte-titre mark { background: transparent; color: inherit; text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.pc-cat .pc-for-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pc-cat .pc-for-code { display: inline-block; padding: 2px 8px; border: 1px dashed var(--accent); border-radius: var(--radius-sm); color: var(--brand); font: 700 13px/1.5 var(--font-title); letter-spacing: .5px; }
.pc-cat .pc-for-duree { font-size: 14px; }
.pc-cat .pc-for-certif { display: inline-block; padding: 1px 9px; border: 1px solid var(--violet); border-radius: 999px; color: var(--violet); font: 600 13px/1.5 var(--font-title); }
.pc-cat .pc-for-carte-pied { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 4px; border-top: 1px solid var(--border-soft); }
.pc-cat .pc-for-prochaine { color: var(--text-soft); font-size: 14px; }

/* Prochaines sessions : lignes à filets, date, titre (vers la page de la formation), places, « S'inscrire ». */
.pc-cat .pc-for-sessions { display: flex; flex-direction: column; gap: 20px; padding: 48px 0 56px; }
.pc-cat .pc-for-sessions-liste { border-top: 1px solid var(--border); }
.pc-cat .pc-for-session { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto auto; align-items: center; gap: 24px; padding: 16px 0; border-bottom: 1px solid var(--border); }
.pc-cat .pc-for-s-date { color: var(--brand); font: 700 17px/1.3 var(--font-title); }
.pc-cat .pc-for-s-texte { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pc-cat .pc-for-s-titre { color: var(--brand); font: 600 17px/1.35 var(--font-title); text-decoration: none; }
.pc-cat .pc-for-s-texte p,
.pc-cat .pc-for-s-places { color: var(--text-soft); font-size: 15px; }
.pc-cat .pc-for-note { color: var(--text-soft); font-size: 14px; }
@media (max-width: 1023px) {
  .pc-cat .pc-for-cartes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .pc-cat .pc-for-heros { padding: 32px 0 40px; }
  .pc-cat .pc-for-champ { min-height: 56px; padding-left: 18px; }
  .pc-cat .pc-for-champ input,
  .pc-cat .pc-for-champ input:focus { min-height: 52px; font-size: 16px; }
  .pc-cat .pc-for-cartes { grid-template-columns: minmax(0, 1fr); }
  .pc-cat .pc-for-session { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 16px; }
  .pc-cat .pc-for-s-date { grid-column: 1 / -1; }
}

/* ============ Page d'une formation (maquette « Fiche ») ============ */
.pc-cat.pc-fiche { color: var(--text); font: 400 16px/1.55 var(--font-text); }
.pc-cat.pc-fiche .pc-fiche-fil { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-height: 32px; color: var(--text-soft); font-size: 14px; }
.pc-cat.pc-fiche .pc-fiche-fil a { color: var(--brand); text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.pc-cat.pc-fiche .pc-fiche-mentions { margin-top: 12px; color: var(--text-soft); font-size: 14px; }

/* Carte d'identité : seul aplat bleu de la page. */
.pc-cat.pc-fiche .pc-fiche-carte { display: flex; flex-wrap: wrap; align-items: center; gap: 24px 40px; margin-top: 24px; padding: 28px; border-radius: var(--radius-lg); background: var(--brand); color: #ffffff; }
.pc-cat.pc-fiche .pc-fiche-carte-id { display: flex; flex-direction: column; gap: 6px; min-width: 160px; }
.pc-cat.pc-fiche .pc-fiche-categorie { background: var(--brand); color: #ffffff; font: 600 13px/1.4 var(--font-title); letter-spacing: .08em; text-transform: uppercase; }
.pc-cat.pc-fiche .pc-fiche-sigle { background: var(--brand); color: #ffffff; font: 700 64px/1 var(--font-title); overflow-wrap: anywhere; }
.pc-cat.pc-fiche .pc-fiche-faits { display: grid; flex: 1 1 640px; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 0; min-width: 0; margin: 0; }
.pc-cat.pc-fiche .pc-fiche-faits > div { padding: 4px 20px; border-left: 1px solid #4d79a6; }
.pc-cat.pc-fiche .pc-fiche-faits dt { background: var(--brand); color: #e5edf6; font: 400 13px/1.35 var(--font-text); }
.pc-cat.pc-fiche .pc-fiche-faits dd { margin: 4px 0 0; background: var(--brand); color: #ffffff; font: 600 17px/1.3 var(--font-title); }
.pc-cat.pc-fiche .pc-fiche-avis { background: var(--brand); color: #ffffff; font: 400 14px/1 var(--font-text); }

/* Lecture à gauche, « S'inscrire » à droite (collant) ; sous 1 024 px, « S'inscrire » d'abord. */
.pc-cat.pc-fiche .pc-fiche-corps { display: grid; grid-template-columns: minmax(0, 1fr) 380px; align-items: start; gap: 56px; margin-top: 40px; padding-bottom: 64px; }
.pc-cat.pc-fiche .pc-fiche-lecture { min-width: 0; max-width: 72ch; }
.pc-cat.pc-fiche .pc-fiche-description { font-size: 18px; line-height: 1.6; white-space: pre-line; }
.pc-cat.pc-fiche .pc-fiche-section { display: flex; flex-direction: column; gap: 16px; padding-top: 40px; }
.pc-cat.pc-fiche .pc-fiche-section > h2 { color: var(--brand); font: 700 24px/1.2 var(--font-title); letter-spacing: -.01em; text-transform: none; }
.pc-cat.pc-fiche .pc-fiche-essentiel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-lg); }
/* Chaque case garde son filet du bas ; celui de la dernière rangée glisse sous le bord du cadre (marge −1 px). */
.pc-cat.pc-fiche .pc-fiche-essentiel > div { margin-bottom: -1px; padding: 18px 20px; border-bottom: 1px solid var(--border-soft); }
.pc-cat.pc-fiche .pc-fiche-essentiel > div:nth-child(odd) { border-right: 1px solid var(--border-soft); }
.pc-cat.pc-fiche .pc-fiche-essentiel dt { color: var(--brand); font: 600 15px/1.2 var(--font-title); }
.pc-cat.pc-fiche .pc-fiche-essentiel dd { margin: 4px 0 0; white-space: pre-line; }
.pc-cat.pc-fiche .pc-fiche-liste { display: flex; flex-direction: column; gap: 8px; }
.pc-cat.pc-fiche .pc-fiche-liste > li { position: relative; padding-left: 22px; white-space: pre-line; }
/* Puce triangle orange (charte). */
.pc-cat.pc-fiche .pc-fiche-liste > li::before { content: ""; position: absolute; left: 2px; top: .5em; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 8px solid var(--accent); }
.pc-cat.pc-fiche .pc-fiche-sous-titre,
.pc-cat.pc-fiche .pc-fiche-module h3 { color: var(--brand); font: 600 16px/1.25 var(--font-title); text-transform: none; }
.pc-cat.pc-fiche .pc-fiche-texte { white-space: pre-line; }
.pc-cat.pc-fiche .pc-fiche-modules { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.pc-cat.pc-fiche .pc-fiche-module { display: flex; flex-direction: column; gap: 10px; padding: 16px 18px; border: 1px solid var(--border-soft); border-radius: var(--radius); }
.pc-cat.pc-fiche .pc-fiche-module .pc-fiche-liste { gap: 6px; font-size: 15px; }
.pc-cat.pc-fiche .pc-fiche-note-satisfaction { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px 32px; }
.pc-cat.pc-fiche .pc-fiche-note-chiffre { color: var(--brand); font: 700 32px/1 var(--font-title); }

.pc-cat.pc-fiche .pc-fiche-inscription { position: sticky; top: calc(var(--pc87-entete-collant, 0px) + 24px); display: flex; flex-direction: column; gap: 18px; padding: 24px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--bg); }
/* Encadré plus haut que la place sous l'en-tête collant du thème (fiche.js) : il défile avec la page. */
.pc-cat.pc-fiche--libre .pc-fiche-inscription { position: static; }
.pc-cat.pc-fiche .pc-fiche-inscription > h2 { color: var(--brand); font: 700 20px/1.2 var(--font-title); text-transform: none; }
.pc-cat.pc-fiche .pc-fiche-choix { display: flex; flex-direction: column; gap: 8px; }
.pc-cat.pc-fiche .pc-fiche-vous { color: var(--brand); font: 600 15px/1.2 var(--font-title); }
.pc-cat.pc-fiche .pc-fiche-seg { display: flex; gap: 3px; padding: 3px; border: 1.5px solid var(--brand); border-radius: 999px; }
.pc-cat.pc-fiche .pc-fiche-seg button,
.pc-cat.pc-fiche .pc-fiche-seg button:hover,
.pc-cat.pc-fiche .pc-fiche-seg button:focus { flex: 1; min-height: 48px; padding: 0 14px; border: 0; border-radius: 999px; background: transparent; color: var(--brand); font: 600 15px/1 var(--font-title); cursor: pointer; }
.pc-cat.pc-fiche .pc-fiche-seg button[aria-pressed="true"] { background: var(--brand); color: #ffffff; }
.pc-cat.pc-fiche .pc-fiche-panneau { display: flex; flex-direction: column; gap: 14px; }
.pc-cat.pc-fiche .pc-fiche-panneau + .pc-fiche-panneau { padding-top: 18px; border-top: 1px solid var(--border-soft); }
.pc-cat.pc-fiche .pc-fiche-panneau-titre { color: var(--brand); font: 600 17px/1.2 var(--font-title); }
/* Avec le choix « Vous êtes », le titre du profil est porté par le bouton : gardé pour les lecteurs d'écran seulement. */
.pc-cat.pc-fiche--js .pc-fiche-panneau-titre { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pc-cat.pc-fiche--js .pc-fiche-panneau + .pc-fiche-panneau { padding-top: 0; border-top: 0; }
.pc-cat.pc-fiche .pc-fiche-tarif { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 14px 0; border-top: 1px solid var(--border-soft); border-bottom: 1px solid var(--border-soft); font-size: 15px; }
.pc-cat.pc-fiche .pc-fiche-prix { color: var(--brand); font: 700 20px/1.2 var(--font-title); text-align: right; }
.pc-cat.pc-fiche .pc-fiche-dates-titre { color: var(--brand); font: 600 16px/1.2 var(--font-title); }
.pc-cat.pc-fiche .pc-fiche-dates { display: flex; flex-direction: column; gap: 10px; }
.pc-cat.pc-fiche .pc-fiche-dates li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid var(--border-soft); border-radius: var(--radius); }
.pc-cat.pc-fiche .pc-fiche-date { color: var(--brand); font: 600 16px/1.3 var(--font-title); }
.pc-cat.pc-fiche .pc-fiche-date-meta,
.pc-cat.pc-fiche .pc-fiche-sans-date { color: var(--text-soft); font-size: 14px; }
.pc-cat.pc-fiche .pc-fiche-dates .pc-for-btn { padding: 10px 16px; }
.pc-cat.pc-fiche .pc-fiche-note { display: flex; align-items: flex-start; gap: 8px; color: var(--text-soft); font-size: 13px; }
.pc-cat.pc-fiche .pc-fiche-note svg { width: 16px; height: 16px; margin-top: 2px; }
.pc-cat.pc-fiche .pc-fiche-devis { display: flex; flex-direction: column; gap: 6px; padding-top: 16px; border-top: 1px solid var(--border-soft); font-size: 15px; }
.pc-cat.pc-fiche .pc-fiche-devis-titre { color: var(--brand); font: 600 15px/1.35 var(--font-title); }
.pc-cat.pc-fiche .pc-fiche-retour { display: flex; justify-content: flex-end; padding: 32px 0 48px; border-top: 1px solid var(--border-soft); }
.pc-cat.pc-fiche .pc-fiche-introuvable { font-size: 20px; }
@media (max-width: 1023px) {
  .pc-cat.pc-fiche .pc-fiche-corps { grid-template-columns: minmax(0, 1fr); }
  .pc-cat.pc-fiche .pc-fiche-inscription { position: static; order: -1; }
  .pc-cat.pc-fiche .pc-fiche-faits { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 16px; }
}
@media (max-width: 767px) {
  .pc-cat.pc-fiche .pc-fiche-sigle { font-size: 48px; }
  .pc-cat.pc-fiche .pc-fiche-faits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-cat.pc-fiche .pc-fiche-faits > div { padding: 4px 12px; }
  .pc-cat.pc-fiche .pc-fiche-essentiel,
  .pc-cat.pc-fiche .pc-fiche-modules { grid-template-columns: minmax(0, 1fr); }
  .pc-cat.pc-fiche .pc-fiche-essentiel > div:nth-child(odd) { border-right: 0; }
}

/* ============ Survol (souris seulement) ============ */
@media (hover: hover) {
  .pc-cat .pc-for-btn:hover { border-color: var(--brand-dark); background: var(--brand-dark); color: #ffffff; }
  .pc-cat .pc-for-btn--clair:hover { border-color: var(--brand); background: var(--bg-tint); color: var(--brand-dark); }
  .pc-cat .pc-for-puce:hover { border-color: var(--brand); background: var(--bg-tint); }
  .pc-cat .pc-for-s-titre:hover { text-decoration: underline; text-decoration-color: var(--accent); }
  .pc-cat .pc-for-lien:hover { text-decoration-color: var(--brand); }
}

/* =============================================================
 * Bloc [pc87_formations_a_venir] — portée .pc-av (porte aussi .pc-cat
 * pour les jetons). Volets de 56 px séparés par un filet, chevron dessiné
 * en CSS ; sessions dans un encadré à filet orange, EMPILÉES sous 600 px.
 * Pas de titre de bloc : la section hôte porte le sien ; groupes en h3.
 * ============================================================= */
.pc-cat.pc-av { max-width: none; padding: 0; }
/* Grille d'une colonne (une section hôte peut en demander deux : grid-template-columns). */
.pc-av .pc-av-list { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 24px; align-items: start; border-top: 1px solid var(--border-soft); }
.pc-av .pc-av-group { border-bottom: 1px solid var(--border-soft); }
.pc-av .pc-av-heading { margin: 0; padding: 0; font-size: 16px; font-weight: 600; line-height: 1.35; }
.pc-av .pc-av-toggle,
.pc-av .pc-av-toggle:hover,
.pc-av .pc-av-toggle:focus {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 56px;
  margin: 0;
  padding: 10px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--brand);
  font: 600 16px/1.35 var(--font-title);
  text-align: left;
  cursor: pointer;
}
.pc-av .pc-av-toggle:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; }
.pc-av .pc-av-toggle-text { display: block; flex: 1; min-width: 0; }
.pc-av .pc-av-nom { display: block; color: var(--brand); font: 600 16px/1.35 var(--font-title); overflow-wrap: anywhere; }
.pc-av .pc-av-next { display: block; margin-top: 2px; color: var(--text-soft); font: 400 15px/1.4 var(--font-text); }
.pc-av .pc-av-chevron {
  flex: none;
  width: 10px;
  height: 10px;
  margin: -4px 6px 0 2px;
  border-right: 2px solid var(--brand);
  border-bottom: 2px solid var(--brand);
  transform: rotate(45deg);
  transition: transform var(--duree) var(--ease);
}
.pc-av .pc-av-toggle[aria-expanded="true"] .pc-av-chevron { margin-top: 6px; transform: rotate(-135deg); }
.pc-av .pc-av-panel { padding: 0 0 16px; }
.pc-av .pc-av-sessions { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pc-av .pc-av-session {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: 14px 16px;
  border-left: 2px solid var(--accent);
  border-radius: 0 var(--radius) var(--radius) 0;
  background: var(--bg-soft);
  list-style: none;
}
.pc-av .pc-av-session::before,
.pc-av .pc-av-session::marker { content: none; }
.pc-av .pc-av-session-text { display: block; flex: 1; min-width: 0; }
.pc-av .pc-av-session-date { display: block; color: var(--brand); font: 600 16px/1.35 var(--font-title); }
.pc-av .pc-av-session-meta { display: block; margin-top: 2px; color: var(--text-soft); font: 400 15px/1.45 var(--font-text); }
.pc-av .pc-av-btn,
.pc-av .pc-av-btn:hover,
.pc-av .pc-av-btn:focus {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 22px;
  border: 1.5px solid var(--brand);
  border-radius: 999px;
  background: var(--brand);
  box-shadow: none;
  color: #ffffff;
  font: 600 15px/1.2 var(--font-title);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--duree) var(--ease), border-color var(--duree) var(--ease);
}
.pc-av .pc-av-btn:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.pc-av .pc-av-empty { margin: 0; color: var(--text-soft); font-size: 16px; }
.pc-av .pc-av-footer { margin: 24px 0 0; padding: 0; }
/* Session : bouton à droite à toutes les largeurs (liste compacte, comme la fiche) ; le bouton
   « Toutes nos formations » prend toute la largeur sous 600 px. */
.pc-av .pc-av-session .pc-av-btn { flex: none; width: auto; }
.pc-av .pc-av-btn-all { width: 100%; }
@media (min-width: 600px) {
  .pc-av .pc-av-session { gap: 16px; }
  .pc-av .pc-av-btn-all { width: auto; }
}
@media (hover: hover) {
  .pc-av .pc-av-toggle:hover .pc-av-nom { color: var(--brand-dark); }
  .pc-av .pc-av-btn:hover { border-color: var(--brand-dark); background: var(--brand-dark); color: #ffffff; }
}

/* =============================================================
 * Vitrine [pc87_formations_vitrine] — portée .pc-vit (porte aussi .pc-cat
 * pour les jetons). 1.5.0 : mêmes cartes que le catalogue (piste A) :
 * blanches, sans photo ni bandeau, catégorie en petites capitales bleues,
 * trait oblique orange devant le titre bleu ; la carte entière mène à la
 * fiche du catalogue (page Former, ancre #formation-<id>).
 * Sous 600 px : rail au pouce (défaut) ou pile (mobile="pile") ; grille
 * 2 colonnes dès 600, 3 dès 1024.
 * ============================================================= */
.pc-cat.pc-vit { max-width: none; padding: 0; }
.pc-vit .pc-vit-liste { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; margin: 0; padding: 0; list-style: none; }
.pc-vit .pc-vit-item { display: flex; min-width: 0; margin: 0; padding: 0; list-style: none; }
.pc-vit .pc-vit-item::before,
.pc-vit .pc-vit-item::marker { content: none; }
.pc-vit .pc-vit-carte,
.pc-vit .pc-vit-carte:hover,
.pc-vit .pc-vit-carte:focus {
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-lg);
  background: var(--bg);
  color: var(--text);
  text-decoration: none;
  transition: border-color var(--duree) var(--ease);
}
.pc-vit .pc-vit-carte:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
.pc-vit .pc-vit-tete { display: flex; flex-direction: column; gap: 8px; padding: 20px 18px 0; }
.pc-vit .pc-vit-cat { margin: 0; color: var(--brand); font: 500 13px/1.4 var(--font-title); letter-spacing: .08em; text-transform: uppercase; }
.pc-vit .pc-vit-titre { position: relative; margin: 0; padding: 0 0 0 20px; color: var(--brand); font: 600 18px/1.35 var(--font-title); letter-spacing: -.005em; }
.pc-vit .pc-vit-titre::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 4px;
  width: 2px;
  height: 19px;
  background: var(--accent);
  transform: rotate(var(--trait-angle));
}
.pc-vit .pc-vit-certif {
  padding: 1px 9px;
  border: 1px solid var(--violet);
  border-radius: 999px;
  color: var(--violet);
  font: 600 13px/1.5 var(--font-title);
}
.pc-vit .pc-vit-pied { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: auto; padding: 12px 18px 16px; }
.pc-vit .pc-vit-code {
  padding: 2px 8px;
  border: 1px solid var(--border); /* 1.5.0 : plus de pointillé orange (non voulu) */
  border-radius: var(--radius-sm);
  color: var(--brand);
  font: 700 13px/1.5 var(--font-title);
  letter-spacing: .5px;
}
.pc-vit .pc-vit-info { color: var(--text-soft); font-size: 14px; line-height: 1.5; }
.pc-vit .pc-vit-detail {
  margin-left: auto;
  color: var(--brand);
  font: 600 15px/1.3 var(--font-title);
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}
@media (max-width: 599px) {
  /* Rail au pouce : la carte suivante dépasse, défilement horizontal aimanté. */
  .pc-vit.pc-vit--rail .pc-vit-liste {
    display: flex;
    gap: 12px;
    padding-bottom: 4px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .pc-vit.pc-vit--rail .pc-vit-liste::-webkit-scrollbar { display: none; }
  .pc-vit.pc-vit--rail .pc-vit-item { flex: 0 0 min(82%, 300px); scroll-snap-align: start; }
  .pc-vit.pc-vit--rail .pc-vit-detail { display: none; }
}
@media (min-width: 600px) { .pc-vit .pc-vit-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .pc-vit .pc-vit-liste { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } }
@media (hover: hover) {
  .pc-vit .pc-vit-carte:hover { border-color: var(--brand); }
  .pc-vit .pc-vit-carte:hover .pc-vit-detail { text-decoration-color: var(--brand); }
}

/* ============ Mouvement réduit ============ */
@media (prefers-reduced-motion: reduce) {
  .pc-cat *,
  .pc-cat *::before,
  .pc-cat *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
  /* Mots-clés : plus de défilement ; une seule liste, sur plusieurs lignes. */
  .pc-cat .pc-for-piste { width: auto; }
  .pc-cat .pc-for-mots { flex-wrap: wrap; justify-content: center; }
  .pc-cat .pc-for-mots[aria-hidden] { display: none; }
}
