/* Séminaires hors cursus (3/11/2026, pré-production) : proposition B de la toile https://claude.ai/artifact/FzdvUwyTnLH5PLU9yS72dC.
   Calendrier en cartes (composants/HorsCursusCalendrier.tsx), page d'un séminaire (HorsCursusFiche.tsx), formulaire
   (InscriptionHorsCursus.tsx) et confirmation (MerciHorsCursus.tsx). Couleurs de la charte ; chaque séminaire prend la
   teinte de sa famille (--hc-texte, --hc-fond, lib/horsCursus.ts). */
.hc { --hc-rouge: #8c3c39; --hc-or: #8a6638; --hc-encre: #1c1917; --hc-texte-courant: #3a3431; --hc-gris-t: #5c5550;
  --hc-beige: #f5f2ef; --hc-rose: #f6edec; --hc-trait: #e5e0db; --hc-ombre: 0 10px 30px rgba(58, 52, 49, .12);
  color: var(--hc-texte-courant); font-size: 16px; line-height: 1.6; }
.hc h1, .hc h2, .hc h3 { font-family: Buda, Georgia, serif; color: var(--hc-encre); text-wrap: balance; }
.hc h2 { font-weight: 700; font-size: 30px; line-height: 1.2; color: var(--hc-rouge); }
.hc-largeur { max-width: 1200px; margin: 0 auto; padding-left: clamp(16px, 4vw, 40px); padding-right: clamp(16px, 4vw, 40px); box-sizing: border-box; }
.hc-sur { font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--hc-or); }
.hc-gris { font-size: 14px; color: var(--hc-gris-t); }
.hc-masque { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hc-etiquette { align-self: flex-start; display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px;
  background: var(--hc-fond); color: var(--hc-texte); font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .04em; }
.hc-prix { font-family: Buda, Georgia, serif; font-weight: 700; font-size: 24px; line-height: 1.2; color: var(--hc-rouge); }
.hc-prix-grand { font-size: 32px; }
#content.cx-refonte .hc-bouton { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px;
  padding: 0 22px; border: 0; border-radius: 4px; background: var(--rb); color: #fff; font-size: 16px; font-weight: 700;
  line-height: 1.2; text-decoration: none; white-space: nowrap; cursor: pointer; }
#content.cx-refonte .hc-bouton:disabled { opacity: .7; cursor: progress; }

/* Haut de la page du calendrier */
.hc-haut { background: var(--hc-beige); }
.hc-haut-texte { display: flex; flex-direction: column; gap: 12px; padding-top: clamp(36px, 5vw, 64px); padding-bottom: clamp(36px, 5vw, 64px); }
.hc-haut h1 { font-weight: 300; font-size: clamp(34px, 4.4vw, 56px); line-height: 1.08; }
.hc-chapeau { max-width: 680px; font-size: clamp(16px, 1.4vw, 18px); line-height: 1.6; }

/* Les cartes */
.hc-liste { display: flex; flex-direction: column; gap: 28px; padding-top: 40px; padding-bottom: 72px; }
.hc-liste-tete { display: flex; flex-wrap: wrap; gap: 10px 20px; align-items: baseline; justify-content: space-between; }
/* Tri par lieu (composants/TriLieux.tsx, 12/11/2026) : seules les cartes du lieu choisi restent. */
.hc-cartes[data-lieu="Méry"] .hc-carte:not([data-centre="Méry"]),
.hc-cartes[data-lieu="Saint-Martin-le-Vinoux"] .hc-carte:not([data-centre="Saint-Martin-le-Vinoux"]) { display: none; }
/* Angles nets, comme tout le design system (pas de boutons en pilule) : rayon-s, 4 px. */
#content.cx-refonte .hc-tri-lieux { margin-bottom: 4px; }
#content.cx-refonte .hc-suivi-filtres.hc-tri-lieux button { border-radius: 4px; min-height: 44px; }
.hc-cartes { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 24px; }
.hc-carte { display: flex; flex-direction: column; min-width: 0; border-radius: 4px; overflow: hidden; background: #fff; box-shadow: var(--hc-ombre); }
.hc-carte-photo { position: relative; display: block; }
.hc-carte-photo img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .4s ease; }
.hc-carte:hover .hc-carte-photo img { transform: scale(1.03); }
.hc-carte-photo { overflow: hidden; }
.hc-pastille { position: absolute; left: 14px; top: 14px; display: flex; flex-direction: column; align-items: center; padding: 8px 12px;
  border-radius: 4px; background: #fff; color: var(--hc-texte); text-align: center; }
.hc-pastille b { font-family: Buda, Georgia, serif; font-weight: 700; font-size: 26px; line-height: 1; }
.hc-pastille span { font-size: 12px; line-height: 16px; font-weight: 700; }
.hc-carte-corps { flex: 1; display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 22px; }
.hc-carte h3 { font-weight: 700; font-size: 23px; line-height: 1.2; }
#content.cx-refonte .hc-carte h3 a { color: inherit; text-decoration: none; }
#content.cx-refonte .hc-carte h3 a:hover { color: var(--hc-rouge); }
.hc-carte-infos { font-size: 14px; line-height: 1.55; color: var(--hc-gris-t); }
.hc-carte-pied { margin-top: auto; padding-top: 14px; border-top: 1px solid var(--hc-trait); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.hc-vide { display: flex; align-items: center; gap: 10px; padding: 18px 20px; border-radius: 4px; background: var(--hc-beige); }
.hc-comment { list-style: none; margin: 0; padding: 26px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 18px 40px; border-radius: 4px; background: var(--hc-beige); }
.hc-comment li { display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.hc-comment b { font-size: 16px; color: var(--hc-encre); }
.hc-question { text-align: center; }

/* Page d'un séminaire */
.hc-bandeau { display: block; width: 100%; height: clamp(220px, 34vw, 420px); object-fit: cover; }
.hc-colonne { max-width: 820px; margin: 0 auto; padding: 0 clamp(16px, 4vw, 40px) 72px; box-sizing: border-box; display: flex; flex-direction: column; gap: 40px; }
.hc-entete { position: relative; margin-top: -90px; padding: clamp(22px, 3vw, 36px); border-radius: 4px; background: #fff;
  box-shadow: 0 10px 30px rgba(58, 52, 49, .14); display: flex; flex-direction: column; gap: 14px; }
#content.cx-refonte .hc-retour { align-self: flex-start; font-size: 14px; font-weight: 700; color: var(--hc-gris-t); text-decoration: none; }
#content.cx-refonte .hc-retour:hover { color: var(--hc-rouge); }
.hc-entete h1 { font-weight: 300; font-size: clamp(30px, 3.6vw, 44px); line-height: 1.1; }
.hc-infos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 14px 24px; }
.hc-infos > div { display: flex; gap: 10px; align-items: flex-start; }
.hc-infos .cx-ph { flex: none; margin-top: 2px; color: var(--hc-texte, var(--hc-rouge)); }
.hc-infos dt { font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--hc-gris-t); }
.hc-infos dd { margin: 0; font-size: 15px; line-height: 1.45; color: var(--hc-encre); }
.hc-entete-pied { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; justify-content: space-between; padding-top: 14px; border-top: 1px solid var(--hc-trait); }
.hc-bloc { display: flex; flex-direction: column; gap: 10px; }
.hc-volets { display: flex; flex-direction: column; }
.hc-volets details { border-top: 1px solid var(--hc-trait); }
.hc-volets details:last-child { border-bottom: 1px solid var(--hc-trait); }
.hc-volets summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 8px 0;
  font-weight: 700; color: var(--hc-encre); cursor: pointer; list-style: none; }
.hc-volets summary::-webkit-details-marker { display: none; }
.hc-volets summary .cx-ph { flex: none; color: var(--hc-rouge); transition: transform .18s ease; }
.hc-volets details[open] summary .cx-ph { transform: rotate(180deg); }
.hc-volets ul { margin: 0 0 16px; padding-left: 20px; display: flex; flex-direction: column; gap: 4px; }
.hc-note { margin-top: 6px; }

/* Infos pratiques, proposition D : la date en grand à gauche, les autres repères en lignes */
.hc-agenda { display: flex; flex-wrap: wrap; gap: 20px 28px; align-items: stretch; }
.hc-date { flex: 1 1 190px; max-width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  padding: 20px 16px; border-radius: 4px; background: var(--hc-fond); color: var(--hc-texte); text-align: center; }
.hc-date-jours { font-size: 13px; line-height: 18px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.hc-date-jj { font-family: Buda, Georgia, serif; font-weight: 700; font-size: 56px; line-height: 1; font-variant-numeric: lining-nums; }
.hc-date-jj sup { font-size: .42em; vertical-align: super; line-height: 0; }
.hc-date-mois { font-family: Buda, Georgia, serif; font-weight: 700; font-size: 22px; line-height: 1.2; }
.hc-date-duree { margin-top: 6px; font-size: 14px; white-space: nowrap; color: var(--hc-texte-courant); }
.hc-lignes { flex: 999 1 300px; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.hc-lignes > div { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: flex-start; padding: 14px 0; border-top: 1px solid var(--hc-trait); }
.hc-lignes > div > .cx-ph { flex: none; margin-top: 3px; color: var(--hc-texte); }
.hc-lignes > div > span { flex: 1 1 200px; min-width: 0; display: flex; flex-direction: column; }
.hc-lignes dt { font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--hc-gris-t); }
.hc-lignes dd { margin: 0; display: flex; flex-direction: column; }
.hc-lignes dd b { font-size: 17px; line-height: 1.4; color: var(--hc-encre); }
.hc-lignes dd span { font-size: 14px; line-height: 1.45; color: var(--hc-texte-courant); }
#content.cx-refonte .hc-itineraire { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; margin-left: 34px; font-size: 14px; font-weight: 700; color: var(--hc-rouge); text-decoration: none; }
@media (min-width: 768px) { #content.cx-refonte .hc-itineraire { margin-left: 0; } }
#content.cx-refonte .hc-itineraire:hover { text-decoration: underline; }

/* Réservation */
.hc-reserver { scroll-margin-top: 24px; padding: clamp(22px, 3vw, 32px); border-radius: 4px; background: var(--hc-rose); display: flex; flex-direction: column; gap: 16px; }
.hc-etapes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; font-size: 13px; line-height: 1.3; font-weight: 700; }
.hc-etapes li { padding: 8px 10px; border-radius: 4px; background: #fff; color: var(--hc-gris-t); text-align: center; }
.hc-etapes li[aria-current] { background: var(--hc-rouge); color: #fff; }
.hc-form { display: flex; flex-direction: column; gap: 14px; }
.hc-form label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 700; color: var(--hc-encre); }
#content.cx-refonte .hc-form input:not([type="checkbox"]):not([type="radio"]) { width: 100%; height: 48px; box-sizing: border-box; padding: 0 14px;
  border: 1px solid #9b918a; border-radius: 4px; background: #fff; color: var(--hc-encre); font-size: 16px; font-weight: 400; }
#content.cx-refonte .hc-form input:focus-visible { outline: 3px solid var(--hc-rouge); outline-offset: 1px; }
.hc-champs-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.hc-form .hc-case { flex-direction: row; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.5; font-weight: 400; color: var(--hc-texte-courant); }
.hc-case input { flex: none; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--hc-rouge); }
.hc-piege { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#content.cx-refonte .hc-bouton-large { width: 100%; }
.hc-centre { text-align: center; }
.hc-erreur { padding: 12px 14px; border-radius: 4px; background: #fff; color: var(--hc-rouge); font-weight: 700; font-size: 14px; }

/* Confirmation */
.hc-merci { max-width: 720px; margin: 0 auto; padding: clamp(40px, 6vw, 80px) clamp(16px, 4vw, 40px); box-sizing: border-box; display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.hc-merci-icone { color: #2d5b3e; }
.hc-merci h1 { font-weight: 300; font-size: clamp(32px, 4vw, 48px); line-height: 1.1; }
.hc-recap { width: 100%; box-sizing: border-box; padding: 22px; border-radius: 4px; background: var(--hc-beige); display: flex; flex-direction: column; gap: 12px; }
.hc-recap > b { font-family: Buda, Georgia, serif; font-size: 22px; line-height: 1.25; color: var(--hc-rouge); }

@media (max-width: 767px) {
  .hc h2 { font-size: 26px; }
  .hc-entete { margin-top: -48px; }
  .hc-colonne { gap: 32px; }
  .hc-champs-2 { grid-template-columns: 1fr; }
  .hc-etapes { font-size: 12px; }
  .hc-entete-pied .hc-bouton, .hc-carte-pied .hc-bouton { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) { .hc-carte-photo img, .hc-volets summary .cx-ph { transition: none; } }

/* Places restantes près du formulaire */
.hc-places { font-size: 14px; font-weight: 700; color: var(--hc-rouge); }
.hc-avis { padding: 12px 14px; border-radius: 4px; background: #fff; font-size: 14px; }

/* Page de suivi (réservée à l'équipe) */
.hc-suivi { max-width: 1100px; margin: 0 auto; padding: clamp(32px, 5vw, 56px) clamp(16px, 4vw, 40px) 64px; box-sizing: border-box; display: flex; flex-direction: column; gap: 24px; }
.hc-suivi h1 { font-weight: 300; font-size: clamp(30px, 4vw, 44px); line-height: 1.1; }
.hc-suivi-connexion { max-width: 440px; }
.hc-suivi-tete { display: flex; flex-direction: column; gap: 8px; }
.hc-suivi-alerte { padding: 10px 14px; border-radius: 4px; background: var(--hc-beige); font-size: 14px; }
.hc-mdp { position: relative; display: block; }
#content.cx-refonte .hc-mdp input { padding-right: 52px; }
#content.cx-refonte .hc-mdp button { position: absolute; right: 2px; top: 2px; width: 44px; height: 44px; border: 0; background: transparent; color: var(--hc-gris-t); display: flex; align-items: center; justify-content: center; cursor: pointer; }
.hc-suivi-outils { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.hc-suivi-filtres { display: flex; flex-wrap: wrap; gap: 8px; }
#content.cx-refonte .hc-suivi-filtres button, #content.cx-refonte .hc-suivi-excel { min-height: 40px; padding: 0 14px; border: 1px solid var(--hc-trait); border-radius: 4px; background: #fff; color: var(--hc-encre); font-size: 14px; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
#content.cx-refonte .hc-suivi-filtres button.actif { background: var(--hc-encre); border-color: var(--hc-encre); color: #fff; }
.hc-suivi-cherche { flex: 1 1 220px; }
#content.cx-refonte .hc-suivi-cherche input { width: 100%; height: 40px; box-sizing: border-box; padding: 0 14px; border: 1px solid #9b918a; border-radius: 4px; font-size: 15px; }
.hc-suivi-sem { display: flex; flex-direction: column; gap: 16px; padding: clamp(18px, 3vw, 28px); border-radius: 4px; background: #fff; box-shadow: var(--hc-ombre); }
.hc-suivi-sem-tete { display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: flex-start; justify-content: space-between; }
.hc-suivi-sem h2 { font-size: 24px; }
.hc-suivi-sem-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
@media (max-width: 640px) { .hc-suivi-sem-actions { align-items: flex-start; } }
#content.cx-refonte .hc-suivi-excel:disabled { opacity: .5; cursor: default; }
.hc-suivi-seuil { padding: 4px 10px; border-radius: 999px; background: var(--hc-rose); color: var(--hc-rouge); font-size: 13px; font-weight: 700; }
.hc-suivi-seuil.atteint { background: #e8f1eb; color: #2d5b3e; }
.hc-suivi-chiffres { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.hc-suivi-chiffres div { display: flex; flex-direction: column; padding: 12px 14px; border-radius: 4px; background: var(--hc-beige); }
.hc-suivi-chiffres b { font-family: Buda, Georgia, serif; font-size: 28px; line-height: 1.15; color: var(--hc-rouge); font-variant-numeric: tabular-nums; }
.hc-suivi-chiffres small { font-size: 16px; color: var(--hc-gris-t); }
.hc-suivi-chiffres span { font-size: 13px; color: var(--hc-gris-t); }
.hc-suivi-chiffres em { font-size: 12px; font-style: normal; color: var(--hc-or); }
.hc-suivi-contact { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 14px; }
.hc-suivi-contact a { display: inline-flex; align-items: center; gap: 6px; overflow-wrap: anywhere; }
#content.cx-refonte .hc-suivi-lien { border: 0; background: none; padding: 0; color: var(--hc-rouge); font: inherit; text-decoration: underline; cursor: pointer; }
/* Suivi : alertes, puces d'e-mails et tableau (9/11/2026, maquette https://claude.ai/artifact/GULzr2dpoh5HdmXWcLvXdf) */
.hc-alertes { display: flex; flex-direction: column; gap: 8px; }
.hc-alerte { display: flex; gap: 10px; align-items: flex-start; padding: 10px 14px; border-radius: 4px; font-size: 14px; line-height: 1.45; }
.hc-alerte svg { flex: none; margin-top: 1px; }
.hc-alerte-min { background: #fbeee2; color: #7a3a0e; }
.hc-alerte-email { background: #f6e3e2; color: #7a2f2c; }
.hc-puce { display: inline-flex; align-items: center; gap: 5px; min-height: 24px; padding: 0 9px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1.2; white-space: nowrap; background: #efecea; color: var(--hc-texte-courant); }
.hc-puce > i { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.hc-puce-envoye { background: #fcf0da; color: #8a5a00; } .hc-puce-envoye > i { background: #d9a21b; }
.hc-puce-recu, .hc-puce-lu { background: #e3f0e6; color: #2d5b3e; } .hc-puce-recu > i { background: #2d8a4e; }
.hc-puce-non_recu { background: #f6e3e2; color: var(--hc-rouge); } .hc-puce-non_recu > i { background: #c0392b; }
.hc-etat-payee { background: #e3f0e6; color: #2d5b3e; }
.hc-etat-prelevement { background: #fcf0da; color: #8a5a00; }
.hc-etat-remboursee { background: var(--hc-rose); color: var(--hc-rouge); }
.hc-etat-echec { background: #f6e3e2; color: var(--hc-rouge); }
.hc-legende { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; font-size: 13px; color: var(--hc-gris-t); }
.hc-legende small { font-size: 12px; }
.hc-tableau { display: flex; flex-direction: column; font-size: 13px; }
.hc-tableau-tete, .hc-tableau-ligne { display: grid; grid-template-columns: minmax(0, 1fr) 160px minmax(0, 1.6fr) 150px minmax(0, 1.1fr); column-gap: 16px; }
.hc-tableau-tete span { padding: 6px 0; border-bottom: 1px solid var(--hc-trait); font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--hc-gris-t); }
.hc-tableau-ligne > div { padding: 12px 0; border-bottom: 1px solid var(--hc-trait); min-width: 0; }
.hc-tableau-ligne:last-child > div { border-bottom: 0; }
.hc-t-qui { display: flex; flex-direction: column; gap: 2px; }
.hc-t-qui b { color: var(--hc-encre); font-size: 14px; }
.hc-visio { font-size: 13px; font-weight: 700; color: var(--hc-rouge); }
.hc-tableau .hc-gris { font-size: 13px; }
.hc-t-emails { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; align-content: flex-start; }
.hc-t-facture { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
#content.cx-refonte .hc-t-renvoi { font-size: 12px; font-weight: 700; min-height: 24px; }
.hc-tableau .hc-suivi-contact { font-size: 13px; }
.hc-reglages { padding: 14px 18px; border-radius: 4px; background: var(--hc-beige); font-size: 14px; display: flex; flex-direction: column; gap: 8px; }
.hc-reglages summary { cursor: pointer; font-weight: 700; color: var(--hc-encre); }
.hc-reglages p { margin: 8px 0 0; }
.hc-effacer-essais { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--hc-trait); }
.hc-code { display: block; padding: 8px 10px; background: #fff; border: 1px solid var(--hc-trait); border-radius: 4px; font-size: 12px; overflow-wrap: anywhere; user-select: all; }
@media (max-width: 899px) {
  .hc-tableau-tete { display: none; }
  .hc-tableau-ligne { grid-template-columns: minmax(0, 1fr) auto; column-gap: 8px; padding: 12px 0; border-top: 1px solid var(--hc-trait); }
  .hc-tableau-ligne > div { padding: 0; border: 0; }
  .hc-tableau-ligne > .hc-t-emails, .hc-tableau-ligne > .hc-t-facture, .hc-tableau-ligne > .hc-suivi-contact { grid-column: 1 / -1; padding-top: 8px; }
  .hc-tableau-ligne > div:nth-child(2) { justify-self: end; }
  .hc-t-facture:has(> span[aria-label]) { display: none; }
}
/* Suivi : bandeau des totaux, tous séminaires (9/11/2026, proposition B de https://claude.ai/artifact/KBTJYDNBPRAnUmvUNXcNdm) */
.hc-totaux { display: flex; flex-direction: column; gap: 14px; padding: 20px 24px; border-radius: 4px; background: var(--hc-rouge); color: #fff; }
.hc-totaux-tete { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; font-size: 13px; color: #f6e9e8; }
.hc-totaux-sur { font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #f3e3c9; }
.hc-totaux-chiffres { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.hc-totaux-chiffres > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 0 12px; border-left: 1px solid #b06b68; }
.hc-totaux-chiffres > div:first-child { padding-left: 0; border-left: 0; }
.hc-totaux-chiffres > div:last-child { padding-right: 0; }
.hc-totaux-chiffres b { font-family: Buda, Georgia, serif; font-size: 30px; line-height: 36px; color: #fff; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hc-totaux-chiffres span { font-size: 13px; font-weight: 700; }
.hc-totaux-chiffres small { font-size: 12px; color: #f6e9e8; }
@media (max-width: 899px) {
  .hc-totaux { padding: 16px; }
  .hc-totaux-chiffres { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 14px; }
  .hc-totaux-chiffres > div { padding: 0 0 0 12px; }
  .hc-totaux-chiffres > div:nth-child(odd) { padding: 0 12px 0 0; border-left: 0; }
}
/* Cartes du calendrier : objectif et places restantes (9/11/2026, maquette https://claude.ai/artifact/7abLAsekh7RCcAxjfxQa1V) */
.hc-carte-objectif { font-size: 15px; line-height: 22px; color: var(--hc-encre); }
.hc-places { margin-top: auto; display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border-radius: 4px; background: var(--hc-rose); }
.hc-places + .hc-carte-pied { margin-top: 0; }
.hc-places-texte { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 14px; color: var(--hc-texte-courant); }
.hc-places-texte svg { flex: none; color: var(--hc-rouge); }
.hc-places-texte b { color: var(--hc-encre); }
.hc-jauge { height: 6px; border-radius: 999px; background: #fff; overflow: hidden; }
.hc-jauge div { height: 6px; background: var(--hc-rouge); }
.hc-places.peu { background: #fbeee2; }
.hc-places.peu svg, .hc-places.peu b { color: #a24a12; }
.hc-places.peu .hc-jauge div { background: #a24a12; }
.hc-places.complet { background: #efecea; }
.hc-places.complet svg { color: var(--hc-gris-t); }
.hc-places.complet .hc-jauge div { background: #8a817a; }
.hc-carte:has(.hc-places.complet) .hc-carte-photo img { filter: grayscale(.35); }
.hc-carte:has(.hc-places.complet) .hc-prix { color: #8a817a; }
.hc-prix-bloc { display: flex; flex-direction: column; }
.hc-prix-bloc span { font-size: 13px; color: var(--hc-gris-t); }
#content.cx-refonte .hc-bouton-complet { border: 0; border-radius: 4px; padding: 0 22px; background: var(--hc-trait); color: var(--hc-gris-t); font-weight: 700; cursor: not-allowed; opacity: 1; }
.hc-places-note { font-size: 13px; line-height: 19px; color: var(--hc-gris-t); }
.hc-places-texte span { font-weight: 400; }  /* « restantes sur 16 », « sur 16 » : texte courant, le nombre seul en gras */

/* Page interne « Les inscriptions aux séminaires, comment ça marche » (12/11/2026,
   app/formations-courtes/comment-ca-marche/page.tsx), dans le style des pages des séminaires. */
.hc-expl h3 { font-weight: 700; font-size: 23px; line-height: 1.2; }
.hc-expl-bloc { display: flex; flex-direction: column; gap: 28px; padding-top: clamp(40px, 6vw, 72px); }
.hc-expl-bloc:last-child { padding-bottom: 72px; }
.hc-expl ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 8px; }
.hc-expl ul.hc-comment { display: grid; padding: 26px; gap: 18px 40px; }
.hc-expl-chiffres { list-style: none; margin: 0; padding: 0 !important; display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 24px !important; }
.hc-expl-chiffres li { display: flex; flex-direction: column; gap: 6px; padding-top: 14px; border-top: 1px solid var(--hc-trait); }
.hc-expl-chiffres b { font-family: Buda, Georgia, serif; font-weight: 700; font-size: 40px; line-height: 1; color: var(--hc-rouge); }
.hc-expl-chiffres span { font-size: 14px; color: var(--hc-gris-t); }
.hc-expl-etapes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: clamp(40px, 6vw, 64px); }
.hc-expl-etape { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: clamp(24px, 4vw, 48px); align-items: start; }
.hc-expl-texte { display: flex; flex-direction: column; gap: 12px; }
.hc-expl-numero { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%;
  background: var(--hc-rouge); color: #fff; font-family: Buda, Georgia, serif; font-weight: 700; font-size: 22px; }
.hc-expl-captures { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.hc-expl-captures.hc-expl-deux { flex-direction: row; align-items: flex-start; }
.hc-expl-deux > .hc-expl-capture { flex: 1.6; }
.hc-expl-deux > .hc-expl-etroite { flex: 1; }
.hc-expl-capture { margin: 0; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.hc-expl-capture a { display: block; cursor: zoom-in; }
.hc-expl-capture img { display: block; width: 100%; height: auto; border-radius: 4px; box-shadow: var(--hc-ombre); }
.hc-expl-etroite { max-width: 420px; }
.hc-expl-capture figcaption { font-size: 14px; color: var(--hc-gris-t); }
.hc-expl-tableau { display: flex; flex-direction: column; border-top: 1px solid var(--hc-trait); }
.hc-expl-ligne { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) minmax(0, 1fr); gap: 8px 24px; padding: 14px 0; border-bottom: 1px solid var(--hc-trait); }
.hc-expl-ligne b { color: var(--hc-encre); }
.hc-expl-tete span { font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--hc-or); }
.hc-expl-galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 28px 24px; align-items: start; }
.hc-expl-colonnes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 24px 48px; }
.hc-expl-colonnes > div { display: flex; flex-direction: column; gap: 12px; }
@media (max-width: 860px) {
  .hc-expl-etape { grid-template-columns: minmax(0, 1fr); }
  .hc-expl-tete { display: none; }
  .hc-expl-ligne { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}
@media (max-width: 560px) {
  .hc-expl-captures.hc-expl-deux { flex-direction: column; }
  .hc-expl-etroite { max-width: 100%; }
}

/* Visionneuse des captures (composants/VisionneuseCaptures.tsx) */
.hc-vis { padding: 0; border: 0; background: transparent; width: 100vw; height: 100dvh; max-width: none; max-height: none; overflow: hidden; }
.hc-vis::backdrop { background: rgba(28, 25, 23, .88); }
.hc-vis[open] { display: flex; flex-direction: column; }
.hc-vis-barre { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px clamp(16px, 4vw, 40px);
  color: #fff; font-size: 14px; }
.hc-vis-compte { color: rgba(255, 255, 255, .7); }
#content .hc-vis button, #content .hc-vis button:focus { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px;
  padding: 0; border: 1px solid rgba(255, 255, 255, .35); border-radius: 50%; background: rgba(28, 25, 23, .72); color: #fff; cursor: pointer; }
#content .hc-vis button:hover, #content .hc-vis button:focus-visible { background: rgba(28, 25, 23, .92); outline: 2px solid #fff; outline-offset: 2px; }
.hc-vis-image { flex: 1; min-height: 0; overflow: auto; display: flex; justify-content: center; align-items: flex-start; padding: 8px 72px 32px; }
.hc-vis-image img { display: block; width: auto; max-width: 100%; height: auto; border-radius: 4px; box-shadow: 0 10px 40px rgba(0, 0, 0, .4); cursor: default; }
.hc-vis-fleche { position: absolute; top: 50%; transform: translateY(-50%); }
.hc-vis-avant { left: clamp(8px, 2vw, 20px); }
.hc-vis-apres { right: clamp(8px, 2vw, 20px); }
@media (max-width: 600px) {
  .hc-vis-image { padding: 4px 12px 88px; }
  .hc-vis-fleche { top: auto; bottom: 20px; transform: none; }
  .hc-vis-avant { left: calc(50% - 56px); }
  .hc-vis-apres { right: calc(50% - 56px); }
}
/* Paiement en une fois ou en trois fois (12/11/2026, Pharmacopée occidentale). */
.hc-paiement { margin: 0; padding: 0; border: 0; display: flex; flex-direction: column; gap: 8px; }
.hc-paiement legend { padding: 0 0 6px; font-weight: 700; color: var(--hc-encre); }
.hc-erreur-ligne { font-size: 13px; font-weight: 700; color: #c0392b; }