/* "Cómo empezar": three numbered steps. */

.steps__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr));
  gap: 24px;
  position: relative;
}

.steps__item {
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative;
}

.steps__marker {
  display: flex;
  align-items: center;
  gap: 14px;
}

.steps__number {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: var(--r-pill);
  background: var(--nx-ink);
  color: var(--nx-white);
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.steps__number--last {
  background: var(--nx-billing);
}

.steps__rule {
  flex: 1;
  height: 1px;
  background: var(--nx-300);
  display: block;
}

.steps__title {
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 600;
}

.steps__text {
  color: var(--nx-600);
  font-size: 15px;
  line-height: 1.6;
}