.analytical-workflow .timeline {
  display: grid;
  gap: 52px;
  padding: 30px 0 0;
  list-style: none;
  counter-reset: step;
}

.analytical-workflow .timeline li {
  position: relative;
  min-height: 128px;
  margin: 0;
  padding: 24px 150px 24px 60px;
  border-radius: 34px;
  background: #f1f8ff;
  counter-increment: step;
}

.analytical-workflow .timeline li::before {
  content: counter(step);
  top: -29px;
  left: 0;
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  border: 3px solid #7297d5;
  border-radius: 50%;
  background: #fff;
  color: #c58cc2;
  font: 700 1.3rem/1 Montserrat, sans-serif;
}

.analytical-workflow .timeline li::after {
  position: absolute;
  top: 50%;
  right: 28px;
  width: 100px;
  height: 100px;
  background: center / contain no-repeat;
  content: "";
  transform: translateY(-50%);
}

.analytical-workflow .timeline li:nth-child(1)::after { background-image: url("img/icone/1w-estrazione-dna.png"); }
.analytical-workflow .timeline li:nth-child(2)::after { background-image: url("img/icone/2w-amplificazione.png"); }
.analytical-workflow .timeline li:nth-child(3)::after { background-image: url("img/icone/3w-sequenziamento.png"); }
.analytical-workflow .timeline li:nth-child(4)::after { background-image: url("img/icone/4w-analisi-bioinformatica.png"); }
.analytical-workflow .timeline li:nth-child(5)::after { background-image: url("img/icone/5w-interpretazione.png"); }
.analytical-workflow .timeline li:nth-child(6)::after { background-image: url("img/icone/6w-referto.png"); }

.analytical-workflow .timeline li > strong:first-child {
  display: inline-block;
  margin-bottom: 8px;
  color: var(--navy);
  font: 800 clamp(1.18rem, 1.7vw, 1.45rem)/1.2 Montserrat, sans-serif;
}

@media (max-width: 760px) {
  .analytical-workflow .timeline {
    gap: 34px;
    padding-top: 22px;
  }

  .analytical-workflow .timeline li {
    min-height: 220px;
    padding: 168px 24px 22px 60px;
    border-radius: 24px;
  }

  .analytical-workflow .timeline li::before {
    top: -22px;
    width: 46px;
    height: 46px;
    border-width: 2px;
    font-size: 1.1rem;
  }

  .analytical-workflow .timeline li::after {
    top: 18px;
    right: auto;
    left: 50%;
    width: 128px;
    height: 128px;
    transform: translateX(-50%);
  }

  .analytical-workflow .timeline li > strong:first-child {
    font-size: 1.08rem;
  }
}