/* core/group block styles for articles (explicit choice in the Styles panel or via a pattern).
   Stappenpad (is-style-dw-path): a run of H3 sections on a light rail; numbers light up as they
     come into view, one light pulse travels down once.
   Aanpak (is-style-dw-dark): dark "how we do it" card, optional score bars + family chips.
   Volgende stap (is-style-dw-next): next-step card with a button.
   Aanbeveling (is-style-dw-rec): report-style recommendation card; a sheen passes twice.
   Figuur (is-style-dw-fig): glass panel for the in-text visuals (patterns: gap, plan, draft,
     tasks, gates). Mockup: dam-writers-artikel.html + theme_components.py.
   Motion only after article.js marks the block (.is-seen / .is-inview); reduced motion: none. */

.dwa-fam-improve { --dwa-tc: var(--wp--custom--article--family--improve); --dwa-tt: var(--wp--custom--article--family--improve-text); }
.dwa-fam-create { --dwa-tc: var(--wp--custom--article--family--create); --dwa-tt: var(--wp--custom--article--family--create-text); }
.dwa-fam-keep { --dwa-tc: var(--wp--custom--article--family--keep); --dwa-tt: var(--wp--custom--article--family--keep-text); }
.dwa-fam-merge { --dwa-tc: var(--wp--custom--article--family--merge); --dwa-tt: var(--wp--custom--article--family--merge-text); }
.dwa-fam-protect { --dwa-tc: var(--wp--custom--article--family--protect); --dwa-tt: var(--wp--custom--article--family--protect-text); }

/* shared glass panel (next step, figure) */
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group:is(.is-style-dw-next, .is-style-dw-fig) {
	position: relative;
	isolation: isolate;
	border: 1px solid var(--wp--custom--article--edge);
	background: linear-gradient(150deg, rgba(255, 255, 255, 0.94), rgba(253, 244, 248, 0.86)), var(--wp--preset--color--white);
	box-shadow: 0 0 0 4px rgba(208, 40, 120, 0.035), 0 34px 70px -46px rgba(208, 40, 120, 0.55);
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group:is(.is-style-dw-next, .is-style-dw-fig)::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	background-image: linear-gradient(var(--wp--custom--article--line) 1px, transparent 1px), linear-gradient(90deg, var(--wp--custom--article--line) 1px, transparent 1px);
	background-size: 22px 22px;
	-webkit-mask: radial-gradient(120% 90% at 100% 0, #000, transparent 75%);
	mask: radial-gradient(120% 90% at 100% 0, #000, transparent 75%);
	pointer-events: none;
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-fig::after {
	content: "";
	position: absolute;
	inset: -8px;
	pointer-events: none;
	background:
		linear-gradient(var(--wp--preset--color--brand), var(--wp--preset--color--brand)) top left / 26px 2.5px,
		linear-gradient(var(--wp--preset--color--brand), var(--wp--preset--color--brand)) top left / 2.5px 26px,
		linear-gradient(var(--wp--preset--color--brand), var(--wp--preset--color--brand)) bottom right / 26px 2.5px,
		linear-gradient(var(--wp--preset--color--brand), var(--wp--preset--color--brand)) bottom right / 2.5px 26px;
	background-repeat: no-repeat;
	opacity: 0.85;
	filter: drop-shadow(0 0 4px rgba(255, 90, 168, 0.6));
}

/* ---------- numbered path ---------- */
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path {
	position: relative;
	padding-left: 60px;
	counter-reset: dwa-path;
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > * { margin-block: 0; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > * + * { margin-block-start: 14px; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > h3 + * { margin-block-start: 8px; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > * + h3 { margin-block-start: 30px; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path::before {
	content: "";
	position: absolute;
	left: 19px;
	top: 20px;
	bottom: 20px;
	width: 2px;
	background: linear-gradient(rgba(208, 40, 120, 0.5), rgba(208, 40, 120, 0.12));
	box-shadow: 0 0 8px rgba(255, 90, 168, 0.4);
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path::after {
	content: "";
	position: absolute;
	left: 16px;
	top: 0;
	width: 8px;
	height: 60px;
	border-radius: 8px;
	background: linear-gradient(rgba(255, 90, 168, 0), var(--wp--preset--color--brand), rgba(255, 90, 168, 0));
	filter: blur(1px);
	opacity: 0;
	animation: dwa-rail 6s linear 1 both paused;
}
.wp-block-group.is-style-dw-path.is-inview::after { animation-play-state: running; }
html:not(.dwt-js) .wp-block-group.is-style-dw-path::after { content: none; }
@keyframes dwa-rail {
	0% { top: 0; opacity: 0; }
	10%, 90% { opacity: 1; }
	100% { top: calc(100% - 60px); opacity: 0; }
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > h3 {
	position: relative;
	counter-increment: dwa-path;
	font-size: 1.2rem;
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > h3::before,
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > h3 > .dwa-path__num {
	position: absolute;
	left: -60px;
	top: -6px;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border: 1.5px solid rgba(208, 40, 120, 0.5);
	border-radius: 12px;
	background: var(--wp--preset--color--brand);
	box-shadow: 0 0 0 5px rgba(208, 40, 120, 0.12), 0 0 20px var(--wp--custom--article--glow);
	color: var(--wp--preset--color--white);
	font: 800 15px/1 var(--wp--preset--font-family--mono);
	letter-spacing: -0.04em;
	transition: background-color 0.4s, color 0.4s, box-shadow 0.4s;
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > h3::before { content: counter(dwa-path); }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > h3:has(> .dwa-path__num)::before { content: none; }
/* not yet seen: outlined number */
.dwt-js .wp-block-group.is-style-dw-path > h3:not(.is-seen)::before,
.dwt-js .wp-block-group.is-style-dw-path > h3:not(.is-seen) > .dwa-path__num {
	background: var(--wp--preset--color--white);
	box-shadow: none;
	color: var(--wp--preset--color--brand-dark);
}

/* ---------- recommendation card ---------- */
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-rec {
	position: relative;
	overflow: hidden;
	padding: 16px 18px;
	border: 1px solid var(--wp--custom--article--edge);
	border-radius: 16px;
	background: linear-gradient(150deg, var(--wp--preset--color--white), rgba(253, 244, 248, 0.9));
	box-shadow: inset 3px 0 0 var(--wp--preset--color--brand), 0 24px 44px -32px rgba(208, 40, 120, 0.7);
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-rec > * { position: relative; margin-block: 0; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-rec > * + * { margin-block-start: 10px; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-rec::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -50%;
	width: 40%;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.75), transparent);
	pointer-events: none;
	animation: dwa-sheen 5s ease-in-out 2 paused;
}
.wp-block-group.is-style-dw-rec.is-inview::after { animation-play-state: running; }
@keyframes dwa-sheen { 0%, 60% { left: -50%; } 100% { left: 120%; } }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-rec .dwa-rec__k {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--wp--preset--color--weak);
	font: 800 11px/1.4 var(--wp--preset--font-family--mono);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-rec .dwa-rec__k strong {
	display: grid;
	place-items: center;
	flex: none;
	width: 26px;
	height: 26px;
	border-radius: 8px;
	background: var(--wp--preset--color--brand);
	box-shadow: 0 0 12px var(--wp--custom--article--glow);
	color: var(--wp--preset--color--white);
	letter-spacing: 0;
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-rec > p:not(.dwa-rec__k) { color: var(--wp--preset--color--ink); font-size: 16px; line-height: 1.6; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-rec .dwa-rec__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; padding: 0; list-style: none; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-rec .dwa-rec__tags > li {
	margin: 0;
	padding: 3px 10px;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--white);
	box-shadow: inset 0 0 0 1px rgba(208, 40, 120, 0.3);
	color: var(--wp--preset--color--brand-dark);
	font: 700 11.5px/1.5 var(--wp--preset--font-family--mono);
}

/* ---------- dark approach card ---------- */
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding: 26px;
	border-radius: 24px;
	background: radial-gradient(90% 120% at 100% 0, rgba(208, 40, 120, 0.25), rgba(208, 40, 120, 0) 60%), var(--wp--preset--color--ink);
	box-shadow: 0 0 0 1px rgba(255, 90, 168, 0.2), 0 40px 80px -50px rgba(22, 30, 41, 0.9);
	color: var(--wp--custom--article--dark--copy);
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background-image: linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
	background-size: 22px 22px;
	-webkit-mask: linear-gradient(90deg, transparent, #000);
	mask: linear-gradient(90deg, transparent, #000);
	pointer-events: none;
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark :is(p, li) { color: var(--wp--custom--article--dark--copy); }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark a { color: var(--wp--preset--color--pink-on-ink); }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark a:hover { color: var(--wp--preset--color--white); }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark > * { margin-block: 0; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark > * + * { margin-block-start: 18px; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark:has(> .dwa-dark__viz) {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 220px;
	gap: 24px;
	align-items: center;
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark:has(> .dwa-dark__viz) > * + * { margin-block-start: 0; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark .dwa-dark__copy > * { margin-block: 0; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark .dwa-dark__copy > * + * { margin-block-start: 18px; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark .dwa-dark__viz { display: grid; gap: 12px; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark .dwa-dark__viz > * { margin: 0; }
/* ten score bars, drawn (decorative) */
.dwa-bars {
	--a: var(--wp--custom--article--dark--amber);
	--g: var(--wp--custom--article--dark--green);
	--r: var(--wp--custom--article--dark--red);
	height: 96px;
	padding-bottom: 2px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.18);
	background:
		linear-gradient(var(--a), rgba(245, 181, 68, 0.35)) 0% 100% / 8.4% 80% no-repeat,
		linear-gradient(var(--a), rgba(245, 181, 68, 0.35)) 11.1% 100% / 8.4% 60% no-repeat,
		linear-gradient(var(--g), rgba(61, 220, 151, 0.35)) 22.2% 100% / 8.4% 85% no-repeat,
		linear-gradient(var(--a), rgba(245, 181, 68, 0.35)) 33.3% 100% / 8.4% 55% no-repeat,
		linear-gradient(var(--r), rgba(240, 98, 114, 0.35)) 44.4% 100% / 8.4% 40% no-repeat,
		linear-gradient(var(--a), rgba(245, 181, 68, 0.35)) 55.5% 100% / 8.4% 65% no-repeat,
		linear-gradient(var(--a), rgba(245, 181, 68, 0.35)) 66.6% 100% / 8.4% 70% no-repeat,
		linear-gradient(var(--a), rgba(245, 181, 68, 0.35)) 77.7% 100% / 8.4% 50% no-repeat,
		linear-gradient(var(--g), rgba(61, 220, 151, 0.35)) 88.8% 100% / 8.4% 90% no-repeat,
		linear-gradient(var(--a), rgba(245, 181, 68, 0.35)) 100% 100% / 8.4% 62% no-repeat;
	filter: drop-shadow(0 0 10px rgba(245, 181, 68, 0.3));
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark .dwa-cats { display: flex; flex-wrap: wrap; gap: 6px; padding: 0; list-style: none; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark .dwa-cats > li {
	margin: 0;
	padding: 4px 10px;
	border-radius: var(--wp--custom--radius--pill);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
	font: 800 11.5px/1.4 var(--wp--preset--font-family--mono);
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark .dwa-cats > li:nth-child(1) { background: rgba(61, 220, 151, 0.15); color: var(--wp--custom--article--dark--green-text); }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark .dwa-cats > li:nth-child(2) { background: rgba(245, 181, 68, 0.15); color: var(--wp--custom--article--dark--amber-text); }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark .dwa-cats > li:nth-child(3) { background: rgba(208, 40, 120, 0.2); color: var(--wp--preset--color--pink-on-ink); }
@media (max-width: 640px) {
	:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-dark:has(> .dwa-dark__viz) { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- next step ---------- */
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-next {
	display: grid;
	gap: 18px;
	justify-items: start;
	padding: 26px;
	border-radius: 24px;
	background: linear-gradient(120deg, var(--wp--preset--color--white) 40%, var(--wp--preset--color--brand-tint));
}
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-next > * { margin: 0; }

/* ---------- figure (in-text visuals) ---------- */
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-fig { padding: 22px; border-radius: 22px; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-fig > * { margin-block: 0; }
:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-fig > * + * { margin-block-start: 14px; }
.dwa-fig__k {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--wp--preset--color--brand-dark);
	font: 700 12px/1.4 var(--wp--preset--font-family--mono);
	letter-spacing: 0.12em;
	text-transform: uppercase;
}
.dwa-fig__k::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--wp--preset--color--brand); box-shadow: 0 0 8px var(--wp--custom--article--glow); }

/* gap: two pages disagree, the price comes late (contentaudit-website) */
.dwa-gap__pages { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 90px minmax(0, 1fr); align-items: center; gap: 0; }
.wp-block-group.dwa-gap__pages > * { margin: 0; }
.dwa-gap__page {
	display: grid;
	gap: 8px;
	padding: 14px;
	border: 1px solid var(--wp--custom--article--edge);
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.9);
	box-shadow: 0 22px 40px -30px rgba(208, 40, 120, 0.6);
}
.wp-block-group.dwa-gap__page > * { margin: 0; }
.dwa-gap__page::before, .dwa-gap__page::after { content: ""; display: block; height: 7px; border-radius: 4px; background: var(--wp--preset--color--border); }
.dwa-gap__page::before { order: 1; }
.dwa-gap__page::after { order: 3; width: 60%; }
.dwa-gap__k { order: 0; display: flex; align-items: center; gap: 6px; color: var(--wp--preset--color--muted); font: 800 10.5px/1.4 var(--wp--preset--font-family--mono); letter-spacing: 0.1em; text-transform: uppercase; }
.dwa-gap__m { order: 2; color: var(--wp--preset--color--ink); font-size: 14px; line-height: 1.4; }
.dwa-gap__m mark { padding: 0 2px; background: linear-gradient(transparent 55%, var(--wp--custom--article--pink-line) 55%); color: var(--wp--preset--color--ink); font-weight: 700; }
.dwa-gap__link { position: relative; height: 40px; }
.dwa-gap__link::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--preset--color--brand);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 40' preserveAspectRatio='none'%3E%3Cpath d='M4 20 C 40 0, 80 40, 116 20' fill='none' stroke='black' stroke-width='2' stroke-dasharray='5 6'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 40' preserveAspectRatio='none'%3E%3Cpath d='M4 20 C 40 0, 80 40, 116 20' fill='none' stroke='black' stroke-width='2' stroke-dasharray='5 6'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
	filter: drop-shadow(0 0 4px var(--wp--custom--article--glow));
}
.dwa-gap__link::after {
	content: "?" / "";
	position: absolute;
	left: 50%;
	top: 50%;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	margin: -17px 0 0 -17px;
	border-radius: 50%;
	background: var(--wp--preset--color--brand);
	box-shadow: 0 0 0 6px rgba(208, 40, 120, 0.14), 0 0 22px var(--wp--custom--article--glow);
	color: var(--wp--preset--color--white);
	font-weight: 800;
}
.dwa-gap__route { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding-top: 22px; }
.wp-block-group.dwa-gap__route > * { position: relative; margin: 0; color: var(--wp--preset--color--ink); font: 700 12px/1.4 var(--wp--preset--font-family--mono); text-align: center; }
.dwa-gap__route > *::before {
	content: "";
	position: absolute;
	left: 50%;
	top: -19px;
	z-index: 1;
	width: 10px;
	height: 10px;
	margin-left: -5px;
	border: 2px solid rgba(208, 40, 120, 0.4);
	border-radius: 50%;
	background: var(--wp--preset--color--white);
	box-shadow: 0 0 8px rgba(255, 90, 168, 0.4);
}
.dwa-gap__route::before {
	content: "";
	position: absolute;
	left: 12%;
	right: 12%;
	top: 7px;
	height: 4px;
	border-radius: 3px;
	background: linear-gradient(90deg, rgba(208, 40, 120, 0.15), rgba(208, 40, 120, 0.25) 70%, var(--wp--custom--article--dark--amber));
}
.dwa-gap__route::after {
	content: "";
	position: absolute;
	top: 9px;
	left: 12%;
	z-index: 2;
	width: 14px;
	height: 14px;
	margin: -7px 0 0 -7px;
	border-radius: 50%;
	background: var(--wp--preset--color--brand);
	box-shadow: 0 0 0 5px rgba(208, 40, 120, 0.15), 0 0 18px 4px var(--wp--custom--article--glow);
	animation: dwa-walk 5s ease-in-out 1 both paused;
}
@keyframes dwa-walk { 0% { left: 12%; } 70%, 100% { left: 88%; } }
.dwa-gap__route em {
	display: block;
	width: fit-content;
	max-width: 100%;
	margin: 6px auto 0;
	padding: 3px 8px;
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--needs-bg);
	box-shadow: 0 0 16px rgba(245, 181, 68, 0.55);
	color: var(--wp--preset--color--needs);
	font-size: 11px;
	font-style: normal;
	font-weight: 800;
	animation: dwa-late 5s ease-in-out 1 both paused;
}
@keyframes dwa-late { 0%, 62% { opacity: 0.15; transform: scale(0.9); } 72%, 100% { opacity: 1; transform: none; } }
.dwa-gap.is-inview .dwa-gap__route::after, .dwa-gap.is-inview .dwa-gap__route em { animation-play-state: running; }
html:not(.dwt-js) .dwa-gap__route::after { left: 88%; animation: none; }
html:not(.dwt-js) .dwa-gap__route em { animation: none; }
@media (max-width: 600px) {
	.dwa-gap__pages { grid-template-columns: minmax(0, 1fr); gap: 34px; }
	.dwa-gap__link { position: absolute; left: 50%; top: 50%; width: 34px; height: 34px; margin: -17px 0 0 -17px; }
	.dwa-gap__link::before { content: none; }
	.dwa-gap__route > * { font-family: inherit; font-size: 11px; }
}

/* plan: the action plan in three families (zo-werkt-content-audit) */
.dwa-plan { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.wp-block-group.dwa-plan > * { margin: 0; }
.dwa-plan__col {
	display: grid;
	align-content: start;
	gap: 8px;
	padding: 12px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 16px;
	background: var(--wp--preset--color--white);
	box-shadow: inset 0 3px 0 var(--dwa-tc, var(--wp--preset--color--brand));
}
.wp-block-group.dwa-plan__col > * { margin: 0; }
.dwa-plan__col > :first-child { color: var(--dwa-tt, var(--wp--preset--color--brand-dark)); font: 800 12px/1.4 var(--wp--preset--font-family--mono); letter-spacing: 0.08em; text-transform: uppercase; }
.dwa-plan__col > :not(:first-child) {
	display: grid;
	gap: 6px;
	padding: 10px;
	border-radius: 10px;
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--ink);
	font: 800 11px/1.3 var(--wp--preset--font-family--mono);
}
.dwa-plan__col > :not(:first-child)::before,
.dwa-plan__col > :not(:first-child)::after { content: ""; order: 2; display: block; height: 6px; border-radius: 4px; background: var(--wp--custom--article--skeleton); }
.dwa-plan__col > :not(:first-child)::after { width: 60%; }
@media (max-width: 560px) { .dwa-plan { grid-template-columns: minmax(0, 1fr); } }

/* draft: a concept with "Afronden vóór publicatie" (contentaudit-rapport-gebruiken) */
.dwa-draft { display: grid; grid-template-columns: minmax(0, 1fr) 180px; gap: 16px; }
.wp-block-group.dwa-draft > * { margin: 0; }
.dwa-draft__doc {
	display: grid;
	align-content: start;
	gap: 12px;
	padding: 20px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 14px;
	background: var(--wp--preset--color--white);
}
.wp-block-group.dwa-draft__doc > * { margin: 0; }
.dwa-draft__doc::before {
	content: "";
	display: block;
	height: 105px;
	background:
		linear-gradient(var(--wp--custom--article--skeleton), var(--wp--custom--article--skeleton)) 0 0 / 70% 9px no-repeat,
		linear-gradient(var(--wp--custom--article--skeleton), var(--wp--custom--article--skeleton)) 0 21px / 90% 9px no-repeat,
		linear-gradient(var(--wp--custom--article--pink-line), var(--wp--custom--article--pink-line)) 0 42px / 80% 9px no-repeat,
		linear-gradient(var(--wp--custom--article--skeleton), var(--wp--custom--article--skeleton)) 0 63px / 60% 9px no-repeat,
		linear-gradient(var(--wp--custom--article--skeleton), var(--wp--custom--article--skeleton)) 0 84px / 85% 9px no-repeat;
}
.dwa-draft__flag {
	justify-self: start;
	padding: 6px 12px;
	border: 1px solid var(--wp--custom--article--flag--line);
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--custom--article--flag--bg);
	color: var(--wp--custom--article--flag--text);
	font: 700 12px/1.4 var(--wp--preset--font-family--mono);
}
.dwa-draft__side { display: grid; align-content: start; gap: 8px; margin: 0; padding: 0; list-style: none; }
.dwa-draft__side > li {
	margin: 0;
	padding: 8px 12px;
	border: 1px solid var(--wp--custom--article--edge);
	border-radius: 10px;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
	font: 600 12.5px/1.4 var(--wp--preset--font-family--mono);
}
.dwa-draft__side > li::before { content: "✓ " / ""; color: var(--wp--custom--article--ok--badge); }
@media (max-width: 560px) { .dwa-draft { grid-template-columns: minmax(0, 1fr); } }

/* tasks: one page, five jobs (websitecontent-verbeteren); each item = <strong>tag</strong> */
.dwa-tasks { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.dwa-tasks > li {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 12px;
	align-items: center;
	margin: 0;
}
.dwa-tasks > li::before {
	content: "";
	height: 46px;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 12px;
	background:
		linear-gradient(var(--wp--custom--article--skeleton), var(--wp--custom--article--skeleton)) 14px 14px / calc(100% - 28px) 7px no-repeat,
		linear-gradient(var(--wp--custom--article--skeleton), var(--wp--custom--article--skeleton)) 14px 27px / 55% 7px no-repeat,
		var(--wp--preset--color--white);
	box-shadow: inset 4px 0 0 var(--dwa-tc, var(--wp--preset--color--brand));
}
.dwa-tasks > li > strong {
	padding: 7px 12px;
	border: 1px solid var(--dwa-tc, var(--wp--preset--color--brand));
	border-radius: var(--wp--custom--radius--pill);
	background: var(--wp--preset--color--white);
	color: var(--dwa-tt, var(--wp--preset--color--brand-dark));
	font: 700 12px/1.4 var(--wp--preset--font-family--mono);
	white-space: nowrap;
}
@media (max-width: 560px) {
	.dwa-tasks > li { grid-template-columns: minmax(0, 1fr); gap: 6px; }
	.dwa-tasks > li > strong { justify-self: start; white-space: normal; }
}

/* gates: AI draft through five checks to the editor (ai-contentkwaliteit) */
.dwa-gates { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; list-style: none; counter-reset: dwa-gate; }
.dwa-gates > li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 10px 12px;
	border: 1px solid var(--wp--custom--article--edge);
	border-radius: 12px;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.3;
}
.dwa-gates > li:not(:first-child):not(:last-child) { counter-increment: dwa-gate; }
.dwa-gates > li:not(:first-child):not(:last-child)::before {
	content: counter(dwa-gate);
	display: grid;
	place-items: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--white);
	font: 800 11px/1 var(--wp--preset--font-family--mono);
}
.dwa-gates > li:not(:last-child)::after { content: "→" / ""; margin-left: 6px; color: var(--wp--preset--color--brand); }
.dwa-gates > li:first-child {
	border-color: transparent;
	background: var(--wp--custom--article--dark--panel);
	box-shadow: 0 0 0 2px var(--wp--preset--color--brand), 0 0 14px var(--wp--custom--article--glow);
	color: var(--wp--preset--color--white);
	font: 800 14px/1.3 var(--wp--preset--font-family--mono);
}
.dwa-gates > li:last-child { border-color: var(--wp--custom--article--ok--line); background: var(--wp--custom--article--ok--bg); color: var(--wp--custom--article--ok--text); }

@media (prefers-reduced-motion: reduce) {
	.wp-block-group.is-style-dw-path::after, .wp-block-group.is-style-dw-rec::after { animation: none; content: none; }
	.dwa-gap__route::after { animation: none; left: 88%; }
	.dwa-gap__route em { animation: none; }
	:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > h3::before,
	:where(body:not(.dwv4-legacy), .is-dwv4) .wp-block-group.is-style-dw-path > h3 > .dwa-path__num { transition: none; }
}