/* Schémas propres au diaporama « Comprendre le projet » (la base est ../comprendre-ruamm/diaporama.css) */
.alerte-diapo.bleue{background:var(--accent-soft);border-left-color:var(--accent)}
.alerte-diapo.bleue .ic{color:var(--accent)}
.alerte-diapo .ic{flex:none}

/* 2 · Deux textes */
.deux-textes{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:16px;align-items:center}
.texte-carte{padding:22px;border-radius:18px;border:1px solid var(--line);background:var(--surface)}
.texte-carte.vif{border-color:var(--accent);box-shadow:0 14px 32px rgba(29,92,236,.12)}
.texte-carte strong{display:block;font-size:18px;margin:6px 0 2px}
.texte-carte>span{font-size:14px;color:var(--muted)}
.texte-carte ul{margin:12px 0 0;padding-left:18px;display:grid;gap:4px;font-size:14px}
.texte-plus{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#fff;font-size:26px;font-weight:800}

/* 3 · Couverture */
.bascule{max-width:440px;margin:0 0 18px}
.formules-avant{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);gap:10px;align-items:center}
.fa{padding:16px;border-radius:14px;border:1px dashed var(--line-strong);background:var(--surface)}
.fa strong{display:block;font-size:15px}
.fa span{font-size:13.5px;color:var(--muted)}
.fa.ou{border:0;padding:0;background:none;font:500 14px var(--mono);color:var(--muted);text-align:center}
.fa.option{background:var(--warn-bg);border-color:#F6C2B2}
.formule-unique{border:2px solid var(--accent);border-radius:18px;padding:18px;background:linear-gradient(180deg,var(--accent-soft),var(--surface) 60%)}
.fu-tete{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 12px;align-items:center;margin-bottom:12px}
.fu-tete .ic{grid-row:span 2;width:34px;height:34px;color:var(--accent)}
.fu-tete strong{font-size:18px}
.fu-tete span{font-size:14px;color:var(--muted)}
.formule-unique ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px}

/* 4 · Escalier des phases */
.escalier{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}
.marche{display:grid;grid-template-rows:220px auto auto;gap:6px}
.marche-bloc{align-self:end;height:var(--h);min-height:70px;border-radius:14px 14px 4px 4px;background:var(--accent);display:grid;place-items:center;color:#fff;transform-origin:bottom;animation:monte .7s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d,0s)}
.marche:nth-child(1) .marche-bloc{background:var(--accent-pale);color:var(--accent-dark)}
.marche:nth-child(3) .marche-bloc{background:var(--orange)}
@keyframes monte{from{transform:scaleY(0)}to{transform:none}}
.marche-bloc b{font-size:clamp(22px,4vw,36px);font-weight:850;letter-spacing:-.04em}
.marche strong{font-size:16px}
.marche span{font-size:13px;color:var(--muted)}

/* 5 · Comparaison par phase */
.formule-actuelle{flex-wrap:wrap}
.formule-actuelle .seg{flex:1 1 140px}
.barres-phases{margin-top:14px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:end;height:240px}
.bp{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px;text-align:center}
.bp-barre{flex:1;width:100%;max-width:120px;display:flex;align-items:flex-end}
.bp-barre i{display:block;width:100%;height:0;border-radius:12px 12px 4px 4px;background:var(--orange);transition:height .5s cubic-bezier(.2,.8,.2,1)}
.bp.actuel .bp-barre i{background:var(--accent)}
.bp b{font-size:18px;font-weight:850;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.bp-nom{font:400 11px var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.bp-ecart{font-size:13px;font-weight:700;color:var(--muted)}
.bp-ecart.hausse{color:#B4441F}
.bp-ecart.baisse{color:#1E7A46}

/* 7 · Délais d'impayé */
.delais{display:grid;gap:12px;padding-left:150px;position:relative}
.echelle-mois{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}
.delai{position:relative}
.delai-nom{position:absolute;left:-150px;top:50%;transform:translateY(-50%);width:140px;font-weight:700;font-size:15px}
.delai-piste{position:relative;height:46px;border-radius:12px;background:#EEF1F7;overflow:hidden}
.delai-piste i{position:absolute;left:0;top:0;bottom:0;border-radius:12px;transform-origin:left;animation:etire 1.4s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--d,0s)}
.delai-piste .court{width:calc(100% / 12);background:var(--orange)}
.delai-piste .long{width:100%;background:var(--accent)}
@keyframes etire{from{transform:scaleX(0)}to{transform:none}}
.delai-piste em{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-style:normal;font-weight:800;color:#fff;font-size:15px;white-space:nowrap}
.delai-piste .court+em{left:calc(100% / 12 + 10px);color:var(--orange)}
.echelle-legende{margin:0;text-align:right;font-size:11px;color:var(--muted)}

/* 8 · Jours d'arrêt */
.rang-arret{flex-wrap:wrap;margin-bottom:16px}
.rang-arret .seg{flex:1 1 120px}
.jours{display:grid;gap:10px}
.ligne-jours{display:grid;grid-template-columns:210px minmax(0,1fr) 54px;gap:12px;align-items:center}
.lj-nom strong{display:block;font-size:15px}
.lj-nom span{font-size:12.5px;color:var(--muted)}
.lj-cases{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px}
.lj-cases i{height:36px;border-radius:8px;display:grid;place-items:center;font:500 12px var(--mono);font-style:normal;transition:background .3s;transition-delay:calc(var(--k) * 30ms)}
.j-carence{background:#EEF1F7;color:var(--muted)}
.j-paye{background:var(--accent);color:#fff}
.lj-debut{font-size:20px;font-weight:850;color:var(--accent);text-align:right}
.legende-jours{display:flex;gap:18px;justify-content:flex-end;margin-top:8px;font-size:13px;color:var(--muted)}
.legende-jours span{display:flex;gap:6px;align-items:center}
.legende-jours i{width:14px;height:14px;border-radius:4px}
.tampon-diapo.arbitrer{left:auto;bottom:auto;right:36px;top:36px;transform:rotate(8deg);animation-name:tampon-droit}
@keyframes tampon-droit{from{opacity:0;transform:rotate(8deg) scale(2.2)}to{opacity:.95;transform:rotate(8deg) scale(1)}}

/* 9 · Avant / après */
.avant-apres-cartes{display:grid;gap:14px}
.aac{padding:18px 20px;border-radius:16px;border:1px solid var(--line);background:var(--surface)}
.aac strong{display:block;font-size:17px;margin-bottom:10px}
.aac-ligne{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:12px;align-items:center}
.aac-avant,.aac-apres{padding:12px 14px;border-radius:12px;font-size:14.5px}
.aac-avant{background:#EEF1F7;color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(86,97,120,.5)}
.aac-apres{background:var(--accent-soft);color:var(--accent-dark);font-weight:600}
.aac-apres:not(.change){background:#F4F6FA;color:var(--fg)}
.aac-avant:has(+ .aac-fleche + .aac-apres:not(.change)){text-decoration:none}
.aac-fleche{color:var(--accent)}

/* 10 · Salariés */
.statut-sal{max-width:620px;margin:0 0 6px}
.tableau-sal td,.tableau-sal th{text-align:right}
.tableau-sal td:first-child,.tableau-sal th:first-child{text-align:left;padding:10px}
.tableau-sal td.hausse{color:#B4441F}
.tableau-sal td.baisse{color:#1E7A46}

/* 11 · Statut des mesures */
.statut-mesure{margin-top:auto;font:400 11px var(--mono);font-style:normal;letter-spacing:.05em;text-transform:uppercase;color:var(--accent)}
.mode.statut-renvoi{background:#F4F6FA}
.mode.statut-renvoi .statut-mesure{color:var(--muted)}
.mode.statut-retire{background:#F4F6FA;border-style:dashed}
.mode.statut-retire .statut-mesure{color:#1E7A46}

@media (max-width:1100px){
  .formules-avant{grid-template-columns:minmax(0,1fr)}
  .fa.ou{padding:0}
}
@media (max-width:760px){
  .deux-textes{grid-template-columns:minmax(0,1fr)}
  .texte-plus{margin:0 auto}
  .escalier{gap:8px}
  .marche{grid-template-rows:160px auto}
  .marche span{display:none}
  .barres-phases{height:200px;gap:6px}
  .bp b{font-size:13px}
  .delais{padding-left:0}
  .delai-nom{position:static;transform:none;display:block;margin-bottom:4px;width:auto}
  .ligne-jours{grid-template-columns:minmax(0,1fr) 44px}
  .lj-nom{grid-column:1 / -1}
  .lj-cases{gap:2px}
  .lj-cases i{height:28px;font-size:10px;border-radius:5px}
  .aac-ligne{grid-template-columns:minmax(0,1fr)}
  .aac-fleche{transform:rotate(90deg);justify-self:center}
  .tampon-diapo.arbitrer{right:12px;top:12px;font-size:13px}
}
@media (prefers-reduced-motion:reduce){
  .marche-bloc,.delai-piste i{animation:none !important}
}

/* Dernière diapositive : deux choix seulement */
@media (min-width:761px){.fin.deux-choix{grid-template-columns:repeat(2,minmax(0,1fr))}}
