/* =========================================================================
   Process Steps V2 — all rules scoped under .dev-steps-block-v2.
   Per-block CSS (loaded via enqueue_assets only when the block is present).
   "How we work" — centered header + grid of numbered step cards.
   Tokens: green #028d40, graphite #343a40, muted #777, border #e6e6e6.
   Section surface is the alt surface (#f7f9fb) framed by top/bottom borders.
   ========================================================================= */
.dev-steps-block-v2 { background: #f7f9fb; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; }
.dev-steps-block-v2 .dsbv2-container { padding-top: 80px; padding-bottom: 80px; }

/* Header (centered) */
.dev-steps-block-v2 .dsbv2-head { text-align: center; max-width: 680px; margin: 0 auto 50px; }
.dev-steps-block-v2 .dsbv2-eyebrow { display: inline-block; color: #028d40; font-size: 12px;
	font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: 12px; }
.dev-steps-block-v2 .dsbv2-title { font-family: Rubik, sans-serif; font-size: 32px; line-height: 1.2;
	font-weight: 500; color: #343a40; margin: 0; }

/* Grid: 4 columns */
.dev-steps-block-v2 .dsbv2-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px;
	list-style: none; margin: 0; padding: 0; max-width: 1140px; margin-left: auto; margin-right: auto;
	counter-reset: none; }

/* Step card */
.dev-steps-block-v2 .dsbv2-card { position: relative; background: #fff; border: 1px solid #e6e6e6;
	border-radius: .25rem; padding: 26px 22px; }
.dev-steps-block-v2 .dsbv2-num { font-family: Rubik, sans-serif; font-size: 40px; font-weight: 500;
	line-height: 1; color: #d2d7db; }
.dev-steps-block-v2 .dsbv2-card__title { font-size: 18px; font-weight: 500; color: #343a40;
	margin: 12px 0 8px; text-transform: none; }
.dev-steps-block-v2 .dsbv2-card__desc { font-size: 14.5px; line-height: 1.6; color: #777; margin: 0; }

/* Responsive — 2 columns at the theme lg breakpoint, single column on phones */
@media (max-width: 991.98px) {
	.dev-steps-block-v2 .dsbv2-container { padding-top: 56px; padding-bottom: 56px; }
	.dev-steps-block-v2 .dsbv2-head { margin-bottom: 36px; }
	.dev-steps-block-v2 .dsbv2-title { font-size: 28px; }
	.dev-steps-block-v2 .dsbv2-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; max-width: 620px; }
}
@media (max-width: 575.98px) {
	.dev-steps-block-v2 .dsbv2-title { font-size: 24px; }
	.dev-steps-block-v2 .dsbv2-grid { grid-template-columns: 1fr; max-width: 420px; }
	.dev-steps-block-v2 .dsbv2-card { padding: 22px 20px; }
}