/* Dutch Powerlifters: algemene stijlen en blokstijlen.
   Kleuren, maten en lettertypes komen uit theme.json. */

:root {
	--dp-border: 3px solid var(--wp--preset--color--iron);
	--dp-header-h: 76px;
}

html {
	scroll-padding-top: calc(var(--dp-header-h) + 1rem);
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

::selection {
	background: var(--wp--preset--color--plate-yellow);
	color: var(--wp--preset--color--iron);
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--wp--preset--color--plate-yellow);
	outline-offset: 2px;
}

img {
	height: auto;
}

.screen-reader-text:not(:focus) {
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px);
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ---------- Header ---------- */

.dp-header {
	position: sticky;
	top: 0;
	z-index: 50;
	border-bottom: 1px solid var(--wp--preset--color--graphite);
}

.admin-bar .dp-header {
	top: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 600px) {
	.admin-bar .dp-header {
		top: 0;
	}
}

.dp-header::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -5px;
	height: 4px;
	background: var(--wp--preset--gradient--plates);
}

.dp-logo {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	text-decoration: none;
	color: var(--wp--preset--color--white);
	font: 400 1.6rem/0.9 var(--wp--preset--font-family--display);
	text-transform: uppercase;
	letter-spacing: 0.01em;
	white-space: nowrap;
}

.dp-logo__mark {
	display: inline-flex;
	gap: 2px;
	align-items: center;
}

.dp-logo__mark i {
	display: block;
	width: 7px;
	border-radius: 2px;
}

.dp-logo__mark i:nth-child(1) { height: 30px; background: var(--wp--preset--color--plate-red); }
.dp-logo__mark i:nth-child(2) { height: 26px; background: var(--wp--preset--color--plate-blue); }
.dp-logo__mark i:nth-child(3) { height: 22px; background: var(--wp--preset--color--plate-yellow); }
.dp-logo__mark i:nth-child(4) { height: 18px; background: var(--wp--preset--color--plate-green); }

.dp-logo span em {
	font-style: normal;
	color: var(--wp--preset--color--plate-red);
}

.dp-header .wp-block-navigation a:hover {
	color: var(--wp--preset--color--plate-yellow);
}

.dp-header .wp-block-navigation .current-menu-item > a,
.dp-header .wp-block-navigation [aria-current="page"] {
	color: var(--wp--preset--color--plate-yellow);
}

.dp-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--iron) !important;
	color: var(--wp--preset--color--white) !important;
	padding: 2rem 1.5rem;
}

.dp-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	font-size: 2rem;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 400;
}

/* ---------- Hero ---------- */

.dp-hero {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.dp-hero .wp-block-cover__image-background {
	filter: grayscale(1) contrast(1.15);
}

.dp-hero h1 {
	font-size: var(--wp--preset--font-size--mega);
	line-height: 0.88;
	letter-spacing: -0.005em;
}

.dp-hero h1 mark,
.dp-mark {
	background: none;
	color: var(--wp--preset--color--plate-red);
}

.dp-ticker {
	overflow: hidden;
	white-space: nowrap;
	border-block: var(--dp-border);
}

.dp-ticker__track {
	display: inline-flex;
	gap: 2.5rem;
	padding: 0.85rem 0;
	animation: dp-ticker 40s linear infinite;
	font: 400 1.75rem/1 var(--wp--preset--font-family--display);
	text-transform: uppercase;
}

.dp-ticker__track span::after {
	content: "●";
	margin-left: 2.5rem;
	color: var(--wp--preset--color--plate-red);
	font-size: 0.8em;
	vertical-align: middle;
}

@keyframes dp-ticker {
	to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
	.dp-ticker__track { animation: none; }
	* { scroll-behavior: auto !important; }
}

/* ---------- Blokstijlen: groepen ---------- */

.is-style-dp-panel {
	background: var(--wp--preset--color--white);
	border: var(--dp-border);
	border-radius: var(--wp--custom--radius);
}

.is-style-dp-iron {
	background: var(--wp--preset--color--iron);
	color: var(--wp--preset--color--chalk);
	border-radius: var(--wp--custom--radius);
}

.is-style-dp-iron :where(h1, h2, h3, h4) {
	color: var(--wp--preset--color--white);
}

.is-style-dp-stripe {
	position: relative;
	border: var(--dp-border);
	border-radius: var(--wp--custom--radius);
	background: var(--wp--preset--color--white);
}

.is-style-dp-stripe::before {
	content: "";
	position: absolute;
	inset: -3px -3px auto -3px;
	height: 12px;
	background: var(--wp--custom--stripe);
	border-radius: var(--wp--custom--radius) var(--wp--custom--radius) 0 0;
}

.is-style-dp-card {
	background: var(--wp--preset--color--white);
	border: var(--dp-border);
	border-radius: var(--wp--custom--radius);
	box-shadow: var(--wp--preset--shadow--hard);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.is-style-dp-card:hover {
	transform: translate(-3px, -3px);
	box-shadow: 9px 9px 0 0 var(--wp--preset--color--plate-red);
}

.is-style-dp-card.has-iron-background-color,
.is-style-dp-card.has-steel-background-color {
	border-color: var(--wp--preset--color--graphite);
}

/* ---------- Blokstijlen: koppen ---------- */

.is-style-dp-kicker {
	font-family: var(--wp--preset--font-family--condensed) !important;
	font-size: 0.9375rem !important;
	font-weight: 800 !important;
	letter-spacing: 0.18em !important;
	color: var(--wp--preset--color--plate-red);
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
}

.is-style-dp-kicker::before {
	content: "";
	width: 28px;
	height: 4px;
	background: currentColor;
}

.is-style-dp-outline {
	color: transparent !important;
	-webkit-text-stroke: 2px var(--wp--preset--color--iron);
}

.has-iron-background-color .is-style-dp-outline,
.is-style-dp-iron .is-style-dp-outline,
.wp-block-cover .is-style-dp-outline {
	-webkit-text-stroke-color: var(--wp--preset--color--white);
}

.is-style-dp-plate {
	padding-bottom: 0.9rem;
	position: relative;
}

.is-style-dp-plate::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 120px;
	height: 6px;
	background: var(--wp--preset--gradient--plates);
}

.has-text-align-center.is-style-dp-plate::after {
	left: 50%;
	transform: translateX(-50%);
}

/* ---------- Blokstijlen: knoppen ---------- */

.wp-block-button__link {
	transition: background-color 0.15s ease, color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.wp-block-button__link:hover {
	transform: translate(-2px, -2px);
	box-shadow: 4px 4px 0 0 var(--wp--preset--color--plate-yellow);
}

.is-style-dp-iron .wp-block-button__link,
.wp-block-button.is-style-dp-iron .wp-block-button__link {
	background: var(--wp--preset--color--iron);
	color: var(--wp--preset--color--white);
}

.wp-block-button.is-style-dp-iron .wp-block-button__link:hover {
	background: var(--wp--preset--color--plate-red);
}

.wp-block-button.is-style-dp-ghost .wp-block-button__link {
	background: transparent;
	color: currentColor;
	border: 3px solid currentColor;
}

.wp-block-button.is-style-dp-ghost .wp-block-button__link:hover {
	background: var(--wp--preset--color--plate-yellow);
	color: var(--wp--preset--color--iron);
	border-color: var(--wp--preset--color--plate-yellow);
}

.wp-block-button.is-style-dp-chalk .wp-block-button__link {
	background: var(--wp--preset--color--chalk);
	color: var(--wp--preset--color--iron);
}

/* ---------- Blokstijlen: lijsten, tabellen, overig ---------- */

.is-style-dp-check {
	list-style: none;
	padding-left: 0;
}

.is-style-dp-check li {
	position: relative;
	padding-left: 2rem;
	margin-bottom: 0.5rem;
}

.is-style-dp-check li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.3em;
	width: 1.15rem;
	height: 1.15rem;
	border-radius: 3px;
	background: var(--wp--preset--color--plate-red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='white' stroke-width='2.5' d='M3 8.5l3 3 7-7'/%3E%3C/svg%3E") center/80% no-repeat;
}

.is-style-dp-steps {
	list-style: none;
	padding-left: 0;
	counter-reset: dp-step;
}

.is-style-dp-steps li {
	counter-increment: dp-step;
	position: relative;
	padding-left: 3.75rem;
	margin-bottom: 1.25rem;
	min-height: 2.75rem;
}

.is-style-dp-steps li::before {
	content: counter(dp-step, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: -0.1em;
	font: 400 2.25rem/1 var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--plate-red);
}

.wp-block-table.is-style-dp-board table,
.dp-calc__table {
	border-collapse: collapse;
	width: 100%;
}

.wp-block-table.is-style-dp-board thead,
.dp-calc__table thead {
	border-bottom: 0;
}

.wp-block-table.is-style-dp-board th,
.dp-calc__table th {
	background: var(--wp--preset--color--iron);
	color: var(--wp--preset--color--plate-yellow);
	font: 800 0.875rem/1.2 var(--wp--preset--font-family--condensed);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	text-align: left;
	padding: 0.75rem 1rem;
	border: 0;
}

.wp-block-table.is-style-dp-board td,
.dp-calc__table td {
	padding: 0.7rem 1rem;
	border: 0;
	border-bottom: 1px solid rgb(14 14 16 / 0.12);
	font-variant-numeric: tabular-nums;
}

.wp-block-table.is-style-dp-board tbody tr:nth-child(even) td {
	background: rgb(14 14 16 / 0.04);
}

.wp-block-table.is-style-dp-board td:first-child {
	font-family: var(--wp--preset--font-family--condensed);
	font-weight: 800;
	font-size: 1.0625rem;
}

.wp-block-table.is-style-dp-board {
	border: var(--dp-border);
	border-radius: var(--wp--custom--radius);
	overflow-x: auto;
	background: var(--wp--preset--color--white);
}

.dp-calc__table {
	grid-column: 1 / -1;
	color: var(--wp--preset--color--chalk);
}

.dp-calc__table td {
	border-bottom-color: var(--wp--preset--color--graphite);
}

.wp-block-image.is-style-dp-hard img {
	border: var(--dp-border);
	border-radius: var(--wp--custom--radius);
	box-shadow: var(--wp--preset--shadow--hard-red);
}

.wp-block-separator.is-style-dp-plates {
	border: 0 !important;
	height: 8px !important;
	max-width: 160px;
	background: var(--wp--preset--gradient--plates) !important;
	opacity: 1;
}

.wp-block-separator.is-style-dp-plates.has-text-align-center,
.wp-block-separator.is-style-dp-plates.aligncenter {
	margin-inline: auto;
}

.wp-block-details.is-style-dp-faq {
	border: var(--dp-border);
	border-radius: var(--wp--custom--radius);
	background: var(--wp--preset--color--white);
	padding: 0;
}

.wp-block-details.is-style-dp-faq + .wp-block-details.is-style-dp-faq {
	margin-top: 0.75rem;
}

.wp-block-details.is-style-dp-faq summary {
	cursor: pointer;
	list-style: none;
	padding: 1.1rem 3.5rem 1.1rem 1.25rem;
	position: relative;
	font: 800 1.1875rem/1.25 var(--wp--preset--font-family--condensed);
	text-transform: uppercase;
}

.wp-block-details.is-style-dp-faq summary::-webkit-details-marker {
	display: none;
}

.wp-block-details.is-style-dp-faq summary::after {
	content: "+";
	position: absolute;
	right: 1.1rem;
	top: 50%;
	transform: translateY(-50%);
	width: 1.8rem;
	height: 1.8rem;
	display: grid;
	place-items: center;
	background: var(--wp--preset--color--iron);
	color: var(--wp--preset--color--white);
	border-radius: 3px;
	font: 400 1.4rem/1 var(--wp--preset--font-family--display);
}

.wp-block-details.is-style-dp-faq[open] summary::after {
	content: "–";
	background: var(--wp--preset--color--plate-red);
}

.wp-block-details.is-style-dp-faq > :not(summary) {
	padding-inline: 1.25rem;
}

.wp-block-details.is-style-dp-faq > :last-child {
	padding-bottom: 1.25rem;
}

.is-style-dp-lead {
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.5;
	font-weight: 500;
}

.is-style-dp-stat {
	font: 400 var(--wp--preset--font-size--xxxl)/0.9 var(--wp--preset--font-family--display) !important;
	margin-bottom: 0.25rem !important;
}

/* ---------- Kaarten: posts ---------- */

.dp-postcard {
	height: 100%;
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--white);
	border: var(--dp-border);
	border-radius: var(--wp--custom--radius);
	overflow: hidden;
	position: relative;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.dp-postcard:hover {
	transform: translate(-3px, -3px);
	box-shadow: var(--wp--preset--shadow--hard-red);
}

.dp-postcard .wp-block-post-featured-image {
	margin: 0;
	border-bottom: var(--dp-border);
	overflow: hidden;
}

.dp-postcard .wp-block-post-featured-image img {
	aspect-ratio: 16 / 10;
	object-fit: cover;
	filter: grayscale(0.35) contrast(1.05);
	transition: filter 0.2s ease, transform 0.3s ease;
}

.dp-postcard:hover .wp-block-post-featured-image img {
	filter: none;
	transform: scale(1.03);
}

.dp-postcard .wp-block-post-title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.dp-postcard .wp-block-post-terms a {
	position: relative;
	z-index: 2;
}

.wp-block-post-template.is-layout-grid > li {
	height: 100%;
}

/* ---------- Kaarten: gyms ---------- */

.dp-gymgrid {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

.dp-gymcard {
	position: relative;
	height: 100%;
	box-sizing: border-box;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--iron);
	border: var(--dp-border);
	border-radius: var(--wp--custom--radius);
	padding: 1.1rem 1.2rem 1.2rem;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.dp-gymcard::before {
	content: "";
	position: absolute;
	top: -3px;
	left: 1.2rem;
	width: 46px;
	height: 6px;
	background: var(--wp--preset--color--plate-red);
}

.dp-gymcard.is-featured {
	background: var(--wp--preset--color--iron);
	color: var(--wp--preset--color--white);
}

.dp-gymcard.is-featured::before {
	background: var(--wp--preset--color--plate-yellow);
}

.dp-gymcard:hover {
	transform: translate(-3px, -3px);
	box-shadow: var(--wp--preset--shadow--hard-red);
}

.dp-gymcard__link {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	color: inherit;
	text-decoration: none;
}

.dp-gymcard__link::after {
	content: "";
	position: absolute;
	inset: 0;
}

.dp-gymcard__type {
	font: 800 0.75rem/1 var(--wp--preset--font-family--condensed);
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--wp--preset--color--plate-red);
}

.dp-gymcard.is-featured .dp-gymcard__type {
	color: var(--wp--preset--color--plate-yellow);
}

.dp-gymcard__title {
	margin: 0;
	font-size: 1.5rem;
	line-height: 1;
}

.dp-gymcard__place {
	font-weight: 500;
	opacity: 0.8;
}

.dp-gymcard__tags {
	list-style: none;
	margin: auto 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
}

.dp-gymcard__tags li {
	font: 700 0.75rem/1 var(--wp--preset--font-family--condensed);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 0.3rem 0.55rem;
	border-radius: 999px;
	background: var(--wp--preset--color--chalk);
	color: var(--wp--preset--color--iron);
}

/* ---------- Provincietegels ---------- */

.dp-regiogrid {
	display: grid;
	gap: 0.75rem;
	grid-template-columns: repeat(auto-fill, minmax(min(150px, 45%), 1fr));
}

.dp-regiogrid__tile {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1.5rem;
	min-height: 120px;
	padding: 1rem 1.1rem;
	border-radius: var(--wp--custom--radius);
	background: var(--wp--preset--color--steel);
	color: var(--wp--preset--color--white);
	text-decoration: none;
	border: 2px solid var(--wp--preset--color--graphite);
	position: relative;
	overflow: hidden;
	transition: background-color 0.15s ease, transform 0.15s ease;
}

.dp-regiogrid__tile::after {
	content: "→";
	position: absolute;
	right: 1rem;
	top: 0.9rem;
	font: 400 1.4rem/1 var(--wp--preset--font-family--display);
	color: var(--wp--preset--color--plate-red);
	transition: transform 0.15s ease;
}

.dp-regiogrid__tile:hover {
	background: var(--wp--preset--color--plate-red);
	border-color: var(--wp--preset--color--plate-red);
	transform: translateY(-3px);
}

.dp-regiogrid__tile:hover::after {
	color: var(--wp--preset--color--white);
	transform: translateX(4px);
}

.dp-regiogrid__tile.is-empty {
	opacity: 0.55;
}

.dp-regiogrid__name {
	font: 400 1.6rem/1 var(--wp--preset--font-family--display);
	text-transform: uppercase;
	padding-right: 1.5rem;
}

.dp-regiogrid__count {
	font: 700 0.875rem/1 var(--wp--preset--font-family--condensed);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--wp--preset--color--plate-yellow);
}

.dp-regiogrid__tile:hover .dp-regiogrid__count {
	color: var(--wp--preset--color--white);
}

.has-chalk-background-color .dp-regiogrid__tile,
.has-white-background-color .dp-regiogrid__tile {
	background: var(--wp--preset--color--iron);
}

/* ---------- Artikel ---------- */

.dp-article .wp-block-post-content > * + h2 {
	margin-top: 2.5em;
}

.dp-article .wp-block-post-content > * + h3 {
	margin-top: 1.8em;
}

/* Oude blogs gebruiken soms H1 als tussenkop: toon die als H2. */
.dp-article .wp-block-post-content h1 {
	font-size: var(--wp--preset--font-size--xxl);
	margin-top: 2.2em;
}

.dp-article .wp-block-post-content h2 {
	font-size: var(--wp--preset--font-size--xl);
	font-family: var(--wp--preset--font-family--display);
	font-weight: 400;
}

.dp-article .wp-block-post-content strong {
	font-weight: 700;
}

.dp-article .wp-block-post-content :where(h1, h2, h3) strong {
	font-weight: inherit;
}

.dp-article .wp-block-post-content a {
	text-decoration-color: var(--wp--preset--color--plate-red);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.dp-article .wp-block-post-content > p:first-child {
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.55;
	font-weight: 500;
}

.dp-article .wp-block-post-content .wp-block-image img {
	border-radius: var(--wp--custom--radius);
}

.dp-article-hero .wp-block-post-featured-image img {
	border: var(--dp-border);
	border-radius: var(--wp--custom--radius);
	box-shadow: var(--wp--preset--shadow--hard-red);
}

.dp-meta-row {
	gap: 0.75rem 1.25rem !important;
}

.dp-readtime {
	font: 700 0.8125rem/1 var(--wp--preset--font-family--condensed);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* ---------- Breadcrumbs ---------- */

.dp-crumbs {
	font: 700 0.8125rem/1.4 var(--wp--preset--font-family--condensed);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	opacity: 0.85;
}

.dp-crumbs ol {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin: 0;
	padding: 0;
}

.dp-crumbs li + li::before {
	content: "/";
	margin-right: 0.4rem;
	color: var(--wp--preset--color--plate-red);
}

.dp-crumbs a {
	text-decoration: none;
}

/* ---------- Footer ---------- */

.dp-footer {
	position: relative;
}

.dp-footer::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 8px;
	background: var(--wp--preset--gradient--plates);
}

.dp-footer a {
	text-decoration: none;
}

.dp-footer a:hover {
	color: var(--wp--preset--color--plate-yellow);
	text-decoration: underline;
}

.dp-footer .wp-block-navigation__container {
	gap: 0.5rem;
}

.dp-footer-big {
	font: 400 clamp(3rem, 12vw, 11rem)/0.85 var(--wp--preset--font-family--display);
	text-transform: uppercase;
	color: var(--wp--preset--color--graphite);
	white-space: nowrap;
	overflow: hidden;
	margin: 0;
	user-select: none;
}

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

.wp-block-query-pagination {
	font: 800 1.0625rem/1 var(--wp--preset--font-family--condensed);
	text-transform: uppercase;
}

.wp-block-query-pagination-numbers .page-numbers {
	display: inline-grid;
	place-items: center;
	min-width: 2.75rem;
	height: 2.75rem;
	border: 2px solid var(--wp--preset--color--iron);
	border-radius: var(--wp--custom--radius);
	text-decoration: none;
	margin: 0 0.15rem;
}

.wp-block-query-pagination-numbers .page-numbers.current {
	background: var(--wp--preset--color--iron);
	color: var(--wp--preset--color--plate-yellow);
}

/* ---------- Formulieren (Contact Form 7) ---------- */

.wpcf7 input:not([type="submit"]):not([type="checkbox"]),
.wpcf7 textarea,
.wpcf7 select {
	width: 100%;
	box-sizing: border-box;
	padding: 0.8rem 1rem;
	border: var(--dp-border);
	border-radius: var(--wp--custom--radius);
	background: var(--wp--preset--color--white);
	font: inherit;
}

.wpcf7 input[type="submit"] {
	cursor: pointer;
	border: 0;
	background: var(--wp--preset--color--plate-red);
	color: var(--wp--preset--color--white);
	font: 800 1.125rem/1 var(--wp--preset--font-family--condensed);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	padding: 1rem 1.75rem;
	border-radius: var(--wp--custom--radius);
}

.wpcf7 input[type="submit"]:hover {
	background: var(--wp--preset--color--iron);
}

/* ---------- Editor-hulp ---------- */

.editor-styles-wrapper .dp-header {
	position: relative;
	top: 0;
}

/* ---------- Logo (sitetitel met schijven) ---------- */

.dp-header .wp-block-site-title a {
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	color: var(--wp--preset--color--white);
	white-space: nowrap;
}

.dp-header .wp-block-site-title a::before {
	content: "";
	width: 34px;
	height: 30px;
	flex: none;
	background:
		linear-gradient(var(--wp--preset--color--plate-red), var(--wp--preset--color--plate-red)) 0 50% / 7px 30px no-repeat,
		linear-gradient(var(--wp--preset--color--plate-blue), var(--wp--preset--color--plate-blue)) 9px 50% / 7px 25px no-repeat,
		linear-gradient(var(--wp--preset--color--plate-yellow), var(--wp--preset--color--plate-yellow)) 18px 50% / 7px 20px no-repeat,
		linear-gradient(var(--wp--preset--color--plate-green), var(--wp--preset--color--plate-green)) 27px 50% / 7px 15px no-repeat;
}

.dp-header.is-scrolled {
	box-shadow: 0 10px 30px -10px rgb(0 0 0 / 0.6);
}

.dp-footer-list {
	list-style: none;
}

/* ---------- Categoriefilter ---------- */

.wp-block-categories.dp-chips {
	list-style: none;
	padding: 0;
	margin-top: 1.5rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.wp-block-categories.dp-chips a {
	display: inline-flex;
	align-items: center;
	min-height: 2.5rem;
	padding: 0 1rem;
	border: 2px solid var(--wp--preset--color--graphite);
	border-radius: 999px;
	text-decoration: none;
	font: 700 0.9375rem/1 var(--wp--preset--font-family--condensed);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.wp-block-categories.dp-chips a:hover,
.wp-block-categories.dp-chips .current-cat a {
	background: var(--wp--preset--color--plate-yellow);
	border-color: var(--wp--preset--color--plate-yellow);
	color: var(--wp--preset--color--iron);
}

/* ---------- Menu: hamburger tot 1100px ---------- */

@media (max-width: 1100px) {
	.dp-header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}

	.dp-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none !important;
	}
}

.dp-header .wp-block-navigation__responsive-container-open svg,
.dp-header .wp-block-navigation__responsive-container-close svg {
	width: 32px;
	height: 32px;
}

/* ---------- Hero: stang met schijven ---------- */

.dp-hero::after {
	content: "";
	position: absolute;
	z-index: 0;
	right: -2vw;
	top: 4%;
	width: min(40vw, 560px);
	aspect-ratio: 1 / 1;
	pointer-events: none;
	opacity: 0.95;
	background:
		/* stang */
		linear-gradient(#5b5e66, #5b5e66) 0 50% / 100% 3.2% no-repeat,
		/* kraag */
		linear-gradient(#9a9ca3, #9a9ca3) 22% 50% / 3% 9% no-repeat,
		/* schijven: rood 25, rood 25, blauw 20, geel 15, groen 10 */
		linear-gradient(var(--wp--preset--color--plate-red), var(--wp--preset--color--plate-red)) 30% 50% / 7% 78% no-repeat,
		linear-gradient(var(--wp--preset--color--plate-red), var(--wp--preset--color--plate-red)) 38.5% 50% / 7% 78% no-repeat,
		linear-gradient(var(--wp--preset--color--plate-blue), var(--wp--preset--color--plate-blue)) 47% 50% / 6.4% 78% no-repeat,
		linear-gradient(var(--wp--preset--color--plate-yellow), var(--wp--preset--color--plate-yellow)) 55% 50% / 5.6% 78% no-repeat,
		linear-gradient(var(--wp--preset--color--plate-green), var(--wp--preset--color--plate-green)) 62.5% 50% / 4.8% 78% no-repeat;
	mask: linear-gradient(90deg, #000 70%, transparent);
}

.dp-hero .wp-block-cover__inner-container {
	position: relative;
	z-index: 1;
}

@media (max-width: 900px) {
	.dp-hero::after {
		width: 80vw;
		right: -30vw;
		top: 4%;
		opacity: 0.35;
	}
}

/* Intro's links uitlijnen binnen de brede kolom. */
.is-style-dp-lead.alignwide {
	max-width: 64ch !important;
	margin-left: max(0px, calc((100% - var(--wp--style--global--wide-size)) / 2)) !important;
	margin-right: auto !important;
}

@media (max-width: 600px) {
	.dp-regiogrid__tile {
		min-height: 92px;
		gap: 0.75rem;
		padding: 0.8rem 0.85rem;
	}

	.dp-regiogrid__name {
		font-size: 1.25rem;
	}
}

h1, h2, h3, .dp-meet__title, .dp-gymcard__title {
	overflow-wrap: break-word;
}

.dp-meet__title, .dp-gymcard__title {
	hyphens: auto;
}

@media (max-width: 600px) {
	.dp-meet {
		grid-template-columns: 4.25rem 1fr;
		gap: 0.9rem;
		padding-right: 0.9rem;
	}

	.dp-meet__day {
		font-size: 1.75rem;
	}
}
