/**
 * Ondersteunende CSS voor bg-lines.js.
 *
 * BELANGRIJK: overflow:hidden staat hier BEWUST op .js-bg-lines-clip
 * (het nieuwe, eigen tussenlaagje), NIET op .js-bg-lines zelf. Reden:
 * hetzelfde blok bevat vaak ook een foto die bewust een stukje buiten
 * het blok "uit mag vliegen" — overflow:hidden op het hele blok zou
 * die foto dan ook afkappen. Dit tussenlaagje is exact even groot als
 * .js-bg-lines zelf (position:absolute; inset:0), en clipt daardoor
 * alleen de (opzettelijk oversized) lijnen-SVG netjes op de rand van
 * het blok — de rest van de content in .js-bg-lines blijft vrij om te
 * overlopen.
 *
 * Een <svg>-element behoudt standaard zijn eigen beeldverhouding
 * (preserveAspectRatio, staat standaard aan), ook al wijken de CSS-
 * breedte/hoogte-percentages af van de daadwerkelijke verhouding van de
 * container — geen vervormings-risico zoals bij een CSS
 * background-image met afwijkende width/height-percentages.
 */
.js-bg-lines {
	position: relative;
	/* BEWUST GEEN overflow:hidden hier — zie toelichting hierboven. */
}

.js-bg-lines-clip {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
}

.js-bg-lines-svg {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 130%;
	height: 130%;
	transform: translate(-50%, -50%);
	pointer-events: none;
}