

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .art-visuel--effectifs .gv-trace--branche { animation-range: cover 10% cover 30%; }
    .art-visuel--effectifs .gv-trace--suite { animation-range: cover 30% cover 50%; }
  }
}

.art-visuel--effectifs .cle__voie { align-items: flex-start; text-wrap: balance; } 
.art-visuel--effectifs .cle__voie.voie--complement::before { margin-top: 3px; }

.art-visuel--effectifs .gv--etroit { max-width: 26rem; margin-inline: auto; }

@media (max-width: 599px) { .art-visuel--effectifs .cle { max-width: 26rem; margin-inline: auto; padding-inline: min(11%, 2.86rem); } }
@media (min-width: 600px) and (max-width: 699px) {
  .art-visuel--effectifs .gv--large { display: block; }
  .art-visuel--effectifs .gv--etroit { display: none; }
}

@media (max-width: 359px) {
  .art-visuel--effectifs .gv--etroit .gv-mot { font-size: 13.4px; }
}

@media print {
  .art-visuel--effectifs .gv-trace { animation: none; stroke-dasharray: none; stroke-dashoffset: 0; }
  
  .art-visuel--effectifs .cle { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}

@media (forced-colors: active) {
  .art-visuel--effectifs .gv-noeud { fill: Canvas; stroke: CanvasText; }
  .art-visuel--effectifs .gv-rond { fill: Canvas; }
  .art-visuel--effectifs .gv-point { stroke: CanvasText; }
  .art-visuel--effectifs .cle__voie.voie--dans::before { background: Canvas; box-shadow: inset 0 0 0 1.5px CanvasText; }
  .art-visuel--effectifs .cle__voie.voie--complement::before { background: CanvasText; box-shadow: none; }
}
