/* Pages métier produites par scripts/build_formation_metier.py, sur le modèle de la page architectes de Laura.
   formation-metier.css (celle de Laura) fait l’essentiel ; ce fichier n’ajoute que ce dont ces pages ont besoin en plus :
   initiales quand un formateur n’a pas de photo, photo du métier à la place des vidéos du programme,
   cartes des sections propres à certains métiers, financement à plus de deux voies, sessions complètes ou à venir,
   et la section « Votre espace en ligne » (espace-en-ligne.css) aux couleurs de la page. */

/* Formateurs : mêmes règles que #formatrice sur la page architectes */
.page-accueil-v5 #formateurs .fz-texte { gap: 18px; }
.page-accueil-v5 #formateurs .fz-duo-txt { max-width: 520px; gap: 12px; }
.page-accueil-v5 #formateurs .fz-duo-txt p { font-size: 16px; line-height: 1.6; }
.page-accueil-v5 #formateurs .fz-carte b { font-size: 18px; }
.fz-trio .fz-cartes { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
/* Trois cartes de même largeur : un titre long (« Avocate au barreau de Lyon ») passe à la ligne
   au lieu d’élargir sa carte, sinon les photos n’ont pas la même taille et débordent. */
.fz-trio .fz-carte { min-width: 0; align-content: start; }
.fz-trio .fz-carte span { white-space: normal; text-align: center; line-height: 1.35; border-radius: 14px; }
.fz.fz-duo.fz-trio { grid-template-columns: minmax(0, 600px) minmax(0, 1fr) !important; }
.fz-solo .fz-cartes { grid-template-columns: minmax(0, 300px); }
.fz.fz-duo.fz-solo { grid-template-columns: minmax(0, 320px) minmax(0, 1fr) !important; }
.fz-init, .fm-init { display: grid; place-items: center; background: var(--ac-sable-2); color: var(--ac-encre); font-weight: 400; letter-spacing: -0.02em; }
.fz-init { width: 100%; aspect-ratio: 4 / 5; border-radius: 16px; font-size: clamp(40px, 4vw, 60px); }
.fm-init { flex: none; width: 52px; height: 52px; border-radius: 50%; font-size: 17px; }
.fc-duo-av .fm-init { width: 34px; height: 34px; border: 2px solid #fff; font-size: 12px; }
.fc-duo-av .fm-init + .fm-init, .fc-duo-av img + .fm-init, .fc-duo-av .fm-init + img { margin-left: -10px; }

/* Haut de page sans formateur nommé : les points forts en pastilles */
.page-accueil-v5 .fc-faits { list-style: none; margin: 2px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.fc-faits li { display: inline-flex; align-items: center; gap: 10px; padding: 11px 18px 11px 14px; border-radius: 99px; background: #fff; box-shadow: 0 1px 0 rgba(35, 11, 32, .04), 0 10px 24px rgba(35, 11, 32, .06); font-size: 15px; color: var(--ac-encre); }
.fc-faits .ico { width: 16px; height: 16px; color: var(--ac-magenta); flex: none; }

/* Programme : une phrase d’introduction, puis la photo du métier à droite (à la place des vidéos) */
.page-accueil-v5 .fm-prog-intro { max-width: 760px; margin: 18px 0 40px; font-size: 17px; line-height: 1.6; color: var(--ac-texte); }
.page-accueil-v5 .mp-tete + .fm-prog-intro { margin-top: -24px; margin-bottom: 44px; }
.fm-prog-intro + .fm-cartes { margin-top: 0; }
.mp-photo { position: relative; }
.mp-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 16px; background: var(--ac-sable); }
.mp-photo figcaption { position: absolute; left: 16px; right: 16px; bottom: 16px; display: grid; gap: 4px; padding: 16px 18px; border-radius: 14px; background: rgba(255, 255, 255, .92); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.mp-photo figcaption .ac-mono { font-size: 12px; color: var(--ac-magenta); }
.mp-photo figcaption b { font-weight: 400; font-size: 19px; line-height: 1.25; letter-spacing: -0.015em; color: var(--ac-encre); }
@media (max-width: 900px) { .mp-photo img { max-width: 460px; } .mp-photo figcaption { right: auto; max-width: 420px; } }

/* Programme PDF : pages blanches derrière la couverture (pas d’aperçu des pages pour ces métiers) */
.rp-eventail .rp-p-vide { display: block; background: #fff repeating-linear-gradient(180deg, transparent 0 22px, rgba(35, 11, 32, .06) 22px 24px) content-box; padding: 18% 14%; filter: none; opacity: .9; }

/* Cartes des sections propres à certains métiers (agents livrés, publics) et de l’espace en ligne */
.fm-cartes { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 44px; }
.fm-carte { display: flex; flex-direction: column; gap: 10px; padding: 26px 26px 28px; border-radius: 22px; background: #fff; border: 1px solid var(--ac-sable-2); }
.fm-fond .fm-carte, .fm-sable2 .fm-carte { border-color: transparent; }
.fm-carte > .ac-mono { font-size: 12px; color: var(--ac-magenta); }
.page-accueil-v5 .fm-carte h3 { margin: 0; font-weight: 400; font-size: 21px; line-height: 1.2; letter-spacing: -0.015em; color: var(--ac-encre); }
.page-accueil-v5 .fm-carte p, .fm-carte li { margin: 0; font-size: 15px; line-height: 1.6; color: var(--ac-texte); }
.page-accueil-v5 .fm-carte ul { margin: 0; padding-left: 18px; list-style: disc; display: grid; gap: 4px; }
#agents .ac-kicker, #publics .ac-kicker { margin-bottom: 14px; }
.page-accueil-v5 .fm-cartes-note { margin: 18px 0 0; max-width: 760px; font-size: 14px; line-height: 1.55; color: var(--ac-gris); }

/* Financement : une voie seule en pleine largeur, trois ou plus sur une grille */
.fe-voies-1 { grid-template-columns: 1fr; }
.fe-voies-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fe-voies-4, .fe-voies-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fe-voies-3 .fe-voie, .fe-voies-4 .fe-voie, .fe-voies-5 .fe-voie { border-left: 0; border-top: 1px solid var(--ac-ligne); }
.fe-voies-3 .fe-voie + .fe-voie { border-left: 1px solid var(--ac-ligne); }
.fe-voies-4 .fe-voie:nth-child(even), .fe-voies-5 .fe-voie:nth-child(even) { border-left: 1px solid var(--ac-ligne); }
.fe-voies-3 .fe-voie, .fe-voies-4 .fe-voie:nth-child(-n+2), .fe-voies-5 .fe-voie:nth-child(-n+2) { border-top: 0; }
.fe-voies-5 .fe-voie:last-child { grid-column: 1 / -1; border-left: 0; }
.page-accueil-v5 .fe .fe-etapes { list-style: none; margin: 0; padding: clamp(24px, 3vw, 36px) clamp(28px, 4vw, 48px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; border-top: 1px solid var(--ac-ligne); background: var(--ac-fond); }
.fe-etapes li { display: grid; gap: 8px; align-content: start; }
.fe-etapes .ac-mono { font-size: 12px; color: var(--ac-magenta); }
.page-accueil-v5 .fe-etapes p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--ac-texte); }
.fe-encart { margin-top: 24px; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: clamp(26px, 3.6vw, 40px); border-radius: 24px; background: #fff; }
.page-accueil-v5 .fe-encart h3 { margin: 0 0 8px; font-weight: 400; font-size: clamp(22px, 2vw, 27px); letter-spacing: -0.015em; color: var(--ac-encre); }
.page-accueil-v5 .fe-encart p { margin: 0; max-width: 680px; font-size: 15.5px; line-height: 1.6; color: var(--ac-texte); }
.fe-encart .ac-btn { flex: none; }
@media (max-width: 900px) {
  .fe-voies-3, .fe-voies-4, .fe-voies-5 { grid-template-columns: 1fr; }
  .fe-voies-3 .fe-voie + .fe-voie, .fe-voies-4 .fe-voie:nth-child(even), .fe-voies-5 .fe-voie:nth-child(even) { border-left: 0; }
  .fe-voies-3 .fe-voie + .fe-voie, .fe-voies-4 .fe-voie + .fe-voie, .fe-voies-5 .fe-voie + .fe-voie { border-top: 1px solid var(--ac-ligne); }
  .page-accueil-v5 .fe .fe-etapes { grid-template-columns: 1fr; }
  .fe-encart { flex-direction: column; align-items: flex-start; }
}

/* Calendrier : note de session, et carte quand aucune date n’est ouverte */
.page-accueil-v5 .cal-note { margin: 4px 0 0; font-size: 14px; line-height: 1.5; color: var(--ac-gris); }
.page-accueil-v5 .cal .fm-prog-intro { margin: -8px 0 32px; }
.cal-vide { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 28px; align-items: center; padding: 26px 30px; border-radius: 26px; background: var(--ac-fond); border: 1px solid var(--ac-sable-2); }
.page-accueil-v5 .cal-vide p { margin: 0; font-size: 17px; line-height: 1.55; color: var(--ac-encre); }
@media (max-width: 760px) {
  .cal-vide { grid-template-columns: 1fr; gap: 16px; padding: 22px 20px; }
  .cal-vide .cal-ic { display: none; }
  .cal-vide .cal-btn { justify-self: start; }
}

/* Votre espace en ligne : variables attendues par espace-en-ligne.css, cartes de la page */
.fm-espace { --encre: var(--ac-encre); --texte-2: var(--ac-gris); --rose: var(--ac-magenta); --rose-doux: #fbe8fb; --rose-texte: #8a0a86; }
.fm-espace .es-scene { margin-top: 0; }
.fm-espace .es-atouts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fm-espace .es-atout { padding: 0; overflow: hidden; gap: 0; }
.page-accueil-v5 .fm-espace .es-atout h3 { margin: 20px 22px 0; font-size: 18px; }
.page-accueil-v5 .fm-espace .es-atout p { margin: 8px 22px 24px; font-size: 14px; }
.fm-espace .es-en-ligne { margin-top: 16px; flex-direction: row; align-items: center; justify-content: space-between; gap: 24px; }
.page-accueil-v5 .fm-espace .es-en-ligne h3 { font-size: 19px; }
.fm-espace .es-en-ligne .ac-btn { flex: none; white-space: nowrap; }
@media (max-width: 960px) { .fm-espace .es-atouts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .fm-espace .es-en-ligne { flex-direction: column; align-items: flex-start; } }
@media (max-width: 520px) { .fm-espace .es-atouts { grid-template-columns: 1fr; } }

/* Formateurs à trois : les cartes passent sous le texte plus tôt */
@media (max-width: 1100px) { .fz.fz-duo.fz-trio { grid-template-columns: 1fr !important; } .fz-trio .fz-cartes { max-width: 640px; } }
@media (max-width: 860px) { .fz.fz-duo.fz-solo { grid-template-columns: 1fr !important; } }
@media (max-width: 560px) {
  .fz-trio .fz-carte { padding: 6px 6px 12px; gap: 10px; }
  .page-accueil-v5 #formateurs .fz-trio .fz-carte b { font-size: 15px; }
  .fz-trio .fz-carte span { display: none; }
}

/* Fiche du haut de page : plus de trois dates (pharmaciens, six lundis) sur deux lignes */
.page-accueil-v5 .fb-cel-long b { white-space: normal; font-size: 17px; line-height: 1.35; }