.werkwijze-module {
	display: flex;
	flex-direction: column;
	gap: var(--so-group-background-padding);
	position: relative;
	z-index: 1;
}
.werkwijze-module-background {
	pointer-events: none;
	will-change: transform;
	position: absolute;
	top: 0;
	z-index: -1;
	left: calc(var(--so-group-background-padding) * -2);
	width: calc(100% + var(--so-group-background-padding) * 4);
	height: 100%;
	max-width: 100dvw
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='none' viewBox='0 0 1920 2022'%3E%3Cg filter='url(%23a)' opacity='.6' style='mix-blend-mode:plus-lighter'%3E%3Cpath fill='url(%23b)' fill-opacity='.9' d='M1002.57 950.742c171.58 113.838 424.24-100.039 238.86 349.038-214.07 518.61-796.371 432.14-967.954 318.31s306.94-651.596 346.601-730.533 210.908-50.647 382.493 63.185'/%3E%3C/g%3E%3Cg filter='url(%23c)' opacity='.8' style='mix-blend-mode:plus-lighter'%3E%3Cpath fill='url(%23d)' fill-opacity='.74' d='M894.215 1228.83c-95.936-63.65-366.158-720.745-312.084-828.367 54.074-107.623 175.681-143.272 271.616-79.626 95.936 63.647 864.333 461.384 810.263 569.007-54.08 107.622-673.86 402.626-769.795 338.986'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='b' x1='2237.49' x2='1104.22' y1='1259.18' y2='1387.31' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23ff8d0b' stop-opacity='0'/%3E%3Cstop offset='.369' stop-color='%23ff8d0b' stop-opacity='.2'/%3E%3Cstop offset='.999' stop-color='%23ff8d0b'/%3E%3C/linearGradient%3E%3ClinearGradient id='d' x1='1086.62' x2='605.378' y1='706.228' y2='933.635' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23ff301d'/%3E%3Cstop offset='.565' stop-color='%239c291e' stop-opacity='.75'/%3E%3Cstop offset='.955' stop-color='%234c1109' stop-opacity='.05'/%3E%3C/linearGradient%3E%3Cfilter id='a' width='1469.98' height='1261.75' x='36.469' y='642.828' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur result='effect1_foregroundBlur_3129_15302' stdDeviation='100'/%3E%3CfeTurbulence baseFrequency='0.5 0.5' numOctaves='3' result='noise' seed='4859' stitchTiles='stitch' type='fractalNoise'/%3E%3CfeColorMatrix in='noise' result='alphaNoise' type='luminanceToAlpha'/%3E%3CfeComponentTransfer in='alphaNoise' result='coloredNoise1'%3E%3CfeFuncA tableValues='1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0' type='discrete'/%3E%3C/feComponentTransfer%3E%3CfeComposite in='coloredNoise1' in2='effect1_foregroundBlur_3129_15302' operator='in' result='noise1Clipped'/%3E%3CfeFlood flood-color='rgba(0, 0, 0, 0.76)' result='color1Flood'/%3E%3CfeComposite in='color1Flood' in2='noise1Clipped' operator='in' result='color1'/%3E%3CfeMerge result='effect2_noise_3129_15302'%3E%3CfeMergeNode in='effect1_foregroundBlur_3129_15302'/%3E%3CfeMergeNode in='color1'/%3E%3C/feMerge%3E%3C/filter%3E%3Cfilter id='c' width='1491.68' height='1348.45' x='375.048' y='89.277' color-interpolation-filters='sRGB' filterUnits='userSpaceOnUse'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur result='effect1_foregroundBlur_3129_15302' stdDeviation='100'/%3E%3CfeTurbulence baseFrequency='0.5 0.5' numOctaves='3' result='noise' seed='4859' stitchTiles='stitch' type='fractalNoise'/%3E%3CfeColorMatrix in='noise' result='alphaNoise' type='luminanceToAlpha'/%3E%3CfeComponentTransfer in='alphaNoise' result='coloredNoise1'%3E%3CfeFuncA tableValues='1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0' type='discrete'/%3E%3C/feComponentTransfer%3E%3CfeComposite in='coloredNoise1' in2='effect1_foregroundBlur_3129_15302' operator='in' result='noise1Clipped'/%3E%3CfeFlood flood-color='rgba(0, 0, 0, 0.76)' result='color1Flood'/%3E%3CfeComposite in='color1Flood' in2='noise1Clipped' operator='in' result='color1'/%3E%3CfeMerge result='effect2_noise_3129_15302'%3E%3CfeMergeNode in='effect1_foregroundBlur_3129_15302'/%3E%3CfeMergeNode in='color1'/%3E%3C/feMerge%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E");
}
.werkwijze-module-header {
	max-width: 420px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;

	.overline {
		margin: 0 0 24px 0;
	}
}

.werkwijze-module-items {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 32px;

	.werkwijze-module-item {
		padding: var(--so-group-background-padding);
		padding: var(--so-group-background-padding);
		border-radius: var(--so-border-radius);
		background: linear-gradient(146deg, #242424 3.97%, #141414 97.58%);
		text-align: center;

		h3 {
			max-width: 290px;
			display: inline-block;
			margin: 0 auto 12px auto;
		}
		p {
			margin: 0;
			max-width: 400px;
		}
		figure {
			margin: 48px auto 0 auto;
			width: 100%;
			max-width: 400px;
			aspect-ratio: 1 / 1;
		}
		img {
			width: 100%;
			height: 100%;
			object-fit: contain;
			opacity: 0;
			transition: opacity 0.2s ease-in-out;
			transition-delay: 0.2s;
		}
	}
}

@media (max-width: 940px) {
	.werkwijze-module-items	.werkwijze-module-item {
		padding: 64px 48px;
	}
}

@media (max-width: 676px) {
	.werkwijze-module-items {
		display: grid;
		grid-template-columns: 1fr;
		gap: 16px;
	}
}

@media (max-width: 480px) {
	.werkwijze-module-items	.werkwijze-module-item {
		padding: 32px 24px;
	}
}