:root {
	--font-primary: 'Inter', sans-serif;
}

body {
	background: #fff;
	font-family: var(--font-primary);
	font-style: normal;
	font-weight: 300;
	font-size: 17px;
}

table {
	border: none;
}
table td {
	border: none;
	vertical-align: top;
}


h1, h2, h3 {
	font-weight: 600;
}

.content-body p, .content-body li, .content-body span {
	line-height: 31px;
}

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

strong {
	font-weight: bold;
}

footer a {
    color: rgba(255,255,255,.85);
}

footer a:hover {
    color: #fff;
}

footer .col-md-6 {
	margin-bottom: 50px;
}
.footer-column {
	padding: 0 1.75rem;
}
.footer-image {
	max-width: 66%;
	margin: 1.5rem 0;
}

.content-block + .content-block { margin-top: 2.5rem; }
.content-block h2 { color: var(--cms-primary); font-weight: 800; }
.content-block h3 { color: var(--cms-primary); font-weight: 700; }


.builder-richtext a { text-decoration: underline; }
.builder-richtext strong { font-weight: 700; }

.column-cards-grid {
	margin: 0rem 0;
}
.column-card {
	display: flex;
	flex-direction: column;

	border-radius: 18px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 10px 30px rgba(15,23,42,.08);
}
.column-card-image {
	/*aspect-ratio: 4 / 3;*/
	object-fit: cover;
	background: #f3f4f6;
	display: block;
}
.column-card-body {
	padding: 2.75rem;
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	/*height: 100%;*/
}
.column-card-body .btn {
  width: 100%;
  margin-top: auto !important;
  align-self: flex-start;
}
.column-card-title {
	font-size: 2.15rem;
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: .85rem;
	text-align: center;
}
.column-card-usp-list {
	margin-bottom: 0;
	flex-grow: 1;
}

.topics-grid, .manual-reviews-grid { margin: 0; }
@media (min-width: 1200px) { .topics-grid .topic-col-5 { width:20%; } }
@media (min-width: 1200px) { .manual-reviews-grid .manual-review-col-5 { width:20%; } }
.topic-card, .manual-review { background:#fff; border-radius:18px; box-shadow:0 10px 30px rgba(15,23,42,.08); padding:2rem; }
.topic-card-icon { width:76px; height:76px; display:flex; align-items:center; justify-content:center; margin-bottom:1.25rem; }
.topic-card-icon img { width:100%; height:100%; object-fit:contain; }
.topic-card-title { font-size:1.35rem; margin:0 0 .65rem; }
.topic-card-body, .manual-review-text { line-height:1.75; }
.manual-review { border:0; display:flex; flex-direction:column; }
.manual-review-stars { color:#e1ad00; font-size:1.1rem; letter-spacing:.12em; margin-bottom:1rem; }
.manual-review-stars span { color:#e5e7eb; }
.manual-review-author { margin-top:auto; padding-top:1.35rem; font-style:normal; }
.manual-review-author strong, .manual-review-author span { display:block; }
.manual-review-author span { color:#6b7280; font-size:.9rem; margin-top:.1rem; }

		.featured-page-card {
	border-radius: 18px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 10px 30px rgba(15,23,42,.08);
	color: inherit;
	transition: transform .18s ease, box-shadow .18s ease;
}
.featured-page-card:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 42px rgba(15,23,42,.12);
}
.featured-page-card-image {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	background: #f3f4f6;
	display: block;
}
.featured-page-card-placeholder {
	min-height: 180px;
	color: #9ca3af;
	font-size: 1.6rem;
}
.featured-page-card-body {
	padding: 1.1rem 1.15rem;
}
.featured-page-card-title {
	font-size: 1.1rem;
	font-weight: 700;
	line-height: 1.3;
}

.builder-standard-list {
	margin: 0 0 1.25rem 1.25rem;
	padding: 0;
}

.builder-standard-list li {
	margin-bottom: .65rem;
}

.builder-usp-list {
	list-style: none;
	margin: 0 0 1.75rem;
	padding: 0;
}

.builder-usp-list li {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: .85rem;
	padding: 1rem 0;
	border-bottom: 1px solid #e5e7eb;
	line-height: 1.7;
}

.column-card-usp-list li {
	padding: 0.65rem 0;
}

.builder-usp-list li::before {
	content: "\f058";
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	color: #22c55e;
	font-size: 1.15rem;
	line-height: 1.6;
	flex-shrink: 0;
	margin-top: .1rem;
}

.usp-list{
	list-style:none;
	margin:0 0 1.5rem;
	padding:0;
}

.usp-list li{
	position:relative;
	display:flex;
	align-items:flex-start;
	gap:.85rem;
	padding:1rem 0;
	border-bottom:1px solid #d9d9d9;
	line-height:1.7;
}

.usp-list li:before{
	content:"\f058";
	font-family:"Font Awesome 6 Free";
	font-weight:900;
	color:#1fa24a;
	font-size:1.1rem;
	line-height:1.6;
	flex-shrink:0;
	margin-top:.1rem;
}

.richtext a{
	text-decoration:underline;
}

.richtext strong{
	font-weight:700;
}

.footer-column .footer-heading { color: #fff; font-weight: 700; }
.footer-richtext { font-size: 16px; color: rgba(255,255,255,.75); line-height: 1.6; }
.footer-richtext a { color: #fff; text-decoration: underline; }
.footer-standard-list,
.footer-usp-list { list-style: none; margin: 0; padding: 0; }
.footer-standard-list li,
.footer-usp-list li { font-size: 16px; color: rgba(255,255,255,.75); margin-bottom: .65rem; line-height: 1.1; }
.footer-standard-list li a,
.footer-usp-list li a { color: #fff; text-decoration: none; }
.footer-standard-list li a:hover,
.footer-usp-list li a:hover { text-decoration: underline; }
.footer-usp-list li { display: flex; gap: .6rem; align-items: flex-start; }
.footer-usp-list li::before { content: "\f058"; font-family: "Font Awesome 6 Free"; font-weight: 900; color: #22c55e; flex-shrink: 0; margin-top: .05rem; }
.footer-image img { max-height: 120px; width: auto; }
.footer-text-small, .footer-text-small a { font-size: 14px; color: rgba(255,255,255,.5); }

/*  ## standard + mobile ## */
.navbar.bg-dark,
footer.bg-dark {
	background-color: var(--cms-complementary) !important;
}

.btn-primary {
	background-color: var(--cms-primary) !important;
	border-color: var(--cms-primary) !important;
}

.text-primary,
.navbar-dark .navbar-nav .nav-link.active {
	color: var(--cms-tertiary) !important;
}

.content-body h1,
.content-body h2,
.content-body h3 {
	color: var(--cms-primary) !important;
}


a {
	color: var(--cms-primary);
}

.menu-cta {
	color: #fff !important;
	border-radius: 999px;
	font-weight: 700;
}
.mobile-menu-toggle {
	border: 0;
	background: transparent;
	color: #fff;
	font-size: 1.8rem;
	line-height: 1;
}
.mobile-menu-overlay {
	position: fixed;
	inset: 0;
	z-index: 2000;
	background: var(--cms-complementary);
	color: #fff;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-12px);
	transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
}
.mobile-menu-overlay.is-open {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	padding: 40px;
}
.mobile-menu-overlay a:not(.btn) {
	color: #fff;
	text-decoration: none;
	font-size: 1.35rem;
	font-weight: 700;
}
.mobile-menu-overlay .menu-cta {
	display: inline-flex;
	justify-content: center;
	width: 100%;
	padding: .9rem 1.2rem;
}
.mobile-menu-close {
	border: 0;
	background: transparent;
	color: #fff;
	font-size: 2rem;
	line-height: 1;
}

/* Overlay menu: desktop must stay horizontal. Bootstrap normally does this via
   .navbar-expand-lg, but the overlay variant does not use that class. */
@media (min-width: 992px) {
	.navbar-overlay-style .desktop-menu .navbar-nav {
		flex-direction: row;
		align-items: center;
	}

	.navbar-overlay-style .desktop-menu .nav-item {
		display: flex;
		align-items: center;
	}

	.navbar-overlay-style .desktop-menu .nav-link {
		padding-left: .75rem;
		padding-right: .75rem;
		white-space: nowrap;
	}

	.navbar-overlay-style .desktop-menu .menu-cta {
		white-space: nowrap;
	}
}

/* ## bootstrap hacks ##*/
.main-navbar-brand img {
	display:block;
	width:250px;
	height:auto;
}
.main-navbar-brand {
	position: relative;
}
.main-navbar {
	position: sticky;
	top: 0;
	z-index: 1030;
	padding-top: 24px;
	padding-bottom: 24px;
	transition: padding .24s ease, box-shadow .24s ease, background-color .24s ease;
}
.main-navbar.is-compact {
	padding-top: 16px;
	padding-bottom: 16px;
	box-shadow: 0 8px 22px rgba(15, 23, 42, .18);
}
.main-navbar-brand img {
	transition: width .24s ease;
}
.main-navbar.is-compact .main-navbar-brand img {
	width: 225px;
}
.main-navbar.is-compact .nav-link,
.main-navbar.is-compact .menu-cta {
	font-size: .94em;
}

/* Content builder: rustig in beeld komen bij scrollen. */
.come-in {
	opacity: 0;
	transform: translateY(70px);
	will-change: opacity, transform;
}
.come-in.is-visible {
	animation: .8s forwards cms-come-in;
}
@keyframes cms-come-in {
	to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
	.come-in { opacity: 1; transform: none; }
	.come-in.is-visible { animation: none; }
	.main-navbar,
	.main-navbar-brand img { transition: none; }
}
@media (max-width: 991.98px) {
	.main-navbar { padding-top: 16px; padding-bottom: 16px; }
	.main-navbar.is-compact { padding-top: 12px; padding-bottom: 12px; }
	.main-navbar-brand img,
	.main-navbar.is-compact .main-navbar-brand img { width: 190px; }
}
.main-btn {
	padding: 10px 15px;
}
.home main.main-main {
	padding-top: 90px!important;
}
footer.main-footer {
	padding-top: 80px!important;
	padding-bottom: 80px!important;
}
.main-form {
	padding: 45px;
}
.main-main input,
.main-main textarea,
.main-main .form-select,
.main-main .btn,
.hero-overlay-button {
	border-radius: 30px;
	padding: .65rem 1.2rem;
}

/* Custom form controls: dezelfde rustige, afgeronde stijl als de overige velden. */
.main-main .form-select {
	min-height: 54px;
	border-color: #dce1e6;
	background-color: #fff;
	color: inherit;
	padding-right: 3.25rem;
}
.main-main .form-select:focus,
.main-main .form-check-input:focus {
	border-color: var(--cms-primary);
	box-shadow: 0 0 0 .22rem color-mix(in srgb, var(--cms-primary) 18%, transparent);
}
.main-main fieldset {
	border: 0;
	padding: 0;
}
.main-main fieldset legend {
	font-weight: bold;
	padding: 1rem 0;	
}
.main-main fieldset legend,
.main-main fieldset label {
	font-size: var(--cms-font-body);	
}
.main-main .form-check-input[type=checkbox] {
	padding: 0px;
	width: 1.25rem;
	height: 1.25rem;
}
.main-main .form-check {
	display: flex;
	align-items: center;
	gap: .55rem;
	margin-bottom: .6rem;
	margin-left: 0rem;
	padding-left: 0rem;
}
.main-main .form-check-input {
	flex: 0 0 auto;
	width: 1.45rem;
	height: 1.45rem;
	margin: 0;
	border: 1px solid #dce1e6;
	border-radius: .38rem;
	accent-color: var(--cms-primary);
	cursor: pointer;
}
.main-main .form-check-label {
	margin: 0;
	cursor: pointer;
}

/* HERO OVERLAY */
.page-header {
    position: relative;
    overflow: hidden;
}

.hero-image {
    width: 100%;
    object-fit: cover;
    display: block;
}

.hero-overlay-wrapper {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    z-index: 5;
}

.hero-left {
    justify-content: flex-start;
}

.hero-right {
    justify-content: flex-end;
}

.hero-center {
    justify-content: center;
}

.hero-center .hero-overlay {
    text-align: center;
}

.hero-overlay {
    width: 50%;
    margin-inline: 5%;
    padding: 48px;
}

.hero-radius {
    border-radius: 15px;
}

.hero-glass {
    background: rgba(255,255,255,.72);
    backdrop-filter: blur(12px);
    color: var(--cms-primary);
}

.hero-text-light {
    color: #fff;
    text-shadow: 0 2px 16px rgba(0,0,0,.35);
}

.hero-overlay h1 {
    font-size: clamp(2rem,4vw,4.2rem);
    font-weight: 800;
    line-height: 1.05;
    margin-bottom: 20px;
}

.hero-overlay p {
    font-size: 1.15rem;
    line-height: 1.8;
    margin: 0 0 1.5rem 0;
}

/* ## animated header ## */
.header-animate-blocks {
position:relative;
overflow:hidden;
}
.header-animate-blocks .hero-image{
animation:heroReveal 1.4s ease forwards;
transform:scale(1.08);
filter:blur(10px);
opacity:0;
}
.header-animate-blocks::before{
content:"";
position:absolute;
inset:0;
background-image:
linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px);
background-size:60px 60px;
animation:gridFade 1.2s ease forwards;
z-index:2;
pointer-events:none;
}
@keyframes heroReveal{
0%{opacity:0;filter:blur(10px);transform:scale(1.08);}
100%{opacity:1;filter:blur(0);transform:scale(1);}
}
@keyframes gridFade{
0%{opacity:1;}
100%{opacity:0;}
}


@media (max-width: 768px) {
	.main-main {
		padding-left: 20px;
		padding-right: 20px;
	}
	table {
		display: table!important;
		width: 100%!important;
		height: auto!important;
		float: left;
	}
	table tr {
		display: table!important;
		width: 100% !important;
		float: left;
		height: auto!important;
	}
	table td {
		display: table!important;
		width: 100% !important;
		float: left;
		height: auto!important;
	}
	.content-block .row {
		--bs-gutter-x: 0;
	}
}

@media (max-width: 991px) {
    .hero-overlay {
        width: calc(100% - 32px);
        margin-inline: 16px;
        padding: 28px;
    }
}

/* Content builder background banners */
.content-block-full-bleed {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.content-block-has-bg {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.content-block-has-bg .content-block-inner {
    position: relative;
}

@media (max-width: 575.98px) {
    .content-block-full-bleed {
        width: auto;
        max-width: none;
        margin-left: calc(var(--bs-gutter-x, 1.5rem) * -0.5);
        margin-right: calc(var(--bs-gutter-x, 1.5rem) * -0.5);
    }

    .content-block-has-bg {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .content-block-has-bg .content-block-inner {
        padding-left: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
        padding-right: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
    }

    .content-block-has-bg .row {
        --bs-gutter-x: 1.5rem;
    }
}

.block-bg-primary {
    background: var(--cms-primary);
    color: #fff;
	padding-top: 5rem!important;
	padding-bottom: 5rem!important;
}

.block-bg-secondary {
    background: var(--cms-complementary);
    color: #fff;
	padding-top: 5rem!important;
	padding-bottom: 5rem!important;
}

.block-bg-accent {
    background: var(--cms-tertiary);
    color: #fff;
	padding-top: 5rem!important;
	padding-bottom: 5rem!important;
}

.block-bg-light {
    background: #f8f9fa;
	padding-top: 5rem!important;
	padding-bottom: 5rem!important;
}

.block-bg-dark {
    background: #212529;
    color: #fff;
	padding-top: 5rem!important;
	padding-bottom: 5rem!important;
}

.block-bg-white {
    background: #fff;
	padding-top: 5rem!important;
	padding-bottom: 5rem!important;
}

.block-bg-primary .content-body h1,
.block-bg-primary .content-body h2,
.block-bg-primary .content-body h3,
.block-bg-secondary .content-body h1,
.block-bg-secondary .content-body h2,
.block-bg-secondary .content-body h3,
.block-bg-accent .content-body h1,
.block-bg-accent .content-body h2,
.block-bg-accent .content-body h3,
.block-bg-dark .content-body h1,
.block-bg-dark .content-body h2,
.block-bg-dark .content-body h3 {
    color: #fff !important;
}


/* Content builder: full-width image-only block */
.content-block-image-full {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.content-block-image-full-wrap {
    width: 100%;
}

.content-gallery-image { width:100%; height:auto; display:block; }

/* Blog-overzicht */
.blog-overview-header { max-width: 800px; }
.blog-overview-header h1 { margin-bottom: 1rem; color: var(--cms-primary) !important; }
.blog-overview-intro { font-size: 1.125rem; line-height: 1.7; color: #4b5563; }
.blog-overview-date { font-size: .78rem; line-height: 1.3; color: #6b7280; }
.blog-overview-grid { margin-bottom: 3rem; }
.blog-overview-grid article { display: flex; flex-direction: column; }
.blog-overview-card-link { color: inherit; }
.blog-overview-card-link:hover article { box-shadow: 0 14px 34px rgba(15,23,42,.12); transform: translateY(-3px); }
.blog-overview-card-link article { transition: transform .16s ease, box-shadow .16s ease; }
.blog-overview-card-image { display: block; height: 220px; object-fit: cover; }
.blog-overview-grid article > .p-4 { flex: 1; }
.blog-article-main { padding-bottom: 5rem !important; }

/*## cookie ##*/
.cms-cookie-banner{position:fixed;left:1rem;right:1rem;bottom:2rem;z-index:9999;max-width:960px;margin:0 auto;background:#fff;color:#111827;border-radius:15px;box-shadow:0 20px 60px rgba(15,23,42,.18);padding:2.5rem;display:none;}
.cms-cookie-banner.is-visible{display:block;}
.cms-cookie-banner h3{font-size:1.1rem;margin:0 0 .4rem;font-weight:700;text-align:left!important;}
.cms-cookie-banner p{margin:0;color:#4b5563;font-size:.95rem;}
.cms-cookie-actions{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:flex-end;margin-top:1rem;}
.cms-cookie-actions .btn {border-radius: 20px;padding: 10px 15px;color:#FFF;}
@media (min-width:768px){.cms-cookie-banner-inner{display:flex;align-items:center;gap:1.5rem}.cms-cookie-copy{flex:1}.cms-cookie-actions{margin-top:0;flex:0 0 auto}}
