/* ── LES FIGURES DU CAS HMS ──────────────────────────────────────────
   Quatre figures, une feuille. Les compteurs de la recherche reprennent
   la grammaire fgsr (fig-sp-recherche.css, chargée avec celle-ci).

   hmm- : le marché, deux plaques face à face.
   hmd- : la frise du mandat, quinze jours puis seize mois.
   hmr- : l'enseignement de la recherche, sous les compteurs.
   hmp- : les paires rupture → décision du pivot. */

/* ── LE MARCHÉ ── */
.hmm{ display:flex; flex-direction:column; gap:1.4cqw;
  padding:1.8cqw 1.7cqw 1.9cqw; }
.hmm-h{ display:flex; flex-direction:column; gap:.5cqw; }
.hmm-h s{ text-decoration:none; font-size:1.12cqw; font-weight:600;
  letter-spacing:.09em; text-transform:uppercase; color:var(--fg-mate); }
.hmm-h b{ font-family:var(--display); font-size:1.9cqw; font-weight:700;
  line-height:1.2; color:var(--fg-encre); }
.hmm--rival .hmm-h b{ color:var(--fg-accent); }
.hmm-l{ margin:0; padding:1.1cqw 0 0; list-style:none;
  display:flex; flex-direction:column; gap:.75cqw;
  border-top:1px solid var(--fg-ligne); }
.hmm-l li{ position:relative; padding-left:1.9cqw;
  font-size:1.35cqw; font-weight:500; line-height:1.4; color:var(--fg-encre); }
.hmm-l li::before{ position:absolute; left:0; top:0;
  font-weight:700; font-size:1.35cqw; line-height:1.4; }
.hmm-plus::before{ content:"+"; color:var(--fg-accent); }
.hmm-moins{ color:var(--fg-mate); }
.hmm-moins::before{ content:"−"; color:var(--fg-rouge); }

/* ── LA FRISE DU MANDAT ──
   Deux segments sur une même ligne de temps : le court est éteint,
   le long est cuivre. La disproportion EST la figure. */
.hmd{ padding:.5cqw 0 0; }
.hmd-frise{ display:grid; grid-template-columns:12% 88%; gap:0;
  align-items:start; }
.hmd-seg{ position:relative; padding-top:2.2cqw; }
.hmd-seg i{ position:absolute; left:0; right:.5cqw; top:.55cqw;
  height:.42cqw; border-radius:.24cqw; display:block; }
.hmd-seg--court i{ background:var(--fg-plaque-2);
  outline:1px solid var(--fg-ligne); outline-offset:-1px; }
.hmd-seg--long i{ background:var(--fg-accent); opacity:.92; right:0; }
.hmd-seg b{ display:block; font-size:1.4cqw; font-weight:700;
  line-height:1.3; color:var(--fg-encre); }
.hmd-seg--court b{ color:var(--fg-mate); }
.hmd-seg span{ display:block; margin-top:.35cqw; font-size:1.12cqw;
  font-weight:500; line-height:1.4; color:var(--fg-mate);
  padding-right:1.6cqw; }
.hmd-jalons{ margin:1.7cqw 0 0; padding:0; list-style:none;
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1.2cqw; }
.hmd-jalons li{ position:relative; padding-top:1.5cqw; }
.hmd-jalons em{ position:absolute; left:0; top:0; display:block;
  width:1.05cqw; height:1.05cqw; border-radius:50%;
  background:var(--fg-plaque); border:.24cqw solid var(--fg-accent);
  font-style:normal; }
.hmd-jalons u{ text-decoration:none; font-size:1.08cqw; font-weight:600;
  line-height:1.35; color:var(--fg-encre); display:block; }
.hmd-jalon--fin em{ background:var(--fg-accent); }
.hmd-jalon--fin u{ color:var(--fg-accent); font-weight:700; }

/* ── L'ENSEIGNEMENT DE LA RECHERCHE ── */
.hmr-ins{ display:flex; flex-direction:column; gap:1.3cqw;
  padding:1.8cqw 1.8cqw 1.9cqw; }
.hmr-z{ margin:0; font-family:var(--display); font-size:2.2cqw;
  font-weight:700; line-height:1.25; color:var(--fg-encre); }
.hmr-poids{ margin:0; padding:1.2cqw 0 0; list-style:none;
  display:flex; flex-wrap:wrap; gap:.7cqw;
  border-top:1px solid var(--fg-ligne); }
.hmr-poids li{ padding:.5cqw 1cqw; border-radius:99cqw;
  background:var(--fg-plaque-2);
  outline:1px solid var(--fg-ligne); outline-offset:-1px;
  font-size:1.12cqw; font-weight:600; color:var(--fg-mate);
  white-space:nowrap; }

/* ── LES PAIRES RUPTURE → DÉCISION ── */
.hmp{ display:grid; grid-template-columns:1fr auto 1.15fr;
  align-items:center; gap:1.6cqw; }
.hmp-avant, .hmp-apres{ margin:0; padding:1.35cqw 1.5cqw;
  border-radius:.7cqw; font-size:1.38cqw; font-weight:600;
  line-height:1.4; }
.hmp-avant{ background:var(--fg-plaque-2); color:var(--fg-mate);
  outline:1px solid var(--fg-ligne); outline-offset:-1px; }
.hmp-apres{ background:var(--fg-plaque); color:var(--fg-encre);
  outline:1px solid var(--fg-ligne); outline-offset:-1px;
  box-shadow:var(--fg-om);
  border-left:.4cqw solid var(--fg-accent); }
.hmp-apres em{ display:block; margin-top:.35cqw; font-style:normal;
  font-size:1.05cqw; font-weight:600; letter-spacing:.08em;
  text-transform:uppercase; color:var(--fg-accent); }
.hmp-fl{ position:relative; width:2.6cqw; height:.28cqw;
  background:var(--fg-accent); opacity:.9; border-radius:.2cqw; }
.hmp-fl::after{ content:""; position:absolute; right:-.15cqw; top:50%;
  width:.85cqw; height:.85cqw; transform:translateY(-50%) rotate(45deg);
  border-top:.28cqw solid var(--fg-accent);
  border-right:.28cqw solid var(--fg-accent);
  border-radius:.12cqw; }

@container (max-width:560px){
  .hmm-h b{ font-size:3.4cqw; } .hmm-h s{ font-size:2.2cqw; }
  .hmm-l li{ font-size:2.6cqw; padding-left:3.4cqw; }
  .hmm-l li::before{ font-size:2.6cqw; }
  .hmd-frise{ grid-template-columns:1fr; gap:2.6cqw; }
  .hmd-seg b{ font-size:2.8cqw; } .hmd-seg span{ font-size:2.3cqw; }
  .hmd-jalons{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:2cqw; }
  .hmd-jalons u{ font-size:2.2cqw; }
  .hmr-z{ font-size:3.6cqw; }
  .hmr-poids li{ font-size:2.3cqw; white-space:normal; }
  .hmp{ grid-template-columns:1fr; gap:1.2cqw; }
  .hmp-fl{ width:.28cqw; height:2.2cqw; margin-left:2.4cqw; }
  .hmp-fl::after{ right:50%; top:auto; bottom:-.15cqw;
    transform:translateX(50%) rotate(135deg); }
  .hmp-avant,.hmp-apres{ font-size:2.7cqw; padding:2.4cqw 2.6cqw; }
  .hmp-apres em{ font-size:2.1cqw; }
}