.steps-horizontal-container {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 35px;
}

/* Línea que conecta los pasos */
/* .steps-horizontal-container::before {
  content: "";
  position: absolute;
  left: 24px;
  top: 25px;
  bottom: 25px;
  width: 2px;
  background: #f30f0f;
  opacity: 0.25;
} */

/* Cada paso */
.step-horizontal {
  position: relative;
  z-index: 1;
}

/* Efecto escalonado */
.step-horizontal:nth-child(1) {
  margin-left: 0;
}

.step-horizontal:nth-child(2) {
  margin-left: 35px;
}

.step-horizontal:nth-child(3) {
  margin-left: 70px;
}

.step-horizontal:nth-child(4) {
  margin-left: 105px;
}

.step-horizontal:nth-child(5) {
  margin-left: 140px;
}

/* Contenido */
.steps-horizontal-content {
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: transform 0.3s ease;
}

/* Número */
.step-horizontal-number {
  flex-shrink: 0;
  transition: all 0.3s ease;
}
.step-horizontal:hover .step-horizontal-number {
  box-shadow: 0 0 0 6px rgba(200, 224, 255, 0.4);
}

/* Descripción */
.step-horizontal-description {
  margin-left: 60px;
  max-width: 500px;
  opacity: 0.8;
}

/* Conectores */
.step-horizontal:not(:last-child)::after {
  content: "";
  position: absolute;

  /* Empieza justo debajo del número */
  left: 20px;
  top: 38px;

  /* Baja y después avanza hacia el siguiente paso */
  width: 35px;
  height: 85px;

  border-left: 2px solid #c8e0ff;
  border-bottom: 2px solid #c8e0ff;

  /* Redondea las esquinas */
  border-bottom-left-radius: 10px;
}