/* =pairs with */
.block-pairs-with {
	position: relative;
	border-radius: 12px;
	background-image: url(../../../assets/icons/accents/sprinkles-blue-opacity-20.svg); /* =pattern */
	background-size: 250px;
	background-repeat: repeat;
	background-blend-mode: multiply;
}

.block-pairs-with > *:last-child {
	margin-bottom: 0;
}

.block-pairs-with h1,
.block-pairs-with h2,
.block-pairs-with h3,
.block-pairs-with h4,
.block-pairs-with h5,
.block-pairs-with h6 {
	font-size: var(--wp--preset--font-size--huge);
	line-height: var(--wp--custom--line-height--tiny);
}

.block-pairs-with p {
	margin-top: 0;
}

.block-pairs-with p a,
.block-pairs-with ul a,
.block-pairs-with ol a {
	color: white;
	box-shadow: inset 0 -4px 0 0 rgba( 255, 255, 255, .35); /* =highlight */
}

.block-pairs-with p a:hover,
.block-pairs-with ul a:hover,
.block-pairs-with ol a:hover {
	box-shadow: inset 0 -8px 0 0 rgba( 255, 255, 255, .35);
}

div.block-pairs-with ul li::marker {
	color: white !important;
}

.block-pairs-with .block-pairs-with__icon {
	position: absolute;
	width: 48px;
	height: 48px;
}

.block-pairs-with .block-pairs-with__icon .highlight {
	fill: var(--wp--preset--color--quaternary);
}

@media only screen and (max-width: 767px) {
	.block-pairs-with {
		padding: 36px 10px 24px 12px;
	}

	.block-pairs-with .block-pairs-with__icon {
		top: -20px;
		left: 16px;
	}

	.block-pairs-with h1,
	.block-pairs-with h2,
	.block-pairs-with h3,
	.block-pairs-with h4,
	.block-pairs-with h5,
	.block-pairs-with h6 {
		margin-bottom: 8px;
	}

}

@media only screen and (min-width: 768px) {
	.block-pairs-with {
		padding: 22px 33px 32px 47px;
	}

	.block-pairs-with .block-pairs-with__icon {
		top: 20px;
		left: -29px;
		width: 60px;
		height: 60px;
	}

}