/* =========================================================================
 * Stats Band 001 — Key Facts and Highlights
 *
 * The block's two-column grid, weighted 1.4 : 1. The facts list is the shared
 * component (site.css §3f), here without its hairlines (the band is its own
 * frame). Highlights: a gold check, then the words.
 * ========================================================================= */

.stats-band-001 {
	background: var(--color-surface);
}

.stats-band-001 .stats-band-001__inner {
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	column-gap: 7%;
	align-items: center;
}

.stats-band-001 .house-facts {
	margin: 0;
	padding: 0;
	background: none;
}

.stats-band-001__highlights {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-xs) var(--space-md);
	margin: 0;
	padding: 0;
	list-style: none;
}

.stats-band-001__highlights li {
	display: flex;
	align-items: center;
	gap: var(--space-xs);
	margin: 0;
	font-family: var(--font-display);
	font-size: var(--wp--preset--font-size--lg);
}

.stats-band-001__highlights li::before {
	content: "";
	flex: none;
	width: 20px;
	height: 20px;
	background-color: var(--color-accent);
	-webkit-mask: url("../../assets/masks/check.svg") center / contain no-repeat;
	mask: url("../../assets/masks/check.svg") center / contain no-repeat;
}

@media (max-width: 48rem) {
	.stats-band-001 .stats-band-001__inner {
		grid-template-columns: minmax(0, 1fr);
		row-gap: var(--space-md);
	}
}