/*
 * Gedeelde componenten voor de vaarpartners-archiefpagina's ([vm_vaarpartners_overzicht],
 * [vm_vaarpartners_hoofdcategorie], [vm_vaarpartners_subcategorie]).
 *
 * Bron: docs/design/vaarpartners/templates/ (FIN-*, SC2-*, HC-B-*, VP-filters-mobiel). Alleen
 * --vm-*-tokens; waarden zonder bestaande match staan in tokens.css.
 *
 * Breakpoints: mobiel < 600px, tablet 600-1023px, desktop >= 1024px. Er is geen los tablet-ontwerp:
 * tablet gebruikt de mobiele maten, met meer kolommen waar het ontwerp dat toelaat. Mobile-first:
 * de basisregels zijn de mobiele maten, `min-width: 1024px` zet de desktopmaten.
 *
 * Klasse-prefix `.vm-vpa-` (vaarpartners-archief), los van `.vm-vp__*` (het vaarpartner-profiel).
 * Elke shortcode zet `vm vm-vpa` op de buitenste wrapper. Selectors beginnen met `.vm-vpa` (en
 * `a.`/`h2.` waar het thema of de Elementor-kit een element-regel heeft) zodat ze winnen zonder
 * hoge specificiteit.
 */

/* -------------------------------------------------------------------------
 * Basis
 * ---------------------------------------------------------------------- */

.vm-vpa [hidden] {
	display: none !important;
}

.vm-vpa a,
.vm-vpa a:hover,
.vm-vpa a:focus,
.vm-vpa a:active {
	text-decoration: none;
}

.vm-vpa ol,
.vm-vpa ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.vm-vpa li {
	margin: 0;
}

/*
 * !important: het thema (Classima) laadt een globale regel ".elementor img { height: auto;
 * max-width: 100%; }" die door de extra klasse ".elementor" hogere specificiteit heeft dan een
 * enkele klasseselector hier, en zonder !important zou winnen (de foto krijgt dan zijn intrinsieke
 * hoogte in plaats van 100% van het vlak en de tekst eronder valt weg).
 */
.vm-vpa .vm-vpa-logo-img,
.vm-vpa .vm-vpa-foto-img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	object-fit: cover !important;
}

.vm-vpa .vm-vpa-logo-img {
	object-fit: contain !important;
}

/* Foto ontbreekt: zandvlak met bootsymbool (ontwerp FIN-componenten) */
.vm-vpa .vm-vpa-foto-leeg {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: var(--vm-zand);
	color: var(--vm-stippellijn);
}

.vm-vpa .vm-vpa-foto-leeg .vm-icoon {
	width: 56px;
	height: 56px;
	stroke-width: 1.4;
}

/* Logo ontbreekt: initialen van de bedrijfsnaam */
.vm-vpa .vm-vpa-initialen {
	font-family: var(--vm-font-kop);
	font-size: 18px;
	font-weight: 800;
	line-height: 1;
	color: var(--vm-blauw-700);
}

/* Zichtbaarheid per schermbreedte; !important omdat de kaartklassen zelf een display hebben */
.vm-vpa .vm-vpa-alleen-desktop {
	display: none !important;
}

.vm-vpa .vm-vpa-alleen-desktop-inline {
	display: none;
}

@media (min-width: 1024px) {
	.vm-vpa .vm-vpa-alleen-desktop {
		display: flex !important;
	}

	.vm-vpa .vm-vpa-alleen-desktop-inline {
		display: inline;
	}

	.vm-vpa .vm-vpa-alleen-mobiel {
		display: none !important;
	}

	.vm-vpa .vm-vpa-initialen {
		font-size: 22px;
	}
}

/* -------------------------------------------------------------------------
 * Intro-band: zandkleurig over de volle breedte, de inhoud in .vm-container (1250px)
 * ---------------------------------------------------------------------- */

.vm-vpa .vm-vpa-introband {
	background: var(--vm-zand);
	padding-block: 20px 22px;
}

.vm-vaarpartners-overzicht .vm-vpa-introband,
.vm-vaarpartners-hoofdcategorie .vm-vpa-introband {
	padding-block: 20px 28px;
}

.vm-vpa .vm-vpa-introband__binnen {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

/* Kruimelpad */
.vm-vpa .vm-vpa-kruimelpad {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.5;
}

.vm-vpa .vm-vpa-kruimelpad li {
	display: flex;
	align-items: center;
}

.vm.vm-vpa .vm-vpa-kruimelpad a,
.vm.vm-vpa .vm-vpa-kruimelpad a:hover {
	color: var(--vm-blauw-700);
}

.vm.vm-vpa .vm-vpa-kruimelpad a:hover {
	text-decoration: underline;
}

.vm-vpa .vm-vpa-kruimelpad span[aria-current] {
	color: var(--vm-grijs);
}

.vm-vpa .vm-vpa-kruimelpad__pijl {
	color: var(--vm-zwak);
}

/* Mobiel: alleen de laatste 2 niveaus (conform het ontwerp) */
.vm-vpa .vm-vpa-kruimelpad li.vm-vpa-kruimelpad__item--desktop {
	display: none;
}

/* Kop: H1 met eventuele teller */
.vm-vpa .vm-vpa-introband__kop {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.vm-vpa h1.vm-vpa-introband__titel {
	margin: 0;
	font-family: var(--vm-font-kop);
	font-size: var(--vm-h1-lijst);
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: normal;
	text-transform: none;
	color: var(--vm-blauw-700);
}

.vm-vpa .vm-vpa-badge {
	flex: none;
	display: inline-flex;
	align-items: center;
	height: 24px;
	padding: 0 9px;
	border-radius: var(--vm-r-pil);
	background: var(--vm-wit);
	color: var(--vm-blauw-700);
	font-size: var(--vm-label-klein);
	font-weight: 700;
	white-space: nowrap;
}

.vm-vpa .vm-vpa-badge__desktop {
	display: none;
}

.vm-vpa p.vm-vpa-introband__intro {
	margin: 0;
	font-size: var(--vm-tekst);
	line-height: 1.55;
	color: var(--vm-grijs);
}

/* Zoekresultaten: op mobiel heeft het ontwerp geen zichtbare H1 (wel voor schermlezers) */
.vm-vpa .vm-vpa-introband__kop--mobiel-verborgen {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

/* Zoekveld */
.vm-vpa .vm-vpa-zoek {
	display: flex;
	align-items: center;
	gap: 8px;
	height: 54px;
	padding: 0 5px 0 18px;
	border-radius: var(--vm-r-pil);
	background: var(--vm-wit);
	box-shadow: var(--vm-sch-1);
}

.vm-vpa .vm-vpa-zoek__invoer {
	all: unset;
	flex: 1 1 auto;
	min-width: 0;
	font-family: var(--vm-font-tekst);
	font-size: var(--vm-veld);
	color: var(--vm-inkt);
}

/*
 * Het thema geeft input[type="search"] een rand, achtergrond en schaduw met een hogere specificiteit
 * dan `all: unset` hierboven. Daarom expliciet en met extra specificiteit. De focus-indicatie staat
 * op de pil (:focus-within), niet op het veld zelf.
 */
.vm.vm-vpa .vm-vpa-zoek input[type="search"] {
	border: 0;
	outline: 0;
	box-shadow: none;
	background: transparent;
	-webkit-appearance: none;
	appearance: none;
	height: auto;
	margin: 0;
	padding: 0;
	font-family: var(--vm-font-tekst);
	font-size: var(--vm-veld);
	color: var(--vm-inkt);
}

.vm.vm-vpa .vm-vpa-zoek input[type="search"]::-webkit-search-decoration,
.vm.vm-vpa .vm-vpa-zoek input[type="search"]::-webkit-search-cancel-button {
	-webkit-appearance: none;
}

.vm.vm-vpa .vm-vpa-zoek:focus-within {
	outline: 2px solid var(--vm-blauw-700);
	outline-offset: 2px;
}

/* Hint in plaats van een placeholder: korter op mobiel (ontwerp), verdwijnt zodra er tekst staat */
.vm-vpa .vm-vpa-zoek {
	position: relative;
}

.vm-vpa .vm-vpa-zoek__hint {
	position: absolute;
	top: 50%;
	left: 18px;
	right: 130px;
	overflow: hidden;
	font-size: var(--vm-veld);
	color: var(--vm-grijs);
	text-overflow: ellipsis;
	white-space: nowrap;
	transform: translateY(-50%);
	pointer-events: none;
}

.vm-vpa .vm-vpa-zoek__hint::before {
	content: 'Bedrijfsnaam of plaats';
}

.vm-vpa .vm-vpa-zoek__invoer:not(:placeholder-shown) ~ .vm-vpa-zoek__hint {
	display: none;
}

.vm.vm-vpa a.vm-vpa-zoek__wis {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: var(--vm-r-pil);
	background: var(--vm-zand);
	color: var(--vm-grijs);
}

.vm-vpa button.vm-vpa-zoek__knop {
	flex: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 44px;
	padding: 0 18px;
	border: 0;
	border-radius: var(--vm-r-pil);
	background: var(--vm-knop);
	color: var(--vm-wit);
	font-family: var(--vm-font-tekst);
	font-size: var(--vm-tekst);
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
}

.vm-vpa button.vm-vpa-zoek__knop:hover {
	background: var(--vm-knop-hover);
}

/* Chip: gedeeld (zuster-subcategorieën en zoek-specialismen) */
.vm.vm-vpa a.vm-vpa-chip,
.vm.vm-vpa a.vm-vpa-chip:hover,
.vm.vm-vpa a.vm-vpa-chip:visited {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 36px;
	padding: 0 12px;
	border-radius: var(--vm-r-pil);
	background: var(--vm-wit);
	color: var(--vm-blauw-700);
	font-size: var(--vm-klein);
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
	transition: background-color .18s ease, box-shadow .18s ease;
}

.vm.vm-vpa a.vm-vpa-chip:hover {
	background: var(--vm-blauw-50);
	box-shadow: var(--vm-sch-chip-hover);
}

.vm-vpa .vm-vpa-chip__teller {
	color: var(--vm-grijs);
	font-weight: 500;
}

.vm.vm-vpa a.vm-vpa-chip--groot {
	height: 36px;
	padding: 0 14px;
	border: 1px solid var(--vm-lijn);
	font-size: var(--vm-tekst-klein);
}

.vm.vm-vpa a.vm-vpa-chip--alle {
	display: none;
	background: transparent;
	border: 1px solid var(--vm-stippellijn);
	font-weight: 700;
}

.vm.vm-vpa a.vm-vpa-chip--alle:hover {
	background: var(--vm-blauw-50);
}

/* Rij chips die op mobiel tot de schermrand scrollt (zie base.css) */
.vm-vpa .vm-vpa-zusters,
.vm-vpa .vm-vpa-specialismerij__chips {
	display: flex;
	gap: 8px;
	margin-inline: calc((100% - 100vw) / 2);
	padding-inline: calc((100vw - 100%) / 2);
	overflow-x: auto;
	scrollbar-width: none;
}

.vm-vpa .vm-vpa-zusters::-webkit-scrollbar,
.vm-vpa .vm-vpa-specialismerij__chips::-webkit-scrollbar {
	display: none;
}

/* -------------------------------------------------------------------------
 * Overzicht: categorietegels (desktop) en -rijen (mobiel/tablet)
 * ---------------------------------------------------------------------- */

.vm-vpa .vm-vpa-cats {
	display: flex;
	flex-direction: column;
	margin-top: 4px;
	padding: 0 14px;
	border-radius: var(--vm-r-m);
	background: var(--vm-wit);
	box-shadow: var(--vm-sch-1);
}

.vm-vpa .vm-vpa-cat {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-height: 72px;
	justify-content: center;
	padding: 10px 28px 10px 0;
	border-bottom: 1px solid var(--vm-lijn-zacht);
}

.vm-vpa a.vm-vpa-cat__kop {
	display: flex;
	align-items: center;
	gap: 8px;
	color: inherit;
}

/* De hele rij is klikbaar via de kopregel */
.vm-vpa a.vm-vpa-cat__kop::after {
	content: '';
	position: absolute;
	inset: 0;
}

.vm-vpa .vm-vpa-cat__naam {
	font-family: var(--vm-font-kop);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--vm-inkt-sterk);
}

.vm-vpa .vm-vpa-cat__aantal {
	display: inline-flex;
	align-items: center;
	height: 22px;
	padding: 0 8px;
	border-radius: var(--vm-r-pil);
	background: var(--vm-blauw-50);
	color: var(--vm-blauw-700);
	font-size: var(--vm-label-klein);
	font-weight: 700;
}

.vm-vpa .vm-vpa-cat__chevron {
	position: absolute;
	right: 0;
	top: 50%;
	display: flex;
	color: var(--vm-blauw-700);
	transform: translateY(-50%);
}

.vm-vpa .vm-vpa-cat__tekst {
	display: block;
	overflow: hidden;
	font-size: var(--vm-klein);
	color: var(--vm-grijs);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.vm-vpa .vm-vpa-cat__subs,
.vm-vpa a.vm-vpa-cat__alle {
	display: none;
}

/* -------------------------------------------------------------------------
 * Secties en titels
 * ---------------------------------------------------------------------- */

.vm-vpa > .vm-container {
	padding-bottom: var(--vm-s7);
}

.vm-vpa .vm-vpa-sectie {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding-top: 36px;
}

.vm-vaarpartners-subcategorie .vm-vpa-sectie--betaald {
	padding-top: 28px;
}

.vm-vaarpartners-subcategorie .vm-vpa-sectie--lijst {
	padding-top: 32px;
}

.vm-vpa .vm-vpa-sectie--zoek {
	padding-top: 28px;
}

.vm-vpa h2.vm-vpa-sectie__titel {
	margin: 0;
	font-family: var(--vm-font-kop);
	font-size: 20px;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: normal;
	text-transform: none;
	color: var(--vm-inkt-sterk);
}

.vm-vpa .vm-vpa-sectie__kop {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
}

.vm-vpa p.vm-vpa-sectie__tekst {
	margin: 0;
	font-size: var(--vm-tekst);
	line-height: 1.55;
	color: var(--vm-grijs);
}

.vm.vm-vpa a.vm-vpa-tekstlink,
.vm.vm-vpa a.vm-vpa-tekstlink:hover {
	font-size: var(--vm-tekst-klein);
	font-weight: 600;
	color: var(--vm-blauw-700);
}

.vm.vm-vpa a.vm-vpa-tekstlink:hover {
	text-decoration: underline;
}

.vm-vpa a.vm-vpa-tekstlink--desktop {
	display: none;
}

.vm-vpa p.vm-vpa-leegregel {
	margin: 4px 0 0;
	font-size: var(--vm-klein);
	line-height: 1.5;
	color: var(--vm-tekst-zwak);
}

.vm.vm-vpa .vm-vpa-leegregel a {
	font-weight: 600;
	color: var(--vm-blauw-700);
}

/* -------------------------------------------------------------------------
 * Partnerkaart (foto, logotegel, tekst) - mobiele maten
 * ---------------------------------------------------------------------- */

.vm-vpa .vm-vpa-kaarten {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.vm-vpa .vm-vpa-kaarten--sub {
	gap: 10px;
}

.vm-vpa a.vm-vpa-kaart {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: var(--vm-r-m);
	background: var(--vm-wit);
	box-shadow: var(--vm-sch-1);
	color: inherit;
}

.vm-vpa a.vm-vpa-kaart:hover {
	box-shadow: var(--vm-sch-2);
}

.vm-vpa .vm-vpa-kaart__beeld {
	position: relative;
	display: block;
}

.vm-vpa .vm-vpa-kaart__foto {
	display: block;
	height: 112px;
	background: var(--vm-placeholder-bg);
}

.vm-vpa .vm-vpa-kaart--sub .vm-vpa-kaart__foto {
	height: 108px;
}

.vm-vpa .vm-vpa-kaart__label {
	position: absolute;
	top: 12px;
	left: 12px;
	display: inline-flex;
	align-items: center;
	height: 24px;
	padding: 0 9px;
	border-radius: var(--vm-r-pil);
	background: var(--vm-wit);
	color: var(--vm-blauw-700);
	font-size: var(--vm-label-klein);
	font-weight: 700;
}

.vm-vpa .vm-vpa-kaart__label--desktop {
	display: none;
}

.vm-vpa .vm-vpa-kaart__logo {
	position: absolute;
	left: 10px;
	bottom: -22px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 88px;
	height: 44px;
	padding: 6px;
	border-radius: var(--vm-r-s);
	background: var(--vm-zand);
	box-shadow: var(--vm-sch-1);
}

.vm-vpa .vm-vpa-kaart--zonder-foto .vm-vpa-kaart__logo {
	background: var(--vm-wit);
}

.vm-vpa .vm-vpa-kaart__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 30px 12px 14px;
}

.vm-vpa .vm-vpa-kaart__tekst {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.vm-vpa strong.vm-vpa-kaart__naam {
	font-family: var(--vm-font-kop);
	font-size: 15px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--vm-inkt-sterk);
}

.vm-vpa .vm-vpa-kaart__meta {
	font-size: 12px;
	line-height: 1.35;
	color: var(--vm-grijs);
}

.vm-vpa .vm-vpa-kaart__bekijk {
	color: var(--vm-blauw-700);
	font-size: 13px;
	font-weight: 700;
}

.vm-vpa .vm-vpa-kaart__bekijk--desktop {
	display: none;
}

.vm-vpa .vm-vpa-kaart__bekijk--altijd {
	align-self: flex-end;
	margin-top: 6px;
}

/* Overzicht: op mobiel geen categoriepil en geen "Bekijk" (ontwerp FIN-overzicht-mobiel) */

/* Hoofdcategorie: "groot" (Uitgelicht-kaart), mobiele maten */
.vm-vpa .vm-vpa-kaarten--hoofd {
	grid-template-columns: minmax(0, 1fr);
}

.vm-vpa .vm-vpa-kaart--groot .vm-vpa-kaart__foto {
	height: 180px;
}

.vm-vpa .vm-vpa-kaart--groot .vm-vpa-kaart__logo {
	left: 16px;
	bottom: -30px;
	width: 120px;
	height: 60px;
	padding: 8px;
}

.vm-vpa .vm-vpa-kaart--groot .vm-vpa-kaart__body {
	flex-direction: row;
	align-items: flex-end;
	justify-content: space-between;
	gap: 10px;
	padding: 42px 16px 16px;
}

.vm-vpa .vm-vpa-kaart--groot strong.vm-vpa-kaart__naam {
	font-size: 18px;
}

.vm-vpa .vm-vpa-kaart--groot .vm-vpa-kaart__meta {
	font-size: var(--vm-klein);
	line-height: 1.5;
}

.vm-vpa .vm-vpa-kaart__bekijk--pijl {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: var(--vm-tekst-klein);
}

.vm-vpa .vm-vpa-kaart__bekijk--pijl .vm-icoon {
	width: 15px;
	height: 15px;
}

/* Vanaf tablet: meer kolommen, nog steeds met de mobiele maten */
@media (min-width: 600px) {
	.vm-vpa .vm-vpa-kaarten--overzicht,
	.vm-vpa .vm-vpa-kaarten--sub {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.vm-vpa .vm-vpa-kaarten--sub {
		gap: 12px;
	}

	.vm-vpa .vm-vpa-kaarten--hoofd {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vm-vpa .vm-vpa-kaarten--hoofd.vm-vpa-kaarten--vol {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* -------------------------------------------------------------------------
 * Hoofdkaart van de subcategorie (een willekeurige Pro)
 * ---------------------------------------------------------------------- */

.vm-vpa .vm-vpa-hoofdkaart {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: var(--vm-r-kaart-mobiel);
	background: var(--vm-wit);
	box-shadow: var(--vm-sch-2);
}

.vm-vpa .vm-vpa-hoofdkaart__beeld {
	position: relative;
}

.vm-vpa .vm-vpa-hoofdkaart__foto {
	display: block;
	height: 210px;
	background: var(--vm-placeholder-bg);
}

.vm-vpa .vm-vpa-hoofdkaart__label {
	position: absolute;
	top: 12px;
	left: 12px;
	display: inline-flex;
	align-items: center;
	height: 26px;
	padding: 0 10px;
	border-radius: var(--vm-r-pil);
	background: var(--vm-wit);
	color: var(--vm-blauw-700);
	font-size: 12px;
	font-weight: 700;
}

.vm-vpa .vm-vpa-hoofdkaart__logo {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--vm-zand);
}

.vm-vpa .vm-vpa-hoofdkaart__logo--foto {
	position: absolute;
	left: 16px;
	bottom: -32px;
	width: 128px;
	height: 64px;
	padding: 8px;
	border-radius: var(--vm-r-s);
	box-shadow: var(--vm-sch-1);
}

.vm-vpa .vm-vpa-hoofdkaart--zonder-foto .vm-vpa-hoofdkaart__logo--foto {
	background: var(--vm-wit);
}

.vm-vpa .vm-vpa-hoofdkaart__logo--inhoud {
	display: none;
}

.vm-vpa .vm-vpa-hoofdkaart__inhoud {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 44px 16px 16px;
}

.vm-vpa .vm-vpa-hoofdkaart__kop {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.vm-vpa h3.vm-vpa-hoofdkaart__naam {
	margin: 0;
	font-family: var(--vm-font-kop);
	font-size: 20px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--vm-inkt-sterk);
}

.vm.vm-vpa a.vm-vpa-hoofdkaart__link,
.vm.vm-vpa a.vm-vpa-hoofdkaart__link:hover {
	color: var(--vm-inkt-sterk);
}

/* De hele kaart is klikbaar via de titel (geen geneste links) */
.vm-vpa a.vm-vpa-hoofdkaart__link::after {
	content: '';
	position: absolute;
	inset: 0;
}

.vm-vpa a.vm-vpa-hoofdkaart__link:focus-visible {
	outline: none;
}

.vm-vpa .vm-vpa-hoofdkaart:has(.vm-vpa-hoofdkaart__link:focus-visible) {
	outline: 2px solid var(--vm-blauw-500);
	outline-offset: 2px;
}

.vm-vpa .vm-vpa-hoofdkaart__meta {
	font-size: var(--vm-tekst-klein);
	color: var(--vm-grijs);
}

.vm-vpa p.vm-vpa-hoofdkaart__tekst {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	font-size: var(--vm-tekst-klein);
	line-height: 1.5;
	color: var(--vm-grijs);
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.vm-vpa .vm-vpa-hoofdkaart__knoppen {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 2px;
}

.vm.vm-vpa a.vm-vpa-hoofdkaart__website,
.vm.vm-vpa a.vm-vpa-hoofdkaart__website:hover,
.vm.vm-vpa a.vm-vpa-hoofdkaart__website:visited {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 44px;
	padding: 0 18px;
	border-radius: var(--vm-r-s);
	background: var(--vm-knop);
	color: var(--vm-wit);
	font-size: var(--vm-tekst);
	font-weight: 700;
}

.vm.vm-vpa a.vm-vpa-hoofdkaart__website:hover {
	background: var(--vm-knop-hover);
}

.vm-vpa .vm-vpa-hoofdkaart__website .vm-icoon {
	width: 16px;
	height: 16px;
}

.vm-vpa .vm-vpa-hoofdkaart__profiel {
	font-size: var(--vm-tekst-klein);
	font-weight: 700;
	color: var(--vm-blauw-700);
}

/* -------------------------------------------------------------------------
 * Logorijen: horizontale kaart met logotegel links
 * ---------------------------------------------------------------------- */

.vm-vpa .vm-vpa-logorijen {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 12px;
}

.vm-vpa .vm-vpa-logorijen--overzicht {
	gap: 10px;
}

/* Pro-rijen van het overzicht: geen eigen box, de rijen staan direct in het grid */
.vm-vpa .vm-vpa-prorijen {
	display: contents;
}

.vm-vpa a.vm-vpa-logorij {
	display: flex;
	align-items: center;
	height: 64px;
	overflow: hidden;
	border-radius: var(--vm-r-m);
	background: var(--vm-wit);
	box-shadow: var(--vm-sch-1);
	color: inherit;
}

.vm-vpa a.vm-vpa-logorij:hover {
	box-shadow: var(--vm-sch-2);
}

.vm-vpa .vm-vpa-logorij__logo {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 96px;
	height: 100%;
	padding: 8px;
	background: var(--vm-zand);
}

.vm-vpa .vm-vpa-logorij__tekst {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	padding: 10px 14px;
}

.vm-vpa .vm-vpa-logorij__naam {
	display: -webkit-box;
	overflow: hidden;
	font-size: var(--vm-tekst);
	font-weight: 700;
	line-height: 1.3;
	color: var(--vm-inkt-sterk);
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.vm-vpa .vm-vpa-logorij__meta {
	font-size: 12px;
	color: var(--vm-grijs);
}

.vm-vpa a.vm-vpa-logorij--hoofd {
	height: 76px;
}

.vm-vpa .vm-vpa-logorij--hoofd .vm-vpa-logorij__logo {
	width: 104px;
	padding: 8px 10px;
}

.vm-vpa .vm-vpa-logorij--hoofd .vm-vpa-logorij__tekst {
	padding: 12px 16px;
}

.vm-vpa .vm-vpa-logorij--hoofd .vm-vpa-logorij__meta {
	font-size: var(--vm-klein);
}

/* Gestippelde tegel "Jouw bedrijf hier?" */
.vm.vm-vpa a.vm-vpa-upsell,
.vm.vm-vpa a.vm-vpa-upsell:hover {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 64px;
	padding: 12px 16px;
	border: 1.5px dashed var(--vm-stippellijn);
	border-radius: var(--vm-r-m);
	color: inherit;
}

.vm.vm-vpa a.vm-vpa-upsell:hover {
	background: var(--vm-wit);
}

.vm-vpa .vm-vpa-upsell__titel {
	font-size: var(--vm-tekst);
	font-weight: 700;
	color: var(--vm-inkt-sterk);
}

.vm-vpa .vm-vpa-upsell__link {
	font-size: var(--vm-tekst-klein);
	font-weight: 600;
	white-space: nowrap;
	color: var(--vm-blauw-700);
}

/* Subcategorie op mobiel: één gecentreerde regel */
.vm.vm-vpa a.vm-vpa-upsell--sub,
.vm.vm-vpa a.vm-vpa-upsell--sub:hover {
	justify-content: center;
	flex-wrap: wrap;
	gap: 0 4px;
	min-height: 48px;
	padding: 0 12px;
	border-radius: var(--vm-r-tegel);
	text-align: center;
}

.vm-vpa .vm-vpa-upsell--sub .vm-vpa-upsell__titel {
	font-size: var(--vm-tekst-klein);
	font-weight: 600;
	color: var(--vm-blauw-700);
}

@media (min-width: 600px) {
	.vm-vpa .vm-vpa-logorijen {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* -------------------------------------------------------------------------
 * Hoofdcategorie: specialisme-tegels in de intro-band
 * ---------------------------------------------------------------------- */

.vm-vpa .vm-vpa-specialismes {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
	margin-top: 8px;
}

.vm-vpa a.vm-vpa-specialisme {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-height: 72px;
	padding: 10px 12px 10px 14px;
	border-radius: var(--vm-r-tegel);
	background: var(--vm-wit);
	box-shadow: var(--vm-sch-1);
	color: inherit;
}

.vm-vpa a.vm-vpa-specialisme:hover {
	box-shadow: var(--vm-sch-2);
}

.vm-vpa .vm-vpa-specialisme__tekst {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.vm-vpa .vm-vpa-specialisme__naam {
	font-family: var(--vm-font-kop);
	font-size: 15px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--vm-inkt-sterk);
}

.vm-vpa .vm-vpa-specialisme__aantal {
	font-size: 12px;
	color: var(--vm-grijs);
}

.vm-vpa .vm-vpa-specialisme__pijl {
	flex: none;
	font-size: 16px;
	color: var(--vm-blauw-700);
}

@media (min-width: 600px) {
	.vm-vpa .vm-vpa-specialismes {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* -------------------------------------------------------------------------
 * Bedrijvenlijst (gratis partners en zoekresultaten)
 * ---------------------------------------------------------------------- */

.vm-vpa .vm-vpa-lijst {
	display: flex;
	flex-direction: column;
	padding: 0 14px;
	border-radius: var(--vm-r-m);
	background: var(--vm-wit);
	box-shadow: var(--vm-sch-1);
}

.vm-vpa a.vm-vpa-bedrijf {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	min-height: 60px;
	padding: 8px 0;
	border-bottom: 1px solid var(--vm-lijn-zacht);
	color: inherit;
}

.vm-vpa a.vm-vpa-bedrijf:hover .vm-vpa-bedrijf__naam {
	color: var(--vm-blauw-700);
}

.vm-vpa .vm-vpa-bedrijf__tekst {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.vm-vpa .vm-vpa-bedrijf__rij {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

.vm-vpa .vm-vpa-bedrijf__naam {
	font-size: var(--vm-tekst);
	font-weight: 600;
	line-height: 1.3;
	color: var(--vm-inkt);
}

.vm-vpa .vm-vpa-bedrijf__badge {
	display: inline-flex;
	align-items: center;
	height: 20px;
	padding: 0 7px;
	border-radius: var(--vm-r-pil);
	background: var(--vm-blauw-50);
	color: var(--vm-blauw-700);
	font-size: 10px;
	font-weight: 700;
}

.vm-vpa .vm-vpa-bedrijf__meta {
	font-size: var(--vm-klein);
	color: var(--vm-grijs);
}

.vm-vpa .vm-vpa-bedrijf__chevron,
.vm-vpa .vm-vpa-catrij__chevron {
	flex: none;
	display: flex;
	color: var(--vm-blauw-700);
}

/* Categorierijen bij "geen zoekresultaten" */
.vm-vpa a.vm-vpa-catrij {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	min-height: 52px;
	border-bottom: 1px solid var(--vm-lijn-zacht);
	color: inherit;
}

.vm-vpa .vm-vpa-catrij__naam {
	font-size: var(--vm-tekst);
	font-weight: 700;
	color: var(--vm-inkt-sterk);
}

.vm-vpa .vm-vpa-catrij__aantal {
	font-size: var(--vm-tekst);
	font-weight: 500;
	color: var(--vm-grijs);
}

.vm-vpa .vm-vpa-lijst--categorieen {
	margin-top: 8px;
}

/* -------------------------------------------------------------------------
 * Paginering
 * ---------------------------------------------------------------------- */

.vm-vpa .vm-vpa-paginering {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.vm-vpa .vm-vpa-paginering__tekst {
	font-size: var(--vm-klein);
	color: var(--vm-grijs);
}

.vm-vpa .vm-vpa-paginering__knoppen {
	display: flex;
	gap: 8px;
}

.vm.vm-vpa a.vm-vpa-paginering__knop,
.vm.vm-vpa a.vm-vpa-paginering__knop:hover {
	display: flex;
	align-items: center;
	height: 44px;
	padding: 0 16px;
	border: 1px solid var(--vm-lijn);
	border-radius: var(--vm-r-s);
	background: var(--vm-wit);
	color: var(--vm-blauw-700);
	font-size: var(--vm-tekst-klein);
	font-weight: 600;
}

.vm.vm-vpa a.vm-vpa-paginering__knop:hover {
	background: var(--vm-blauw-50);
}

/* -------------------------------------------------------------------------
 * Filters (subcategorie): knop + bottom sheet op mobiel/tablet, dropdowns op desktop
 * ---------------------------------------------------------------------- */

.vm-vpa .vm-vpa-lijstkop {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.vm-vpa .vm-vpa-lijstkop__aantal {
	font-size: var(--vm-tekst-klein);
	color: var(--vm-grijs);
}

.vm-vpa .vm-vpa-lijstkop__aantal strong {
	color: var(--vm-inkt);
}

.vm.vm-vpa a.vm-vpa-filterknop,
.vm.vm-vpa a.vm-vpa-filterknop:hover {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 44px;
	padding: 0 16px;
	border: 1px solid var(--vm-lijn);
	border-radius: var(--vm-r-s);
	background: var(--vm-wit);
	color: var(--vm-inkt);
	font-size: var(--vm-tekst-klein);
	font-weight: 600;
}

.vm-vpa .vm-vpa-filterknop .vm-icoon {
	color: var(--vm-grijs);
}

/* Bottom sheet: onzichtbaar tot #vm-vpa-filters het doel is */
.vm-vpa form.vm-vpa-filters {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: none;
	flex-direction: column;
	justify-content: flex-end;
	margin: 0;
	padding-top: 72px;
}

.vm-vpa form.vm-vpa-filters:target {
	display: flex;
}

body:has(.vm-vpa-filters:target) {
	overflow: hidden;
}

.vm-vpa a.vm-vpa-filters__scrim {
	position: absolute;
	inset: 0;
	background: var(--vm-scrim);
}

.vm-vpa .vm-vpa-filters__blad {
	position: relative;
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	min-height: 0;
	overflow: hidden;
	border-radius: var(--vm-r-l) var(--vm-r-l) 0 0;
	background: var(--vm-creme);
}

.vm-vpa .vm-vpa-filters__kop {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px;
	border-bottom: 1px solid var(--vm-lijn);
}

.vm-vpa h2.vm-vpa-filters__titel {
	margin: 0;
	font-family: var(--vm-font-kop);
	font-size: 19px;
	font-weight: 800;
	color: var(--vm-inkt-sterk);
}

.vm.vm-vpa a.vm-vpa-filters__sluiten {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: -8px -12px -8px 0;
	color: var(--vm-inkt);
}

.vm-vpa .vm-vpa-filters__groepen {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 20px;
	padding: 16px;
	overflow-y: auto;
}

.vm-vpa .vm-vpa-filters__voet {
	display: flex;
	gap: 10px;
	padding: 12px 16px 20px;
	border-top: 1px solid var(--vm-lijn);
	background: var(--vm-wit);
}

.vm.vm-vpa a.vm-vpa-filters__wis {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	padding: 0 16px;
	color: var(--vm-blauw-700);
	font-size: var(--vm-tekst);
	font-weight: 600;
}

.vm-vpa button.vm-vpa-knop-toon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	padding: 0 22px;
	border: 0;
	border-radius: var(--vm-r-s);
	background: var(--vm-knop);
	color: var(--vm-wit);
	font-family: var(--vm-font-tekst);
	font-size: var(--vm-veld);
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
}

.vm-vpa button.vm-vpa-knop-toon:hover {
	background: var(--vm-knop-hover);
}

.vm-vpa button.vm-vpa-knop-toon--breed {
	flex: 1 1 auto;
}

/* Filtergroep (mobiel: kop + opties onder elkaar; Plaats als uitklapknop) */
.vm-vpa .vm-vpa-dd {
	display: flex;
	flex-direction: column;
}

.vm-vpa .vm-vpa-dd__kop {
	margin-bottom: 4px;
	font-size: var(--vm-klein);
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: var(--vm-grijs);
}

.vm-vpa .vm-vpa-dd--plaats .vm-vpa-dd__kop {
	margin-bottom: 8px;
}

.vm-vpa .vm-vpa-dd__knop {
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	width: 100%;
	height: 44px;
	padding: 0 14px 0 16px;
	border: 1px solid var(--vm-lijn);
	border-radius: var(--vm-r-s);
	background: var(--vm-wit);
	color: var(--vm-inkt);
	font-size: var(--vm-tekst-klein);
	font-weight: 500;
	cursor: pointer;
}

.vm-vpa .vm-vpa-dd__knop--sheet {
	display: flex;
}

.vm-vpa .vm-vpa-dd__knop .vm-icoon {
	color: var(--vm-grijs);
}

.vm-vpa .vm-vpa-dd__tekst--desktop {
	display: none;
}

.vm-vpa .vm-vpa-dd__schakel:focus-visible ~ .vm-vpa-dd__knop {
	outline: 2px solid var(--vm-blauw-500);
	outline-offset: 2px;
}

/* Plaats-opties klappen op mobiel uit onder de knop; Merk en Lid van staan open */
.vm-vpa .vm-vpa-dd--plaats .vm-vpa-dd__paneel {
	display: none;
	margin-top: 4px;
}

.vm-vpa .vm-vpa-dd--plaats .vm-vpa-dd__schakel:checked ~ .vm-vpa-dd__paneel {
	display: block;
}

.vm-vpa .vm-vpa-dd--plaats .vm-vpa-dd__opties {
	max-height: 240px;
	overflow-y: auto;
}

.vm-vpa .vm-vpa-dd__voet {
	display: none;
}

/* Optie (checkbox) */
.vm-vpa label.vm-vpa-optie {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 48px;
	border-bottom: 1px solid var(--vm-lijn);
	cursor: pointer;
}

.vm-vpa .vm-vpa-optie__vink {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border: 1.5px solid var(--vm-rand-zwak);
	border-radius: var(--vm-r-xs);
	background: var(--vm-wit);
	color: var(--vm-wit);
}

.vm-vpa .vm-vpa-optie__vink .vm-icoon {
	opacity: 0;
	stroke-width: 2.4;
}

.vm-vpa .vm-vpa-optie__veld:checked ~ .vm-vpa-optie__vink {
	border-color: var(--vm-blauw-700);
	background: var(--vm-blauw-700);
}

.vm-vpa .vm-vpa-optie__veld:checked ~ .vm-vpa-optie__vink .vm-icoon {
	opacity: 1;
}

.vm-vpa .vm-vpa-optie__veld:focus-visible ~ .vm-vpa-optie__vink {
	outline: 2px solid var(--vm-blauw-500);
	outline-offset: 2px;
}

.vm-vpa .vm-vpa-optie__tekst {
	flex: 1 1 auto;
	font-size: var(--vm-tekst);
	color: var(--vm-inkt);
}

.vm-vpa .vm-vpa-optie__aantal {
	font-size: var(--vm-klein);
	color: var(--vm-grijs);
}

/* Actieve filters */
.vm-vpa .vm-vpa-actief {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.vm-vpa .vm-vpa-actief__label {
	font-size: var(--vm-klein);
	color: var(--vm-grijs);
}

.vm.vm-vpa a.vm-vpa-filterchip,
.vm.vm-vpa a.vm-vpa-filterchip:hover {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 32px;
	padding: 0 8px 0 12px;
	border-radius: var(--vm-r-pil);
	background: var(--vm-blauw-700);
	color: var(--vm-wit);
	font-size: var(--vm-klein);
	font-weight: 600;
}

.vm-vpa .vm-vpa-filterchip__x {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border-radius: var(--vm-r-pil);
	background: var(--vm-wit-zacht);
}

.vm.vm-vpa a.vm-vpa-actief__wis {
	font-size: var(--vm-klein);
	font-weight: 600;
	color: var(--vm-blauw-700);
}

/* -------------------------------------------------------------------------
 * Zoekresultaten
 * ---------------------------------------------------------------------- */

.vm-vpa h2.vm-vpa-sectie__titel--zoek {
	line-height: 1.25;
}

.vm-vpa .vm-vpa-specialismerij {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.vm-vpa .vm-vpa-specialismerij__label {
	font-size: var(--vm-klein);
	color: var(--vm-grijs);
}

/* -------------------------------------------------------------------------
 * Onderste blok van het overzicht: uitleg en veelgestelde vragen
 * ---------------------------------------------------------------------- */

.vm-vpa .vm-vpa-seo {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 40px;
	padding-top: 32px;
	border-top: 1px solid var(--vm-lijn);
}

.vm-vpa .vm-vpa-seo__tekst {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.vm-vpa h2.vm-vpa-seo__titel {
	margin: 0;
	font-family: var(--vm-font-kop);
	font-size: 20px;
	font-weight: 800;
	line-height: 1.25;
	color: var(--vm-blauw-700);
}

.vm-vpa .vm-vpa-seo p {
	font-size: var(--vm-tekst);
	line-height: 1.65;
	color: var(--vm-grijs);
}

.vm-vpa .vm-vpa-faq {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.vm-vpa .vm-vpa-faq .vm-vpa-seo__titel {
	margin: 20px 0 4px;
}

.vm-vpa .vm-vpa-faq__item {
	border-bottom: 1px solid var(--vm-lijn);
}

.vm-vpa summary.vm-vpa-faq__vraag {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 52px;
	font-size: var(--vm-tekst);
	font-weight: 600;
	color: var(--vm-inkt);
	cursor: pointer;
	list-style: none;
}

.vm-vpa summary.vm-vpa-faq__vraag::-webkit-details-marker {
	display: none;
}

.vm-vpa summary.vm-vpa-faq__vraag::after {
	content: '+';
	flex: none;
	color: var(--vm-blauw-700);
}

.vm-vpa details[open] > summary.vm-vpa-faq__vraag::after {
	content: '\2212';
}

.vm-vpa .vm-vpa-faq__antwoord {
	padding: 0 0 16px;
	font-size: var(--vm-tekst);
	line-height: 1.6;
	color: var(--vm-grijs);
}

/* ========================================================================
 * Tablet en desktop
 * ===================================================================== */

@media (min-width: 1024px) {
	.vm-vpa > .vm-container {
		padding-bottom: var(--vm-s8);
	}

	/* Intro-band */
	.vm-vpa .vm-vpa-introband {
		padding-block: 32px 36px;
	}

	.vm-vaarpartners-overzicht .vm-vpa-introband,
	.vm-vaarpartners-hoofdcategorie .vm-vpa-introband {
		padding-block: 32px 40px;
	}

	.vm-vpa .vm-vpa-introband__binnen {
		gap: 16px;
	}

	.vm-vaarpartners-subcategorie .vm-vpa-introband__binnen {
		gap: 14px;
	}

	.vm-vpa .vm-vpa-kruimelpad {
		gap: 8px;
		font-size: var(--vm-klein);
	}

	.vm-vpa .vm-vpa-kruimelpad li.vm-vpa-kruimelpad__item--desktop {
		display: flex;
	}

	.vm-vpa .vm-vpa-introband__kop {
		justify-content: flex-start;
		gap: 14px;
	}

	.vm-vpa .vm-vpa-introband__kop--mobiel-verborgen {
		position: static;
		width: auto;
		height: auto;
		margin: 0;
		overflow: visible;
		clip: auto;
	}

	.vm-vpa .vm-vpa-badge {
		height: 28px;
		padding: 0 12px;
		font-size: var(--vm-klein);
	}

	.vm-vpa .vm-vpa-badge__desktop {
		display: inline;
	}

	.vm-vpa .vm-vpa-badge__mobiel {
		display: none;
	}

	.vm-vpa p.vm-vpa-introband__intro {
		max-width: 820px;
		font-size: var(--vm-tekst-groot);
	}

	.vm-vaarpartners-overzicht .vm-vpa-introband__intro {
		max-width: 760px;
	}

	/* Zoekveld */
	.vm-vpa .vm-vpa-zoek {
		gap: 12px;
		max-width: 760px;
		height: 60px;
		padding: 0 6px 0 22px;
	}

	.vm-vpa .vm-vpa-zoek__hint {
		left: 22px;
		right: 170px;
	}

	.vm-vpa .vm-vpa-zoek__hint::before {
		content: 'Zoek op bedrijfsnaam of plaats';
	}

	.vm.vm-vpa a.vm-vpa-zoek__wis {
		width: 32px;
		height: 32px;
	}

	.vm-vpa button.vm-vpa-zoek__knop {
		height: 48px;
		padding: 0 28px;
		font-size: var(--vm-veld);
	}

	/* Chips: één wrap-rij */
	.vm-vpa .vm-vpa-zusters {
		flex-wrap: wrap;
		margin: 4px 0 0;
		padding: 0;
		overflow: visible;
	}

	.vm.vm-vpa a.vm-vpa-chip {
		height: 32px;
	}

	.vm.vm-vpa a.vm-vpa-chip--groot {
		height: 36px;
	}

	.vm.vm-vpa a.vm-vpa-chip--alle {
		display: inline-flex;
	}

	/* Categorietegels van het overzicht */
	.vm-vpa .vm-vpa-cats {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 12px;
		margin-top: 8px;
		padding: 0;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
	}

	.vm-vpa .vm-vpa-cat {
		gap: 10px;
		min-height: 0;
		justify-content: flex-start;
		padding: 18px 20px;
		border: 0;
		border-radius: var(--vm-r-m);
		background: var(--vm-wit);
		box-shadow: var(--vm-sch-1);
	}

	.vm-vpa a.vm-vpa-cat__kop {
		justify-content: space-between;
	}

	.vm-vpa a.vm-vpa-cat__kop::after {
		display: none;
	}

	.vm-vpa .vm-vpa-cat__naam {
		font-size: 18px;
	}

	.vm-vpa .vm-vpa-cat__aantal {
		height: 24px;
		padding: 0 9px;
		font-size: 12px;
	}

	.vm-vpa .vm-vpa-cat__chevron,
	.vm-vpa .vm-vpa-cat__tekst {
		display: none;
	}

	.vm-vpa .vm-vpa-cat__subs {
		display: flex;
		flex-wrap: wrap;
		gap: 4px 12px;
	}

	.vm.vm-vpa .vm-vpa-cat__subs a {
		font-size: var(--vm-tekst-klein);
		color: var(--vm-blauw-700);
	}

	.vm.vm-vpa .vm-vpa-cat__subs a:hover {
		text-decoration: underline;
	}

	.vm.vm-vpa a.vm-vpa-cat__alle,
	.vm.vm-vpa a.vm-vpa-cat__alle:hover {
		display: block;
		font-size: var(--vm-tekst-klein);
		font-weight: 700;
		color: var(--vm-blauw-700);
	}

	/* Secties */
	.vm-vpa .vm-vpa-sectie {
		gap: 16px;
		padding-top: 48px;
	}

	.vm-vaarpartners-subcategorie .vm-vpa-sectie--betaald {
		padding-top: 44px;
	}

	.vm-vaarpartners-subcategorie .vm-vpa-sectie--lijst {
		padding-top: 48px;
		gap: 14px;
	}

	.vm-vpa .vm-vpa-sectie--zoek {
		padding-top: 36px;
		gap: 14px;
	}

	.vm-vpa h2.vm-vpa-sectie__titel {
		font-size: 24px;
	}

	.vm-vaarpartners-hoofdcategorie h2.vm-vpa-sectie__titel,
	.vm-vpa .vm-vpa-sectie--ook h2.vm-vpa-sectie__titel {
		font-size: 22px;
	}

	.vm-vpa p.vm-vpa-sectie__tekst {
		font-size: var(--vm-tekst);
	}

	.vm-vpa a.vm-vpa-tekstlink--desktop {
		display: inline;
	}

	.vm-vpa a.vm-vpa-tekstlink--mobiel {
		display: none;
	}

	/* Partnerkaart: desktopmaten */
	.vm-vpa .vm-vpa-kaarten--overzicht {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 16px;
	}

	.vm-vpa .vm-vpa-kaarten--sub {
		gap: 16px;
	}

	.vm-vpa .vm-vpa-kaarten--hoofd {
		gap: 16px;
	}

	.vm-vpa .vm-vpa-kaart__foto,
	.vm-vpa .vm-vpa-kaart--sub .vm-vpa-kaart__foto {
		height: 170px;
	}

	.vm-vpa .vm-vpa-kaart__label--desktop {
		display: inline-flex;
	}

	.vm-vpa .vm-vpa-kaart__logo {
		left: 16px;
		bottom: -30px;
		width: 120px;
		height: 60px;
		padding: 8px;
	}

	.vm-vpa .vm-vpa-kaart__body {
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
		gap: 10px;
		padding: 42px 16px 16px;
	}

	.vm-vpa strong.vm-vpa-kaart__naam {
		font-size: 17px;
	}

	.vm-vpa .vm-vpa-kaart__meta {
		font-size: var(--vm-klein);
		line-height: 1.5;
	}

	.vm-vpa .vm-vpa-kaart__bekijk {
		flex: none;
		font-size: var(--vm-tekst-klein);
	}

	.vm-vpa .vm-vpa-kaart__bekijk--desktop {
		display: inline;
	}

	.vm-vpa .vm-vpa-kaart__bekijk--altijd {
		align-self: auto;
		margin-top: 0;
	}

	/* Hoofdcategorie: Uitgelicht-kaart, desktopmaten (niet bij 5+ Pro's: die blijven compact) */
	.vm-vpa .vm-vpa-kaarten--hoofd.vm-vpa-kaarten--compact {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.vm-vpa .vm-vpa-kaarten--hoofd:not(.vm-vpa-kaarten--compact) .vm-vpa-kaart--groot .vm-vpa-kaart__foto {
		height: 220px;
	}

	.vm-vpa .vm-vpa-kaarten--vol .vm-vpa-kaart--groot .vm-vpa-kaart__foto {
		height: 300px;
	}

	.vm-vpa .vm-vpa-kaarten--hoofd:not(.vm-vpa-kaarten--compact) .vm-vpa-kaart--groot .vm-vpa-kaart__label {
		top: 14px;
		left: 14px;
		height: 26px;
		padding: 0 10px;
		font-size: 12px;
	}

	.vm-vpa .vm-vpa-kaarten--hoofd:not(.vm-vpa-kaarten--compact) .vm-vpa-kaart--groot .vm-vpa-kaart__logo {
		left: 20px;
		bottom: -38px;
		width: 150px;
		height: 76px;
		padding: 10px;
	}

	.vm-vpa .vm-vpa-kaarten--hoofd:not(.vm-vpa-kaarten--compact) .vm-vpa-kaart--groot .vm-vpa-kaart__body {
		padding: 52px 20px 18px;
	}

	.vm-vpa .vm-vpa-kaarten--hoofd:not(.vm-vpa-kaarten--compact) .vm-vpa-kaart--groot strong.vm-vpa-kaart__naam {
		font-size: 20px;
	}

	.vm-vpa .vm-vpa-kaarten--hoofd:not(.vm-vpa-kaarten--compact) .vm-vpa-kaart--groot .vm-vpa-kaart__meta {
		font-size: var(--vm-tekst-klein);
	}

	/* Hoofdkaart van de subcategorie */
	.vm-vpa .vm-vpa-hoofdkaart {
		display: grid;
		grid-template-columns: 560px minmax(0, 1fr);
		border-radius: var(--vm-r-l);
	}

	.vm-vpa .vm-vpa-hoofdkaart__foto {
		height: 340px;
	}

	.vm-vpa .vm-vpa-hoofdkaart__label {
		top: 16px;
		left: 16px;
		height: 28px;
		padding: 0 12px;
	}

	.vm-vpa .vm-vpa-hoofdkaart__logo--foto {
		display: none;
	}

	.vm-vpa .vm-vpa-hoofdkaart__logo--inhoud {
		display: flex;
		width: 176px;
		height: 88px;
		padding: 12px;
		border-radius: var(--vm-r-tegel);
	}

	.vm-vpa .vm-vpa-hoofdkaart__inhoud {
		gap: 12px;
		padding: 32px 36px;
	}

	.vm-vpa .vm-vpa-hoofdkaart__kop {
		gap: 4px;
	}

	.vm-vpa h3.vm-vpa-hoofdkaart__naam {
		font-size: 28px;
		line-height: 1.2;
	}

	.vm-vpa .vm-vpa-hoofdkaart__meta,
	.vm-vpa p.vm-vpa-hoofdkaart__tekst {
		font-size: var(--vm-tekst);
	}

	.vm-vpa .vm-vpa-hoofdkaart__knoppen {
		justify-content: flex-start;
		margin-top: auto;
	}

	.vm.vm-vpa a.vm-vpa-hoofdkaart__website {
		padding: 0 20px;
	}

	.vm-vpa .vm-vpa-hoofdkaart__profiel {
		font-size: var(--vm-tekst);
	}

	/* Logorijen */
	.vm-vpa .vm-vpa-logorijen--overzicht {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 12px;
	}

	.vm-vpa .vm-vpa-logorijen--sub,
	.vm-vpa .vm-vpa-logorijen--hoofd {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.vm-vpa a.vm-vpa-logorij {
		height: 76px;
	}

	.vm-vpa .vm-vpa-logorijen--sub .vm-vpa-logorij__logo {
		width: 110px;
	}

	.vm-vpa .vm-vpa-logorijen--sub .vm-vpa-logorij__tekst {
		padding: 10px 16px;
	}

	.vm-vpa .vm-vpa-logorijen--sub .vm-vpa-logorij__naam {
		font-size: var(--vm-veld);
	}

	.vm-vpa .vm-vpa-logorijen--sub .vm-vpa-logorij__meta {
		font-size: var(--vm-klein);
	}

	.vm-vpa a.vm-vpa-logorij--hoofd {
		height: 88px;
	}

	.vm-vpa .vm-vpa-logorij--hoofd .vm-vpa-logorij__logo {
		width: 128px;
		padding: 10px;
	}

	.vm-vpa .vm-vpa-logorij--hoofd .vm-vpa-logorij__naam {
		font-size: var(--vm-veld);
	}

	.vm.vm-vpa a.vm-vpa-upsell,
	.vm.vm-vpa a.vm-vpa-upsell:hover {
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
		gap: 2px;
		min-height: 76px;
		padding: 10px 16px;
	}

	.vm.vm-vpa a.vm-vpa-upsell--hoofd,
	.vm.vm-vpa a.vm-vpa-upsell--hoofd:hover {
		min-height: 88px;
		padding: 12px 18px;
	}

	.vm.vm-vpa a.vm-vpa-upsell--sub,
	.vm.vm-vpa a.vm-vpa-upsell--sub:hover {
		flex-wrap: nowrap;
		text-align: left;
		border-radius: var(--vm-r-m);
	}

	.vm-vpa .vm-vpa-upsell--sub .vm-vpa-upsell__titel {
		font-size: var(--vm-tekst);
		font-weight: 700;
		color: var(--vm-inkt-sterk);
	}

	/* Specialisme-tegels */
	.vm-vpa .vm-vpa-specialismes {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 12px;
		margin-top: 12px;
	}

	.vm-vpa a.vm-vpa-specialisme {
		min-height: 0;
		height: 76px;
		padding: 0 18px 0 20px;
	}

	.vm-vpa .vm-vpa-specialisme__naam {
		font-size: 17px;
	}

	.vm-vpa .vm-vpa-specialisme__aantal {
		font-size: var(--vm-klein);
	}

	.vm-vpa .vm-vpa-specialisme__pijl {
		font-size: 18px;
	}

	/* Bedrijvenlijst: twee kolommen */
	.vm-vpa .vm-vpa-lijst {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		column-gap: 40px;
		padding: 4px 20px;
	}

	.vm-vpa .vm-vpa-lijst--categorieen {
		grid-template-columns: minmax(0, 1fr);
		max-width: 640px;
	}

	.vm-vpa a.vm-vpa-bedrijf {
		gap: 12px;
		padding: 0;
	}

	.vm-vpa .vm-vpa-bedrijf__rij {
		flex-wrap: nowrap;
		gap: 8px;
	}

	.vm-vpa .vm-vpa-bedrijf__naam {
		font-size: var(--vm-veld);
	}

	.vm-vpa .vm-vpa-bedrijf__badge {
		height: 22px;
		padding: 0 8px;
		font-size: var(--vm-label-klein);
	}

	/* Paginering */
	.vm-vpa .vm-vpa-paginering {
		padding-top: 4px;
	}

	.vm-vpa .vm-vpa-paginering__tekst {
		font-size: var(--vm-tekst-klein);
	}

	.vm.vm-vpa a.vm-vpa-paginering__knop {
		height: 40px;
	}

	/* Filters: drie dropdowns naast elkaar */
	.vm.vm-vpa a.vm-vpa-filterknop,
	.vm.vm-vpa a.vm-vpa-filterknop:hover {
		display: none;
	}

	.vm-vpa form.vm-vpa-filters {
		position: static;
		z-index: auto;
		display: flex;
		flex-direction: row;
		padding-top: 0;
	}

	.vm-vpa form.vm-vpa-filters:target {
		display: flex;
	}

	body:has(.vm-vpa-filters:target) {
		overflow: auto;
	}

	.vm-vpa a.vm-vpa-filters__scrim,
	.vm-vpa .vm-vpa-filters__kop,
	.vm-vpa .vm-vpa-filters__voet {
		display: none;
	}

	.vm-vpa .vm-vpa-filters__blad {
		display: block;
		flex: none;
		overflow: visible;
		border-radius: 0;
		background: transparent;
	}

	.vm-vpa .vm-vpa-filters__groepen {
		flex: none;
		flex-direction: row;
		gap: 10px;
		padding: 0;
		overflow: visible;
	}

	.vm-vpa .vm-vpa-dd {
		position: relative;
	}

	.vm-vpa .vm-vpa-dd__kop {
		display: none;
	}

	.vm-vpa .vm-vpa-dd__knop {
		display: flex;
		width: 170px;
		padding: 0 14px 0 16px;
	}

	.vm-vpa .vm-vpa-dd__tekst--desktop {
		display: inline;
	}

	.vm-vpa .vm-vpa-dd__tekst--mobiel {
		display: none;
	}

	.vm-vpa .vm-vpa-dd--actief .vm-vpa-dd__knop {
		border: 1.5px solid var(--vm-blauw-700);
		color: var(--vm-blauw-700);
		font-weight: 700;
	}

	.vm-vpa .vm-vpa-dd--actief .vm-vpa-dd__knop .vm-icoon {
		color: inherit;
	}

	/* Paneel: onder de knop, 300px breed */
	.vm-vpa .vm-vpa-dd__paneel,
	.vm-vpa .vm-vpa-dd--plaats .vm-vpa-dd__paneel {
		position: absolute;
		top: 52px;
		left: 0;
		z-index: 5;
		display: none;
		flex-direction: column;
		width: 300px;
		margin: 0;
		border-radius: var(--vm-r-m);
		background: var(--vm-wit);
		box-shadow: var(--vm-sch-2);
	}

	.vm-vpa .vm-vpa-dd__schakel:checked ~ .vm-vpa-dd__paneel,
	.vm-vpa .vm-vpa-dd--plaats .vm-vpa-dd__schakel:checked ~ .vm-vpa-dd__paneel {
		display: flex;
	}

	.vm-vpa .vm-vpa-dd__opties,
	.vm-vpa .vm-vpa-dd--plaats .vm-vpa-dd__opties {
		max-height: 320px;
		padding: 8px 16px;
		overflow-y: auto;
	}

	.vm-vpa label.vm-vpa-optie {
		min-height: 44px;
		border-bottom-color: var(--vm-lijn-zacht);
	}

	.vm-vpa .vm-vpa-optie__vink {
		width: 20px;
		height: 20px;
		border-radius: var(--vm-r-vink);
	}

	.vm-vpa .vm-vpa-optie__tekst {
		font-size: var(--vm-tekst);
	}

	.vm-vpa .vm-vpa-dd__voet {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 10px 16px;
		border-top: 1px solid var(--vm-lijn);
	}

	.vm.vm-vpa a.vm-vpa-dd__wis {
		font-size: var(--vm-tekst-klein);
		font-weight: 600;
		color: var(--vm-blauw-700);
	}

	.vm-vpa .vm-vpa-dd__voet button.vm-vpa-knop-toon {
		height: 40px;
		padding: 0 16px;
		font-size: var(--vm-tekst-klein);
	}

	/* Zoekresultaten */
	.vm-vpa .vm-vpa-specialismerij {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		gap: 10px;
	}

	.vm-vpa .vm-vpa-specialismerij__label {
		font-size: var(--vm-tekst-klein);
	}

	.vm-vpa .vm-vpa-specialismerij__chips {
		flex-wrap: wrap;
		margin: 0;
		padding: 0;
		overflow: visible;
	}

	/* Onderste blok van het overzicht */
	.vm-vpa .vm-vpa-seo {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 64px;
		margin-top: 56px;
		padding-top: 40px;
	}

	.vm-vpa .vm-vpa-seo--enkel {
		display: flex;
	}

	.vm-vpa h2.vm-vpa-seo__titel {
		font-size: 24px;
	}

	.vm-vpa .vm-vpa-faq .vm-vpa-seo__titel {
		margin: 0 0 8px;
	}

	.vm-vpa summary.vm-vpa-faq__vraag {
		font-size: var(--vm-veld);
	}
}

@media (prefers-reduced-motion: reduce) {
	.vm.vm-vpa a.vm-vpa-chip {
		transition: none;
	}
}