/**
 * HPM — La page d'un projet, vue publique.
 *
 * ⚠️ CETTE FEUILLE NE DOIT PAS REVENIR DANS LE CONTENU DE LA PAGE.
 * Le 24/09, elle y était : WordPress passe le contenu à wpautop(), qui
 * insère des <br /> au fil des retours à la ligne — y compris à
 * l'intérieur d'une balise <style>. La feuille devient alors invalide et
 * le navigateur la jette en silence. Résultat : la page s'affiche nue,
 * sans la moindre erreur pour l'expliquer.
 *
 * La CSS se charge donc comme toute CSS : par wp_enqueue_style().
 */

.hpm-vp{--hpm-vp-bleu:var(--hpm-t-0068e8,#0068E8);--hpm-vp-violet:var(--hpm-t-8224e3,#8224E3);--hpm-vp-turquoise:#0FA69F;--hpm-vp-trait:#aab5c6;font-size:calc(15px * var(--hpm-fs,1));line-height:1.6}
.hpm-vp *{box-sizing:border-box}
.hpm-vp-bandeau{background:linear-gradient(135deg,var(--hpm-vp-bleu) 0%,var(--hpm-vp-violet) 100%);border-radius:4px 4px 0 0;padding:44px 46px 40px;color:#fff}
.hpm-vp-bandeau h1{font-size:calc(34px * var(--hpm-fs,1));font-weight:800;line-height:1.2;margin:0 0 16px;color:#fff}
.hpm-vp-chips{display:flex;gap:10px;flex-wrap:wrap}
.hpm-vp-chip{background:rgba(255,255,255,.17);border:1px solid rgba(255,255,255,.26);border-radius:4px;padding:6px 13px;font-size:max(calc(12.5px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));font-weight:600}
.hpm-vp-chip-archive{background:rgba(0,0,0,.22);border-color:rgba(255,255,255,.2)}
/* ⚠️ minmax(0,1fr) et NON 1fr. Une colonne de grille vaut par défaut
   min-width:auto : elle refuse de descendre sous la largeur minimale de
   son contenu. Dans un conteneur étroit — celui d'un thème, d'une
   colonne WPBakery — la grille déborde alors par la droite, et la
   colonne de droite sort du cadre blanc. C'est ce qui s'est vu le
   24/09 sur la page d'Équilibre Pro. */
.hpm-vp{max-width:100%}
.hpm-vp-corps{background:#fff;border:2px solid var(--hpm-vp-trait);border-top:none;border-radius:0 0 4px 4px;padding:46px;display:flex;flex-wrap:wrap;align-items:flex-start;gap:48px;max-width:100%}
.hpm-vp-gauche{flex:8 1 380px;min-width:0}
/* Pas de max-width : repliée seule sur sa ligne, la colonne doit occuper
   toute la largeur au lieu de laisser un vide à sa droite. Le rapport
   8 pour 1 lui garde environ 340 px quand les deux tiennent côte à côte. */
.hpm-vp-droite{flex:1 1 300px;min-width:0}
.hpm-vp-sec{margin-bottom:46px}
.hpm-vp-sec:last-child{margin-bottom:0}
.hpm-vp-sec>h2{font-size:max(calc(12.5px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));letter-spacing:1.4px;text-transform:uppercase;color:#98a1b0;font-weight:700;margin:0 0 18px}
.hpm-vp-texte p{font-size:calc(15.5px * var(--hpm-fs,1));line-height:1.85;color:var(--hpm-t-39414f,#39414f);margin:0 0 16px}
.hpm-vp-parcours{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.hpm-vp-jeton{font-size:max(calc(12px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));font-weight:600;padding:6px 14px;border-radius:999px;background:#eef0f4;color:#8b94a3;border:1px solid #e3e6ec}
.hpm-vp-jeton.est-fait{background:#e8f4f3;color:#0a6b64;border-color:#c7e7e4}
.hpm-vp-jeton.est-ici{background:var(--hpm-vp-turquoise);color:#fff;border-color:var(--hpm-vp-turquoise)}
.hpm-vp-fleche{color:#c3c9d3;font-size:calc(13px * var(--hpm-fs,1))}
.hpm-vp-avance-tete{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
.hpm-vp-lbl{font-size:calc(13px * var(--hpm-fs,1));color:#6b7280;font-weight:600}
.hpm-vp-val{font-size:calc(26px * var(--hpm-fs,1));font-weight:800;color:var(--hpm-vp-turquoise)}
.hpm-vp-barre{height:11px;background:#eceff3;border-radius:999px;overflow:hidden}
.hpm-vp-barre i{display:block;height:100%;background:linear-gradient(90deg,var(--hpm-vp-bleu),var(--hpm-vp-turquoise));border-radius:999px}
.hpm-vp-verrou{border:1px dashed #d4d9e1;border-radius:4px;padding:30px 32px;background:#fafbfc}
.hpm-vp-verrou-tete{font-size:calc(15px * var(--hpm-fs,1));font-weight:700;margin-bottom:9px}
.hpm-vp-verrou p{font-size:calc(14px * var(--hpm-fs,1));color:#6b7280;margin:0 0 20px}
.hpm-vp-grille{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.hpm-vp-item{background:#fff;border:1px solid #e6e9ee;border-radius:4px;padding:16px 12px;text-align:center;font-size:max(calc(12.5px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));font-weight:600;color:#686d82}
.hpm-vp-carte{border:2px solid var(--hpm-vp-trait);border-radius:4px;padding:28px;margin-bottom:24px;background:#fff;min-width:0;overflow-wrap:anywhere}
.hpm-vp-carte:last-child{margin-bottom:0}
.hpm-vp-carte h3{font-size:max(calc(12.5px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));letter-spacing:1.4px;text-transform:uppercase;color:#98a1b0;font-weight:700;margin:0 0 20px}
.hpm-vp-chiffre{display:flex;align-items:baseline;gap:9px}
.hpm-vp-chiffre b{font-size:calc(36px * var(--hpm-fs,1));font-weight:800;color:var(--hpm-t-1d2430,#1d2430);line-height:1}
.hpm-vp-chiffre span{font-size:calc(14px * var(--hpm-fs,1));color:#6b7280;font-weight:600}
.hpm-vp-detail{font-size:calc(13px * var(--hpm-fs,1));color:#6b7280;margin-top:14px}
.hpm-vp-ruban{font-size:max(calc(12.5px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));border-radius:4px;padding:9px 13px;margin-top:16px;line-height:1.55;background:#fff8ec;color:#92640d;border:1px solid #f5e0bd}
.hpm-vp-ruban.est-vert{background:#e8f4f3;color:#0a6b64;border-color:#c7e7e4}
.hpm-vp-ruban.est-gris{background:#f4f5f7;color:#6b7280;border-color:#e2e5ea}
.hpm-vp-btn{display:block;width:100%;text-align:center;padding:15px;border-radius:4px;font-size:calc(15px * var(--hpm-fs,1));font-weight:700;border:none;margin-bottom:12px;cursor:pointer;text-decoration:none}
.hpm-vp-btn:last-of-type{margin-bottom:0}
.hpm-vp-btn.est-primaire{background:linear-gradient(135deg,var(--hpm-vp-bleu),var(--hpm-vp-violet));color:#fff}
.hpm-vp-btn.est-turquoise{background:var(--hpm-vp-turquoise);color:#fff}
.hpm-vp-btn.est-ambre{background:#f39c12;color:#fff}
.hpm-vp-btn.est-gris{background:#fff;color:#5a6169;border:1px solid #d9dee6}
.hpm-vp-note{font-size:max(calc(12px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));color:#98a1b0;text-align:center;line-height:1.6;margin-top:12px}
.hpm-vp-infos div{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:11px 0;border-bottom:1px solid #f0f2f5;font-size:calc(13.5px * var(--hpm-fs,1))}
.hpm-vp-infos div:last-child{border-bottom:none}
.hpm-vp-infos span{color:#8b94a3}
.hpm-vp-infos b{color:var(--hpm-t-39414f,#39414f)}
@media(max-width:1080px){
.hpm-vp-corps{gap:34px;padding:30px}
.hpm-vp-bandeau{padding:32px 30px 28px}
.hpm-vp-bandeau h1{font-size:calc(26px * var(--hpm-fs,1))}
.hpm-vp-grille{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:520px){
.hpm-vp-corps{padding:20px}
.hpm-vp-carte{padding:20px}
.hpm-vp-verrou{padding:20px}
.hpm-vp-chiffre b{font-size:calc(30px * var(--hpm-fs,1))}
}

/* Le vrai gras dans la description publique (voir espace-projet.css). @since 1.4.4 */
.hpm-vp-texte strong,.hpm-vp-texte b{font-weight:700}

/* ══════════════════════════════════════════════════════════════════════
   Le Guide du projet (@since 1.4.5) — des <details> natifs : ils se
   déplient sans script, au clavier comme à la souris.
   Servi à la vitrine publique ET à l'espace membre (vue « Guide »).
   ══════════════════════════════════════════════════════════════════════ */
.hpm-guide{display:flex; flex-direction:column; gap:10px; margin:0 0 24px}
.hpm-guide-sec{border:1px solid #e4e8ee; border-radius:10px; background:#fff; overflow:hidden}
.hpm-guide-sec[open]{border-color:var(--hpm-t-d9cdf3,#d9cdf3)}
.hpm-guide-sec>summary{display:flex; align-items:center; gap:12px; padding:13px 16px; cursor:pointer;
  font-weight:700; font-size:calc(15px * var(--hpm-fs,1)); color:var(--hpm-t-1d2430,#1d2430); list-style:none}
.hpm-guide-sec>summary::-webkit-details-marker{display:none}
.hpm-guide-sec[open]>summary{background:var(--hpm-t-faf7ff,#faf7ff)}
.hpm-guide-sec>summary:focus-visible{outline:2px solid var(--hpm-t-8224e3,#8224E3); outline-offset:-2px}
.hpm-guide-ico{width:32px; height:32px; flex:0 0 32px; border-radius:8px; background:var(--hpm-t-f3eefc,#f3eefc);
  display:flex; align-items:center; justify-content:center; font-size:calc(16px * var(--hpm-fs,1))}
.hpm-guide-titre{flex:1 1 auto; min-width:0}
.hpm-guide-cadenas{font-size:max(calc(11px * var(--hpm-fs,1)),var(--hpm-fs-min,0px)); font-weight:700; background:#eef1f5; color:#5a6169; border-radius:10px; padding:1px 9px; flex:0 0 auto}
.hpm-guide-chevron::after{content:"▼"; color:var(--hpm-t-8224e3,#8224E3); font-size:max(calc(12px * var(--hpm-fs,1)),var(--hpm-fs-min,0px))}
.hpm-guide-sec[open]>summary .hpm-guide-chevron::after{content:"▲"}
.hpm-guide-corps{padding:6px 20px 16px 62px; font-size:calc(14.5px * var(--hpm-fs,1)); line-height:1.7; color:var(--hpm-t-39414f,#39414f)}
.hpm-guide-corps p{margin:0 0 10px}
.hpm-guide-corps ul,.hpm-guide-corps ol{margin:0 0 10px; padding-left:1.3em}
.hpm-guide-corps strong,.hpm-guide-corps b{font-weight:700}
.hpm-guide-q{border-top:1px solid #f0f2f5}
.hpm-guide-q:first-child{border-top:none}
.hpm-guide-q>summary{display:flex; justify-content:space-between; gap:12px; padding:10px 0; cursor:pointer;
  font-weight:700; font-size:calc(14.5px * var(--hpm-fs,1)); list-style:none; color:var(--hpm-t-1d2430,#1d2430)}
.hpm-guide-q>summary::-webkit-details-marker{display:none}
.hpm-guide-plus::after{content:"+"; color:var(--hpm-t-8224e3,#8224E3); font-weight:800}
.hpm-guide-q[open]>summary .hpm-guide-plus::after{content:"−"}
.hpm-guide-r{padding:0 0 12px; color:#4b5563}
@media(max-width:640px){ .hpm-guide-corps{padding:6px 16px 14px 16px} }

/* ══ 1.4.55 — La page publique refaite (maquette du 26/09) ══════════════
   Liserés toujours droits (`[Kad]`), sur toute la page publique. */
.hpm-vp .hpm-vp-bandeau,.hpm-vp .hpm-vp-corps,.hpm-vp .hpm-vp-chip,.hpm-vp .hpm-vp-verrou,.hpm-vp .hpm-vp-item,.hpm-vp .hpm-vp-carte,
.hpm-vp .hpm-vp-ruban,.hpm-vp .hpm-vp-btn,.hpm-vp .hpm-vp-jeton,.hpm-vp .hpm-guide-sec,.hpm-vp .hpm-guide-ico,.hpm-vp .hpm-guide-cadenas,.hpm-vp .hpm-dp,.hpm-vp .hpm-dp a{border-radius:0}
.hpm-vp .hpm-vp-bandeau h1{color:#fff !important;-webkit-text-fill-color:#fff;background:none}

.hpm-vp-kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.hpm-vp-k{border:1px solid #e3e6ee;border-left:4px solid var(--hpm-t-8224e3,#8224E3);padding:12px 14px;background:#fff;min-width:0}
.hpm-vp-k b{display:block;font-size:calc(22px * var(--hpm-fs,1));line-height:1.2;color:var(--hpm-t-1d2430,#1d2430)}
.hpm-vp-k span{display:block;font-size:max(calc(12px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));color:#6b7280;font-weight:600;margin-top:3px}
.hpm-vp-k.est-v{border-left-color:#0c8560}.hpm-vp-k.est-b{border-left-color:var(--hpm-t-0068e8,#0068E8)}.hpm-vp-k.est-o{border-left-color:#d97706}
.hpm-vp-kpi-note{font-size:max(calc(12px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));color:#8b94a3;margin:10px 0 0}
.hpm-vp-rapport{margin-bottom:12px}
.hpm-vp-obj{margin:12px 0 4px}.hpm-vp-obj:first-child{margin-top:0}
.hpm-vp-obj b{display:block;font-size:calc(14px * var(--hpm-fs,1));color:var(--hpm-t-1d2430,#1d2430)}.hpm-vp-obj small{color:#6b7280;font-size:max(calc(12.5px * var(--hpm-fs,1)),var(--hpm-fs-min,0px))}
.hpm-vp-ind{display:grid;grid-template-columns:1fr auto 110px;gap:12px;align-items:center;font-size:calc(13.5px * var(--hpm-fs,1));padding:7px 0;border-bottom:1px solid #f0f2f5}
.hpm-vp-ind .n{font-variant-numeric:tabular-nums;color:var(--hpm-t-39414f,#39414f);white-space:nowrap}
.hpm-vp-ind-bar{height:8px;background:#eef0f4;position:relative}
.hpm-vp-ind-bar i{position:absolute;left:0;top:0;bottom:0;background:#0c8560}.hpm-vp-ind-bar i.est-o{background:#d97706}
.hpm-vp-lignes div{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid #f0f2f5;font-size:calc(13.5px * var(--hpm-fs,1))}
.hpm-vp-lignes span{color:#6b7280}.hpm-vp-lignes b{color:var(--hpm-t-1d2430,#1d2430);font-variant-numeric:tabular-nums;white-space:nowrap}
.hpm-vp-docs{margin-top:12px}
.hpm-vp-docs .hpm-dp{margin:0;border:none;padding:0}
.hpm-vp-docs .hpm-dp>h3{display:none}
.hpm-vp .hpm-vp-grille{grid-template-columns:repeat(3,minmax(0,1fr))}
.hpm-vp .hpm-vp-item{text-align:left;padding:12px 14px;color:var(--hpm-t-39414f,#39414f)}
.hpm-vp .hpm-vp-item b{display:block;font-size:calc(13.5px * var(--hpm-fs,1));color:var(--hpm-t-1d2430,#1d2430)}
.hpm-vp .hpm-vp-item small{display:block;font-size:max(calc(12px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));font-weight:500;color:#8b94a3;margin-top:3px}
.hpm-vp-btn.est-contour{background:#fff;color:var(--hpm-t-5b1aa6,#5b1aa6);border:1px solid var(--hpm-t-8224e3,#8224E3)}
@media (max-width:900px){.hpm-vp-kpi{grid-template-columns:repeat(2,minmax(0,1fr))}.hpm-vp .hpm-vp-grille{grid-template-columns:repeat(2,minmax(0,1fr))}.hpm-vp-ind{grid-template-columns:1fr auto 70px}}

/* ══ 1.4.58 — Maquette annotée par [Kad] (27/09) ═════════════════════════
   Tête : étiquettes, titre violet sans fond, « en bref » en bleu ; places et
   bouton à droite. Colonne de droite : l'espace de travail (ou le bilan).
   Plus de cadre : la ligne WPBakery décide de la bordure et des marges. */
.hpm-vp-v2 .hpm-vp-tete{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-start;padding:0 0 24px;margin-bottom:28px;border-bottom:1px solid #eef0f4}
.hpm-vp-v2 .hpm-vp-tete-g{flex:8 1 380px;min-width:0}
.hpm-vp-v2 .hpm-vp-tete-d{flex:1 1 300px;min-width:0}
.hpm-vp-v2 .hpm-vp-bandeau{background:none;padding:0;border-radius:0;color:var(--hpm-t-1d2430,#1d2430)}
.hpm-vp-v2 .hpm-vp-bandeau h1{color:var(--hpm-t-8224e3,#8224E3) !important;-webkit-text-fill-color:var(--hpm-t-8224e3,#8224E3);font-size:calc(32px * var(--hpm-fs,1));margin:12px 0 10px;background:none}
.hpm-vp-v2 .hpm-vp-chip{background:var(--hpm-t-f7f2fe,#f7f2fe);border:1px solid var(--hpm-t-d9cdf3,#d9cdf3);color:var(--hpm-t-5b1aa6,#5b1aa6);font-weight:700;padding:4px 11px;font-size:max(calc(12px * var(--hpm-fs,1)),var(--hpm-fs-min,0px))}
.hpm-vp-v2 .hpm-vp-chip-archive{background:#f3f4f7;border-color:#e2e5ea;color:#4b5563}
.hpm-vp-bref{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:calc(15px * var(--hpm-fs,1));color:var(--hpm-t-0068e8,#0068E8)}
.hpm-vp-bref span{color:#6b7280}
.hpm-vp-bref b{color:var(--hpm-t-0068e8,#0068E8);font-weight:700}
.hpm-vp-bref.est-2{font-size:calc(13.5px * var(--hpm-fs,1));margin-top:6px}
.hpm-vp-v2 .hpm-vp-tete-d .hpm-vp-carte{padding:14px 16px;margin-bottom:10px;border-width:1px;border-color:#e3e6ee}
.hpm-vp-v2 .hpm-vp-tete-d .hpm-vp-carte h3{margin:0 0 8px}
.hpm-vp-v2 .hpm-vp-tete-d .hpm-vp-carte + .hpm-vp-carte{border:none;padding:0;margin:0}
.hpm-vp-v2 .hpm-vp-tete-d .hpm-vp-chiffre b{font-size:calc(30px * var(--hpm-fs,1))}
.hpm-vp-v2 .hpm-vp-tete-d .hpm-vp-detail{margin-top:6px}
.hpm-vp-v2 .hpm-vp-tete-d .hpm-vp-ruban{margin-top:8px}
.hpm-vp-v2 .hpm-vp-corps{background:none;border:none;border-radius:0;padding:0;gap:28px}
.hpm-vp-v2 .hpm-vp-sec{margin-bottom:30px}
.hpm-vp-accent>h2{color:var(--hpm-t-8224e3,#8224E3) !important}
.hpm-vp-v2 .hpm-vp-droite .hpm-vp-verrou{padding:18px}
.hpm-vp-v2 .hpm-vp-droite .hpm-vp-verrou-tete{color:var(--hpm-t-0068e8,#0068E8)}
.hpm-vp-v2 .hpm-vp-droite .hpm-vp-grille{grid-template-columns:1fr;gap:8px}
.hpm-vp-defile{max-height:70vh;overflow:auto}
@media(max-width:1080px){.hpm-vp-v2 .hpm-vp-bandeau h1{font-size:calc(26px * var(--hpm-fs,1))}}

/* ── La tête de la page publique quand le projet a une photo.
   2.0.0-alpha.67 (Kad, 2/10 : « ne reprend pas la photo du projet »), alpha.68 (« plus grande »), alpha.72 (Kad, 3/10,
   captures annotées : « image pleine largeur » ; les places « en plus petit, horizontalement, après le titre »).
   De haut en bas : le titre et « en bref » ; les places et le bouton sur UNE ligne ; la photo sur toute la largeur
   (520 px de haut au plus, cadrée sans être déformée, angles droits). Sans photo, la tête reste comme avant. */
.hpm-vp-v2 .hpm-vp-tete.a-photo{align-items:flex-start;row-gap:16px}
.hpm-vp-v2 .hpm-vp-tete.a-photo>*{flex:0 0 100%;min-width:0}
.hpm-vp-v2 .hpm-vp-photo{position:relative;width:100%;aspect-ratio:16/9;min-height:240px;max-height:520px;overflow:hidden;background:#eef0f4}
.hpm-vp-v2 .hpm-vp-photo img{position:absolute;top:0;left:0;width:100%!important;height:100%!important;max-width:none;object-fit:cover;object-position:center 30%;display:block;border-radius:0;margin:0}
/* Les places et le bouton, sur une ligne */
.hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;background:#fff;border:1px solid #e3e6ee;padding:10px 16px}
.hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-carte{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;border:0;padding:0;margin:0;background:none}
.hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-carte:first-child{flex:1 1 320px}
.hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-carte + .hpm-vp-carte{flex:0 1 auto;justify-content:flex-end}
.hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-carte h3{margin:0}
.hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-chiffre b{font-size:calc(26px * var(--hpm-fs,1))}
.hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-detail{margin:0}
.hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-ruban{margin:0;padding:5px 11px}
.hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-btn{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:auto;height:44px;margin:0;padding:0 20px;line-height:1.2;white-space:nowrap}
.hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-note{order:-1;margin:0;text-align:right;max-width:240px}
@media (max-width:700px){
  .hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-carte + .hpm-vp-carte{flex:1 1 100%;justify-content:stretch}
  .hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-btn{flex:1 1 100%;text-align:center}
  .hpm-vp-v2 .hpm-vp-tete.a-photo .hpm-vp-tete-d .hpm-vp-note{order:0;text-align:center;max-width:none;flex:1 1 100%}
}

/* ── 2.0.0-alpha.72 — « Description du projet » : le parcours et le texte dans un bloc à fond blanc (Kad, 3/10). */
.hpm-vp-v2 .hpm-vp-desc-cadre{background:#fff;border:1px solid #e3e6ee;padding:22px 26px}
.hpm-vp-v2 .hpm-vp-desc-cadre .hpm-vp-parcours{margin-bottom:20px}
.hpm-vp-v2 .hpm-vp-desc-cadre .hpm-vp-texte>:last-child{margin-bottom:0}
@media (max-width:700px){.hpm-vp-v2 .hpm-vp-desc-cadre{padding:16px}}

/* ── 2.0.0-alpha.72 — « Où en est le projet » : panneaux de couleur pleine, icône en filigrane, comme « En un coup
   d'œil » dans l'espace (Kad, 3/10). Violet, vert, bleu, orange : les couleurs de la charte, texte blanc. */
.hpm-vp-v2 .hpm-vp-k{position:relative;overflow:hidden;border:0;background:var(--hpm-t-8224e3,#8224E3);color:#fff;padding:16px 18px;min-height:104px}
.hpm-vp-v2 .hpm-vp-k.est-v{background:#0c8560}
.hpm-vp-v2 .hpm-vp-k.est-b{background:var(--hpm-t-0068e8,#0068E8)}
.hpm-vp-v2 .hpm-vp-k.est-o{background:#b4501d}
.hpm-vp-v2 .hpm-vp-k b{position:relative;z-index:1;font-size:calc(30px * var(--hpm-fs,1));font-weight:800;line-height:1.1;color:#fff}
.hpm-vp-v2 .hpm-vp-k span{position:relative;z-index:1;font-size:calc(13.5px * var(--hpm-fs,1));font-weight:700;color:#fff;margin-top:6px;max-width:calc(100% - 76px)}
.hpm-vp-v2 .hpm-vp-k-ico{position:absolute;right:-6px;bottom:-8px;width:84px;height:84px;fill:none;stroke:#fff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.22;pointer-events:none}

/* ── 2.0.0-alpha.73 — la description défile dans son cadre quand elle est longue (Kad, 3/10). La hauteur vient du réglage
   « Hauteur du texte avant défilement ». Une ombre, en haut et en bas, dit qu'il reste à lire ; elle disparaît au bout. */
.hpm-vp-v2 .hpm-vp-desc-cadre .hpm-vp-texte{overflow-y:auto;overscroll-behavior:contain;padding-right:12px;
  background:linear-gradient(#fff 50%,rgba(255,255,255,0)) top/100% 36px no-repeat local,linear-gradient(rgba(255,255,255,0),#fff 50%) bottom/100% 36px no-repeat local,
    linear-gradient(rgba(29,36,48,.16),rgba(29,36,48,0)) top/100% 10px no-repeat scroll,linear-gradient(rgba(29,36,48,0),rgba(29,36,48,.16)) bottom/100% 10px no-repeat scroll,#fff}
.hpm-vp-v2 .hpm-vp-desc-cadre .hpm-vp-texte:focus-visible{outline:2px solid var(--hpm-t-8224e3,#8224E3);outline-offset:4px}

/* ── 2.0.0-alpha.74 — le bleu de la charte remplace le turquoise sur la page publique (Kad, 3/10, Écran 83 : « B, en
   bleu » ; « oui, Rejoindre ce projet passe en bleu plein »). Le bouton « Ouvrir l'espace de travail », l'étape en cours
   du parcours, la jauge ; les étapes déjà faites en bleu pâle ; « Rejoindre ce projet » sans dégradé. Le ruban « Le minimum
   est atteint » reste vert : c'est un état, pas une couleur de marque. */
.hpm-vp.hpm-vp-v2{--hpm-vp-turquoise:var(--hpm-t-0068e8,#0068E8)}
.hpm-vp-v2 .hpm-vp-jeton.est-fait{background:var(--hpm-t-e8f1fe,#e8f1fe);color:var(--hpm-t-0050b5,#0050b5);border-color:var(--hpm-t-c5dbfb,#c5dbfb)}
.hpm-vp-v2 .hpm-vp-btn.est-primaire{background:var(--hpm-t-0068e8,#0068E8)}

/* ── 2.0.0-alpha.74 — la zone à contenus de la colonne de droite (Écran 84) : les widgets du site en accordéon. */
.hpm-vp-v2 .hpm-vp-zone{margin-top:26px}
.hpm-vp-v2 .hpm-vp-zone .hpm-guide{margin-bottom:0}
.hpm-vp-v2 .hpm-vp-zone .hpm-guide-corps{padding:12px 18px 16px;overflow-wrap:anywhere}
.hpm-vp-v2 .hpm-vp-zone .hpm-guide-corps>:first-child{margin-top:0}
.hpm-vp-v2 .hpm-vp-zone .hpm-guide-corps>:last-child{margin-bottom:0}
.hpm-vp-v2 .hpm-vp-zone .hpm-guide-corps img{max-width:100%;height:auto}
.hpm-vp-v2 .hpm-vp-zone .hpm-guide-corps a{color:var(--hpm-t-0068e8,#0068E8)}
.hpm-vp-v2 .hpm-vp-zone.est-vide{border:1px dashed #b9c1d0;padding:12px 16px;font-size:calc(13.5px * var(--hpm-fs,1));color:#5b6072;background:#fff}
.hpm-vp-v2 .hpm-vp-zone.est-vide p{margin:0}
.hpm-vp-autres{list-style:none;margin:0;padding:0}
.hpm-vp-autres li{margin:0;padding:0;border-bottom:1px solid #eef0f4}
.hpm-vp-autres li:last-child{border-bottom:0}
.hpm-vp-autres a{display:flex;align-items:center;gap:12px;padding:9px 0;text-decoration:none}
.hpm-vp-autres img,.hpm-vp-autres .sans{flex:none;width:56px;height:42px;object-fit:cover;background:linear-gradient(135deg,var(--hpm-t-d9cdf3,#d9cdf3),var(--hpm-t-b9d2fb,#b9d2fb));border-radius:0}
.hpm-vp-autres .t{min-width:0}
.hpm-vp-autres b{display:block;font-size:calc(14.5px * var(--hpm-fs,1));line-height:1.35;color:var(--hpm-t-0068e8,#0068E8)}
.hpm-vp-autres small{display:block;font-size:max(calc(12.5px * var(--hpm-fs,1)),var(--hpm-fs-min,0px));color:#6b7280}
.hpm-vp-autres a:hover b,.hpm-vp-autres a:focus-visible b{text-decoration:underline}

/* ── 2.0.0-alpha.76 — un projet réservé aux adhérents : la règle à la place du bouton « Rejoindre ». ── */
.hpm-vp-reserve{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--hpm-t-d9c7f5,#d9c7f5);background:var(--hpm-t-f6f0fe,#f6f0fe);color:var(--hpm-t-5b1aa6,#5b1aa6);font-size:calc(14px * var(--hpm-fs,1));font-weight:700}