/*
 * Basis. Tokens, lettertype en de schil: menu, content, footer.
 * Kleuren per entiteit via body.site-theme-* (inc/site-theme.php).
 * Bron: Astare Design v6. Ontbrekende tinten staan hier niet.
 */

@font-face {
	font-family: "Euclid Circular B";
	src: url("../fonts/EuclidCircularB-Regular-WebS.woff2") format("woff2");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Euclid Circular B";
	src: url("../fonts/EuclidCircularB-Regular-WebS.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Euclid Circular B";
	src: url("../fonts/EuclidCircularB-Medium-WebS.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Euclid Circular B";
	src: url("../fonts/EuclidCircularB-Semibold-WebS.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "Museo Slab";
	src: url("../fonts/Museo_Slab_300-webfont.woff2") format("woff2");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

:root {
	--color-white: #ffffff;
	--color-offwhite: #fffefc;
	--color-bg: #f7f3ed;
	--color-line: #c9b9aa;
	--color-text: #352f2a;
	--color-brown: #42210b;

	--color-brand-2: var(--color-line);
	--color-brand-3: var(--color-text);
	--color-brand-4: var(--color-text);
	--color-brand-5: var(--color-text);
	--color-brand: var(--color-text);

	--font-sans: "Euclid Circular B", "Segoe UI", sans-serif;

	--text-h1-size: 100px;
	--text-h1-line: 1;
	--text-h1-weight: 300;
	--text-h1-tracking: -2px;

	--text-h2-size: 70px;
	--text-h2-line: 1;
	--text-h2-weight: 400;
	--text-h2-tracking: -2px;

	--text-h3-size: 40px;
	--text-h3-line: 50px;
	--text-h3-weight: 500;
	--text-h3-tracking: -2px;

	--text-h4-size: 32px;
	--text-h4-line: 44px;
	--text-h4-weight: 400;
	--text-h4-tracking: -1px;

	--text-h5-size: 22px;
	--text-h5-line: 32px;
	--text-h5-weight: 400;
	--text-h5-tracking: 0;

	--text-h6-size: 18px;
	--text-h6-line: 28px;
	--text-h6-weight: 300;
	--text-h6-tracking: 0;

	--container: 1340px;
	--gutter: 50px;
	--header-height: 100px;
	--radius: 15px;

	--space-1: 8px;
	--space-2: 16px;
	--space-3: 24px;
	--space-4: 32px;
	--space-5: 48px;
	--space-6: 80px;

	/* Ruimte rond een contentblok, zoals tekst en carrousel. */
	--space-block: 173px;
	/* Padding van een volle band, zoals de nieuwsbrief. */
	--space-band: 64px;
}

/*
 * Navigatie: --nav-color is de kleur van logo en menu op een gewone pagina.
 * --nav-color-hero is de kleur zodra de navigatie over een hero ligt (later).
 * Footer: --footer-bg is de vlakkleur, --footer-meta de onderste regel.
 * Op body, zodat ze de merkkleuren van .site-theme-* meekrijgen.
 */
body {
	--nav-color: var(--color-text);
	--nav-color-hero: var(--color-text);
	--menu-link: var(--color-brand-3);
	--menu-link-current: var(--color-brand-4);
	--footer-bg: var(--color-brand-4);
	--footer-meta: var(--color-brand-2);
}

.site-theme-astare {
	--color-brand-2: #89a5af;
	--color-brand-3: #4a8c9e;
	--color-brand-4: #145263;
	--color-brand-5: #233444;
	--color-brand: #233444;
	--footer-bg: var(--color-brand-2);
	--hero-bg: #4a8c9e;
	--hero-fg: #cee6ed;
	--footer-meta: color-mix(in srgb, var(--color-offwhite) 55%, var(--footer-bg));
	--carousel-1: linear-gradient(180deg, #4a8c9e 0%, #145263 100%);
	--carousel-2: linear-gradient(180deg, #cee6ed 0%, #89a5af 100%);
	--carousel-3: linear-gradient(180deg, #89a5af 0%, #4a8c9e 100%);
	--carousel-4: linear-gradient(180deg, #4a8c9e 0%, #233444 100%);
}

.site-theme-werkenbij {
	--color-brand-1: #f9d4b2;
	--color-brand-2: #d19369;
	--color-brand-3: #c17744;
	--color-brand-4: #7f4829;
	--color-brand: #7f4829;
	--nav-color-hero: var(--color-white);
	--hero-bg: #472a16;
	--hero-fg: #f9d4b2;
	--carousel-1: linear-gradient(180deg, #d27a29 0%, #5b3820 100%);
	--carousel-2: linear-gradient(180deg, #ebcb9f 0%, #d19369 100%);
	--carousel-3: linear-gradient(180deg, #c48357 0%, #d27a29 100%);
	--carousel-4: linear-gradient(180deg, #d27a29 0%, #5b3820 100%);
}

.site-theme-academie {
	--color-brand-2: #c99da0;
	--color-brand-3: #ca717b;
	--color-brand-4: #8e4048;
	--color-brand-5: #442f3d;
	--color-brand: #8e4048;
	--nav-color-hero: var(--color-white);
	--hero-bg: #442f3d;
	--hero-fg: #f4d9de;
	--carousel-1: linear-gradient(180deg, #ca717b 0%, #8e4048 100%);
	--carousel-2: linear-gradient(180deg, #f4d9de 0%, #c99da0 100%);
	--carousel-3: linear-gradient(180deg, #c99da0 0%, #ca717b 100%);
	--carousel-4: linear-gradient(180deg, #ca717b 0%, #442f3d 100%);
}

.site-theme-jobcoaching {
	--color-brand-2: #9ba588;
	--color-brand-3: #588758;
	--color-brand-4: #3e5434;
	--color-brand-5: #30352c;
	--color-brand: #3e5434;
	--nav-color: var(--color-brand-5);
	--nav-color-hero: var(--color-brand-5);
	--hero-bg: #30352c;
	--hero-fg: #d2ddca;
	--carousel-1: linear-gradient(180deg, #588758 0%, #3e5434 100%);
	--carousel-2: linear-gradient(180deg, #d2ddca 0%, #9ba588 100%);
	--carousel-3: linear-gradient(180deg, #9ba588 0%, #588758 100%);
	--carousel-4: linear-gradient(180deg, #588758 0%, #30352c 100%);
}

@media (max-width: 800px) {
	:root {
		--space-band: var(--space-5);
	}
}

@media (max-width: 767px) {
	:root {
		--gutter: 32px;
		--space-block: 120px;
	}
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	margin: 0;
	background: var(--color-white);
	color: var(--color-text);
	font-family: var(--font-sans);
	font-size: var(--text-h6-size);
	font-weight: 400;
	line-height: var(--text-h6-line);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

input:focus,
input:focus-visible,
textarea:focus,
textarea:focus-visible,
select:focus,
select:focus-visible {
	outline: none;
	box-shadow: none;
}

img {
	max-width: 100%;
	height: auto;
}

main img {
	display: block;
	max-width: min(100%, 560px);
	height: auto;
}

main [data-block="hero"] img,
body.single-nieuws main [data-block="inhoud"] img,
body.single-agenda main [data-block="inhoud"] img,
body.single-doelgroep main [data-block="inhoud"] img,
body.single-dienst main [data-block="inhoud"] img,
body.single-werkveld main [data-block="inhoud"] img {
	width: 100%;
	max-width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

main [data-block="afbeelding"] {
	margin-block: var(--space-block);
}

main [data-block="afbeelding"][data-variant="gekaderd"] img,
main [data-block="links"] img {
	width: 100%;
	max-width: 100%;
}

main [data-block="afbeelding"][data-variant="gekaderd"] img {
	aspect-ratio: 1340 / 622;
	object-fit: cover;
	border-radius: 25px;
}

main [data-block="links"] {
	margin-top: var(--space-6);
}

main [data-block="links"] > ul {
	display: grid;
	gap: 40px;
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="links"] li {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	box-sizing: border-box;
	min-height: 420px;
	aspect-ratio: 1340 / 622;
	padding: 48px 54px;
	overflow: hidden;
	border-radius: 25px;
	isolation: isolate;
}

main [data-block="links"] li::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(201, 185, 170, 0.5);
	mix-blend-mode: multiply;
	pointer-events: none;
}

main [data-block="links"] img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	border-radius: 0;
}

main [data-block="links"] .link-kaart__tekst {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 48px;
	width: 100%;
}

main [data-block="links"] h2,
main [data-block="links"] p {
	margin: 0;
	color: var(--color-bg);
}

main [data-block="links"] h2 {
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-block="links"] .link-kaart__tekst p {
	margin-top: 8px;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="links"] .link-kaart__tekst > p {
	margin-top: 0;
}

main [data-block="links"] a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 72px;
	padding: 0 30px;
	border: 1px solid var(--color-bg);
	border-radius: 15px;
	background: transparent;
	color: var(--color-bg);
	font-size: 26px;
	font-weight: 300;
	line-height: 1;
	text-decoration: none;
}

main [data-block="links"] a:hover,
main [data-block="links"] a:focus-visible {
	background: var(--color-bg);
	color: #2a2622;
}

@media (max-width: 767px) {
	main [data-block="links"] > ul {
		gap: var(--space-3);
	}

	main [data-block="links"] li {
		aspect-ratio: auto;
		min-height: 420px;
		padding: var(--space-4);
	}

	main [data-block="links"] .link-kaart__tekst {
		gap: var(--space-4);
	}

	main [data-block="links"] h2 {
		font-size: 36px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="links"] .link-kaart__tekst p {
		font-size: 18px;
		line-height: 28px;
	}

	main [data-block="links"] a {
		height: 62px;
		font-size: 20px;
	}
}

main [data-block="afbeelding"][data-variant="volledig"] {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
}

main [data-block="afbeelding"][data-variant="volledig"] img {
	width: 100%;
	max-width: none;
	aspect-ratio: 1440 / 622;
	object-fit: cover;
	border-radius: 0;
}

main section + section {
	margin-top: 4rem;
}

/* Tekst: gecentreerde alinea, smaller dan de contentkolom. */
main [data-block="tekst"] {
	max-width: 1112px;
	margin-inline: auto;
	margin-block: var(--space-block);
	color: #2a2622;
	font-size: 36px;
	font-weight: 400;
	line-height: 48px;
	letter-spacing: -0.36px;
	text-align: center;
}

main [data-block="tekst"] p {
	margin: 0;
}

@media (max-width: 767px) {
	main [data-block="tekst"] {
		max-width: none;
		color: var(--color-text);
		font-size: 24px;
		line-height: 36px;
		letter-spacing: 0;
	}
}

main [data-block="locaties"] > ul,
main [data-block="regels"][data-variant="normaal"] > ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="regels"][data-variant="normaal"] {
	margin-top: var(--space-6);
}

main [data-block="regels"][data-variant="normaal"] > ul {
	display: flex;
	flex-direction: column;
}

main [data-block="regels"][data-variant="accordion"] details {
	border-top: 1px solid var(--color-line);
}

main [data-block="regels"][data-variant="accordion"] details:last-of-type {
	border-bottom: 1px solid var(--color-line);
}

main [data-block="regels"][data-variant="accordion"] summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 32px 0;
	list-style: none;
	cursor: pointer;
	color: var(--color-brand-4);
	font-size: 36px;
	font-weight: 400;
	line-height: 48px;
	letter-spacing: -0.36px;
}

main [data-block="regels"][data-variant="accordion"] summary::-webkit-details-marker {
	display: none;
}

main [data-block="regels"][data-variant="accordion"] summary::marker {
	content: "";
}

main [data-block="regels"][data-variant="accordion"] summary::after {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	background:
		linear-gradient(#2a2622, #2a2622) center / 16px 1.5px no-repeat,
		linear-gradient(#2a2622, #2a2622) center / 1.5px 16px no-repeat;
}

main [data-block="regels"][data-variant="accordion"] details[open] summary::after {
	background: linear-gradient(#2a2622, #2a2622) center / 16px 1.5px no-repeat;
}

main [data-block="regels"][data-variant="accordion"] [data-regel-inhoud] {
	padding-bottom: 32px;
	color: #2a2622;
}

main [data-block="locaties"] > ul {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--space-3);
}

body:has([data-hero="contact"]) main [data-block="locaties"] {
	margin-top: 100px;
}

main [data-block="locaties"] li {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;
	min-height: 317px;
	padding: var(--space-4);
	border: 0;
	border-radius: 20px;
	background: var(--color-bg);
}

main [data-block="locaties"] li h2 {
	margin: 0;
	color: var(--color-brand-3);
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

main [data-block="locaties"] li p {
	margin: 0;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="locaties"] li a {
	color: inherit;
	text-decoration: none;
}

main [data-block="regels"][data-variant="normaal"] > ul > li + li {
	margin-top: 128px;
	padding-top: 80px;
	border-top: 1px solid var(--color-line);
}

main [data-block="regels"][data-variant="normaal"] .regel {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 772px);
	column-gap: 23px;
	align-items: start;
}

main [data-block="regels"][data-variant="normaal"] h3 {
	min-width: 0;
	margin: 0;
	color: var(--color-line);
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
	overflow-wrap: break-word;
}

main [data-block="regels"][data-variant="normaal"] [data-regel-inhoud] {
	min-width: 0;
}

main [data-block="regels"] [data-regel-inhoud] > * + * {
	margin-top: 40px;
}

main [data-block="regels"] [data-regel="tekst"] + [data-regel="afbeelding"] {
	margin-top: 80px;
}

main [data-block="regels"] [data-regel="tekst"] + [data-regel="carrousel"] {
	margin-top: 32px;
}

main [data-block="regels"] [data-regel="tekst"] {
	color: #2a2622;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="regels"] [data-regel="tekst"] p {
	margin: 0;
}

main [data-block="regels"] [data-regel="tekst"] p + p {
	margin-top: 32px;
}

main [data-block="regels"] [data-regel="tekst"]:has(> p:first-child > strong:first-child) {
	padding-block: 24px;
	border-top: 1px solid var(--color-line);
}

main [data-block="regels"] [data-regel="tekst"] p:has(> strong:first-child) {
	display: grid;
	grid-template-columns: 188px minmax(0, 1fr);
	column-gap: 32px;
	align-items: start;
	margin: 0;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--color-line);
	font-size: 22px;
	line-height: 32px;
}

main [data-block="regels"] [data-regel="tekst"] p:has(> strong:first-child) + p:has(> strong:first-child) {
	margin-top: 24px;
}

main [data-block="regels"] [data-regel="tekst"] p:has(> strong:first-child) br {
	display: none;
}

main [data-block="regels"] [data-regel="tekst"] p:has(> strong:first-child) strong {
	color: var(--color-line);
	font-size: 26px;
	font-weight: 400;
	line-height: 36px;
}

main [data-block="regels"][data-variant="normaal"] [data-regel="afbeelding"] {
	display: flex;
	justify-content: center;
}

main [data-block="regels"][data-variant="normaal"] [data-regel="afbeelding"] img {
	width: auto;
	max-width: 100%;
	height: auto;
}

main [data-block="regels"] [data-regel="knop"] p {
	margin: 0;
}

main [data-block="regels"] [data-regel="knop"] a {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	padding: 16px 30px 20px;
	border: 0;
	border-radius: 15px;
	background: var(--color-brand-2);
	color: var(--color-bg);
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
	text-decoration: none;
}

main [data-block="regels"] [data-regel="knop"] a[data-stijl="secundair"] {
	background: var(--color-brand-3);
}

main [data-block="regels"] [data-regel="knop"] a[data-stijl="outline"] {
	background: transparent;
	color: var(--color-brand-3);
	box-shadow: inset 0 0 0 1px currentColor;
}

main [data-block="regels"] [data-regel="knop"] a:hover,
main [data-block="regels"] [data-regel="knop"] a:focus-visible {
	background: var(--color-brand-3);
	color: var(--color-bg);
}

main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] {
	--regel-bleed: max(var(--gutter), calc((100vw - var(--container)) / 2));
	width: calc(100% + var(--regel-bleed));
	max-width: none;
	margin-right: calc(-1 * var(--regel-bleed));
	overflow: hidden;
}

main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] .swiper-wrapper {
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] .swiper-slide {
	display: flex;
	flex-direction: column;
	gap: 24px;
	box-sizing: border-box;
	width: 754px;
	min-height: 285px;
	margin: 0;
	padding: 40px;
	border-radius: 20px;
	background: var(--color-brand-4);
	color: var(--color-offwhite);
}

main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] .swiper-slide:nth-child(even) {
	background: var(--color-brand-3);
}

main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] .regel-kaart__kop {
	display: flex;
	flex-direction: column;
}

main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] .regel-kaart__stap,
main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] h4,
main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] p {
	margin: 0;
	color: inherit;
}

main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] .regel-kaart__stap {
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] h4 {
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] .regel-kaart__kop + p {
	max-width: 390px;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

@media (max-width: 1100px) {
	main [data-block="regels"][data-variant="normaal"] .regel {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 24px;
	}
}

@media (max-width: 800px) {
	main [data-block="regels"][data-variant="normaal"] > ul > li + li {
		margin-top: 64px;
		padding-top: 48px;
	}

	main [data-block="regels"][data-variant="normaal"] h3 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="regels"] [data-regel="tekst"] {
		font-size: 18px;
		line-height: 28px;
	}

	main [data-block="regels"] [data-regel="tekst"] p:has(> strong:first-child) {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 4px;
		font-size: 18px;
		line-height: 28px;
	}

	main [data-block="regels"] [data-regel="tekst"] p:has(> strong:first-child) strong {
		font-size: 20px;
		line-height: 28px;
	}

	main [data-block="regels"] [data-regel="knop"] a {
		font-size: 18px;
		line-height: 24px;
	}

	main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] .swiper-slide {
		width: 300px;
		min-height: 0;
		padding: 24px;
	}

	main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] h4 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] .regel-kaart__stap,
	main [data-block="regels"][data-variant="normaal"] [data-regel="carrousel"] .regel-kaart__kop + p {
		max-width: none;
		font-size: 16px;
		line-height: 24px;
	}
}

main [data-regel-inhoud] > * + * {
	margin-top: 2rem;
}

main [data-block="nieuws"] {
	margin-top: var(--space-6);
}

main [data-block="nieuws"] > ul {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--space-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="nieuws"] .nieuws-kaart > a {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

main [data-block="nieuws"] .nieuws-kaart__foto {
	position: relative;
	height: 280px;
	overflow: hidden;
	border-radius: 20px 20px 0 0;
	background: var(--color-line);
}

main [data-block="nieuws"] .nieuws-kaart__foto img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	aspect-ratio: auto;
	object-fit: cover;
}

main [data-block="nieuws"] .nieuws-kaart__merk {
	position: absolute;
	left: var(--space-4);
	bottom: var(--space-4);
	margin: 0;
	color: var(--color-bg);
	font-size: 26px;
	font-weight: 400;
	line-height: 36px;
}

main [data-block="nieuws"] .nieuws-kaart__tekst {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;
	height: 270px;
	padding: var(--space-4);
	border-radius: 0 0 20px 20px;
	background: var(--color-bg);
	transition: background-color 0.2s ease;
}

main [data-block="nieuws"] .nieuws-kaart:hover .nieuws-kaart__tekst,
main [data-block="nieuws"] .nieuws-kaart:focus-within .nieuws-kaart__tekst {
	background: var(--color-line);
}

main [data-block="nieuws"] .nieuws-kaart__tekst h2 {
	margin: 0;
	max-width: 367px;
	color: #2a2622;
	font-size: 36px;
	font-weight: 400;
	line-height: 48px;
	letter-spacing: -0.36px;
}

main [data-block="nieuws"] .nieuws-kaart__tekst p {
	margin: 0;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="doelgroepen"] img {
	width: 100%;
	max-width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

main [data-block="doelgroepen"] li h2,
main [data-block="trainingen"] li h3,
main [data-block="leerlijnen"] li h3 {
	font-size: var(--text-h5-size);
	font-weight: var(--text-h5-weight);
	line-height: var(--text-h5-line);
	letter-spacing: var(--text-h5-tracking);
}

body.home main [data-block="diensten"] {
	display: grid;
	grid-template-columns: minmax(0, 545px) minmax(0, 1fr);
	column-gap: var(--space-3);
	align-items: start;
	margin-block: var(--space-block);
	border-top: 1px solid var(--color-line);
	padding-top: var(--space-6);
}

body.home main [data-block="diensten"] > h2 {
	grid-column: 1;
	grid-row: 1;
	margin: 0;
	color: var(--color-line);
	font-size: 50px;
	font-weight: 500;
	line-height: 54px;
	letter-spacing: -1px;
}

body.home main [data-block="diensten"] > div {
	grid-column: 2;
	grid-row: 1;
	margin: 0;
	color: #2a2622;
	font-size: 26px;
	font-weight: 400;
	line-height: 36px;
}

body.home main [data-block="diensten"] > div p {
	margin: 0;
}

body.home main [data-block="diensten"] > ul {
	grid-column: 2;
	grid-row: 2;
	display: grid;
	gap: var(--space-4);
	margin: 92px 0 0;
	padding: 0;
	list-style: none;
}

body.home main [data-block="diensten"] .dienst-kaart {
	position: relative;
	height: 500px;
	margin: 0;
	overflow: hidden;
	border-radius: 25px;
}

body.home main [data-block="diensten"] .dienst-kaart--uitzendbureau {
	--dienst-hover: #d19369;
}

body.home main [data-block="diensten"] .dienst-kaart--academie {
	--dienst-hover: #c99da0;
}

body.home main [data-block="diensten"] .dienst-kaart--jobcoaching {
	--dienst-hover: #9ba588;
}

body.home main [data-block="diensten"] .dienst-kaart__link {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: var(--space-5);
	box-sizing: border-box;
	height: auto;
	padding: var(--space-5) 40px;
	border: 0;
	border-radius: inherit;
	background: transparent;
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	text-decoration: none;
}

body.home main [data-block="diensten"] .dienst-kaart img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	aspect-ratio: auto;
	object-fit: cover;
	border-radius: 25px;
}

body.home main [data-block="diensten"] .dienst-kaart__link::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: rgba(71, 42, 22, 0.2);
	pointer-events: none;
	transition: background-color 0.2s ease;
}

body.home main [data-block="diensten"] .dienst-kaart__link:hover::after,
body.home main [data-block="diensten"] .dienst-kaart__link:focus-visible::after {
	background: var(--dienst-hover);
}

body.home main [data-block="diensten"] .dienst-kaart__tekst,
body.home main [data-block="diensten"] .dienst-kaart__knop {
	position: relative;
	z-index: 1;
}

body.home main [data-block="diensten"] .dienst-kaart__tekst {
	display: flex;
	flex-direction: column;
	gap: var(--space-1);
}

body.home main [data-block="diensten"] .dienst-kaart h3 {
	margin: 0;
	color: var(--color-offwhite);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

body.home main [data-block="diensten"] .dienst-kaart__tekst p {
	margin: 0;
	color: var(--color-offwhite);
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

body.home main [data-block="diensten"] .dienst-kaart__knop {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: flex-start;
	box-sizing: border-box;
	height: 72px;
	padding: 0 30px;
	border: 1px solid var(--color-offwhite);
	border-radius: var(--radius);
	color: var(--color-offwhite);
	font-size: 26px;
	font-weight: 300;
	line-height: 1;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

body.home main [data-block="diensten"] .dienst-kaart__link:hover .dienst-kaart__knop,
body.home main [data-block="diensten"] .dienst-kaart__link:focus-visible .dienst-kaart__knop {
	border-color: var(--color-offwhite);
	background: var(--color-offwhite);
	color: #2a2622;
}

body.single-doelgroep main [data-block="diensten"] {
	margin-top: 104px;
}

body.single-doelgroep main [data-block="diensten"] > h2 {
	margin: 0 0 56px;
	color: var(--color-brand-4);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

body.single-doelgroep main [data-block="diensten"] > ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

body.single-doelgroep main [data-block="diensten"] li {
	border: 0;
	padding: 0;
}

body.single-doelgroep main [data-block="diensten"] a {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 32px;
	box-sizing: border-box;
	height: 100%;
	min-height: 400px;
	padding: 40px;
	border-radius: 20px;
	background: var(--color-brand-2);
	color: var(--color-offwhite);
	text-decoration: none;
}

body.single-doelgroep main [data-block="diensten"] li:nth-child(odd) a {
	background: var(--color-brand-3);
}

body.single-doelgroep main [data-block="diensten"] a > span:first-child {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

body.single-doelgroep main [data-block="diensten"] h3 {
	margin: 0;
	color: var(--color-offwhite);
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

body.single-doelgroep main [data-block="diensten"] p {
	margin: 0;
	color: var(--color-offwhite);
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

body.single-doelgroep main [data-block="diensten"] .dienst-meer {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	gap: 16px;
	padding: 16px 30px;
	border: 1px solid var(--color-brand-5);
	border-radius: var(--radius);
	color: var(--color-brand-5);
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
}

body.single-doelgroep main [data-block="diensten"] li:nth-child(odd) .dienst-meer {
	border-color: var(--color-offwhite);
	background: var(--color-bg);
}

body.single-doelgroep main [data-block="diensten"] a:hover .dienst-meer,
body.single-doelgroep main [data-block="diensten"] a:focus-visible .dienst-meer {
	background: var(--color-brand-5);
	color: var(--color-bg);
}

body.single-doelgroep main [data-block="diensten"] li:nth-child(odd) a:hover .dienst-meer,
body.single-doelgroep main [data-block="diensten"] li:nth-child(odd) a:focus-visible .dienst-meer {
	border-color: var(--color-brand-4);
	background: var(--color-brand-4);
	color: var(--color-bg);
}

main [data-block="handboek"] {
	margin-top: 120px;
}

main [data-block="handboek"] > h2 {
	margin: 0 0 40px;
	color: var(--color-brand-4);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-block="handboek"] nav ul {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	column-gap: 24px;
	row-gap: 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="handboek"] nav a {
	display: flex;
	flex-direction: column;
	padding: 0 0 16px;
	border: 0;
	border-bottom: 1px solid var(--color-line);
	color: #000000;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
	text-decoration: none;
}

main [data-block="handboek"] nav a[aria-current="page"],
main [data-block="handboek"] nav a:hover {
	color: var(--color-brand-4);
	border-bottom-color: var(--color-brand-4);
}

main [data-block="handboek"] nav + ul {
	margin-top: 120px;
}

main [data-block="handboek"] > ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px 25px;
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="handboek"] > ul > li {
	border: 0;
	min-height: 0;
}

main [data-block="handboek"] > ul > li a {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 32px;
	box-sizing: border-box;
	min-height: 400px;
	padding: 40px;
	border-radius: 20px;
	background: var(--color-bg);
	color: #2a2622;
	text-decoration: none;
}

main [data-block="handboek"] > ul > li h3,
main [data-block="handboek"] > ul > li p {
	margin: 0;
}

main [data-block="handboek"] > ul > li h3 {
	font-size: 50px;
	font-weight: 500;
	line-height: 54px;
	letter-spacing: -1px;
}

main [data-block="handboek"] > ul > li p {
	margin-top: 8px;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="handboek"] > ul > li a > span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: flex-start;
	gap: 16px;
	box-sizing: border-box;
	height: 68px;
	padding: 0 30px;
	border: 1px solid #2a2622;
	border-radius: 15px;
	font-size: 26px;
	font-weight: 300;
	line-height: 1;
}

main [data-block="handboek"] > ul > li a > span::after {
	content: "";
	width: 7px;
	height: 7px;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
	transform: rotate(45deg);
}

main [data-block="handboek"] > ul > li a:hover > span,
main [data-block="handboek"] > ul > li a:focus-visible > span {
	background: #2a2622;
	color: var(--color-bg);
}

@media (max-width: 767px) {
	main [data-block="regels"][data-variant="accordion"] summary {
		font-size: 24px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="regels"][data-variant="accordion"] [data-regel-inhoud] {
		padding-bottom: 24px;
	}

	main [data-block="handboek"] {
		margin-top: 80px;
	}

	main [data-block="handboek"] > h2 {
		margin-bottom: 24px;
		color: #2a2622;
		font-size: 36px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="handboek"] nav ul {
		column-gap: 24px;
		row-gap: 24px;
	}

	main [data-block="handboek"] nav a {
		padding-bottom: 24px;
		font-size: 16px;
		line-height: 24px;
	}

	main [data-block="handboek"] nav + ul {
		margin-top: 80px;
	}

	main [data-block="handboek"] > ul {
		gap: 32px;
	}

	main [data-block="handboek"] > ul > li a {
		min-height: 0;
		padding: 32px 24px;
		border-radius: 25px;
	}

	main [data-block="handboek"] > ul > li h3 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="handboek"] > ul > li p {
		margin-top: 16px;
		font-size: 16px;
		line-height: 24px;
	}

	main [data-block="handboek"] > ul > li a > span {
		height: 52px;
		padding: 0 24px;
		font-size: 16px;
	}

	main [data-block="handboek"] > ul > li a > span::after {
		content: none;
	}
}

main [data-block="werkvelden"] > ul,
main [data-block="trainingen"] > ul,
main [data-block="leerlijnen"] > ul {
	margin: 1rem 0 0;
	padding: 0;
	list-style: none;
}

main [data-block="werkvelden"] > ul {
	display: flex;
	flex-direction: column;
	gap: 24px;
	margin: 0;
}

main [data-block="trainingen"] > ul,
main [data-block="leerlijnen"] > ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
}

main [data-block="werkvelden"] li {
	margin: 0;
	border: 0;
	border-radius: 25px;
	background: var(--color-brand-2);
}

main [data-block="trainingen"] li,
main [data-block="leerlijnen"] li {
	border: 1px solid var(--color-line);
}

main [data-block="werkvelden"] a,
main [data-block="trainingen"] a,
main [data-block="leerlijnen"] a {
	display: block;
	color: inherit;
	text-decoration: none;
}

main [data-block="trainingen"] li h3,
main [data-block="trainingen"] li p,
main [data-block="leerlijnen"] li h3,
main [data-block="leerlijnen"] li p {
	margin: 0.75rem 1rem 0;
}

main [data-block="trainingen"] li p,
main [data-block="leerlijnen"] li p {
	margin-bottom: 1rem;
}

main [data-block="werkvelden"] li:first-child {
	background: var(--color-brand-3);
}

main [data-block="werkvelden"] a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	padding: 48px;
}

main [data-block="werkvelden"] h2 {
	margin: 0;
	color: #f7f3ed;
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-block="werkvelden"] p {
	max-width: 838px;
	margin: 16px 0 0;
	color: #f7f3ed;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="werkvelden"] a > span {
	display: inline-flex;
	flex: none;
	align-items: center;
	gap: 16px;
	padding: 16px 30px 20px;
	border: 1px solid var(--color-brand-5);
	border-radius: 15px;
	color: var(--color-brand-5);
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
}

main [data-block="werkvelden"] li:first-child a > span {
	border-color: #f7f3ed;
	background: #f7f3ed;
}

main [data-hero="trainingen"] + [data-block="werkvelden"] {
	margin-top: 80px;
}

main [data-block="doelgroepen"] > ul {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="doelgroepen"] li {
	border: 1px solid var(--color-line);
	padding-bottom: 1rem;
}

main [data-block="doelgroepen"] a {
	display: block;
	color: inherit;
	text-decoration: none;
}

main [data-block="doelgroepen"] li h2,
main [data-block="doelgroepen"] li p {
	margin: 0.75rem 1rem 0;
}

main [data-block="doelgroepen"] li p {
	margin-bottom: 1rem;
}

/* Jobcoaching dienstverlening: titel op de foto, doelgroepen als balk. */

body.site-theme-jobcoaching.page-template-dienstverlening {
	--hero-fg: #f7f3ed;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-foto {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	aspect-ratio: 1440 / 600;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-foto img {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	aspect-ratio: auto;
	object-fit: cover;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-foto .container {
	position: relative;
	z-index: 1;
	width: min(var(--container), calc(100% - 2 * var(--gutter)));
	padding-bottom: 64px;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-foto h1 {
	margin: 0;
	color: #f7f3ed;
	font-size: 100px;
	font-weight: 300;
	line-height: 100px;
	letter-spacing: -2px;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-intro {
	padding-block: 64px;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-intro p {
	color: #2a2622;
	font-size: 32px;
	line-height: 44px;
	letter-spacing: -0.32px;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] {
	margin-top: 80px;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] > ul {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] li {
	border: 0;
	padding: 0;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	min-height: 206px;
	padding: 48px;
	border-radius: 25px;
	background: var(--color-brand-2);
	color: var(--color-offwhite);
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] li:first-child a {
	background: var(--color-brand-3);
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] a > span:first-child {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] h2 {
	margin: 0;
	color: var(--color-offwhite);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] p {
	max-width: 838px;
	margin: 0;
	color: var(--color-offwhite);
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] .doelgroep-meer {
	display: inline-flex;
	flex: none;
	align-items: center;
	gap: 16px;
	padding: 16px 30px 20px;
	border: 1px solid #2a2622;
	border-radius: var(--radius);
	background: transparent;
	color: #2a2622;
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] .doelgroep-meer svg {
	display: block;
	flex: none;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] li:first-child .doelgroep-meer {
	border-color: var(--color-bg);
	background: var(--color-bg);
	color: #2a2622;
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] a:hover .doelgroep-meer,
body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] a:focus-visible .doelgroep-meer {
	background: #2a2622;
	color: var(--color-bg);
}

body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] li:first-child a:hover .doelgroep-meer,
body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] li:first-child a:focus-visible .doelgroep-meer {
	border-color: var(--color-brand-4);
	background: var(--color-brand-4);
	color: var(--color-bg);
}

/* Jobcoaching doelgroep: label en titel op de foto. */

body.single-doelgroep {
	--hero-fg: #f7f3ed;
}

body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-foto {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	aspect-ratio: 1440 / 600;
}

body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-foto img {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	aspect-ratio: auto;
	object-fit: cover;
}

body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-foto .container {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 32px;
	align-items: flex-start;
	width: min(var(--container), calc(100% - 2 * var(--gutter)));
	padding-bottom: 64px;
}

body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-label {
	margin: 0;
	color: #f7f3ed;
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-foto h1 {
	margin: 0;
	color: #f7f3ed;
	font-size: 100px;
	font-weight: 300;
	line-height: 100px;
	letter-spacing: -2px;
}

body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-intro {
	padding-block: 64px;
}

body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-intro p {
	color: #2a2622;
	font-size: 32px;
	line-height: 44px;
	letter-spacing: -0.32px;
}

body.single-doelgroep main [data-block="regels"][data-variant="normaal"] h3 {
	color: var(--color-brand-3);
}

body.single-doelgroep main [data-block="regels"][data-variant="normaal"] > ul > li:first-child {
	padding-top: 80px;
	border-top: 1px solid var(--color-line);
}

/* Jobcoaching dienst: groene titelband, foto tussen de regels. */

body.single-dienst {
	--hero-fg: #30352c;
	--hero-bg: var(--color-brand-2);
}

body.single-dienst.site-theme-jobcoaching main [data-hero="dienst"] .hero-band {
	flex-direction: column;
	align-items: center;
	min-height: 400px;
	padding: calc(var(--header-height) + 19px) 0 48px;
}

body.single-dienst.site-theme-jobcoaching main [data-hero="dienst"] .hero-band .container {
	display: flex;
	flex: 1;
	flex-direction: column;
	justify-content: space-between;
	width: min(var(--container), calc(100% - 2 * var(--gutter)));
}

body.single-dienst.site-theme-jobcoaching main [data-hero="dienst"] .hero-band h1 {
	margin: 0;
	color: #30352c;
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

body.single-dienst.site-theme-jobcoaching main [data-hero="dienst"] .hero-terug a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #30352c;
	text-decoration: none;
}

body.single-dienst.site-theme-jobcoaching main [data-hero="dienst"] .hero-terug svg {
	display: block;
	flex: none;
}

body.single-dienst main [data-block="regels"][data-variant="normaal"] {
	margin-top: 104px;
}

body.single-dienst main [data-block="regels"][data-variant="normaal"] h3 {
	color: var(--color-brand-3);
}

body.single-dienst main [data-block="regels"][data-variant="normaal"] > ul > li:first-child {
	padding-top: 80px;
	border-top: 1px solid var(--color-line);
}

body.single-dienst main .dienst-beeld {
	width: 100vw;
	max-width: 100vw;
	margin: 184px 0 0 calc(50% - 50vw);
}

body.single-dienst main .dienst-beeld + ul {
	margin-top: 160px;
}

body.single-dienst main .dienst-beeld img {
	width: 100%;
	max-width: none;
	height: auto;
	aspect-ratio: 1440 / 622;
	object-fit: cover;
}

body.single-dienst main [data-regel="tekst"] ul {
	margin: 32px 0 0;
	padding: 0;
	list-style: none;
}

body.single-dienst main [data-regel="tekst"] li {
	display: flex;
	align-items: flex-start;
	gap: 32px;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

body.single-dienst main [data-regel="tekst"] li + li {
	margin-top: 32px;
}

body.single-dienst main [data-regel="tekst"] li::before {
	content: "";
	flex: none;
	width: 27px;
	height: 18px;
	margin-top: 4px;
	background: currentColor;
	transform: rotate(-14deg);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 18' fill='none'%3E%3Cpath d='M2 9.5 9.5 16 25 2' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 18' fill='none'%3E%3Cpath d='M2 9.5 9.5 16 25 2' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

main [data-block="team"] .team-kop {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 772px);
	column-gap: 23px;
	align-items: start;
	padding-top: 80px;
	border-top: 1px solid var(--color-line);
}

main [data-block="team"] h2 {
	margin: 0;
	color: var(--color-brand-2);
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

main [data-block="team"] .team-kop div {
	color: #2a2622;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="team"] .team-kop p {
	margin: 0;
}

main [data-block="team"] .team-kop p + p {
	margin-top: 16px;
}

main [data-block="team"] > ul {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
	margin: 80px 0 0;
	padding: 0;
	list-style: none;
}

main [data-block="team"] li {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 420px;
	margin: 0;
	padding: 32px 24px;
	overflow: hidden;
	border: 0;
	border-radius: 20px;
	isolation: isolate;
}

main [data-block="team"] img {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
}

main [data-block="team"] li::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(247, 243, 237, 0) 30%, rgba(206, 141, 82, 0.95) 85%);
	pointer-events: none;
}

body.site-theme-academie main [data-block="team"] h2 {
	color: var(--color-brand-3);
}

body.site-theme-academie main [data-block="team"] li::after {
	background: linear-gradient(to bottom, rgba(247, 243, 237, 0) 30%, #ca717b 85%);
}

main [data-block="team"] .team-kaart__tekst {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
	color: var(--color-white);
	text-align: center;
}

main [data-block="team"] strong {
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

main [data-block="team"] li p {
	margin: 0;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="team"] li a {
	color: inherit;
	text-decoration: none;
}

main [data-block="team"] li a:hover,
main [data-block="team"] li a:focus-visible {
	text-decoration: underline;
}

@media (max-width: 1100px) {
	main [data-block="team"] .team-kop,
	main [data-block="team"] > ul {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 700px) {
	main [data-block="team"] .team-kop {
		grid-template-columns: 1fr;
		row-gap: 16px;
		padding-top: 48px;
	}

	main [data-block="team"] h2,
	main [data-block="team"] strong {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	main [data-block="team"] .team-kop div {
		font-size: 18px;
		line-height: 28px;
	}

	main [data-block="team"] > ul {
		grid-template-columns: 1fr;
		margin-top: 48px;
	}

	main [data-block="team"] li {
		min-height: 360px;
	}
}

body.page-template-trainingen {
	--hero-fg: #ffffff;
}

main [data-hero="trainingen"] .trainingen-hero {
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: flex-end;
	box-sizing: border-box;
	width: 100vw;
	max-width: 100vw;
	min-height: 600px;
	margin-left: calc(50% - 50vw);
	padding: 64px var(--gutter);
	overflow: hidden;
	background: var(--hero-bg);
	color: #f7f3ed;
}

main [data-hero="trainingen"] .trainingen-hero img {
	position: absolute;
	inset: 0;
	z-index: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	aspect-ratio: auto;
	object-fit: cover;
}

main [data-hero="trainingen"] .trainingen-hero:has(img)::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background: rgba(0, 0, 0, 0.15);
	mix-blend-mode: multiply;
	pointer-events: none;
}

main [data-hero="trainingen"] .trainingen-hero .container {
	position: relative;
	z-index: 1;
}

main [data-hero="trainingen"] .trainingen-hero h1 {
	margin: 0;
	color: #f7f3ed;
	font-size: 100px;
	font-weight: 300;
	line-height: 100px;
	letter-spacing: -2px;
}

body.page-template-trainingen:not(.home) main [data-hero="trainingen"] .hero-intro {
	padding-block: 64px;
}

body.page-template-trainingen:not(.home) main [data-hero="trainingen"] .hero-intro p {
	font-size: 32px;
	line-height: 44px;
	letter-spacing: -0.32px;
}

body.single-werkveld {
	--hero-fg: #ffffff;
}

main [data-hero="werkveld"] .werkveld-hero {
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: flex-end;
	box-sizing: border-box;
	width: 100vw;
	max-width: 100vw;
	min-height: 600px;
	margin-left: calc(50% - 50vw);
	padding: 64px var(--gutter);
	overflow: hidden;
	background: var(--hero-bg);
	color: #f7f3ed;
}

main [data-hero="werkveld"] .werkveld-hero img {
	position: absolute;
	inset: 0;
	z-index: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	aspect-ratio: auto;
	object-fit: cover;
}

main [data-hero="werkveld"] .werkveld-hero:has(img)::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background: rgba(0, 0, 0, 0.15);
	mix-blend-mode: multiply;
	pointer-events: none;
}

main [data-hero="werkveld"] .werkveld-hero .container {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 32px;
	width: min(var(--container), 100%);
}

main [data-hero="werkveld"] .werkveld-hero a {
	color: #f7f3ed;
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
	text-decoration: none;
}

main [data-hero="werkveld"] .werkveld-hero h1 {
	margin: 0;
	color: #f7f3ed;
	font-size: 100px;
	font-weight: 300;
	line-height: 100px;
	letter-spacing: -2px;
}

body.single-werkveld:not(.home) main [data-hero="werkveld"] .hero-intro {
	padding-block: 64px;
}

body.single-werkveld:not(.home) main [data-hero="werkveld"] .hero-intro p {
	font-size: 32px;
	line-height: 44px;
	letter-spacing: -0.32px;
}

main [data-hero="werkveld"] .werkveld-sprong {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	width: 100%;
	margin: 80px 0 0;
}

main [data-hero="werkveld"] .werkveld-sprong p {
	margin: 0;
	color: var(--color-brand-3);
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

main [data-hero="werkveld"] .werkveld-sprong ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-hero="werkveld"] .werkveld-sprong a {
	display: inline-flex;
	padding: 16px 30px;
	border: 1px solid var(--color-brand-5);
	border-radius: 15px;
	color: var(--color-brand-5);
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
	text-decoration: none;
}

body.single-werkveld main [data-hero="werkveld"] + section,
body.single-werkveld main [data-block="trainingen"] + [data-block="leerlijnen"] {
	margin-top: 120px;
}

body.single-werkveld main [data-block="trainingen"] > h2,
body.single-werkveld main [data-block="leerlijnen"] > h2 {
	margin: 0;
	padding-top: 80px;
	border-top: 1px solid var(--color-line);
	color: var(--color-brand-3);
	font-weight: 500;
	scroll-margin-top: 32px;
}

body.single-werkveld main [data-block="trainingen"] > h2 {
	font-size: 40px;
	line-height: 50px;
	letter-spacing: -0.8px;
}

body.single-werkveld main [data-block="leerlijnen"] > h2 {
	font-size: 50px;
	line-height: 54px;
	letter-spacing: -1px;
}

body.single-werkveld main [data-block="trainingen"] > ul,
body.single-werkveld main [data-block="leerlijnen"] > ul {
	margin-top: 80px;
}

body.single-werkveld main [data-block="trainingen"] > ul {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px 25px;
}

body.single-werkveld main [data-block="leerlijnen"] > ul {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

body.single-werkveld main [data-block="trainingen"] li,
body.single-werkveld main [data-block="leerlijnen"] li {
	border: 0;
	border-radius: 20px;
	background: var(--color-brand-2);
}

body.single-werkveld main [data-block="trainingen"] li:first-child {
	background: var(--color-brand-3);
}

body.single-werkveld main [data-block="leerlijnen"] li {
	background: var(--color-brand-4);
}

body.single-werkveld main [data-block="trainingen"] a,
body.single-werkveld main [data-block="leerlijnen"] a {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	gap: 24px;
	box-sizing: border-box;
	min-height: 400px;
	padding: 40px;
	color: #fffefc;
}

body.single-werkveld main [data-block="leerlijnen"] a {
	min-height: 350px;
	color: #f7f3ed;
}

body.single-werkveld main [data-block="trainingen"] h3,
body.single-werkveld main [data-block="leerlijnen"] h3 {
	margin: 0;
	color: inherit;
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

body.single-werkveld main [data-block="trainingen"] li p,
body.single-werkveld main [data-block="leerlijnen"] li p {
	margin: 8px 0 0;
	color: inherit;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

body.single-werkveld main [data-block="trainingen"] a > span,
body.single-werkveld main [data-block="leerlijnen"] a > span {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	padding: 16px 30px;
	border: 1px solid var(--color-brand-5);
	border-radius: 15px;
	color: var(--color-brand-5);
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
}

body.single-werkveld main [data-block="trainingen"] li:first-child a > span {
	border-color: #fffefc;
	background: #f7f3ed;
}

body.single-werkveld main [data-block="leerlijnen"] a > span {
	border-color: #f7f3ed;
	background: transparent;
	color: #f7f3ed;
}

body.page-template-flexpool {
	--hero-bg: #472a16;
	--hero-fg: #f7f3ed;
}

main [data-hero="flexpool"] .flexpool-hero {
	position: relative;
	isolation: isolate;
	display: flex;
	align-items: flex-end;
	box-sizing: border-box;
	width: 100vw;
	max-width: 100vw;
	min-height: 600px;
	margin-left: calc(50% - 50vw);
	padding: 64px var(--gutter);
	overflow: hidden;
	background: #472a16;
	color: #f7f3ed;
}

main [data-hero="flexpool"] .flexpool-hero img {
	position: absolute;
	inset: 0;
	z-index: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
}

main [data-hero="flexpool"] .flexpool-hero:has(img)::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background: rgba(0, 0, 0, 0.15);
	mix-blend-mode: multiply;
	pointer-events: none;
}

main [data-hero="flexpool"] .flexpool-hero .container {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 32px;
}

main [data-hero="flexpool"] .flexpool-hero h1 {
	margin: 0;
	color: #f7f3ed;
	font-size: 100px;
	font-weight: 300;
	line-height: 100px;
	letter-spacing: -2px;
}

main [data-hero="flexpool"] .flexpool-hero a {
	flex: none;
	padding: 16px 30px 20px;
	border-radius: 15px;
	background: var(--color-brand-2);
	color: #f7f3ed;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
	text-decoration: none;
}

main [data-hero="flexpool"] .flexpool-hero a:hover,
main [data-hero="flexpool"] .flexpool-hero a:focus-visible {
	background: #f7f3ed;
	color: var(--color-brand-4);
}

main [data-hero="flexpool"] .hero-intro {
	padding-block: 64px;
	background: var(--color-bg);
}

main [data-hero="flexpool"] .hero-intro p {
	font-size: 32px;
	font-weight: 400;
	line-height: 44px;
	letter-spacing: -0.32px;
}

main [data-hero="flexpool"] blockquote {
	width: min(var(--container), 100%);
	margin: 0 auto;
	padding-block: 128px;
	color: var(--color-line);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
	text-align: center;
}

main [data-hero="flexpool"] + [data-block="ervaringen"],
main [data-block="ervaringen"] + [data-block="reviews"] {
	margin-top: 0;
}

main [data-block="ervaringen"] .flexpool-kop,
main [data-block="reviews"] .flexpool-kop {
	display: grid;
	grid-template-columns: minmax(0, 545px) minmax(0, 772px);
	column-gap: 23px;
	align-items: start;
	padding-top: 80px;
	border-top: 1px solid var(--color-line);
}

main [data-block="reviews"] .flexpool-kop {
	margin-top: 160px;
}

main [data-block="ervaringen"] .flexpool-kop h2,
main [data-block="reviews"] .flexpool-kop h2 {
	margin: 0;
	color: var(--color-brand-2);
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

main [data-block="ervaringen"] .flexpool-kop div,
main [data-block="ervaringen"] .flexpool-kop p,
main [data-block="reviews"] .flexpool-kop p {
	margin: 0;
	color: #2a2622;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="ervaringen"] > ul {
	display: flex;
	gap: 24px;
	margin: 80px 0 0;
	padding: 0 0 8px;
	overflow-x: auto;
	list-style: none;
}

main [data-block="ervaringen"] li {
	position: relative;
	display: flex;
	flex: none;
	flex-direction: column;
	justify-content: flex-end;
	gap: 24px;
	width: 429px;
	min-height: 550px;
	margin: 0;
	padding: 32px 24px;
	overflow: hidden;
	border: 0;
	border-radius: 20px;
	isolation: isolate;
}

main [data-block="ervaringen"] img {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	aspect-ratio: auto;
	object-fit: cover;
}

main [data-block="ervaringen"] li::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(247, 243, 237, 0) 30%, #c48357 85%);
	pointer-events: none;
}

main [data-block="ervaringen"] .ervaring-tekst,
main [data-block="ervaringen"] details {
	position: relative;
	z-index: 1;
}

main [data-block="ervaringen"] strong {
	display: block;
	color: #fff;
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

main [data-block="ervaringen"] .ervaring-tekst p,
main [data-block="ervaringen"] details p {
	margin: 4px 0 0;
	color: #fff;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="ervaringen"] details p {
	margin-top: 16px;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="ervaringen"] summary {
	display: inline-flex;
	padding: 8px 24px 14px;
	border: 1px solid #fff;
	border-radius: 15px;
	color: #fff;
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
	list-style: none;
	cursor: pointer;
}

main [data-block="ervaringen"] summary::-webkit-details-marker {
	display: none;
}

main [data-block="ervaringen"] summary::marker {
	content: "";
}

main [data-block="reviews"] > ul {
	display: flex;
	gap: 24px;
	margin: 80px 0 0;
	padding: 0 0 8px;
	overflow-x: auto;
	list-style: none;
}

main [data-block="reviews"] li {
	display: flex;
	flex: none;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	box-sizing: border-box;
	width: 317px;
	min-height: 402px;
	margin: 0;
	padding: 28px 24px 32px;
	border: 0;
	border-radius: 25px;
	background: var(--color-bg);
	text-align: center;
}

main [data-block="reviews"] .review-sterren {
	display: flex;
	gap: 4px;
	margin: 0;
	color: var(--color-brand-2);
}

main [data-block="reviews"] .review-sterren svg:not([data-filled="true"]) {
	opacity: 0.28;
}

main [data-block="reviews"] .review-letter {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	margin: 0;
	border-radius: 50%;
	background: #c4b4a6;
	color: #fffefc;
	font-size: 28px;
	font-weight: 500;
	line-height: 1;
}

main [data-block="reviews"] li > p:not([class]) {
	margin: 0;
	color: #2a2622;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	text-align: left;
}

main [data-block="reviews"] .review-naam {
	margin: auto 0 0;
	color: #2a2622;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
}

@media (max-width: 1100px) {
	main [data-block="ervaringen"] .flexpool-kop,
	main [data-block="reviews"] .flexpool-kop {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 24px;
	}
}

@media (max-width: 767px) {
	main [data-hero="flexpool"] .flexpool-hero {
		min-height: 420px;
		padding-block: 48px;
	}

	main [data-hero="flexpool"] .flexpool-hero .container {
		flex-direction: column;
		align-items: flex-start;
	}

	main [data-hero="flexpool"] .flexpool-hero h1 {
		font-size: 48px;
		line-height: 48px;
		letter-spacing: 0;
	}

	main [data-hero="flexpool"] blockquote {
		padding-block: 64px;
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="reviews"] .flexpool-kop {
		margin-top: 80px;
	}

	main [data-block="ervaringen"] li {
		width: min(429px, 100%);
		min-height: 480px;
	}

	main [data-block="ervaringen"] summary {
		font-size: 20px;
		line-height: 28px;
	}
}

main [data-hero="vacatures"] + [data-block="vacatures"] {
	margin-top: 80px;
}

main [data-block="vacatures"] > .vacatures-balk {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

main [data-block="vacatures"] .vacatures-aantal {
	margin: 0;
	color: #2a2622;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="vacatures"] .vacatures-weergave {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: none;
}

main [data-block="vacatures"] .vacatures-weergave button {
	display: grid;
	place-items: center;
	width: 24px;
	height: 24px;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--color-line);
	cursor: pointer;
}

main [data-block="vacatures"] .vacatures-weergave button[aria-pressed="true"] {
	color: #352f2a;
}

main [data-block="vacatures"] .vacatures-weergave button:focus-visible {
	outline: 2px solid #352f2a;
	outline-offset: 2px;
}

main [data-block="vacatures"] > ul {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin: 45px 0 0;
	padding: 0;
	list-style: none;
}

main [data-block="vacatures"] > ul > li {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 52px;
	padding: 40px;
	border: 0;
	border-radius: 25px;
	background: var(--color-bg);
}

main [data-block="vacatures"] > ul > li[data-uitgelicht] {
	background: var(--color-brand-1);
}

main [data-block="vacatures"] > ul > li > div {
	display: flex;
	flex-direction: column;
	gap: 24px;
	width: 100%;
}

main [data-block="vacatures"] > ul > li h3 {
	margin: 0;
	color: var(--color-brand-4);
	font-size: 36px;
	font-weight: 400;
	line-height: 42px;
	letter-spacing: -0.36px;
}

main [data-block="vacatures"] .vacature-meta {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="vacatures"] .vacature-meta li {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="vacatures"] .vacature-meta svg {
	flex: none;
}

main [data-block="vacatures"] > ul > li > a {
	display: inline-flex;
	align-items: center;
	gap: 30px;
	margin-top: auto;
	padding: 16px 30px 20px;
	border: 1px solid #2a2622;
	border-radius: 15px;
	color: #2a2622;
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
	text-decoration: none;
}

main [data-block="vacatures"] > ul > li > a:hover,
main [data-block="vacatures"] > ul > li > a:focus-visible {
	background: #2a2622;
	color: var(--color-bg);
}

main [data-block="vacatures"] .vacature-tekst {
	display: none;
	margin: 0;
	color: #2a2622;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="vacatures"][data-weergave="lijst"] > ul {
	grid-template-columns: 1fr;
}

main [data-block="vacatures"][data-weergave="lijst"] > ul > li {
	gap: 40px;
	padding: 42px;
	border-radius: 20px;
}

main [data-block="vacatures"][data-weergave="lijst"] > ul > li h3 {
	font-size: 32px;
	line-height: 44px;
	letter-spacing: -0.32px;
}

main [data-block="vacatures"][data-weergave="lijst"] .vacature-meta {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 16px 48px;
}

main [data-block="vacatures"][data-weergave="lijst"] .vacature-tekst {
	display: block;
}

@media (max-width: 1100px) {
	main [data-block="vacatures"] > ul {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 700px) {
	main [data-hero="vacatures"] + [data-block="vacatures"] {
		margin-top: 48px;
	}

	main [data-block="vacatures"] .vacatures-aantal {
		font-size: 18px;
		line-height: 28px;
	}

	main [data-block="vacatures"] > ul {
		grid-template-columns: 1fr;
		margin-top: 24px;
	}

	main [data-block="vacatures"] > ul > li {
		gap: 32px;
		padding: 24px;
	}

	main [data-block="vacatures"] > ul > li h3 {
		font-size: 28px;
		line-height: 34px;
	}

	main [data-block="vacatures"] > ul > li > a {
		gap: 16px;
		padding: 12px 20px 14px;
		font-size: 20px;
		line-height: 28px;
	}

	main [data-block="vacatures"][data-weergave="lijst"] > ul > li {
		gap: 24px;
		padding: 24px;
	}

	main [data-block="vacatures"][data-weergave="lijst"] > ul > li h3 {
		font-size: 24px;
		line-height: 32px;
	}

	main [data-block="vacatures"][data-weergave="lijst"] .vacature-meta {
		gap: 8px 24px;
	}

	main [data-block="vacatures"][data-weergave="lijst"] .vacature-tekst {
		font-size: 18px;
		line-height: 28px;
	}
}

main [data-block="opdrachtgevers"] {
	margin-top: 0;
}

main [data-block="opdrachtgevers"] > ul {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="opdrachtgevers"] li {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 225px;
	padding: 24px;
	border: 0;
}

main [data-block="opdrachtgevers"] li::before,
main [data-block="opdrachtgevers"] li::after {
	content: "";
	position: absolute;
	background: var(--color-line);
}

main [data-block="opdrachtgevers"] li::before {
	top: 0;
	right: 0;
	width: 1px;
	height: 201px;
}

main [data-block="opdrachtgevers"] li::after {
	right: 12px;
	bottom: 0;
	left: 12px;
	height: 1px;
}

main [data-block="opdrachtgevers"] li:nth-child(4n + 1)::after {
	left: 0;
}

main [data-block="opdrachtgevers"] li:nth-child(4n)::after {
	right: 0;
}

main [data-block="opdrachtgevers"] img {
	width: auto;
	max-width: min(151px, 100%);
	height: auto;
	max-height: 77px;
	object-fit: contain;
}

@media (max-width: 900px) {
	main [data-block="opdrachtgevers"] > ul {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	main [data-block="opdrachtgevers"] li:nth-child(4n + 1)::after,
	main [data-block="opdrachtgevers"] li:nth-child(4n)::after {
		right: 12px;
		left: 12px;
	}

	main [data-block="opdrachtgevers"] li:nth-child(2n + 1)::after {
		left: 0;
	}

	main [data-block="opdrachtgevers"] li:nth-child(2n)::before {
		content: none;
	}

	main [data-block="opdrachtgevers"] li:nth-child(2n)::after {
		right: 0;
	}
}

@media (max-width: 560px) {
	main [data-block="opdrachtgevers"] > ul {
		grid-template-columns: 1fr;
	}

	main [data-block="opdrachtgevers"] li {
		min-height: 140px;
	}

	main [data-block="opdrachtgevers"] li:nth-child(n)::before {
		content: none;
	}

	main [data-block="opdrachtgevers"] li:nth-child(n)::after {
		right: 0;
		left: 0;
	}
}

main [data-block="formulier"] form {
	display: grid;
	gap: 1rem;
	max-width: 32rem;
}

main [data-block="formulier"] label {
	display: grid;
	gap: 0.35rem;
}

main [data-block="formulier"] input,
main [data-block="formulier"] textarea,
main [data-block="formulier"] select {
	font: inherit;
	padding: 0.7rem 0.8rem;
	border: 1px solid var(--color-line);
	background: transparent;
	color: inherit;
}

main [data-block="formulier"] textarea {
	min-height: 8rem;
	resize: vertical;
}

main [data-block="formulier"] label:has(input[type="checkbox"]) {
	display: flex;
	gap: 0.6rem;
	align-items: flex-start;
}

main [data-block="formulier"] label:has(input[type="checkbox"]) a,
main [data-block="formulier"] .formulier-privacy {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.12em;
}

main [data-block="formulier"] input[type="checkbox"] {
	width: 1.1rem;
	height: 1.1rem;
	margin-top: 0.25rem;
	padding: 0;
	flex: none;
}

main [data-block="formulier"] button {
	justify-self: start;
	padding: 0.9rem 1.4rem;
	border: 1px solid var(--color-text);
	background: var(--color-text);
	color: var(--color-bg);
	font: inherit;
	line-height: 1.2;
	cursor: pointer;
}

.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

main [data-block="formulier"][data-variant="contact"] {
	width: 100vw;
	max-width: 100vw;
	margin-top: 120px;
	margin-left: calc(50% - 50vw);
	box-sizing: border-box;
	padding: var(--space-band) var(--gutter);
	background: var(--color-bg);
}

main [data-block="formulier"][data-variant="contact"] h2 {
	width: min(var(--container), 100%);
	margin: 0 auto 54px;
	color: var(--color-brand-3);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-block="formulier"][data-variant="contact"] form {
	display: flex;
	flex-direction: column;
	gap: 54px;
	width: min(var(--container), 100%);
	max-width: none;
	margin-inline: auto;
}

main [data-block="formulier"][data-variant="contact"] .formulier-rij {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-3);
}

main [data-block="formulier"][data-variant="contact"] .formulier-vraag {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
}

main [data-block="formulier"][data-variant="contact"] label {
	display: block;
	margin: 0;
}

main [data-block="formulier"][data-variant="contact"] input:not([type="checkbox"]),
main [data-block="formulier"][data-variant="contact"] textarea {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin: 0;
	padding: var(--space-3);
	border: 0;
	border-radius: 15px;
	background: var(--color-white);
	color: #2a2622;
	font-family: inherit;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="formulier"][data-variant="contact"] input:not([type="checkbox"]) {
	height: 80px;
}

main [data-block="formulier"][data-variant="contact"] textarea {
	height: 240px;
	resize: vertical;
}

main [data-block="formulier"][data-variant="contact"] input::placeholder,
main [data-block="formulier"][data-variant="contact"] textarea::placeholder {
	color: var(--color-line);
	opacity: 1;
}

main [data-block="formulier"][data-variant="contact"] label:has(input[type="checkbox"]) {
	display: flex;
	align-items: center;
	gap: 16px;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="formulier"][data-variant="contact"] input[type="checkbox"] {
	appearance: none;
	width: 26px;
	height: 26px;
	margin: 0;
	padding: 0;
	flex-shrink: 0;
	border: 1px solid var(--color-brown);
	border-radius: 0;
	background: transparent;
}

main [data-block="formulier"][data-variant="contact"] input[type="checkbox"]:checked {
	background: var(--color-brown);
}

main [data-block="formulier"][data-variant="contact"] a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.12em;
}

main [data-block="formulier"][data-variant="contact"] button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	align-self: center;
	box-sizing: border-box;
	height: 68px;
	margin: 0;
	padding: 0 30px;
	border: 1px solid var(--color-brand-3);
	border-radius: 15px;
	background: var(--color-bg);
	color: var(--color-brand-3);
	font-family: inherit;
	font-size: 22px;
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
}

main [data-block="formulier"][data-variant="contact"] button:hover,
main [data-block="formulier"][data-variant="contact"] button:focus-visible {
	background: var(--color-brand-3);
	color: var(--color-bg);
}

main section[data-block="kaart"] {
	margin-block: var(--space-block);
}

main [data-block="kaart"] .kaart {
	border-radius: 25px;
	background: var(--color-brand-2);
	color: #f7f3ed;
}

main [data-block="kaart"] h2 {
	margin: 0;
	color: #f7f3ed;
	font-weight: 400;
	letter-spacing: -1.4px;
}

main [data-block="kaart"] p {
	margin: 0;
}

main [data-block="kaart"] .kaart__kop,
main [data-block="kaart"] .kaart__body,
main [data-block="kaart"] .kaart__extra {
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="kaart"] .kaart__kop {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

main [data-block="kaart"] .kaart__knop p {
	margin: 0;
}

main [data-block="kaart"] .kaart__knop a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 16px 30px 20px;
	border: 1px solid transparent;
	border-radius: 15px;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
	text-decoration: none;
}

main [data-block="kaart"][data-variant="1-kolom-tekst"] .kaart {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 48px;
	box-sizing: border-box;
	min-height: 474px;
	padding: 48px;
}

main [data-block="kaart"][data-variant="1-kolom-tekst"] h2 {
	max-width: 588px;
	font-size: 70px;
	line-height: 70px;
}

main [data-block="kaart"][data-variant="1-kolom-tekst"] .kaart__knop a {
	border-color: #f7f3ed;
	background: transparent;
	color: #f7f3ed;
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
}

main [data-block="kaart"][data-variant="1-kolom-tekst"] .kaart__knop a:hover,
main [data-block="kaart"][data-variant="1-kolom-tekst"] .kaart__knop a:focus-visible {
	background: #f7f3ed;
	color: var(--color-brand-2);
}

main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart {
	display: flex;
	flex-direction: column;
	gap: 64px;
	padding: 48px;
}

main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__boven {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

main [data-block="kaart"][data-variant="2-kolom-tekst"] h2 {
	font-size: 70px;
	line-height: 70px;
}

main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__kolommen {
	display: grid;
	grid-template-columns: minmax(0, 647fr) minmax(0, 424fr);
	column-gap: 112px;
	align-items: start;
}

main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__body,
main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__extra {
	color: #ffffff;
}

main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__extra ul {
	display: flex;
	flex-direction: column;
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__extra li {
	display: flex;
	align-items: center;
	gap: 16px;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__extra li::before {
	content: "";
	flex: none;
	width: 11px;
	height: 8px;
	background: var(--color-brand-1, #f7f3ed);
	-webkit-mask: url("../images/check.svg") center / contain no-repeat;
	mask: url("../images/check.svg") center / contain no-repeat;
}

main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__knop a {
	border-color: var(--color-brand-2);
	background: #f7f3ed;
	color: var(--color-brand-2);
}

main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__knop a:hover,
main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__knop a:focus-visible {
	border-color: var(--color-brand-3);
	color: var(--color-brand-3);
}

main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart {
	display: flex;
	align-items: stretch;
	min-height: 504px;
	overflow: hidden;
}

main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart__tekst {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: space-between;
	gap: 32px;
	min-width: 0;
	padding: 48px;
}

main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart__kop {
	gap: 32px;
	color: #ffffff;
}

main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] h2 {
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart__foto {
	position: relative;
	flex: none;
	width: min(653px, 48.7%);
	min-height: 0;
}

main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart__foto img {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
}

main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart__knop a {
	border-color: var(--color-brand-3);
	background: #f7f3ed;
	color: var(--color-brand-3);
}

main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart__knop a:hover,
main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart__knop a:focus-visible {
	background: var(--color-brand-3);
	color: #f7f3ed;
}

@media (max-width: 800px) {
	main [data-block="kaart"][data-variant="1-kolom-tekst"] .kaart,
	main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart {
		gap: 32px;
		min-height: 0;
		padding: 32px 24px;
	}

	main [data-block="kaart"][data-variant="1-kolom-tekst"] h2,
	main [data-block="kaart"][data-variant="2-kolom-tekst"] h2 {
		max-width: none;
		font-size: 36px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="kaart"] .kaart__kop,
	main [data-block="kaart"] .kaart__body,
	main [data-block="kaart"] .kaart__extra {
		font-size: 18px;
		line-height: 28px;
	}

	main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__kolommen {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 24px;
	}

	main [data-block="kaart"][data-variant="2-kolom-tekst"] .kaart__extra li {
		font-size: 16px;
		line-height: 24px;
	}

	main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart {
		flex-direction: column;
		min-height: 0;
	}

	main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart__tekst {
		padding: 32px 24px;
	}

	main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] h2 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="kaart"][data-variant="2-kolom-tekst-afbeelding"] .kaart__foto {
		width: 100%;
		height: 280px;
	}

	main [data-block="kaart"] .kaart__knop a,
	main [data-block="kaart"][data-variant="1-kolom-tekst"] .kaart__knop a {
		font-size: 18px;
		line-height: 24px;
	}
}

main [data-block="carrousel"] {
	margin-block: var(--space-block);
}

main [data-block="carrousel"] > h2 {
	margin: 0;
	color: #2a2622;
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-block="carrousel"] > p {
	margin: var(--space-4) 0 0;
	color: #2a2622;
	font-size: 32px;
	font-weight: 400;
	line-height: 44px;
	letter-spacing: -0.32px;
}

main [data-block="carrousel"] .carrousel {
	width: 100vw;
	max-width: 100vw;
	margin-top: var(--space-6);
	margin-left: calc(50% - 50vw);
	overflow: hidden;
}

main [data-block="carrousel"] .swiper-wrapper {
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="carrousel"] .swiper-slide {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	box-sizing: border-box;
	width: 429px;
	height: 550px;
	margin: 0;
	padding: 40px 40px 90px;
	border: 0;
	border-radius: 20px;
	background: var(--carousel-1, var(--color-brand-4));
	color: var(--color-offwhite);
	text-align: center;
}

main [data-block="carrousel"] .swiper-slide:nth-child(4n + 2) {
	background: var(--carousel-2, var(--color-brand-2));
}

main [data-block="carrousel"] .swiper-slide:nth-child(4n + 3) {
	background: var(--carousel-3, var(--color-brand-3));
}

main [data-block="carrousel"] .swiper-slide:nth-child(4n + 4) {
	background: var(--carousel-4, var(--color-brand-4));
}

main [data-block="carrousel"] .swiper-slide h3 {
	margin: 0;
	color: inherit;
	font-size: 32px;
	font-weight: 400;
	line-height: 44px;
	letter-spacing: -0.32px;
}

main [data-block="carrousel"] .swiper-slide p {
	margin: 10px 0 0;
	color: inherit;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
	letter-spacing: 0;
}

@media (max-width: 767px) {
	main [data-block="carrousel"] > h2 {
		color: var(--color-brand-2);
		font-size: 32px;
		font-weight: 500;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="carrousel"] > p {
		margin-top: var(--space-4);
		font-size: 24px;
		line-height: 36px;
		letter-spacing: 0;
	}

	main [data-block="carrousel"] .carrousel {
		margin-top: 40px;
	}

	main [data-block="carrousel"] .swiper-slide {
		width: 329px;
		height: 400px;
		padding: 32px 32px 56px;
	}

	main [data-block="carrousel"] .swiper-slide h3 {
		font-size: 32px;
		font-weight: 500;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="carrousel"] .swiper-slide p {
		font-size: 16px;
		line-height: 24px;
	}
}

main [data-block="agenda"] {
	margin-block: var(--space-block);
}

main [data-block="agenda"] > h2 {
	margin: 0;
	color: #2a2622;
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-block="agenda"] .carrousel {
	width: 100vw;
	max-width: 100vw;
	margin-top: 40px;
	margin-left: calc(50% - 50vw);
	overflow: hidden;
}

main [data-block="agenda"] .swiper-wrapper {
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="agenda"] .swiper-slide {
	width: 431px;
	height: auto;
	margin: 0;
}

main [data-block="agenda"] .swiper-slide a,
main [data-block="agenda"] .agenda-grid > li > a {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

main [data-block="agenda"] .agenda-kaart__foto {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;
	height: 283px;
	padding: var(--space-4);
	overflow: hidden;
	border-radius: 20px 20px 0 0;
	background: var(--color-line);
}

main [data-block="agenda"] .agenda-kaart__foto img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	aspect-ratio: auto;
	object-fit: cover;
	border-radius: 20px 20px 0 0;
}

main [data-block="agenda"] .agenda-kaart__datum {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	align-self: flex-start;
	margin: 0;
	padding: 8px var(--space-2);
	border-radius: 10px;
	background: var(--color-bg);
	color: #2a2622;
	line-height: normal;
	text-align: center;
}

main [data-block="agenda"] .agenda-kaart__datum span:first-child {
	font-size: 28px;
	font-weight: 600;
	line-height: normal;
}

main [data-block="agenda"] .agenda-kaart__datum span:last-child {
	font-size: 14px;
	font-weight: 400;
	line-height: normal;
}

main [data-block="agenda"] .agenda-kaart__tekst {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;
	height: 270px;
	padding: var(--space-4);
	border-radius: 0 0 20px 20px;
	background: var(--color-bg);
	color: #2a2622;
	transition: background-color 0.2s ease;
}

main [data-block="agenda"] .agenda-kaart:hover .agenda-kaart__tekst,
main [data-block="agenda"] .agenda-kaart:focus-within .agenda-kaart__tekst {
	background: var(--color-line);
}

main [data-block="agenda"] .agenda-kaart__tekst h2 {
	margin: 0;
	max-width: 367px;
	color: #2a2622;
	font-size: 36px;
	font-weight: 400;
	line-height: 48px;
	letter-spacing: -0.36px;
}

main [data-block="agenda"] .agenda-kaart__meta {
	display: flex;
	flex-direction: column;
	gap: var(--space-1);
}

main [data-block="agenda"] .agenda-kaart__meta p {
	margin: 0;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
	letter-spacing: 0;
}

main [data-block="agenda"]:has(.agenda-grid) {
	margin-top: var(--space-6);
	margin-bottom: var(--space-6);
}

main [data-block="agenda"] .agenda-aantal {
	margin: 0 0 var(--space-4);
	color: #2a2622;
	font-size: 26px;
	font-weight: 400;
	line-height: 36px;
}

main [data-block="agenda"] .agenda-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--space-4) var(--space-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

main [data-block="agenda"] .agenda-meer {
	margin: var(--space-band) 0 0;
}

main [data-block="agenda"] .agenda-meer a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 72px;
	padding: 0 30px;
	border-radius: var(--radius);
	background: var(--color-brand-2);
	color: var(--color-bg);
	font-size: 26px;
	font-weight: 400;
	line-height: 1;
	letter-spacing: 0;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

main [data-block="agenda"] .agenda-meer a:hover,
main [data-block="agenda"] .agenda-meer a:focus-visible {
	background: var(--color-brand-4);
}

@media (max-width: 767px) {
	main [data-block="agenda"] > h2 {
		font-size: 32px;
		font-weight: 500;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="agenda"] .swiper-slide {
		width: 329px;
	}

	main [data-block="agenda"] .agenda-grid {
		grid-template-columns: minmax(0, 1fr);
	}

	main [data-block="agenda"] .agenda-kaart__foto {
		height: 216px;
	}

	main [data-block="agenda"] .agenda-kaart__tekst {
		height: auto;
		min-height: 200px;
	}

	main [data-block="agenda"] .agenda-kaart__tekst h2 {
		max-width: none;
		font-size: 28px;
		line-height: 36px;
		letter-spacing: 0;
	}

	main [data-block="nieuws"] {
		margin-top: var(--space-band);
	}

	main [data-block="nieuws"] > ul {
		gap: var(--space-4);
	}

	main [data-block="nieuws"] .nieuws-kaart__foto {
		height: 225px;
		border-radius: 25px 25px 0 0;
	}

	main [data-block="nieuws"] .nieuws-kaart__merk {
		font-size: 16px;
		line-height: 24px;
	}

	main [data-block="nieuws"] .nieuws-kaart__tekst {
		height: 225px;
		border-radius: 0 0 25px 25px;
	}

	main [data-block="nieuws"] .nieuws-kaart__tekst h2 {
		max-width: none;
		font-size: 20px;
		line-height: 28px;
		letter-spacing: 0;
	}

	main [data-block="nieuws"] .nieuws-kaart__tekst p {
		font-size: 16px;
		line-height: 24px;
	}

	body:has([data-hero="contact"]) main [data-block="locaties"] {
		margin-top: 64px;
	}

	main [data-block="locaties"] > ul {
		gap: 16px;
	}

	main [data-block="locaties"] li {
		justify-content: flex-start;
		gap: 8px;
		min-height: 0;
		padding: 24px 24px 32px;
	}

	main [data-block="locaties"] li h2 {
		font-size: 24px;
		line-height: 36px;
		letter-spacing: 0;
	}

	main [data-block="locaties"] li p {
		font-size: 16px;
		line-height: 24px;
	}

	main [data-block="formulier"][data-variant="contact"] {
		padding-block: 48px;
	}

	main [data-block="formulier"][data-variant="contact"] h2 {
		margin-bottom: var(--space-4);
		font-size: 36px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="formulier"][data-variant="contact"] form {
		gap: var(--space-4);
	}

	main [data-block="formulier"][data-variant="contact"] .formulier-rij {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}
}

main [data-nieuws-kop] {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 24px;
	margin: 0;
}

main [data-hero="nieuws-item"] + [data-block="inhoud"] {
	margin-top: 48px;
}

main [data-nieuws-kop] p {
	margin: 0;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-nieuws-kop] a {
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

body.single-nieuws main [data-block="inhoud"] > img {
	aspect-ratio: 1340 / 622;
	margin-top: 48px;
	border-radius: 25px;
}

main [data-block="inhoud"] dl {
	display: grid;
	grid-template-columns: 12rem minmax(0, 1fr);
	gap: 0.5rem 1.5rem;
	margin: 1.5rem 0 0;
}

main [data-block="inhoud"] dt,
main [data-block="inhoud"] dd {
	margin: 0;
}

@media (max-width: 800px) {
	main [data-block="locaties"] > ul,
	main [data-block="nieuws"] > ul,
	main [data-block="handboek"] > ul,
	main [data-block="trainingen"] > ul,
	main [data-block="leerlijnen"] > ul,
	main [data-block="doelgroepen"] > ul,
	main [data-block="ervaringen"] > ul,
	main [data-block="reviews"] > ul,
	main [data-block="diensten"],
	body.single-doelgroep main [data-block="diensten"] > ul,
	main [data-block="inhoud"] dl {
		grid-template-columns: 1fr;
	}

	main [data-block="handboek"] nav ul {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.home main [data-block="diensten"] > h2,
	body.home main [data-block="diensten"] > div,
	body.home main [data-block="diensten"] > ul {
		grid-column: 1;
		grid-row: auto;
	}

	body.home main [data-block="diensten"] {
		grid-template-columns: minmax(0, 1fr);
		border-top: 0;
		padding-top: 0;
	}

	body.home main [data-block="diensten"] > div {
		margin-top: var(--space-4);
		color: var(--color-text);
		font-size: 20px;
		line-height: 34px;
	}

	body.home main [data-block="diensten"] > h2 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}

	body.home main [data-block="diensten"] > ul {
		gap: var(--space-2);
		margin-top: 40px;
	}

	body.home main [data-block="diensten"] .dienst-kaart {
		height: 480px;
		border-radius: 20px;
	}

	body.home main [data-block="diensten"] .dienst-kaart__link {
		gap: var(--space-3);
		padding: var(--space-4);
	}

	body.home main [data-block="diensten"] .dienst-kaart img,
	body.home main [data-block="diensten"] .dienst-kaart__link::after {
		border-radius: 20px;
	}

	body.home main [data-block="diensten"] .dienst-kaart h3 {
		color: var(--color-bg);
		font-size: 36px;
		line-height: 40px;
		letter-spacing: 0;
	}

	body.home main [data-block="diensten"] .dienst-kaart__tekst p {
		color: var(--color-bg);
		font-size: 20px;
		line-height: 24px;
	}

	body.home main [data-block="diensten"] .dienst-kaart__knop {
		height: 60px;
		padding: 0 var(--space-3);
		border-color: var(--color-bg);
		color: var(--color-bg);
		font-size: 20px;
		font-weight: 400;
	}
}

a {
	color: inherit;
	text-decoration-thickness: 0.05em;
	text-underline-offset: 0.3em;
}

a[data-stijl] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.9rem 1.4rem;
	border: 1px solid var(--color-text);
	background: transparent;
	color: var(--color-text);
	font: inherit;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
}

a[data-stijl="primair"] {
	background: var(--color-text);
	color: var(--color-bg);
}

a[data-stijl="secundair"] {
	background: var(--color-line);
	border-color: var(--color-line);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0 0 0.4em;
	font-weight: 400;
}

h1 {
	font-size: clamp(40px, 7vw, var(--text-h1-size));
	font-weight: var(--text-h1-weight);
	line-height: var(--text-h1-line);
	letter-spacing: var(--text-h1-tracking);
}

h2 {
	font-size: clamp(32px, 5vw, var(--text-h2-size));
	font-weight: var(--text-h2-weight);
	line-height: var(--text-h2-line);
	letter-spacing: var(--text-h2-tracking);
}

h3 {
	font-size: clamp(26px, 3vw, var(--text-h3-size));
	font-weight: var(--text-h3-weight);
	line-height: 1.25;
	letter-spacing: var(--text-h3-tracking);
}

h4 {
	font-size: var(--text-h4-size);
	font-weight: var(--text-h4-weight);
	line-height: var(--text-h4-line);
	letter-spacing: var(--text-h4-tracking);
}

h5 {
	font-size: var(--text-h5-size);
	font-weight: var(--text-h5-weight);
	line-height: var(--text-h5-line);
	letter-spacing: var(--text-h5-tracking);
}

h6 {
	font-size: var(--text-h6-size);
	font-weight: var(--text-h6-weight);
	line-height: var(--text-h6-line);
	letter-spacing: var(--text-h6-tracking);
}

p {
	margin: 0 0 1em;
}

.container {
	width: min(var(--container), calc(100% - 2 * var(--gutter)));
	margin-inline: auto;
}

main {
	width: min(var(--container), calc(100% - 2 * var(--gutter)));
	margin-inline: auto;
	padding-block: var(--space-5);
}

/* Astare-home: header over de hero, gradient in plaats van de zwermfoto. */

body.home.site-theme-astare .site-header {
	position: absolute;
	inset-inline: 0;
	top: 0;
	z-index: 20;
	color: var(--nav-color-hero);
}

body.admin-bar.home.site-theme-astare .site-header,
body.admin-bar.home.site-theme-werkenbij .site-header,
body.admin-bar.home.site-theme-academie .site-header,
body.admin-bar.home.site-theme-jobcoaching .site-header,
body.admin-bar:not(.home):has(main [data-block="hero"]) .site-header {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar.home.site-theme-astare .site-header,
	body.admin-bar.home.site-theme-werkenbij .site-header,
	body.admin-bar.home.site-theme-academie .site-header,
	body.admin-bar.home.site-theme-jobcoaching .site-header,
	body.admin-bar:not(.home):has(main [data-block="hero"]) .site-header {
		top: 46px;
	}
}

body.home.site-theme-astare main {
	padding-top: 0;
}

body.home.site-theme-astare main [data-block="hero"] {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	box-sizing: border-box;
	padding: 311px var(--gutter) 292px;
	background: linear-gradient(180deg, #89a5af 0%, #cee6ed 46.635%, #f7f3ed 75.481%, #ffffff 100%);
	color: #2a2622;
	text-align: center;
}

body.home.site-theme-astare main [data-block="hero"] + [data-block="diensten"] {
	margin-top: 0;
}

body.home.site-theme-astare main [data-block="hero"] .hero-home__kop {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-band);
}

body.home.site-theme-astare main [data-block="hero"] h1,
body.home.site-theme-astare main [data-block="hero"] .hero-home__regel {
	margin: 0;
	color: #2a2622;
	font-family: "Museo Slab", Georgia, "Times New Roman", serif;
	font-size: 50px;
	font-weight: 300;
	line-height: 56px;
	letter-spacing: -1px;
}

body.home.site-theme-astare main [data-block="hero"] .hero-home__regel {
	margin-top: 281px;
}

body.home.site-theme-astare main [data-block="hero"] .hero-home__tekst {
	max-width: 1112px;
	margin: 362px auto 0;
	color: #2a2622;
	font-size: 36px;
	font-weight: 400;
	line-height: 48px;
	letter-spacing: -0.36px;
}

body.home.site-theme-astare main [data-block="hero"] .hero-home__kop p {
	margin: 0;
}

body.home.site-theme-astare main [data-block="hero"] .hero-home__kop a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	box-sizing: border-box;
	height: 72px;
	padding: 0 30px;
	border: 1px solid #2a2622;
	border-radius: var(--radius);
	background: transparent;
	color: #2a2622;
	font-size: 26px;
	font-weight: 300;
	line-height: 1;
	letter-spacing: 0;
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease;
}

body.home.site-theme-astare main [data-block="hero"] .hero-home__kop a:hover,
body.home.site-theme-astare main [data-block="hero"] .hero-home__kop a:focus-visible {
	background: #2a2622;
	color: var(--color-offwhite);
}

body.home.site-theme-astare main [data-block="hero"] .hero-home__kop svg {
	display: block;
	flex: none;
}

@media (max-width: 767px) {
	body.home.site-theme-astare main [data-block="hero"] {
		padding: 274px var(--gutter) 160px;
	}

	body.home.site-theme-astare main [data-block="hero"] .hero-home__kop {
		gap: var(--space-4);
	}

	body.home.site-theme-astare main [data-block="hero"] h1 {
		font-size: 32px;
		line-height: 32px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-astare main [data-block="hero"] .hero-home__regel {
		margin-top: 240px;
		font-size: 32px;
		line-height: 32px;
		letter-spacing: -0.8px;
	}

	body.home.site-theme-astare main [data-block="hero"] .hero-home__tekst {
		max-width: none;
		margin-top: 160px;
		color: var(--color-text);
		font-size: 24px;
		line-height: 36px;
		letter-spacing: 0;
	}

	body.home.site-theme-astare main [data-block="hero"] .hero-home__kop a {
		height: 62px;
		padding: 0 var(--space-3);
		font-size: 20px;
		font-weight: 400;
	}
}

/* Uitzendbureau-home: dezelfde opbouw als Astare, zonder de zwermfoto. */

body.home.site-theme-werkenbij main {
	padding-top: 0;
}

body.home.site-theme-werkenbij .site-header {
	position: absolute;
	inset-inline: 0;
	top: 0;
	z-index: 20;
	color: var(--nav-color-hero);
}

body.home.site-theme-werkenbij .site-nav__list .menu-cta > a:hover,
body.home.site-theme-werkenbij .site-nav__list .menu-cta > a:focus-visible {
	background: var(--color-white);
	color: var(--color-brand-4);
}

body.home.site-theme-werkenbij main [data-block="hero"] {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	box-sizing: border-box;
	padding: 130px max(var(--gutter), calc((100vw - var(--container)) / 2)) 0;
	background-color: var(--color-offwhite);
	background-image: linear-gradient(180deg, #7f4829 0%, #c48357 10%, #bf7340 30%, #f7d2ad 54%, #f7f3ed 70%, var(--color-offwhite) 100%);
	background-repeat: no-repeat;
	background-size: 100% 1396px;
	color: #2a2622;
}

body.home.site-theme-werkenbij main [data-block="hero"] + section {
	margin-top: 160px;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__regel {
	margin: 0;
	color: var(--color-white);
	font-family: "Museo Slab", Georgia, "Times New Roman", serif;
	font-size: 50px;
	font-weight: 300;
	line-height: 56px;
	letter-spacing: -1px;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: end;
	column-gap: var(--space-4);
	margin-top: 334px;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop:not(:has(a)) {
	display: block;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop h1 {
	grid-column: 2;
	grid-row: 1;
	margin: 0;
	color: var(--color-brand-4);
	font-size: 120px;
	font-weight: 300;
	line-height: 100px;
	letter-spacing: -2.4px;
	text-align: right;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop h1 span {
	display: block;
	font-weight: 500;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop p {
	grid-column: 1;
	grid-row: 1;
	margin: 0;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop a {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	box-sizing: border-box;
	padding: 16px 30px 20px;
	border: 1px solid var(--color-brand-4);
	border-radius: var(--radius);
	background: transparent;
	color: var(--color-brand-4);
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
	letter-spacing: 0;
	text-decoration: none;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop a:hover,
body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop a:focus-visible {
	background: var(--color-brand-4);
	color: var(--color-bg);
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop svg {
	display: block;
	flex: none;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__tekst {
	max-width: 1342px;
	margin: 344px 0 0;
	color: #2a2622;
	font-size: 32px;
	font-weight: 400;
	line-height: 44px;
	letter-spacing: -0.32px;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto {
	position: relative;
	display: flex;
	align-items: flex-end;
	aspect-ratio: 1340 / 622;
	margin-top: 104px;
	padding: 48px 54px;
	overflow: hidden;
	border-radius: 25px;
	isolation: isolate;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto img {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(201, 185, 170, 0.5);
	mix-blend-mode: multiply;
	pointer-events: none;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 48px;
	max-width: 969px;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst > div {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst h2 {
	max-width: 653px;
	margin: 0;
	color: var(--color-bg);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst p {
	max-width: 838px;
	margin: 0;
	color: var(--color-bg);
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	padding: 16px 30px 20px;
	border: 1px solid var(--color-bg);
	border-radius: var(--radius);
	background: transparent;
	color: var(--color-bg);
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
	text-decoration: none;
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst a:hover,
body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst a:focus-visible {
	background: var(--color-bg);
	color: var(--color-brand-4);
}

body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__quote {
	max-width: 1342px;
	margin: 160px auto 0;
	color: var(--color-line);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
	text-align: center;
}

@media (max-width: 767px) {
	body.home.site-theme-werkenbij main [data-block="hero"] {
		padding-top: 120px;
		background-size: 100% 720px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__regel {
		font-size: 32px;
		line-height: 36px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop {
		margin-top: 120px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop h1 {
		font-size: 40px;
		line-height: 44px;
		letter-spacing: -0.8px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__tekst {
		margin-top: 80px;
		font-size: 22px;
		line-height: 32px;
		letter-spacing: 0;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto {
		aspect-ratio: auto;
		min-height: 280px;
		margin-top: 48px;
		padding: 32px 24px;
		border-radius: 20px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst {
		gap: 24px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst h2 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst p {
		font-size: 18px;
		line-height: 28px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__foto-tekst a {
		padding: 12px 20px 14px;
		font-size: 18px;
		line-height: 24px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__quote {
		margin-top: 64px;
		font-size: 32px;
		line-height: 36px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] .hero-home__kop a {
		padding: 12px 20px 14px;
		font-size: 18px;
		line-height: 24px;
	}

	body.home.site-theme-werkenbij main [data-block="hero"] + section {
		margin-top: 80px;
	}
}

/* Academie-home: dezelfde opbouw, in de roze gradient. De foto hoort bij de hero; het trainingsaanbod blijft een flex-regel. */

body.home.site-theme-academie main {
	padding-top: 0;
}

body.home.site-theme-academie .site-header {
	position: absolute;
	inset-inline: 0;
	top: 0;
	z-index: 20;
	color: var(--nav-color-hero);
}

body.home.site-theme-academie .site-nav__list .menu-cta > a:hover,
body.home.site-theme-academie .site-nav__list .menu-cta > a:focus-visible {
	background: var(--color-white);
	color: var(--color-brand-4);
}

body.home.site-theme-academie main [data-block="hero"] {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	box-sizing: border-box;
	padding: 130px max(var(--gutter), calc((100vw - var(--container)) / 2)) 0;
	background-color: var(--color-offwhite);
	background-image: linear-gradient(180deg, #8e4048 0%, #c99da0 10%, #ca717b 30%, #f4d9de 54%, #f7f3ed 70%, var(--color-offwhite) 100%);
	background-repeat: no-repeat;
	background-size: 100% 1396px;
	color: #2a2622;
}

body.home.site-theme-academie main [data-block="hero"] + section {
	margin-top: 128px;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__regel {
	margin: 0;
	color: var(--color-white);
	font-family: "Museo Slab", Georgia, "Times New Roman", serif;
	font-size: 50px;
	font-weight: 300;
	line-height: 56px;
	letter-spacing: -1px;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__kop {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: end;
	column-gap: var(--space-4);
	margin-top: 334px;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__kop:not(:has(a)) {
	display: block;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__kop h1 {
	grid-column: 2;
	grid-row: 1;
	margin: 0;
	color: var(--color-brand-4);
	font-size: 120px;
	font-weight: 300;
	line-height: 100px;
	letter-spacing: -2.4px;
	text-align: right;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__kop h1 span {
	display: block;
	font-weight: 500;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__kop a {
	grid-column: 1;
	grid-row: 1;
	display: inline-flex;
	align-items: center;
	gap: 16px;
	box-sizing: border-box;
	padding: 16px 30px 20px;
	border: 1px solid var(--color-brand-4);
	border-radius: var(--radius);
	background: transparent;
	color: var(--color-brand-4);
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
	letter-spacing: 0;
	text-decoration: none;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__kop a:hover,
body.home.site-theme-academie main [data-block="hero"] .hero-home__kop a:focus-visible {
	background: var(--color-brand-4);
	color: var(--color-bg);
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__kop svg {
	display: block;
	flex: none;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__tekst {
	max-width: 1342px;
	margin: 344px 0 0;
	scroll-margin-top: 24px;
	color: #2a2622;
	font-size: 32px;
	font-weight: 400;
	line-height: 44px;
	letter-spacing: -0.32px;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld {
	position: relative;
	display: flex;
	align-items: flex-end;
	aspect-ratio: 1340 / 622;
	margin: 104px 0 0;
	padding: 48px 54px;
	overflow: hidden;
	border-radius: 25px;
	isolation: isolate;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld img {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(201, 185, 170, 0.75);
	mix-blend-mode: multiply;
	pointer-events: none;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-tekst {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 48px;
	max-width: 969px;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-tekst > div:first-child {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-tekst h2 {
	max-width: 653px;
	margin: 0;
	color: var(--color-bg);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-tekst p {
	max-width: 838px;
	margin: 0;
	color: var(--color-bg);
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-knoppen {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-knoppen a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	padding: 16px 30px 20px;
	border: 1px solid var(--color-bg);
	border-radius: var(--radius);
	background: transparent;
	color: var(--color-bg);
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
	text-decoration: none;
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-knoppen a:hover,
body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-knoppen a:focus-visible {
	background: var(--color-bg);
	color: var(--color-brand-4);
}

body.home.site-theme-academie main [data-block="hero"] .hero-home__quote {
	max-width: 1342px;
	margin: 160px auto 0;
	color: var(--color-line);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
	text-align: center;
}

@media (max-width: 1100px) {
	body.home.site-theme-academie main [data-block="hero"] .hero-home__kop {
		margin-top: 160px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__kop h1 {
		font-size: 72px;
		line-height: 68px;
		letter-spacing: -1.44px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__tekst {
		margin-top: 120px;
	}
}

@media (max-width: 767px) {
	body.home.site-theme-academie main [data-block="hero"] {
		padding-top: 120px;
		background-size: 100% 720px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__regel {
		font-size: 32px;
		line-height: 36px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__kop {
		grid-template-columns: 1fr;
		row-gap: 32px;
		margin-top: 80px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__kop h1,
	body.home.site-theme-academie main [data-block="hero"] .hero-home__kop a {
		grid-column: 1;
		justify-self: start;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__kop h1 {
		grid-row: 1;
		font-size: 48px;
		line-height: 48px;
		letter-spacing: -0.96px;
		text-align: left;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__kop a {
		grid-row: 2;
		padding: 12px 20px 14px;
		font-size: 18px;
		line-height: 24px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__tekst {
		margin-top: 64px;
		font-size: 22px;
		line-height: 32px;
		letter-spacing: 0;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld {
		aspect-ratio: auto;
		min-height: 420px;
		margin-top: 48px;
		padding: 32px 24px;
		border-radius: 20px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-tekst {
		gap: 24px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-tekst h2 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-tekst p {
		font-size: 18px;
		line-height: 28px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-knoppen {
		gap: 12px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__beeld-knoppen a {
		padding: 12px 20px 14px;
		font-size: 18px;
		line-height: 24px;
	}

	body.home.site-theme-academie main [data-block="hero"] .hero-home__quote {
		margin-top: 64px;
		font-size: 32px;
		line-height: 36px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-academie main [data-block="hero"] + section {
		margin-top: 64px;
	}
}

/* Jobcoaching-home: gradient in plaats van de zwermfoto. De fotokaart is vast; de flex-regel met dezelfde titel blijft staan. */

body.home.site-theme-jobcoaching main {
	padding-top: 0;
}

body.home.site-theme-jobcoaching .site-header {
	position: absolute;
	inset-inline: 0;
	top: 0;
	z-index: 20;
	color: #f7f3ed;
}

body.home.site-theme-jobcoaching .site-nav__list .menu-cta > a:hover,
body.home.site-theme-jobcoaching .site-nav__list .menu-cta > a:focus-visible {
	background: var(--color-offwhite);
	color: var(--color-brand-4);
}

body.home.site-theme-jobcoaching main [data-block="hero"] {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	box-sizing: border-box;
	padding: 130px max(var(--gutter), calc((100vw - var(--container)) / 2)) 0;
	background-color: var(--color-offwhite);
	background-image: linear-gradient(180deg, #3e5434 0%, #3e5434 12%, #588758 22%, #c6d8be 40%, #f7f3ed 70%, #fffefc 100%);
	background-repeat: no-repeat;
	background-size: 100% 1396px;
	color: #2a2622;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__regel {
	margin: 0;
	color: #f7f3ed;
	font-family: "Museo Slab", Georgia, "Times New Roman", serif;
	font-size: 50px;
	font-weight: 300;
	line-height: 56px;
	letter-spacing: -1px;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: end;
	column-gap: 32px;
	margin-top: 334px;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop h1 {
	grid-column: 2;
	grid-row: 1;
	margin: 0;
	color: var(--color-brand-4);
	font-size: 120px;
	font-weight: 300;
	line-height: 100px;
	letter-spacing: -2.4px;
	text-align: right;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop h1 span {
	display: block;
	font-weight: 500;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop a {
	grid-column: 1;
	grid-row: 1;
	display: inline-flex;
	align-items: center;
	gap: 16px;
	box-sizing: border-box;
	padding: 16px 30px 20px;
	border: 1px solid var(--color-brand-4);
	border-radius: var(--radius);
	background: transparent;
	color: var(--color-brand-4);
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
	text-decoration: none;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop a:hover,
body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop a:focus-visible {
	background: var(--color-brand-4);
	color: #f7f3ed;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop svg {
	display: block;
	flex: none;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__tekst {
	max-width: 1342px;
	margin: 344px 0 0;
	scroll-margin-top: 24px;
	color: #2a2622;
	font-size: 32px;
	font-weight: 400;
	line-height: 44px;
	letter-spacing: -0.32px;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld {
	position: relative;
	display: flex;
	align-items: flex-end;
	aspect-ratio: 1340 / 622;
	margin: 104px 0 0;
	padding: 48px 54px;
	overflow: hidden;
	border-radius: 25px;
	isolation: isolate;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld img {
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	height: 100%;
	object-fit: cover;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(201, 185, 170, 0.75);
	mix-blend-mode: multiply;
	pointer-events: none;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 48px;
	max-width: 969px;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst > div:first-child {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst h2 {
	max-width: 653px;
	margin: 0;
	color: #f7f3ed;
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst p {
	max-width: 838px;
	margin: 0;
	color: #f7f3ed;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst > a {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	padding: 16px 30px 20px;
	border: 1px solid #f7f3ed;
	border-radius: var(--radius);
	color: #f7f3ed;
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
	text-decoration: none;
}

body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst > a:hover,
body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst > a:focus-visible {
	background: #f7f3ed;
	color: var(--color-brand-4);
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] {
	margin-top: 84px;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] > ul {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] li {
	border: 0;
	padding: 0;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	min-height: 206px;
	padding: 48px;
	border-radius: 25px;
	background: var(--color-brand-2);
	color: var(--color-offwhite);
	text-decoration: none;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] li:first-child a {
	background: var(--color-brand-3);
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] a > span:first-child {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] h2 {
	margin: 0;
	color: var(--color-offwhite);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] p {
	max-width: 838px;
	margin: 0;
	color: var(--color-offwhite);
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] .doelgroep-meer {
	display: inline-flex;
	flex: none;
	align-items: center;
	gap: 16px;
	padding: 16px 30px 20px;
	border: 1px solid #2a2622;
	border-radius: var(--radius);
	background: transparent;
	color: #2a2622;
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] .doelgroep-meer svg {
	display: block;
	flex: none;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] li:first-child .doelgroep-meer {
	border-color: #f7f3ed;
	background: #f7f3ed;
	color: #2a2622;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] a:hover .doelgroep-meer,
body.home.site-theme-jobcoaching main [data-block="doelgroepen"] a:focus-visible .doelgroep-meer {
	background: #2a2622;
	color: #f7f3ed;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] li:first-child a:hover .doelgroep-meer,
body.home.site-theme-jobcoaching main [data-block="doelgroepen"] li:first-child a:focus-visible .doelgroep-meer {
	border-color: var(--color-brand-4);
	background: var(--color-brand-4);
	color: #f7f3ed;
}

body.home.site-theme-jobcoaching main [data-block="doelgroepen"] .hero-home__quote {
	max-width: 1342px;
	margin: 138px auto 0;
	color: var(--color-line);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
	text-align: center;
}

body.home.site-theme-jobcoaching main [data-block="tekst"] {
	max-width: none;
	color: var(--color-line);
	font-size: 70px;
	line-height: 70px;
	letter-spacing: -1.4px;
}

body.home.site-theme-jobcoaching main [data-block="regels"] h3 {
	color: var(--color-brand-3);
}

@media (max-width: 1100px) {
	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop {
		margin-top: 160px;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop h1 {
		font-size: 72px;
		line-height: 68px;
		letter-spacing: -1.44px;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__tekst {
		margin-top: 120px;
	}
}

@media (max-width: 767px) {
	body.home.site-theme-jobcoaching main [data-block="hero"] {
		padding-top: 116px;
		background-size: 100% 900px;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__regel {
		font-size: 32px;
		line-height: 32px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 68px;
		margin-top: 292px;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop h1 {
		align-self: flex-end;
		font-size: 48px;
		line-height: 48px;
		letter-spacing: -0.96px;
		text-align: right;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__kop a {
		padding: 12px 20px 14px;
		font-size: 18px;
		line-height: 24px;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__tekst {
		margin-top: 200px;
		font-size: 22px;
		line-height: 32px;
		letter-spacing: 0;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld {
		aspect-ratio: auto;
		min-height: 480px;
		margin-top: 64px;
		padding: 32px 24px;
		border-radius: 20px;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst {
		gap: 32px;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst h2 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst p {
		font-size: 18px;
		line-height: 28px;
	}

	body.home.site-theme-jobcoaching main [data-block="hero"] .hero-home__beeld-tekst > a {
		padding: 12px 20px 14px;
		font-size: 18px;
		line-height: 24px;
	}

	body.home.site-theme-jobcoaching main [data-block="doelgroepen"] {
		margin-top: 40px;
	}

	body.home.site-theme-jobcoaching main [data-block="doelgroepen"] a {
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
		min-height: 0;
		padding: 32px 24px;
		border-radius: 20px;
	}

	body.home.site-theme-jobcoaching main [data-block="doelgroepen"] h2 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-jobcoaching main [data-block="doelgroepen"] p {
		font-size: 18px;
		line-height: 28px;
	}

	body.home.site-theme-jobcoaching main [data-block="doelgroepen"] .doelgroep-meer {
		padding: 12px 20px 14px;
		font-size: 18px;
		line-height: 24px;
	}

	body.home.site-theme-jobcoaching main [data-block="doelgroepen"] .hero-home__quote,
	body.home.site-theme-jobcoaching main [data-block="tekst"] {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	body.home.site-theme-jobcoaching main [data-block="doelgroepen"] .hero-home__quote {
		margin-top: 64px;
	}
}

/* Generieke hero: titelband, optionele foto, optionele introductie. */

body:not(.home):has(main [data-block="hero"]) .site-header {
	position: absolute;
	inset-inline: 0;
	top: 0;
	z-index: 20;
	background: transparent;
	color: var(--hero-fg);
}

body:not(.home):has(main [data-block="hero"]) .site-nav__list .menu-cta > a:hover {
	background: var(--hero-fg);
	color: var(--hero-bg);
}

body:not(.home):has(main [data-block="hero"]) main {
	padding-top: 0;
}

body:not(.home) main [data-block="hero"] .hero-band,
body:not(.home) main [data-block="hero"] .hero-foto,
body:not(.home) main [data-block="hero"] .hero-intro {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	box-sizing: border-box;
}

body:not(.home) main [data-block="hero"] .hero-band {
	display: flex;
	align-items: flex-end;
	min-height: 350px;
	padding-block: 64px;
	background: var(--hero-bg);
	color: var(--hero-fg);
}

body:not(.home) main [data-block="hero"] .hero-band h1 {
	margin: 0;
	color: var(--hero-fg);
	font-size: var(--hero-size, 100px);
	font-weight: var(--hero-weight, 300);
	line-height: var(--hero-line, 100px);
	letter-spacing: -0.02em;
}

body:not(.home) main [data-block="hero"] .hero-foto {
	position: relative;
	isolation: isolate;
}

body:not(.home) main [data-block="hero"] .hero-foto::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.15);
	mix-blend-mode: multiply;
	pointer-events: none;
}

body:not(.home) main [data-block="hero"] .hero-foto img {
	width: 100%;
	max-width: none;
	height: auto;
	aspect-ratio: 12 / 5;
	object-fit: cover;
}

body.site-theme-werkenbij.page-template-over-ons main [data-block="hero"] .hero-foto img,
body.site-theme-academie.page-template-over-ons main [data-block="hero"] .hero-foto img,
body.site-theme-jobcoaching.page-template-over-ons main [data-block="hero"] .hero-foto img {
	aspect-ratio: 1440 / 358;
}

body:not(.home) main [data-block="hero"] .hero-intro {
	padding-block: 72px;
	background: var(--color-bg);
	color: #2a2622;
}

body:not(.home) main [data-block="hero"] .hero-intro p {
	margin: 0;
	font-size: 36px;
	font-weight: 400;
	line-height: 48px;
	letter-spacing: -0.36px;
	text-align: left;
}

body.site-theme-academie.page-template-over-ons main [data-block="hero"] .hero-intro p {
	font-size: 32px;
	line-height: 44px;
	letter-spacing: -0.32px;
}

body.site-theme-academie.page-template-over-ons main [data-block="tekst"] {
	max-width: none;
	color: var(--color-line);
	font-size: 70px;
	line-height: 70px;
	letter-spacing: -1.4px;
}

body.site-theme-academie.page-template-over-ons main [data-block="regels"][data-variant="normaal"] h3 {
	color: var(--color-brand-3);
	font-size: 50px;
	line-height: 54px;
	letter-spacing: -1px;
}

@media (max-width: 800px) {
	body.site-theme-academie.page-template-over-ons main [data-block="regels"][data-variant="normaal"] h3 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}
}

body.site-theme-academie.page-template-over-ons main [data-block="regels"] [data-regel="knop"] a[data-stijl="primair"] {
	background: var(--color-brand-3);
}

body.site-theme-academie.page-template-over-ons main [data-block="regels"] [data-regel="knop"] a[data-stijl="primair"]:hover,
body.site-theme-academie.page-template-over-ons main [data-block="regels"] [data-regel="knop"] a[data-stijl="primair"]:focus-visible {
	background: var(--color-brand-4);
}

body.site-theme-academie.page-template-over-ons main [data-block="carrousel"] > h2 {
	color: var(--color-brand-4);
}

body.site-theme-academie.page-template-over-ons main [data-block="carrousel"] > p {
	color: var(--color-brand-5);
}

body.site-theme-werkenbij.page-template-opdrachtgevers {
	--hero-bg: #f7f3ed;
	--hero-fg: #2a2622;
}

body.site-theme-werkenbij.page-template-opdrachtgevers main [data-block="hero"] .hero-band h1 {
	color: var(--color-brand-3);
}

body.site-theme-werkenbij.page-template-opdrachtgevers main [data-block="hero"] .hero-intro {
	padding-block: 64px;
	background: var(--color-white);
}

body.site-theme-werkenbij.page-template-opdrachtgevers main [data-block="hero"] .hero-intro p {
	font-size: 32px;
	line-height: 44px;
	letter-spacing: -0.32px;
}

@media (max-width: 767px) {
	body.site-theme-werkenbij.page-template-opdrachtgevers main [data-block="hero"] .hero-intro {
		padding-block: var(--space-4);
	}

	body.site-theme-werkenbij.page-template-opdrachtgevers main [data-block="hero"] .hero-intro p {
		font-size: 24px;
		line-height: 40px;
		letter-spacing: 0;
	}
}

body.site-theme-werkenbij:not(.home):has([data-hero="vacatures"]) .site-header {
	color: #fff;
}

body.site-theme-werkenbij:not(.home):has([data-hero="vacatures"]) .site-nav__list .menu-cta > a:hover,
body.site-theme-werkenbij:not(.home):has([data-hero="vacatures"]) .site-nav__list .menu-cta > a:focus-visible {
	background: #fff;
	color: var(--color-brand-4);
}

main [data-hero="vacatures"] .hero-foto h1 {
	position: absolute;
	z-index: 1;
	right: 0;
	bottom: 0;
	left: 0;
	margin: 0;
	padding: 64px max(var(--gutter), calc((100% - var(--container)) / 2));
	color: #f7f3ed;
	font-size: 100px;
	font-weight: 300;
	line-height: 100px;
	letter-spacing: -0.02em;
}

body:not(.home) main [data-hero="vacatures"] .hero-intro {
	padding-block: 64px;
	background: var(--color-bg);
}

body:not(.home) main [data-hero="vacatures"] .hero-intro p {
	font-size: 32px;
	line-height: 44px;
	letter-spacing: -0.32px;
}

body:has([data-hero="vacatures"]) main {
	display: flex;
	flex-direction: column;
}

body:has([data-hero="vacatures"]) main [data-block="regels"] {
	order: 2;
	margin-top: 80px;
}

body:has([data-hero="vacatures"]) main [data-block="vacatures"] {
	order: 3;
}

body:has([data-hero="vacatures"]) main [data-block="regels"] > ul > li:has([data-regel="knop"]):not(:has(h3)) {
	display: none;
}

body:has([data-hero="vacatures"]) main [data-block="regels"] > ul > li:has([data-regel="knop"]):not(:has(h3)) + li {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

body:has([data-hero="vacatures"]) main [data-block="regels"] h3 {
	color: var(--color-brand-2);
}

@media (max-width: 767px) {
	main [data-hero="vacatures"] .hero-foto h1 {
		padding-block: 32px;
		font-size: 40px;
		line-height: 44px;
		letter-spacing: -0.8px;
	}

	body:not(.home) main [data-hero="vacatures"] .hero-intro {
		padding-block: var(--space-4);
	}

	body:not(.home) main [data-hero="vacatures"] .hero-intro p {
		font-size: 24px;
		line-height: 40px;
		letter-spacing: 0;
	}
}

body.single-vacature {
	--hero-bg: #c17744;
	--hero-fg: #fffefc;
}

main [data-hero="vacature"] {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	box-sizing: border-box;
	padding: calc(var(--header-height) + 52px) 0 48px;
	background: #c17744;
	color: #fffefc;
}

main [data-hero="vacature"] .vacature-kop {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 48px;
	width: min(var(--container), calc(100% - 2 * var(--gutter)));
	margin-inline: auto;
}

main [data-hero="vacature"] h1 {
	max-width: 952px;
	margin: 0;
	color: #fffefc;
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-hero="vacature"] .vacature-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 16px 48px;
	margin: 32px 0 0;
	padding: 0;
	list-style: none;
	color: var(--color-brand-1);
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-hero="vacature"] .vacature-meta li {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 0;
	padding: 0;
}

main [data-hero="vacature"] .vacature-meta svg {
	flex: none;
}

main [data-hero="vacature"] .vacature-acties {
	display: flex;
	flex: none;
	align-items: center;
	gap: 32px;
}

main [data-hero="vacature"] .vacature-deel {
	display: grid;
	place-items: center;
	padding: 0;
	border: 0;
	background: transparent;
	color: #f7f3ed;
	cursor: pointer;
}

main [data-hero="vacature"] .vacature-acties a {
	display: inline-flex;
	padding: 16px 30px 20px;
	border: 1px solid #f7f3ed;
	border-radius: 15px;
	background: var(--color-brand-2);
	color: #f7f3ed;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
	text-decoration: none;
}

main [data-hero="vacature"] .vacature-acties a:hover,
main [data-hero="vacature"] .vacature-acties a:focus-visible,
main [data-hero="vacature"] .vacature-deel:focus-visible {
	background: #f7f3ed;
	color: var(--color-brand-4);
}

main [data-block="vacature-datum"] {
	margin-top: 48px;
}

main [data-block="vacature-datum"] p {
	margin: 0;
	padding-bottom: 48px;
	border-bottom: 1px solid var(--color-line);
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) {
	width: 100vw;
	max-width: 100vw;
	margin-top: 80px;
	margin-left: calc(50% - 50vw);
	box-sizing: border-box;
	padding: 64px var(--gutter);
	background: var(--color-bg);
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) h2 {
	width: min(var(--container), 100%);
	margin: 0 auto 54px;
	color: var(--color-brand-3);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
	scroll-margin-top: calc(var(--header-height) + 24px);
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) form {
	display: flex;
	flex-direction: column;
	gap: 54px;
	width: min(var(--container), 100%);
	max-width: none;
	margin-inline: auto;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) .formulier-rij {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) .formulier-rij label,
main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) textarea {
	display: block;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) input:not([type="checkbox"]):not([type="file"]),
main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 24px;
	border: 0;
	border-radius: 15px;
	background: #fff;
	color: #2a2622;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) textarea {
	min-height: 240px;
	resize: vertical;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) input::placeholder,
main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) textarea::placeholder {
	color: var(--color-line);
	opacity: 1;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) .formulier-upload {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) .formulier-upload p {
	margin: 0;
	color: #2a2622;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) .formulier-upload label {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 24px;
	min-height: 240px;
	border: 1px dashed #2a2622;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
	cursor: pointer;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) .formulier-upload input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	padding: 0;
	border: 0;
	opacity: 0;
	cursor: pointer;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) .formulier-upload label span:last-child {
	padding: 16px 24px;
	border: 1px solid #2a2622;
	border-radius: 15px;
	pointer-events: none;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) label:has(input[type="checkbox"]) {
	display: flex;
	align-items: center;
	gap: 12px;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 2px;
	background: #fff;
	accent-color: var(--color-brand-3);
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) a {
	color: inherit;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) button {
	align-self: center;
	justify-self: center;
	padding: 16px 30px 20px;
	border: 1px solid var(--color-brand-3);
	border-radius: 15px;
	background: transparent;
	color: var(--color-brand-3);
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
	cursor: pointer;
}

main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) button:hover,
main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) button:focus-visible {
	background: var(--color-brand-3);
	color: var(--color-bg);
}

body.page-template-solliciteren main [data-block="regels"][data-variant="normaal"] h3 {
	color: var(--color-brand-2);
}

main [data-block="formulier"][data-variant="solliciteren"] {
	margin-top: var(--space-block);
}

main [data-block="formulier"][data-variant="solliciteren"] .formulier-vraag {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

main [data-block="formulier"][data-variant="solliciteren"] .formulier-upload p {
	color: var(--color-line);
}

main [data-block="formulier"][data-variant="solliciteren"] .formulier-upload label {
	gap: 12px;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
}

main [data-block="formulier"][data-variant="solliciteren"] .formulier-upload label span:last-child {
	padding: 8px 30px;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

@media (max-width: 1100px) {
	main [data-hero="vacature"] h1,
	main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) h2 {
		font-size: 48px;
		line-height: 52px;
	}
}

@media (max-width: 767px) {
	main [data-hero="vacature"] {
		padding-top: calc(var(--header-height) + 32px);
	}

	main [data-hero="vacature"] .vacature-kop {
		flex-direction: column;
		align-items: flex-start;
		gap: 32px;
	}

	main [data-hero="vacature"] h1,
	main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) h2 {
		font-size: 36px;
		line-height: 40px;
		letter-spacing: -0.72px;
	}

	main [data-hero="vacature"] .vacature-meta {
		gap: 8px 24px;
	}

	main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) {
		padding-block: 48px;
	}

	main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) .formulier-rij {
		grid-template-columns: minmax(0, 1fr);
	}

	main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) input:not([type="checkbox"]):not([type="file"]),
	main [data-block="formulier"]:is([data-variant="vacature"], [data-variant="solliciteren"]) textarea {
		font-size: 18px;
		line-height: 28px;
	}
}

body:not(.home) main [data-hero="handboek-item"] .hero-band,
body:not(.home) main [data-hero="nieuws-item"] .hero-band {
	padding-block: 48px;
}

body:not(.home) main [data-hero="nieuws-item"] .hero-band h1 {
	max-width: 952px;
}

body:not(.home) main [data-hero="handboek-item"] .hero-band .container {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 100px;
}

body:not(.home) main [data-block="hero"] .hero-terug {
	margin: 0;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

body:not(.home) main [data-block="hero"] .hero-terug a {
	color: #2a2622;
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

body.site-theme-astare:has([data-hero="locaties"]),
body.site-theme-astare:has([data-hero="nieuws"]),
body.site-theme-astare:has([data-hero="contact"]),
body.site-theme-astare:has([data-hero="handboek"]) {
	--hero-size: 120px;
	--hero-line: 100px;
}

body.site-theme-astare:has([data-hero="nieuws"]),
body.site-theme-astare:has([data-hero="nieuws-item"]) {
	--hero-bg: #f7f3ed;
	--hero-fg: #145263;
}

body.site-theme-astare:has([data-hero="contact"]) {
	--hero-bg: #145263;
	--hero-fg: #f7f3ed;
}

body.site-theme-astare:has([data-hero="handboek"]),
body.site-theme-astare:has([data-hero="handboek-item"]) {
	--hero-bg: #cee6ed;
	--hero-fg: #233444;
}

body.site-theme-werkenbij:has([data-hero="contact"]) {
	--hero-bg: #7f4829;
	--hero-fg: #f9d4b2;
}

body.site-theme-werkenbij:has([data-hero="handboek"]),
body.site-theme-werkenbij:has([data-hero="handboek-item"]) {
	--hero-bg: #f9d4b2;
	--hero-fg: #7f4829;
}

body.site-theme-werkenbij:has([data-hero="solliciteren"]) {
	--hero-bg: #c17744;
	--hero-fg: #ffffff;
}

body.site-theme-academie:has([data-hero="handboek"]),
body.site-theme-academie:has([data-hero="handboek-item"]) {
	--hero-bg: #f4d9de;
	--hero-fg: #8e4048;
}

body.site-theme-jobcoaching:has([data-hero="aanmelden"]) {
	--hero-bg: #9ba588;
	--hero-fg: #30352c;
}

body.site-theme-jobcoaching:has([data-hero="aanmelden"]) main [data-block="hero"] .hero-band {
	align-items: flex-end;
	min-height: 350px;
	padding-bottom: 48px;
}

body.page-template-aanmelden main [data-block="jezelf"] {
	margin-top: 104px;
}

body.page-template-aanmelden main .aanmeld-keuzes {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

body.page-template-aanmelden main .aanmeld-keuzes > a,
body.page-template-aanmelden main .aanmeld-keuzes > div {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 32px;
	box-sizing: border-box;
	min-height: 400px;
	padding: 40px;
	border-radius: 20px;
	background: var(--color-brand-3);
	color: #f7f3ed;
	text-decoration: none;
}

body.page-template-aanmelden main .aanmeld-keuzes > :last-child {
	background: var(--color-brand-4);
}

body.page-template-aanmelden main .aanmeld-keuzes > a > span:first-child,
body.page-template-aanmelden main .aanmeld-keuzes > div > span:first-child {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

body.page-template-aanmelden main .aanmeld-keuzes h2 {
	margin: 0;
	color: #f7f3ed;
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
}

body.page-template-aanmelden main .aanmeld-keuzes p {
	margin: 0;
	color: #f7f3ed;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

body.page-template-aanmelden main .aanmeld-meer {
	display: inline-flex;
	align-self: flex-start;
	align-items: center;
	gap: 16px;
	padding: 16px 30px;
	border: 1px solid #fffefc;
	border-radius: var(--radius);
	color: #fffefc;
	font-size: 26px;
	font-weight: 300;
	line-height: 36px;
}

body.page-template-aanmelden main .aanmeld-keuzes > a:hover .aanmeld-meer,
body.page-template-aanmelden main .aanmeld-keuzes > a:focus-visible .aanmeld-meer {
	background: #fffefc;
	color: var(--color-brand-4);
}

body.page-template-aanmelden main [data-block="jezelf"] + [data-block="regels"] {
	margin-top: 160px;
}

body.page-template-aanmeldformulier main [data-block="hero"] + [data-block="regels"] {
	margin-top: 104px;
}

body.page-template-aanmelden main [data-block="regels"][data-variant="normaal"] h3,
body.page-template-aanmeldformulier main [data-block="regels"][data-variant="normaal"] h3 {
	color: var(--color-brand-3);
}

body.page-template-aanmelden main [data-block="regels"][data-variant="normaal"] > ul > li:first-child,
body.page-template-aanmeldformulier main [data-block="regels"][data-variant="normaal"] > ul > li:first-child {
	padding-top: 80px;
	border-top: 1px solid var(--color-line);
}

body.page-template-aanmeldformulier main [data-block="hero"] .hero-intro {
	padding-block: 64px;
}

body.page-template-aanmeldformulier main [data-block="hero"] .hero-intro p {
	color: #2a2622;
	font-size: 32px;
	line-height: 44px;
	letter-spacing: -0.32px;
}

body:has([data-hero="handboek-item"]),
body:has([data-hero="nieuws-item"]) {
	--hero-size: 70px;
	--hero-line: 70px;
	--hero-weight: 400;
}

body:has([data-hero="agenda-item"]) {
	--hero-fg: #fffefc;
}

main [data-hero="agenda-item"] .agenda-hero {
	position: relative;
	isolation: isolate;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	box-sizing: border-box;
	width: 100vw;
	max-width: 100vw;
	min-height: 500px;
	margin-left: calc(50% - 50vw);
	padding: 100px var(--gutter) 40px;
	background: #2a2622;
	color: #fffefc;
}

main [data-hero="agenda-item"] .agenda-hero > img {
	position: absolute;
	inset: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	aspect-ratio: auto;
	object-fit: cover;
}

main [data-hero="agenda-item"] .agenda-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background: rgba(0, 0, 0, 0.2);
	pointer-events: none;
}

main [data-hero="agenda-item"] .agenda-hero__terug,
main [data-hero="agenda-item"] .agenda-hero__onder {
	position: relative;
	z-index: 1;
	width: min(var(--container), 100%);
	margin-inline: auto;
}

main [data-hero="agenda-item"] .agenda-hero__terug {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #fffefc;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
	text-decoration: none;
}

main [data-hero="agenda-item"] .agenda-hero__onder {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 32px;
}

main [data-hero="agenda-item"] .agenda-hero h1 {
	margin: 0;
	max-width: 799px;
	color: #fffefc;
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-hero="agenda-item"] .agenda-hero__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 41px;
	margin: 32px 0 0;
}

main [data-hero="agenda-item"] .agenda-hero__meta span {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-hero="agenda-item"] .agenda-hero__terug img,
main [data-hero="agenda-item"] .agenda-hero__meta img {
	display: block;
	width: auto;
	max-width: none;
	height: auto;
	aspect-ratio: auto;
}

main [data-hero="agenda-item"] .agenda-hero__terug img {
	width: 24px;
	height: 24px;
}

main [data-hero="agenda-item"] .agenda-hero__meta span:first-child img {
	width: 14px;
	height: 18px;
}

main [data-hero="agenda-item"] .agenda-hero__meta span:last-child img {
	width: 20px;
	height: 20px;
}

main [data-hero="agenda-item"] .agenda-hero__datum {
	display: flex;
	flex: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 140px;
	height: 140px;
	margin: 0;
	border: 1px solid #fffefc;
	border-radius: 20px;
	text-align: center;
}

main [data-hero="agenda-item"] .agenda-hero__datum span:first-child {
	font-size: 50px;
	font-weight: 500;
	line-height: 54px;
	letter-spacing: -1px;
}

main [data-hero="agenda-item"] .agenda-hero__datum span:last-child {
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

@media (max-width: 767px) {
	body:not(.home) main [data-block="hero"] .hero-band {
		min-height: 260px;
		padding-block: 48px;
	}

	body:not(.home) main [data-block="hero"] .hero-band h1 {
		font-size: 48px;
		font-weight: 400;
		line-height: 48px;
		letter-spacing: 0;
	}

	body.site-theme-werkenbij.page-template-over-ons main [data-block="hero"] .hero-foto img,
	body.site-theme-academie.page-template-over-ons main [data-block="hero"] .hero-foto img,
	body.site-theme-jobcoaching.page-template-over-ons main [data-block="hero"] .hero-foto img {
		aspect-ratio: 16 / 9;
	}

	body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-foto {
		aspect-ratio: 393 / 450;
	}

	body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-foto .container {
		padding-bottom: 48px;
	}

	body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-foto h1 {
		font-size: 40px;
		line-height: 48px;
		letter-spacing: -0.8px;
	}

	body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-intro {
		padding-block: 32px;
	}

	body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="hero"] .hero-intro p {
		font-size: 22px;
		line-height: 32px;
		letter-spacing: 0;
	}

	body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] {
		margin-top: 40px;
	}

	body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] a {
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
		min-height: 0;
		padding: 32px 24px;
		border-radius: 20px;
	}

	body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] h2 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] p {
		font-size: 18px;
		line-height: 28px;
	}

	body.site-theme-jobcoaching.page-template-dienstverlening main [data-block="doelgroepen"] .doelgroep-meer {
		padding: 12px 20px 14px;
		font-size: 18px;
		line-height: 24px;
	}

	body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-foto {
		aspect-ratio: 393 / 450;
	}

	body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-foto .container {
		gap: 0;
		padding-bottom: 48px;
	}

	body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-label {
		font-size: 32px;
		line-height: 40px;
	}

	body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-foto h1 {
		font-size: 40px;
		line-height: 48px;
		letter-spacing: -0.8px;
	}

	body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-intro {
		padding-block: 32px;
	}

	body.single-doelgroep.site-theme-jobcoaching main [data-block="hero"] .hero-intro p {
		font-size: 22px;
		line-height: 32px;
		letter-spacing: 0;
	}

	body.single-doelgroep main [data-block="diensten"] {
		margin-top: 40px;
	}

	body.single-doelgroep main [data-block="diensten"] > h2 {
		margin-bottom: 32px;
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	body.single-doelgroep main [data-block="diensten"] a {
		min-height: 0;
		padding: 32px 24px;
	}

	body.single-doelgroep main [data-block="diensten"] h3 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	body.single-doelgroep main [data-block="diensten"] .dienst-meer {
		padding: 12px 20px;
		font-size: 18px;
		line-height: 24px;
	}

	body.single-doelgroep main [data-block="regels"][data-variant="normaal"] > ul > li:first-child {
		padding-top: 32px;
	}

	body.single-dienst.site-theme-jobcoaching main [data-hero="dienst"] .hero-band {
		min-height: 450px;
		padding-top: calc(var(--header-height) + 4px);
		padding-bottom: 48px;
	}

	body.single-dienst.site-theme-jobcoaching main [data-hero="dienst"] .hero-band h1 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	body.single-dienst main [data-block="regels"][data-variant="normaal"] {
		margin-top: 40px;
	}

	body.single-dienst main [data-block="regels"][data-variant="normaal"] > ul > li:first-child {
		padding-top: 32px;
	}

	body.single-dienst main .dienst-beeld,
	body.single-dienst main .dienst-beeld + ul {
		margin-top: 40px;
	}

	body.single-dienst main .dienst-beeld img {
		aspect-ratio: 393 / 240;
	}

	body.site-theme-academie.page-template-over-ons main [data-block="hero"] .hero-intro p {
		font-size: 24px;
		line-height: 40px;
		letter-spacing: 0;
	}

	body.site-theme-academie.page-template-over-ons main [data-block="tekst"] {
		max-width: none;
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}

	body.site-theme-academie.page-template-over-ons main [data-block="carrousel"] > h2 {
		color: var(--color-brand-2);
	}

	body:not(.home) main [data-hero="handboek-item"] .hero-band .container {
		gap: var(--space-4);
	}

	body:not(.home) main [data-hero="nieuws-item"] .hero-band {
		min-height: 392px;
	}

	body:not(.home) main [data-hero="nieuws-item"] .hero-band h1 {
		max-width: none;
		font-size: 36px;
		line-height: 40px;
	}

	main [data-hero="nieuws-item"] + [data-block="inhoud"] {
		margin-top: 0;
	}

	main [data-nieuws-kop] {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
		padding-block: 48px;
		border-bottom: 1px solid var(--color-line);
	}

	main [data-nieuws-kop] p {
		font-size: 16px;
		line-height: 24px;
	}

	main [data-hero="agenda-item"] .agenda-hero {
		min-height: 600px;
		padding: 88px var(--gutter) 48px;
	}

	main [data-hero="agenda-item"] .agenda-hero__terug {
		font-size: 16px;
		line-height: 24px;
	}

	main [data-hero="agenda-item"] .agenda-hero__onder {
		flex-direction: column;
		align-items: flex-start;
		gap: 24px;
	}

	main [data-hero="agenda-item"] .agenda-hero__datum {
		order: -1;
		width: 80px;
		height: 80px;
		border-radius: 15px;
	}

	main [data-hero="agenda-item"] .agenda-hero__datum span:first-child {
		font-size: 24px;
		font-weight: 400;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-hero="agenda-item"] .agenda-hero__datum span:last-child {
		font-size: 16px;
		line-height: 24px;
	}

	main [data-hero="agenda-item"] .agenda-hero h1 {
		max-width: none;
		font-size: 36px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-hero="agenda-item"] .agenda-hero__meta {
		gap: 32px;
		margin-top: 16px;
	}

	main [data-hero="agenda-item"] .agenda-hero__meta span {
		gap: 8px;
		font-size: 16px;
		line-height: 24px;
	}

	main [data-hero="agenda-item"] .agenda-hero__meta span:first-child img {
		width: 11px;
		height: 14px;
	}

	main [data-hero="agenda-item"] .agenda-hero__meta span:last-child img {
		width: 14px;
		height: 14px;
	}

	body:not(.home) main [data-block="hero"] .hero-intro {
		padding-block: var(--space-4);
	}

	body:not(.home) main [data-block="hero"] .hero-intro p,
	body.page-template-trainingen:not(.home) main [data-hero="trainingen"] .hero-intro p {
		font-size: 24px;
		line-height: 40px;
		letter-spacing: 0;
	}

	body.page-template-trainingen:not(.home) main [data-hero="trainingen"] .hero-intro {
		padding-block: var(--space-4);
	}

	body.single-werkveld:not(.home) main [data-hero="werkveld"] .hero-intro {
		padding-block: var(--space-4);
	}

	body.single-werkveld:not(.home) main [data-hero="werkveld"] .hero-intro p {
		font-size: 24px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-hero="werkveld"] .werkveld-hero {
		min-height: 450px;
		padding-block: 48px;
	}

	main [data-hero="werkveld"] .werkveld-hero a {
		font-size: 28px;
		line-height: 36px;
		letter-spacing: 0;
	}

	main [data-hero="werkveld"] .werkveld-hero h1 {
		font-size: 48px;
		line-height: 48px;
		letter-spacing: 0;
	}

	main [data-hero="werkveld"] .werkveld-sprong {
		flex-direction: column;
		align-items: flex-start;
		margin-top: 40px;
	}

	main [data-hero="werkveld"] .werkveld-sprong p,
	body.single-werkveld main [data-block="trainingen"] > h2,
	body.single-werkveld main [data-block="leerlijnen"] > h2 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-hero="werkveld"] .werkveld-sprong a,
	body.single-werkveld main [data-block="trainingen"] a > span,
	body.single-werkveld main [data-block="leerlijnen"] a > span {
		font-size: 22px;
		line-height: 32px;
	}

	body.single-werkveld main [data-block="trainingen"] > ul {
		grid-template-columns: 1fr;
	}

	body.single-werkveld main [data-block="trainingen"] a,
	body.single-werkveld main [data-block="leerlijnen"] a {
		min-height: 0;
		padding: 32px 24px;
	}

	body.single-werkveld main [data-block="trainingen"] h3,
	body.single-werkveld main [data-block="leerlijnen"] h3 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-hero="trainingen"] .trainingen-hero {
		min-height: 450px;
		padding-block: 48px;
	}

	main [data-hero="trainingen"] .trainingen-hero h1 {
		font-size: 48px;
		line-height: 48px;
		letter-spacing: 0;
	}

	main [data-hero="trainingen"] + [data-block="werkvelden"] {
		margin-top: 40px;
	}

	main [data-block="werkvelden"] a {
		flex-direction: column;
		align-items: flex-start;
		gap: 32px;
		padding: 32px 24px;
	}

	main [data-block="werkvelden"] h2 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}

	main [data-block="werkvelden"] a > span {
		font-size: 22px;
		line-height: 32px;
	}
}

body.admin-bar main [data-hero="agenda-item"] .agenda-hero {
	padding-top: calc(100px + 32px);
}

@media screen and (max-width: 782px) {
	body.admin-bar main [data-hero="agenda-item"] .agenda-hero {
		padding-top: calc(88px + 46px);
	}
}

.newsletter {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 639px;
	background: var(--color-bg);
	padding: var(--space-band) var(--gutter);
	color: #2a2622;
}

.newsletter__inner,
.newsletter form {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--space-band);
}

.newsletter__inner {
	width: min(var(--container), 100%);
	margin-inline: auto;
}

.newsletter form,
.newsletter__intro,
.newsletter__fields {
	width: 100%;
}

.newsletter h2,
.newsletter__lead {
	margin: 0;
	text-align: center;
	font-weight: 400;
	color: var(--newsletter-color, #2a2622);
}

.newsletter h2 {
	font-size: 70px;
	line-height: 70px;
	letter-spacing: -1.4px;
}

.newsletter__lead {
	margin-top: 24px;
	font-size: 32px;
	line-height: 44px;
	letter-spacing: -0.32px;
}

.newsletter__fields {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.newsletter label {
	display: block;
}

.newsletter input[type="text"],
.newsletter input[type="email"] {
	display: block;
	width: 100%;
	box-sizing: border-box;
	padding: 24px;
	border: 0;
	border-radius: 15px;
	background: var(--color-white);
	color: #2a2622;
	font-family: inherit;
	font-size: 24px;
	font-weight: 400;
	line-height: normal;
}

.newsletter input::placeholder {
	color: var(--color-line);
	opacity: 1;
}

.newsletter__submit {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: var(--space-band);
}

.newsletter__submit label {
	display: flex;
	align-items: center;
	gap: 16px;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
	white-space: nowrap;
}

.newsletter__submit a,
.newsletter__privacy {
	text-decoration: underline;
	text-underline-offset: 0.12em;
	color: inherit;
}

.newsletter input[type="checkbox"] {
	appearance: none;
	width: 26px;
	height: 26px;
	margin: 0;
	flex-shrink: 0;
	border: 1px solid var(--color-brown);
	background: transparent;
}

.newsletter input[type="checkbox"]:checked {
	background: var(--color-brown);
}

.newsletter button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 68px;
	margin: 0;
	padding: 0 30px;
	border: 0;
	border-radius: 15px;
	background: var(--newsletter-button, var(--color-line));
	color: var(--color-bg);
	font-family: inherit;
	font-size: var(--text-h5-size);
	font-weight: var(--text-h5-weight);
	line-height: 1;
	letter-spacing: var(--text-h5-tracking);
	cursor: pointer;
	transition: background-color 0.2s ease;
}

.newsletter button:hover,
.newsletter button:focus-visible {
	background: var(--color-brand-4);
}

.site-theme-astare .newsletter button:hover,
.site-theme-astare .newsletter button:focus-visible {
	background: var(--color-brand-2);
}

.site-theme-astare .newsletter {
	--newsletter-color: #2a2622;
	--newsletter-button: #c9b9aa;
}

.site-theme-astare .newsletter button {
	height: 72px;
	font-size: 26px;
	letter-spacing: 0;
}

.site-theme-werkenbij .newsletter {
	--newsletter-color: #7f4829;
	--newsletter-button: #d19369;
}

.site-theme-academie .newsletter {
	--newsletter-color: #8e4048;
	--newsletter-button: #c99da0;
}

.site-theme-jobcoaching .newsletter {
	--newsletter-color: #3e5434;
	--newsletter-button: #9ba588;
}

@media (max-width: 800px) {
	.newsletter {
		min-height: 0;
	}

	.newsletter__inner,
	.newsletter form {
		gap: var(--space-4);
	}

	.newsletter h2 {
		font-size: 40px;
		line-height: 1.1;
	}

	.newsletter__lead {
		font-size: 22px;
		line-height: 1.3;
	}

	.newsletter__fields,
	.newsletter__submit {
		grid-template-columns: 1fr;
		flex-direction: column;
		align-items: stretch;
		gap: 16px;
	}

	.newsletter__submit label {
		white-space: normal;
	}

	.newsletter input[type="text"],
	.newsletter input[type="email"] {
		padding: 16px;
		font-size: 18px;
	}
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

/* Header: 100px hoog, logo links, menu rechts, laatste item als outline. */

.site-header {
	color: var(--nav-color);
}

.site-header--overlay {
	position: absolute;
	inset-inline: 0;
	top: 0;
	z-index: 20;
	color: var(--nav-color-hero);
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	height: var(--header-height);
}

.site-logo {
	display: inline-flex;
	align-items: baseline;
	gap: 0.33em;
	color: inherit;
	text-decoration: none;
	font-size: 30px;
	font-weight: 500;
	letter-spacing: -0.3px;
	line-height: 1;
	white-space: nowrap;
}

.site-logo__brand {
	letter-spacing: 4.2px;
}

.site-logo__sub {
	font-weight: 300;
}

.site-nav {
	display: none;
}

.site-nav__list,
.mobile-nav__list,
.site-footer__list,
.site-footer__socials-list,
.mobile-nav__socials-list,
.site-footer__locaties,
.site-footer__certs,
.site-footer__meta {
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-nav__list {
	display: flex;
	align-items: center;
	gap: 48px;
}

.site-nav__list a {
	display: inline-block;
	color: inherit;
	text-decoration: none;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: 0.32px;
	white-space: nowrap;
}

.site-nav__list .menu-cta > a {
	padding: 15px 16px; /* 52px hoog incl. 1px rand, zoals in Figma */
	border: 1px solid currentColor;
	border-radius: var(--radius);
}

.site-nav__list a:hover {
	text-decoration-line: underline;
	text-decoration-thickness: 0.05em;
}

.site-nav__list .menu-cta > a:hover {
	background: var(--nav-color);
	color: var(--color-bg);
	text-decoration: none;
}

.site-header--overlay .site-nav__list .menu-cta > a:hover {
	background: var(--nav-color-hero);
}

.site-header__toggle,
.mobile-nav__close {
	display: inline-flex;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	cursor: pointer;
}

.site-header__bars {
	display: block;
	width: 25px;
	height: 17px;
	background-image:
		linear-gradient(currentColor, currentColor),
		linear-gradient(currentColor, currentColor),
		linear-gradient(currentColor, currentColor);
	background-repeat: no-repeat;
	background-size: 25px 1px;
	background-position: 0 0, 0 8px, 0 16px;
}

.site-header__toggle:hover,
.mobile-nav__close:hover {
	opacity: 0.6;
}

@media (min-width: 1200px) {
	.site-nav {
		display: block;
	}

	.site-header__toggle {
		display: none;
	}
}

/* Mobiele header: 84px, logo 20px, hamburger rechts. */

@media (max-width: 1199px) {
	:root {
		--header-height: 84px;
	}

	.site-header__inner {
		align-items: flex-start;
		padding-block: 32px;
		height: auto;
	}

	.site-logo {
		font-size: 20px;
		letter-spacing: -0.2px;
	}

	.site-logo__brand {
		letter-spacing: -0.2px;
	}
}

/* Mobiel menu: volledig scherm, items in merkkleur, laatste item als knop. */

.mobile-nav {
	position: fixed;
	inset: 0;
	z-index: 40;
	display: flex;
	flex-direction: column;
	padding: 32px var(--gutter);
	background: var(--color-bg);
	color: var(--color-text);
	overflow-y: auto;
}

.mobile-nav[hidden] {
	display: none;
}

.admin-bar .mobile-nav {
	top: var(--wp-admin--admin-bar--height, 32px);
}

.menu-open {
	overflow: hidden;
}

.mobile-nav__top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}

.mobile-nav__top .site-logo {
	font-size: 20px;
	letter-spacing: -0.2px;
}

.mobile-nav__top .site-logo__brand {
	letter-spacing: -0.2px;
}

.site-theme-academie .mobile-nav__top,
.site-theme-jobcoaching .mobile-nav__top {
	color: var(--color-brand-5);
}

.mobile-nav__close svg {
	display: block;
}

.mobile-nav__nav {
	padding-top: 80px;
}

.mobile-nav__list {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.mobile-nav__list a {
	display: block;
	color: var(--menu-link);
	text-decoration: none;
	font-size: 32px;
	font-weight: 500;
	line-height: 40px;
}

.mobile-nav__list .current-menu-item > a,
.mobile-nav__list a:hover {
	color: var(--menu-link-current);
}

.mobile-nav__list .menu-cta {
	margin-top: 16px;
}

.mobile-nav__list .menu-cta > a {
	display: inline-block;
	padding: 12px 24px 16px;
	border: 1px solid var(--menu-link-current);
	border-radius: var(--radius);
	color: var(--menu-link-current);
	font-size: 20px;
	font-weight: 400;
	line-height: 34px;
}

.mobile-nav__list .menu-cta > a:hover {
	background: var(--menu-link-current);
	color: var(--color-bg);
}

.mobile-nav__socials {
	margin-top: auto;
	padding-top: 48px;
}

.mobile-nav__socials-label,
.site-footer__socials-label {
	margin: 0 0 16px;
	font-size: 16px;
	font-weight: 300;
	line-height: 24px;
}

.mobile-nav__socials-list,
.site-footer__socials-list {
	display: flex;
	gap: 24px;
}

.mobile-nav__socials-list a,
.site-footer__socials-list a {
	display: block;
	color: inherit;
}

.social-icon {
	display: block;
}

/* Zin: volle band boven de footer. Verloop en tekstkleur per entiteit. */

.site-zin {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 600px;
	margin: 0;
	padding: 3rem var(--gutter);
	text-align: center;
	font-family: "Museo Slab", Georgia, "Times New Roman", serif;
	font-size: 50px;
	font-weight: 300;
	font-style: normal;
	line-height: 70px;
	letter-spacing: -1px;
}

.site-theme-astare .site-zin {
	color: #233444;
	background: linear-gradient(180deg, #ffffff 0%, #f7f3ed 50.96%, #cee6ed 100%);
}

.site-theme-werkenbij .site-zin {
	color: #7f4829;
	background: linear-gradient(180deg, #ffffff 0%, #f7f3ed 29%, #cf9056 100%);
}

.site-theme-academie .site-zin {
	color: #8e4048;
	background: linear-gradient(180deg, #ffffff 0%, #f7f3ed 50.96%, #dfa2a8 100%);
}

.site-theme-jobcoaching .site-zin {
	color: #3e5434;
	background: linear-gradient(180deg, #ffffff 0%, #f7f3ed 50.96%, #a6b19b 100%);
}

@media (max-width: 767px) {
	.site-zin {
		min-height: 237px;
		padding: 2.5rem var(--gutter);
		font-size: 32px;
		line-height: 32px;
		letter-spacing: -0.64px;
	}
}

/* Footer: logo en certificaten links, menu, locaties en colofon rechts. */

.site-footer {
	background: var(--footer-bg);
	color: var(--color-white);
	padding: 24px 0 56px;
}

.site-footer a {
	color: inherit;
	text-decoration: none;
}

.site-footer a:hover {
	text-decoration-line: underline;
	text-decoration-thickness: 0.05em;
}

.site-footer__brand .site-logo:hover,
.site-footer__socials a:hover {
	text-decoration: none;
}

.site-footer__inner {
	display: grid;
	grid-template-columns: 304px 883px;
	justify-content: space-between;
	align-items: stretch;
}

.site-footer__brand {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
}

.site-footer__brand .site-logo {
	line-height: 100px;
}

.site-footer__certs {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
}

.site-footer__certs img {
	display: block;
	max-height: 93px;
	width: auto;
}

.site-footer__content {
	display: flex;
	flex-direction: column;
	gap: 48px;
}

.site-footer__top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 48px;
	padding-block: 40px;
}

.site-footer__nav {
	display: flex;
	gap: 99px;
}

.site-footer__list {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 128px;
	font-size: 16px;
	font-weight: 400;
	line-height: normal;
	letter-spacing: 0.32px;
}

.site-footer__socials {
	width: 202px;
	flex-shrink: 0;
}

.site-footer__socials-label {
	font-weight: 400;
	letter-spacing: 0.32px;
}

.site-footer__socials-list {
	gap: 37px;
}

.site-footer__locaties {
	display: flex;
	gap: 24px;
	padding-block: 24px;
	border-top: 1px solid var(--color-bg);
}

.site-footer__locatie {
	flex: 0 0 203px;
	font-size: 16px;
	font-weight: 300;
	line-height: 24px;
}

.site-footer__locatie p {
	margin: 0;
}

.site-footer__stad {
	margin: 0;
	font-size: 22px;
	font-weight: 500;
	line-height: 32px;
	letter-spacing: 0;
}

.site-footer__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	color: var(--footer-meta);
	font-size: 14px;
	line-height: normal;
	letter-spacing: 0.28px;
	white-space: nowrap;
}

.site-footer__meta li {
	display: flex;
	align-items: center;
}

.site-footer__meta li + li::before {
	content: "";
	flex-shrink: 0;
	width: 1px;
	height: 16px;
	margin-right: 24px;
	background: currentColor;
}

.site-footer__credit {
	margin-left: 0.3em;
}

.site-footer a.site-footer__credit {
	text-decoration-line: underline;
	text-decoration-thickness: 0.05em;
}

@media (max-width: 1299px) {
	.site-footer__inner {
		grid-template-columns: minmax(180px, 304px) minmax(0, 883px);
		gap: 48px;
	}

	.site-footer__nav {
		gap: 48px;
	}

	.site-footer__locaties {
		flex-wrap: wrap;
	}

	.site-footer__locatie {
		flex: 1 1 203px;
	}

	.site-footer__meta {
		flex-wrap: wrap;
		justify-content: flex-start;
		white-space: normal;
	}
}

/* Mobiele footer: alles onder elkaar. */

@media (max-width: 767px) {
	.site-footer {
		padding: 64px 0;
	}

	.site-footer__inner {
		display: flex;
		flex-direction: column;
		gap: 48px;
	}

	.site-footer__brand {
		display: contents;
	}

	.site-footer__brand .site-logo {
		font-size: 20px;
		letter-spacing: -0.2px;
		line-height: 20px;
	}

	.site-footer__brand .site-logo__brand {
		letter-spacing: -0.2px;
	}

	.site-footer__certs {
		order: 4;
	}

	.site-footer__content {
		display: contents;
	}

	.site-footer__top {
		display: contents;
	}

	.site-footer__nav {
		flex-direction: column;
		gap: 8px;
	}

	.site-footer__list {
		gap: 8px;
		font-size: 16px;
		font-weight: 300;
		line-height: 24px;
		letter-spacing: 0;
	}

	.site-footer__socials {
		width: auto;
	}

	.site-footer__socials-label {
		font-weight: 300;
	}

	.site-footer__socials-list {
		gap: 24px;
	}

	.site-footer__locaties {
		flex-direction: column;
		gap: 24px;
		padding: 16px 0 0;
	}

	.site-footer__locatie {
		flex: none;
	}

	.site-footer__stad {
		font-size: 20px;
		font-weight: 400;
	}

	.site-footer__meta {
		flex-direction: column;
		align-items: flex-start;
		gap: 4px;
		color: var(--color-bg);
		font-size: 12px;
		letter-spacing: 0.24px;
	}

	.site-footer__meta li + li::before {
		display: none;
	}
}

body.single-training,
body.single-leerlijn {
	--hero-fg: #ffffff;
}

main [data-hero="training"] .aanbod-hero,
main [data-hero="leerlijn"] .aanbod-hero {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	width: 100vw;
	max-width: 100vw;
	min-height: 400px;
	margin-left: calc(50% - 50vw);
	padding: calc(var(--header-height) + 19px) var(--gutter) 48px;
}

main [data-hero="training"] .aanbod-hero .container,
main [data-hero="leerlijn"] .aanbod-hero .container {
	display: flex;
	flex: 1;
	flex-direction: column;
	justify-content: space-between;
	gap: 32px;
	width: min(var(--container), 100%);
}

main [data-hero="training"] .aanbod-hero {
	background: var(--color-brand-3);
}

main [data-hero="leerlijn"] .aanbod-hero {
	background: var(--color-brand-4);
}

body.single-training:not(.home) main [data-hero="training"] .hero-terug,
body.single-leerlijn:not(.home) main [data-hero="leerlijn"] .hero-terug {
	margin: 0;
}

body.single-training:not(.home) main [data-hero="training"] .hero-terug a,
body.single-leerlijn:not(.home) main [data-hero="leerlijn"] .hero-terug a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #f4d9de;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
	text-decoration: none;
}

body.single-leerlijn:not(.home) main [data-hero="leerlijn"] .hero-terug a {
	color: #f7f3ed;
}

main [data-hero="training"] .aanbod-hero h1,
main [data-hero="leerlijn"] .aanbod-hero h1 {
	margin: 0;
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-hero="training"] .aanbod-hero h1 {
	color: var(--color-brand-5);
}

main [data-hero="leerlijn"] .aanbod-hero h1 {
	color: #f4d9de;
}

body.single-training main [data-block="aanbod-intro"],
body.single-leerlijn main [data-block="aanbod-intro"] {
	margin-top: 80px;
	padding-top: 80px;
	border-top: 1px solid var(--color-line);
}

body.single-training main [data-block="aanbod-intro"] .regel,
body.single-leerlijn main [data-block="aanbod-intro"] .regel {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 772px);
	column-gap: 23px;
	align-items: start;
}

body.single-training main [data-block="aanbod-intro"] h2,
body.single-leerlijn main [data-block="aanbod-intro"] h2,
body.single-training main [data-block="regels"][data-variant="normaal"] h3,
body.single-leerlijn main [data-block="regels"][data-variant="normaal"] h3 {
	min-width: 0;
	margin: 0;
	color: var(--color-brand-4);
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
	overflow-wrap: break-word;
}

body.single-training main [data-block="aanbod-intro"] p,
body.single-leerlijn main [data-block="aanbod-intro"] p {
	margin: 0;
	color: #2a2622;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

body.single-training main [data-block="aanbod-intro"] + section,
body.single-leerlijn main [data-block="aanbod-intro"] + section,
body.single-training main [data-block="regels"] + section,
body.single-leerlijn main [data-block="regels"] + section,
body.single-leerlijn main [data-block="tekst"] + section {
	margin-top: 128px;
}

body.single-training main [data-block="regels"][data-variant="normaal"] > ul > li:first-child,
body.single-leerlijn main [data-block="regels"][data-variant="normaal"] > ul > li:first-child {
	padding-top: 80px;
	border-top: 1px solid var(--color-line);
}

body.single-leerlijn main [data-block="tekst"] {
	max-width: none;
	margin-bottom: 0;
	padding-top: 80px;
	border-top: 1px solid var(--color-line);
	color: var(--color-brand-4);
	font-size: 40px;
	font-weight: 500;
	line-height: 50px;
	letter-spacing: -0.8px;
	text-align: left;
}

body.single-training main [data-regel="tekst"] ul,
body.single-leerlijn main [data-regel="tekst"] ul {
	margin: 32px 0 0;
	padding: 0;
	list-style: none;
}

body.single-training main [data-regel="tekst"] li,
body.single-leerlijn main [data-regel="tekst"] li {
	display: flex;
	align-items: flex-start;
	gap: 32px;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

body.single-training main [data-regel="tekst"] li + li,
body.single-leerlijn main [data-regel="tekst"] li + li {
	margin-top: 32px;
}

body.single-training main [data-regel="tekst"] li::before,
body.single-leerlijn main [data-regel="tekst"] li::before {
	content: "";
	flex: none;
	width: 27px;
	height: 18px;
	margin-top: 4px;
	background: currentColor;
	transform: rotate(-14deg);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 18' fill='none'%3E%3Cpath d='M2 9.5 9.5 16 25 2' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 18' fill='none'%3E%3Cpath d='M2 9.5 9.5 16 25 2' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.single-training main [data-block="regels"] [data-regel="knop"] a:not([data-stijl="outline"]),
body.single-leerlijn main [data-block="regels"] [data-regel="knop"] a:not([data-stijl="outline"]) {
	background: var(--color-brand-3);
	color: #f7f3ed;
}

body.single-training main [data-block="regels"] [data-regel="knop"] a:not([data-stijl="outline"]):hover,
body.single-training main [data-block="regels"] [data-regel="knop"] a:not([data-stijl="outline"]):focus-visible,
body.single-leerlijn main [data-block="regels"] [data-regel="knop"] a:not([data-stijl="outline"]):hover,
body.single-leerlijn main [data-block="regels"] [data-regel="knop"] a:not([data-stijl="outline"]):focus-visible {
	background: var(--color-brand-4);
	color: #f7f3ed;
}

main [data-block="formulier"][data-variant="aanvraag"] {
	width: 100vw;
	max-width: 100vw;
	margin-top: 128px;
	margin-left: calc(50% - 50vw);
	box-sizing: border-box;
	padding: 64px var(--gutter);
	background: var(--color-bg);
}

main [data-block="formulier"][data-variant="aanvraag"] h2 {
	width: min(var(--container), 100%);
	margin: 0 auto 54px;
	color: var(--color-brand-4);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-block="formulier"][data-variant="aanvraag"] form {
	display: flex;
	flex-direction: column;
	gap: 54px;
	width: min(var(--container), 100%);
	max-width: none;
	margin-inline: auto;
}

main [data-block="formulier"][data-variant="aanvraag"] .formulier-rij {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

main [data-block="formulier"][data-variant="aanvraag"] .formulier-vraag {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

main [data-block="formulier"][data-variant="aanvraag"] .formulier-rij label,
main [data-block="formulier"][data-variant="aanvraag"] textarea {
	display: block;
}

main [data-block="formulier"][data-variant="aanvraag"] input:not([type="checkbox"]),
main [data-block="formulier"][data-variant="aanvraag"] textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 24px;
	border: 0;
	border-radius: 15px;
	background: #fff;
	color: #2a2622;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="formulier"][data-variant="aanvraag"] textarea {
	min-height: 240px;
	resize: vertical;
}

main [data-block="formulier"][data-variant="aanvraag"] input::placeholder,
main [data-block="formulier"][data-variant="aanvraag"] textarea::placeholder {
	color: var(--color-line);
	opacity: 1;
}

main [data-block="formulier"][data-variant="aanvraag"] label:has(input[type="checkbox"]) {
	display: flex;
	align-items: center;
	gap: 12px;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="formulier"][data-variant="aanvraag"] input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 2px;
	background: #fff;
	accent-color: var(--color-brand-3);
}

main [data-block="formulier"][data-variant="aanvraag"] a {
	color: inherit;
}

main [data-block="formulier"][data-variant="aanvraag"] button {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	align-self: flex-start;
	padding: 16px 30px 20px;
	border: 1px solid var(--color-brand-3);
	border-radius: 15px;
	background: transparent;
	color: var(--color-brand-3);
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
	cursor: pointer;
}

main [data-block="formulier"][data-variant="aanvraag"] button::after {
	content: "";
	width: 24px;
	height: 24px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9 6l6 6-6 6' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9 6l6 6-6 6' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

main [data-block="formulier"][data-variant="aanvraag"] button:hover,
main [data-block="formulier"][data-variant="aanvraag"] button:focus-visible {
	background: var(--color-brand-3);
	color: var(--color-bg);
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) {
	width: 100vw;
	max-width: 100vw;
	margin-top: 104px;
	margin-left: calc(50% - 50vw);
	box-sizing: border-box;
	padding: 64px var(--gutter);
	background: var(--color-bg);
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) h2 {
	width: min(var(--container), 100%);
	margin: 0 auto 54px;
	color: var(--color-brand-4);
	font-size: 70px;
	font-weight: 400;
	line-height: 70px;
	letter-spacing: -1.4px;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) form {
	display: flex;
	flex-direction: column;
	gap: 54px;
	width: min(var(--container), 100%);
	max-width: none;
	margin-inline: auto;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) h3 {
	margin: 0;
	color: #2a2622;
	font-size: 32px;
	font-weight: 400;
	line-height: 44px;
	letter-spacing: -0.32px;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) .formulier-rij {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) .formulier-vraag {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) .formulier-rij label,
main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) .formulier-keuze label,
main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) textarea {
	display: block;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) input:not([type="checkbox"]),
main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) textarea,
main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) select {
	width: 100%;
	box-sizing: border-box;
	padding: 24px;
	border: 0;
	border-radius: 15px;
	background: #fff;
	color: #2a2622;
	font: inherit;
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) select {
	appearance: none;
	padding-right: 56px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 7' fill='none'%3E%3Cpath d='M1 1l6 5 6-5' stroke='%23c9b9aa' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 24px center;
	background-size: 14px 7px;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) textarea {
	min-height: 240px;
	resize: vertical;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) input::placeholder,
main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) textarea::placeholder {
	color: var(--color-line);
	opacity: 1;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) select:has(option[value=""]:checked) {
	color: var(--color-line);
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) label:has(input[type="checkbox"]) {
	display: flex;
	align-items: center;
	gap: 12px;
	color: #2a2622;
	font-size: 18px;
	font-weight: 300;
	line-height: 28px;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 2px;
	background: #fff;
	accent-color: var(--color-brand-3);
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) a {
	color: inherit;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) button {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	align-self: flex-start;
	padding: 16px 30px 20px;
	border: 1px solid var(--color-brand-4);
	border-radius: 15px;
	background: transparent;
	color: var(--color-brand-4);
	font-size: 22px;
	font-weight: 400;
	line-height: 32px;
	cursor: pointer;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) button::after {
	content: "";
	width: 24px;
	height: 24px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9 6l6 6-6 6' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9 6l6 6-6 6' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) button:hover,
main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) button:focus-visible {
	background: var(--color-brand-4);
	color: var(--color-bg);
}

@media (max-width: 1100px) {
	body.single-training main [data-block="aanbod-intro"] .regel,
	body.single-leerlijn main [data-block="aanbod-intro"] .regel {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 24px;
	}

	main [data-block="formulier"][data-variant="aanvraag"] h2,
	main [data-hero="training"] .aanbod-hero h1,
	main [data-hero="leerlijn"] .aanbod-hero h1 {
		font-size: 48px;
		line-height: 52px;
	}
}

@media (max-width: 800px) {
	body.single-training main [data-block="aanbod-intro"] h2,
	body.single-leerlijn main [data-block="aanbod-intro"] h2,
	body.single-training main [data-block="regels"][data-variant="normaal"] h3,
	body.single-leerlijn main [data-block="regels"][data-variant="normaal"] h3,
	body.single-leerlijn main [data-block="tekst"] {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: 0;
	}
}

@media (max-width: 767px) {
	main [data-hero="training"] .aanbod-hero,
	main [data-hero="leerlijn"] .aanbod-hero {
		min-height: 280px;
		padding-bottom: 32px;
	}

	main [data-hero="training"] .aanbod-hero h1,
	main [data-hero="leerlijn"] .aanbod-hero h1,
	main [data-block="formulier"][data-variant="aanvraag"] h2 {
		font-size: 40px;
		line-height: 44px;
		letter-spacing: -0.8px;
	}

	body.single-training main [data-block="aanbod-intro"],
	body.single-leerlijn main [data-block="aanbod-intro"],
	body.single-leerlijn main [data-block="tekst"] {
		margin-top: 40px;
		padding-top: 48px;
	}

	body.single-training main [data-block="aanbod-intro"] + section,
	body.single-leerlijn main [data-block="aanbod-intro"] + section,
	body.single-training main [data-block="regels"] + section,
	body.single-leerlijn main [data-block="regels"] + section,
	body.single-leerlijn main [data-block="tekst"] + section,
	main [data-block="formulier"][data-variant="aanvraag"] {
		margin-top: 64px;
	}

	body.single-training main [data-block="regels"][data-variant="normaal"] > ul > li:first-child,
	body.single-leerlijn main [data-block="regels"][data-variant="normaal"] > ul > li:first-child {
		padding-top: 48px;
	}

	body.single-training main [data-block="aanbod-intro"] p,
	body.single-leerlijn main [data-block="aanbod-intro"] p {
		font-size: 18px;
		line-height: 28px;
	}

	main [data-block="formulier"][data-variant="aanvraag"] {
		padding-block: 48px;
	}

	main [data-block="formulier"][data-variant="aanvraag"] .formulier-rij {
		grid-template-columns: minmax(0, 1fr);
	}

	main [data-block="formulier"][data-variant="aanvraag"] input:not([type="checkbox"]),
	main [data-block="formulier"][data-variant="aanvraag"] textarea {
		font-size: 18px;
		line-height: 28px;
	}

	body.site-theme-jobcoaching:has([data-hero="aanmelden"]) main [data-block="hero"] .hero-band {
		min-height: 260px;
		padding-bottom: 32px;
	}

	body.site-theme-jobcoaching:has([data-hero="aanmelden"]) main [data-block="hero"] .hero-band h1 {
		font-size: 40px;
		line-height: 48px;
		letter-spacing: -0.8px;
	}

	body.page-template-aanmelden main [data-block="jezelf"] {
		margin-top: 40px;
	}

	body.page-template-aanmelden main .aanmeld-keuzes {
		grid-template-columns: minmax(0, 1fr);
	}

	body.page-template-aanmelden main .aanmeld-keuzes > a,
	body.page-template-aanmelden main .aanmeld-keuzes > div {
		min-height: 0;
		padding: 32px 24px;
	}

	body.page-template-aanmelden main .aanmeld-keuzes h2 {
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	body.page-template-aanmelden main .aanmeld-meer {
		padding: 12px 20px;
		font-size: 18px;
		line-height: 24px;
	}

	body.page-template-aanmelden main [data-block="jezelf"] + [data-block="regels"],
	body.page-template-aanmeldformulier main [data-block="hero"] + [data-block="regels"],
	main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) {
		margin-top: 40px;
	}

	body.page-template-aanmelden main [data-block="regels"][data-variant="normaal"] > ul > li:first-child,
	body.page-template-aanmeldformulier main [data-block="regels"][data-variant="normaal"] > ul > li:first-child {
		padding-top: 32px;
	}

	body.page-template-aanmeldformulier main [data-block="hero"] .hero-intro {
		padding-block: 32px;
	}

	body.page-template-aanmeldformulier main [data-block="hero"] .hero-intro p {
		font-size: 22px;
		line-height: 32px;
		letter-spacing: 0;
	}

	main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) {
		padding-block: 32px;
	}

	main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) h2 {
		margin-bottom: 32px;
		font-size: 32px;
		line-height: 40px;
		letter-spacing: -0.64px;
	}

	main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) h3 {
		font-size: 22px;
		line-height: 32px;
	}

	main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) .formulier-rij {
		grid-template-columns: minmax(0, 1fr);
	}

	main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) input:not([type="checkbox"]),
	main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) textarea,
	main [data-block="formulier"]:is([data-variant="jezelf"], [data-variant="kandidaat"]) select {
		font-size: 18px;
		line-height: 28px;
	}
}