/* =========================================================================
   MIT Base — basisstyling. Alle kleuren via theme.json-presets zodat een
   childthema alleen het palet hoeft te overschrijven.
   ========================================================================= */

:root {
	--mit-primary: var(--wp--preset--color--primary, #8c004d);
	--mit-primary-soft: color-mix(in srgb, var(--wp--preset--color--primary, #8c004d) 55%, #fff);
	--mit-accent: var(--wp--preset--color--accent, #fde428);
	--mit-dark: var(--wp--preset--color--dark, #1e1f21);
	--mit-gray: var(--wp--preset--color--gray, #535152);
	--mit-light: var(--wp--preset--color--light, #f5f5f5);
	--mit-white: var(--wp--preset--color--white, #ffffff);
	--mit-font-body: var(--wp--preset--font-family--body, 'Open Sans', Arial, sans-serif);
	--mit-font-heading: var(--wp--preset--font-family--heading, 'Montserrat', sans-serif);
	--mit-container: 1170px;

	/* Design 2.0-tokens: warme neutralen, schaduwtrap en bewegingsritme */
	--mit-warm: #faf9f7;
	--mit-line: #e9e7e2;
	--mit-shadow-s: 0 1px 3px rgba(30, 31, 33, 0.06), 0 4px 14px rgba(30, 31, 33, 0.05);
	--mit-shadow-m: 0 4px 10px rgba(30, 31, 33, 0.07), 0 14px 34px rgba(30, 31, 33, 0.09);
	--mit-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

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

body {
	margin: 0;
	font-family: var(--mit-font-body);
	font-size: 15px;
	line-height: 1.8;
	color: var(--mit-gray);
	background: var(--mit-white);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	/* Full-bleed-secties gebruiken 100vw; clip voorkomt een horizontale scrollbalk */
	overflow-x: clip;
}

::selection { background: var(--mit-primary); color: var(--mit-white); }

:focus-visible {
	outline: 2px solid var(--mit-primary);
	outline-offset: 2px;
}

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

html { scroll-behavior: smooth; }
[id] { scroll-margin-top: 90px; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--mit-font-heading);
	font-weight: 700;
	color: var(--mit-dark);
	line-height: 1.25;
	letter-spacing: -0.01em;
	margin: 0 0 18px;
	text-wrap: balance;
}

h1 { font-size: clamp(28px, 2.5vw, 36px); }
h2 { font-size: clamp(24px, 2.2vw, 30px); }
h3 { font-size: clamp(20px, 1.8vw, 24px); }
h4 { font-size: 20px; }
h5 { font-size: 16px; }
h6 { font-size: 14px; }

p { margin: 0 0 16px; }

a { color: var(--mit-primary); text-decoration: none; transition: color 0.2s; }
a:hover { color: var(--mit-dark); }

.container {
	max-width: var(--mit-container);
	margin-left: auto;
	margin-right: auto;
	padding-left: 15px;
	padding-right: 15px;
}

/* Constrained Gutenberg-groepen: zelfde zijmarges als .container,
   anders plakt de inhoud op smalle schermen tegen de schermrand. */
.wp-block-group.is-layout-constrained > :not(.alignfull):not(.alignwide) {
	padding-left: 15px;
	padding-right: 15px;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

/* Knoppen (core button-blok + losse links met .wp-element-button) */
.wp-element-button,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: var(--mit-dark);
	color: var(--mit-white);
	font-family: var(--mit-font-heading);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.5px;
	padding: 14px 30px;
	border: 0;
	border-radius: 0;
	cursor: pointer;
	position: relative;
	transition: background 0.25s var(--mit-ease), transform 0.25s var(--mit-ease), box-shadow 0.25s var(--mit-ease);
}

.wp-element-button::after,
.wp-block-button__link::after {
	content: '\2192';
	font-family: var(--mit-font-body);
	transition: transform 0.25s var(--mit-ease);
}

.wp-element-button:hover,
.wp-block-button__link:hover {
	background: var(--mit-primary);
	color: var(--mit-white);
	box-shadow: var(--mit-shadow-m);
	transform: translateY(-1px);
}

.wp-element-button:hover::after,
.wp-block-button__link:hover::after { transform: translateX(4px); }

.wp-element-button:active,
.wp-block-button__link:active { transform: translateY(0); box-shadow: var(--mit-shadow-s); }

/* ---- Header: witte topbalk met logo + contactinfo ---- */
.site-header { background: var(--mit-white); }

.header-top-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	padding-top: 14px;
	padding-bottom: 14px;
}

.logo-box img,
.logo-box .custom-logo { width: auto; height: 150px; display: block; }

.contact-info-box {
	display: flex;
	gap: 55px;
	align-items: center;
}

.contact-info {
	display: flex;
	gap: 14px;
	align-items: center;
	font-size: 13px;
	line-height: 19px;
	color: var(--mit-gray);
}

.contact-info .contact-icon { color: var(--mit-primary); display: flex; }
.contact-info .contact-phone { color: var(--mit-primary); }

.menu-toggle {
	display: none;
	flex-direction: column;
	gap: 5px;
	background: none;
	border: 0;
	padding: 8px;
	cursor: pointer;
}

.menu-toggle-bar {
	width: 24px;
	height: 3px;
	background: var(--mit-dark);
	display: block;
	transition: transform 0.25s var(--mit-ease), opacity 0.2s var(--mit-ease);
}

/* Hamburger wordt een kruis als het menu open is */
.nav-open .menu-toggle-bar:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.nav-open .menu-toggle-bar:nth-child(2) { opacity: 0; }
.nav-open .menu-toggle-bar:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* ---- Donkere navigatiebalk (fixeert bij scrollen, dun bordeaux accent bovenop) ---- */
.site-nav {
	background: var(--mit-dark);
	z-index: 100;
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset;
	border-top: 2px solid var(--mit-primary);
}

body.nav-fixed .site-nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	box-shadow: 0 6px 24px rgba(30, 31, 33, 0.18);
	animation: mit-nav-in 0.25s var(--mit-ease);
}

@keyframes mit-nav-in {
	from { transform: translateY(-100%); }
	to { transform: none; }
}

.site-nav .container {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.main-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
}

.main-menu li { position: relative; }

.main-menu > li > a {
	display: block;
	padding: 20px 16px;
	font-family: var(--mit-font-heading);
	font-size: 14px;
	font-weight: 600;
	color: var(--mit-white);
	letter-spacing: 0.2px;
	position: relative;
	transition: color 0.2s var(--mit-ease);
}

.main-menu > li:first-child > a { padding-left: 0; }

/* Onderstreping die vanuit links binnenschuift */
.main-menu > li > a::after {
	content: '';
	position: absolute;
	left: 16px;
	right: 16px;
	bottom: 12px;
	height: 2px;
	background: var(--mit-primary-soft);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.28s var(--mit-ease);
}

.main-menu > li:first-child > a::after { left: 0; }

.main-menu > li > a:hover,
.main-menu > li.current-menu-item > a,
.main-menu > li.current_page_item > a,
.main-menu > li.current-menu-ancestor > a {
	color: var(--mit-primary-soft);
}

.main-menu > li > a:hover::after,
.main-menu > li.current-menu-item > a::after,
.main-menu > li.current_page_item > a::after,
.main-menu > li.current-menu-ancestor > a::after { transform: scaleX(1); }

/* Submenu's (max 1 niveau diep) */
.main-menu .sub-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 50;
	min-width: 220px;
	background: var(--mit-white);
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
	list-style: none;
	margin: 0;
	padding: 8px 0;
}

.main-menu li:hover > .sub-menu { display: block; }

.main-menu .sub-menu a {
	display: block;
	padding: 8px 20px;
	font-size: 13px;
	color: var(--mit-dark);
}

.main-menu .sub-menu a:hover { color: var(--mit-primary); }

/* Zoekveld in de navigatiebalk: klapt inline open naast het icoon */
.nav-search {
	display: flex;
	align-items: center;
	gap: 0;
	/* Veld klapt naar links open, het icoon blijft rechts staan */
	flex-direction: row-reverse;
	position: relative;
}

.nav-search-toggle {
	background: none;
	border: 0;
	color: var(--mit-white);
	cursor: pointer;
	padding: 10px;
	display: flex;
	transition: color 0.2s var(--mit-ease);
}

.nav-search-toggle:hover { color: var(--mit-primary-soft); }

.nav-search-form {
	display: flex;
	align-items: center;
	overflow: hidden;
	width: 0;
	opacity: 0;
	transition: width 0.3s var(--mit-ease), opacity 0.25s var(--mit-ease);
}

.nav-search.is-open .nav-search-form { width: 240px; opacity: 1; }

.nav-search-form input[type='search'] {
	width: 100%;
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.25);
	color: var(--mit-white);
	padding: 8px 14px;
	font-size: 13px;
}

.nav-search-form input[type='search']::placeholder { color: rgba(255, 255, 255, 0.6); }

.nav-search-form input[type='search']:focus {
	outline: none;
	border-color: var(--mit-primary-soft);
	background: rgba(255, 255, 255, 0.18);
}

/* Verborgen submitknop: Enter verstuurt het formulier */
.nav-search-form button[type='submit'] {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	border: 0;
	padding: 0;
}

/* ---- Paginakop: wit met breadcrumbs en kleine-letters-titel ---- */
.page-header { padding: 40px 0 10px; margin-bottom: 35px; }

.mit-breadcrumbs {
	font-size: 12px;
	color: #999;
	margin-bottom: 28px;
}

.mit-breadcrumbs a { color: var(--mit-gray); }
.mit-breadcrumbs a:hover { color: var(--mit-primary); }
.mit-breadcrumbs-sep { margin: 0 4px; }

.page-header-title {
	margin: 0;
	position: relative;
	text-transform: lowercase;
	font-size: 34px;
	padding-bottom: 24px;
}

.page-header-title::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 30px;
	height: 5px;
	background: linear-gradient(90deg, var(--mit-dark) 0 70%, var(--mit-primary) 70% 100%);
}

.page-header-description { color: var(--mit-gray); margin-top: 12px; }

.page-content { padding-bottom: 60px; }

/* Alignfull binnen een gecentreerde container: uitbreken tot schermbreedte */
.page-content .alignfull,
.single-post-content .alignfull {
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* ---- Hero-slider ---- */
.mit-hero-slider {
	position: relative;
	overflow: hidden;
	background: var(--mit-dark);
}

.mit-hero-slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: 0;
	transition: opacity 1.2s ease-in-out;
}

/* Zachte scrim voor leesbaarheid van de slide-tekst */
.mit-hero-slide::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(30, 31, 33, 0.08) 0%, rgba(30, 31, 33, 0.02) 45%, rgba(30, 31, 33, 0.18) 100%);
}

.mit-hero-slide.is-active {
	opacity: 1;
	animation: mit-kenburns 14s ease-out forwards;
}

@keyframes mit-kenburns {
	from { background-size: 100% auto; }
	to { background-size: 108% auto; }
}

@supports not (aspect-ratio: 1) {
	.mit-hero-slide.is-active { animation: none; }
}

/* Slide-inhoud komt gefaseerd omhoog zodra de slide actief is */
.mit-hero-slide .mit-hero-title,
.mit-hero-slide .mit-hero-button {
	opacity: 0;
	transform: translateY(14px);
	transition: opacity 0.7s var(--mit-ease), transform 0.7s var(--mit-ease);
}

.mit-hero-slide.is-active .mit-hero-title { opacity: 1; transform: none; transition-delay: 0.25s; }
.mit-hero-slide.is-active .mit-hero-button { opacity: 1; transform: none; transition-delay: 0.5s; }

.mit-hero-slide-content {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
}

.mit-hero-slide-content .container {
	width: 100%;
	text-align: center;
}

.mit-hero-title {
	font-family: var(--mit-font-heading);
	font-size: clamp(26px, 4.5vw, 58px);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: rgba(30, 31, 33, 0.55);
	margin-bottom: 30px;
}

.mit-hero-button {
	display: inline-block;
	background: rgba(30, 31, 33, 0.35);
	color: var(--mit-white);
	font-family: var(--mit-font-heading);
	font-size: 13px;
	font-weight: 600;
	padding: 12px 28px;
	transition: background 0.2s;
}

.mit-hero-button:hover { background: var(--mit-primary); color: var(--mit-white); }

/* ---- Secties (patterns) ---- */
.mit-section { padding: 85px 0; }
.mit-section-light { background: var(--mit-warm); border-top: 1px solid var(--mit-line); border-bottom: 1px solid var(--mit-line); }
.mit-section-dark { background: var(--mit-dark); color: rgba(255, 255, 255, 0.85); }
.mit-section-dark h2, .mit-section-dark h3 { color: var(--mit-white); }

/* Gecentreerde sectiekop in kleine letters met donker streepje (prod-stijl) */
.mit-section-title {
	position: relative;
	text-align: center;
	text-transform: lowercase;
	font-size: 34px;
	padding: 30px 0 24px;
	margin-bottom: 45px;
}

.mit-section-title::after {
	content: '';
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: 0;
	width: 30px;
	height: 5px;
	background: linear-gradient(90deg, var(--mit-dark) 0 70%, var(--mit-primary) 70% 100%);
}

/* Kleinere kop met streepje links (subpagina's) */
.mit-title-left {
	position: relative;
	padding-bottom: 16px;
	margin-bottom: 30px;
}

.mit-title-left::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 30px;
	height: 4px;
	background: linear-gradient(90deg, var(--mit-dark) 0 70%, var(--mit-primary) 70% 100%);
}

/* Icon-boxes (diensten) */
.mit-icon-box {
	display: flex;
	gap: 20px;
	align-items: flex-start;
}

.mit-icon-box .mit-icon-box-icon {
	flex: 0 0 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--mit-dark);
	color: var(--mit-white);
	border-radius: 50%;
	transition: background 0.3s var(--mit-ease), transform 0.3s var(--mit-ease);
}

.mit-icon-box:hover .mit-icon-box-icon {
	background: var(--mit-primary);
	transform: translateY(-2px);
}

.mit-icon-box h5 { margin-bottom: 12px; font-size: 17px; }
.mit-icon-box h5 a { color: var(--mit-dark); }
.mit-icon-box h5 a:hover { color: var(--mit-primary); }
.mit-icon-box p { margin-bottom: 0; font-size: 13px; line-height: 22px; }
.mit-icon-box p + p { margin-top: 12px; }
.mit-service-row { margin-bottom: 45px; }

/* Parallax-claim */
.mit-parallax { position: relative; }

.mit-parallax .wp-block-cover__image-background { background-attachment: fixed; }

.mit-claim {
	text-align: center;
	text-transform: lowercase;
	color: var(--mit-white);
	font-size: 40px;
	margin-bottom: 8px;
}

.mit-claim .mit-claim-soft { color: #8f93a3; }

.mit-claim-sub {
	text-align: center;
	color: var(--mit-white);
	font-size: 16px;
	margin: 0;
}

@media (hover: none), (max-width: 768px) {
	.mit-parallax .wp-block-cover__image-background { background-attachment: scroll; }
}

/* FAQ-accordion (core Details-blok) */
.mit-faq { border: 1px solid #e5e5e5; }

.mit-faq .wp-block-details {
	border: 0;
	border-bottom: 1px solid #e5e5e5;
	margin: 0;
	padding: 0;
}

.mit-faq .wp-block-details:last-child { border-bottom: 0; }

.wp-block-details summary {
	cursor: pointer;
	padding: 15px 18px 15px 44px;
	font-family: var(--mit-font-heading);
	font-weight: 600;
	font-size: 14px;
	color: var(--mit-dark);
	list-style: none;
	position: relative;
	transition: background 0.2s var(--mit-ease), color 0.2s var(--mit-ease);
}

.wp-block-details summary:hover { background: var(--mit-warm); color: var(--mit-primary); }

.wp-block-details::details-content {
	transition: content-visibility 0.3s allow-discrete, block-size 0.3s var(--mit-ease);
	block-size: 0;
	overflow: clip;
}

.wp-block-details[open]::details-content { block-size: auto; }

.wp-block-details summary::-webkit-details-marker { display: none; }

.wp-block-details summary::before {
	content: '+';
	position: absolute;
	left: 18px;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	line-height: 14px;
	text-align: center;
	border: 1px solid var(--mit-primary);
	color: var(--mit-primary);
	font-size: 13px;
}

.wp-block-details[open] summary::before { content: '\2212'; }
.wp-block-details > :not(summary) { padding: 0 18px 0 44px; font-size: 13px; line-height: 22px; }
.wp-block-details > p:last-child { padding-bottom: 15px; }

/* Partnerlogo-carrousel: statisch gecentreerd; beweegt alleen bij overflow */
.mit-logo-carousel { overflow: hidden; }

.mit-logo-track {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 60px;
}

.mit-logo-carousel.is-running .mit-logo-track {
	justify-content: flex-start;
	width: max-content;
	animation: mit-marquee 30s linear infinite;
}

.mit-logo-carousel:hover .mit-logo-track { animation-play-state: paused; }

.mit-logo-track img {
	max-height: 80px;
	width: auto;
	filter: grayscale(1);
	opacity: 0.75;
	transition: filter 0.2s, opacity 0.2s;
}

.mit-logo-track img:hover { filter: none; opacity: 1; }

@keyframes mit-marquee {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
	.mit-logo-carousel.is-running .mit-logo-track { animation: none; }
	.mit-hero-slide { transition: none; }
}

/* ---- Nieuws ---- */
.post-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}

.post-card {
	background: var(--mit-white);
	border: 1px solid var(--mit-line);
	display: flex;
	flex-direction: column;
	transition: transform 0.3s var(--mit-ease), box-shadow 0.3s var(--mit-ease), border-color 0.3s var(--mit-ease);
}

.post-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--mit-shadow-m);
	border-color: transparent;
}

.post-card-image { display: block; }
.post-card-image img { display: block; width: 100%; }

.post-card-body { padding: 24px; display: flex; flex-direction: column; flex: 1; }

.post-card-meta {
	font-size: 12px;
	color: #999;
	margin-bottom: 10px;
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.post-card-meta a { color: var(--mit-primary); }
.post-card-title { font-size: 17px; margin-bottom: 10px; }
.post-card-title a { color: var(--mit-dark); }
.post-card-title a:hover { color: var(--mit-primary); }
.post-card-excerpt { flex: 1; font-size: 13px; line-height: 22px; }
.post-card-excerpt p { margin-bottom: 12px; }

.post-card-more {
	font-family: var(--mit-font-heading);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
}

.news-archive { padding-bottom: 60px; }

.pagination-nav { margin-top: 40px; }
.pagination-nav .page-numbers {
	display: inline-block;
	padding: 8px 14px;
	border: 1px solid #e5e5e5;
	margin-right: 6px;
	color: var(--mit-dark);
}
.pagination-nav .page-numbers.current,
.pagination-nav .page-numbers:hover {
	background: var(--mit-primary);
	border-color: var(--mit-primary);
	color: var(--mit-white);
}

/* Detailpagina */
.single-post-content { max-width: 830px; padding-bottom: 60px; }
.single-post-image { margin: 20px 0; }
.single-post-tags { margin-top: 30px; }
.single-post-tags a {
	display: inline-block;
	background: var(--mit-light);
	padding: 4px 12px;
	font-size: 12px;
	margin: 0 6px 6px 0;
}

.post-nav {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	margin-top: 40px;
	padding-top: 20px;
	border-top: 1px solid #ececec;
}

/* ---- Scroll-reveal: elementen komen zacht omhoog zodra ze in beeld schuiven ---- */
.mit-reveal {
	opacity: 0;
	transform: translateY(22px);
	transition: opacity 0.65s var(--mit-ease), transform 0.65s var(--mit-ease);
	transition-delay: var(--mit-reveal-delay, 0s);
}

.mit-reveal.is-visible { opacity: 1; transform: none; }

/* Zonder JavaScript of bij verminderde beweging: alles gewoon zichtbaar */
.no-js .mit-reveal { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
	.mit-reveal { opacity: 1; transform: none; transition: none; }
	.mit-hero-slide.is-active { animation: none; }
	.mit-hero-slide .mit-hero-title,
	.mit-hero-slide .mit-hero-button { opacity: 1; transform: none; transition: none; }
	.wp-element-button, .wp-block-button__link, .post-card, .mit-timeline-item { transition: none; }
}

/* ---- Footer: licht, logo links en contactinfo rechts ---- */
.site-footer { background: var(--mit-warm); color: var(--mit-gray); border-top: 1px solid var(--mit-line); }

.footer-widgets-inner {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 40px;
	padding: 55px 15px 40px;
	flex-wrap: wrap;
}

.footer-logo img { height: 130px; width: auto; }

.footer-title {
	color: var(--mit-dark);
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin-bottom: 20px;
}

.footer-contact-list {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 13px;
}

.footer-contact-list li {
	display: flex;
	gap: 10px;
	align-items: center;
	margin-bottom: 8px;
}

.footer-contact-list a { color: var(--mit-primary); }
.footer-contact-list a:hover { color: var(--mit-dark); }
.footer-contact-list .contact-icon { color: var(--mit-primary); display: flex; }

.footer-copyright {
	border-top: 1px solid #e8e8e8;
	padding: 18px 0;
	font-size: 13px;
	color: #777;
}

.footer-copyright p { margin: 0; }

.footer-copyright-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.footer-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 24px;
}

.footer-menu a { color: #777; }
.footer-menu a:hover { color: var(--mit-primary); }

/* ---- Formulieren (Contact Form 7 + zoekveld) ---- */
.wpcf7 input[type='text'],
.wpcf7 input[type='email'],
.wpcf7 input[type='tel'],
.wpcf7 select,
.wpcf7 textarea,
.search-form input[type='search'],
.nav-search-form input[type='search'] {
	width: 100%;
	border: 1px solid #e3e3e3;
	background: #f7f7f7;
	padding: 13px 16px;
	font-family: var(--mit-font-body);
	font-size: 13px;
	color: var(--mit-dark);
}

/* In donkere cover-secties: semi-transparant wit zonder rand (prod-stijl) */
.wp-block-cover .wpcf7 input[type='text'],
.wp-block-cover .wpcf7 input[type='email'],
.wp-block-cover .wpcf7 input[type='tel'],
.wp-block-cover .wpcf7 select,
.wp-block-cover .wpcf7 textarea {
	border: 0;
	background: rgba(255, 255, 255, 0.85);
}

.wpcf7 input[type='text'],
.wpcf7 input[type='email'],
.wpcf7 input[type='tel'],
.wpcf7 select,
.wpcf7 textarea { transition: border-color 0.2s var(--mit-ease), box-shadow 0.2s var(--mit-ease); }

.wpcf7 input:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
	outline: none;
	border-color: var(--mit-primary);
	box-shadow: 0 0 0 3px rgba(140, 0, 77, 0.12);
}

/* Formuliergrid: 2 kolommen zoals op prod */
.mit-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-bottom: 16px;
}

.mit-form-grid p { margin: 0; }
.mit-form-grid textarea { min-height: 120px; }
.mit-form-grid .mit-form-textarea { grid-column: 1 / -1; }
.mit-form-submit { display: flex; align-items: stretch; }
.mit-form-submit .wpcf7-spinner { align-self: center; }

.wpcf7 input[type='submit'] {
	background: var(--mit-dark);
	color: var(--mit-white);
	font-family: var(--mit-font-heading);
	font-size: 13px;
	font-weight: 600;
	padding: 13px 34px;
	border: 0;
	cursor: pointer;
	width: auto;
	transition: background 0.2s;
}

.wpcf7 input[type='submit']:hover { background: var(--mit-primary); }

/* Witte formulierlabels/teksten in donkere cover-secties */
.wp-block-cover .wpcf7 p { color: var(--mit-white); }

/* Cover-secties: inhoud binnen de containerbreedte houden */
.wp-block-cover .wp-block-cover__inner-container {
	max-width: var(--mit-container);
	margin-left: auto;
	margin-right: auto;
	padding-left: 15px;
	padding-right: 15px;
	width: 100%;
}

/* Turnstile-widget niet laten uitrekken */
.wpcf7 .cf-turnstile,
.wpcf7 .cf-turnstile iframe { max-width: 300px; }

/* Selects gelijk aan tekstvelden */
.wpcf7 select {
	height: 45px;
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23555'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
}

.search-form { display: flex; gap: 8px; max-width: 400px; }

/* ---- Quote-banner (Over ons) ---- */
.mit-quote-banner {
	position: relative;
	background-size: cover;
	background-position: center;
	min-height: 360px;
	display: flex;
	align-items: stretch;
	margin-bottom: 55px;
}

.mit-quote-box {
	background: rgba(30, 31, 33, 0.82);
	color: var(--mit-white);
	max-width: 385px;
	margin: 35px 0 35px 30px;
	padding: 40px 35px;
}

.mit-quote-box blockquote {
	margin: 0 0 25px;
	font-family: var(--mit-font-body);
	font-size: 20px;
	font-weight: 700;
	line-height: 1.45;
}

.mit-quote-author {
	display: flex;
	gap: 14px;
	align-items: center;
}

.mit-quote-author img {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	object-fit: cover;
}

.mit-quote-author .name { font-weight: 600; display: block; }
.mit-quote-author .role { font-style: italic; font-size: 13px; color: #cfcfcf; }

/* ---- Tijdlijn (Over ons) ---- */
.mit-timeline {
	position: relative;
	padding: 30px 0 60px;
}

.mit-timeline::before {
	content: '';
	position: absolute;
	left: 50%;
	top: 0;
	bottom: 0;
	width: 2px;
	background: #dedede;
	transform: translateX(-50%);
}

.mit-timeline-item {
	position: relative;
	width: 44%;
	background: var(--mit-white);
	border: 1px solid var(--mit-line);
	box-shadow: var(--mit-shadow-s);
	padding: 30px 32px;
	margin-bottom: 45px;
	transition: transform 0.3s var(--mit-ease), box-shadow 0.3s var(--mit-ease);
}

.mit-timeline-item:hover {
	transform: translateY(-3px);
	box-shadow: var(--mit-shadow-m);
}

.mit-timeline-item::before {
	content: '';
	position: absolute;
	top: 38px;
	width: 11px;
	height: 11px;
	background: var(--mit-primary);
	border-radius: 50%;
	box-shadow: 0 0 0 4px rgba(140, 0, 77, 0.15);
}

.mit-timeline-item:nth-child(odd) { margin-right: auto; }
.mit-timeline-item:nth-child(odd)::before { left: calc(113.6% - 4px); }
.mit-timeline-item:nth-child(even) { margin-left: auto; }
.mit-timeline-item:nth-child(even)::before { right: calc(113.6% - 4px); }

.mit-timeline-item .year {
	font-family: var(--mit-font-heading);
	font-size: 22px;
	font-weight: 700;
	color: var(--mit-primary);
	display: block;
	margin-bottom: 6px;
}

.mit-timeline-item h5 { margin-bottom: 12px; font-size: 20px; }
.mit-timeline-item p { margin: 0; font-size: 13px; line-height: 22px; }

/* ---- Layout met zijbalk ---- */
.mit-with-sidebar {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 50px;
	align-items: start;
	padding-bottom: 60px;
}

.mit-sidebar .search-form { max-width: none; margin-bottom: 25px; gap: 0; }
.mit-sidebar .search-form input[type='search'] { background: #d9d9d9; border: 0; }
.mit-sidebar .search-form .wp-element-button { padding: 13px 18px; }

.mit-sidebar-links { list-style: none; margin: 0 0 25px; padding: 0; }

.mit-sidebar-links a {
	display: block;
	background: #eef0f6;
	color: var(--mit-dark);
	font-family: var(--mit-font-heading);
	font-size: 17px;
	font-weight: 600;
	padding: 22px 26px;
	margin-bottom: 12px;
	border-left: 3px solid transparent;
	transition: background 0.25s var(--mit-ease), color 0.25s var(--mit-ease), border-color 0.25s var(--mit-ease), padding-left 0.25s var(--mit-ease);
}

.mit-sidebar-links a:hover {
	background: var(--mit-dark);
	color: var(--mit-white);
	border-left-color: var(--mit-primary);
	padding-left: 30px;
}

.mit-sidebar-cta {
	background: var(--mit-primary);
	color: var(--mit-white);
	padding: 32px 30px;
}

.mit-sidebar-cta h5 { margin-bottom: 10px; font-size: 16px; color: var(--mit-white); }
.mit-sidebar-cta p { font-size: 13px; margin-bottom: 20px; color: rgba(255, 255, 255, 0.85); }
.mit-sidebar-cta .wp-element-button { background: var(--mit-white); color: var(--mit-dark); }
.mit-sidebar-cta .wp-element-button:hover { background: var(--mit-dark); color: var(--mit-white); }

/* ---- Dienstkaarten met foto en zwart hoeklabel ---- */
.mit-service-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 45px;
}

.mit-service-card figure { position: relative; margin: 0 0 22px; overflow: visible; }
.mit-service-card figure a { display: block; }
.mit-service-card figure img,
.mit-service-card > a figure img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	transition: transform 0.5s var(--mit-ease), box-shadow 0.4s var(--mit-ease);
}

.mit-service-card > a:hover figure img {
	transform: scale(1.025);
	box-shadow: var(--mit-shadow-m);
}

.mit-service-card > a:hover .label { background: var(--mit-primary); }
.mit-service-card .label { transition: background 0.3s var(--mit-ease); }

.mit-service-card .label {
	position: absolute;
	left: 0;
	bottom: -18px;
	background: var(--mit-dark);
	color: var(--mit-white);
	font-family: var(--mit-font-heading);
	font-size: 14px;
	font-weight: 600;
	padding: 12px 26px;
	min-width: 78%;
	clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
}

.mit-service-card p { font-size: 13px; line-height: 22px; text-align: center; }
.mit-service-card p:first-of-type { margin-top: 30px; }
.mit-service-card > a { display: block; }

.mit-card-more a {
	font-family: var(--mit-font-heading);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
}

/* Opsommingen met vinkjes op dienst-detailpagina's */
.mit-check-list {
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
}

.mit-check-list li {
	position: relative;
	padding-left: 28px;
	margin-bottom: 10px;
}

.mit-check-list li::before {
	content: '';
	position: absolute;
	left: 0;
	top: 5px;
	width: 14px;
	height: 14px;
	background: var(--mit-primary);
	clip-path: polygon(14% 44%, 0 61%, 40% 100%, 100% 16%, 84% 2%, 39% 70%);
}

/* Dienst-detailpagina: zelfde beeldstijl, tekst op leesbreedte links uitgelijnd */
.mit-service-detail figure { position: relative; margin: 0 0 40px; }
.mit-service-detail figure img { display: block; width: 100%; aspect-ratio: 16 / 8; object-fit: cover; }

.mit-service-detail .label {
	position: absolute;
	left: 0;
	bottom: -18px;
	background: var(--mit-dark);
	color: var(--mit-white);
	font-family: var(--mit-font-heading);
	font-size: 15px;
	font-weight: 600;
	padding: 13px 30px;
	min-width: 55%;
	clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 0 100%);
}

/* ---- Partnerrijen ---- */
.mit-partner-row {
	display: flex;
	gap: 30px;
	align-items: center;
	margin-bottom: 45px;
}

.mit-partner-row .logo {
	flex: 0 0 170px;
	border: 1px solid #ececec;
	padding: 10px;
	background: var(--mit-white);
}

.mit-partner-row .logo img { display: block; width: 100%; height: auto; }
.mit-partner-row h4 { margin-bottom: 6px; }
.mit-partner-row h4 a { color: var(--mit-dark); }
.mit-partner-row h4 a:hover { color: var(--mit-primary); }
.mit-partner-row .place { color: #999; font-size: 13px; letter-spacing: 0.5px; }

/* ---- Contactpagina ---- */
.mit-contact-top {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	margin-bottom: 55px;
}

.mit-contact-top.has-photo { grid-template-columns: 1fr 1fr 1fr; }

.mit-contact-photo {
	width: 100%;
	height: 320px;
	object-fit: cover;
	display: block;
}

.mit-contact-top iframe { width: 100%; height: 320px; border: 0; display: block; }

.mit-contact-details {
	background: #1d2340;
	color: var(--mit-white);
	padding: 38px 40px;
}

.mit-contact-details h4 { color: var(--mit-white); text-transform: lowercase; margin-bottom: 24px; }

.mit-contact-details ul { list-style: none; margin: 0; padding: 0; }

.mit-contact-details li {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	margin-bottom: 16px;
	font-size: 14px;
	font-weight: 600;
}

.mit-contact-details a { color: var(--mit-primary-soft); }
.mit-contact-details a:hover { color: var(--mit-white); }
.mit-contact-details .contact-icon { color: #8f93a3; display: flex; margin-top: 3px; }

.mit-contact-person {
	display: flex;
	gap: 18px;
	align-items: flex-start;
}

.mit-contact-person img { width: 90px; height: auto; }
.mit-contact-person h5 { font-size: 18px; margin-bottom: 4px; }
.mit-contact-person .role { color: var(--mit-gray); font-weight: 600; font-size: 13px; margin-bottom: 8px; }
.mit-contact-person p { font-size: 13px; margin: 0; }

/* Formulier in twee kolommen (contactpagina) */
.mit-form-cols {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 25px;
	margin-bottom: 16px;
}

.mit-form-cols .mit-form-stack > div { margin-bottom: 25px; }
.mit-form-cols textarea { min-height: 145px; }

/* ---- Responsive ---- */
@media (max-width: 1024px) {
	.contact-info-box { gap: 24px; }
	.post-grid,
	.wp-block-post-template.is-layout-grid { grid-template-columns: repeat(2, 1fr) !important; }
	.logo-box img, .logo-box .custom-logo { height: 110px; }
}

@media (max-width: 768px) {
	.contact-info-box { display: none; }
	.menu-toggle { display: flex; }

	.logo-box img, .logo-box .custom-logo { height: 80px; }

	.site-nav { display: none; position: static; }
	.site-nav.is-open { display: block; animation: mit-menu-in 0.25s var(--mit-ease); }
	.site-nav .container { flex-direction: column; align-items: stretch; }

	.main-menu { flex-direction: column; padding: 10px 0; }
	.main-menu > li > a { padding: 10px 0; }
	.main-menu .sub-menu {
		display: block;
		position: static;
		box-shadow: none;
		padding-left: 16px;
	}

	.nav-search { display: none; }

	.post-grid,
	.wp-block-post-template.is-layout-grid { grid-template-columns: 1fr !important; }
	.mit-section { padding: 45px 0; }
	.mit-section-title { font-size: 28px; margin-bottom: 30px; }
	.mit-claim { font-size: 28px; }
	.page-header { padding: 35px 0; margin-bottom: 30px; }
	h1 { font-size: 28px; }
	h2 { font-size: 24px; }

	.mit-form-grid { grid-template-columns: 1fr; }

	.footer-widgets-inner { flex-direction: column; padding: 40px 15px; }
	.footer-logo img { height: 90px; }

	.mit-with-sidebar { grid-template-columns: 1fr; gap: 35px; }
	.mit-service-cards { grid-template-columns: 1fr; gap: 35px; }
	.mit-contact-top,
	.mit-contact-top.has-photo { grid-template-columns: 1fr; }
	.mit-contact-photo { height: 220px; }
	.mit-form-cols { grid-template-columns: 1fr; }
	.mit-quote-box { margin: 20px 15px; padding: 28px 24px; }
	.mit-quote-box blockquote { font-size: 17px; }

	.mit-timeline::before { left: 8px; }
	.mit-timeline-item,
	.mit-timeline-item:nth-child(odd),
	.mit-timeline-item:nth-child(even) { width: auto; margin-left: 32px; margin-right: 0; }
	.mit-timeline-item:nth-child(odd)::before,
	.mit-timeline-item:nth-child(even)::before { left: -28px; right: auto; }

	.mit-partner-row { flex-direction: column; align-items: flex-start; }
	.mit-hero-title { letter-spacing: 0; }
}

@keyframes mit-menu-in {
	from { opacity: 0; transform: translateY(-8px); }
	to { opacity: 1; transform: none; }
}