/**
 * Globale stijlen van het thema (frontend + editor via add_editor_style).
 * Alle kleuren, fonts en maten komen uit theme.json.
 */

/* ───────────── Basis ───────────── */

html {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

body {
	overflow-x: clip;
}

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

input[type="range"] {
	accent-color: var(--wp--preset--color--primary);
}

.screen-reader-text:focus {
	z-index: 100000;
}

/* Container: max 1360px + zijpadding (= wideSize + root padding). */
.pms-container {
	box-sizing: content-box;
	max-width: var(--wp--custom--container--max);
	margin-inline: auto;
	padding-inline: var(--wp--custom--container--gutter);
}

/* ───────────── Kruimelpad (pms/page-hero, pms/breadcrumbs, single) ───────────── */

.pms-breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 var(--wp--custom--hero--crumb-gap);
	font-size: var(--wp--custom--hero--crumb-size);
	color: var(--wp--preset--color--label);
}

.pms-breadcrumbs.is-compact,
.is-compact > .pms-breadcrumbs {
	margin-bottom: var(--wp--custom--hero--crumb-gap-compact);
}

.pms-breadcrumbs a {
	color: var(--wp--preset--color--label);
	text-decoration: none;
	transition: color var(--wp--custom--transition--color);
}

.pms-breadcrumbs a:hover {
	color: var(--wp--preset--color--primary);
}

.pms-breadcrumbs__sep {
	color: var(--wp--preset--color--accent);
}

.pms-breadcrumbs__current {
	font-weight: 600;
	color: var(--wp--preset--color--primary);
}

.pms-breadcrumbs--rank-math {
	display: block;
}

.pms-breadcrumbs--rank-math .rank-math-breadcrumb p {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
}

.pms-breadcrumbs--rank-math .separator {
	color: var(--wp--preset--color--accent);
}

.pms-breadcrumbs--rank-math .last {
	font-weight: 600;
	color: var(--wp--preset--color--primary);
}

/* ───────────── Header ───────────── */

.pms-site-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 50;
	background: color-mix(in srgb, var(--wp--preset--color--base) 97%, transparent);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--wp--custom--line--default);
}

/* De megamenu- en mobiele panelen positioneren t.o.v. de volle breedte van de header. */
.pms-header {
	position: relative;
}

.pms-header__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 16px;
	box-sizing: content-box;
	max-width: var(--wp--custom--container--max);
	height: var(--wp--custom--header--height-mobile);
	margin: 0 auto;
	padding: 0 var(--wp--custom--container--gutter);
}

.pms-header__inner > * {
	margin-block: 0;
}

.pms-header__inner > .pms-brand {
	justify-self: start;
}

.pms-header__actions {
	justify-self: end;
	gap: 12px;
}

/* Offerteknop enkel naast het volledige menu (≥ 1100px); daaronder logo + hamburger,
   de knop staat dan in het mobiele menu. Twee classes: core zet .wp-block-buttons.is-layout-flex op flex. */
.pms-header .pms-header__cta {
	display: none;
}

.pms-header__cta .wp-block-button__link {
	padding: 11px 18px;
	font-size: var(--wp--preset--font-size--x-small);
	white-space: nowrap;
}

@media (min-width: 1100px) {
	.pms-header .pms-header__cta {
		display: flex;
	}
}

@media (min-width: 1100px) {
	.pms-header__inner {
		/* Buitenkolommen nooit smaller dan logo/knop: bij 1100–1250px liep het logo anders over "Diensten". */
		grid-template-columns: minmax(max-content, 1fr) auto minmax(max-content, 1fr);
		height: var(--wp--custom--header--height);
	}
}

/* ───────────── Footer ───────────── */

.pms-site-footer {
	background: var(--wp--preset--color--footer);
	color: var(--wp--preset--color--footer-text);
}

.pms-footer {
	box-sizing: content-box;
	max-width: var(--wp--custom--container--max);
	margin: 0 auto;
	padding: clamp(80px, 9vw, 120px) var(--wp--custom--container--gutter) 32px;
}

.pms-footer > * {
	margin-block: 0;
}

.pms-footer h2 {
	color: var(--wp--preset--color--base);
}

.pms-footer a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--base);
}

.pms-footer a:where(:not(.wp-element-button)):hover {
	color: var(--wp--preset--color--accent);
}

.pms-footer__cta {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 32px 48px;
	padding-bottom: clamp(56px, 6vw, 80px);
	border-bottom: 1px solid var(--wp--custom--line--inverse);
}

.pms-footer__cta-text {
	max-width: 560px;
}

.pms-footer__cta-text > * {
	margin-block: 0;
}

.pms-footer__cta-text h2 {
	margin-bottom: 10px;
	line-height: 1.15;
	letter-spacing: -.025em;
}

.pms-footer__kicker {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px !important;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--accent);
}

.pms-footer__kicker::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentColor;
}

.pms-footer__buttons {
	gap: 10px;
}

.pms-footer__buttons .wp-block-button__link {
	font-size: var(--wp--preset--font-size--small);
}

.pms-footer__buttons .is-style-accent .wp-block-button__link {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--footer);
	font-weight: 700;
}

.pms-footer__buttons .is-style-accent .wp-block-button__link:hover {
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--footer);
}

.pms-footer__buttons .is-style-outline .wp-block-button__link {
	border-color: var(--wp--custom--line--inverse-strong);
	color: var(--wp--preset--color--base);
}

.pms-footer__buttons .is-style-outline .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--accent);
}

.pms-footer__columns {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 44px;
	padding: clamp(56px, 6vw, 80px) 0 48px;
}

.pms-footer__columns > * {
	margin-block: 0;
}

.pms-footer__company {
	min-width: 260px;
}

/* Mobiel: menukolommen per twee naast elkaar (anders ±1100px gestapelde lijsten). */
@media (max-width: 639px) {
	.pms-footer__columns {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 40px 20px;
	}

	.pms-footer__company {
		grid-column: 1 / -1;
		min-width: 0;
	}
}

.pms-footer__company .pms-brand {
	margin-bottom: 24px;
}

.pms-footer__address {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.8;
}

.pms-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 12px 28px;
	padding-top: 24px;
	border-top: 1px solid var(--wp--custom--line--inverse);
	font-size: var(--wp--preset--font-size--x-small);
	color: var(--wp--preset--color--footer-meta);
}

.pms-footer__bottom > * {
	margin-block: 0;
}

.pms-footer__bottom a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--footer-meta);
}

.pms-footer__bottom .pms-menu--footer-column .pms-menu__list {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 22px;
	font-size: inherit;
}

.pms-footer__bottom .pms-menu--footer-column .pms-menu__link {
	color: var(--wp--preset--color--footer-meta);
}

.pms-footer__bottom .pms-menu--footer-column .pms-menu__link:hover {
	color: var(--wp--preset--color--base);
}

.pms-footer__legal {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 22px;
}

.pms-footer__legal > * {
	margin-block: 0;
}

/* ───────────── Tap targets ───────────── */

@media (pointer: coarse) {
	.pms-footer .pms-menu__link,
	.pms-footer__legal a {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
	}
}

/* ───────────── Blokstijlen ───────────── */

/* Paragraaf "Lead" */
.is-style-lead {
	font-size: var(--wp--preset--font-size--lead);
	color: var(--wp--preset--color--muted);
	text-wrap: pretty;
}

/* Knop "Tekstlink": vette link met salie onderlijn. */
.wp-block-button.is-style-link .wp-block-button__link {
	padding: 0 0 4px;
	border-radius: 0;
	border-bottom: 2px solid var(--wp--preset--color--accent);
	background: none;
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

.wp-block-button.is-style-link .wp-block-button__link:hover {
	background: none;
	color: var(--wp--preset--color--primary);
}

/* Inline kleur (H1-accenten) zonder achtergrond. */
mark.has-inline-color {
	background: none;
}

/* Tekstlink met salie onderlijn (in blokken; zelfde look als knopstijl "Tekstlink"). */
.pms-link {
	display: inline-block;
	padding-bottom: 4px;
	border-bottom: 2px solid var(--wp--preset--color--accent);
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	transition: color var(--wp--custom--transition--color);
}

.pms-link:hover {
	color: var(--wp--preset--color--primary);
}

.pms-link--primary {
	padding-bottom: 3px;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--primary);
	white-space: nowrap;
}

/* ───────────── Realisatiekaart + swatch (gedeeld) ───────────── */

.pms-swatch {
	flex: none;
	width: 10px;
	height: 10px;
	border-radius: var(--wp--custom--radius--swatch);
	background: var(--pms-swatch, var(--wp--preset--color--accent));
	/* Fijne rand: lichte kleuren (bv. wit gelakt) blijven zichtbaar op een witte tag. */
	box-shadow: inset 0 0 0 1px var(--wp--custom--line--strong);
}

.pms-card {
	display: block;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.pms-card:hover {
	color: var(--wp--preset--color--contrast);
}

.pms-card:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 4px;
	border-radius: var(--wp--custom--radius--image);
}

.pms-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	border-radius: var(--wp--custom--radius--image);
	background: var(--wp--preset--color--surface);
}

.pms-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 1s ease;
}

.pms-card:hover .pms-card__img {
	transform: scale(1.04);
}

.pms-card__tag {
	position: absolute;
	top: 14px;
	left: 14px;
	display: flex;
	align-items: center;
	gap: 7px;
	padding: 5px 10px;
	border-radius: var(--wp--custom--radius--button);
	background: var(--wp--preset--color--base);
	font-size: var(--wp--custom--card--tag);
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--contrast);
}

.pms-card__meta {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	margin-top: 16px;
}

.pms-card__title {
	margin: 0;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--custom--card--title);
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0;
	color: inherit;
}

.pms-card__cat {
	flex: none;
	font-size: var(--wp--custom--card--meta);
	color: var(--wp--preset--color--label);
}

@media (prefers-reduced-motion: reduce) {
	.pms-card:hover .pms-card__img {
		transform: none;
	}
}

/* ───────────── Secties (patterns) ───────────── */

/* Sectie: core/group alignfull, layout constrained met contentSize = wideSize. */
.pms-section {
	padding-bottom: var(--wp--preset--spacing--60);
}

/* Homepage: iets grotere sectieafstand (max 180px). */
.pms-section--home {
	padding-bottom: var(--wp--preset--spacing--70);
}

.pms-section--bordered > .pms-section__body.pms-section__body {
	padding-top: clamp(72px, 8vw, 120px);
	border-top: 1px solid var(--wp--custom--line--medium);
}

/* Kop van een sectie: H2 links, intro rechts (onderaan uitgelijnd). */
.pms-section-head {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
	align-items: end;
	gap: 24px 80px;
	margin-bottom: clamp(48px, 5vw, 80px) !important;
}

.pms-section-head.pms-section-head > *,
.pms-section-head > .wp-block-group > * {
	margin-block: 0;
}

.pms-section-head > p {
	max-width: 440px;
	color: var(--wp--preset--color--muted);
}

/* Variant: kop links, link rechts. */
.pms-section-head--split {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px 28px;
	margin-bottom: clamp(36px, 4vw, 56px) !important;
}

.pms-section-head--split > :first-child {
	max-width: 560px;
}

.pms-section-head--split.pms-section-head--split p {
	margin: 14px 0 0;
	color: var(--wp--preset--color--muted);
}

/* Twee kolommen (tekst + visual). */
.pms-split {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr));
	align-items: center;
	gap: clamp(48px, 7vw, 120px);
}

.pms-split.pms-split > * {
	min-width: 0;
	margin-block: 0;
}

.pms-split__text {
	max-width: 520px;
}

.pms-split .pms-split__text > * {
	margin-block: 0;
}

.pms-split .pms-split__text > h2 {
	margin-bottom: 26px;
}

.pms-split .pms-split__text > p {
	margin-bottom: 18px;
	color: var(--wp--preset--color--muted);
	text-wrap: pretty;
}

.pms-split .pms-split__text > p:last-of-type {
	margin-bottom: 34px;
}

.pms-split__text .wp-block-buttons {
	gap: 28px;
	align-items: center;
}

.pms-split__text .wp-block-button:not(.is-style-link):not(.is-style-outline) .wp-block-button__link {
	padding: 13px 22px;
}

.pms-split .wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Smalle sectiekop (enkel H2, max 720px), bv. werkwijze. */
.pms-section-head--narrow {
	display: block;
	max-width: 720px;
	margin-bottom: clamp(44px, 5vw, 72px) !important;
}

/* H2's in secties van dienstpagina's. */
.pms-section-head h2,
.pms-faq-layout h2 {
	text-wrap: balance;
}

/* FAQ-sectie: kop + intro links, accordeon rechts. */
.pms-faq-layout {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
	align-items: start;
	gap: clamp(48px, 6vw, 110px);
}

.pms-faq-layout.pms-faq-layout > * {
	min-width: 0;
	margin-block: 0;
}

.pms-faq-layout__intro {
	max-width: 420px;
}

.pms-faq-layout .pms-faq-layout__intro > * {
	margin-block: 0;
}

.pms-faq-layout .pms-faq-layout__intro > p {
	margin-top: 22px;
	color: var(--wp--preset--color--muted);
}

.pms-faq-layout__intro a {
	font-weight: 700;
}

/* Twee tekstkolommen (home: over ons + FAQ). */
.pms-pair {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
	gap: clamp(56px, 7vw, 120px);
}

.pms-pair.pms-pair > * {
	min-width: 0;
	margin-block: 0;
}

.pms-pair .pms-pair__text {
	max-width: 560px;
}

.pms-pair .pms-pair__text > * {
	margin-block: 0;
}

.pms-pair .pms-pair__text > h2 {
	margin-bottom: 26px;
	text-wrap: balance;
}

.pms-pair .pms-pair__text > p {
	margin-bottom: 18px;
	color: var(--wp--preset--color--muted);
	text-wrap: pretty;
}

.pms-pair .pms-pair__text > p:last-of-type {
	margin-bottom: 36px;
}

.pms-pair .pms-pair__aside > * {
	margin-block: 0;
}

/* ───────────── Lightbox (gedeeld) ───────────── */

.pms-lb-trigger {
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	overflow: hidden;
	border-radius: var(--wp--custom--radius--image);
	background: var(--wp--preset--color--surface);
	cursor: zoom-in;
}

.pms-lb-trigger img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 1s ease;
}

.pms-lb-trigger:hover img {
	transform: scale(1.04);
}

.pms-lb-trigger:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

.pms-lightbox {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
	padding: 76px clamp(16px, 6vw, 96px) 20px;
	background: color-mix(in srgb, var(--wp--preset--color--footer) 94%, transparent);
}

.pms-lightbox[hidden] {
	display: none;
}

/* Foto krimpt mee zodat het bijschrift eronder altijd volledig zichtbaar blijft. */
.pms-lightbox__img {
	display: block;
	flex: 0 1 auto;
	min-height: 0;
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	border-radius: 4px;
}

.pms-lightbox__close,
.pms-lightbox__nav {
	position: absolute;
	border: 1px solid var(--wp--custom--line--inverse-strong);
	border-radius: 50%;
	color: var(--wp--preset--color--base);
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	transition: border-color var(--wp--custom--transition--color);
}

.pms-lightbox__close {
	top: 18px;
	right: 18px;
	width: 48px;
	height: 48px;
	background: none;
}

.pms-lightbox__nav {
	top: 50%;
	width: 52px;
	height: 52px;
	transform: translateY(-50%);
	background: color-mix(in srgb, var(--wp--preset--color--footer) 50%, transparent);
}

.pms-lightbox__nav[hidden] {
	display: none;
}

.pms-lightbox__nav--prev {
	left: clamp(8px, 2vw, 28px);
}

.pms-lightbox__nav--next {
	right: clamp(8px, 2vw, 28px);
}

.pms-lightbox__close:hover,
.pms-lightbox__nav:hover,
.pms-lightbox__close:focus-visible,
.pms-lightbox__nav:focus-visible {
	border-color: var(--wp--preset--color--accent);
	outline: none;
}

.pms-lightbox__meta {
	display: flex;
	flex: none;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: center;
	gap: 4px 14px;
	max-width: min(100%, 720px);
	font-size: var(--wp--custom--hero--crumb-size);
	line-height: 1.5;
	text-align: center;
	color: var(--wp--preset--color--base);
}

.pms-lightbox__count {
	font-weight: 600;
	white-space: nowrap;
}

.pms-lightbox__cap {
	opacity: .8;
}

@media (prefers-reduced-motion: reduce) {
	.pms-lb-trigger:hover img {
		transform: none;
	}
}

/* ───────────── Single realisatie: secties ───────────── */

/* Verhaal: post-content met pms/story-section-blokken. */
.pms-story-wrap {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: clamp(72px, 8vw, 120px);
	padding-top: clamp(64px, 7vw, 100px);
	border-top: 1px solid var(--wp--custom--line--medium);
	counter-reset: pms-story;
}

.pms-story-wrap.pms-story-wrap > * {
	margin-block: 0;
}

.pms-story-wrap:not(:has(.pms-story)) {
	display: none;
}

/* "Andere projecten": bordered sectie met 64–100px bovenaan. */
.pms-section--related > .pms-section__body.pms-section__body {
	padding-top: clamp(64px, 7vw, 100px);
}

/* ───────────── Knoppen in dynamische blokken (zelfde look als core/button) ───────────── */

.pms-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	padding: 13px 22px;
	border: 1px solid var(--wp--preset--color--primary);
	border-radius: var(--wp--custom--radius--button);
	background: var(--wp--preset--color--primary);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	line-height: 1.4;
	color: var(--wp--preset--color--base);
	text-decoration: none;
	cursor: pointer;
	transition: background-color var(--wp--custom--transition--color), border-color var(--wp--custom--transition--color), color var(--wp--custom--transition--color);
}

.pms-btn:hover {
	border-color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

.pms-btn:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

.pms-btn--outline {
	border-color: color-mix(in srgb, var(--wp--preset--color--contrast) 25%, transparent);
	background: transparent;
	color: var(--wp--preset--color--contrast);
}

.pms-btn--outline:hover {
	border-color: var(--wp--preset--color--primary);
	background: transparent;
	color: var(--wp--preset--color--primary);
}

/* ───────────── Realisatie-archief ───────────── */

.pms-archive-hero {
	padding-top: var(--wp--custom--hero--padding-top);
}

.pms-section-head--archive {
	margin-bottom: clamp(40px, 5vw, 64px) !important;
}

.pms-section-head--archive h1 {
	max-width: 640px;
	font-size: var(--wp--custom--hero--h-1);
	text-wrap: balance;
}

.pms-section-head.pms-section-head--archive > p {
	max-width: 460px;
	font-size: var(--wp--custom--single--archive-lead);
	text-wrap: pretty;
}

/* SEO-tekst met links in de lopende tekst (archief). */
.pms-seo-inline.pms-seo-inline {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
	gap: 24px clamp(48px, 6vw, 100px);
}

.pms-seo-inline.pms-seo-inline > *,
.pms-seo-inline .pms-seo-inline__text > * {
	margin-block: 0;
}

.pms-seo-inline .pms-seo-inline__text {
	color: var(--wp--preset--color--muted);
	text-wrap: pretty;
}

.pms-seo-inline .pms-seo-inline__text > p + p {
	margin-top: 16px;
}

.pms-seo-inline a {
	border-bottom: 2px solid var(--wp--preset--color--accent);
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.pms-seo-inline a:hover {
	color: var(--wp--preset--color--primary);
}

/* ───────────── Single realisatie: lege secties verbergen ───────────── */

.pms-section--gallery:not(:has(.pms-rgallery)),
.pms-section--story:not(:has(.pms-story)),
.pms-section--quote:not(:has(.pms-quote)) {
	display: none;
}

/* ───────────── Contact: werkgebied ───────────── */

.pms-split.pms-split--area {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
	gap: clamp(48px, 6vw, 100px);
}

.pms-split--area .pms-split__text {
	max-width: 560px;
}

.pms-split.pms-split--area .pms-split__text > h2 {
	margin-bottom: 22px;
}

.pms-split.pms-split--area .pms-split__text > p {
	margin-bottom: 16px;
}

.pms-split.pms-split--area .pms-split__text > p:last-of-type {
	margin-bottom: 28px;
}

/* ───────── Goed om te weten (core/list in kolommen) ───────── */
.pms-pros {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr));
	gap: clamp(40px, 6vw, 100px);
}
.pms-pros > .pms-pros__col,
.pms-pros .pms-pros__col > * {
	margin-block: 0;
}
.pms-pros .pms-pros__title {
	padding-bottom: 14px;
	border-bottom: 2px solid var(--wp--preset--color--accent);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 600;
	color: var(--wp--preset--color--primary);
}
.pms-pros .pms-pros__title.is-muted {
	border-bottom-color: var(--wp--preset--color--arrow);
	color: inherit;
}

/* Lijst met vette titel + uitleg per item */
.wp-block-list.pms-checklist {
	list-style: none;
	margin: 0;
	padding: 0;
}
.wp-block-list.pms-checklist > li {
	margin: 0;
	padding: 18px 0;
	border-bottom: 1px solid var(--wp--custom--line--medium);
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--muted);
}
.wp-block-list.pms-checklist > li > strong {
	display: block;
	margin-bottom: 4px;
	font-size: var(--wp--preset--font-size--base);
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

/* Definitielijst als core/list: <strong>term</strong> waarde */
.wp-block-list.pms-deflist {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--wp--custom--line--medium);
}
.wp-block-list.pms-deflist > li {
	display: grid;
	grid-template-columns: 130px 1fr;
	gap: 16px;
	margin: 0;
	padding: 14px 0;
	border-bottom: 1px solid var(--wp--custom--line--medium);
	color: var(--wp--preset--color--muted);
}
.wp-block-list.pms-deflist > li > strong {
	font-weight: 700;
	color: var(--wp--preset--color--primary);
}

/* ───────── Tekstpagina (juridisch) ───────── */
.pms-text-page .pms-text-page__body > *,
.pms-text-page__body .cmplz-document > * {
	max-width: 760px;
}
.pms-text-page .pms-text-page__body {
	font-size: var(--wp--preset--font-size--medium);
	color: var(--wp--preset--color--muted);
}
.pms-text-page .pms-text-page__body > h1 {
	margin-bottom: clamp(32px, 4vw, 56px);
	color: var(--wp--preset--color--contrast);
}
.pms-text-page__body :is(h2, h3, h4) {
	margin: 2em 0 0.6em;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	line-height: 1.2;
	color: var(--wp--preset--color--contrast);
}
.pms-text-page__body h2 {
	font-size: var(--wp--preset--font-size--x-large);
}
.pms-text-page__body :is(h3, h4) {
	font-size: var(--wp--preset--font-size--large);
}
.pms-text-page__body a:not(.wp-element-button) {
	color: var(--wp--preset--color--primary);
}
.pms-text-page__body table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--x-small);
}
.pms-text-page__body :is(th, td) {
	padding: 10px 12px 10px 0;
	border-bottom: 1px solid var(--wp--custom--line--medium);
	text-align: left;
	vertical-align: top;
}
.pms-text-page__body .cmplz-document {
	max-width: none;
}

/* ───────── Tap targets ≥ 44px (§11) zonder de opmaak te wijzigen ─────────
   Een onzichtbare ::after vergroot de klikzone van kleine links tot minstens 44px hoog. */
.wp-block-button.is-style-link .wp-block-button__link,
.pms-link,
.pms-site-header .wp-block-button__link,
.pms-brand,
.pms-menu__link {
	position: relative;
}
.wp-block-button.is-style-link .wp-block-button__link::after,
.pms-link::after,
.pms-site-header .wp-block-button__link::after,
.pms-brand::after,
.pms-menu__link::after {
	content: "";
	position: absolute;
	inset: 50% -4px auto;
	min-height: 44px;
	height: 100%;
	transform: translateY(-50%);
}

/* Cookietabellen van Complianz: horizontaal scrollen in plaats van uitsteken. */
.pms-text-page__body .cmplz-document {
	overflow-x: auto;
	overflow-wrap: anywhere;
}

/* ───────── Mobiel: CTA-knoppen over de volle breedte (< 640px) ─────────
   Gevulde en outline-knoppen; tekstlinks (is-style-link) blijven inline. */
@media (max-width: 639px) {
	main .wp-block-buttons > .wp-block-button:not(.is-style-link),
	.pms-site-footer .wp-block-buttons > .wp-block-button:not(.is-style-link) {
		flex: 1 1 100%;
		width: 100%;
	}

	main .wp-block-buttons > .wp-block-button:not(.is-style-link) > .wp-block-button__link,
	.pms-site-footer .wp-block-buttons > .wp-block-button:not(.is-style-link) > .wp-block-button__link {
		display: flex;
		justify-content: center;
		box-sizing: border-box;
		width: 100%;
		text-align: center;
	}

	.pms-scta__actions .pms-btn,
	.pms-rhero__actions .pms-btn,
	.pms-form .pms-btn {
		flex: 1 1 100%;
		width: 100%;
	}
}

/* Geen blokafstand (blockGap 24px) tussen header, main en footer: de afstanden komen uit
   de hero (padding-top) en de secties (padding-bottom), zoals in het design. */
.wp-site-blocks > main,
.wp-site-blocks > footer {
	margin-block-start: 0;
}

/* Link of knop na een kerngegevens- of checklijst: wat lucht boven (anders plakt die tegen de laatste rij). */
.pms-split .pms-split__text > .wp-block-list + .wp-block-buttons,
.pms-section .wp-block-list.pms-deflist + .wp-block-buttons {
	margin-top: 28px;
}

/* ───────── Knoppen: kleurwissel geanimeerd + minieme opwaartse beweging (desktop met muis) ───────── */
.wp-block-button__link,
.pms-btn,
.pms-menu__btn {
	transition: background-color .25s ease, border-color .25s ease, color .25s ease, transform .2s ease;
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
	.wp-block-button:not(.is-style-link) > .wp-block-button__link:hover,
	.pms-btn:hover,
	.pms-menu__btn:hover {
		transform: translateY(-2px);
	}
}

/* Krappe desktop (1100–1399px): menu centreren tussen logo en knop i.p.v. op de pagina,
   zodat de ruimte links en rechts gelijk is. Vanaf 1400px exact in het midden (design). */
@media (min-width: 1100px) and (max-width: 1399px) {
	.pms-header__inner {
		grid-template-columns: auto minmax(0, 1fr) auto;
	}

	.pms-header__inner > .pms-menu--header-mega {
		justify-self: center;
	}
}

/* Footer mobiel: de twee menukolommen naast elkaar delen dezelfde rijen (subgrid), zodat items
   netjes naast elkaar staan, ook als er één over twee regels loopt. Max. kop + 5 items = 6 rijen;
   lege rijen zijn 0 hoog (ruimte zit in de padding van de items, niet in een row-gap). */
@media (max-width: 639px) {
	@supports (grid-template-rows: subgrid) {
		.pms-footer__columns {
			row-gap: 0;
		}

		.pms-footer__company {
			margin-bottom: 40px;
		}

		.pms-footer__columns > .pms-menu--footer-column {
			display: grid;
			grid-row: span 6;
			grid-template-rows: subgrid;
			row-gap: 0;
			align-content: start;
			margin-bottom: 32px;
		}

		.pms-footer__columns > .pms-menu--footer-column > .pms-menu__list {
			display: contents;
		}

		.pms-footer__columns > .pms-menu--footer-column .pms-menu__heading {
			margin-bottom: 8px;
		}

		.pms-footer__columns > .pms-menu--footer-column .pms-menu__list > li {
			padding-block: 5px;
		}
	}
}