/* Component: steps — numbered sequences ("How ordering works"). */

.mx-steps {
	list-style: none; margin: 0; padding: 0;
	display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: var(--mx-space-6);
}
.mx-steps__item {
	display: flex; flex-direction: column; gap: 10px;
	padding-top: var(--mx-space-6);
	border-top: 2px solid var(--mx-forest);
}
.mx-steps__item--aside { border-top-color: var(--mx-line); }
.mx-steps__num { font-family: var(--mx-font-display); font-size: var(--mx-text-xl); color: var(--mx-leaf); }
.mx-steps__item--aside .mx-steps__num { color: var(--mx-muted); }
.mx-steps__title { font-size: var(--mx-text-lg); font-weight: 600; color: var(--mx-ink); }
.mx-steps__text { font-size: var(--mx-text-md); line-height: var(--mx-leading); color: var(--mx-ink-soft); }