/* ============================================================
   AUTOMATISATION POUR LES PME
   Deux barres qui se dessinent à l'entrée dans l'écran.
   Les chiffres, eux, sont lisibles immédiatement : seule la
   barre se trace, et uniquement par scaleX.
   ============================================================ */

.autom{ display:grid; gap:var(--e-10) }
@media (min-width:900px){
  .autom{ grid-template-columns:minmax(0,1fr) minmax(0,1.15fr); gap:var(--e-16) }
}

.autom__liste{ display:flex; flex-direction:column; gap:0 }
.autom__item{
  display:flex; flex-direction:column; gap:var(--e-2);
  padding-block:var(--e-5);
  border-block-start:var(--trait) solid var(--rule);
}
.autom__item:first-child{ border-block-start:0; padding-block-start:0 }
.autom__quoi{
  font-family:var(--font-titre);
  font-weight:var(--fw-gras);
  font-size:var(--fs-h3);
  letter-spacing:var(--ls-titre);
}
.autom__detail{ font-size:var(--fs-small); color:var(--ink-2) }

/* ---------- Le comparatif ---------- */
.delai{
  display:flex; flex-direction:column; gap:var(--e-6);
  padding:var(--e-6);
  background:var(--bg-leve);
  border:var(--trait) solid var(--rule);
  border-radius:var(--r-3);
  align-self:start;
}
.delai__tete{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:var(--e-4); flex-wrap:wrap;
}
.delai__titre{
  font-family:var(--font-mono);
  font-size:var(--fs-nano);
  letter-spacing:var(--ls-caps);
  text-transform:uppercase;
  color:var(--ink-3);
}

.mesure-ligne{ display:flex; flex-direction:column; gap:var(--e-3) }
.mesure-ligne__haut{
  display:flex; align-items:baseline; justify-content:space-between;
  gap:var(--e-3);
}
.mesure-ligne__nom{ font-size:var(--fs-small); color:var(--ink-2) }
.mesure-ligne__val{
  font-family:var(--font-titre);
  font-weight:var(--fw-gras);
  font-size:var(--fs-h3);
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
.mesure-ligne__piste{
  block-size:10px;
  background:var(--bg-creux);
  border:var(--trait) solid var(--rule);
  border-radius:var(--r-rond);
  overflow:hidden;
}
.mesure-ligne__trait{
  block-size:100%;
  background:var(--ink-3);
  transform-origin:left center;
  transform:scaleX(0);
  transition:transform var(--t-entree) var(--courbe);
  transition-delay:var(--d, 0ms);
}
/* La barre ne se dessine qu'une fois la section à l'écran. */
.delai.est-la .mesure-ligne__trait{ transform:scaleX(var(--part, 0)) }
.mesure-ligne--apres .mesure-ligne__trait{ background:var(--ink) }

.delai__note{
  display:flex; align-items:center; gap:var(--e-3);
  flex-wrap:wrap;
  padding-block-start:var(--e-4);
  border-block-start:var(--trait) solid var(--rule);
  font-size:var(--fs-nano);
  color:var(--ink-3);
  max-width:var(--mesure-court);
}