.c-usp {
	display: flex;
	flex-wrap: wrap;
	margin: space(-1) space(-3);
	list-style: none;
	color: palette(tertiary, 400);
}


.c-usp__item {
	@include font-size(l);
	@include font-weight(bold);
	flex: 1 0 calc(#{column(3,9)} - #{double(space(3))});
	min-width: 200px; // protect squashing the text
	margin: space(1) space(3);
	display: flex;
	align-items: center;

	&::before {
		content: '';
		margin-right: space(3);
		flex: none;
		width: 24px;
		height: 24px;
		background-image: url(/img/icons/check-colored.svg);
	}
}


.c-usp--on-dark {
	.c-usp__item {
		color: palette(primary);

		&::before {
			background-image: url(/img/icons/check-white.svg);
		}
	}
}


.c-usp--alt {
	color: palette(primary, 700);

	&::before {
		background-image: url(/img/icons/check-half-colored.svg);
	}

	.c-usp__item {
		margin-bottom: space(2);
	}
}


.c-usp--vertical {
	flex-direction: column;
}