/* ==========================================================================
   SAMEN STERK GOOI - PARTICIPATIEHUB REGIO 2
   Aanvullende stylesheet voor Gebied Online

   Dit bestand wordt NA generated.min.css geladen. Daardoor kunnen regels uit
   de gegenereerde stylesheet hier veilig en blijvend worden verfijnd.

   Uitgangspunten
   - Officieel diep paars: #5A2D42
   - Officieel regioblauw (regio 2): #2274A5
   - Grote vlakken zijn bewust lichter en warmer gemaakt.
   - Verzadigd paars en blauw worden vooral gebruikt voor herkenning,
     navigatie, knoppen en kleine accenten.
   - Het officiële logo zelf wordt nooit met CSS van kleur veranderd.

   Versie: 3.18 - 6 september 2026
   Inclusief de pagina-opmaak voor "Omzien naar elkaar".
   Inclusief een responsieve grid-row en thematische media-kaarten.
   ========================================================================== */


/* ==========================================================================
   0. APTOS WEBFONTS

   De fontbestanden staan één map boven deze stylesheet, in:
   /networks/gooi/fonts/

   Alleen de gewichten die de website werkelijk gebruikt worden geladen.
   font-display: swap zorgt dat tekst direct leesbaar blijft terwijl het
   webfont wordt opgehaald.

   Let op: controleer of de beschikbare Aptos-licentie webhosting en
   web-embedding toestaat. Technisch worden de bestanden correct aangeboden,
   maar gebruiksrechten worden niet door CSS geregeld.
   ========================================================================== */

@font-face {
	font-family: "Aptos Web";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("/networks/gooi/fonts/Aptos.ttf") format("truetype");
}

@font-face {
	font-family: "Aptos Web";
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url("/networks/gooi/fonts/Aptos-Italic.ttf") format("truetype");
}

@font-face {
	font-family: "Aptos Web";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("/networks/gooi/fonts/Aptos-SemiBold.ttf") format("truetype");
}

@font-face {
	font-family: "Aptos Web";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("/networks/gooi/fonts/Aptos-Bold.ttf") format("truetype");
}

@font-face {
	font-family: "Aptos Web";
	font-style: italic;
	font-weight: 700;
	font-display: swap;
	src: url("/networks/gooi/fonts/Aptos-Bold-Italic.ttf") format("truetype");
}


/* ==========================================================================
   1. KLEUREN EN BASISWAARDEN
   ========================================================================== */

:root {
	/* Officiële merkkleuren */
	--ssg-purple: #5A2D42;
	--ssg-blue: #2274A5;

	/* Donkere varianten voor hover, focus en kleine contrastaccenten */
	--ssg-purple-dark: #3F1F2E;
	--ssg-blue-dark: #18577D;

	/* Zachte varianten voor grotere vlakken */
	--ssg-purple-soft: #F5EFF2;
	--ssg-purple-mid: #E8D9E0;
	--ssg-blue-soft: #E9F2F7;
	--ssg-blue-mid: #CFE1EC;

	/* Warme neutralen */
	--ssg-page: #FAF8F6;
	--ssg-surface: #FFFFFF;
	--ssg-surface-muted: #F3F0EE;
	--ssg-sand: #EEE7E1;

	/* Tekst, randen en schaduw */
	--ssg-text: #2F2A2C;
	--ssg-text-muted: #6E6569;
	--ssg-border: #DDD5D8;
	--ssg-shadow: 0 0.45rem 1.35rem rgb(63 31 46 / 10%);
	--ssg-shadow-hover: 0 0.75rem 1.8rem rgb(63 31 46 / 15%);

	/* Vormen en afstanden */
	--ssg-radius-sm: 0.4rem;
	--ssg-radius: 0.75rem;
	--ssg-radius-lg: 1.15rem;
	--ssg-focus-ring: 0 0 0 0.25rem rgb(34 116 165 / 25%);

	/* Standaardaccent voor onderdelen die de kleur van hun omgeving erven. */
	--ssg-accent: var(--ssg-blue-dark);
	--ssg-accent-border: var(--ssg-blue-mid);

	/* Bootstrap-variabelen laten aansluiten op de huisstijl */
	--bs-primary: #2274A5;
	--bs-primary-rgb: 34, 116, 165;
	--bs-body-color: #2F2A2C;
	--bs-body-color-rgb: 47, 42, 44;
	--bs-body-bg: #FAF8F6;
	--bs-body-bg-rgb: 250, 248, 246;
	--bs-link-color: #2274A5;
	--bs-link-color-rgb: 34, 116, 165;
	--bs-link-hover-color: #18577D;
	--bs-link-hover-color-rgb: 24, 87, 125;
	--bs-border-color: #DDD5D8;
	--bs-border-radius: 0.75rem;
}


/* ==========================================================================
   2. PAGINA EN TYPOGRAFIE

   Aptos Web verwijst naar de hierboven ingeladen fontbestanden. Segoe UI,
   Arial en sans-serif blijven als veilige fallback aanwezig.
   ========================================================================== */

html {
	color: var(--ssg-text);
	background-color: var(--ssg-page);
}

body.go_page,
button,
input,
select,
textarea {
	font-family: "Aptos Web", "Segoe UI", Arial, sans-serif;
}

body.go_page {
	color: var(--ssg-text);
	background-color: var(--ssg-page);
	font-size: 1.125rem;
	line-height: 1.6;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.go_row-title,
.go_block-title,
.go_card-title-wrapper {
	color: var(--ssg-text);
	font-family: "Aptos Web", "Segoe UI", Arial, sans-serif;
	font-weight: 700;
	line-height: 1.18;
	letter-spacing: -0.015em;
}

.go_row-title {
	margin-bottom: clamp(1.25rem, 2.5vw, 2.25rem);
	font-size: clamp(1.85rem, 3.2vw, 2.75rem);
	font-variant-caps: normal;
	text-transform: none !important;
}

.go_block-title {
	font-size: clamp(1.35rem, 2vw, 1.75rem);
}

p,
li {
	color: inherit;
}

.text-muted,
.go_card-meta-wrapper,
.meta-wrapper,
.category-wrapper {
	color: var(--ssg-text-muted) !important;
}

/* Selectietekst sluit aan op het zachte regioblauw. */
::selection {
	color: var(--ssg-text);
	background: var(--ssg-blue-mid);
}


/* ==========================================================================
   3. LINKS EN TOETSENBORDFOCUS
   ========================================================================== */

a:not(.btn):not(.nav-link) {
	color: var(--ssg-blue);
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.16em;
}

a:not(.btn):not(.nav-link):hover {
	color: var(--ssg-blue-dark);
}

/* Een duidelijke focusmarkering is belangrijk voor toetsenbordgebruikers. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
	outline: 3px solid var(--ssg-blue-dark) !important;
	outline-offset: 3px;
	box-shadow: none !important;
}


/* ==========================================================================
   4. HEADER EN NAVIGATIE

   Gebied Online maakt standaard twee balken: bovenin het logo met de
   hulplinks en daaronder de hoofdnavigatie. Op desktop leggen we de logobalk
   over de menubalk heen. Zo ontstaat visueel een enkele rustige header, zoals
   in de mock-up en bij de Achterhoek-site. De opgeslagen netwerkafbeelding
   blijft het echte logo; CSS vervangt of vervormt het beeldmerk niet.
   ========================================================================== */

.go_page-top-wrapper,
.go_menu-top-bar,
.go_main-menu-bar,
.go_main-menu-wrapper,
nav.go_hoofdmenu,
nav.go_hoofdmenu .cx_menu-container {
	background-color: var(--ssg-surface) !important;
}

.go_page-top-wrapper,
.go_main-menu-bar {
	border-color: var(--ssg-border) !important;
}

@media (min-width: 768px) {
	.go_page-top-wrapper {
		position: relative;
		min-height: 0;
		border-bottom: 1px solid var(--ssg-border) !important;
		box-shadow: 0 0.2rem 1rem rgb(47 42 44 / 5%);
	}

	/* Een compacte utilityregel boven de eigenlijke hoofdheader. */
	.go_menu-top-bar {
		position: relative;
		z-index: 1;
		inset: auto;
		height: 2.5rem !important;
		min-height: 2.5rem !important;
		max-height: 2.5rem !important;
		padding: 0 !important;
		background: #F3F4F5 !important;
		pointer-events: auto;
	}

	.go_menu-top-bar > .cx_menu-container,
	.go_menu-top-row {
		height: 2.5rem !important;
		min-height: 2.5rem !important;
		max-height: 2.5rem !important;
	}

	.go_menu-top-row {
		align-items: center !important;
		margin: 0 !important;
	}

	/* Het desktoplogo verhuist naar de hoofdmenubalk. */
	.go_menu-top-row > .col-4 {
		display: none !important;
	}

	.go_menu-top-wrapper {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		flex: 0 0 100% !important;
		font-size: 1rem !important;
	}

	.go_menu-top-wrapper > .d-flex,
	.go_top-menu-user {
		height: 2.5rem !important;
		min-height: 2.5rem !important;
		max-height: 2.5rem !important;
		align-items: center !important;
	}

	.go_top-menu-user {
		display: flex !important;
		flex-direction: row !important;
		justify-content: flex-end !important;
		gap: 1rem !important;
	}

	.go_topmenu-user-button,
	.go_topmenu-user-button:hover,
	.go_topmenu-user-button:focus,
	.go_topmenu-user-button:active {
		display: inline-flex !important;
		flex-direction: row !important;
		align-items: center !important;
		align-self: center !important;
		justify-content: flex-start !important;
		gap: 0.4rem !important;
		height: 2.5rem !important;
		min-height: 2.5rem !important;
		max-height: 2.5rem !important;
		margin: 0 !important;
		padding: 0 0.25rem !important;
		font-size: 1rem !important;
		font-weight: 400 !important;
		line-height: 1.2 !important;
		text-align: left !important;
		white-space: nowrap !important;
		transform: none !important;
	}

	.go_topmenu-user-button i,
	.go_topmenu-user-button:hover i,
	.go_topmenu-user-button:focus i {
		display: inline-flex !important;
		align-items: center !important;
		align-self: center !important;
		justify-content: center !important;
		width: 1.15rem !important;
		height: 1.15rem !important;
		font-size: 1rem !important;
		line-height: 1 !important;
	}

	.go_topmenu-user-button > div {
		font-size: 1rem !important;
		line-height: 1.2 !important;
	}

	.go_main-menu-bar,
	.go_main-menu-wrapper,
	nav.go_hoofdmenu,
	nav.go_hoofdmenu .cx_menu-container {
		height: 5rem !important;
		min-height: 5rem !important;
		max-height: 5rem !important;
	}

	.go_main-menu-bar {
		height: 5rem !important;
		min-height: 5rem !important;
		max-height: 5rem !important;
		border: 0 !important;
		border-top: 1px solid var(--ssg-border) !important;
	}

	/* Logo links en hoofdnavigatie rechts in de dominante tweede rij. */
	nav.go_hoofdmenu .cx_menu-container {
		display: flex !important;
		align-items: center !important;
		width: 100%;
		padding-left: 0;
	}

	nav.go_hoofdmenu .go_mobile-logo.d-md-none {
		display: inline-flex !important;
		align-items: center !important;
		flex: 0 0 auto !important;
		height: 5rem !important;
		min-height: 5rem !important;
		margin: 0 2rem 0 0 !important;
		padding: 0.45rem 0 !important;
	}

	nav.go_hoofdmenu .go_mobile-logo img {
		display: block !important;
		width: auto !important;
		height: auto !important;
		max-width: 15rem !important;
		max-height: 4rem !important;
		object-fit: contain !important;
		object-position: left center !important;
	}

	.go_hoofdmenu .navbar-collapse {
		flex: 1 1 auto !important;
		justify-content: flex-end !important;
	}

	.go_hoofdmenu .navbar-nav {
		align-items: stretch;
		margin-right: 0 !important;
		margin-left: auto !important;
	}

	/* De mock-up heeft geen los zoekicoon in de hoofdregel. */
	.go_hoofdmenu .go_open-search {
		display: none !important;
	}
}

.go_hoofdmenu .navbar-nav > .nav-item > .nav-link {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 3.25rem;
	margin: 0 0.1rem;
	padding: 0.75rem 0.8rem;
	color: var(--ssg-text) !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0;
	font-size: 1rem;
	font-weight: 400;
	white-space: nowrap;
	transition: color 160ms ease, background-color 160ms ease;
}

/* Een apart pseudo-element voorkomt conflict met het dropdown-pijltje. */
.go_hoofdmenu .navbar-nav > .nav-item > .nav-link::before {
	content: "";
	position: absolute;
	right: 0.8rem;
	bottom: 0.28rem;
	left: 0.8rem;
	height: 0.125rem;
	background-color: var(--ssg-blue);
	border-radius: 999px;
	transform: scaleX(0);
	transform-origin: center;
	transition: transform 180ms ease;
}

.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:hover,
.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:focus {
	color: var(--ssg-blue-dark) !important;
	background-color: transparent !important;
}

.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:hover::before,
.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:focus::before {
	transform: scaleX(1);
}

/* Actief: blauwe tekst en een volledige blauwe onderstreping. */
.go_hoofdmenu .navbar-nav > .active > .nav-link,
.go_hoofdmenu .navbar-nav > .active > .nav-link:hover,
.go_hoofdmenu .navbar-nav > .active > .nav-link:focus,
.go_hoofdmenu .navbar-nav > .nav-item > .nav-link.active {
	color: var(--ssg-blue-dark) !important;
	background-color: transparent !important;
	box-shadow: none !important;
}

.go_hoofdmenu .navbar-nav > .active > .nav-link::before,
.go_hoofdmenu .navbar-nav > .nav-item > .nav-link.active::before,
.go_hoofdmenu .navbar-nav > .nav-item > .nav-link[aria-current="page"]::before {
	transform: scaleX(1);
}

/* Op deze Gebied Online-pagina zet de server momenteel geen active-class op
   de menulink. De stabiele paginaclass maakt de actieve staat toch zichtbaar. */
body.go_page-webpage-3187
.go_hoofdmenu
.navbar-nav
> .nav-item
> .nav-link[href="/omziennaarelkaar/"],
body.go_page-webpage-3187
.go_hoofdmenu
.navbar-nav
> .nav-item
> .nav-link[href="/omziennaarelkaar"] {
	color: var(--ssg-blue-dark) !important;
	background-color: transparent !important;
	box-shadow: none !important;
}

body.go_page-webpage-3187
.go_hoofdmenu
.navbar-nav
> .nav-item
> .nav-link[href="/omziennaarelkaar/"]::before,
body.go_page-webpage-3187
.go_hoofdmenu
.navbar-nav
> .nav-item
> .nav-link[href="/omziennaarelkaar"]::before {
	transform: scaleX(1);
}

.dropdown-menu {
	background-color: var(--ssg-surface);
	border-color: var(--ssg-border);
	border-radius: var(--ssg-radius);
	box-shadow: var(--ssg-shadow);
}

.dropdown-item {
	color: var(--ssg-text);
}

.dropdown-item:hover,
.dropdown-item:focus,
.dropdown-item.active {
	color: var(--ssg-blue-dark);
	background-color: var(--ssg-blue-soft);
}

/* Dropdowns in de hoofdnavigatie sluiten visueel aan op de kaarten. */
.go_hoofdmenu .dropdown-menu {
	min-width: 15rem;
	margin-top: 0.12rem !important;
	padding: 0.45rem;
	background-color: rgb(255 255 255 / 98%);
	border: 0;
	border-radius: 0 0 var(--ssg-radius) var(--ssg-radius);
	/* Negatieve spread houdt de schaduw onder het menu, niet erboven. */
	box-shadow: 0 1.35rem 1.8rem -1.15rem rgb(63 31 46 / 22%);
}

.go_hoofdmenu .dropdown-item {
	position: relative;
	padding: 0.62rem 0.8rem;
	color: var(--ssg-text);
	border-radius: var(--ssg-radius-sm);
	font-size: 1rem;
	line-height: 1.3;
	white-space: normal;
	transition:
	color 150ms ease,
	background-color 150ms ease,
	box-shadow 150ms ease,
	transform 150ms ease;
}

.go_hoofdmenu .dropdown-item:hover,
.go_hoofdmenu .dropdown-item:focus {
	color: var(--ssg-blue-dark);
	background-color: var(--ssg-blue-soft);
	box-shadow: none;
	transform: translateX(0.18rem);
}

.go_hoofdmenu .dropdown-item.active,
.go_hoofdmenu .dropdown-item:active {
	color: #FFFFFF;
	background-color: var(--ssg-purple);
	box-shadow: none;
}

/* Een actieve desktop-submenulink blijft ook bij hover en focus wit op paars. */
@media (min-width: 768px) {
	.go_hoofdmenu .dropdown-menu .dropdown-item.active,
	.go_hoofdmenu .dropdown-menu .dropdown-item.active:hover,
	.go_hoofdmenu .dropdown-menu .dropdown-item.active:focus,
	.go_hoofdmenu .dropdown-menu .dropdown-item.active:focus-visible,
	.go_hoofdmenu .dropdown-menu li.active > .dropdown-item,
	.go_hoofdmenu .dropdown-menu li.active > .dropdown-item:hover,
	.go_hoofdmenu .dropdown-menu li.active > .dropdown-item:focus {
		color: #FFFFFF !important;
		background-color: var(--ssg-purple) !important;
	}
}

.go_hoofdmenu .dropdown-divider {
	margin: 0.35rem 0;
	border-color: var(--ssg-border);
}

.go_hoofdmenu .dropdown-toggle::after {
	transition: transform 180ms ease;
}

/* Bootstrap opent dropdowns standaard bewust op klik. Op desktopapparaten
   met een echte muis gebruiken we hover; toetsenbordbediening blijft werken. */
@media (min-width: 768px) and (hover: hover) {
	/* Desktop: de bovenliggende dropdownnaam is een hoverlabel, geen muislink.
     De submenu-items zelf blijven uiteraard gewoon aanklikbaar. */
	.go_hoofdmenu .navbar-nav > .dropdown > .dropdown-toggle {
		cursor: default;
		pointer-events: none;
	}

	.go_hoofdmenu .navbar-nav > .dropdown > .dropdown-menu {
		display: block;
		visibility: hidden;
		opacity: 0;
		pointer-events: none;
		transform: translateY(0.55rem);
		transition:
		visibility 0s linear 160ms,
		opacity 160ms ease,
		transform 160ms ease;
	}

	/* Transparante hoverbrug tussen hoofdlink en submenu. Zonder deze box
     verlaat de aanwijzer onderweg heel even het hovergebied en klapt het
     submenu dicht voordat een keuze kan worden bereikt. */
	.go_hoofdmenu .navbar-nav > .dropdown > .dropdown-menu::before {
		content: "";
		position: absolute;
		right: 0;
		bottom: 100%;
		left: 0;
		height: 0.9rem;
		background: transparent;
		pointer-events: auto;
	}

	.go_hoofdmenu .navbar-nav > .dropdown:hover > .dropdown-menu,
	.go_hoofdmenu .navbar-nav > .dropdown > .dropdown-menu.show {
		visibility: visible;
		opacity: 1;
		pointer-events: auto;
		transform: translateY(0);
		transition-delay: 0s;
	}

	.go_hoofdmenu .navbar-nav > .dropdown:hover > .dropdown-toggle::after,
	.go_hoofdmenu .navbar-nav > .dropdown > .dropdown-toggle.show::after {
		transform: rotate(180deg);
	}
}


/* ==========================================================================
   5. KNOPPEN
   ========================================================================== */

.btn,
.go_button,
.cx_btn {
	border-radius: var(--ssg-radius);
	font-weight: 600;
	transition:
	color 160ms ease,
	background-color 160ms ease,
	border-color 160ms ease,
	box-shadow 160ms ease,
	transform 160ms ease;
}

/* Call-to-actionknoppen in de drie Omzien-rijen krijgen het pijlmotief. */
.go_row:is(.ssg-row-intro, .ssg-row-blue-soft, .ssg-row-purple-soft, .grid)
a.go_button:not(.dropdown-toggle)::after {
	content: "\2192";
	display: inline-block;
	margin-left: 0.8rem;
	font-size: 1.25em;
	font-weight: 400;
	line-height: 0;
	transform: translateX(0);
	transition: transform 180ms ease;
}

/* De knoptekst volgt dezelfde leesmaat als de lopende tekst. */
.go_content-wrapper :is(.go_button, .btn) {
	font-size: clamp(1.1rem, 0.35vw + 1rem, 1.25rem);
}

.btn-primary,
.go_button.btn-primary,
.cx_btn.btn-primary {
	color: #FFFFFF !important;
	background-color: var(--ssg-blue) !important;
	border-color: var(--ssg-blue) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.go_button.btn-primary:hover,
.go_button.btn-primary:focus,
.cx_btn.btn-primary:hover,
.cx_btn.btn-primary:focus {
	color: #FFFFFF !important;
	background-color: var(--ssg-blue-dark) !important;
	border-color: var(--ssg-blue-dark) !important;
	box-shadow: 0 0.7rem 1.35rem rgb(24 87 125 / 24%);
	transform: translateY(-2px);
}

.go_row:is(.ssg-row-intro, .ssg-row-blue-soft, .ssg-row-purple-soft, .grid)
a.go_button:not(.dropdown-toggle):hover::after,
.go_row:is(.ssg-row-intro, .ssg-row-blue-soft, .ssg-row-purple-soft, .grid)
a.go_button:not(.dropdown-toggle):focus::after {
	transform: translateX(0.3rem);
}

/* Op de lichtpaarse strook volgt de primaire actie dezelfde kleurfamilie. */
.go_row:is(.ssg-row-purple-soft, .grid) :is(.go_button, .btn).btn-primary {
	color: #FFFFFF !important;
	background-color: var(--ssg-purple) !important;
	border-color: var(--ssg-purple) !important;
}

.go_row:is(.ssg-row-purple-soft, .grid) :is(.go_button, .btn).btn-primary:hover,
.go_row:is(.ssg-row-purple-soft, .grid) :is(.go_button, .btn).btn-primary:focus {
	color: #FFFFFF !important;
	background-color: var(--ssg-purple-dark) !important;
	border-color: var(--ssg-purple-dark) !important;
	box-shadow: 0 0.7rem 1.35rem rgb(90 45 66 / 26%);
}

.btn-secondary,
.go_button.btn-secondary,
.cx_btn.btn-secondary {
	color: var(--ssg-purple) !important;
	background-color: var(--ssg-purple-soft) !important;
	border-color: var(--ssg-purple-mid) !important;
}

.btn-secondary:hover,
.btn-secondary:focus,
.go_button.btn-secondary:hover,
.go_button.btn-secondary:focus,
.cx_btn.btn-secondary:hover,
.cx_btn.btn-secondary:focus {
	color: #FFFFFF !important;
	background-color: var(--ssg-purple) !important;
	border-color: var(--ssg-purple) !important;
}


/* ==========================================================================
   6. RIJEN EN ALGEMENE INHOUD

   De globale go_row-achtergrond wordt niet geforceerd. Gebied Online kan per
   rij een inline achtergrondkleur instellen. Gebruik de optionele classes
   uit sectie 10 om een specifieke rij bewust vorm te geven.
   ========================================================================== */

.go_content-wrapper {
	color: var(--ssg-text);
	background-color: var(--ssg-page);
}

.go_row {
	--ssg-accent: var(--ssg-blue-dark);
	--ssg-accent-border: var(--ssg-blue-mid);
	color: var(--ssg-text);
}

/* Lopende tekst krijgt iets meer rust en leesmaat dan de systeemstandaard. */
.go_content-wrapper :is(.go_block-text, .go_container > p, .go_container > ul, .go_container > ol) {
	font-size: clamp(1.1rem, 0.35vw + 1rem, 1.25rem);
	line-height: 1.68;
}

.go_container,
.container,
.container-fluid,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
	--bs-gutter-x: clamp(1.5rem, 4vw, 3rem);
}

hr {
	color: var(--ssg-border);
	opacity: 1;
}


/* ==========================================================================
   7. BLOKKEN EN KAARTEN

   Alleen rustige structurele verbeteringen worden globaal toegepast.
   Achtergrondkleuren worden via optionele classes ingesteld, zodat bestaande
   afbeeldingen en bijzondere Gebied Online-blokken niet worden beschadigd.
   ========================================================================== */

.go_block-content,
.go_card,
.card {
	border-color: var(--ssg-border);
}

.go_card.go_card-with-border,
.card.go_card-with-border {
	border-color: var(--ssg-border);
	border-radius: var(--ssg-radius);
	box-shadow: 0 0.2rem 0.8rem rgb(63 31 46 / 6%);
}

.go_card.go_card-with-border:hover,
.card.go_card-with-border:hover {
	border-color: var(--ssg-blue-mid);
	box-shadow: var(--ssg-shadow-hover);
}

.go_block img,
.go_card img {
	height: auto;
}


/* ==========================================================================
   8. FORMULIEREN EN ZOEKVELDEN
   ========================================================================== */

.form-control,
.form-select,
input,
select,
textarea,
.go_filter-field-wrapper {
	color: var(--ssg-text);
	background-color: var(--ssg-surface);
	border-color: var(--ssg-border);
	border-radius: var(--ssg-radius-sm);
}

.form-control:focus,
.form-select:focus,
input:focus,
select:focus,
textarea:focus,
.go_filter-field-wrapper:focus-within {
	border-color: var(--ssg-blue);
	box-shadow: var(--ssg-focus-ring);
}

.go_search-wrapper,
.go_filter-wrapper {
	background-color: var(--ssg-blue-soft);
	border: 1px solid var(--ssg-blue-mid);
	border-radius: var(--ssg-radius-lg);
}

::placeholder {
	color: var(--ssg-text-muted);
	opacity: 1;
}


/* ==========================================================================
   9. FOOTER
   ========================================================================== */

.go_footer-web,
.go_footer-menuwrapper,
.go_footer-default-wrapper {
	color: #FFFFFF;
	background-color: var(--ssg-purple) !important;
}

.go_footer-web h1,
.go_footer-web h2,
.go_footer-web h3,
.go_footer-web h4,
.go_footer-web p,
.go_footer-web li,
.go_footer-web label,
.go_footer-web a {
	color: #FFFFFF !important;
}

.go_footer-web a:hover,
.go_footer-web a:focus {
	color: var(--ssg-blue-mid) !important;
}


/* ==========================================================================
   10. OPTIONELE ROW-CLASSES

   Registreer deze namen in Gebied Online met Usage: Row.

   ssg-row-white        - witte, rustige rij
   ssg-row-warm         - warm lichtgrijs vlak
   ssg-row-blue-soft    - zacht regioblauw vlak
   ssg-row-purple-soft  - zacht paars vlak
   ssg-row-purple       - officieel paars met witte tekst
   grid                 - zachtpaars raster: 3 desktop, 2 tablet, 1 mobiel
   ========================================================================== */

.go_row.ssg-row-white {
	color: var(--ssg-text);
	background-color: var(--ssg-surface) !important;
}

.go_row.ssg-row-warm {
	color: var(--ssg-text);
	background-color: var(--ssg-surface-muted) !important;
}

.go_row.ssg-row-blue-soft {
	--ssg-accent: var(--ssg-blue-dark);
	--ssg-accent-border: var(--ssg-blue-mid);
	color: var(--ssg-text);
	background-color: var(--ssg-blue-soft) !important;
}

.go_row:is(.ssg-row-purple-soft, .grid) {
	--ssg-accent: var(--ssg-purple);
	--ssg-accent-border: var(--ssg-purple-mid);
	color: var(--ssg-text);
	background-color: var(--ssg-purple-soft) !important;
}

.go_row.ssg-row-purple {
	--ssg-accent: #FFFFFF;
	--ssg-accent-border: var(--ssg-purple-mid);
	color: #FFFFFF;
	background-color: var(--ssg-purple) !important;
}


/* ==========================================================================
   10A. PAGINA "OMZIEN NAAR ELKAAR" - ROW-CLASSES

   Registreer met Usage: Row:
   ssg-row-intro, ssg-row-blue-soft en ssg-row-purple-soft.

   Deze regels maken de drie stroken zelfstandig toepasbaar. Ze veranderen
   dus niet iedere pagina van het netwerk.
   ========================================================================== */

.go_row:is(.ssg-row-intro, .ssg-row-blue-soft, .ssg-row-purple-soft, .grid) {
	padding-top: clamp(2rem, 4vw, 3.75rem);
	padding-bottom: clamp(2rem, 4vw, 3.75rem);
}

.go_row.ssg-row-intro {
	color: var(--ssg-text);
	background-color: var(--ssg-page) !important;
}

.go_row:is(.ssg-row-intro, .ssg-row-blue-soft, .ssg-row-purple-soft, .grid)
.go_row-title {
	margin-bottom: clamp(1.25rem, 2.5vw, 2rem);
	color: #171416 !important;
	font-size: clamp(2rem, 3vw, 2.75rem);
	font-variant-caps: normal;
	text-align: left !important;
	text-transform: none !important;
}

/* De strooktitel volgt optisch de binnenzijde van de kaarten, in plaats van
   strak tegen de uiterste containerrand te staan. */
.go_row:is(.ssg-row-intro, .ssg-row-blue-soft, .ssg-row-purple-soft, .grid)
> .go_container
> .go_row-title {
	padding-left: clamp(0.6rem, 1.2vw, 1.15rem);
}

.go_row.ssg-row-intro .go_row-title {
	font-size: clamp(2.65rem, 4.4vw, 4rem);
}

/* Stevige huisstijlkleuren op de zachte strookachtergronden. */
.go_row.ssg-row-blue-soft .go_row-title {
	color: var(--ssg-blue-dark) !important;
	font-size: clamp(2.5rem, 4vw, 3.5rem);
}

.go_row:is(.ssg-row-purple-soft, .grid) .go_row-title {
	color: var(--ssg-purple) !important;
	font-size: clamp(2.5rem, 4vw, 3.5rem);
}

/* Gebied Online maakt vaak kolommen van vijf grid-eenheden. Voor deze pagina
   worden twee blokken op desktop bewust twee gelijke helften. */
@media (min-width: 768px) {
	.go_row:is(.ssg-row-intro, .ssg-row-blue-soft, .ssg-row-purple-soft)
	.go_block-row > .cx_grid-col {
		flex: 0 0 50%;
		width: 50%;
		max-width: 50%;
	}

	.go_row:is(.ssg-row-intro, .ssg-row-blue-soft, .ssg-row-purple-soft)
	.go_block-row > .cx_grid-col > .go_block {
		height: 100%;
	}
}

/* De class grid heeft bewust een eigen kolomverdeling. Daardoor blijven de
   bestaande intro-, blauwe en paarse tweekolomsstroken exact zoals ze zijn. */
@media (min-width: 992px) {
	.go_row.grid .go_block-row > .cx_grid-col {
		flex: 0 0 33.333333%;
		width: 33.333333%;
		max-width: 33.333333%;
	}
}

@media (min-width: 768px) and (max-width: 991.98px) {
	.go_row.grid .go_block-row > .cx_grid-col {
		flex: 0 0 50%;
		width: 50%;
		max-width: 50%;
	}
}

.go_row.grid .go_block-row > .cx_grid-col > .go_block {
	height: 100%;
}

@media (max-width: 767.98px) {
	.go_row.grid .go_block-row > .cx_grid-col {
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
	}
}

.go_row.ssg-row-purple .go_row-title,
.go_row.ssg-row-purple h1,
.go_row.ssg-row-purple h2,
.go_row.ssg-row-purple h3,
.go_row.ssg-row-purple p,
.go_row.ssg-row-purple li,
.go_row.ssg-row-purple a:not(.btn) {
	color: #FFFFFF !important;
}


/* ==========================================================================
   11. OPTIONELE BLOCK-CLASSES

   Registreer deze namen in Gebied Online met Usage: Block.

   ssg-card-blue-soft    - informatief, rustig blauw
   ssg-card-purple-soft  - uitgelicht, rustig paars
   ssg-card-warm         - warm neutraal
   ssg-card-purple       - krachtig officieel paars
   ssg-card-bordered     - witte kaart met subtiele rand en schaduw
   ssg-card-intro        - introkaart met titel in kleine kapitalen
   ssg-card-copy         - witte tekstkaart, passend naast video of beeld
   ssg-media-cover       - beeldvullend; uitsnede toegestaan
   ssg-media-contain     - volledig zichtbaar beeld op witte achtergrond
   ssg-video             - responsief videoblok
   ========================================================================== */

.ssg-card-blue-soft .go_block-content,
.go_block-content.ssg-card-blue-soft {
	color: var(--ssg-text) !important;
	background-color: var(--ssg-blue-soft) !important;
	border: 1px solid var(--ssg-blue-mid) !important;
	border-radius: var(--ssg-radius-lg);
}

.ssg-card-blue-soft,
.go_block-content.ssg-card-blue-soft {
	--ssg-accent: var(--ssg-blue-dark);
	--ssg-accent-border: var(--ssg-blue-mid);
}

.ssg-card-purple-soft .go_block-content,
.go_block-content.ssg-card-purple-soft {
	color: var(--ssg-text) !important;
	background-color: var(--ssg-purple-soft) !important;
	border: 1px solid var(--ssg-purple-mid) !important;
	border-radius: var(--ssg-radius-lg);
}

.ssg-card-purple-soft,
.ssg-card-purple,
.go_block-content.ssg-card-purple-soft,
.go_block-content.ssg-card-purple {
	--ssg-accent: var(--ssg-purple);
	--ssg-accent-border: var(--ssg-purple-mid);
}

.ssg-card-warm .go_block-content,
.go_block-content.ssg-card-warm {
	color: var(--ssg-text) !important;
	background-color: var(--ssg-sand) !important;
	border: 1px solid var(--ssg-border) !important;
	border-radius: var(--ssg-radius-lg);
}

.ssg-card-bordered .go_block-content,
.go_block-content.ssg-card-bordered {
	color: var(--ssg-text) !important;
	background-color: var(--ssg-surface) !important;
	border: 1px solid var(--ssg-border) !important;
	border-radius: var(--ssg-radius-lg);
	box-shadow: var(--ssg-shadow);
}

.ssg-card-purple .go_block-content,
.go_block-content.ssg-card-purple {
	color: #FFFFFF !important;
	background-color: var(--ssg-purple) !important;
	border: 1px solid var(--ssg-purple) !important;
	border-radius: var(--ssg-radius-lg);
}

/* Zorg dat koppen, tekst en links de bedoelde kaartkleur overnemen. */
.ssg-card-blue-soft :is(.go_block-title, .go_block-text, p, li),
.ssg-card-purple-soft :is(.go_block-title, .go_block-text, p, li),
.ssg-card-warm :is(.go_block-title, .go_block-text, p, li),
.ssg-card-bordered :is(.go_block-title, .go_block-text, p, li) {
	color: var(--ssg-text) !important;
}

.ssg-card-purple :is(.go_block-title, .go_block-text, p, li, a:not(.btn)) {
	color: #FFFFFF !important;
}


/* ==========================================================================
   11A. PAGINA "OMZIEN NAAR ELKAAR" - BLOCK-CLASSES
   ========================================================================== */

.ssg-card-intro .go_block-content,
.ssg-card-copy .go_block-content {
	height: 100%;
	color: var(--ssg-text) !important;
	background-color: rgb(255 255 255 / 88%) !important;
	border: 1px solid rgb(90 45 66 / 12%) !important;
	border-radius: var(--ssg-radius);
	box-shadow: var(--ssg-shadow);
}

.ssg-card-copy .go_block-text {
	padding: clamp(1.35rem, 2.5vw, 2.25rem) !important;
}

/* Alleen deze ene bloktitel wordt in kleine kapitalen gezet. Rij- en andere
   bloktitels blijven daardoor gewone Nederlandse titelkapitalisatie houden. */
.ssg-card-intro .go_block-title {
	display: inline-flex;
	align-self: flex-start;
	width: fit-content;
	max-width: calc(100% - 4.5rem);
	margin-bottom: 0.65rem;
	margin-top: clamp(1.35rem, 2.5vw, 2.25rem);
	margin-right: clamp(1.35rem, 2.5vw, 2.25rem);
	margin-left: clamp(1.35rem, 2.5vw, 2.25rem);
	padding: 0.3rem 0.7rem;
	color: var(--ssg-blue-dark) !important;
	background: linear-gradient(
	115deg,
	var(--ssg-blue-soft) 0%,
	var(--ssg-purple-soft) 48%,
	var(--ssg-blue-soft) 100%
	);
	background-size: 220% 100%;
	border: 1px solid var(--ssg-blue-mid);
	border-radius: 999px;
	font-size: 1.05rem;
	font-variant-caps: all-small-caps;
	font-weight: 700;
	letter-spacing: 0.09em;
	text-align: left !important;
	text-transform: none !important;
	box-shadow: 0 0.15rem 0.5rem rgb(34 116 165 / 8%);
	transform: translateY(0) scale(1);
	transition:
	color 180ms ease,
	border-color 180ms ease,
	box-shadow 220ms ease,
	transform 220ms ease;
}

/* Voor deze kaart negeren we de titeluitlijning uit GebiedOnline. De pill
   begint altijd op exact dezelfde horizontale lijn als de tekst eronder. */
.ssg-card-intro .go_block-title:is(
.text-start,
.text-left,
.text-center,
.text-end,
.text-right
) {
	align-self: flex-start;
	text-align: left !important;
}

/* Blauwe en paarse merkkleuren lopen bij hover door de pill en de glow. */
.ssg-card-intro .go_block-title:hover {
	color: var(--ssg-purple-dark) !important;
	border-color: rgb(90 45 66 / 32%);
	box-shadow:
	0 0 0.8rem rgb(34 116 165 / 30%),
	0 0 1.45rem rgb(90 45 66 / 20%);
	transform: translateY(-0.12rem) scale(1.025);
	animation: ssg-pill-shimmer 1.8s ease-in-out infinite alternate;
}

@keyframes ssg-pill-shimmer {
	0% {
		background-position: 0% 50%;
	}

	100% {
		background-position: 100% 50%;
	}
}

.ssg-card-intro .go_block-text {
	padding:
	0
	clamp(1.35rem, 2.5vw, 2.25rem)
	clamp(1.35rem, 2.5vw, 2.25rem) !important;
}

.ssg-card-intro :is(p, li),
.ssg-card-copy :is(p, li) {
	color: var(--ssg-text) !important;
}

.ssg-card-intro p:last-child,
.ssg-card-copy p:last-child {
	margin-bottom: 0;
}

.ssg-media-cover .go_block-content,
.ssg-media-contain .go_block-content {
	height: 100%;
	min-height: 17rem;
	padding: 0 !important;
	overflow: hidden;
	background-color: #FFFFFF !important;
	border: 1px solid rgb(90 45 66 / 10%) !important;
	border-radius: var(--ssg-radius);
	box-shadow: var(--ssg-shadow);
}

.ssg-media-cover .go_block-content > div,
.ssg-media-cover .go_block-text,
.ssg-media-cover figure,
.ssg-media-cover picture,
.ssg-media-contain .go_block-content > div,
.ssg-media-contain .go_block-text,
.ssg-media-contain figure,
.ssg-media-contain picture {
	height: 100%;
	margin: 0 !important;
	padding: 0 !important;
	background-color: #FFFFFF !important;
}

.ssg-media-cover img,
.ssg-media-contain img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	min-height: 17rem;
	background-color: #FFFFFF !important;
	object-position: center;
}

.ssg-media-cover img {
	object-fit: cover;
}

/* De titel van beide mediavarianten gebruikt het accent van de dichtstbijzijnde
   row- of block-class. Zonder thema is donker regioblauw de veilige default. */
.ssg-media-cover .go_block-title,
.ssg-media-contain .go_block-title {
	color: var(--ssg-accent, var(--ssg-blue-dark)) !important;
	font-size: clamp(1.55rem, 1.2rem + 1vw, 2.1rem);
}

/* GRID + MEDIA-COVER / MEDIA-CONTAIN

   Gebied Online maakt bij een Target URL exact deze structuur:
   .go_row.grid .ssg-media-cover  > a.go_block-content
   .go_row.grid .ssg-media-contain > a.go_block-content

   Houd deze regels bewust beperkt tot die combinatie. Niet-gelinkte kaarten
   en mediablokken buiten een grid krijgen hierdoor geen interactiestijlen. */
.go_row.grid
:is(.ssg-media-cover, .ssg-media-contain)
> a.go_block-content {
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	text-decoration: none;
	border: 1px solid rgb(90 45 66 / 10%) !important;
	outline: 0 !important;
	outline-offset: 0 !important;
	box-shadow: var(--ssg-shadow) !important;
	transform: translateY(0);
	transition:
	border-color 180ms ease,
	box-shadow 220ms ease,
	transform 220ms ease;
}

.go_row.grid
:is(.ssg-media-cover, .ssg-media-contain)
> a.go_block-content
img {
	transform: scale(1);
	transition: transform 320ms cubic-bezier(0.2, 0.75, 0.25, 1);
}

@media (hover: hover) and (pointer: fine) {
	.go_row.grid
:is(.ssg-media-cover, .ssg-media-contain)
	> a.go_block-content:hover:not(:active) {
		border-color: var(--ssg-purple-mid) !important;
		outline: 0 !important;
		box-shadow: var(--ssg-shadow-hover) !important;
		transform: translateY(-0.2rem);
	}

	.go_row.grid
:is(.ssg-media-cover, .ssg-media-contain)
	> a.go_block-content:hover:not(:active)
	img {
		transform: scale(1.035);
	}
}

/* Focus verwijdert uitsluitend de algemene GebiedOnline-outline. De focus
   verandert bewust niets aan schaduw, rand of schaal en blokkeert hover niet. */
.go_row.grid
:is(.ssg-media-cover, .ssg-media-contain)
> a.go_block-content:is(:focus, :focus-visible) {
	outline: 0 !important;
	outline-offset: 0 !important;
}

/* Active staat volgens de LVHA-volgorde ná hover en springt tijdens de klik
   direct terug naar basis. Na loslaten bepaalt hover opnieuw de toestand. */
.go_row.grid
:is(.ssg-media-cover, .ssg-media-contain)
> a.go_block-content:active {
	border: 1px solid rgb(90 45 66 / 10%) !important;
	outline: 0 !important;
	outline-offset: 0 !important;
	box-shadow: var(--ssg-shadow) !important;
	transform: translateY(0) !important;
	transition: none;
}

.go_row.grid
:is(.ssg-media-cover, .ssg-media-contain)
> a.go_block-content:active
img {
	transform: scale(1) !important;
	transition: none;
}

.ssg-media-contain img {
	object-fit: contain;
}

.ssg-video .go_block-content {
	width: 100%;
	height: auto !important;
	aspect-ratio: 16 / 9;
	padding: 0 !important;
	overflow: hidden;
	background-color: #111111 !important;
	border: 1px solid rgb(90 45 66 / 10%) !important;
	border-radius: var(--ssg-radius);
	box-shadow: var(--ssg-shadow);
}

.ssg-video .go_video-wrapper {
	position: relative !important;
	width: 100%;
	height: 100% !important;
	aspect-ratio: auto;
	flex: 1 1 auto;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden;
}

.ssg-video .go_video-wrapper iframe {
	position: absolute;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	border: 0;
}


/* ==========================================================================
   12. TIJDELIJKE COMPATIBILITEIT MET HET TESTBLOK

   Het huidige blok gebruikt nog de naam WildBlok. Het krijgt hier een zachte
   blauwe stijl, zodat de bestaande koppeling na vervanging van style.css niet
   plotseling onopgemaakt raakt. Vervang de koppeling later bij voorkeur door
   ssg-card-blue-soft en verwijder daarna deze sectie.
   ========================================================================== */

.WildBlok .go_block-content {
	color: var(--ssg-text) !important;
	background-color: var(--ssg-blue-soft) !important;
	border: 1px solid var(--ssg-blue-mid) !important;
	border-radius: var(--ssg-radius-lg);
}

.WildBlok :is(.go_block-title, .go_block-text, .go_block-text p, .go_block-text li) {
	color: var(--ssg-text) !important;
}

.WildBlok .go_block-text a:not(.btn) {
	color: var(--ssg-blue-dark) !important;
}


/* ==========================================================================
   13. RESPONSIVE VERFIJNINGEN
   ========================================================================== */

/* Uitgeschakeld: vervangen door de stabiele mobiele herbouw in sectie 13B. */
@media (max-width: 0px) {
	/* -----------------------------------------------------------------------
     MOBIELE HEADER EN OFFCANVAS-DRAWER

     GebiedOnline levert een Bootstrap-collapse. Op mobiel presenteren we
     diezelfde semantische structuur als een echte drawer vanaf rechts.
     aria-expanded en de bestaande Bootstrap-JavaScriptlogica blijven intact.
     ----------------------------------------------------------------------- */

	.go_page-top-wrapper,
	.go_main-menu-bar,
	.go_main-menu-wrapper,
	nav.go_hoofdmenu,
	nav.go_hoofdmenu .cx_menu-container {
		min-height: 4.25rem;
	}

	.go_page-top-wrapper {
		box-shadow: 0 0.2rem 0.85rem rgb(47 42 44 / 7%);
	}

	nav.go_hoofdmenu .cx_menu-container {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
	}

	.go_mobile-logo {
		display: inline-flex;
		align-items: center;
		order: 1;
		max-width: 10.5rem;
		min-height: 4.25rem;
		padding: 0.25rem 0;
	}

	.go_mobile-logo img {
		display: block;
		width: auto !important;
		height: auto !important;
		max-width: 10.25rem !important;
		max-height: 3.35rem !important;
		object-fit: contain;
		object-position: left center;
	}

	.go_hoofdmenu .navbar-toggler {
		position: relative;
		z-index: 1004;
		display: inline-grid;
		order: 3;
		place-items: center;
		width: 2.75rem;
		height: 2.75rem;
		margin-left: auto;
		padding: 0;
		color: var(--ssg-purple);
		background-color: #FFFFFF !important;
		border: 0 !important;
		border-radius: 50%;
		box-shadow: 0 0.2rem 0.65rem rgb(90 45 66 / 10%);
		transition: color 180ms ease, transform 220ms ease;
	}

	.go_hoofdmenu .navbar-toggler:hover,
	.go_hoofdmenu .navbar-toggler:focus,
	.go_hoofdmenu .navbar-toggler:active,
	.go_hoofdmenu .navbar-toggler[aria-expanded="true"] {
		color: var(--ssg-purple-dark);
		background-color: #FFFFFF !important;
		border: 0 !important;
		box-shadow: 0 0.25rem 0.8rem rgb(90 45 66 / 14%) !important;
	}

	.go_hoofdmenu .navbar-toggler:focus-visible {
		outline: 0.18rem solid var(--ssg-blue-mid) !important;
		outline-offset: 0.15rem;
	}

	.go_hoofdmenu .navbar-toggler .fa-bars {
		transition: transform 220ms ease;
	}

	.go_hoofdmenu .navbar-toggler[aria-expanded="true"] .fa-bars {
		transform: rotate(90deg);
	}

	/* Font Awesome: wissel het hamburgerteken om voor een sluitkruis. */
	.go_hoofdmenu
	.navbar-toggler[aria-expanded="true"]
	.fa-bars::before {
		content: "\f00d";
	}

	/* Het losse zoekicoon concurreert op mobiel met logo en menuknop. */
	.go_hoofdmenu .go_open-search {
		display: none !important;
	}

	.go_hoofdmenu .navbar-collapse {
		position: fixed !important;
		z-index: 1002;
		top: 4.25rem;
		right: 0;
		bottom: 0;
		left: auto;
		display: block !important;
		visibility: hidden;
		width: min(88vw, 22rem);
		height: calc(100vh - 4.25rem) !important;
		height: calc(100dvh - 4.25rem) !important;
		padding: 1rem 0.85rem 2rem;
		overflow-x: hidden;
		overflow-y: auto !important;
		overscroll-behavior: contain;
		scrollbar-gutter: stable;
		-webkit-overflow-scrolling: touch;
		color: var(--ssg-text);
		background:
		linear-gradient(180deg, #FFFFFF 0%, var(--ssg-page) 100%);
		border: 0 !important;
		border-radius: var(--ssg-radius-lg) 0 0 0;
		opacity: 0;
		pointer-events: none;
		box-shadow: -0.85rem 0 2rem rgb(63 31 46 / 13%);
		transform: translateX(105%);
		will-change: transform;
		transition:
		visibility 0s linear 300ms,
		opacity 180ms ease-in,
		transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
	}

	/* De drawer krijgt een eigen mobiele kop en oogt niet als desktopkopie. */
	.go_hoofdmenu .navbar-collapse::before {
		content: "Menu";
		display: block;
		margin: 0 0.25rem 0.75rem;
		padding: 0 0.55rem 0.65rem;
		color: var(--ssg-purple);
		border-bottom: 1px solid var(--ssg-border);
		font-size: 0.92rem;
		font-variant-caps: all-small-caps;
		font-weight: 700;
		letter-spacing: 0.1em;
	}

	.go_hoofdmenu .navbar-collapse.show,
	.go_hoofdmenu
	.navbar-toggler[aria-expanded="true"]
	~ .navbar-collapse {
		visibility: visible;
		opacity: 1;
		pointer-events: auto;
		transform: translateX(0);
		transition-delay: 0s;
	}

	/* Bootstrap gebruikt tijdelijk .collapsing met een inline hoogte. */
	.go_hoofdmenu .navbar-collapse.collapsing {
		display: block !important;
		height: calc(100vh - 4.25rem) !important;
		height: calc(100dvh - 4.25rem) !important;
		overflow-y: auto !important;
	}

	body:has(.go_hoofdmenu .navbar-collapse.show),
	body:has(
	.go_hoofdmenu
	.navbar-toggler[aria-expanded="true"]
	~ .navbar-collapse
	) {
		overflow: hidden;
	}

	.go_hoofdmenu .navbar-nav {
		display: flex;
		flex-direction: column;
		gap: 0 !important;
		width: 100%;
		margin: 0 !important;
		padding: 0;
	}

	/* Vergrendel ook de li zelf, niet alleen de link erin. */
	.go_hoofdmenu .navbar-nav > .nav-item,
	.go_hoofdmenu .navbar-nav > .nav-item.dropdown,
	.go_hoofdmenu .navbar-nav > .nav-item.dropdown.show,
	.go_hoofdmenu .navbar-nav > .nav-item.dropdown:focus-within {
		display: block !important;
		position: relative;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		outline: 0 !important;
		box-shadow: none !important;
		transform: none !important;
		overflow-anchor: none;
	}

	.go_hoofdmenu .navbar-nav > .nav-item + .nav-item {
		margin-top: 0.15rem !important;
	}

	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		height: 2.75rem !important;
		min-height: 2.75rem !important;
		max-height: 2.75rem !important;
		margin: 0 !important;
		padding: 0.62rem 0.78rem !important;
		box-sizing: border-box;
		color: var(--ssg-text) !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		font-size: 1.02rem;
		font-weight: 600 !important;
		line-height: 1.3;
		white-space: normal;
		box-shadow: none !important;
		transition:
		color 150ms ease,
		background-color 150ms ease;
	}

	/* Mobiel gebruikt volledige tikvlakken, nooit desktoponderstrepingen. */
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link::before {
		display: none !important;
	}

	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:hover,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:focus,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:active,
	.go_hoofdmenu .navbar-nav > .active > .nav-link,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link.active,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link[aria-current="page"],
	body.go_page-webpage-3187
	.go_hoofdmenu
	.navbar-nav
	> .nav-item
	> .nav-link[href="/omziennaarelkaar/"],
	body.go_page-webpage-3187
	.go_hoofdmenu
	.navbar-nav
	> .nav-item
	> .nav-link[href="/omziennaarelkaar"] {
		color: var(--ssg-blue-dark) !important;
		background-color: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		outline: 0 !important;
		box-shadow: none !important;
	}

	/* Nooit geometrische beweging bij tik, focus, actief of geopend. */
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:hover,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:focus,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:active,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link.active,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link.show {
		height: 2.75rem !important;
		min-height: 2.75rem !important;
		max-height: 2.75rem !important;
		margin: 0 !important;
		padding: 0.62rem 0.78rem !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		outline: 0 !important;
		box-shadow: none !important;
		transform: none !important;
	}

	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:focus-visible,
	.go_hoofdmenu .dropdown-item:focus-visible {
		color: var(--ssg-blue-dark) !important;
		background: transparent !important;
		border: 0 !important;
		outline: 0 !important;
		box-shadow: none !important;
	}

	/* De mobiele dropdownkop gebruikt een vast grid. Daardoor blijven titel,
     binnenruimte en pijl exact op hun plek bij openen en sluiten. */
	.go_hoofdmenu .navbar-nav > .dropdown > .dropdown-toggle,
	.go_hoofdmenu .navbar-nav > .dropdown > .dropdown-toggle:hover,
	.go_hoofdmenu .navbar-nav > .dropdown > .dropdown-toggle:focus,
	.go_hoofdmenu .navbar-nav > .dropdown > .dropdown-toggle:active,
	.go_hoofdmenu .navbar-nav > .dropdown > .dropdown-toggle.show,
	.go_hoofdmenu
	.navbar-nav
	> .dropdown
	> .dropdown-toggle[aria-expanded="true"] {
		display: grid !important;
		position: static !important;
		inset: auto !important;
		float: none !important;
		align-self: stretch !important;
		vertical-align: top !important;
		grid-template-columns: minmax(0, 1fr) 0.8rem;
		column-gap: 0.8rem;
		align-items: center;
		justify-content: initial;
		width: 100%;
		margin: 0 !important;
		padding: 0.62rem 0.9rem !important;
		box-sizing: border-box;
		color: var(--ssg-text) !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		outline: 0 !important;
		box-shadow: none !important;
		transform: none !important;
	}

	.go_hoofdmenu
	.navbar-nav
	> .dropdown
	> .dropdown-toggle
	.cx_btn-label {
		min-width: 0;
		margin: 0;
		padding: 0;
	}

	/* De disclosurepijl wijst rechts wanneer dicht en omlaag wanneer open. */
	.go_hoofdmenu .dropdown-toggle::after {
		grid-column: 2;
		justify-self: center;
		flex: 0 0 auto;
		width: 0;
		height: 0;
		margin: 0 !important;
		transform: rotate(-90deg);
		transform-origin: center;
		transition: transform 220ms ease;
	}

	.go_hoofdmenu .dropdown-toggle.show::after,
	.go_hoofdmenu .dropdown-toggle[aria-expanded="true"]::after {
		transform: rotate(0deg);
	}

	/* Submenu als mobiele disclosure, zonder paarse kaart of donkere rand. */
	.go_hoofdmenu .dropdown-menu {
		position: static !important;
		display: block !important;
		visibility: hidden;
		max-height: 0;
		width: calc(100% - 1rem);
		min-width: 0;
		margin: 0 0 0 1rem !important;
		padding: 0 0.28rem;
		overflow: hidden;
		overflow-anchor: none;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		opacity: 0;
		pointer-events: none;
		box-shadow: none !important;
		top: auto !important;
		right: auto !important;
		bottom: auto !important;
		left: auto !important;
		inset: auto !important;
		transform: none !important;
		transition:
		max-height 280ms ease-in,
		opacity 180ms ease-in,
		visibility 0s linear 280ms;
	}

	/* Bootstrap voegt data-bs-popper pas bij de allereerste tik toe en laat
	   het daarna staan. Maak die late initialisatiestate geometrisch identiek. */
	.go_hoofdmenu .dropdown-menu[data-bs-popper],
	.go_hoofdmenu .dropdown-menu[data-popper-placement] {
		position: static !important;
		top: auto !important;
		right: auto !important;
		bottom: auto !important;
		left: auto !important;
		inset: auto !important;
		width: calc(100% - 1rem) !important;
		margin: 0 0 0 1rem !important;
		transform: none !important;
	}

	.go_hoofdmenu .dropdown-menu.show {
		visibility: visible;
		max-height: 40rem;
		margin: 0 0 0 1rem !important;
		padding: 0 0.28rem;
		opacity: 1;
		pointer-events: auto;
		transform: none !important;
		transition-delay: 0s;
	}

	/* De verticale submenu-ruimte zit permanent ín het ingeklapte element.
	   Daardoor introduceert de eerste .show-state geen nieuwe buitenmaat. */
	.go_hoofdmenu .dropdown-menu > li:first-child {
		margin-top: 0.28rem;
	}

	.go_hoofdmenu .dropdown-menu > li:last-child {
		margin-bottom: 0.28rem;
	}

	/* Geen donkere focusrand rond de aangeklikte mobiele dropdownnaam. */
	.go_hoofdmenu .dropdown-toggle:focus,
	.go_hoofdmenu .dropdown-toggle:focus-visible,
	.go_hoofdmenu .dropdown-toggle.show {
		display: grid !important;
		position: static !important;
		top: auto !important;
		right: auto !important;
		bottom: auto !important;
		left: auto !important;
		inset: auto !important;
		float: none !important;
		align-self: stretch !important;
		vertical-align: top !important;
		height: 2.75rem !important;
		min-height: 2.75rem !important;
		max-height: 2.75rem !important;
		margin: 0 !important;
		padding: 0.62rem 0.9rem !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		outline: 0 !important;
		box-shadow: none !important;
		transform: none !important;
	}

	/* Ook de twee zichtbare onderdelen van de gefocuste knop blijven in hun
	   vaste gridcel; browser- en GebiedOnline-focusregels mogen ze niet duwen. */
	.go_hoofdmenu .dropdown-toggle .cx_btn-label,
	.go_hoofdmenu .dropdown-toggle:focus .cx_btn-label,
	.go_hoofdmenu .dropdown-toggle:focus-visible .cx_btn-label,
	.go_hoofdmenu .dropdown-toggle.show .cx_btn-label {
		position: static !important;
		inset: auto !important;
		align-self: center !important;
		transform: none !important;
	}

	.go_hoofdmenu .dropdown-item {
		width: 100%;
		height: 2.5rem !important;
		min-height: 2.5rem !important;
		max-height: 2.5rem !important;
		margin: 0 !important;
		padding: 0.55rem 0.68rem !important;
		box-sizing: border-box;
		color: var(--ssg-text);
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		font-size: 0.96rem;
		font-weight: 400;
		line-height: 1.3;
		white-space: normal;
		outline: 0 !important;
		box-shadow: none !important;
		transform: none !important;
	}

	.go_hoofdmenu .dropdown-item:hover,
	.go_hoofdmenu .dropdown-item:focus,
	.go_hoofdmenu .dropdown-item:active,
	.go_hoofdmenu .dropdown-item.active {
		color: var(--ssg-blue-dark);
		height: 2.5rem !important;
		min-height: 2.5rem !important;
		max-height: 2.5rem !important;
		margin: 0 !important;
		padding: 0.55rem 0.68rem !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		outline: 0 !important;
		box-shadow: none !important;
		transform: none !important;
	}

	.go_row {
		padding-top: 2.25rem;
		padding-bottom: 2.25rem;
	}

	.go_row-title {
		margin-bottom: 1.25rem;
	}

	.btn,
	.go_button,
	.cx_btn {
		min-height: 2.75rem;
	}

	.go_search-wrapper,
	.go_filter-wrapper {
		border-radius: var(--ssg-radius);
	}

	.ssg-card-intro .go_block-content,
	.ssg-card-copy .go_block-content,
	.ssg-media-cover .go_block-content,
	.ssg-media-contain .go_block-content,
	.ssg-video .go_block-content {
		margin-bottom: 1rem;
	}
}


/* ==========================================================================
   13B. MOBIEL MENU — RADICALE, STABIELE HERBOUW

   Deze laatste mobiele laag vervangt bewust alle experimentele beweging uit
   sectie 13. Bootstrap bepaalt alleen nog open/dicht; CSS geeft elke toestand
   exact dezelfde maatvoering. Geen transform-, hoogte- of focusanimaties.
   ========================================================================== */

@media (max-width: 767.98px) {
	.go_hoofdmenu,
	.go_hoofdmenu *,
	.go_hoofdmenu *::before,
	.go_hoofdmenu *::after {
		animation: none !important;
		transition: none !important;
	}

	/* Eenvoudige, vaste mobiele kop. */
	.go_page-top-wrapper,
	.go_main-menu-bar,
	.go_main-menu-wrapper,
	nav.go_hoofdmenu,
	nav.go_hoofdmenu .cx_menu-container {
		min-height: 4.25rem !important;
	}

	nav.go_hoofdmenu .cx_menu-container {
		display: grid !important;
		grid-template-columns: 2.75rem minmax(0, 1fr) 2.75rem !important;
		grid-template-rows: 4.25rem !important;
		align-items: center !important;
		width: 100% !important;
	}

	.go_page-top-wrapper {
		box-shadow: 0 0.2rem 0.85rem rgb(47 42 44 / 7%) !important;
	}

	.go_mobile-logo {
		display: inline-flex !important;
		grid-column: 2 !important;
		grid-row: 1 !important;
		align-items: center !important;
		justify-self: center !important;
		order: initial !important;
		max-width: 10.5rem !important;
		min-height: 4.25rem !important;
		padding: 0.25rem 0 !important;
	}

	.go_mobile-logo img {
		display: block !important;
		width: auto !important;
		height: auto !important;
		max-width: 10.25rem !important;
		max-height: 3.35rem !important;
		object-fit: contain !important;
		object-position: left center !important;
	}

	.go_hoofdmenu .navbar-toggler,
	.go_hoofdmenu .navbar-toggler:hover,
	.go_hoofdmenu .navbar-toggler:focus,
	.go_hoofdmenu .navbar-toggler:active,
	.go_hoofdmenu .navbar-toggler[aria-expanded="true"] {
		position: relative !important;
		z-index: 1004 !important;
		display: inline-grid !important;
		grid-column: 3 !important;
		grid-row: 1 !important;
		justify-self: end !important;
		order: initial !important;
		place-items: center !important;
		width: 2.75rem !important;
		height: 2.75rem !important;
		min-height: 2.75rem !important;
		margin: 0 !important;
		padding: 0 !important;
		color: var(--ssg-purple-dark) !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		outline: 0 !important;
		box-shadow: none !important;
		transform: none !important;
	}

	.go_hoofdmenu .navbar-toggler .fa-bars,
	.go_hoofdmenu .navbar-toggler[aria-expanded="true"] .fa-bars {
		transform: none !important;
	}

	.go_hoofdmenu
	.navbar-toggler[aria-expanded="true"]
	.fa-bars::before {
		content: "\f00d";
	}

	.go_hoofdmenu .go_open-search {
		display: none !important;
	}

	/* Direct open/dicht, zonder verschuiven, vervagen of tussenstatus. */
	.go_hoofdmenu .navbar-collapse,
	.go_hoofdmenu .navbar-collapse.collapse {
		position: fixed !important;
		z-index: 1002 !important;
		top: 4.25rem !important;
		right: 0 !important;
		bottom: 0 !important;
		left: auto !important;
		display: none !important;
		visibility: hidden !important;
		width: min(88vw, 22rem) !important;
		height: calc(100dvh - 4.25rem) !important;
		padding: 1rem 0.85rem 2rem !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		color: var(--ssg-text) !important;
		background: #FFFFFF !important;
		border: 0 !important;
		border-radius: var(--ssg-radius-lg) 0 0 0 !important;
		opacity: 1 !important;
		pointer-events: none !important;
		box-shadow: -0.7rem 0 1.7rem rgb(63 31 46 / 11%) !important;
		transform: none !important;
	}

	.go_hoofdmenu .navbar-collapse.show,
	.go_hoofdmenu .navbar-collapse.collapsing,
	.go_hoofdmenu
	.navbar-toggler[aria-expanded="true"]
	~ .navbar-collapse {
		display: block !important;
		visibility: visible !important;
		height: calc(100dvh - 4.25rem) !important;
		opacity: 1 !important;
		pointer-events: auto !important;
		transform: none !important;
	}

	.go_hoofdmenu .navbar-collapse::before {
		content: "Menu";
		display: block !important;
		margin: 0 0.25rem 0.75rem !important;
		padding: 0 0.55rem 0.65rem !important;
		color: var(--ssg-purple) !important;
		border: 0 !important;
		border-bottom: 1px solid var(--ssg-border) !important;
		font-size: 0.92rem !important;
		font-variant-caps: all-small-caps;
		font-weight: 700 !important;
		letter-spacing: 0.1em;
	}

	body:has(.go_hoofdmenu .navbar-collapse.show),
	body:has(
	.go_hoofdmenu
	.navbar-toggler[aria-expanded="true"]
	~ .navbar-collapse
	) {
		overflow: hidden !important;
	}

	.go_hoofdmenu .navbar-nav {
		display: block !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}

	.go_hoofdmenu .navbar-nav > .nav-item,
	.go_hoofdmenu .navbar-nav > .nav-item.dropdown,
	.go_hoofdmenu .navbar-nav > .nav-item.dropdown:focus-within {
		display: block !important;
		position: static !important;
		width: 100% !important;
		height: auto !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		transform: none !important;
	}

	/* Iedere hoofdregel is altijd exact even groot, in iedere state. */
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:hover,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:focus,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:focus-visible,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:active,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link.active,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link.show,
	.go_hoofdmenu
	.navbar-nav
	> .dropdown
	> .dropdown-toggle[aria-expanded="true"] {
		display: flex !important;
		position: static !important;
		align-items: center !important;
		justify-content: space-between !important;
		float: none !important;
		width: 100% !important;
		height: 2.75rem !important;
		min-height: 2.75rem !important;
		max-height: 2.75rem !important;
		margin: 0 !important;
		padding: 0.62rem 0.78rem !important;
		box-sizing: border-box !important;
		color: var(--ssg-text) !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		outline: 0 !important;
		font-size: 1.02rem !important;
		font-weight: 600 !important;
		line-height: 1.3 !important;
		text-decoration: none !important;
		box-shadow: none !important;
		inset: auto !important;
		transform: none !important;
	}

	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:hover,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link:focus-visible,
	.go_hoofdmenu .navbar-nav > .active > .nav-link,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link.active,
	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link[aria-current="page"] {
		color: var(--ssg-blue-dark) !important;
	}

	.go_hoofdmenu .navbar-nav > .nav-item > .nav-link::before {
		display: none !important;
		content: none !important;
	}

	/* Vaste pijl; alleen de richting verandert onmiddellijk. */
	.go_hoofdmenu .dropdown-toggle::after,
	.go_hoofdmenu .dropdown-toggle:focus::after,
	.go_hoofdmenu .dropdown-toggle:active::after {
		display: block !important;
		flex: 0 0 auto !important;
		width: 0 !important;
		height: 0 !important;
		margin: 0 0.12rem 0 auto !important;
		border-top: 0.28rem solid transparent !important;
		border-right: 0 !important;
		border-bottom: 0.28rem solid transparent !important;
		border-left: 0.35rem solid currentColor !important;
		transform: none !important;
	}

	.go_hoofdmenu .dropdown-toggle.show::after,
	.go_hoofdmenu .dropdown-toggle[aria-expanded="true"]::after {
		border-top: 0.35rem solid currentColor !important;
		border-right: 0.28rem solid transparent !important;
		border-bottom: 0 !important;
		border-left: 0.28rem solid transparent !important;
	}

	/* Submenu: werkelijk display:none/block. Geen max-height, opacity of Popper. */
	.go_hoofdmenu .dropdown-menu,
	.go_hoofdmenu .dropdown-menu[data-bs-popper],
	.go_hoofdmenu .dropdown-menu[data-popper-placement] {
		display: none !important;
		position: static !important;
		visibility: visible !important;
		width: 100% !important;
		min-width: 0 !important;
		max-height: none !important;
		margin: 0 !important;
		padding: 0.15rem 0 0.35rem 1rem !important;
		overflow: visible !important;
		opacity: 1 !important;
		pointer-events: auto !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		inset: auto !important;
		transform: none !important;
	}

	.go_hoofdmenu .dropdown-menu.show {
		display: block !important;
	}

	.go_hoofdmenu .dropdown-menu > li,
	.go_hoofdmenu .dropdown-menu > li:first-child,
	.go_hoofdmenu .dropdown-menu > li:last-child {
		display: block !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.go_hoofdmenu .dropdown-item,
	.go_hoofdmenu .dropdown-item:hover,
	.go_hoofdmenu .dropdown-item:focus,
	.go_hoofdmenu .dropdown-item:focus-visible,
	.go_hoofdmenu .dropdown-item:active,
	.go_hoofdmenu .dropdown-item.active {
		display: flex !important;
		position: static !important;
		align-items: center !important;
		width: 100% !important;
		height: 2.5rem !important;
		min-height: 2.5rem !important;
		max-height: 2.5rem !important;
		margin: 0 !important;
		padding: 0.55rem 0.68rem !important;
		box-sizing: border-box !important;
		color: var(--ssg-text) !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		outline: 0 !important;
		font-size: 0.96rem !important;
		font-weight: 400 !important;
		line-height: 1.3 !important;
		box-shadow: none !important;
		inset: auto !important;
		transform: none !important;
	}

	.go_hoofdmenu .dropdown-item:hover,
	.go_hoofdmenu .dropdown-item:focus-visible {
		color: var(--ssg-blue-dark) !important;
	}

	.go_row {
		padding-top: 2.25rem;
		padding-bottom: 2.25rem;
	}

	.go_row-title {
		margin-bottom: 1.25rem;
	}

	.btn,
	.go_button,
	.cx_btn {
		min-height: 2.75rem;
	}

	.go_search-wrapper,
	.go_filter-wrapper {
		border-radius: var(--ssg-radius);
	}

	.ssg-card-intro .go_block-content,
	.ssg-card-copy .go_block-content,
	.ssg-media-cover .go_block-content,
	.ssg-media-contain .go_block-content,
	.ssg-video .go_block-content {
		margin-bottom: 1rem;
	}
}


/* ==========================================================================
   14. MINDER BEWEGING

   Bezoekers die in hun besturingssysteem minder beweging kiezen, krijgen
   geen geanimeerde overgangen of verschuivende knoppen.
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
	}

	.btn:hover,
	.go_button:hover,
	.cx_btn:hover {
		transform: none;
	}

	.ssg-card-intro .go_block-title:hover {
		transform: none;
	}

	.go_row.grid
:is(.ssg-media-cover, .ssg-media-contain)
	> a.go_block-content:hover:not(:active),
	.go_row.grid
:is(.ssg-media-cover, .ssg-media-contain)
	> a.go_block-content:hover:not(:active)
	img {
		transform: none;
	}
}