/* ==========================================================================
   DoctorCura Design – Zorgloket: mega-menu met groepen, vergelijking, keuzehulp, overzicht, uitleg
   ========================================================================== */
@media (min-width: 1025px) {
	.e-con.dcd-header-bar { position: relative; }
	/* Ook de Elementor-widget om het menu statisch, zodat het uitklapmenu op de headerbalk (= het scherm) centreert. */
	.dcd-nav, .dcd-nav__item--mega, .elementor-widget.dcd-w-nav { position: static !important; }
	.dcd-mega {
		top: calc(100% - 6px); width: min(1060px, calc(100vw - 48px)); grid-template-columns: 1fr; gap: 0; padding: 12px 12px 0;
		max-height: var(--dcd-mega-max, calc(100vh - 140px)); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scroll-padding-bottom: 96px;
	}
	/* Onderbalk: blijft onderaan zichtbaar als het menu scrolt. */
	.dcd-mega__aside {
		position: sticky; bottom: 0; z-index: 1; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 6px 18px; margin: 12px -12px 0; padding: 12px 18px;
		border-radius: 0 0 24px 24px; border-top: 1px solid var(--dcd-line);
		background: radial-gradient(300px 120px at 100% 0%, rgba(5, 96, 255, .14), transparent 60%), #f3f7ff;
	}
	.dcd-mega__aside strong { font-size: 16px; }
	.dcd-mega__aside .dcd-mega__eyebrow { display: none; }
	.dcd-mega__aside small { flex: 1 1 200px; margin: 0; }
	.dcd-mega__aside .dcd-button { margin: 0; }
	.dcd-mega__aside .dcd-mega__doc { margin: 0; }
}
.dcd-mega__doc { display: flex; gap: 10px; align-items: center; margin-top: 10px; padding: 10px 12px; border-radius: 14px; background: #fff; color: var(--dcd-ink) !important; text-decoration: none !important; font-size: 13px; line-height: 1.35; box-shadow: var(--dcd-shadow-sm); }
.dcd-mega__doc .dcd-icon { color: var(--dcd-blue); flex: none; }
.dcd-mega__doc strong { display: block; color: var(--dcd-navy); }

/* ---------- Menu Behandlungen: doelgroep, onderwerp, behandelgebied ---------- */
.dcd-mm [hidden] { display: none !important; }
.dcd-mm__tabs { display: flex; gap: 4px; padding: 4px; margin: 0 0 12px; border-radius: 16px; background: var(--dcd-bg); }
.dcd-mm .dcd-mm__tab {
	flex: 1 1 0; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 14px; border: 0; border-radius: 12px; background: transparent; cursor: pointer;
	font: 700 15px/1.2 var(--dcd-font); color: var(--dcd-ink); text-transform: none; letter-spacing: normal; white-space: normal; text-align: center;
	transition: background .2s, color .2s, box-shadow .2s;
}
.dcd-mm .dcd-mm__tab:hover, .dcd-mm .dcd-mm__tab:focus { background: transparent; color: var(--dcd-blue); }
.dcd-mm .dcd-mm__tab.is-active, .dcd-mm .dcd-mm__tab.is-active:hover, .dcd-mm .dcd-mm__tab.is-active:focus { background: #fff; color: var(--dcd-blue); box-shadow: var(--dcd-shadow-sm); }
.dcd-mm__tabicon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; background: var(--dcd-blue-50); color: var(--dcd-blue); flex: none; }
.dcd-mm__tabicon .dcd-icon { width: 17px; height: 17px; }
.dcd-mm__go { display: none; width: 18px; height: 18px; margin-left: auto; color: var(--dcd-muted); flex: none; }
.dcd-mm__panel { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 16px; min-height: 0; }
@media (min-width: 1025px) and (min-height: 760px) {
	.dcd-mm__panel:not(.dcd-mm__panel--flat) { min-height: 410px; }
}
.dcd-mm__panel--flat { grid-template-columns: minmax(0, 1fr); min-height: 0; }
.dcd-mm__topics { display: flex; flex-direction: column; gap: 2px; padding-right: 14px; border-right: 1px solid var(--dcd-line); }
.dcd-mm__topics > .dcd-mm__heading { display: none; }
.dcd-mm .dcd-mm__topic {
	display: flex; align-items: center; gap: 10px; width: 100%; padding: 4px 10px; border: 0; border-radius: 12px; background: none; cursor: pointer; text-align: left;
	font: 600 14.5px/1.25 var(--dcd-font); color: var(--dcd-ink); text-transform: none; letter-spacing: normal; white-space: normal; transition: background .2s, color .2s;
}
.dcd-mm .dcd-mm__topic:focus { background: none; color: var(--dcd-ink); }
@media (min-width: 1025px) and (max-height: 700px) {
	.dcd-mm .dcd-mm__topic { padding: 2px 10px; }
}
.dcd-mm__topic .dcd-mega__icon { width: 32px; height: 32px; border-radius: 10px; }
.dcd-mm__topic .dcd-mega__icon .dcd-icon { width: 17px; height: 17px; }
.dcd-mm__topiclabel { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.dcd-mm__topic small { flex: none; min-width: 24px; padding: 2px 8px; border-radius: 99px; background: var(--dcd-bg); font: 600 12px/1.2 var(--dcd-font); color: var(--dcd-muted); text-align: center; }
.dcd-mm .dcd-mm__topic:hover, .dcd-mm .dcd-mm__topic.is-active, .dcd-mm .dcd-mm__topic.is-active:focus { background: var(--dcd-blue-50); color: var(--dcd-blue); }
.dcd-mm__topic.is-active small { background: #fff; color: var(--dcd-blue); }
.dcd-mm__heading { margin: 2px 0 8px !important; padding: 0 10px; font: 700 11px/1.2 var(--dcd-font); letter-spacing: .1em; text-transform: uppercase; color: var(--dcd-coral); }
.dcd-mm__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 4px; }
.dcd-mm__area { display: flex; align-items: flex-start; gap: 12px; padding: 10px; border-radius: 14px; text-decoration: none !important; transition: background .2s; }
.dcd-mm__area:hover, .dcd-mm__area:focus-visible { background: var(--dcd-bg); }
.dcd-mm__area .dcd-mega__icon { width: 36px; height: 36px; border-radius: 11px; }
.dcd-mm__area .dcd-mega__icon .dcd-icon { width: 18px; height: 18px; }
.dcd-mm__area:hover .dcd-mega__icon { background: var(--dcd-blue); color: #fff; }
.dcd-mm__areatext { min-width: 0; }
.dcd-mm__areatext strong { display: block; font: 700 14.5px/1.25 var(--dcd-font-head); color: var(--dcd-navy); overflow-wrap: break-word; hyphens: auto; }
.dcd-mm__areatext small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.4; color: var(--dcd-muted); }
.dcd-mm__areatext em { display: block; margin-top: 4px; font: normal 600 12px/1.2 var(--dcd-font); color: var(--dcd-blue); }
.dcd-mm__back { display: none; }
/* Zonder JavaScript: alle doelgroepen en onderwerpen onder elkaar als lijst met links (knoppen werken dan niet). */
html:not(.dcd-js) .dcd-mm__tabs, html:not(.dcd-js) .dcd-mm__topics, html:not(.dcd-js) .dcd-mm__back { display: none !important; }
html:not(.dcd-js) .dcd-mm .dcd-mm__panel, html:not(.dcd-js) .dcd-mm .dcd-mm__panel[hidden] { display: block !important; min-height: 0; }
html:not(.dcd-js) .dcd-mm__areas[hidden] { display: block !important; }

.e-con.dcd-hero--compact { padding: 64px 24px 72px !important; }
.e-con.dcd-hero--compact .dcd-lead { max-width: 760px; }

/* ---------- Vergelijking ---------- */
.dcd-compare { display: flex; flex-direction: column; gap: 56px; text-align: left; }
.dcd-compare__head { display: flex; flex-direction: column; gap: 6px; margin: 0 0 22px; padding-left: 16px; border-left: 4px solid var(--dcd-coral); }
.dcd-compare__head h3 { margin: 0; font: 800 26px/1.2 var(--dcd-font-head); color: var(--dcd-navy); letter-spacing: -.02em; }
.dcd-compare__head p { margin: 0; color: var(--dcd-muted); font-size: 16px; line-height: 1.6; max-width: 760px; }
.dcd-xcards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; perspective: 1600px; align-items: start; }
.dcd-xcards[data-count="1"] { grid-template-columns: minmax(0, 820px); justify-content: center; }

.dcd-xcard {
	position: relative; display: flex; flex-direction: column; gap: 16px; padding: 24px; border-radius: var(--dcd-radius-lg);
	background: #fff; border: 1px solid var(--dcd-line); box-shadow: var(--dcd-shadow);
	transform: rotateX(var(--dcd-rx, 0deg)) rotateY(var(--dcd-ry, 0deg)) translateY(var(--dcd-lift, 0px));
	transition: transform .5s var(--dcd-ease), box-shadow .5s var(--dcd-ease), border-color .3s;
}
.dcd-xcard.is-tilting { transition: transform .08s linear, box-shadow .5s var(--dcd-ease); }
.dcd-xcard:hover { --dcd-lift: -4px; box-shadow: var(--dcd-shadow-lg); border-color: var(--dcd-blue-100); }
.dcd-xcard__top { display: grid; grid-template-columns: 104px 1fr; gap: 18px; align-items: center; }
.dcd-xcard__media { position: relative; display: grid; place-items: center; aspect-ratio: 1; border-radius: 20px; overflow: hidden; background: radial-gradient(120% 90% at 50% 100%, #dce8ff 0%, #f3f7ff 60%, #fff 100%); box-shadow: 0 0 0 1px var(--dcd-line) inset; }
.dcd-xcard__img { width: 88% !important; height: 88% !important; object-fit: contain; mix-blend-mode: multiply; transition: transform .6s var(--dcd-ease); }
.dcd-xcard:hover .dcd-xcard__img { transform: scale(1.08) rotate(-2deg); }
.dcd-xcard__heading { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.dcd-xcard__title { margin: 0 !important; font: 800 21px/1.2 var(--dcd-font-head) !important; letter-spacing: -.02em; }
.dcd-xcard__title a { color: var(--dcd-navy) !important; text-decoration: none !important; }
.dcd-xcard__kurz { margin: 0 !important; color: var(--dcd-muted); font-size: 14.5px; line-height: 1.5; }
.dcd-xcard__facts { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.dcd-xcard__facts > div { display: flex; flex-direction: column; gap: 3px; padding: 9px 12px; border-radius: 12px; background: var(--dcd-bg); border: 1px solid var(--dcd-line); min-width: 110px; }
.dcd-xcard__facts dt { font: 700 10.5px/1 var(--dcd-font); letter-spacing: .08em; text-transform: uppercase; color: var(--dcd-muted); }
.dcd-xcard__facts dd { margin: 0; font: 600 13.5px/1.3 var(--dcd-font); color: var(--dcd-navy); }
.dcd-xcard__wirkt { margin: 0 !important; font-size: 14.5px; line-height: 1.6; color: #3b4a68; }
.dcd-xcard__wirkt strong { color: var(--dcd-navy); }
.dcd-xcard__label { display: block; margin-bottom: 8px; font: 700 12px/1 var(--dcd-font); letter-spacing: .06em; text-transform: uppercase; color: #0b7a57; }
.dcd-xcard__fit ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.dcd-xcard__fit li { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; line-height: 1.45; color: var(--dcd-ink); }
.dcd-xcard__fit li .dcd-icon { width: 20px; height: 20px; padding: 4px; border-radius: 7px; background: var(--dcd-mint-50); color: var(--dcd-mint); margin-top: -1px; }
.dcd-xcard__more { border-radius: 14px; background: #f7f9fd; border: 1px solid var(--dcd-line); }
.dcd-xcard__more summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; cursor: pointer; list-style: none; font: 700 14px/1.2 var(--dcd-font); color: var(--dcd-navy); }
.dcd-xcard__more summary::-webkit-details-marker { display: none; }
.dcd-xcard__more summary .dcd-icon { width: 18px; height: 18px; color: var(--dcd-blue); transition: transform .3s var(--dcd-ease); }
.dcd-xcard__more[open] summary .dcd-icon { transform: rotate(180deg); }
.dcd-xcard__more > div { padding: 0 14px 14px; display: grid; gap: 10px; }
.dcd-xcard__more p { margin: 0 !important; font-size: 14px; line-height: 1.6; color: #3b4a68; }
.dcd-xcard__warn { display: flex; gap: 10px; align-items: flex-start; margin: 0 !important; padding: 11px 13px; border-radius: 12px; background: #fff7e8; border: 1px solid #ffe0a8; color: #6b4300 !important; font-size: 13.5px; line-height: 1.5; }
.dcd-xcard__warn .dcd-icon { color: #e08a00; width: 18px; height: 18px; margin-top: 1px; flex: none; }
.dcd-xcard__foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin-top: auto; padding-top: 16px; border-top: 1px dashed var(--dcd-line); }
.dcd-xcards[data-count="1"] .dcd-xcard__top { grid-template-columns: 150px 1fr; }

/* ---------- Keuzehulp ---------- */
.dcd-guide { position: relative; overflow: hidden; padding: 30px; border-radius: var(--dcd-radius-xl); background: radial-gradient(600px 260px at 100% 0%, rgba(5, 96, 255, .1), transparent 60%), #fff; border: 1px solid var(--dcd-line); box-shadow: var(--dcd-shadow); text-align: left; }
.dcd-guide__head { display: flex; gap: 14px; align-items: center; margin-bottom: 20px; }
.dcd-guide__head h3 em { font-style: normal; color: var(--dcd-blue); }
.dcd-guide__head h3 { margin: 2px 0 0 !important; font: 800 24px/1.2 var(--dcd-font-head) !important; color: var(--dcd-navy) !important; letter-spacing: -.02em; }
.dcd-guide__icon { display: grid; place-items: center; flex: none; width: 52px; height: 52px; border-radius: 16px; color: #fff; background: linear-gradient(135deg, var(--dcd-coral), #ffa183); box-shadow: 0 12px 22px -12px rgba(255, 122, 89, .9); }
.dcd-guide__eyebrow { font: 700 11px/1 var(--dcd-font); letter-spacing: .12em; text-transform: uppercase; color: var(--dcd-coral); }
.dcd-guide__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dcd-guide__list li { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 16px 16px 16px 58px; border-radius: 16px; background: var(--dcd-bg); border: 1px solid var(--dcd-line); }
.dcd-guide__num { position: absolute; left: 16px; top: 16px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; background: #fff; color: var(--dcd-blue); font: 800 13px/1 var(--dcd-font-head); box-shadow: 0 0 0 1px var(--dcd-blue-100) inset; }
.dcd-guide__list strong { font: 700 15.5px/1.35 var(--dcd-font-head); color: var(--dcd-navy); }
.dcd-guide__list li > span:not(.dcd-guide__num) { font-size: 14.5px; line-height: 1.55; color: #3b4a68; }
.dcd-guide__note { display: flex; gap: 10px; align-items: flex-start; margin: 18px 0 0 !important; font-size: 13.5px; line-height: 1.5; color: var(--dcd-muted); }
.dcd-guide__note .dcd-icon { color: var(--dcd-blue); flex: none; }

/* ---------- Overzicht alle gebieden: [dcd_bereiche] (0.6.4) ----------
   Doelgroep-tabs, onderwerpkaarten en gebieden in de indeling van het menu. De beginstand komt uit CSS (is-start en :target),
   niet uit JavaScript: design.js laadt met defer en voegt pas daarna is-tabs toe, zonder dat er iets verspringt.
   Selectors met .dcd-areas ervoor en expliciete :hover/:focus, omdat het thema (reset.css) en de Elementor-kit knoppen en links
   anders roze, wit of in Roboto maken. */
.dcd-areas { --dcd-areas-field: #b9c6de; display: flex; flex-direction: column; gap: 18px; text-align: left; }
.dcd-areas [hidden] { display: none !important; }

/* Zoeken */
.dcd-areas__searchbox { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.dcd-areas__search { position: relative; display: flex; align-items: center; gap: 8px; width: 100%; max-width: 640px; margin: 0; }
.dcd-areas__search > .dcd-icon { position: absolute; left: 20px; top: 50%; z-index: 1; width: 20px; height: 20px; margin-top: -10px; color: var(--dcd-blue); pointer-events: none; }
.dcd-areas .dcd-areas__search input[type="search"] {
	flex: 1 1 auto; min-width: 0; width: 100%; height: 56px; margin: 0; padding: 0 18px 0 52px !important;
	border: 1.5px solid var(--dcd-field-border, var(--dcd-areas-field)) !important; border-radius: 999px !important; background: #fff !important;
	box-shadow: var(--dcd-shadow-sm) !important; font: 500 16px/1.2 var(--dcd-font) !important; color: var(--dcd-navy) !important;
	outline: none !important; -webkit-appearance: none; appearance: none; transition: border-color .15s, box-shadow .15s;
}
.dcd-areas .dcd-areas__search input[type="search"]::placeholder { color: var(--dcd-muted); opacity: 1; }
.dcd-areas .dcd-areas__search input[type="search"]:hover { border-color: var(--dcd-field-border-hover, #9dbcff) !important; }
.dcd-areas .dcd-areas__search input[type="search"]:focus,
.dcd-areas .dcd-areas__search input[type="search"]:focus-visible { border-color: var(--dcd-blue) !important; box-shadow: 0 0 0 4px rgba(5, 96, 255, .18), var(--dcd-shadow-sm) !important; outline: none !important; }
.dcd-areas .dcd-areas__submit, .dcd-areas .dcd-areas__submit:focus {
	flex: none; height: 56px; margin: 0; padding: 0 24px; border: 0; border-radius: 999px; background: var(--dcd-blue); box-shadow: none; cursor: pointer;
	font: 700 15px/1 var(--dcd-font); color: #fff; letter-spacing: normal; text-transform: none; white-space: nowrap;
}
.dcd-areas .dcd-areas__submit:hover { background: var(--dcd-blue-600); color: #fff; }
.dcd-areas .dcd-areas__submit:focus-visible { outline: 3px solid var(--dcd-navy); outline-offset: 2px; box-shadow: none; }
/* Met JavaScript filtert het veld direct; de knop is alleen nodig zonder JavaScript. */
html.dcd-js .dcd-areas .dcd-areas__submit { display: none; }
.dcd-areas__status { margin: 0 !important; text-align: center; font-size: 14px; line-height: 1.4; color: var(--dcd-muted); }
.dcd-areas__found { font-weight: 600; color: var(--dcd-ink); }
.dcd-areas .dcd-areas__reset, .dcd-areas .dcd-areas__reset:hover, .dcd-areas .dcd-areas__reset:focus {
	display: inline-flex; align-items: center; min-height: 32px; margin: 0 0 0 2px; padding: 4px 8px; border: 0; border-radius: 8px; background: none; box-shadow: none; cursor: pointer;
	font: 600 14px/1.2 var(--dcd-font); color: var(--dcd-blue); letter-spacing: normal; text-transform: none; white-space: nowrap;
	text-decoration: underline; text-underline-offset: 3px; vertical-align: middle;
}
.dcd-areas .dcd-areas__reset:hover { background: var(--dcd-blue-50); color: var(--dcd-blue-600); }
.dcd-areas .dcd-areas__reset:focus-visible { outline: 2px solid var(--dcd-blue); outline-offset: 1px; box-shadow: none; }

/* Doelgroep-tabs (uiterlijk zoals het menu). Zonder JavaScript zijn het ankerlinks naar #fuer-... */
.dcd-areas__tabs { display: flex; gap: 4px; width: 100%; max-width: 760px; margin: 0 auto; padding: 4px; border-radius: 16px; background: #e8eef8; }
.dcd-areas .dcd-areas__tab, .dcd-areas .dcd-areas__tab:visited {
	--dcd-areas-count-bg: rgba(255, 255, 255, .8); --dcd-areas-count-color: var(--dcd-muted);
	flex: 1 1 0; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 12px; border-radius: 12px;
	background: transparent; box-shadow: none; font: 700 15px/1.2 var(--dcd-font); color: var(--dcd-ink); text-align: center; text-decoration: none;
	transition: background .2s, color .2s, box-shadow .2s;
}
.dcd-areas .dcd-areas__tab:hover, .dcd-areas .dcd-areas__tab:focus { background: rgba(255, 255, 255, .55); color: var(--dcd-blue); text-decoration: none; }
.dcd-areas .dcd-areas__tab:focus-visible { outline: 3px solid var(--dcd-blue); outline-offset: 1px; box-shadow: none; }
/* Gekozen doelgroep: met JavaScript aria-selected, zonder JavaScript de startdoelgroep. */
.dcd-areas.is-tabs .dcd-areas__tab[aria-selected="true"],
.dcd-areas:not(.is-tabs) .dcd-areas__tab.is-start {
	--dcd-areas-count-bg: var(--dcd-blue-50); --dcd-areas-count-color: var(--dcd-blue);
	background: #fff; color: var(--dcd-blue); box-shadow: var(--dcd-shadow-sm);
}
.dcd-areas__tabicon { display: grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: 9px; background: var(--dcd-blue-50); color: var(--dcd-blue); }
.dcd-areas__tabicon .dcd-icon { width: 16px; height: 16px; }
.dcd-areas__tablabel { min-width: 0; overflow-wrap: anywhere; }
.dcd-areas__tabcount { flex: none; min-width: 26px; padding: 2px 8px; border-radius: 99px; background: var(--dcd-areas-count-bg); font: 600 12px/1.2 var(--dcd-font); color: var(--dcd-areas-count-color); text-align: center; }
.dcd-areas__tabunit { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.dcd-areas.is-searching .dcd-areas__tabs { display: none; }

/* Beginstand zonder JavaScript en zonder verspringen: alleen de startdoelgroep, of de doelgroep uit het adres (#fuer-frauen). */
.dcd-areas__panel { scroll-margin-top: 220px; }
.dcd-areas:not(.is-tabs):not(.is-searching) .dcd-areas__panel:not(.is-start):not(:target) { display: none; }
/* :has() in een eigen regel: browsers zonder :has() negeren alleen deze regels. */
.dcd-areas:not(.is-tabs):not(.is-searching):has(.dcd-areas__panel:target) .dcd-areas__panel.is-start:not(:target) { display: none; }
.dcd-areas:not(.is-tabs):has(.dcd-areas__panel:target) .dcd-areas__tab.is-start {
	--dcd-areas-count-bg: rgba(255, 255, 255, .8); --dcd-areas-count-color: var(--dcd-muted);
	background: transparent; color: var(--dcd-ink); box-shadow: none;
}
.dcd-areas:not(.is-tabs):has(.dcd-areas__panel:nth-child(1):target) .dcd-areas__tab:nth-child(1),
.dcd-areas:not(.is-tabs):has(.dcd-areas__panel:nth-child(2):target) .dcd-areas__tab:nth-child(2),
.dcd-areas:not(.is-tabs):has(.dcd-areas__panel:nth-child(3):target) .dcd-areas__tab:nth-child(3),
.dcd-areas:not(.is-tabs):has(.dcd-areas__panel:nth-child(4):target) .dcd-areas__tab:nth-child(4) {
	--dcd-areas-count-bg: var(--dcd-blue-50); --dcd-areas-count-color: var(--dcd-blue);
	background: #fff; color: var(--dcd-blue); box-shadow: var(--dcd-shadow-sm);
}

/* Doelgroepkop: de tab toont de doelgroep al; de kop blijft voor schermlezers en de koppenstructuur (H2 of H3). */
.dcd-areas .dcd-areas__audience { position: absolute !important; width: 1px; height: 1px; margin: -1px !important; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Onderwerpen: vanaf 4 onderwerpen in kolommen (metselwerk), anders een raster. */
.dcd-areas__topics { columns: 3 300px; column-gap: 16px; }
.dcd-areas__topics--few { columns: auto; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; align-items: start; }
.dcd-areas__topic { display: inline-block; width: 100%; margin: 0 0 16px; padding: 6px; border-radius: 20px; background: #fff; border: 1px solid var(--dcd-line); box-shadow: var(--dcd-shadow-sm); break-inside: avoid; vertical-align: top; }
.dcd-areas__topics--few > .dcd-areas__topic { margin: 0; }
.dcd-areas__topicaud { display: none; }
.dcd-areas .dcd-areas__topictitle {
	display: flex; align-items: center; gap: 10px; width: 100%; margin: 0 !important; padding: 8px 8px 6px;
	font: 800 15.5px/1.25 var(--dcd-font-head) !important; color: var(--dcd-navy) !important; letter-spacing: -.01em;
}
.dcd-areas .dcd-areas__topictitle.has-toggle { padding: 0; }
.dcd-areas__topicicon { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 10px; background: var(--dcd-blue-50); color: var(--dcd-blue); }
.dcd-areas__topicicon .dcd-icon { width: 17px; height: 17px; }
.dcd-areas__topiclabel { flex: 1 1 auto; min-width: 0; overflow-wrap: break-word; hyphens: auto; }
.dcd-areas__topiccount { flex: none; min-width: 24px; padding: 2px 8px; border-radius: 99px; background: var(--dcd-bg); font: 600 12px/1.2 var(--dcd-font); color: var(--dcd-muted); letter-spacing: normal; text-align: center; }
/* Inklapknop (alleen mobiel, door design.js in de kop gezet). */
.dcd-areas .dcd-areas__toggle, .dcd-areas .dcd-areas__toggle:hover, .dcd-areas .dcd-areas__toggle:focus {
	display: flex; align-items: center; gap: 10px; width: 100%; min-height: 48px; margin: 0; padding: 8px; border: 0; border-radius: 14px; background: none; box-shadow: none; cursor: pointer;
	font: inherit; color: inherit; letter-spacing: inherit; text-align: left; text-transform: none; white-space: normal; transition: background .2s;
}
.dcd-areas .dcd-areas__toggle:hover { background: var(--dcd-bg); }
.dcd-areas .dcd-areas__toggle:focus-visible { outline: 3px solid var(--dcd-blue); outline-offset: -3px; box-shadow: none; }
.dcd-areas__chev { flex: none; width: 20px; height: 20px; color: var(--dcd-muted); transition: transform .25s var(--dcd-ease); }
.dcd-areas__toggle[aria-expanded="true"] .dcd-areas__chev { transform: rotate(180deg); }

/* Gebieden */
.dcd-areas .dcd-areas__list { list-style: none; margin: 0 !important; padding: 0 !important; }
.dcd-areas .dcd-areas__list > li { margin: 0; padding: 0; }
.dcd-areas .dcd-area, .dcd-areas .dcd-area:visited {
	display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; align-items: start; padding: 8px; border-radius: 14px;
	background: transparent; color: var(--dcd-ink); text-decoration: none; transition: background .2s;
}
.dcd-areas .dcd-area:hover, .dcd-areas .dcd-area:focus { background: var(--dcd-bg); color: var(--dcd-ink); text-decoration: none; }
.dcd-areas .dcd-area:focus-visible { outline: 3px solid var(--dcd-blue); outline-offset: -3px; box-shadow: none; }
.dcd-area__icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; color: var(--dcd-blue); background: linear-gradient(145deg, #fff, var(--dcd-blue-50)); box-shadow: 0 0 0 1px var(--dcd-blue-100) inset; transition: background .2s, color .2s; }
.dcd-area__icon .dcd-icon { width: 17px; height: 17px; }
.dcd-areas .dcd-area:hover .dcd-area__icon, .dcd-areas .dcd-area:focus-visible .dcd-area__icon { background: var(--dcd-blue); color: #fff; }
.dcd-area__body { display: block; min-width: 0; }
.dcd-area__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 2px 10px; }
.dcd-area__head strong { font: 700 14.5px/1.3 var(--dcd-font-head); color: var(--dcd-navy); overflow-wrap: break-word; hyphens: auto; }
.dcd-areas .dcd-area:hover .dcd-area__head strong { color: var(--dcd-blue); }
.dcd-area__head em { font: normal 600 12px/1.3 var(--dcd-font); color: var(--dcd-blue); white-space: nowrap; }
.dcd-area__body small { display: block; margin-top: 2px; font-size: 12.5px; line-height: 1.4; color: var(--dcd-muted); }
/* Eén onderwerp (Für Männer): gebieden naast elkaar in één kaart. */
.dcd-areas__panel--flat .dcd-areas__topics--few { grid-template-columns: minmax(0, 1fr); }
.dcd-areas__panel--flat .dcd-areas__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 2px 8px; }

/* Zoeken: tabs weg, alle treffers als één raster van onderwerpkaarten over alle doelgroepen, doelgroep als kleine regel. */
.dcd-areas.is-searching .dcd-areas__panels { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; align-items: start; }
.dcd-areas.is-searching .dcd-areas__panel, .dcd-areas.is-searching .dcd-areas__topics { display: contents; }
.dcd-areas.is-searching .dcd-areas__topic { margin: 0; }
.dcd-areas.is-searching .dcd-areas__topicaud { display: block; margin: 6px 8px 0; font: 700 11px/1.2 var(--dcd-font); letter-spacing: .08em; text-transform: uppercase; color: var(--dcd-muted); }
.dcd-areas.is-searching .dcd-areas__topictitle { padding-top: 4px; }
.dcd-areas.is-searching .dcd-areas__topiccount { display: none; }
.dcd-areas.is-searching .dcd-areas__panel--flat .dcd-areas__list { display: block; }

.dcd-areas__none { padding: 18px 20px; border-radius: 18px; background: #fff; border: 1.5px dashed var(--dcd-areas-field); text-align: center; color: var(--dcd-muted); }
.dcd-areas__none p { margin: 0 !important; }
.dcd-areas__none strong { color: var(--dcd-navy); }
.dcd-areas .dcd-areas__doc { align-self: center; margin: 4px 0 0; padding: 10px 14px; transition: box-shadow .2s; }
.dcd-areas .dcd-areas__doc:hover, .dcd-areas .dcd-areas__doc:focus { box-shadow: var(--dcd-shadow); text-decoration: none; }
.dcd-areas .dcd-areas__doc:focus-visible { outline: 3px solid var(--dcd-blue); outline-offset: 2px; }
.dcd-areas__doc > .dcd-icon:last-child { width: 16px; height: 16px; color: var(--dcd-blue); }

/* ---------- Kurz erklärt (productpagina) ---------- */
.dcd-explain { display: flex; flex-direction: column; gap: 18px; padding: 30px; margin-bottom: 18px; border-radius: var(--dcd-radius-lg); background: radial-gradient(500px 220px at 100% 0%, rgba(5, 96, 255, .08), transparent 60%), #fff; border: 1px solid var(--dcd-line); box-shadow: var(--dcd-shadow-sm); }
.dcd-explain__head { display: flex; gap: 14px; align-items: center; }
.dcd-explain__head .dcd-guide__icon { background: linear-gradient(135deg, var(--dcd-blue), #4f8dff); box-shadow: 0 12px 22px -12px rgba(5, 96, 255, .9); }
.dcd-explain__head h3 { margin: 2px 0 0 !important; font: 800 21px/1.3 var(--dcd-font-head) !important; color: var(--dcd-navy) !important; }
.dcd-explain__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.dcd-explain__item { display: flex; gap: 12px; padding: 16px; border-radius: 16px; background: var(--dcd-bg); border: 1px solid var(--dcd-line); }
.dcd-explain__item > .dcd-icon { flex: none; width: 34px; height: 34px; padding: 8px; border-radius: 11px; background: #fff; color: var(--dcd-blue); box-shadow: 0 0 0 1px var(--dcd-blue-100) inset; }
.dcd-explain__item strong { display: block; margin-bottom: 4px; font: 700 14.5px/1.3 var(--dcd-font-head); color: var(--dcd-navy); }
.dcd-explain__item p, .dcd-explain__item li { margin: 0; font-size: 14px; line-height: 1.55; color: #3b4a68; }
.dcd-explain__item ul { margin: 0; padding-left: 18px; }
.dcd-explain__also { margin: 0 !important; font-size: 14px; color: var(--dcd-muted); }
.dcd-explain__also a { margin-left: 6px; font-weight: 700; color: var(--dcd-blue) !important; }

@media (min-width: 768px) and (max-width: 1024px) {
	.dcd-areas__topics { columns: 2 300px; }
}
@media (max-width: 1024px) {
	.dcd-nav__panel { overscroll-behavior: contain; }
	/* Geopend via tikken (is-open, zonder hover): niet verschuiven zoals het desktop-uitklapmenu. */
	.dcd-nav__item--mega.is-open .dcd-mega { transform: none; }
	/* Menu Behandlungen: doorklikken. Niveau 1 doelgroepen, 2 onderwerpen, 3 behandelgebieden. */
	.dcd-mm__tabs { flex-direction: column; gap: 6px; margin: 0; padding: 0; background: none; }
	.dcd-mm .dcd-mm__tab { justify-content: flex-start; padding: 12px 14px; border-radius: 14px; background: var(--dcd-bg); font-size: 16px; text-align: left; }
	.dcd-mm .dcd-mm__tab:hover, .dcd-mm .dcd-mm__tab:focus, .dcd-mm .dcd-mm__tab.is-active, .dcd-mm .dcd-mm__tab.is-active:hover, .dcd-mm .dcd-mm__tab.is-active:focus { background: var(--dcd-bg); color: var(--dcd-ink); box-shadow: none; }
	.dcd-mm__go { display: block; }
	.dcd-mm__panel, .dcd-mm__panel--flat { grid-template-columns: minmax(0, 1fr); gap: 0; min-height: 0; }
	.dcd-mm__topics { padding: 0; border: 0; gap: 6px; }
	.dcd-mm__topics > .dcd-mm__heading { display: block; }
	.dcd-mm .dcd-mm__topic { padding: 10px 12px; background: var(--dcd-bg); font-size: 15.5px; }
	.dcd-mm .dcd-mm__topic:hover, .dcd-mm .dcd-mm__topic:focus, .dcd-mm .dcd-mm__topic.is-active, .dcd-mm .dcd-mm__topic.is-active:focus { background: var(--dcd-bg); color: var(--dcd-ink); }
	.dcd-mm__topic small { background: #fff; }
	.dcd-mm__topic .dcd-mm__go { margin-left: 0; }
	.dcd-mm .dcd-mm__back, .dcd-mm .dcd-mm__back:hover, .dcd-mm .dcd-mm__back:focus {
		display: inline-flex; align-items: center; gap: 6px; margin: 0 0 8px; padding: 8px 10px 8px 4px; border: 0; border-radius: 10px; background: none; cursor: pointer;
		font: 700 14px/1.2 var(--dcd-font); color: var(--dcd-blue); text-transform: none; letter-spacing: normal; white-space: normal;
	}
	.dcd-mm__back .dcd-icon { width: 18px; height: 18px; }
	.dcd-mm[data-level="1"] .dcd-mm__panel { display: none !important; }
	.dcd-mm:not([data-level="1"]) .dcd-mm__tabs { display: none; }
	.dcd-mm[data-level="2"] .dcd-mm__areas-wrap { display: none; }
	.dcd-mm[data-level="3"] .dcd-mm__topics { display: none; }
	.dcd-mm__grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
}
@media (max-width: 767px) {
	.dcd-xcards, .dcd-xcards[data-count] { grid-template-columns: 1fr !important; }
	.dcd-xcard { padding: 18px; }
	.dcd-xcard__top, .dcd-xcards[data-count] .dcd-xcard__top { grid-template-columns: 84px 1fr !important; }
	.dcd-xcard__foot { flex-direction: column; align-items: stretch; }
	.dcd-guide { padding: 22px 18px; }
	.dcd-guide__list, .dcd-explain__grid { grid-template-columns: 1fr; }
	.dcd-explain { padding: 22px 18px; }
	/* Overzicht [dcd_bereiche] op mobiel: tabs met aantal eronder, onderwerpen onder elkaar (inklapbaar via design.js). */
	.dcd-areas { gap: 14px; }
	.dcd-areas .dcd-areas__search input[type="search"] { height: 52px; padding-left: 46px !important; }
	.dcd-areas__search > .dcd-icon { left: 17px; }
	.dcd-areas .dcd-areas__submit, .dcd-areas .dcd-areas__submit:focus { height: 52px; padding: 0 16px; }
	.dcd-areas .dcd-areas__tab, .dcd-areas .dcd-areas__tab:visited { flex-direction: column; gap: 1px; padding: 8px 4px; font-size: 14px; }
	.dcd-areas__tabicon { display: none; }
	.dcd-areas__tabcount { min-width: 0; padding: 0; background: none; font-weight: 500; }
	.dcd-areas__tabunit { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; clip-path: none; }
	.dcd-areas__panel { scroll-margin-top: 150px; }
	.dcd-areas__topics { columns: auto; }
	.dcd-areas__topics--few, .dcd-areas.is-searching .dcd-areas__panels { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.dcd-areas__topic { margin-bottom: 10px; }
	.dcd-areas .dcd-area, .dcd-areas .dcd-area:visited { grid-template-columns: 32px minmax(0, 1fr); gap: 10px; padding: 9px 8px; }
	.dcd-area__icon { width: 32px; height: 32px; }
	.dcd-areas__panel--flat .dcd-areas__list { grid-template-columns: minmax(0, 1fr); }
}