/* Ligne 125 — sortie de piste (la phrase recomposée) et fin (la troisième phrase et ses détails). */
.recompose { padding: 14svh var(--marge) 8svh; }
.recompose__phrase { font-size: 8.4vw; font-weight: 700; line-height: 1.02; font-stretch: 100%; max-width: 24em; }
.recompose__phrase a { text-decoration: none; background: var(--m-plein) no-repeat 0 .96em / 100% max(4px, .08em); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.recompose__fin { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 28px; }
.recompose__total { font-size: 48px; font-weight: 800; font-stretch: 125%; line-height: 1; }
.recompose__fin .bloc { min-width: 160px; }

.fin { padding: 12svh var(--marge) 6svh; }
.troisieme { font-size: 9vw; font-weight: 700; line-height: 1.08; max-width: 22em; }
.troisieme .champ {
  display: inline; padding: 0; border: 0; color: var(--blanc); font-size: inherit; font-weight: 800; line-height: inherit;
  white-space: normal; cursor: pointer;
}
.detail { margin-top: 40px; }
.lyon {
  font-size: 34vw; font-weight: 800; font-stretch: 116%; line-height: .8; letter-spacing: -.01em;
  --photo-pos: 30% 78%; padding-bottom: .06em;
}
.detail__texte { display: grid; gap: 6px; margin-top: 18px; font-size: 17px; line-height: 1.45; max-width: 30em; }
.legende-nuit { font-size: 15px; font-weight: 500; color: var(--gris); }
.distances { color: var(--gris); }
.detail__grand { font-size: 8vw; font-weight: 700; line-height: 1.05; max-width: 18em; }
.detail__etat { margin-top: 16px; font-size: 17px; color: var(--gris); }
.tel-grand {
  display: inline-flex; align-items: center; min-height: 48px;
  font-size: 12vw; font-weight: 800; font-stretch: 112%; line-height: 1; text-decoration: none;
  background: var(--m-plein) no-repeat 0 .96em / 100% max(4px, .1em);
}
.lignes { margin-top: 32px; }
.lignes svg { width: 100%; height: auto; overflow: visible; }
.lignes text { font-family: "Anek Latin", system-ui, sans-serif; fill: var(--blanc); }
.lignes .l-nom { font-size: 22px; font-weight: 800; font-stretch: 110%; }
.lignes .l-arret { font-size: 17px; font-weight: 500; }
.lignes__liste { display: grid; gap: 22px; }
.lignes__liste h3 { font-size: 22px; font-weight: 800; font-stretch: 110%; }
.lignes__liste ol { position: relative; display: grid; gap: 10px; margin-top: 10px; padding-left: 30px; font-size: 17px; }
.lignes__liste ol::before { content: ""; position: absolute; left: 8px; top: 8px; bottom: 8px; width: 5px; background: var(--blanc); }
.lignes__liste li { position: relative; }
.lignes__liste li::before {
  content: ""; position: absolute; left: -29px; top: .3em; width: 13px; height: 13px; border-radius: 50%;
  background: var(--asphalte); border: 3.5px solid var(--blanc);
}

.pied { padding: 28px var(--marge) 32px; font-size: 13px; line-height: 1.5; color: var(--gris); max-width: 120em; }

@media (min-width: 1024px) {
  .recompose { padding: 4svh var(--marge) 10svh; }
  .recompose__phrase { font-size: min(4.6vw, 8svh); max-width: 22em; }
  .recompose__total { font-size: min(5vw, 8svh); }
  .fin { padding: 14svh var(--marge) 8svh; }
  .troisieme { font-size: 5vw; }
  .detail { margin-top: clamp(32px, 6svh, 72px); }
  #d-rue { display: grid; grid-template-columns: auto minmax(240px, 1fr); align-items: end; column-gap: clamp(24px, 3vw, 56px); }
  #d-rue[hidden] { display: none; }
  .lyon { font-size: min(26vw, 56svh); --photo-pos: 30% 76%; }
  .detail__texte { margin: 0 0 .9em; font-size: 18px; }
  .detail__grand { font-size: 3.6vw; }
  .tel-grand { font-size: 6vw; }
  .lignes { max-width: 1240px; }
}
@media (min-width: 1024px) {
  .lignes__liste { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(24px, 3vw, 56px); }
}
