/*
 * Vormgeving Paardenmarkt: de voorpagina van een marktkrant op geel papier, met de kleuren van
 * de oude site (goudgeel, oranje, rood) en Baloo 2. Donkere tekst op geel en oranje, wit alleen
 * op het diepe rood.
 */

:root {
	--pm-geel: #ffd200;
	--pm-oranje: #ffaf00;
	--pm-rood: #ff2800;
	--pm-rood-diep: #c21f00;
	--pm-rood-donker: #9c1800;
	--pm-creme: #ffe9c4;
	--pm-papier: #fff6e3;
	--pm-inkt: #2b2118;
	--pm-tekst: #3d3229;
	--pm-breed: 1180px;
	--pm-r-klein: 0.875rem;
	--pm-r-midden: 1.25rem;
	--pm-r-groot: 1.75rem;
	--pm-golf: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 60' preserveAspectRatio='none'%3E%3Cpath d='M0 34 C150 4 300 64 450 34 S750 4 900 34 S1050 64 1200 34 V60 H0Z' fill='%23c21f00'/%3E%3C/svg%3E");
	--pm-golf-licht: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 60' preserveAspectRatio='none'%3E%3Cpath d='M0 26 C150 56 300 -4 450 26 S750 56 900 26 S1050 -4 1200 26 V60 H0Z' fill='%23ff2800'/%3E%3C/svg%3E");
}

html { scrollbar-color: var(--pm-rood-diep) var(--pm-creme); scroll-padding-top: 1rem; }
body { margin: 0; overflow-x: clip; }
::selection { background: var(--pm-rood-diep); color: #fff; }

img { max-width: 100%; height: auto; }
a { text-underline-offset: 0.18em; text-decoration-thickness: 2px; }

/* Zichtbare focus, overal. Op donkere vlakken licht, anders donker. */
:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--pm-inkt);
	outline-offset: 3px;
}
:where(.pm-kopregel, .pm-vlak--rood, .pm-voet) :where(a, button):focus-visible { outline-color: #fff; }

.screenreader-only {
	position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.pm-weg { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pm-skip {
	position: absolute; left: 0.5rem; top: -4rem; z-index: 100; padding: 0.6rem 1rem;
	background: var(--pm-inkt); color: #fff; font-weight: 800; border-radius: 0.5rem;
}
.pm-skip:focus { top: 0.5rem; }

/* ---------------------------------------------------------------- kop en menu */

.pm-kop { background: var(--pm-creme); border-bottom: 3px solid var(--pm-inkt); }
.pm-kop__binnen {
	max-width: var(--pm-breed); margin-inline: auto; padding: 0.5rem 1rem; gap: 0.5rem 2rem;
}
.pm-logo { display: block; line-height: 0; text-decoration: none; }
.pm-logo img { display: block; width: clamp(180px, 28vw, 300px); height: auto; }

.pm-menu { margin-left: auto; }
.pm-menu__lijst { display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; margin: 0; padding: 0; list-style: none; }
.pm-menu__item a {
	display: block; padding: 0.5rem 0.9rem; font-weight: 800; font-size: 1.125rem; text-decoration: none;
	color: var(--pm-inkt); border-bottom: 4px solid transparent;
}
.pm-menu__item a:hover { border-bottom-color: var(--pm-rood-diep); }
.pm-menu__item a[aria-current="page"] { border-bottom-color: var(--pm-rood-diep); color: var(--pm-rood-diep); }
.pm-menuknop {
	display: none; align-items: center; gap: 0.5rem; min-height: 48px; padding: 0.4rem 1rem;
	font: inherit; font-weight: 800; color: var(--pm-inkt); background: var(--pm-geel);
	border: 3px solid var(--pm-inkt); border-radius: 0.5rem; cursor: pointer;
}
.pm-menuknop:hover { background: var(--pm-oranje); }

@media (max-width: 767px) {
	.js .pm-menuknop { display: inline-flex; }
	.pm-menu { margin-left: 0; }
	.js .pm-menu__lijst { display: none; flex-direction: column; margin-top: 0.5rem; }
	.js .pm-menu__lijst.is-open { display: flex; }
	.pm-menu__item a { padding-block: 0.75rem; }
	.pm-kop__binnen { justify-content: space-between; }
}

/* ---------------------------------------------------------------- binnenpagina's: kop */

.pm-paginakop {
	background: linear-gradient(180deg, var(--pm-geel), var(--pm-oranje));
	padding: clamp(1.5rem, 4vw, 3rem) 0 clamp(2.75rem, 6vw, 4.5rem);
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 1.75rem), 0 100%);
}
.pm-paginakop__binnen { box-sizing: border-box; max-width: var(--pm-breed); margin-inline: auto; padding-inline: 1rem; }
.pm-paginakop h1 { margin: 0; font-size: clamp(2.25rem, 6vw, 4rem); text-wrap: balance; color: var(--pm-inkt); }
.pm-paginakop__onder { margin: 0.5rem 0 0; max-width: 40rem; font-size: 1.25rem; font-weight: 600; color: var(--pm-inkt); }

main#inhoud { padding-bottom: 2rem; }
.home main#inhoud { padding-bottom: 0; }
.pm-gewoon { padding-block: 2rem; }

/* ---------------------------------------------------------------- de voorpagina: kopregel */

.pm-kopregel { background: var(--pm-inkt); color: var(--pm-creme); border-bottom: 3px double var(--pm-creme); }
.pm-kopregel__binnen {
	max-width: var(--pm-breed); margin-inline: auto; padding: 0.55rem 1rem;
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.25rem 1.5rem; line-height: 1.25;
}
.pm-kopregel p { margin: 0; font-weight: 600; line-height: 1.25; }
.pm-kopregel strong { font-weight: 800; color: var(--pm-geel); }

.pm-klok { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 1rem; color: var(--pm-creme); line-height: 1.25; }
.pm-klok p { margin: 0; }
.pm-klok__kop { font-weight: 600; }
.pm-klok__kop time { font-weight: 800; color: var(--pm-geel); }
.pm-klok__tekst { font-weight: 800; color: var(--pm-geel); }
.pm-klok__delen { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; margin: 0; padding: 0; list-style: none; }
.pm-klok__delen[hidden] { display: none; }
.pm-klok__delen li { display: flex; align-items: baseline; gap: 0.25rem; }
.pm-klok__getal { font-size: 1.5rem; font-weight: 800; line-height: 1; color: var(--pm-geel); font-variant-numeric: tabular-nums; }
.pm-klok__voorlopig { font-weight: 600; font-size: 0.9375rem; }

/* Op een lichte pagina (Programma) staat de klok in inkt en diep rood, niet in crème en geel. */
.pm-gewoon .pm-klok, .pm-gewoon .pm-klok__kop { color: var(--pm-inkt); }
.pm-gewoon .pm-klok__kop time, .pm-gewoon .pm-klok__getal, .pm-gewoon .pm-klok__tekst { color: var(--pm-rood-diep); }
.pm-gewoon .pm-klok { margin-bottom: 1.25rem; padding: 0.75rem 1rem; background: var(--pm-creme); border: 2px solid var(--pm-inkt); border-radius: 0.5rem; }
.pm-klok__label { font-size: 0.875rem; }

/* ---------------------------------------------------------------- de voorpagina: de krant */

.pm-krant {
	position: relative; background: linear-gradient(180deg, var(--pm-geel), var(--pm-oranje));
	padding: clamp(1.5rem, 4vw, 3rem) 0 clamp(4rem, 8vw, 6rem);
}
.pm-krant__binnen { max-width: var(--pm-breed); margin-inline: auto; padding-inline: 1rem; position: relative; z-index: 1; }

.pm-krant__kopvlak { display: grid; gap: 1.25rem 2rem; align-items: center; grid-template-columns: 1fr; margin-bottom: 1.5rem; }
.pm-krant__kop {
	margin: 0; padding: 0.15em 0; border-block: 4px double var(--pm-inkt); color: var(--pm-inkt);
	font-size: clamp(2.25rem, 6vw, 4.25rem); line-height: 1.05; text-wrap: balance;
}
.pm-krant__lead { margin: 0.75rem 0 0; font-size: 1.375rem; font-weight: 600; color: var(--pm-inkt); max-width: 36rem; }
.pm-krant__foto { margin: 0; }
.pm-krant__foto img {
	display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
	border: 3px solid var(--pm-inkt); box-shadow: 0 8px 18px rgba(43, 33, 24, 0.28);
}
.pm-krant__foto figcaption { margin-top: 0.4rem; font-size: 0.9375rem; font-weight: 600; color: var(--pm-inkt); }

.pm-krant__rij { display: grid; gap: 1.5rem; grid-template-columns: 1fr; align-items: start; }
.pm-krant__kolommen {
	display: grid; grid-template-columns: 1fr; background: var(--pm-papier);
	border: 3px solid var(--pm-inkt); box-shadow: 0 8px 18px rgba(43, 33, 24, 0.22);
}
.pm-krant__kolom { padding: 1.25rem 1.5rem 1.5rem; border-bottom: 1px solid var(--pm-inkt); }
.pm-krant__kolom:nth-child(3) { border-bottom: 0; }
.pm-krant__noot { grid-column: 1 / -1; margin: 0; padding: 0.6rem 1.5rem; font-weight: 600; color: var(--pm-inkt); background: var(--pm-creme); border-top: 1px solid var(--pm-inkt); }
.pm-krant__kolom h2 { margin: 0 0 0.5rem; font-size: 1.5rem; color: var(--pm-rood-diep); }
.pm-krant__kolom p { margin: 0 0 0.75rem; color: var(--pm-inkt); }
.pm-krant__kolom ul { margin: 0 0 0.75rem; padding-left: 1.25rem; color: var(--pm-inkt); }
.pm-krant__kolom li { margin-bottom: 0.25rem; }

/* De advertentie: dubbele rand en een stippellijn erbinnen, zoals een aankondiging in de krant. */
.pm-advertentie {
	position: relative; padding: 1rem 1.25rem 1.1rem; text-align: center; background: #fff; color: var(--pm-inkt);
	border: 4px double var(--pm-inkt); box-shadow: 0 8px 18px rgba(43, 33, 24, 0.22);
}
.pm-advertentie::before {
	content: ""; position: absolute; inset: 8px; border: 2px dotted var(--pm-rood-diep); pointer-events: none;
}
.pm-advertentie h2 { margin: 0 0 0.25rem; font-size: clamp(1.5rem, 2.4vw, 1.875rem); color: var(--pm-inkt); }
.pm-advertentie p { margin: 0 0 0.5rem; color: var(--pm-inkt); }
.pm-advertentie .pm-status { margin: 0 0 0.6rem; font-size: 0.9375rem; }
.pm-advertentie img { display: block; margin: 0 auto 0.25rem; max-height: 84px; width: auto; }
.pm-advertentie > * { margin-block: 0; }
.pm-advertentie > * + * { margin-block-start: 0.25rem; }
.pm-advertentie .wp-block-buttons { justify-content: center; }

@media (min-width: 768px) {
	.pm-krant__kopvlak { grid-template-columns: 2fr 1fr; }
	.pm-krant__kolommen { grid-template-columns: repeat(3, 1fr); }
	.pm-krant__kolom { border-bottom: 0; border-right: 1px solid var(--pm-inkt); }
	.pm-krant__kolom:nth-child(3) { border-right: 0; }
	.pm-krant__foto { transform: rotate(1.2deg); }
}
@media (min-width: 1000px) {
	.pm-krant__rij { grid-template-columns: 2.1fr 1fr; }
}
@media (max-width: 999px) {
	/* Op tablet en telefoon staat de advertentie direct onder de kop, daarna het programma, en de foto sluit af. */
	.pm-krant__binnen { display: flex; flex-direction: column; gap: 1.5rem; }
	.pm-krant__kopvlak, .pm-krant__rij { display: contents; }
	.pm-krant__kopvlak > :first-child { order: 1; }
	.pm-krant__rij .pm-advertentie { order: 2; }
	.pm-krant__kolommen { order: 3; }
	.pm-krant__foto { order: 4; }
}
@media (min-width: 768px) and (max-width: 999px) {
	.pm-krant__kolommen { grid-template-columns: repeat(2, 1fr); }
	.pm-krant__kolom:nth-child(2) { border-right: 0; }
	.pm-krant__kolom:nth-child(3) { grid-column: 1 / -1; border-top: 1px solid var(--pm-inkt); border-right: 0; }
}

/* ---------------------------------------------------------------- rood vlak met golfrand: de historie */

.pm-vlak--rood {
	position: relative; background: var(--pm-rood-diep); color: #fff;
	padding: clamp(4rem, 8vw, 6rem) 0 clamp(3rem, 6vw, 4.5rem); margin-top: -1px;
}
.pm-vlak--rood::before,
.pm-vlak--rood::after {
	content: ""; position: absolute; left: 0; right: 0; height: 60px; background-repeat: repeat-x; background-size: 1200px 60px;
}
.pm-vlak--rood::before { top: -59px; background-image: var(--pm-golf-licht); background-position: 200px bottom; }
.pm-vlak--rood::after { top: -45px; background-image: var(--pm-golf); background-position: left bottom; }
.pm-vlak--rood__binnen {
	position: relative; z-index: 1; max-width: var(--pm-breed); margin-inline: auto; padding-inline: 1rem;
	display: grid; gap: 1.5rem 3rem; align-items: center; grid-template-columns: 1fr;
}
.pm-vlak--rood h2, .pm-vlak--rood h3 { color: #fff; margin-top: 0; }
.pm-vlak--rood h2 { font-size: clamp(2rem, 4vw, 2.75rem); }
.pm-vlak--rood p { color: #fff; font-size: 1.1875rem; }
.pm-vlak--rood a { color: #fff; }
.pm-vlak--rood figure { margin: 0; }
.pm-vlak--rood figure img { display: block; width: 100%; border: 3px solid #fff; background: var(--pm-papier); }
.pm-vlak--rood figcaption { margin-top: 0.4rem; font-size: 0.9375rem; color: #fff; }
.pm-vlak--rood .wp-block-button__link { background: #fff; color: var(--pm-rood-donker); }
.pm-vlak--rood .wp-block-button__link:hover { background: var(--pm-creme); }
@media (min-width: 900px) { .pm-vlak--rood__binnen { grid-template-columns: 1.1fr 1fr; } }

/* ---------------------------------------------------------------- knoppen */

.wp-block-button__link, .pm-knop {
	display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0.55rem 1.5rem;
	font: inherit; font-weight: 800; font-size: 1.125rem; text-decoration: none; cursor: pointer;
	background: var(--pm-rood-diep); color: #fff; border: 3px solid var(--pm-rood-diep); border-radius: 0.5rem;
}
.wp-block-button__link:hover, .pm-knop:hover { background: var(--pm-rood-donker); border-color: var(--pm-rood-donker); color: #fff; }
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--pm-inkt); border-color: var(--pm-inkt); }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--pm-geel); color: var(--pm-inkt); }

/* ---------------------------------------------------------------- formulier en meldingen */

.pm-formulier { max-width: 40rem; }
.pm-veld { margin: 0 0 1.25rem; }
.pm-veld label { display: block; margin-bottom: 0.3rem; font-weight: 800; color: var(--pm-inkt); }
.pm-optioneel { font-weight: 400; font-size: 0.9375rem; }
.pm-verplicht { color: var(--pm-rood-diep); }
.pm-formulier :where(input[type="text"], input[type="email"], input[type="tel"], input[type="number"], textarea, select) {
	box-sizing: border-box; width: 100%; min-height: 48px; padding: 0.5rem 0.75rem; font: inherit; color: var(--pm-inkt);
	background: #fff; border: 2px solid var(--pm-inkt); border-radius: 0.375rem;
}
.pm-formulier textarea { min-height: 9rem; }
.pm-formulier [aria-invalid="true"] { border-color: var(--pm-rood-diep); border-width: 3px; }
.pm-fout { margin: 0.35rem 0 0; font-weight: 800; color: var(--pm-rood-diep); }
.pm-fout::before { content: "Let op: "; }
.pm-fouten { max-width: 40rem; margin: 0 0 1.25rem; padding: 0.9rem 1.25rem; background: #fff; color: var(--pm-inkt); border: 3px solid var(--pm-rood-diep); border-radius: 0.5rem; }
.pm-fouten p { margin: 0 0 0.4rem; }
.pm-fouten ul { margin: 0; padding-left: 1.25rem; }
.pm-fouten a { font-weight: 800; }
.pm-totaal { margin: 0 0 1.25rem; padding: 0.6rem 0.9rem; font-weight: 600; background: var(--pm-creme); border: 2px dashed var(--pm-inkt); border-radius: 0.375rem; color: var(--pm-inkt); }
.pm-totaal output { font-weight: 800; font-size: 1.25rem; }
.pm-kleintje { font-size: 0.9375rem; }
.pm-melding {
	max-width: 40rem; padding: 1.25rem 1.5rem; background: var(--pm-creme); color: var(--pm-inkt);
	border: 3px solid var(--pm-inkt); border-radius: 0.5rem;
}
.pm-melding h2 { margin-top: 0; font-size: 1.5rem; }
.pm-melding--goed { background: #fff; border-color: var(--pm-rood-diep); }

/* ---------------------------------------------------------------- tijdlijn */

.pm-tijdlijn { margin-block: 2rem; }
.pm-tijdlijn__deel { margin-bottom: 3rem; }
.pm-tijdlijn__kop { margin: 0 0 1.25rem; font-size: 1.75rem; color: var(--pm-inkt); }
.pm-tijdlijn__lijst { position: relative; margin: 0; padding: 0 0 0 2.25rem; list-style: none; }
.pm-tijdlijn__lijst::before {
	content: ""; position: absolute; top: 0; bottom: 0; left: 0.5rem; width: 4px; background: var(--pm-inkt);
}
.pm-tijdlijn__item { position: relative; margin-bottom: 1.5rem; }
.pm-tijdlijn__item::before {
	content: ""; position: absolute; top: 0.9rem; left: -2.25rem; width: 1.25rem; height: 1.25rem; box-sizing: border-box;
	border-radius: 50%; background: var(--pm-geel); border: 3px solid var(--pm-inkt);
}
.pm-tijdlijn__jaar {
	display: inline-block; margin-bottom: 0.4rem; padding: 0.05rem 0.85rem; font-weight: 800; font-size: 1.125rem;
	color: var(--pm-inkt); background: var(--pm-geel); border: 2px solid var(--pm-inkt); border-radius: 999px;
}
.pm-tijdlijn__kaart { padding: 0.9rem 1.25rem 1rem; background: var(--pm-creme); border: 2px solid var(--pm-inkt); border-radius: 0.75rem; }
.pm-tijdlijn__kaart h4 { margin: 0 0 0.3rem; font-size: 1.25rem; color: var(--pm-inkt); }
.pm-tijdlijn__kaart p { margin: 0 0 0.4rem; color: var(--pm-inkt); }
.pm-tijdlijn__bron { font-size: 0.9375rem; font-style: italic; }
.pm-tijdlijn__item--groot .pm-tijdlijn__kaart { background: #fff; border: 4px solid var(--pm-rood-diep); padding: 1.1rem 1.4rem 1.2rem; }
.pm-tijdlijn__item--groot .pm-tijdlijn__kaart h4 { font-size: 1.5rem; color: var(--pm-rood-diep); }
.pm-tijdlijn__item--groot .pm-tijdlijn__jaar { background: var(--pm-rood-diep); color: #fff; border-color: var(--pm-rood-diep); font-size: 1.375rem; }
.pm-tijdlijn__item--groot::before { background: var(--pm-rood-diep); border-color: var(--pm-inkt); }

@media (min-width: 768px) {
	.pm-tijdlijn__lijst { padding-left: 0; }
	.pm-tijdlijn__lijst::before { left: 50%; transform: translateX(-50%); }
	.pm-tijdlijn__item { width: calc(50% - 2.5rem); }
	.pm-tijdlijn__item:nth-child(even) { margin-left: calc(50% + 2.5rem); margin-top: -3rem; }
	.pm-tijdlijn__item::before { left: auto; right: calc(-2.5rem - 0.625rem); }
	.pm-tijdlijn__item:nth-child(even)::before { right: auto; left: calc(-2.5rem - 0.625rem); }
	.pm-tijdlijn__item:nth-child(odd) { text-align: right; }
	.pm-tijdlijn__item:nth-child(odd) .pm-tijdlijn__kaart { text-align: left; }
}

/* Het kaartje schuift licht omhoog als het in beeld komt. Alleen met beweging aan, en de kaartjes
   zijn altijd zichtbaar: er wordt niets verborgen. */
@media (prefers-reduced-motion: no-preference) {
	@supports (animation-timeline: view()) {
		.pm-tijdlijn__item { animation: pm-op 1s linear both; animation-timeline: view(); animation-range: entry 0% entry 35%; }
		@keyframes pm-op { from { transform: translateY(18px); } to { transform: none; } }
	}
}

/* ---------------------------------------------------------------- voet */

.pm-voet { background: var(--pm-inkt); color: var(--pm-creme); margin-top: 0; }
.pm-voet__binnen { max-width: var(--pm-breed); margin-inline: auto; padding: 1.5rem 1rem; gap: 0.5rem 2rem; }
.pm-voet p { margin: 0; }
.pm-voet a { color: var(--pm-creme); }

/* Blokken in een raster of vlak krijgen geen extra afstand van de blokafstand van WordPress. */
.wp-site-blocks > * { margin-block: 0; }
.pm-kopregel, .pm-kopregel__binnen > *, .pm-krant, .pm-vlak--rood, .pm-krant__kolommen > *, .pm-krant__kopvlak > *, .pm-krant__rij > *,
.pm-vlak--rood__binnen > *, .pm-contact > *, .pm-knipsels > * { margin-block: 0; }
.pm-krant__kolom > * + * { margin-block-start: 0.5rem; }

/* Binnenpagina's */
.pm-gewoon { max-width: var(--pm-breed); margin-inline: auto; padding-inline: 1rem; }
.pm-gewoon > :where(p, ul, ol, h2, h3, figure, .wp-block-buttons) { max-width: 46rem; }
.pm-gewoon > .pm-tijdlijn, .pm-gewoon > .pm-knipsels, .pm-gewoon > .pm-contact { max-width: none; }
.pm-gewoon > :where(h2) { margin-top: 2.5rem; margin-bottom: 0.75rem; }
.pm-gewoon > :where(h3) { margin-top: 1.75rem; margin-bottom: 0.4rem; }
.pm-gewoon .wp-block-image img { display: block; border: 2px solid var(--pm-inkt); }
.pm-gewoon .wp-block-image figcaption { font-size: 0.9375rem; margin-top: 0.4rem; }
.pm-gewoon .wp-block-table table { width: 100%; border-collapse: collapse; background: #fff; }
.pm-gewoon .wp-block-table th, .pm-gewoon .wp-block-table td { padding: 0.6rem 0.9rem; text-align: left; vertical-align: top; border: 2px solid var(--pm-inkt); }
.pm-gewoon .wp-block-table th { background: var(--pm-creme); width: 11rem; color: var(--pm-inkt); }
@media (max-width: 640px) {
	/* Op een telefoon staat de kop van een rij boven de waarde, zodat de tekst niet in smalle stukjes breekt. */
	.pm-gewoon .wp-block-table :is(tbody, tr, th, td) { display: block; width: auto; }
	.pm-gewoon .wp-block-table th { width: auto; border-bottom: 0; padding-bottom: 0.2rem; }
	.pm-gewoon .wp-block-table td { border-top: 0; padding-top: 0.2rem; }
	.pm-gewoon .wp-block-table tr + tr th { border-top: 2px solid var(--pm-inkt); }
}
.pm-status { margin: 0 0 1rem; }
.pm-weetjes { padding: 0.5rem 1.5rem; max-width: 46rem; background: var(--pm-creme); border: 3px solid var(--pm-inkt); border-radius: 0.5rem; }
.pm-weetjes ul { padding-left: 1.25rem; }
.pm-knipsels { display: grid; gap: 1.5rem; grid-template-columns: 1fr; margin-block: 1rem !important; }
.pm-knipsels figure { margin: 0; }
.pm-knipsels img { width: 100%; height: auto; background: var(--pm-papier); }
.pm-contact { display: grid; gap: 2rem 3rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .pm-knipsels { grid-template-columns: 1fr 1.3fr; align-items: start; } }
@media (min-width: 960px) { .pm-contact { grid-template-columns: 1.15fr 1fr; align-items: start; } }

/* Gewone tekst op binnenpagina's */
.entry-content h2, .wp-block-post-content h2 { margin-top: 2.25rem; }
.wp-block-post-content > p, .wp-block-post-content > ul, .wp-block-post-content > ol { max-width: 44rem; }

/* ---------------------------------------------------------------- vormen: rond en vriendelijk */

/* Alles wat een rand heeft is afgerond. Knoppen en pillen zijn helemaal rond, kaders krijgen grote hoeken. */
.wp-block-button__link, .pm-knop, .pm-menuknop, .pm-skip { border-radius: 999px; }
.wp-block-button__link, .pm-knop { padding-inline: 1.75rem; }
.pm-menu__item a { border-bottom: 0; border-radius: 999px; padding: 0.5rem 1.1rem; }
.pm-menu__item a:hover { background: var(--pm-geel); color: var(--pm-inkt); }
.pm-menu__item a[aria-current="page"] { background: var(--pm-geel); color: var(--pm-inkt); box-shadow: inset 0 0 0 2px var(--pm-inkt); }

.pm-formulier :where(input[type="text"], input[type="email"], input[type="tel"], input[type="number"], textarea, select) { border-radius: var(--pm-r-klein); padding-inline: 1rem; }
.pm-totaal, .pm-fouten, .pm-gewoon .pm-klok { border-radius: var(--pm-r-klein); }
.pm-melding, .pm-weetjes { border-radius: var(--pm-r-midden); }

/* De krant: kolommen, advertentie en foto zijn zachte kaarten. */
.pm-krant__kolommen { border-radius: var(--pm-r-groot); overflow: hidden; }
.pm-advertentie { border-radius: var(--pm-r-groot); }
.pm-advertentie::before { border-radius: calc(var(--pm-r-groot) - 0.6rem); }
.pm-krant__foto img { border-radius: var(--pm-r-midden); }
.pm-krant__kop { border-radius: 0.5rem; }

/* Het rode vlak en de binnenpagina's: geen scherpe hoeken. */
.pm-vlak--rood figure img, .pm-gewoon .wp-block-image img, .pm-knipsels img { border-radius: var(--pm-r-klein); }
.pm-paginakop { clip-path: none; border-radius: 0 0 50% 50% / 0 0 2.25rem 2.25rem; padding-bottom: clamp(2.25rem, 5vw, 3.5rem); }
.pm-kopregel { border-radius: 0 0 var(--pm-r-groot) var(--pm-r-groot); }

/* Tabellen: een afgeronde omlijsting, binnenin dunne lijnen. */
.pm-gewoon .wp-block-table { border: 2px solid var(--pm-inkt); border-radius: var(--pm-r-midden); overflow: hidden; background: #fff; }
.pm-gewoon .wp-block-table table { border: 0; }
.pm-gewoon .wp-block-table th, .pm-gewoon .wp-block-table td { border-width: 0 2px 2px 0; }
.pm-gewoon .wp-block-table tr:last-child :is(th, td) { border-bottom-width: 0; }
.pm-gewoon .wp-block-table :is(th:last-child, td:last-child) { border-right-width: 0; }
@media (max-width: 640px) {
	.pm-gewoon .wp-block-table th { border-width: 0 0 0 0; }
	.pm-gewoon .wp-block-table td { border-width: 0 0 2px 0; }
	.pm-gewoon .wp-block-table tr:last-child td { border-bottom-width: 0; }
	.pm-gewoon .wp-block-table tr + tr th { border-top: 2px solid var(--pm-inkt); }
}

/* Tijdlijn: ronde kaartjes en een lijn met ronde uiteinden. */
.pm-tijdlijn__kaart { border-radius: var(--pm-r-midden); }
.pm-tijdlijn__item--groot .pm-tijdlijn__kaart { border-radius: var(--pm-r-groot); }
.pm-tijdlijn__lijst::before { border-radius: 999px; }

/* Het totaalblokje en de lijst met fouten ademen wat meer. */
.pm-totaal { padding: 0.7rem 1.1rem; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0s !important; transition-duration: 0s !important; scroll-behavior: auto !important; }
}
