/*
 * SebKijk: de opmaak van het thema (mock-up 1b).
 *
 * Kleuren en letters alleen via de tokens hieronder. Maten in pixels.
 * Rond: knoppen 999px, vlakken 12px. Inhoud maximaal 1280px, zijbalk 320px.
 *
 * Inhoud
 *  1. Tokens
 *  2. Basis
 *  3. Hulpklassen en knoppen
 *  4. Kop
 *  5. Kolommen en zijbalk
 *  6. Lijst van berichten
 *  7. Homepage
 *  8. Los bericht of pagina
 *  9. Teksten, Nieuwsarchief, Studio en Filmdagboek
 * 9b. Diensten en Educatie
 * 9c. Doneren, Contact en English
 * 9d. Over SebKijk
 * 9e. Filmbibliotheek en filmpagina
 * 9f. Lijsten, zoeken, 404 en de telefoon
 * 10. Voet
 * 11. Telefoon en tablet
 */

/* 1. Tokens ------------------------------------------------------------- */

:root {
	--sk-rood: #d7261e;
	--sk-rood-donker: #b01e17;
	--sk-inkt: #1a1a1a;
	--sk-zacht: #5b5955;
	--sk-lijn: #e6e3de;
	--sk-vlak: #f7f5f1;
	--sk-serif: "Lora", Georgia, serif;
	--sk-sans: "Work Sans", system-ui, sans-serif;

	/* Afgeleid uit de mock-up. */
	--sk-wit: #ffffff;
	--sk-tekst: #444444;     /* lopende tekst in kaarten */
	--sk-rand: #cfc9c0;      /* rand van zoekvak en ronde knoppen */
	--sk-lijn-licht: #efece7; /* scheidingslijn binnen een blok */
	--sk-beeld-leeg: #ebe7e0; /* vlak waar nog geen beeld is */
	--sk-donker-vlak: #2b2b2b; /* leeg beeld op het zwarte vlak */
	--sk-rood-licht: #fbeceb;  /* vlak van Steun SebKijk */
	--sk-schaduw: 0 8px 24px rgba(26, 26, 26, .08);
}

/* 2. Basis -------------------------------------------------------------- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	background: var(--sk-wit);
	color: var(--sk-inkt);
	font: 400 16px/1.6 var(--sk-sans);
}

img,
video,
iframe {
	max-width: 100%;
	height: auto;
}

a {
	color: var(--sk-rood-donker);
	text-decoration: none;
}

a:hover {
	color: var(--sk-inkt);
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible {
	outline: 2px solid var(--sk-rood);
	outline-offset: 2px;
}

h1,
h2,
h3,
h4 {
	font-family: var(--sk-serif);
	font-weight: 600;
	line-height: 1.25;
	text-wrap: pretty;
}

/* 3. Hulpklassen en knoppen -------------------------------------------- */

.sk-verborgen,
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	white-space: nowrap;
}

.sk-overslaan {
	position: absolute;
	left: 16px;
	top: -100px;
	z-index: 100;
	padding: 10px 16px;
	border-radius: 999px;
	background: var(--sk-inkt);
	color: var(--sk-wit);
	font: 600 13px var(--sk-sans);
}

.sk-overslaan:focus {
	top: 16px;
	color: var(--sk-wit);
}

.sk-breedte {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px;
}

.sk-pil,
.sk-verder a {
	display: inline-block;
	padding: 10px 18px;
	border-radius: 999px;
	background: var(--sk-vlak);
	color: var(--sk-inkt);
	font: 600 13px/1.2 var(--sk-sans);
}

.sk-pil:hover,
.sk-verder a:hover {
	background: var(--sk-lijn);
	color: var(--sk-inkt);
}

.sk-pil--rood {
	padding: 9px 16px;
	background: var(--sk-rood);
	color: var(--sk-wit);
}

.sk-pil--rood:hover {
	background: var(--sk-rood-donker);
	color: var(--sk-wit);
}

.sk-pil--inkt {
	padding: 11px 20px;
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-pil--inkt:hover {
	background: var(--sk-rood-donker);
	color: var(--sk-wit);
}

/* Waar een bericht geen uitgelicht beeld heeft. */
.sk-beeld-leeg {
	display: block;
	width: 100%;
	height: 100%;
	background: var(--sk-beeld-leeg);
}

/* Zoekvak: ronde balk met "Zoek" erachter. */
.sk-zoeken {
	display: flex;
	border: 1px solid var(--sk-rand);
	border-radius: 999px;
	overflow: hidden;
	background: var(--sk-wit);
}

.sk-zoeken__veld {
	flex: 1;
	min-width: 0;
	border: 0;
	padding: 11px 16px;
	background: transparent;
	color: var(--sk-inkt);
	font: 400 13px var(--sk-sans);
}

.sk-zoeken__veld:focus-visible {
	outline: 0;
}

.sk-zoeken:focus-within {
	border-color: var(--sk-inkt);
}

.sk-zoeken__knop {
	border: 0;
	padding: 11px 16px;
	background: var(--sk-vlak);
	color: var(--sk-inkt);
	font: 600 13px var(--sk-sans);
	cursor: pointer;
}

.sk-zoeken__knop:hover {
	background: var(--sk-lijn);
}

/* 4. Kop ---------------------------------------------------------------- */

.sk-kop__binnen {
	max-width: 1280px;
	margin: 0 auto;
	padding: 16px 40px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

body:not(.home) .sk-kop {
	border-bottom: 1px solid var(--sk-lijn);
}

.sk-kop__logo {
	flex: none;
	line-height: 0;
}

.sk-kop .custom-logo {
	display: block;
	height: 60px;
	width: auto;
}

body:not(.home) .sk-kop .custom-logo {
	height: 52px;
}

.sk-hoofdmenu__lijst {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
	font: 500 14px/1.2 var(--sk-sans);
}

.sk-hoofdmenu__lijst a {
	display: block;
	padding: 8px 12px;
	border-radius: 999px;
	color: var(--sk-inkt);
	white-space: nowrap;
}

.sk-hoofdmenu__lijst a:hover {
	background: var(--sk-vlak);
}

.sk-hoofdmenu__lijst .current-menu-item > a,
.sk-hoofdmenu__lijst .current_page_item > a,
.sk-hoofdmenu__lijst .current-menu-parent > a {
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-kop__acties {
	flex: none;
	display: flex;
	align-items: center;
	gap: 8px;
}

/* Zoeken in de kop: een rond knopje dat een zoekvak openklapt. */
.sk-zoekknop {
	position: relative;
}

.sk-zoekknop__knop {
	width: 36px;
	height: 36px;
	display: grid;
	place-items: center;
	border: 1px solid var(--sk-rand);
	border-radius: 50%;
	color: var(--sk-inkt);
	cursor: pointer;
	list-style: none;
}

.sk-zoekknop__knop::-webkit-details-marker {
	display: none;
}

.sk-zoekknop[open] .sk-zoekknop__knop,
.sk-zoekknop__knop:hover {
	background: var(--sk-vlak);
}

.sk-zoekknop__vak {
	position: absolute;
	right: 0;
	top: 46px;
	z-index: 20;
	width: 320px;
	padding: 12px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
	background: var(--sk-wit);
	box-shadow: var(--sk-schaduw);
}

/* 5. Kolommen en zijbalk ----------------------------------------------- */

.sk-kolommen {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 40px;
	padding-top: 44px;
}

.sk-kolommen:not(:has(.sk-zijbalk)) {
	grid-template-columns: minmax(0, 1fr);
}

.sk-hoofd {
	min-width: 0;
}

.sk-zijbalk {
	display: flex;
	flex-direction: column;
	gap: 16px;
	min-width: 0;
	font: 400 13px/1.5 var(--sk-sans);
}

.sk-zijblok {
	padding: 18px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
}

/* Vlakken: warm (Nu, Advertentie), zwart (Nieuwsbrief), lichtrood (Steun), kaal (Zoeken, Socials). */
.sk-zijblok--vlak {
	border-color: transparent;
	background: var(--sk-vlak);
}

.sk-zijblok--donker {
	border-color: transparent;
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-zijblok--steun {
	border-color: transparent;
	background: var(--sk-rood-licht);
}

.sk-zijblok--kaal {
	padding: 0;
	border: 0;
	border-radius: 0;
}

.sk-zijblok__kop {
	margin: 0 0 10px;
	color: var(--sk-inkt);
	font: 700 12px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-zijblok--donker .sk-zijblok__kop {
	margin-bottom: 8px;
	color: var(--sk-wit);
}

.sk-zijblok--steun .sk-zijblok__kop {
	margin-bottom: 8px;
	color: var(--sk-rood-donker);
}

.sk-zijblok__tekst {
	margin: 0 0 12px;
	color: var(--sk-tekst);
	font: 400 13px/1.5 var(--sk-sans);
}

.sk-zijblok--donker .sk-zijblok__tekst {
	margin-bottom: 10px;
	color: var(--sk-wit);
}

/* Nu */
.sk-zb-nu {
	display: grid;
	gap: 8px;
	margin: 0;
}

.sk-zb-nu__label {
	color: var(--sk-zacht);
	font: 400 13px/1.5 var(--sk-sans);
}

.sk-zb-nu__tekst {
	margin: 0;
	font: italic 400 15px/1.4 var(--sk-serif);
}

/* Nieuw */
.sk-zb-lijst,
.sk-zb-pillen {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-zb-lijst__link {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	gap: 12px;
	padding: 8px 0;
	border-top: 1px solid var(--sk-lijn-licht);
	color: var(--sk-inkt);
}

.sk-zb-lijst__link:hover {
	color: var(--sk-rood-donker);
}

.sk-zb-lijst__beeld {
	display: block;
	aspect-ratio: 1;
	border-radius: 6px;
	overflow: hidden;
	background: var(--sk-beeld-leeg);
}

.sk-zb-lijst__beeld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sk-zb-lijst__titel {
	display: block;
	font: 500 14px/1.3 var(--sk-serif);
	text-wrap: pretty;
}

.sk-zb-lijst__datum {
	display: block;
	margin-top: 3px;
	color: var(--sk-zacht);
	font: 400 11px/1.4 var(--sk-sans);
}

/* Ontdek en Socials: ronde knoppen */
.sk-zb-pillen {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.sk-zb-pillen + .sk-zb-pillen {
	margin-top: 8px;
}

.sk-zb-pil {
	display: inline-block;
	padding: 6px 10px;
	border: 1px solid transparent;
	border-radius: 999px;
	background: var(--sk-vlak);
	color: var(--sk-inkt);
	font: 500 12px/1.3 var(--sk-sans);
}

.sk-zb-pil:hover {
	border-color: var(--sk-rand);
	color: var(--sk-inkt);
}

.sk-zb-pil__aantal {
	color: var(--sk-zacht);
}

.sk-zb-pillen--onderwerpen .sk-zb-pil,
.sk-zb-pillen--sociaal .sk-zb-pil {
	border-color: var(--sk-lijn);
	background: transparent;
}

.sk-zb-pillen--sociaal {
	gap: 8px;
}

.sk-zb-pillen--sociaal .sk-zb-pil {
	padding: 7px 12px;
}

/* Advertentie */
.sk-zb-reclame__label {
	margin: 0 0 10px;
	color: var(--sk-zacht);
	font: 600 10px/1.3 var(--sk-sans);
	letter-spacing: .1em;
	text-align: center;
	text-transform: uppercase;
}

.sk-zb-reclame__widget {
	text-align: center;
}

/* Nieuwsbrief: het formulier van Jetpack in de vorm van de mock-up */
.sk-zb-aanmelden form {
	display: flex;
	gap: 6px;
	margin: 0;
}

.sk-zb-aanmelden p {
	margin: 0 !important;
}

.sk-zb-aanmelden p:first-of-type {
	flex: 1;
	min-width: 0;
}

.sk-zb-aanmelden input[type="email"] {
	width: 100%;
	min-width: 0;
	margin: 0;
	padding: 10px 14px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--sk-wit);
	color: var(--sk-inkt);
	font: 400 13px/1.3 var(--sk-sans) !important;
}

.sk-zb-aanmelden button,
.sk-zb-aanmelden input[type="submit"] {
	margin: 0 !important;
	padding: 10px 14px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--sk-rood) !important;
	color: var(--sk-wit) !important;
	font: 600 12px/1.3 var(--sk-sans) !important;
	letter-spacing: 0;
	text-transform: none;
	cursor: pointer;
}

.sk-zb-aanmelden button:hover,
.sk-zb-aanmelden input[type="submit"]:hover {
	background: var(--sk-rood-donker) !important;
}

/* Wie schrijft */
.sk-zb-wie {
	display: grid;
	grid-template-columns: 64px minmax(0, 1fr);
	gap: 14px;
	align-items: start;
}

.sk-zb-wie--zonder {
	grid-template-columns: minmax(0, 1fr);
}

.sk-zb-wie__portret {
	display: block;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	object-fit: cover;
}

.sk-zb-wie__tekst {
	margin: 0;
	color: var(--sk-tekst);
	font: 400 13px/1.5 var(--sk-sans);
}

.sk-zb-verder {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin: 12px 0 0;
	font: 500 13px/1.3 var(--sk-sans);
}

.sk-zb-verder a {
	color: var(--sk-inkt);
}

.sk-zb-verder a:hover {
	color: var(--sk-rood-donker);
}

/* Korte vraag: het formulier van Ninja Forms, klein en rond */
.sk-zb-vraag .nf-form-cont,
.sk-zb-vraag .nf-form-wrap {
	margin: 0;
	font: 400 13px/1.4 var(--sk-sans);
}

.sk-zb-vraag .nf-form-title,
.sk-zb-vraag .nf-form-fields-required,
.sk-zb-vraag .nf-field-label {
	display: none;
}

.sk-zb-vraag .nf-field-container {
	margin: 0 0 6px !important;
}

.sk-zb-vraag input[type="text"],
.sk-zb-vraag input[type="email"],
.sk-zb-vraag textarea {
	width: 100%;
	height: auto !important;
	min-height: 0 !important;
	padding: 9px 12px !important;
	border: 1px solid var(--sk-lijn) !important;
	border-radius: 8px !important;
	background: var(--sk-wit) !important;
	color: var(--sk-inkt);
	font: 400 13px/1.4 var(--sk-sans) !important;
}

.sk-zb-vraag textarea {
	height: 56px !important;
	resize: vertical;
}

.sk-zb-vraag input[type="submit"],
.sk-zb-vraag input[type="button"],
.sk-zb-vraag button {
	width: auto !important;
	height: auto !important;
	min-height: 0 !important;
	padding: 8px 14px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--sk-inkt) !important;
	color: var(--sk-wit) !important;
	font: 600 12px/1.3 var(--sk-sans) !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	cursor: pointer;
}

.sk-zb-vraag input[type="submit"]:hover,
.sk-zb-vraag input[type="button"]:hover,
.sk-zb-vraag button:hover {
	background: var(--sk-rood-donker) !important;
}

/* 6. Lijst van berichten ----------------------------------------------- */

.sk-lijstkop {
	margin-bottom: 18px;
}

.sk-lijstkop__titel {
	margin: 0;
	font-size: 28px;
}

.sk-lijstkop__uitleg {
	margin-top: 8px;
	color: var(--sk-zacht);
	font-size: 14px;
}

.sk-feed {
	display: grid;
	gap: 14px;
}

.sk-feedkaart {
	display: grid;
	grid-template-columns: 180px minmax(0, 1fr);
	gap: 20px;
	padding: 16px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
}

.sk-feedkaart__beeld {
	display: block;
	aspect-ratio: 16 / 10;
	border-radius: 6px;
	overflow: hidden;
	background: var(--sk-beeld-leeg);
}

.sk-feedkaart__beeld img,
.sk-held__beeld img,
.sk-tegel__beeld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sk-feedkaart__titel {
	margin: 0 0 8px;
	font-size: 21px;
}

.sk-feedkaart__titel a {
	color: var(--sk-inkt);
}

.sk-feedkaart__titel a:hover {
	color: var(--sk-rood-donker);
}

.sk-feedkaart__intro {
	margin: 0;
	color: var(--sk-tekst);
	font-size: 14px;
	line-height: 1.55;
	text-wrap: pretty;
}

.sk-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 6px;
	color: var(--sk-zacht);
	font: 500 12px/1.4 var(--sk-sans);
}

.sk-meta__soort {
	color: var(--sk-rood-donker);
	font-weight: 600;
}

.sk-verder {
	display: flex;
	justify-content: center;
	gap: 10px;
	padding: 22px 0 8px;
}

.sk-niets {
	padding: 28px;
	border-radius: 12px;
	background: var(--sk-vlak);
}

.sk-niets p {
	margin: 0 0 14px;
}

/* 7. Homepage ---------------------------------------------------------- */

.sk-voorpagina {
	padding-top: 8px;
}

/* De hero: beeld links, tekst rechts, op een warm vlak. */
.sk-held {
	display: grid;
	grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
	gap: 32px;
	align-items: center;
	padding: 28px;
	border-radius: 12px;
	background: var(--sk-vlak);
}

.sk-held__beeld {
	display: block;
	aspect-ratio: 16 / 10;
	border-radius: 8px;
	overflow: hidden;
	background: var(--sk-beeld-leeg);
}

.sk-held__label {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 16px;
	padding: 5px 10px;
	border-radius: 999px;
	background: var(--sk-wit);
	color: var(--sk-zacht);
	font: 500 11px/1.3 var(--sk-sans);
}

.sk-held__soort {
	color: var(--sk-rood-donker);
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-held__titel {
	margin: 0 0 12px;
	font-size: 44px;
	line-height: 1.08;
	letter-spacing: -.015em;
}

.sk-held__titel a,
.sk-tegel__titel a {
	color: var(--sk-inkt);
}

.sk-held__titel a:hover,
.sk-tegel__titel a:hover {
	color: var(--sk-rood-donker);
}

/* De sterren komen van SebKijk Fiches; hier krijgen ze de maat van de hero. */
.sk-held__sterren {
	margin-bottom: 12px;
	line-height: 1;
}

.sk-held .sk-sterren {
	position: relative;
	display: inline-block;
	font: 400 22px/1 var(--sk-serif);
	letter-spacing: 2px;
	white-space: nowrap;
}

.sk-held .sk-sterren__leeg {
	color: var(--sk-rand);
}

.sk-held .sk-sterren__vol {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--sk-sterren-vol, 0%);
	overflow: hidden;
	color: var(--sk-rood);
}

.sk-held__samenvatting {
	margin: 0 0 18px;
	color: var(--sk-tekst);
	font-size: 16px;
	line-height: 1.6;
	text-wrap: pretty;
}

.sk-held__knoppen {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.sk-held__leestijd {
	color: var(--sk-zacht);
	font: 500 13px/1.3 var(--sk-sans);
}

/* De drie kaarten onder de hero. */
.sk-drietal {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	margin-top: 20px;
}

.sk-tegel {
	overflow: hidden;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
	background: var(--sk-wit);
}

.sk-tegel__beeld {
	display: block;
	aspect-ratio: 16 / 9;
	background: var(--sk-beeld-leeg);
}

.sk-tegel__tekst {
	padding: 16px 18px 18px;
}

.sk-tegel__soort {
	margin-bottom: 6px;
	color: var(--sk-rood-donker);
	font: 700 12px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-tegel__titel {
	margin: 0 0 8px;
	font-size: 19px;
	line-height: 1.3;
}

.sk-tegel__meta {
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

/* "Nieuw op SebKijk" met "Alle teksten →" ernaast. */
.sk-kopregel {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	margin-bottom: 18px;
}

.sk-kopregel__titel {
	margin: 0;
	font-size: 28px;
}

.sk-kopregel__link {
	color: var(--sk-inkt);
	font: 500 13px/1.3 var(--sk-sans);
	white-space: nowrap;
}

.sk-kopregel__link:hover {
	color: var(--sk-rood-donker);
}

/* De stroken onder de feed: Filmbibliotheek, Studio, Diensten en Educatie. */
.sk-stroken {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
	min-width: 0;
	margin-top: 8px;
}

.sk-stroken:not(:has(*)) {
	display: none;
}

.sk-strook {
	padding: 32px;
	border-radius: 12px;
}

.sk-strook--donker {
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-strook--vlak {
	background: var(--sk-vlak);
}

.sk-strook__kop {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 16px;
	margin-bottom: 6px;
}

.sk-strook__titel {
	margin: 0;
	font-size: 28px;
}

.sk-strook__link {
	color: inherit;
	font: 500 13px/1.3 var(--sk-sans);
	white-space: nowrap;
}

.sk-strook__link:hover {
	color: inherit;
	text-decoration: underline;
}

.sk-strook__tekst {
	margin: 0 0 22px;
	color: var(--sk-zacht);
	font: 400 14px/1.5 var(--sk-sans);
}

.sk-strook--donker .sk-strook__link {
	opacity: .8;
}

.sk-strook--donker .sk-strook__tekst {
	color: inherit;
	opacity: .75;
}

/* Filmbibliotheek: vijf affiches. */
.sk-affiches,
.sk-dienstregels,
.sk-omslagen {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-affiches {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 20px;
}

.sk-affiche__link {
	display: block;
	color: var(--sk-wit);
}

.sk-affiche__link:hover {
	color: var(--sk-wit);
}

.sk-affiche__beeld {
	position: relative;
	display: block;
	aspect-ratio: 2 / 3;
	border-radius: 8px;
	overflow: hidden;
	background: var(--sk-donker-vlak);
}

.sk-affiche__beeld img,
.sk-omslag__voorkant img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sk-affiche__label {
	position: absolute;
	top: 10px;
	left: 10px;
	padding: 3px 8px;
	border-radius: 999px;
	background: var(--sk-rood);
	color: var(--sk-wit);
	font: 600 10px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-affiche__titel {
	display: block;
	margin-top: 10px;
	font: 600 15px/1.3 var(--sk-serif);
}

.sk-affiche__link:hover .sk-affiche__titel {
	text-decoration: underline;
}

.sk-affiche__meta {
	display: block;
	font: 400 12px/1.4 var(--sk-sans);
	opacity: .65;
}

/* Diensten naast Educatie. */
.sk-duo {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

.sk-duo--een {
	grid-template-columns: minmax(0, 1fr);
}

.sk-aanbod {
	padding: 32px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
}

.sk-aanbod__label {
	margin-bottom: 8px;
	color: var(--sk-rood-donker);
	font: 700 12px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-aanbod__titel {
	margin: 0 0 10px;
	font-size: 26px;
}

.sk-aanbod__titel a {
	color: var(--sk-inkt);
}

.sk-aanbod__titel a:hover {
	color: var(--sk-rood-donker);
}

.sk-aanbod__tekst {
	margin: 0 0 16px;
	color: var(--sk-tekst);
	font: 400 14px/1.55 var(--sk-sans);
}

.sk-dienstregels {
	display: grid;
	gap: 8px;
}

.sk-dienstregel {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 12px;
	padding: 12px 14px;
	border-radius: 8px;
	background: var(--sk-vlak);
	font: 400 14px/1.4 var(--sk-sans);
}

.sk-dienstregel__nr {
	color: var(--sk-rood-donker);
	font: 600 12px/1.4 var(--sk-sans);
}

.sk-dienstregel__naam {
	font-weight: 600;
}

.sk-dienstregel__kort {
	color: var(--sk-zacht);
}

.sk-aanbod__knop {
	margin-top: 16px;
	padding: 10px 18px;
}

.sk-omslagen {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
}

.sk-omslag__link {
	display: block;
	color: var(--sk-inkt);
}

.sk-omslag__voorkant {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 8px;
	aspect-ratio: 3 / 4;
	padding: 12px;
	border-radius: 6px;
	overflow: hidden;
	background: var(--sk-vlak);
}

.sk-omslag__voorkant--beeld {
	padding: 0;
}

.sk-omslag__link:hover {
	color: var(--sk-inkt);
}

.sk-omslag__link:hover .sk-omslag__voorkant {
	background: var(--sk-lijn);
}

.sk-omslag__groep {
	color: var(--sk-rood-donker);
	font: 600 10px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-omslag__titel {
	font: 600 14px/1.25 var(--sk-serif);
	overflow-wrap: anywhere;
}

.sk-omslag__prijs {
	display: block;
	margin-top: 6px;
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

/* 8. Los bericht of pagina --------------------------------------------- */

.sk-los__titel {
	margin: 0 0 16px;
	font-size: 44px;
	line-height: 1.08;
	letter-spacing: -.015em;
}

.sk-los__beeld {
	margin: 0 0 28px;
}

.sk-los__beeld img {
	display: block;
	width: 100%;
	border-radius: 12px;
}

.sk-tekst {
	font: 400 18px/1.7 var(--sk-serif);
}

.sk-tekst > * {
	margin-top: 0;
	margin-bottom: 20px;
}

.sk-tekst h2 {
	margin-top: 36px;
	font-size: 28px;
}

.sk-tekst h3 {
	margin-top: 28px;
	font-size: 22px;
}

.sk-tekst a {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.sk-tekst blockquote {
	margin-left: 0;
	padding: 4px 0 4px 20px;
	border-left: 3px solid var(--sk-rood);
	font-style: italic;
}

.sk-tekst figcaption {
	margin-top: 8px;
	color: var(--sk-zacht);
	font: 400 13px/1.5 var(--sk-sans);
}

.sk-reacties {
	margin-top: 40px;
	padding-top: 28px;
	border-top: 1px solid var(--sk-lijn);
}

.sk-reacties input[type="text"],
.sk-reacties input[type="email"],
.sk-reacties input[type="url"],
.sk-reacties textarea {
	width: 100%;
	max-width: 100%;
	padding: 11px 16px;
	border: 1px solid var(--sk-rand);
	border-radius: 12px;
	font: 400 15px/1.5 var(--sk-sans);
}

.sk-reacties .submit {
	padding: 11px 20px;
	border: 0;
	border-radius: 999px;
	background: var(--sk-inkt);
	color: var(--sk-wit);
	font: 600 13px var(--sk-sans);
	cursor: pointer;
}

/* Een los bericht (single.php, mock-up 1d) ------------------------------ */

.sk-bericht {
	max-width: 760px;
}

.sk-etiketten {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
}

.sk-etiket {
	display: inline-block;
	padding: 5px 10px;
	border-radius: 999px;
	background: var(--sk-vlak);
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-etiket--soort {
	background: var(--sk-rood-licht);
	color: var(--sk-rood-donker);
}

.sk-etiket:hover {
	color: var(--sk-inkt);
}

.sk-bericht__titel {
	margin: 0 0 14px;
	font-size: 48px;
	line-height: 1.08;
	letter-spacing: -.015em;
}

.sk-intro {
	margin: 0 0 18px;
	color: var(--sk-tekst);
	font: 400 20px/1.45 var(--sk-serif);
	text-wrap: pretty;
}

.sk-metabalk {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 18px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--sk-lijn);
	color: var(--sk-zacht);
	font: 400 13px/1.4 var(--sk-sans);
}

.sk-auteur {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.sk-auteur__beeld {
	display: block;
	width: 26px;
	height: 26px;
	border-radius: 50%;
}

.sk-auteur__naam {
	color: var(--sk-inkt);
	font-weight: 500;
}

.sk-melding {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-left: auto;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--sk-vlak);
	color: var(--sk-inkt);
	font-weight: 500;
}

.sk-melding:hover {
	background: var(--sk-lijn);
	color: var(--sk-inkt);
}

.sk-melding__stip {
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--sk-rood);
}

.sk-bericht__beeld {
	margin: 24px 0 28px;
}

.sk-bericht__beeld img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	border-radius: 8px;
	object-fit: cover;
}

.sk-onderschrift {
	margin-top: 10px;
	color: var(--sk-zacht);
	font: 400 12px/1.5 var(--sk-sans);
}

/* De fiches van SebKijk Fiches: Kijkfiche, Werkfiche, winactie, video, Nieuwskader. */
.sk-ficheblok,
.sk-bericht > .sk-fiche {
	margin: 0 0 32px;
	padding: 22px 24px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
	background: var(--sk-wit);
}

.sk-ficheblok .sk-fiche {
	margin: 0;
	padding: 0;
	border: 0;
}

.sk-fiche__boven {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin-bottom: 14px;
}

.sk-fiche__kop {
	margin: 0 0 10px;
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-fiche__boven .sk-fiche__kop {
	margin: 0;
}

.sk-fiche__waardering {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.sk-fiche__label {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
}

.sk-bericht .sk-sterren {
	position: relative;
	display: inline-block;
	margin-right: 125px; /* Ruimte voor "4 van 5 sterren" ernaast. */
	font: 400 22px/1 var(--sk-serif);
	letter-spacing: 2px;
	white-space: nowrap;
}

.sk-bericht .sk-sterren__leeg {
	color: var(--sk-rand);
}

.sk-bericht .sk-sterren__vol {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--sk-sterren-vol, 0%);
	overflow: hidden;
	color: var(--sk-rood);
}

/* "4 van 5 sterren": de tekst voor schermlezers staat hier naast de sterren in beeld. */
.sk-bericht .sk-sterren .screen-reader-text {
	top: 50%;
	left: 100%;
	width: auto;
	height: auto;
	margin: 0 0 0 10px;
	overflow: visible;
	clip: auto;
	clip-path: none; /* WordPress zelf verbergt deze tekst ook met clip-path. */
	color: var(--sk-inkt);
	font: 600 13px/1 var(--sk-sans);
	letter-spacing: 0;
	transform: translateY(-50%);
}

.sk-fiche__lijst {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 28px;
	margin: 0;
}

.sk-fiche__regel {
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr);
	gap: 12px;
	padding: 8px 0;
	border-top: 1px solid var(--sk-lijn-licht);
	font: 400 13px/1.45 var(--sk-sans);
}

.sk-fiche__regel dt {
	color: var(--sk-zacht);
}

.sk-fiche__regel dd {
	margin: 0;
	font-weight: 500;
}

.sk-filmlink {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px;
	margin: 14px 0 0;
	padding-top: 12px;
	border-top: 1px solid var(--sk-lijn-licht);
	color: var(--sk-zacht);
	font: 400 13px/1.4 var(--sk-sans);
}

.sk-filmlink a {
	color: var(--sk-inkt);
	font-weight: 600;
}

.sk-filmlink a:hover {
	color: var(--sk-rood-donker);
}

/* Winactie */
.sk-prijs__aantal {
	margin: 0 0 4px;
	font: 600 28px/1.15 var(--sk-serif);
}

.sk-prijs__titel {
	margin: 0 0 6px;
	font: 600 20px/1.3 var(--sk-serif);
}

.sk-prijs__tekst {
	margin: 0 0 10px;
	color: var(--sk-tekst);
	font: 400 15px/1.5 var(--sk-sans);
}

.sk-prijs__extra {
	margin: 0 0 14px;
	color: var(--sk-zacht);
	font: 400 13px/1.4 var(--sk-sans);
}

.sk-prijs--gesloten {
	background: var(--sk-vlak) !important;
}

.sk-fiche-knop {
	display: inline-block;
	padding: 11px 20px;
	border-radius: 999px;
	background: var(--sk-inkt);
	color: var(--sk-wit);
	font: 600 13px/1.2 var(--sk-sans);
}

.sk-fiche-knop:hover {
	background: var(--sk-rood-donker);
	color: var(--sk-wit);
}

/* Video bovenaan een videorecensie */
.sk-video {
	margin: 0 0 32px;
	border-radius: 8px;
	overflow: hidden;
}

.sk-video iframe {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
}

.sk-video--link {
	overflow: visible;
}

/* Nieuwskader onder de tekst */
.sk-bericht__tekst .sk-nieuwskader {
	margin: 28px 0;
	padding: 16px 20px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
	font-family: var(--sk-sans);
}

.sk-nieuwskader .sk-fiche__lijst {
	grid-template-columns: minmax(0, 1fr);
}

.sk-nieuwskader .sk-fiche__regel:first-child {
	border-top: 0;
}

/* De tekst */
.sk-bericht__tekst {
	color: var(--sk-inkt);
	font-size: 17px;
	line-height: 1.75;
	text-wrap: pretty;
}

.sk-bericht__tekst h2 {
	margin: 32px 0 12px;
	font-size: 28px;
	line-height: 1.2;
}

/* De grote rode beginletter. */
.sk-bericht__tekst > p:first-of-type::first-letter {
	float: left;
	margin: 8px 10px 0 0;
	color: var(--sk-rood);
	font: 600 64px/.85 var(--sk-serif);
}

.sk-bericht__tekst blockquote {
	margin: 28px 0;
	padding: 0 0 0 24px;
	border-left: 2px solid var(--sk-rood);
	color: var(--sk-inkt);
	font: italic 500 22px/1.4 var(--sk-serif);
}

.sk-bericht__tekst blockquote p {
	margin: 0;
}

.sk-bericht__tekst blockquote cite {
	display: block;
	margin-top: 8px;
	color: var(--sk-zacht);
	font: normal 400 13px/1.4 var(--sk-sans);
}

/* Inhoudsopgave (Easy Table of Contents) */
.sk-bericht__tekst #ez-toc-container {
	display: block;
	width: auto;
	max-width: 360px;
	margin: 0 0 28px;
	padding: 16px 20px;
	border: 1px solid var(--sk-lijn) !important;
	border-radius: 12px;
	background: none !important;
	box-shadow: none !important;
	font: 400 14px/1.9 var(--sk-sans);
}

.sk-bericht__tekst #ez-toc-container .ez-toc-title {
	margin: 0 0 8px;
	color: var(--sk-zacht) !important;
	font: 600 11px/1.3 var(--sk-sans) !important;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-bericht__tekst #ez-toc-container ul,
.sk-bericht__tekst #ez-toc-container ol {
	margin: 0;
	padding-left: 18px;
	list-style: decimal;
}

.sk-bericht__tekst #ez-toc-container ul ul {
	list-style: none;
}

.sk-bericht__tekst #ez-toc-container a {
	color: var(--sk-inkt) !important;
	text-decoration: none;
}

.sk-bericht__tekst #ez-toc-container a:hover {
	color: var(--sk-rood-donker) !important;
}

/* Automatische advertenties van AdSense: een dun kader met een label. */
.sk-bericht__tekst .google-auto-placed {
	margin: 28px 0 !important;
	padding: 14px 0;
	border-top: 1px solid var(--sk-lijn);
	border-bottom: 1px solid var(--sk-lijn);
}

.sk-bericht__tekst .google-auto-placed::before {
	content: "Advertentie";
	display: block;
	margin-bottom: 10px;
	color: var(--sk-zacht);
	font: 600 10px/1.3 var(--sk-sans);
	letter-spacing: .1em;
	text-align: center;
	text-transform: uppercase;
}

/* Tags */
.sk-trefwoorden {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 28px 0 36px;
	padding: 0;
	list-style: none;
}

.sk-trefwoord {
	display: inline-block;
	padding: 5px 10px;
	border: 1px solid var(--sk-lijn);
	border-radius: 999px;
	color: var(--sk-inkt);
	font: 400 12px/1.3 var(--sk-sans);
}

.sk-trefwoord:hover {
	border-color: var(--sk-rand);
	color: var(--sk-inkt);
}

/* Notities (gemaakt door SebKijk Fiches) */
.sk-notitieblok {
	position: relative;
	margin-bottom: 36px;
	scroll-margin-top: 16px;
}

.sk-notitieblok__aantal {
	position: absolute;
	top: 10px;
	right: 0;
	color: var(--sk-zacht);
	font: 400 12px/1.3 var(--sk-sans);
}

.sk-notities {
	scroll-margin-top: 16px;
}

.sk-notities__kop {
	margin: 0 0 6px;
	font-size: 24px;
}

.sk-notities__uitleg {
	margin: 0 0 16px;
	color: var(--sk-zacht);
	font: 400 14px/1.5 var(--sk-sans);
}

.sk-notities__lijst {
	display: grid;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-notitie {
	padding: 18px 20px;
	border-radius: 12px;
	background: var(--sk-vlak);
}

.sk-notitie__over {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 10px;
	margin: 0 0 8px;
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-notitie__soort {
	color: var(--sk-rood-donker);
}

.sk-notitie__over time {
	color: var(--sk-zacht);
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
}

.sk-notitie__tekst p,
.sk-notitie__tekst blockquote {
	margin: 0;
	padding: 0;
	border: 0;
	color: var(--sk-inkt);
	font: 400 16px/1.6 var(--sk-serif);
}

.sk-notitie__tekst p + p {
	margin-top: 10px;
}

.sk-notitie__bron {
	margin: 8px 0 0;
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

.sk-notitie__bron a {
	color: var(--sk-zacht);
	text-decoration: underline;
}

/* Steun SebKijk | Nieuwsbrief onder het bericht */
.sk-onderaan {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin-bottom: 40px;
}

.sk-onderaan--een {
	grid-template-columns: minmax(0, 1fr);
}

.sk-onderaan__vak {
	padding: 22px;
}

.sk-onderaan .sk-zijblok__tekst {
	font-size: 14px;
	line-height: 1.55;
}

.sk-onderaan .sk-zijblok--steun strong {
	color: var(--sk-inkt);
}

/* Lees ook */
.sk-leesook__kop {
	margin: 0 0 14px;
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-leesook__lijst {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-leesook__link {
	display: block;
	color: var(--sk-inkt);
}

.sk-leesook__link:hover {
	color: var(--sk-rood-donker);
}

.sk-leesook__beeld {
	display: block;
	aspect-ratio: 16 / 10;
	margin-bottom: 10px;
	border-radius: 8px;
	overflow: hidden;
	background: var(--sk-beeld-leeg);
}

.sk-leesook__beeld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sk-leesook__soort {
	display: block;
	margin-bottom: 4px;
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-leesook__titel {
	display: block;
	font: 600 16px/1.3 var(--sk-serif);
	text-wrap: pretty;
}

/* 9. Teksten, Nieuwsarchief, Studio en Filmdagboek (1f, 1g) ------------ */

.sk-archiefpagina {
	padding-top: 40px;
	padding-bottom: 48px;
}

.sk-archiefkop {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 420px;
	align-items: end;
	gap: 48px;
}

.sk-archiefkop__label {
	margin: 0 0 10px;
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-archiefkop__titel {
	margin: 0 0 12px;
	font-size: 52px;
	line-height: 1.05;
	letter-spacing: -.02em;
}

.sk-archiefkop__intro {
	max-width: 560px;
	color: var(--sk-tekst);
	font: 400 17px/1.55 var(--sk-sans);
	text-wrap: pretty;
}

.sk-archiefkop__intro p {
	margin: 0;
}

.sk-archiefkop__intro p + p {
	margin-top: 10px;
}

.sk-archiefkop__intro strong {
	color: var(--sk-inkt);
}

/* Staafjes per jaar */
.sk-jaarstaven {
	display: flex;
	justify-content: flex-end;
	align-items: stretch;
	gap: 6px;
	height: 110px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-jaarstaven__jaar {
	flex: 1;
	min-width: 0;
	max-width: 44px;
}

.sk-jaarstaven__jaar a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	height: 100%;
	color: var(--sk-zacht);
	font: 400 11px/1.2 var(--sk-sans);
}

.sk-jaarstaven__vak {
	display: flex;
	flex: 1;
	align-items: flex-end;
	width: 100%;
}

.sk-jaarstaven__staaf {
	display: block;
	width: 100%;
	border-radius: 3px 3px 0 0;
	background: var(--sk-inkt);
}

.sk-jaarstaven__jaar a:hover .sk-jaarstaven__staaf {
	background: var(--sk-rood-donker);
}

.sk-jaarstaven__jaar a[aria-current] {
	color: var(--sk-inkt);
	font-weight: 600;
}

.sk-jaarstaven__jaar a[aria-current] .sk-jaarstaven__staaf {
	background: var(--sk-rood);
}

/* Filters links, lijst rechts */
.sk-archiefraster {
	display: grid;
	grid-template-columns: 240px minmax(0, 1fr);
	gap: 48px;
	padding-top: 32px;
	scroll-margin-top: 16px;
}

.sk-archiefraster__filters {
	display: flex;
	flex-direction: column;
	gap: 22px;
	min-width: 0;
}

.sk-zoeken__knop--icoon {
	display: grid;
	place-items: center;
	padding: 10px 14px;
	background: transparent;
}

.sk-filter__kop {
	margin: 0 0 8px;
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-filter__lijst,
.sk-filter__knoppen,
.sk-lijstregels,
.sk-maandrij {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-filter__lijst {
	display: grid;
	gap: 2px;
}

.sk-filter__regel {
	display: block;
	padding: 0 10px;
	border-radius: 6px;
	color: var(--sk-inkt);
	font: 400 14px/1.9 var(--sk-sans);
}

.sk-filter__regel:hover {
	background: var(--sk-vlak);
	color: var(--sk-inkt);
}

.sk-filter__regel[aria-current] {
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-filter__aantal {
	color: var(--sk-zacht);
}

.sk-filter__regel[aria-current] .sk-filter__aantal {
	color: var(--sk-wit);
	opacity: .6;
}

.sk-filter__knoppen {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.sk-filter__knop {
	display: inline-block;
	padding: 6px 12px;
	border: 1px solid var(--sk-lijn);
	border-radius: 999px;
	color: var(--sk-inkt);
	font: 500 12px/1.3 var(--sk-sans);
}

.sk-filter__knop:hover {
	border-color: var(--sk-rand);
	color: var(--sk-inkt);
}

.sk-filter__knop[aria-current] {
	border-color: var(--sk-inkt);
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-filter__wis {
	margin: 0;
	font: 500 13px/1.3 var(--sk-sans);
}

.sk-filter__wis a {
	color: var(--sk-rood-donker);
}

.sk-archiefraster__lijst {
	min-width: 0;
}

.sk-lijstbalk {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--sk-inkt);
	color: var(--sk-zacht);
	font: 400 13px/1.4 var(--sk-sans);
}

.sk-lijstbalk p {
	margin: 0;
}

.sk-lijstbalk strong {
	color: var(--sk-inkt);
}

.sk-lijstbalk a {
	color: var(--sk-zacht);
}

.sk-lijstbalk a:hover {
	color: var(--sk-inkt);
}

.sk-lijstregel {
	display: grid;
	grid-template-columns: 110px 150px minmax(0, 1fr) 110px;
	align-items: baseline;
	gap: 16px;
	padding: 14px 0;
	border-bottom: 1px solid var(--sk-lijn);
	color: var(--sk-inkt);
}

.sk-lijstregel--nieuws {
	grid-template-columns: 110px 150px minmax(0, 1fr);
}

.sk-lijstregel:hover {
	color: var(--sk-inkt);
}

.sk-lijstregel:hover .sk-lijstregel__titel {
	color: var(--sk-rood-donker);
}

.sk-lijstregel__datum {
	color: var(--sk-zacht);
	font: 400 13px/1.4 var(--sk-sans);
}

.sk-lijstregel__soort {
	color: var(--sk-rood-donker);
	font: 600 11px/1.4 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-lijstregel__titel {
	font: 500 18px/1.3 var(--sk-serif);
	text-wrap: pretty;
}

.sk-lijstregel__extra {
	display: block;
	margin-top: 4px;
	color: var(--sk-zacht);
	font: 400 13px/1.4 var(--sk-sans);
}

.sk-lijstregel__sterren {
	text-align: right;
	white-space: nowrap;
}

/* De sterren van SebKijk Fiches, klein in de lijst. */
.sk-lijstregel .sk-sterren,
.sk-tekstkaart .sk-sterren {
	position: relative;
	display: inline-block;
	font: 400 15px/1 var(--sk-serif);
	letter-spacing: 1px;
}

.sk-lijstregel .sk-sterren__leeg,
.sk-tekstkaart .sk-sterren__leeg {
	color: var(--sk-rand);
}

.sk-lijstregel .sk-sterren__vol,
.sk-tekstkaart .sk-sterren__vol {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--sk-sterren-vol, 0%);
	overflow: hidden;
	color: var(--sk-rood);
}

.sk-lijstmaand {
	margin: 22px 0 0;
	padding-bottom: 6px;
	border-bottom: 1px solid var(--sk-lijn);
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-maandrij {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 6px;
	margin-bottom: 22px;
}

.sk-maandrij__maand {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 8px 0;
	border-radius: 8px;
	background: var(--sk-vlak);
	color: var(--sk-inkt);
	font: 500 12px/1.3 var(--sk-sans);
}

a.sk-maandrij__maand:hover {
	background: var(--sk-lijn);
	color: var(--sk-inkt);
}

.sk-maandrij__aantal {
	color: var(--sk-zacht);
	font-size: 11px;
}

.sk-maandrij__maand--leeg {
	background: transparent;
	color: var(--sk-rand);
}

.sk-maandrij__maand--leeg .sk-maandrij__aantal {
	color: var(--sk-rand);
}

.sk-maandrij__maand[aria-current] {
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-maandrij__maand[aria-current] .sk-maandrij__aantal {
	color: var(--sk-wit);
}

.sk-blader {
	display: flex;
	justify-content: space-between;
	padding-top: 22px;
	font: 500 13px/1.3 var(--sk-sans);
}

.sk-blader__terug {
	color: var(--sk-zacht);
}

.sk-blader__verder {
	color: var(--sk-inkt);
}

.sk-archiefleeg {
	padding: 22px 0;
	color: var(--sk-tekst);
	font: 400 15px/1.5 var(--sk-sans);
}

/* Onder een nieuwsbericht: Uit het Nieuwsarchief */
.sk-archiefnoot {
	margin: 28px 0;
	padding: 18px 20px;
	border-radius: 12px;
	background: var(--sk-vlak);
	font: 400 14px/1.55 var(--sk-sans);
}

.sk-archiefnoot p {
	margin: 0;
}

.sk-archiefnoot p + p {
	margin-top: 8px;
}

.sk-archiefnoot__label {
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-archiefnoot__datum {
	color: var(--sk-inkt);
	font-weight: 600;
}

.sk-archiefnoot__tekst {
	color: var(--sk-tekst);
}

.sk-archiefnoot__link a {
	color: var(--sk-inkt);
	font-weight: 600;
	text-decoration: none;
}

.sk-archiefnoot__link a:hover {
	color: var(--sk-rood-donker);
}

/* Studio (mock-up 1g): werk in zijn geheel, nooit bijgesneden. ---------- */

.sk-werkraster {
	display: grid;
	grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr) minmax(0, 1fr);
	grid-template-rows: 260px 260px;
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

/* In de band op de homepage iets lager (mock-up 1b). */
.sk-werkraster--band {
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
	grid-template-rows: 210px 210px;
}

.sk-werkvak {
	min-width: 0;
}

.sk-werkvak--groot {
	grid-row: span 2;
}

.sk-werkvak__link {
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 16px 16px 12px;
	border-radius: 12px;
	background: var(--sk-vlak);
	color: var(--sk-inkt);
}

.sk-werkraster--band .sk-werkvak__link {
	background: var(--sk-wit);
}

.sk-werkvak__link:hover {
	color: var(--sk-rood-donker);
}

.sk-werkvak__beeld {
	flex: 1;
	min-height: 0;
}

.sk-werkvak__beeld img,
.sk-werkkaart__beeld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.sk-werkvak__onder {
	margin-top: 10px;
	overflow: hidden;
	font: 500 13px/1.3 var(--sk-serif);
	white-space: nowrap;
	text-overflow: ellipsis;
}

.sk-werkvak--groot .sk-werkvak__onder {
	font-size: 14px;
}

.sk-soortknoppen ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-soortknoppen .sk-filter__knop {
	padding: 8px 14px;
	font-size: 13px;
}

.sk-archiefkop--studio {
	grid-template-columns: minmax(0, 1fr) 380px;
	padding-bottom: 28px;
}

.sk-studio__deel {
	padding: 32px 0;
	border-top: 1px solid var(--sk-lijn);
}

.sk-studio__deel--nieuw {
	padding-top: 0;
	border-top: 0;
}

.sk-studio__label {
	margin: 0 0 14px;
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-studio .sk-kopregel {
	margin-bottom: 16px;
}

.sk-studio .sk-kopregel__titel {
	font-size: 26px;
}

.sk-werkrij {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-werkkaart {
	display: block;
	color: var(--sk-inkt);
}

.sk-werkkaart:hover {
	color: var(--sk-rood-donker);
}

.sk-werkkaart__beeld {
	display: block;
	aspect-ratio: 1;
	padding: 14px;
	border-radius: 8px;
	background: var(--sk-vlak);
}

.sk-werkrij--staand .sk-werkkaart__beeld {
	aspect-ratio: 4 / 5;
}

.sk-werkkaart__titel {
	display: block;
	margin-top: 10px;
	font: 500 15px/1.3 var(--sk-serif);
}

.sk-werkkaart__meta {
	display: block;
	margin-top: 2px;
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

.sk-studio__slot {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 48px;
	padding-bottom: 0;
}

.sk-fictie__kop {
	margin: 0 0 6px;
	font-size: 26px;
}

.sk-fictie__uitleg {
	margin: 0 0 16px;
	color: var(--sk-zacht);
	font: 400 14px/1.5 var(--sk-sans);
}

.sk-fictie__uitleg a {
	margin-left: 6px;
	color: var(--sk-inkt);
	font-weight: 500;
}

.sk-fictie__lijst {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-fictie__verhaal {
	display: block;
	padding: 16px 0;
	border-top: 1px solid var(--sk-lijn);
	color: var(--sk-inkt);
}

.sk-fictie__verhaal:hover .sk-fictie__titel {
	color: var(--sk-rood-donker);
}

.sk-fictie__titel {
	display: block;
	margin-bottom: 6px;
	font: 600 19px/1.3 var(--sk-serif);
}

.sk-fictie__begin {
	display: block;
	margin-bottom: 6px;
	color: var(--sk-tekst);
	font: italic 400 15px/1.5 var(--sk-serif);
}

.sk-fictie__datum {
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

.sk-opdracht {
	align-self: start;
	padding: 28px;
	border-radius: 12px;
	background: var(--sk-vlak);
}

.sk-opdracht__label {
	margin: 0 0 8px;
	color: var(--sk-rood-donker);
	font: 700 12px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-opdracht__kop {
	margin: 0 0 8px;
	font-size: 22px;
	line-height: 1.3;
}

.sk-opdracht__tekst {
	margin: 0 0 14px;
	color: var(--sk-tekst);
	font: 400 14px/1.55 var(--sk-sans);
}

/* Filmdagboek ------------------------------------------------------------ */

.sk-jaarstaven__leeg {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	height: 100%;
	color: var(--sk-rand);
	font: 400 11px/1.2 var(--sk-sans);
}

.sk-cijfers {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin: 0 0 22px;
}

.sk-cijfers__vak {
	display: flex;
	flex-direction: column-reverse;
	padding: 16px 18px;
	border-radius: 12px;
	background: var(--sk-vlak);
}

.sk-cijfers dt {
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

.sk-cijfers dd {
	margin: 0;
	font: 600 30px/1.1 var(--sk-serif);
}

.sk-filmregels {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-filmregel {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr) 72px 96px;
	align-items: baseline;
	gap: 16px;
	padding: 12px 0;
	border-bottom: 1px solid var(--sk-lijn);
}

.sk-filmregel__nr,
.sk-filmregel__minuten {
	color: var(--sk-zacht);
	font: 400 13px/1.4 var(--sk-sans);
}

.sk-filmregel__dag {
	margin-left: 6px;
}

.sk-filmregel__titel {
	font: 500 17px/1.3 var(--sk-serif);
}

.sk-filmregel__jaartal {
	color: var(--sk-zacht);
}

.sk-filmregel__link {
	display: inline-block;
	margin-left: 8px;
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-filmregel__sterren {
	text-align: right;
	white-space: nowrap;
}

.sk-filmregel .sk-sterren {
	position: relative;
	display: inline-block;
	font: 400 15px/1 var(--sk-serif);
	letter-spacing: 1px;
}

.sk-filmregel .sk-sterren__leeg {
	color: var(--sk-rand);
}

.sk-filmregel .sk-sterren__vol {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--sk-sterren-vol, 0%);
	overflow: hidden;
	color: var(--sk-rood);
}

/* 9b. Diensten en Educatie (1h, 1i) ------------------------------------- */

/* Kop met knoppen rechts onderaan. */
.sk-archiefkop--knoppen {
	grid-template-columns: minmax(0, 1fr) auto;
	padding-bottom: 36px;
}

.sk-archiefkop--knoppen .sk-archiefkop__intro {
	max-width: 620px;
	font-size: 18px;
}

.sk-knoppenrij {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 10px;
}

.sk-knoppenrij .sk-pil {
	padding: 12px 20px;
	font-size: 14px;
}

.sk-pil--rand {
	padding: 11px 19px;
	border: 1px solid var(--sk-inkt);
	background: var(--sk-wit);
}

.sk-pil--rand:hover {
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-pil--klein {
	padding: 7px 14px;
	font-size: 13px;
}

/* Filterknoppen (knoppen, geen links): de opmaak van .sk-filter__knop. */
.sk-filterknoppen {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.sk-filterknoppen[hidden] {
	display: none;
}

button.sk-filter__knop {
	background: transparent;
	cursor: pointer;
}

button.sk-filter__knop[aria-pressed="true"] {
	border-color: var(--sk-inkt);
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

/* Een deel van de pagina: lijn erboven, kop in Lora. */
.sk-paginadeel {
	padding: 36px 0;
	border-top: 1px solid var(--sk-lijn);
}

.sk-paginadeel__label {
	margin: 0 0 8px;
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-paginadeel__kop {
	margin: 0 0 20px;
	font-size: 26px;
	line-height: 1.25;
}

.sk-paginadeel--tekst .sk-tekst {
	max-width: 760px;
}

/* Diensten: drie kaarten op een vlak. */
.sk-dienstkaarten {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	margin: 0 0 40px;
	padding: 0;
	list-style: none;
}

.sk-dienstkaart {
	display: flex;
	flex-direction: column;
	min-height: 260px;
	padding: 28px;
	border-radius: 12px;
	background: var(--sk-vlak);
}

.sk-dienstkaart__nr {
	color: var(--sk-rood-donker);
	font: 600 13px/1.3 var(--sk-sans);
}

.sk-dienstkaart__naam {
	margin: 12px 0 10px;
	font-size: 26px;
	line-height: 1.2;
}

.sk-dienstkaart__tekst {
	margin: 0;
	color: var(--sk-tekst);
	font: 400 14px/1.6 var(--sk-sans);
	text-wrap: pretty;
}

.sk-dienstkaart__prijs {
	margin: auto 0 0;
	padding-top: 16px;
	color: var(--sk-zacht);
	font: 400 13px/1.4 var(--sk-sans);
}

/* Werkwijze: vier stappen met een zwarte lijn erboven. */
.sk-stappen {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-stappen__stap {
	display: flex;
	flex-direction: column;
	padding-top: 14px;
	border-top: 2px solid var(--sk-inkt);
}

.sk-stappen__nr {
	margin-bottom: 6px;
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-stappen__naam {
	margin-bottom: 6px;
	font: 600 18px/1.3 var(--sk-serif);
}

.sk-stappen__tekst {
	color: var(--sk-tekst);
	font: 400 14px/1.55 var(--sk-sans);
}

/* Elders verschenen: uitgelicht links, tabel rechts. */
.sk-elders {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
	gap: 48px;
}

.sk-elders--een {
	grid-template-columns: minmax(0, 1fr);
}

.sk-elders--een .sk-elders__links {
	max-width: 620px;
}

.sk-elders .sk-paginadeel__kop {
	margin-bottom: 14px;
}

.sk-uitgelicht {
	display: block;
	padding: 22px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
	color: var(--sk-inkt);
}

.sk-uitgelicht:hover {
	border-color: var(--sk-rand);
	color: var(--sk-inkt);
}

.sk-uitgelicht > span {
	display: block;
}

.sk-uitgelicht__beeld {
	margin-bottom: 16px;
	aspect-ratio: 16 / 9;
	border-radius: 8px;
	overflow: hidden;
	background: var(--sk-beeld-leeg);
}

.sk-uitgelicht__beeld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sk-uitgelicht__label {
	margin-bottom: 8px;
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-uitgelicht__titel {
	margin-bottom: 8px;
	font: 600 22px/1.3 var(--sk-serif);
}

.sk-uitgelicht__intro {
	margin-bottom: 10px;
	color: var(--sk-tekst);
	font: 400 14px/1.55 var(--sk-sans);
}

.sk-uitgelicht__lees {
	font: 500 13px/1.4 var(--sk-sans);
}

.sk-uitgelicht:hover .sk-uitgelicht__lees {
	color: var(--sk-rood-donker);
}

.sk-elders__rechts .sk-filterknoppen {
	justify-content: flex-end;
	margin-bottom: 12px;
}

.sk-publicaties {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-publicaties li[hidden] {
	display: none;
}

.sk-publicatie {
	display: grid;
	grid-template-columns: 120px minmax(0, 1fr) 90px 80px 20px;
	align-items: baseline;
	gap: 14px;
	padding: 12px 0;
	border-top: 1px solid var(--sk-lijn);
	color: var(--sk-inkt);
	font: 400 14px/1.4 var(--sk-sans);
}

.sk-publicatie:hover {
	color: var(--sk-inkt);
}

.sk-publicatie__blad {
	font-weight: 600;
	overflow-wrap: anywhere;
}

.sk-publicatie__titel {
	font: 500 16px/1.3 var(--sk-serif);
}

.sk-publicatie:hover .sk-publicatie__titel {
	color: var(--sk-rood-donker);
}

.sk-publicatie__soort,
.sk-publicatie__datum {
	color: var(--sk-zacht);
	font-size: 12px;
}

.sk-publicatie__pijl {
	color: var(--sk-rood-donker);
}

/* Websites die ik bouwde. */
.sk-sites {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-sitekaart {
	display: block;
	color: var(--sk-inkt);
}

.sk-sitekaart:hover {
	color: var(--sk-rood-donker);
}

.sk-sitekaart__beeld {
	display: block;
	aspect-ratio: 16 / 10;
	border: 1px solid var(--sk-lijn);
	border-radius: 8px;
	overflow: hidden;
	background: var(--sk-beeld-leeg);
}

.sk-sitekaart__beeld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top;
}

.sk-sitekaart__titel {
	display: block;
	margin-top: 8px;
	font: 500 15px/1.35 var(--sk-serif);
}

.sk-sitekaart__adres {
	display: block;
	margin-top: 2px;
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

/* Donkere slotband: Iets samen maken? */
.sk-slotband,
.sk-scholen {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	margin-top: 12px;
	padding: 32px;
	border-radius: 12px;
}

.sk-slotband {
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-slotband__kop {
	margin: 0 0 6px;
	color: var(--sk-wit);
	font-size: 26px;
	line-height: 1.2;
}

.sk-slotband__tekst {
	margin: 0;
	font: 400 14px/1.5 var(--sk-sans);
	opacity: .75;
}

.sk-slotband__knop,
.sk-scholen__knop {
	flex-shrink: 0;
	padding: 12px 20px;
	font-size: 14px;
	white-space: nowrap;
}

/* Educatie: de e-books op een vlak. */
.sk-boekvak {
	margin-bottom: 4px;
	padding: 32px;
	border-radius: 12px;
	background: var(--sk-vlak);
	scroll-margin-top: 24px;
}

.sk-boekvak__kop {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin-bottom: 20px;
}

.sk-boekvak__kop .sk-paginadeel__kop {
	margin: 0;
}

.sk-boekvak .sk-filter__knop {
	border-color: var(--sk-rand);
}

.sk-ebooks {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-ebooks li[hidden] {
	display: none;
}

.sk-ebook {
	display: flex;
	flex-direction: column;
	height: 100%;
	color: var(--sk-inkt);
}

.sk-ebook:hover {
	color: var(--sk-inkt);
}

.sk-ebook .sk-omslag__voorkant {
	padding: 18px;
	border: 1px solid var(--sk-lijn);
	background: var(--sk-wit);
	box-shadow: var(--sk-schaduw);
}

.sk-ebook .sk-omslag__voorkant--beeld {
	padding: 0;
}

.sk-ebook .sk-omslag__voorkant img {
	height: 100%;
	object-fit: cover;
}

.sk-ebook .sk-omslag__titel {
	font-size: 20px;
	line-height: 1.2;
	text-wrap: pretty;
}

.sk-ebook:hover .sk-omslag__voorkant {
	border-color: var(--sk-rand);
}

.sk-ebook__titel {
	margin-top: 12px;
	font: 600 16px/1.3 var(--sk-serif);
}

.sk-ebook__intro {
	margin: 4px 0 0;
	color: var(--sk-zacht);
	font: 400 13px/1.5 var(--sk-sans);
}

.sk-ebook__voet {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 4px 12px;
	margin-top: auto;
	padding-top: 8px;
	font: 600 13px/1.4 var(--sk-sans);
}

.sk-ebook__actie {
	color: var(--sk-rood-donker);
}

.sk-ebook:hover .sk-ebook__actie {
	text-decoration: underline;
}

.sk-bijdrage {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	margin-top: 24px;
	padding-top: 18px;
	border-top: 1px solid var(--sk-lijn);
}

.sk-bijdrage__tekst {
	margin: 0;
	color: var(--sk-tekst);
	font: 400 14px/1.5 var(--sk-sans);
}

.sk-bijdrage .sk-pil {
	flex-shrink: 0;
	background: transparent;
}

.sk-bijdrage .sk-pil:hover {
	background: var(--sk-inkt);
}

/* Omslag met "SebKijk" onderaan: titel in het midden. */
.sk-omslag__merk {
	color: var(--sk-zacht);
	font: 400 11px/1.3 var(--sk-sans);
}

/* Begrippenlijst: links uitleg en filters, rechts kaarten. */
.sk-begrippenvak {
	display: grid;
	grid-template-columns: 300px minmax(0, 1fr);
	gap: 48px;
	padding-top: 40px;
	border-top: 0;
	scroll-margin-top: 24px;
}

.sk-begrippenvak__links .sk-paginadeel__kop {
	margin-bottom: 8px;
}

.sk-begrippenvak__uitleg {
	margin: 0 0 16px;
	color: var(--sk-tekst);
	font: 400 14px/1.55 var(--sk-sans);
}

.sk-begrippenvak .sk-filterknoppen {
	margin-bottom: 14px;
}

.sk-letters {
	display: flex;
	flex-wrap: wrap;
	gap: 4px;
}

.sk-letters a {
	padding: 4px 7px;
	border-radius: 6px;
	color: var(--sk-inkt);
	font: 600 12px/1.3 var(--sk-sans);
}

.sk-letters a:hover {
	background: var(--sk-vlak);
	color: var(--sk-rood-donker);
}

.sk-letters a[aria-disabled="true"] {
	color: var(--sk-rand);
	pointer-events: none;
}

.sk-begripkaarten {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	align-content: start;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-begripkaarten li {
	scroll-margin-top: 24px;
}

.sk-begripkaarten li[hidden] {
	display: none;
}

.sk-begripkaart {
	display: block;
	height: 100%;
	padding: 18px 20px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
	color: var(--sk-inkt);
}

.sk-begripkaart:hover {
	border-color: var(--sk-rand);
	color: var(--sk-inkt);
}

.sk-begripkaart__naam {
	display: block;
	margin-bottom: 4px;
	font: 600 19px/1.3 var(--sk-serif);
	overflow-wrap: anywhere;
}

.sk-begripkaart:hover .sk-begripkaart__naam {
	color: var(--sk-rood-donker);
}

.sk-begripkaart__label {
	display: block;
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

/* Voor scholen en filmhuizen. */
.sk-scholen {
	border: 1px solid var(--sk-lijn);
}

.sk-scholen__label {
	margin: 0 0 6px;
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-scholen__kop {
	margin: 0 0 6px;
	font-size: 24px;
	line-height: 1.2;
}

.sk-scholen__tekst {
	margin: 0;
	color: var(--sk-tekst);
	font: 400 14px/1.5 var(--sk-sans);
}

/* 9c. Doneren, Contact en English (1j) --------------------------------- */

/* Kop van een pagina met zijbalk (Doneren, Contact). */
.sk-paginakop {
	margin-bottom: 32px;
}

.sk-paginakop .sk-archiefkop__intro {
	max-width: 660px;
	font-size: 18px;
}

.sk-paginatekst {
	max-width: 760px;
	margin-bottom: 32px;
}

.sk-kopregel .sk-paginadeel__kop {
	margin: 0;
}

/* Doneren: twee vakken met de formulieren van SebKijk Mollie Doneren.
   De plug-in laadt zijn eigen stijlblad ná dat van het thema; daarom
   begint alles hier met "body .sk-doneervak .skmd-form" (sterker). */
.sk-doneervakken {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	align-items: start;
	gap: 20px;
}

.sk-doneervakken--een {
	grid-template-columns: minmax(0, 1fr);
	max-width: 560px;
}

.sk-doneervak {
	padding: 28px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
	background: var(--sk-wit);
}

.sk-doneervak--vriend {
	border-color: var(--sk-inkt);
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-doneervak__boven {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
}

.sk-doneervak__label {
	margin: 0 0 8px;
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-doneervak--vriend .sk-doneervak__label {
	color: var(--sk-rood);
}

.sk-doneervak__noot {
	margin: 0;
	font: 400 12px/1.3 var(--sk-sans);
	opacity: .65;
}

.sk-doneervak__titel {
	margin: 0 0 8px;
	font-size: 30px;
	line-height: 1.15;
}

.sk-doneervak--vriend .sk-doneervak__titel {
	color: var(--sk-wit);
}

.sk-doneervak__tekst {
	margin: 0 0 20px;
	color: var(--sk-tekst);
	font: 400 14px/1.55 var(--sk-sans);
}

.sk-doneervak--vriend .sk-doneervak__tekst {
	color: var(--sk-wit);
	opacity: .8;
}

body .sk-doneervak .skmd-form {
	color: inherit;
	font: 400 14px/1.5 var(--sk-sans);
}

body .sk-doneervak .skmd-form__inner {
	gap: 12px;
}

body .sk-doneervak .skmd-form .skmd-label {
	margin-bottom: 6px;
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .06em;
}

body .sk-doneervak .skmd-form .skmd-required {
	color: var(--sk-rood);
}

body .sk-doneervak .skmd-form .skmd-field input[type="text"],
body .sk-doneervak .skmd-form .skmd-field input[type="email"],
body .sk-doneervak .skmd-form .skmd-bedrag input[type="number"],
body .sk-doneervak .skmd-form .skmd-custom input[type="number"] {
	min-height: 0;
	padding: 11px 14px;
	border: 1px solid var(--sk-lijn);
	border-radius: 8px;
	background: var(--sk-wit);
	color: var(--sk-inkt);
	font: 400 14px/1.4 var(--sk-sans);
}

body .sk-doneervak .skmd-form .skmd-field input:focus,
body .sk-doneervak .skmd-form .skmd-bedrag input[type="number"]:focus {
	border-color: var(--sk-rood);
	outline: 2px solid var(--sk-rood);
	outline-offset: 0;
}

body .sk-doneervak .skmd-form .skmd-bedrag {
	gap: 6px 10px;
}

body .sk-doneervak .skmd-form .skmd-bedrag__euro {
	color: inherit;
	font: 600 18px/1 var(--sk-sans);
}

body .sk-doneervak .skmd-form .skmd-bedrag input[type="number"] {
	width: 120px;
	min-height: 0;
	padding: 9px 14px;
	font: 600 17px/1.3 var(--sk-sans);
}

body .sk-doneervak .skmd-form .skmd-bedrag__erna {
	color: var(--sk-zacht);
	font-size: 12px;
}

body .sk-doneervak .skmd-form .skmd-button {
	width: 100%;
	min-height: 0;
	padding: 12px 20px;
	border: 0;
	border-radius: 999px;
	background: var(--sk-inkt);
	color: var(--sk-wit);
	font: 600 14px/1.3 var(--sk-sans);
	letter-spacing: 0;
	text-transform: none;
}

body .sk-doneervak--vriend .skmd-form .skmd-button {
	background: var(--sk-rood);
}

body .sk-doneervak .skmd-form .skmd-button:hover,
body .sk-doneervak .skmd-form .skmd-button:focus-visible {
	background: var(--sk-rood-donker);
	color: var(--sk-wit);
}

body .sk-doneervak .skmd-form .skmd-small {
	color: var(--sk-zacht);
	font-size: 12px;
	line-height: 1.5;
}

/* Op het zwarte vak: wit, iets gedempt. */
body .sk-doneervak--vriend .skmd-form .skmd-label,
body .sk-doneervak--vriend .skmd-form .skmd-bedrag__erna,
body .sk-doneervak--vriend .skmd-form .skmd-small {
	color: var(--sk-wit);
	opacity: .7;
}

body .sk-doneervak .skmd-form .skmd-notice {
	border-radius: 8px;
	background: var(--sk-vlak);
	color: var(--sk-inkt);
	font: 400 13px/1.5 var(--sk-sans);
}

body .sk-doneervak .skmd-form .skmd-amount span {
	min-height: 0;
	border-radius: 999px;
}

/* Na het betalen staat de melding in elk formulier: toon hem één keer. */
.sk-doneervak + .sk-doneervak .skmd-notice {
	display: none;
}

/* Bedragknoppen bij Vriend (assets/js/doneren.js). */
.sk-bedragknoppen {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 10px;
}

.sk-bedragknoppen button {
	padding: 9px 16px;
	border: 1px solid var(--sk-rand);
	border-radius: 999px;
	background: transparent;
	color: inherit;
	font: 600 13px/1.2 var(--sk-sans);
	cursor: pointer;
}

.sk-doneervak--vriend .sk-bedragknoppen button {
	border-color: var(--sk-zacht);
}

.sk-bedragknoppen button:hover {
	border-color: currentColor;
}

.sk-bedragknoppen button[aria-pressed="true"] {
	border-color: var(--sk-wit);
	background: var(--sk-wit);
	color: var(--sk-inkt);
}

.sk-doneervak--eenmalig .sk-bedragknoppen button[aria-pressed="true"] {
	border-color: var(--sk-inkt);
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-anbi {
	margin: 14px 0 0;
	color: var(--sk-zacht);
	font: 400 12px/1.5 var(--sk-sans);
}

/* Waar je bijdrage heen gaat. */
.sk-bijdragecijfers {
	margin-top: 36px;
}

.sk-bijdragecijfers__lijst {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-bijdragecijfers__getal {
	display: block;
	margin-bottom: 6px;
	color: var(--sk-rood);
	font: 600 36px/1.1 var(--sk-serif);
}

.sk-bijdragecijfers__tekst {
	display: block;
	color: var(--sk-tekst);
	font: 400 14px/1.5 var(--sk-sans);
}

/* Zijbalk op Doneren en Contact. */
.sk-zb-zondergeld,
.sk-zb-gegevens {
	display: grid;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--sk-tekst);
	font: 400 13px/1.5 var(--sk-sans);
}

.sk-zb-vrienden {
	margin: 0 0 4px;
	color: var(--sk-inkt);
	font: 600 36px/1.1 var(--sk-serif);
}

.sk-zb-vrienden__tekst {
	margin: 0;
}

.sk-zb-vragen {
	display: grid;
	gap: 6px;
	font: 400 13px/1.5 var(--sk-sans);
}

.sk-zb-vragen__vraag {
	margin: 0;
	color: var(--sk-tekst);
}

.sk-zb-vragen summary {
	color: var(--sk-tekst);
	cursor: pointer;
}

.sk-zb-vragen summary:hover,
.sk-zb-vragen details[open] summary {
	color: var(--sk-inkt);
}

.sk-zb-vragen details p {
	margin: 4px 0 6px;
	color: var(--sk-zacht);
	font-size: 12px;
}

.sk-zb-opdracht__link {
	color: var(--sk-inkt);
	font: 600 13px/1.3 var(--sk-sans);
}

.sk-zb-opdracht__link:hover {
	color: var(--sk-rood-donker);
}

/* Contact: het formulier (Ninja Forms) in een omlijnd vak. */
.sk-contactvak {
	max-width: 760px;
	padding: 28px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
}

.sk-contactvak .sk-paginatekst {
	margin: 0;
	font-size: 17px;
}

.sk-contactvak .sk-paginatekst > :last-child {
	margin-bottom: 0;
}

.sk-contactvak .nf-form-cont,
.sk-contactvak .nf-form-wrap {
	margin: 0;
	font: 400 14px/1.5 var(--sk-sans);
}

.sk-contactvak .nf-form-title,
.sk-contactvak .nf-form-fields-required {
	display: none;
}

.sk-contactvak .nf-field-container {
	margin: 0 0 14px !important;
}

.sk-contactvak .nf-field-label label {
	color: var(--sk-zacht) !important;
	font: 600 11px/1.3 var(--sk-sans) !important;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-contactvak input[type="text"],
.sk-contactvak input[type="email"],
.sk-contactvak input[type="tel"],
.sk-contactvak select,
.sk-contactvak textarea {
	width: 100%;
	height: auto !important;
	min-height: 0 !important;
	padding: 11px 14px !important;
	border: 1px solid var(--sk-lijn) !important;
	border-radius: 8px !important;
	background: var(--sk-wit) !important;
	color: var(--sk-inkt) !important;
	font: 400 15px/1.4 var(--sk-sans) !important;
}

.sk-contactvak input:focus,
.sk-contactvak select:focus,
.sk-contactvak textarea:focus {
	border-color: var(--sk-rood) !important;
	outline: 2px solid var(--sk-rood);
	outline-offset: 0;
}

.sk-contactvak textarea {
	height: 160px !important;
	resize: vertical;
}

.sk-contactvak input[type="submit"],
.sk-contactvak input[type="button"],
.sk-contactvak button {
	width: auto !important;
	height: auto !important;
	min-height: 0 !important;
	padding: 12px 22px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--sk-inkt) !important;
	color: var(--sk-wit) !important;
	font: 600 14px/1.3 var(--sk-sans) !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	cursor: pointer;
}

.sk-contactvak input[type="submit"]:hover,
.sk-contactvak input[type="button"]:hover,
.sk-contactvak button:hover {
	background: var(--sk-rood-donker) !important;
}

/* English: Engelse teksten als kaarten. */
.sk-tekstkaarten {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 28px 20px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-tekstkaart__link {
	display: flex;
	flex-direction: column;
	gap: 6px;
	color: var(--sk-inkt);
}

.sk-tekstkaart__link:hover {
	color: var(--sk-rood-donker);
}

.sk-tekstkaart__beeld {
	display: block;
	margin-bottom: 4px;
	aspect-ratio: 3 / 2;
	border-radius: 8px;
	overflow: hidden;
	background: var(--sk-beeld-leeg);
}

.sk-tekstkaart__beeld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sk-tekstkaart__meta {
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-tekstkaart__titel {
	font: 600 17px/1.3 var(--sk-serif);
	text-wrap: pretty;
}

/* 9d. Over SebKijk (1k) ----------------------------------------------- */

.sk-overkop {
	display: grid;
	grid-template-columns: 180px minmax(0, 1fr);
	align-items: center;
	gap: 32px;
	margin-bottom: 36px;
}

.sk-overkop--zonder {
	grid-template-columns: minmax(0, 1fr);
}

.sk-overkop__portret {
	width: 180px;
	height: 180px;
	margin: 0;
	border-radius: 50%;
	overflow: hidden;
	background: var(--sk-beeld-leeg);
}

.sk-overkop__portret img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sk-overkop .sk-archiefkop__intro {
	max-width: 600px;
	font-size: 18px;
}

/* Vier vlakken met cijfers. */
.sk-overcijfers {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin: 0 0 36px;
	padding: 0;
	list-style: none;
}

.sk-overcijfers li {
	padding: 18px;
	border-radius: 12px;
	background: var(--sk-vlak);
}

.sk-overcijfers__getal {
	display: block;
	font: 600 32px/1.2 var(--sk-serif);
}

.sk-overcijfers__tekst {
	display: block;
	color: var(--sk-zacht);
	font: 400 13px/1.4 var(--sk-sans);
}

/* Knoppen naar de delen: blijven bovenaan staan. */
.sk-ankers {
	position: sticky;
	top: 0;
	z-index: 5;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 36px;
	padding: 10px 0;
	border-bottom: 1px solid var(--sk-lijn);
	background: var(--sk-wit);
}

.sk-ankers .sk-filter__knop {
	padding: 8px 14px;
	font-size: 13px;
}

.admin-bar .sk-ankers {
	top: 32px;
}

/* De beheerbalk van WordPress: 46px hoog op smalle schermen, en onder
   600px schuift hij mee weg. */
@media (max-width: 782px) {
	.admin-bar .sk-ankers {
		top: 46px;
	}
}

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

/* De tekst: kopjes zoals in de mock-up, alinea's smal. */
.sk-overtekst {
	font-size: 17px;
	line-height: 1.75;
}

.sk-overtekst h2 {
	margin: 40px 0 12px;
	font-size: 30px;
	scroll-margin-top: 80px;
}

.sk-overtekst > h2:first-child {
	margin-top: 0;
}

.sk-overtekst > p {
	max-width: 680px;
}

/* "Wat je vindt" en "Hoe ik werk" naast elkaar (sebkijk_overpagina_twee). */
.sk-overtwee {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 32px;
	margin-bottom: 40px;
	font: 400 14px/1.6 var(--sk-sans);
}

.sk-overtwee h3 {
	margin: 0 0 8px;
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-overtwee .wp-block-table {
	margin: 0;
}

.sk-overtwee table {
	width: 100%;
	border-collapse: collapse;
	border-bottom: 1px solid var(--sk-lijn);
}

.sk-overtwee td {
	padding: 9px 12px 9px 0;
	border: 0;
	border-top: 1px solid var(--sk-lijn);
	color: var(--sk-tekst);
	vertical-align: top;
}

.sk-overtwee td:first-child {
	width: 130px;
	color: var(--sk-inkt);
	font-weight: 600;
}

.sk-overtwee td a {
	color: var(--sk-inkt);
	text-decoration: none;
}

.sk-overtwee td a:hover {
	color: var(--sk-rood-donker);
}

.sk-overtwee ul,
.sk-overtwee ol {
	display: grid;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--sk-tekst);
}

.sk-overtwee li strong {
	color: var(--sk-inkt);
}

/* In de media. */
.sk-overmedia__kop {
	margin: 0 0 16px;
	font-size: 30px;
	scroll-margin-top: 80px;
}

.sk-mediaregels {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-mediaregel {
	display: grid;
	grid-template-columns: 60px 160px 90px minmax(0, 1fr) 20px;
	align-items: baseline;
	gap: 14px;
	padding: 12px 0;
	border-top: 1px solid var(--sk-lijn);
	color: var(--sk-inkt);
	font: 400 14px/1.4 var(--sk-sans);
}

a.sk-mediaregel:hover {
	color: var(--sk-inkt);
}

a.sk-mediaregel:hover .sk-mediaregel__titel {
	color: var(--sk-rood-donker);
}

.sk-mediaregel__jaar {
	color: var(--sk-zacht);
}

.sk-mediaregel__medium {
	font-weight: 600;
}

.sk-mediaregel__soort {
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-mediaregel__titel {
	font: 500 16px/1.35 var(--sk-serif);
}

.sk-mediaregel__pijl {
	color: var(--sk-rood-donker);
}

/* Zijbalk: Contact. */
.sk-zb-gegevens a {
	color: var(--sk-inkt);
}

.sk-zb-contact__links {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	margin: 10px 0 0;
	font: 500 13px/1.4 var(--sk-sans);
}

.sk-zb-contact__links a {
	color: var(--sk-inkt);
}

.sk-zb-contact__links a:hover {
	color: var(--sk-rood-donker);
}

/* 9e. Filmbibliotheek en filmpagina (1e) ------------------------------- */

/* Affiches op wit (het overzicht). */
.sk-affiches--licht {
	gap: 28px 18px;
}

.sk-lijstbalk + .sk-affiches--licht {
	margin-top: 20px;
}

.sk-affiches--licht .sk-affiche__link,
.sk-affiches--licht .sk-affiche__link:hover {
	color: var(--sk-inkt);
}

.sk-affiches--licht .sk-affiche__meta {
	color: var(--sk-zacht);
	opacity: 1;
}

.sk-affiche__beeld--leeg {
	display: grid;
	place-items: center;
}

.sk-affiches--licht .sk-affiche__beeld--leeg {
	border: 1px solid var(--sk-lijn);
	background: var(--sk-vlak);
}

.sk-affiche__soort {
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-mediabieb {
	margin-top: 48px;
	padding-top: 32px;
	border-top: 1px solid var(--sk-lijn);
}

.sk-mediabieb__zin {
	max-width: 640px;
	margin: 0 0 24px;
	color: var(--sk-tekst);
	font: 400 16px/1.6 var(--sk-serif);
}

/* Eén werk (?werk=). */
.sk-werkterug {
	margin: 0 0 24px;
	font: 500 13px/1.4 var(--sk-sans);
}

.sk-werkterug a {
	color: var(--sk-zacht);
}

.sk-werkterug a:hover {
	color: var(--sk-rood-donker);
}

.sk-werkkop {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	align-items: end;
	gap: 40px;
	margin-bottom: 40px;
}

.sk-werkkop--zonder {
	grid-template-columns: minmax(0, 1fr);
}

.sk-werkkop__beeld {
	aspect-ratio: 2 / 3;
	margin: 0;
	border-radius: 12px;
	overflow: hidden;
	background: var(--sk-donker-vlak);
}

.sk-werkkop__beeld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sk-werkkop__origineel,
.sk-werkkop__meta,
.sk-werkkop__genre {
	margin: 0 0 6px;
	color: var(--sk-tekst);
	font: 400 16px/1.5 var(--sk-sans);
}

.sk-werkkop__genre {
	color: var(--sk-zacht);
	font-size: 14px;
}

.sk-werkkop__sterren {
	margin-top: 12px;
}

.sk-werkkop__sterren .sk-sterren,
.sk-zb-fiche .sk-sterren,
.sk-kritiekkaart .sk-sterren {
	position: relative;
	display: inline-block;
	font: 400 18px/1 var(--sk-serif);
	letter-spacing: 2px;
}

.sk-werkkop__sterren .sk-sterren__leeg,
.sk-zb-fiche .sk-sterren__leeg,
.sk-kritiekkaart .sk-sterren__leeg {
	color: var(--sk-rand);
}

.sk-werkkop__sterren .sk-sterren__vol,
.sk-zb-fiche .sk-sterren__vol,
.sk-kritiekkaart .sk-sterren__vol {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--sk-sterren-vol, 0%);
	overflow: hidden;
	color: var(--sk-rood);
	white-space: nowrap;
}

/* De filmpagina: het beeld over de hele breedte. */
.sk-filmheld {
	max-width: 1280px;
	height: 460px;
	margin: 0 auto;
	overflow: hidden;
	background: var(--sk-donker-vlak);
}

.sk-filmheld--leeg {
	height: 180px;
}

.sk-filmheld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sk-filmheld__bron {
	margin-top: 8px;
	margin-bottom: 0;
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
	text-align: right;
}

.sk-filmpagina {
	padding-top: 48px;
}

/* De titelkaart schuift over het beeld. */
.sk-filmkaart {
	position: relative;
	margin: -138px 0 36px;
	padding: 28px 32px 26px;
	border-radius: 12px;
	background: var(--sk-wit);
	box-shadow: var(--sk-schaduw);
}

.sk-filmheld__bron + .sk-filmpagina .sk-filmkaart {
	margin-top: -162px;
}

.sk-filmkaart__labels {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 10px;
	margin: 0 0 10px;
	color: var(--sk-zacht);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-filmkaart__labels > * + *::before {
	content: "·";
	margin-right: 10px;
}

.sk-filmkaart__labels a {
	color: inherit;
}

.sk-filmkaart__labels a:hover {
	color: var(--sk-inkt);
}

.sk-filmkaart__soort {
	color: var(--sk-rood-donker);
}

.sk-filmkaart__titel {
	margin: 0 0 10px;
	font-size: 52px;
	line-height: 1.05;
	letter-spacing: -.02em;
}

.sk-filmkaart__jaar {
	color: var(--sk-zacht);
	font-weight: 400;
}

.sk-filmkaart__meta {
	margin: 0;
	color: var(--sk-tekst);
	font: 400 15px/1.5 var(--sk-sans);
}

/* Introductie met een rode beginletter. */
.sk-filmintro {
	max-width: 760px;
	margin-bottom: 36px;
	font: 400 22px/1.5 var(--sk-serif);
}

.sk-filmintro p {
	margin: 0 0 16px;
}

.sk-filmintro > p:first-child::first-letter {
	float: left;
	margin: 6px 12px 0 0;
	color: var(--sk-rood);
	font: 700 64px/.8 var(--sk-serif);
}

.sk-filmdeel {
	margin-bottom: 44px;
	scroll-margin-top: 24px;
}

.sk-filmdeel__kop {
	margin: 0 0 12px;
	font-size: 30px;
	line-height: 1.2;
}

.sk-filmdeel .sk-kopregel {
	margin-bottom: 4px;
}

.sk-filmdeel .sk-kopregel .sk-filmdeel__kop {
	margin: 0;
}

.sk-filmdeel__aantal {
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

.sk-filmdeel__uitleg {
	margin: 0 0 16px;
	color: var(--sk-tekst);
	font: 400 14px/1.5 var(--sk-sans);
}

.sk-filmtekst {
	max-width: 760px;
	font-size: 17px;
}

/* De trailer: laadt pas na een klik (assets/js/film.js). */
.sk-trailer {
	max-width: 760px;
	margin: 20px 0 0;
}

.sk-trailer__knop,
.sk-trailer iframe {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	padding: 0;
	border: 0;
	border-radius: 12px;
	overflow: hidden;
	background: var(--sk-inkt);
	cursor: pointer;
}

.sk-trailer__knop img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .55;
}

.sk-trailer__speel {
	position: absolute;
	top: 50%;
	left: 50%;
	display: grid;
	place-items: center;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--sk-rood);
	color: var(--sk-wit);
	transform: translate(-50%, -50%);
}

.sk-trailer__knop:hover .sk-trailer__speel,
.sk-trailer__knop:focus-visible .sk-trailer__speel {
	background: var(--sk-rood-donker);
}

.sk-trailer figcaption {
	margin-top: 8px;
	color: var(--sk-zacht);
	font: 400 12px/1.5 var(--sk-sans);
}

.sk-trailer__noot {
	display: block;
}

/* Filminformatie: kaarten zonder beeld, twee naast elkaar. */
.sk-infokaarten,
.sk-kritiekkaarten,
.sk-filmnotities,
.sk-galerij {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-infokaarten {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
}

.sk-infokaart {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 170px;
	padding: 20px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
	color: var(--sk-inkt);
}

.sk-infokaart:hover {
	border-color: var(--sk-rand);
	color: var(--sk-inkt);
}

.sk-infokaart__soort,
.sk-kritiekkaart__soort {
	margin-bottom: 8px;
	color: var(--sk-rood-donker);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-infokaart__titel {
	font: 600 19px/1.3 var(--sk-serif);
}

.sk-infokaart:hover .sk-infokaart__titel,
.sk-kritiekkaart:hover .sk-kritiekkaart__titel {
	color: var(--sk-rood-donker);
}

.sk-infokaart__meta {
	margin-top: auto;
	padding-top: 16px;
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

/* Filmkritiek: beeld links, tekst rechts. */
.sk-kritiekkaarten {
	display: grid;
	gap: 14px;
}

.sk-kritiekkaart {
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr);
	gap: 20px;
	padding: 18px;
	border: 1px solid var(--sk-lijn);
	border-radius: 12px;
	color: var(--sk-inkt);
}

.sk-kritiekkaart:hover {
	border-color: var(--sk-rand);
	color: var(--sk-inkt);
}

.sk-kritiekkaart__beeld {
	display: block;
	aspect-ratio: 16 / 10;
	border-radius: 8px;
	overflow: hidden;
	background: var(--sk-beeld-leeg);
}

.sk-kritiekkaart__beeld img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.sk-kritiekkaart__tekst {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.sk-kritiekkaart__titel {
	margin-bottom: 6px;
	font: 600 22px/1.3 var(--sk-serif);
}

.sk-kritiekkaart__sterren {
	margin-bottom: 8px;
}

.sk-kritiekkaart__intro {
	color: var(--sk-tekst);
	font: 400 14px/1.55 var(--sk-sans);
}

/* Notities bij een film of werk. */
.sk-filmnotities {
	display: grid;
	gap: 12px;
}

.sk-filmnotitie {
	padding: 18px 20px;
	border-radius: 12px;
	background: var(--sk-vlak);
}

.sk-filmnotitie__over {
	margin: 0 0 8px;
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

.sk-filmnotitie__over a {
	color: var(--sk-zacht);
	text-decoration: underline;
}

.sk-filmnotitie__soort {
	margin-right: 8px;
	color: var(--sk-rood-donker);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.sk-filmnotitie__tekst {
	margin: 0;
	font: 400 16px/1.6 var(--sk-serif);
}

blockquote.sk-filmnotitie__tekst {
	padding-left: 14px;
	border-left: 3px solid var(--sk-rood);
	font-style: italic;
}

blockquote.sk-filmnotitie__tekst p {
	margin: 0;
}

.sk-filmnotitie__bron {
	margin: 8px 0 0;
	color: var(--sk-zacht);
	font: 400 12px/1.4 var(--sk-sans);
}

/* Galerij: vier naast elkaar. */
.sk-galerij {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px;
}

.sk-galerij a {
	display: block;
	aspect-ratio: 4 / 3;
	border-radius: 8px;
	overflow: hidden;
	background: var(--sk-beeld-leeg);
}

.sk-galerij img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* De zwarte band onderaan (zoals op Diensten). */
.sk-filmband {
	margin-top: 4px;
}

.sk-filmband__label {
	margin: 0 0 6px;
	color: var(--sk-wit);
	font: 600 11px/1.3 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
	opacity: .7;
}

.sk-filmband .sk-slotband__kop {
	font-size: 22px;
}

.sk-pil--wit {
	background: var(--sk-wit);
	color: var(--sk-inkt);
}

.sk-pil--wit:hover {
	background: var(--sk-rood);
	color: var(--sk-wit);
}

/* Zijbalk op een filmpagina. */
.sk-zb-inhoud__lijst {
	display: grid;
	gap: 4px;
	margin: 0;
	padding: 0;
	list-style: none;
	font: 400 14px/1.5 var(--sk-sans);
}

.sk-zb-inhoud__lijst a {
	color: var(--sk-inkt);
}

.sk-zb-inhoud__lijst a:hover,
.sk-zb-inhoud__lijst a[aria-current] {
	color: var(--sk-rood-donker);
	font-weight: 600;
}

.sk-zb-fiche__kop {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin-bottom: 6px;
}

.sk-zb-fiche__kop .sk-zijblok__kop {
	margin: 0;
}

.sk-zb-fiche__lijst {
	margin: 0;
}

.sk-zb-fiche__lijst div {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	gap: 10px;
	padding: 8px 0;
	border-top: 1px solid var(--sk-lijn);
	font: 400 13px/1.45 var(--sk-sans);
}

.sk-zb-fiche__lijst dt {
	color: var(--sk-zacht);
}

.sk-zb-fiche__lijst dd {
	margin: 0;
	color: var(--sk-inkt);
	font-weight: 600;
	overflow-wrap: anywhere;
}

/* Verder kijken onder de introductie, en Bronnen in de zijbalk (les 10c). */
.sk-filmverder {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 40px;
}

.sk-filmverder__label {
	margin: 0 6px 0 0;
	color: var(--sk-zacht);
	font: 600 11px/1.4 var(--sk-sans);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sk-filmverder__lijst {
	display: contents;
	list-style: none;
}

.sk-filmverder__knop {
	display: inline-block;
	padding: 6px 12px;
	border: 1px solid var(--sk-inkt);
	border-radius: 999px;
	color: var(--sk-inkt);
	font: 500 13px/1.3 var(--sk-sans);
	text-decoration: none;
}

a.sk-filmverder__knop:hover,
a.sk-filmverder__knop:focus-visible {
	background: var(--sk-inkt);
	color: var(--sk-wit);
}

.sk-zb-bronnen__lijst {
	display: grid;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--sk-tekst);
	font: 400 13px/1.45 var(--sk-sans);
}

.sk-zb-bronnen__lijst a {
	color: inherit;
	text-decoration: none;
}

.sk-zb-bronnen__lijst a:hover {
	color: var(--sk-rood);
}

/* Zonder zijbalk: Bronnen onder de tekst. */
.sk-hoofd > .sk-zb-bronnen {
	max-width: 760px;
	margin-bottom: 44px;
}

/* 9f. Lijsten, zoeken, 404 en de telefoon (1l, 1m) ---------------------- */

.sk-lijstpagina .sk-paginakop {
	margin-bottom: 24px;
}

.sk-lijstpagina .sk-lijstbalk__wat a {
	color: var(--sk-inkt);
	font-weight: 500;
}

.sk-lijstpagina .sk-lijstbalk__wat a:hover {
	color: var(--sk-rood-donker);
}

.sk-zoekgroot {
	max-width: 560px;
	margin-top: 18px;
}

.sk-zoekgroot .sk-zoeken__veld,
.sk-zoekgroot .sk-zoeken__knop {
	padding: 13px 18px;
	font-size: 15px;
}

.sk-zoekpagina .sk-archiefkop__intro a {
	color: var(--sk-inkt);
}

.sk-foutpagina__kop {
	max-width: 720px;
	margin-bottom: 40px;
}

.sk-foutpagina__knoppen {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}

.sk-foutpagina__knoppen .sk-filter__knop {
	padding: 8px 14px;
	font-size: 13px;
}

/* Alleen op de telefoon (zie deel 11): menuknop, menupaneel, leesbalk en
   de knoppen onder een ingeklapte fiche of de notities. */
.sk-menuknop,
.sk-menupaneel,
.sk-leesbalk,
.sk-inklapknop {
	display: none;
}

/* 10. Voet -------------------------------------------------------------- */

.sk-voet {
	max-width: 1280px;
	margin: 40px auto 0;
	padding: 0 24px 24px;
}

.sk-voet__binnen {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr;
	gap: 32px;
	padding: 28px 32px;
	border-radius: 12px;
	background: var(--sk-vlak);
	color: var(--sk-zacht);
	font: 400 13px/1.7 var(--sk-sans);
}

.sk-voet .custom-logo {
	display: block;
	height: 40px;
	width: auto;
	margin-bottom: 10px;
}

.sk-voet__bedrijf p {
	margin: 0;
}

.sk-voet__kop {
	margin: 0;
	color: var(--sk-inkt);
	font: 600 13px/1.7 var(--sk-sans);
}

.sk-voet__lijst {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sk-voet__lijst a {
	color: var(--sk-zacht);
}

.sk-voet__lijst a:hover {
	color: var(--sk-inkt);
}

/* 11. Telefoon en tablet ----------------------------------------------- */

/* Smaller dan de zijbalk toelaat: zijbalk onder de inhoud. */
@media (max-width: 1080px) {
	.sk-kop__binnen {
		flex-wrap: wrap;
		padding: 12px 24px;
	}

	/* Het menu krijgt een eigen regel en schuift opzij (mock-up 1l). */
	.sk-hoofdmenu {
		order: 3;
		margin: 0 -24px;
		width: calc(100% + 48px);
		overflow-x: auto;
		scrollbar-width: none;
	}

	.sk-hoofdmenu__lijst {
		flex-wrap: nowrap;
		justify-content: flex-start;
		gap: 6px;
		padding: 0 24px;
	}

	.sk-hoofdmenu__lijst a {
		background: var(--sk-vlak);
	}

	.sk-kolommen {
		grid-template-columns: minmax(0, 1fr);
	}

	.sk-held {
		gap: 24px;
		padding: 22px;
	}

	.sk-held__titel {
		font-size: 34px;
	}

	/* Op de homepage: feed, dan de stroken, dan de zijbalk (mock-up 1l). */
	.sk-hoofd {
		order: 1;
	}

	.sk-stroken {
		order: 2;
		margin-top: 0;
	}

	.sk-zijbalk {
		order: 3;
	}

	.sk-duo {
		grid-template-columns: minmax(0, 1fr);
	}

	/* Teksten en Nieuwsarchief: alles onder elkaar, filters als knoppen. */
	.sk-archiefkop,
	.sk-archiefraster {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}

	.sk-filter__lijst {
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
	}

	.sk-filter__regel {
		padding: 6px 12px;
		border-radius: 999px;
		background: var(--sk-vlak);
		font-size: 12px;
		line-height: 1.3;
	}

	.sk-soortknoppen ul {
		justify-content: flex-start;
	}

	.sk-werkrij {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.sk-studio__slot {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	/* Diensten en Educatie. */
	.sk-knoppenrij,
	.sk-elders__rechts .sk-filterknoppen {
		justify-content: flex-start;
	}

	.sk-stappen,
	.sk-ebooks {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 28px;
	}

	.sk-dienstkaarten,
	.sk-elders,
	.sk-begrippenvak {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}

	.sk-dienstkaart {
		min-height: 0;
	}

	.sk-dienstkaart__prijs {
		margin-top: 0;
	}

	/* Doneren, Contact en English. */
	.sk-tekstkaarten {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* Over SebKijk. */
	.sk-overcijfers {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* Filmbibliotheek en filmpagina. */
	.sk-affiches--licht {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.sk-filmheld {
		height: 380px;
	}
}

@media (max-width: 700px) {
	.sk-breedte {
		padding: 0 14px;
	}

	.sk-kop__binnen {
		padding: 12px 18px;
	}

	.sk-hoofdmenu {
		margin: 0 -18px;
		width: calc(100% + 36px);
	}

	.sk-hoofdmenu__lijst {
		padding: 0 18px;
		font-size: 12px;
	}

	.sk-hoofdmenu__lijst a {
		padding: 7px 12px;
	}

	.sk-kop .custom-logo,
	body:not(.home) .sk-kop .custom-logo {
		height: 40px;
	}

	.sk-zoekknop__knop {
		width: 44px;
		height: 44px;
	}

	.sk-zoekknop__vak {
		position: fixed;
		left: 14px;
		right: 14px;
		top: 72px;
		width: auto;
	}

	.sk-kolommen {
		padding-top: 22px;
	}

	.sk-lijstkop__titel {
		font-size: 22px;
	}

	.sk-feedkaart {
		grid-template-columns: 96px minmax(0, 1fr);
		gap: 14px;
		padding: 12px;
	}

	.sk-feedkaart__beeld {
		aspect-ratio: 1;
		border-radius: 8px;
	}

	.sk-feedkaart__titel {
		margin: 0;
		font-size: 16px;
		line-height: 1.3;
		font-weight: 500;
	}

	.sk-feedkaart__intro {
		display: none;
	}

	/* Op de telefoon onder de titel alleen de datum (mock-up 1l). */
	.sk-feedkaart__tekst {
		display: flex;
		flex-direction: column;
	}

	.sk-feedkaart .sk-meta {
		order: 2;
		margin: 4px 0 0;
	}

	.sk-feedkaart .sk-meta__soort,
	.sk-feedkaart .sk-meta__punt,
	.sk-feedkaart .sk-meta__leestijd {
		display: none;
	}

	/* Homepage op de telefoon (mock-up 1l): beeld boven de tekst. */
	.sk-voorpagina {
		padding-top: 4px;
	}

	.sk-held {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
		padding: 0;
		overflow: hidden;
	}

	.sk-held__beeld {
		border-radius: 0;
	}

	.sk-held__tekst {
		padding: 16px 18px 18px;
	}

	.sk-held__label {
		display: flex;
		margin-bottom: 6px;
		padding: 0;
		background: none;
		color: var(--sk-rood-donker);
		font-size: 12px;
		font-weight: 700;
		letter-spacing: .06em;
		text-transform: uppercase;
	}

	.sk-held__soort {
		font-weight: 700;
	}

	.sk-held__titel {
		margin-bottom: 8px;
		font-size: 28px;
		line-height: 1.1;
		letter-spacing: -.01em;
	}

	.sk-held__sterren {
		margin-bottom: 8px;
	}

	.sk-held .sk-sterren {
		font-size: 18px;
	}

	.sk-held__samenvatting {
		margin-bottom: 14px;
		font-size: 14px;
		line-height: 1.55;
	}

	.sk-held__leestijd {
		display: none;
	}

	/* De drie kaarten worden regels, zoals de feed. */
	.sk-drietal {
		grid-template-columns: minmax(0, 1fr);
		gap: 14px;
		margin-top: 14px;
	}

	.sk-tegel {
		display: grid;
		grid-template-columns: 96px minmax(0, 1fr);
		gap: 14px;
		padding: 12px;
	}

	.sk-tegel__beeld {
		aspect-ratio: 1;
		border-radius: 8px;
		overflow: hidden;
	}

	.sk-tegel__tekst {
		display: flex;
		flex-direction: column;
		padding: 0;
	}

	.sk-tegel__soort,
	.sk-tegel__leestijd {
		display: none;
	}

	.sk-tegel__titel {
		margin: 0;
		font-size: 16px;
		font-weight: 500;
	}

	.sk-tegel__meta {
		order: 2;
		margin-top: 4px;
	}

	.sk-kopregel__titel {
		font-size: 22px;
	}

	.sk-stroken {
		gap: 14px;
	}

	.sk-strook,
	.sk-aanbod {
		padding: 20px;
	}

	.sk-strook__kop {
		flex-wrap: wrap;
		gap: 4px 16px;
	}

	.sk-strook__titel,
	.sk-aanbod__titel {
		font-size: 22px;
	}

	/* Affiches schuiven opzij. */
	.sk-affiches {
		display: flex;
		gap: 8px;
		margin: 0 -20px;
		padding: 0 20px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding: 0 20px;
		scrollbar-width: none;
	}

	.sk-affiche {
		flex: 0 0 112px;
		scroll-snap-align: start;
	}

	.sk-affiche__titel {
		font-size: 14px;
	}


	.sk-omslagen {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.sk-los__titel {
		font-size: 30px;
	}

	.sk-archiefpagina {
		padding-top: 22px;
	}

	.sk-archiefkop__titel {
		font-size: 36px;
	}

	.sk-archiefkop__intro {
		font-size: 15px;
	}

	.sk-jaarstaven {
		height: 80px;
		gap: 3px;
	}

	.sk-jaarstaven__jaar a {
		font-size: 9px;
	}

	.sk-lijstbalk {
		flex-wrap: wrap;
	}

	.sk-lijstregel,
	.sk-lijstregel--nieuws {
		grid-template-columns: auto minmax(0, 1fr);
		gap: 4px 12px;
	}

	.sk-lijstregel__titel,
	.sk-lijstregel__sterren {
		grid-column: 1 / -1;
		text-align: left;
	}

	.sk-lijstregel__titel {
		font-size: 17px;
	}

	.sk-maandrij {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}

	/* Studio en de band Studio: groot werk boven, de rest twee aan twee. */
	.sk-werkraster,
	.sk-werkraster--band {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-template-rows: 280px;
		grid-auto-rows: 180px;
		gap: 10px;
	}

	.sk-werkvak--groot {
		grid-column: 1 / -1;
		grid-row: auto;
	}

	.sk-werkvak__link {
		padding: 10px 10px 8px;
	}

	.sk-werkrij {
		gap: 12px;
	}

	.sk-cijfers {
		grid-template-columns: minmax(0, 1fr);
		gap: 8px;
	}

	.sk-filmregel {
		grid-template-columns: auto minmax(0, 1fr);
		gap: 4px 12px;
	}

	.sk-filmregel__titel {
		grid-column: 1 / -1;
		grid-row: 2;
	}

	.sk-filmregel__sterren {
		text-align: left;
	}

	/* Een los bericht op de telefoon (mock-up 1m; de inklapbare fiche komt in les 11). */
	.sk-bericht__titel {
		font-size: 30px;
	}

	.sk-intro {
		font-size: 17px;
	}

	.sk-melding {
		margin-left: 0;
	}

	.sk-ficheblok,
	.sk-bericht > .sk-fiche {
		padding: 18px;
	}

	.sk-fiche__boven {
		flex-wrap: wrap;
	}

	.sk-fiche__lijst {
		grid-template-columns: minmax(0, 1fr);
	}

	.sk-fiche__regel {
		grid-template-columns: 110px minmax(0, 1fr);
	}

	.sk-bericht__tekst {
		font-size: 17px;
	}

	.sk-bericht__tekst blockquote {
		font-size: 19px;
	}

	.sk-notitieblok__aantal {
		position: static;
		display: block;
		margin-bottom: 4px;
	}

	.sk-onderaan {
		grid-template-columns: minmax(0, 1fr);
	}

	.sk-leesook__lijst {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}

	.sk-leesook__link {
		display: grid;
		grid-template-columns: 96px minmax(0, 1fr);
		grid-template-rows: auto 1fr;
		column-gap: 14px;
	}

	.sk-leesook__beeld {
		grid-row: span 2;
		aspect-ratio: 1;
		margin: 0;
	}

	.sk-tekst {
		font-size: 17px;
	}

	.sk-voet {
		padding: 0 14px 14px;
	}

	/* De voet kort (mock-up 1l): de links achter elkaar, dan de gegevens. */
	.sk-voet__binnen {
		display: flex;
		flex-direction: column;
		gap: 10px;
		padding: 20px;
	}

	.sk-voet__bedrijf {
		order: 2;
		margin-top: 8px;
	}

	.sk-voet__bedrijf .custom-logo-link,
	.sk-voet__kop {
		display: none;
	}

	.sk-voet__lijst {
		display: block;
		font-size: 13px;
		line-height: 1.7;
	}

	.sk-voet__lijst li {
		display: inline;
	}

	.sk-voet__lijst li + li::before {
		content: " · ";
		color: var(--sk-zacht);
	}

	/* Diensten en Educatie. */
	.sk-archiefkop--knoppen {
		padding-bottom: 24px;
	}

	.sk-paginadeel {
		padding: 28px 0;
	}

	.sk-paginadeel__kop {
		font-size: 24px;
	}

	.sk-dienstkaart {
		padding: 22px;
	}

	.sk-dienstkaart__naam {
		font-size: 22px;
	}

	.sk-publicatie {
		grid-template-columns: auto auto minmax(0, 1fr) 20px;
		grid-template-areas:
			"blad blad blad pijl"
			"titel titel titel titel"
			"soort datum . .";
		gap: 4px 12px;
	}

	.sk-publicatie__blad {
		grid-area: blad;
	}

	.sk-publicatie__titel {
		grid-area: titel;
	}

	.sk-publicatie__soort {
		grid-area: soort;
	}

	.sk-publicatie__datum {
		grid-area: datum;
	}

	.sk-publicatie__pijl {
		grid-area: pijl;
	}

	.sk-sites,
	.sk-begripkaarten {
		grid-template-columns: minmax(0, 1fr);
	}

	.sk-slotband,
	.sk-scholen,
	.sk-bijdrage {
		flex-direction: column;
		align-items: flex-start;
	}

	.sk-slotband,
	.sk-scholen {
		padding: 22px;
	}

	.sk-boekvak {
		padding: 20px;
	}

	.sk-ebooks {
		gap: 24px 14px;
	}

	.sk-ebook .sk-omslag__voorkant {
		padding: 12px;
	}

	.sk-ebook .sk-omslag__titel {
		font-size: 16px;
	}

	/* Doneren, Contact en English. */
	.sk-paginakop {
		margin-bottom: 24px;
	}

	.sk-paginakop .sk-archiefkop__intro {
		font-size: 15px;
	}

	.sk-doneervakken,
	.sk-bijdragecijfers__lijst {
		grid-template-columns: minmax(0, 1fr);
	}

	.sk-doneervak,
	.sk-contactvak {
		padding: 22px;
	}

	.sk-doneervak__titel {
		font-size: 26px;
	}

	.sk-bijdragecijfers__getal {
		font-size: 30px;
	}

	.sk-tekstkaarten {
		gap: 22px 14px;
	}

	.sk-tekstkaart__titel {
		font-size: 15px;
	}

	/* Over SebKijk. */
	.sk-overkop {
		grid-template-columns: 120px minmax(0, 1fr);
		gap: 18px;
		margin-bottom: 24px;
	}

	.sk-overkop--zonder {
		grid-template-columns: minmax(0, 1fr);
	}

	.sk-overkop__portret {
		width: 120px;
		height: 120px;
	}

	.sk-overkop .sk-archiefkop__intro {
		font-size: 15px;
	}

	.sk-overcijfers {
		gap: 10px;
		margin-bottom: 24px;
	}

	.sk-overcijfers li {
		padding: 14px;
	}

	.sk-overcijfers__getal {
		font-size: 26px;
	}

	.sk-ankers {
		flex-wrap: nowrap;
		margin-bottom: 24px;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.sk-ankers .sk-filter__knop {
		flex-shrink: 0;
	}

	.sk-overtekst h2,
	.sk-overmedia__kop {
		font-size: 26px;
	}

	.sk-overtwee {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}

	.sk-overtwee td:first-child {
		width: 110px;
	}

	.sk-mediaregel {
		grid-template-columns: auto minmax(0, 1fr) 20px;
		grid-template-areas:
			"jaar medium pijl"
			"titel titel titel"
			"soort soort soort";
		gap: 4px 12px;
	}

	.sk-mediaregel__jaar {
		grid-area: jaar;
	}

	.sk-mediaregel__medium {
		grid-area: medium;
	}

	.sk-mediaregel__soort {
		grid-area: soort;
	}

	.sk-mediaregel__titel {
		grid-area: titel;
	}

	.sk-mediaregel__pijl {
		grid-area: pijl;
	}

	/* Filmbibliotheek: affiches op wit in twee kolommen, niet opzij. */
	.sk-affiches--licht {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 24px 14px;
		margin: 0;
		padding: 0;
		overflow: visible;
	}

	.sk-affiches--licht .sk-affiche {
		flex: none;
	}

	.sk-werkkop {
		grid-template-columns: 120px minmax(0, 1fr);
		align-items: start;
		gap: 18px;
	}

	.sk-werkkop--zonder {
		grid-template-columns: minmax(0, 1fr);
	}

	/* Filmpagina. */
	.sk-filmheld {
		height: 240px;
	}

	.sk-filmpagina {
		padding-top: 24px;
	}

	.sk-filmkaart {
		margin: -84px 0 24px;
		padding: 20px;
	}

	.sk-filmheld__bron + .sk-filmpagina .sk-filmkaart {
		margin-top: -108px;
	}

	.sk-filmkaart__titel {
		font-size: 34px;
	}

	.sk-filmintro {
		font-size: 18px;
	}

	.sk-filmintro > p:first-child::first-letter {
		font-size: 52px;
	}

	.sk-filmdeel__kop {
		font-size: 24px;
	}

	.sk-infokaarten,
	.sk-kritiekkaart {
		grid-template-columns: minmax(0, 1fr);
	}

	.sk-infokaart {
		min-height: 0;
	}

	.sk-galerij {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* De kop (mock-up 1l en 1m): menuknop links, logo in het midden,
	   zoeken rechts. Alleen als JavaScript werkt (sk-js); anders blijft de
	   rij met menuknoppen staan. */
	.sk-js .sk-kop__binnen {
		display: grid;
		grid-template-columns: 44px minmax(0, 1fr) 44px;
		align-items: center;
		gap: 8px;
	}

	.sk-js .sk-menuknop {
		display: grid;
		place-items: center;
		width: 44px;
		height: 44px;
		padding: 0;
		border: 0;
		border-radius: 50%;
		background: none;
		color: var(--sk-inkt);
		cursor: pointer;
	}

	.sk-js .sk-menuknop[aria-expanded="true"] {
		background: var(--sk-vlak);
	}

	.sk-js .sk-kop__logo {
		justify-self: center;
	}

	.sk-js .sk-kop__acties {
		justify-self: end;
	}

	.sk-js .sk-kop__steun {
		display: none;
	}

	.sk-js .sk-zoekknop__knop {
		border-color: transparent;
	}

	/* De rij met menuknoppen alleen op de homepage. */
	.sk-js .sk-hoofdmenu {
		grid-column: 1 / -1;
	}

	.sk-js body:not(.home) .sk-hoofdmenu {
		display: none;
	}

	/* Behalve op de homepage blijft de kop bovenaan staan. */
	body:not(.home) .sk-kop {
		position: sticky;
		top: 0;
		z-index: 50;
		background: var(--sk-wit);
	}

	.sk-menupaneel:not([hidden]) {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		z-index: 60;
		display: block;
		max-height: calc(100vh - 72px);
		overflow-y: auto;
		padding: 8px 18px 22px;
		border-bottom: 1px solid var(--sk-lijn);
		background: var(--sk-wit);
		box-shadow: var(--sk-schaduw);
	}

	.sk-kop {
		position: relative;
	}

	.sk-menupaneel__lijst,
	.sk-menupaneel__klein {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.sk-menupaneel__lijst a {
		display: block;
		padding: 12px 0;
		border-bottom: 1px solid var(--sk-lijn);
		color: var(--sk-inkt);
		font: 600 18px/1.3 var(--sk-serif);
	}

	.sk-menupaneel__lijst .current-menu-item > a,
	.sk-menupaneel__lijst .current_page_item > a {
		color: var(--sk-rood-donker);
	}

	.sk-menupaneel__klein {
		display: flex;
		flex-wrap: wrap;
		gap: 4px 16px;
		margin: 14px 0 18px;
		font: 500 14px/1.4 var(--sk-sans);
	}

	.sk-menupaneel__klein a {
		color: var(--sk-zacht);
	}

	.sk-menu-open {
		overflow: hidden;
	}

	/* De leesbalk onder de kop van een bericht. */
	.sk-leesbalk {
		display: block;
		height: 3px;
		background: var(--sk-lijn-licht);
	}

	.sk-leesbalk__vol {
		display: block;
		width: 0;
		height: 100%;
		background: var(--sk-rood);
	}

	/* Over SebKijk: de knoppenbalk plakt onder de kop. */
	.sk-ankers,
	.admin-bar .sk-ankers {
		top: 68px;
	}

	/* De zijbalk onder de tekst, met minder blokken (inc/zijbalk.php). */
	.sk-zb-alleen-breed {
		display: none;
	}

	/* Kijkfiche en notities klappen in (assets/js/telefoon.js). */
	.sk-kijkfiche.sk-ingeklapt .sk-fiche__regel:not(.sk-fiche__regel--kort),
	.sk-notities.sk-ingeklapt .sk-notities__lijst > li + li {
		display: none;
	}

	.sk-inklapknop {
		display: inline-block;
		margin-top: 12px;
		padding: 0;
		border: 0;
		background: none;
		color: var(--sk-inkt);
		font: 600 13px/1.4 var(--sk-sans);
		cursor: pointer;
	}

	.sk-inklapknop:hover {
		color: var(--sk-rood-donker);
	}
}

/* Tussen 601 en 700px staat de beheerbalk van WordPress vast bovenaan. */
@media (min-width: 601px) and (max-width: 700px) {
	.admin-bar:not(.home) .sk-kop {
		top: 46px;
	}

	.admin-bar .sk-ankers {
		top: 114px;
	}
}