/* Numbered list (patterns/kit-numbered.php). Numbers come from CSS, so they follow the order. */
.sp-kit-numbered .sp-kit-numbered__grid { display: grid; gap: 40px; }
@media (min-width: 1024px) {
	.sp-kit-numbered .sp-kit-numbered__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 80px; }
	.sp-kit-numbered .sp-kit-numbered__heading { position: sticky; top: 120px; align-self: start; }
}
.sp-kit-numbered .sp-kit-numbered__list { counter-reset: sp-num; border-top: 1px solid var(--kit-line); }
.sp-kit-numbered .sp-kit-numbered__item {
	counter-increment: sp-num;
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	column-gap: 16px;
	padding-block: 28px;
	border-bottom: 1px solid var(--kit-line);
}
@media (min-width: 1024px) {
	.sp-kit-numbered .sp-kit-numbered__item { grid-template-columns: 88px minmax(0, 1fr); padding-block: 36px; }
}
.sp-kit-numbered .sp-kit-numbered__item::before {
	content: counter(sp-num, decimal-leading-zero);
	grid-row: span 2;
	font-size: var(--wp--preset--font-size--x-large);
	line-height: 1.3;
	font-weight: 600;
	color: var(--kit-accent);
}
.sp-kit-numbered:not(.is-style-sp-yellow):not(.is-style-sp-blue) .sp-kit-numbered__item::before { color: var(--wp--preset--color--primary-dark); }
.sp-kit-numbered .sp-kit-numbered__title { font-size: var(--wp--preset--font-size--x-large); line-height: 1.3; font-weight: 500; letter-spacing: -0.025em; }
.sp-kit-numbered .sp-kit-numbered__text { margin-top: 8px; font-family: var(--wp--preset--font-family--poppins); font-size: var(--wp--preset--font-size--small); line-height: 1.625; color: var(--kit-text); }