/* Sezione "ScoutHub nel tuo gruppo, in tre passi": tre card numerate e un pulsante. */

.steps {
  padding-top: 24px;
  padding-bottom: 72px;
  background: #fff;
}
.steps__grid { margin: 32px 0 0; padding: 0; list-style: none; display: grid; gap: 16px; }
.steps .card { padding: 28px 24px; }

.step__head { display: flex; align-items: center; gap: 14px; }
.step__num {
  flex: none;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--color-purple-100);
  font-family: var(--font-heading);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-purple);
}
.steps .card__title { font-size: 1.375rem; }
.steps .card__text { margin: 14px 0 0; }

.steps__cta { display: flex; justify-content: center; margin-top: 32px; }

@media (min-width: 900px) {
  .steps { padding-top: 48px; padding-bottom: 104px; }
  .steps__grid { grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 48px; }
  .steps .card { padding: 36px 32px 40px; border-radius: 28px; }
  .steps__cta { margin-top: 40px; }
}