.c-stats-banner {
	color: var(--color-primary);

	&.c-stats-banner--background-blue,
	&.c-stats-banner--background-grey,
	&.c-stats-banner--background-white,
	&.c-stats-banner--background-yellow {
		padding: var(--spacing-md) 0;
	}

	&.c-stats-banner--background-blue {
		background-color: var(--color-blue);
		color: var(--color-white);
	}

	&.c-stats-banner--background-grey {
		background-color: var(--color-grey-light);
	}

	&.c-stats-banner--background-yellow {
		background-color: var(--color-yellow);
		color: var(--color-white);
	}

	.c-stats-banner__stats {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
		align-items: center;
		gap: var(--spacing-md);
	}

	.c-stats-banner__stat {
		color: inherit;

		@media (width >= 768px) {
			display: grid;
			justify-content: center;
		}
	}

	.c-stats-banner__stat-heading {
		display: block;
		margin-bottom: 8px;
		font-weight: bold;
		line-height: 0.83;

		@media (width >= 1280px) {
			font-size: 60px;
		}
	}

	.c-stats-banner__stat-text {
		text-transform: uppercase;

		@media (width >= 1280px) {
			font-size: 20px;
		}
	}
}
