/* CLA hero colour selector. Other site variants never receive this class. */
.flex-layout[data-hero].cla-hero-background {
	background: var(--cla-hero-background) !important;
}

/* The primary CLA hero keeps its image; only its colour overlay changes. */
.flex-layout.hero_primary_cla.cla-hero-background::after {
	background: linear-gradient(180deg, transparent 17%, var(--cla-hero-background) 116%) !important;
}

/* Lichte hero ("Wit" = primary-5): donkere tekst, ook waar een layout wit vastzet. */
body.site-3 .flex-layout.cla-hero-light {
	--text-color: var(--primary-100);
	--hero-line: var(--primary-10);
}

body.site-3 .flex-layout.cla-hero-light :is(.pk-heading, .pk-text):not(:is(.contact-card, .hero-image) *) {
	color: var(--primary-100);
}

/* Lichte hero: witte knopvarianten worden blauw, anders zijn ze onzichtbaar op de lichte achtergrond. */
body.site-3 .flex-layout.cla-hero-light .pk-button.secondary.white {
	background-color: transparent;
	outline-color: var(--primary-40);
	color: var(--primary-100);
}

body.site-3 .flex-layout.cla-hero-light .pk-button.tertiary.white {
	color: var(--primary-100);
}

body.site-3 .flex-layout.cla-hero-light .pk-button.tertiary.white .pk-button-icon {
	outline-color: var(--primary-20);
}

body.site-3 .flex-layout.cla-hero-light .nova-cursor {
	--cursor-line: var(--accent-100);
	--cursor-dot: var(--accent-100);
	--cursor-text: var(--accent-100);
}

/* CLA: geen gradient, watermark of shape in de heroes. hero_primary_cla is uitgezonderd: die gebruikt .hero-background voor zijn foto. */
body.site-3 .flex-layout[data-hero]:not(.hero_primary_cla) {
	--hero-gradient: none !important;
}

body.site-3 .flex-layout[data-hero]:not(.hero_primary_cla) > .hero-gradient,
body.site-3 .flex-layout[data-hero]:not(.hero_primary_cla) .watermark,
body.site-3 .flex-layout[data-hero]:not(.hero_primary_cla) .hero-background,
body.site-3 .flex-layout[data-hero]:not(.hero_primary_cla) .background-shape,
body.site-3 .flex-layout[data-hero].hero_tertiary::before,
body.site-3 .flex-layout[data-hero].hero_tertiary_small::before {
	display: none !important;
}

/* CLA: geen Nova-cursor. Het anker (.cursor-anchor) blijft staan: het is leeg en z'n marges bepalen de ruimte rond de kop. */
body.site-3 .nova-cursor {
	display: none !important;
}