/* ═══════════════════════════════════════════════════════════
 *  CODWarzone: Stylesheet
 *  Kleuren en lettertypes komen uit theme.json. Dit bestand legt het
 *  fundament (container, 12-koloms grid, spacing) en de componenten.
 *  Grid en spacing zijn overgenomen van het Gevelplanten-fundament:
 *  12 kolommen van 80px + 11 gaps van 40px = 1400px, plus 2 x 40px padding.
 *
 *   1. VARIABELEN
 *   2. BASIS
 *   3. LAYOUT: container, secties, grid
 *   4. HEADER
 *   5. FOOTER
 *   6. TYPOGRAFIE
 *   7. KNOPPEN
 *   8. HERO
 *   9. KAARTEN
 *  10. CALCULATORS & FORMULIEREN
 *  11. TABELLEN, ZOEKEN, 404
 *  12. RESPONSIVE
 *  13. MINDER BEWEGING
 * ═══════════════════════════════════════════════════════════ */

/* 1. VARIABELEN ─────────────────────────────────────────── */

:root {
	--cw-bg: var(--wp--preset--color--bg);
	--cw-surface: var(--wp--preset--color--surface);
	--cw-surface-2: var(--wp--preset--color--surface-2);
	--cw-ink: var(--wp--preset--color--ink);
	--cw-muted: var(--wp--preset--color--muted);
	--cw-accent: var(--wp--preset--color--accent);
	--cw-signal: var(--wp--preset--color--signal);
	--cw-line: var(--wp--preset--color--line);

	--cw-accent-deep: color-mix(in srgb, var(--cw-accent) 80%, #000 20%);
	--cw-accent-glow: color-mix(in srgb, var(--cw-accent) 28%, transparent);

	--font-heading: var(--wp--preset--font-family--heading);
	--font-body: var(--wp--preset--font-family--body);

	/* Spacing: 4px-schaal */
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-5: 1.25rem;
	--space-6: 1.5rem;
	--space-8: 2rem;
	--space-10: 2.5rem;
	--space-12: 3rem;
	--space-16: 4rem;
	--space-20: 5rem;
	--space-24: 6rem;

	--cw-section-pad: clamp(var(--space-16), 3rem + 3vw, var(--space-24));

	/* Grid */
	--cw-container-max: 92.5rem;
	--cw-content-max: 87.5rem;
	--cw-container-pad: var(--space-10);
	--cw-grid-cols: 12;
	--cw-grid-gap: var(--space-10);
	--cw-header-h: 4.5rem;

	--radius-sm: 2px;
	--radius-md: 6px;
	--transition: 160ms ease;
}

/* 2. BASIS ──────────────────────────────────────────────── */

html {
	scroll-padding-top: calc(var(--cw-header-h) + var(--space-6));
	color-scheme: dark;
}

body {
	background-color: var(--cw-bg);
	background-image: radial-gradient(ellipse 70rem 32rem at 80% -8rem, var(--cw-accent-glow), transparent 70%);
	background-repeat: no-repeat;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

::selection {
	background: var(--cw-accent);
	color: var(--cw-ink);
}

*:focus-visible {
	outline: 2px solid var(--cw-signal);
	outline-offset: 2px;
}

h1, h2, h3, h4 {
	text-wrap: balance;
	text-transform: uppercase;
}

p {
	text-wrap: pretty;
}

a {
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: color var(--transition);
}

img {
	height: auto;
}

.wp-site-blocks > * + * {
	margin-block-start: 0;
}

.site-main > * {
	margin-block: 0;
}

/* 3. LAYOUT ─────────────────────────────────────────────── */

.section {
	position: relative;
	padding-block: var(--cw-section-pad);
}

.section + .section::before {
	content: "";
	position: absolute;
	inset-block-start: 0;
	inset-inline: var(--cw-container-pad);
	max-width: var(--cw-content-max);
	margin-inline: auto;
	border-block-start: 1px solid var(--cw-line);
}

.grid {
	display: grid;
	grid-template-columns: repeat(var(--cw-grid-cols), minmax(0, 1fr));
	column-gap: var(--cw-grid-gap);
	row-gap: var(--cw-grid-gap);
}

.grid > * {
	margin-block: 0;
	min-width: 0;
}

.col-span-3 { grid-column-end: span 3; }
.col-span-4 { grid-column-end: span 4; }
.col-span-5 { grid-column-end: span 5; }
.col-span-6 { grid-column-end: span 6; }
.col-span-7 { grid-column-end: span 7; }
.col-span-8 { grid-column-end: span 8; }
.col-span-12 { grid-column-end: span 12; }
.col-start-2 { grid-column-start: 2; }
.col-start-3 { grid-column-start: 3; }

.page-single,
.archive-main {
	padding-block: clamp(var(--space-10), 2rem + 3vw, var(--space-16)) var(--cw-section-pad);
}

/* 4. HEADER ─────────────────────────────────────────────── */

.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 50;
	border-block-end: 1px solid var(--cw-line);
}

.wp-site-blocks > header.wp-block-template-part::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: color-mix(in srgb, var(--cw-bg) 88%, transparent);
	-webkit-backdrop-filter: saturate(1.2) blur(10px);
	backdrop-filter: saturate(1.2) blur(10px);
}

.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }

@media (max-width: 782px) {
	.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 46px; }
}

.site-header__row {
	min-height: var(--cw-header-h);
	gap: var(--space-8);
}

.site-header__title {
	font-family: var(--font-heading);
	font-size: 1.5rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	margin: 0;
	white-space: nowrap;
}

.site-header__title a { color: var(--cw-ink); text-decoration: none; }
.site-header__title a::after { content: ".nl"; color: var(--cw-accent); }

.site-header__nav {
	font-size: 0.9rem;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.site-header__nav .wp-block-navigation__container {
	gap: var(--space-8);
	align-items: center;
}

.site-header__nav a { color: var(--cw-ink); text-decoration: none; }
.site-header__nav .wp-block-navigation-item__content:hover { color: var(--cw-accent); }

.site-header__nav .wp-block-navigation__container > .wp-block-navigation-item:last-child > .wp-block-navigation-item__content {
	background: var(--cw-accent);
	border-radius: var(--radius-sm);
	padding: 0.6rem 1.05rem;
	font-weight: 700;
	transition: background var(--transition);
}

.site-header__nav .wp-block-navigation__container > .wp-block-navigation-item:last-child > .wp-block-navigation-item__content:hover {
	background: var(--cw-accent-deep);
	color: var(--cw-ink);
}

.wp-block-navigation.site-header__nav:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--cw-bg);
	color: var(--cw-ink);
	padding: var(--space-6) var(--cw-container-pad);
	--navigation-layout-justification-setting: flex-start;
	--navigation-layout-justify: flex-start;
	--navigation-layout-align: flex-start;
	text-align: left;
}

.site-header__nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	font-family: var(--font-heading);
	font-size: 1.75rem;
	letter-spacing: 0.02em;
}

/* 5. FOOTER ─────────────────────────────────────────────── */

.site-footer {
	border-block-start: 1px solid var(--cw-line);
	background: var(--cw-surface);
	padding-block: var(--space-16) var(--space-8);
	font-size: 0.9rem;
	color: var(--cw-muted);
}

.site-footer__title {
	font-family: var(--font-heading);
	font-size: 1.5rem;
	text-transform: uppercase;
	margin: 0 0 var(--space-3);
}

.site-footer__title a { color: var(--cw-ink); text-decoration: none; }

.site-footer h4 {
	font-size: 0.8rem;
	letter-spacing: 0.12em;
	color: var(--cw-ink);
	margin: 0 0 var(--space-3);
}

.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li + li { margin-top: var(--space-2); }
.site-footer a { color: var(--cw-muted); text-decoration: none; }
.site-footer a:hover { color: var(--cw-ink); }

.site-footer__legal {
	margin-block-start: var(--space-12);
	padding-block-start: var(--space-6);
	border-block-start: 1px solid var(--cw-line);
	font-size: 0.8rem;
	line-height: 1.6;
}

/* 6. TYPOGRAFIE ─────────────────────────────────────────── */

.kicker {
	display: inline-flex;
	align-items: center;
	gap: var(--space-3);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--cw-signal);
	margin: 0;
}

.kicker::before {
	content: "";
	width: 1.75rem;
	height: 2px;
	background: currentColor;
}

.lead {
	font-size: var(--wp--preset--font-size--md);
	line-height: 1.55;
	color: var(--cw-muted);
	max-width: 38rem;
}

.section-head {
	margin-block-end: var(--space-10);
}

.section-head h2 { margin: var(--space-3) 0 0; }

.entry-content > * + * { margin-block-start: var(--space-5); }
.entry-content h2 { margin-block-start: var(--space-12); }
.entry-content a { color: var(--cw-accent); }
.entry-content a:hover { color: var(--cw-ink); }

/* 7. KNOPPEN ────────────────────────────────────────────── */

.wp-block-button__link {
	transition: background var(--transition), transform var(--transition);
}

.wp-block-button__link:hover {
	background: var(--cw-accent-deep);
	color: var(--cw-ink);
	transform: translateY(-1px);
}

.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--cw-ink);
	border: 1px solid var(--cw-line);
}

.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	border-color: var(--cw-ink);
	background: transparent;
}

/* 8. HERO ───────────────────────────────────────────────── */

.hero {
	padding-block: clamp(var(--space-16), 4rem + 5vw, 9rem) var(--cw-section-pad);
}

.hero h1 {
	font-size: var(--wp--preset--font-size--xxl);
	line-height: 0.98;
	margin: var(--space-5) 0 var(--space-6);
}

.hero h1 em {
	font-style: normal;
	color: var(--cw-accent);
}

.hero .wp-block-buttons { margin-block-start: var(--space-8); }

.stat-panel {
	background: var(--cw-surface);
	border: 1px solid var(--cw-line);
	border-radius: var(--radius-md);
	padding: var(--space-8);
	align-self: end;
}

.stat-panel__label {
	font-size: 0.75rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--cw-muted);
	margin: 0;
}

.stat-panel__value {
	font-family: var(--font-heading);
	font-size: clamp(2.5rem, 2rem + 2vw, 4rem);
	line-height: 1;
	color: var(--cw-signal);
	margin: var(--space-2) 0 var(--space-3);
}

.stat-panel p:last-child { color: var(--cw-muted); font-size: 0.9rem; margin: 0; }

/* 9. KAARTEN ────────────────────────────────────────────── */

.card,
.tool-card {
	background: var(--cw-surface);
	border: 1px solid var(--cw-line);
	border-radius: var(--radius-md);
	padding: var(--space-8);
	height: 100%;
	transition: border-color var(--transition), transform var(--transition);
}

.card:hover,
.tool-card:hover {
	border-color: var(--cw-accent);
	transform: translateY(-2px);
}

.card h3,
.tool-card h3 { margin: 0 0 var(--space-3); }

.card h3 a,
.tool-card h3 a { text-decoration: none; }

.card p,
.tool-card p { color: var(--cw-muted); margin: 0; }

.tool-card__tag {
	display: inline-block;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--cw-bg);
	background: var(--cw-signal);
	border-radius: var(--radius-sm);
	padding: 0.2rem 0.55rem;
	margin-block-end: var(--space-4);
}

.card-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
	gap: var(--cw-grid-gap);
	padding: 0;
	list-style: none;
}

.card-grid > li { margin: 0; }

.disclosure {
	font-size: 0.82rem;
	color: var(--cw-muted);
	border-inline-start: 2px solid var(--cw-accent);
	padding-inline-start: var(--space-4);
	max-width: 44rem;
}

/* 10. CALCULATORS & FORMULIEREN ─────────────────────────── */

.calc {
	background: var(--cw-surface);
	border: 1px solid var(--cw-line);
	border-radius: var(--radius-md);
	padding: var(--space-8);
}

.calc label {
	display: block;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cw-muted);
	margin-block-end: var(--space-2);
}

.calc input,
.calc select,
input[type="search"],
input[type="text"],
input[type="email"],
textarea {
	width: 100%;
	background: var(--cw-bg);
	color: var(--cw-ink);
	border: 1px solid var(--cw-line);
	border-radius: var(--radius-sm);
	padding: 0.8rem 1rem;
	font: inherit;
}

.calc input:focus,
.calc select:focus { border-color: var(--cw-signal); outline: none; }

.calc__result {
	margin-block-start: var(--space-6);
	padding-block-start: var(--space-6);
	border-block-start: 1px solid var(--cw-line);
}

.calc__result strong {
	display: block;
	font-family: var(--font-heading);
	font-size: clamp(2.25rem, 1.8rem + 2vw, 3.5rem);
	line-height: 1;
	color: var(--cw-signal);
	font-weight: 400;
}

/* 11. TABELLEN, ZOEKEN, 404 ─────────────────────────────── */

table { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
th, td { text-align: left; padding: var(--space-3) var(--space-4); border-block-end: 1px solid var(--cw-line); }
th { font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--cw-muted); font-weight: 600; }
tbody tr:hover { background: var(--cw-surface); }

.error-404 { padding-block: var(--space-24); text-align: center; }
.error-404 h1 { font-size: var(--wp--preset--font-size--xxl); color: var(--cw-accent); }

.wp-block-query-pagination { margin-block-start: var(--space-12); gap: var(--space-4); }
.wp-block-query-pagination a { text-decoration: none; }

/* 12. RESPONSIVE ────────────────────────────────────────── */

@media (max-width: 960px) {
	:root {
		--cw-container-pad: var(--space-6);
		--cw-grid-gap: var(--space-6);
	}

	.grid > [class*="col-span-"] {
		grid-column: 1 / -1;
	}
}

@media (max-width: 600px) {
	:root { --cw-container-pad: var(--space-5); }
	.calc, .card, .tool-card, .stat-panel { padding: var(--space-6); }
}

/* 13. MINDER BEWEGING ───────────────────────────────────── */

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

/* ═══ Ticker, vizier-merk, iconen ═══ */
:root { --cw-ticker-h: 2.25rem; }

.wp-site-blocks > header.wp-block-template-part { top: calc(var(--cw-ticker-h) * -1); }
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: calc(32px - var(--cw-ticker-h)); }
@media (max-width: 782px) { .admin-bar .wp-site-blocks > header.wp-block-template-part { top: calc(46px - var(--cw-ticker-h)); } }

.site-ticker { border-block-end: 1px solid var(--cw-line); font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--cw-muted); }
.cw-ticker { display: flex; align-items: center; gap: var(--space-6); min-height: var(--cw-ticker-h); overflow: hidden; white-space: nowrap; }
.cw-ticker a { color: var(--cw-muted); text-decoration: none; }
.cw-ticker a:hover { color: var(--cw-ink); }
.cw-ticker strong { color: var(--cw-ink); font-weight: 700; }
.cw-ticker__item { display: inline-flex; align-items: center; gap: 0.5em; }
.cw-ticker__live::before { content: ""; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--cw-accent); animation: cw-pulse 2s ease-in-out infinite; }
@keyframes cw-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.3; } }
@media (max-width: 700px) { .cw-ticker__item--hide-sm { display: none; } }

.site-header__title a { display: inline-flex; align-items: center; }
.site-header__title a::before {
	content: "";
	flex: none;
	width: 1.1em;
	height: 1.1em;
	margin-inline-end: 0.4em;
	background: var(--cw-accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Ccircle cx='12' cy='12' r='6.5'/%3E%3Cpath d='M12 1v6M12 17v6M1 12h6M17 12h6'/%3E%3Ccircle cx='12' cy='12' r='1.4' fill='%23000' stroke='none'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='square'%3E%3Ccircle cx='12' cy='12' r='6.5'/%3E%3Cpath d='M12 1v6M12 17v6M1 12h6M17 12h6'/%3E%3Ccircle cx='12' cy='12' r='1.4' fill='%23000' stroke='none'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform 360ms cubic-bezier(0.2, 0.8, 0.2, 1);
}
.site-header__title a:hover::before,
.site-header__title a:focus-visible::before { transform: rotate(90deg) scale(0.86); }

.tool-card__icon,
.wp-block-post[class*="nieuws_cat-"] .card::before {
	display: block;
	content: "";
	width: 2.25rem;
	height: 2.25rem;
	margin-block-end: var(--space-4);
	background: var(--cw-signal);
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-position: center; mask-position: center;
	-webkit-mask-size: contain; mask-size: contain;
}
.tool-card__icon--ttk { -webkit-mask-image: url("../img/icons/ttk.svg"); mask-image: url("../img/icons/ttk.svg"); }
.tool-card__icon--sensitivity { -webkit-mask-image: url("../img/icons/sensitivity.svg"); mask-image: url("../img/icons/sensitivity.svg"); }
.tool-card__icon--fov { -webkit-mask-image: url("../img/icons/fov.svg"); mask-image: url("../img/icons/fov.svg"); }
.tool-card__icon--spelers { -webkit-mask-image: url("../img/icons/spelers.svg"); mask-image: url("../img/icons/spelers.svg"); }
.tool-card__icon--patch { -webkit-mask-image: url("../img/icons/patch.svg"); mask-image: url("../img/icons/patch.svg"); }
.tool-card__icon--mw4 { -webkit-mask-image: url("../img/icons/mw4.svg"); mask-image: url("../img/icons/mw4.svg"); }
.nieuws_cat-patch .card::before { -webkit-mask-image: url("../img/icons/patch.svg"); mask-image: url("../img/icons/patch.svg"); }
.nieuws_cat-seizoen .card::before { -webkit-mask-image: url("../img/icons/seizoen.svg"); mask-image: url("../img/icons/seizoen.svg"); }
.nieuws_cat-ranked .card::before { -webkit-mask-image: url("../img/icons/ranked.svg"); mask-image: url("../img/icons/ranked.svg"); }
.nieuws_cat-community .card::before { -webkit-mask-image: url("../img/icons/community.svg"); mask-image: url("../img/icons/community.svg"); }
.nieuws_cat-modern-warfare-4 .card::before { -webkit-mask-image: url("../img/icons/mw4.svg"); mask-image: url("../img/icons/mw4.svg"); }
.nieuws_cat-tips .card::before { -webkit-mask-image: url("../img/icons/tips.svg"); mask-image: url("../img/icons/tips.svg"); }
/* ═══ Correcties na visuele controle ═══ */
.site-header__title a::after { content: none; }
.site-header__title span { color: var(--cw-accent); }
.kicker a { color: inherit; text-decoration: none; }
.is-layout-constrained > .lead { margin-inline: 0 !important; }
.wp-block-post-terms.kicker { margin: 0 0 var(--space-2); }
/* ═══ Toegankelijkheid: contrast en kopstructuur ═══ */
:root { --cw-accent-text: var(--wp--preset--color--accent-text, #ff5a63); }
::selection { color: #fff; }
.site-header__nav .wp-block-navigation__container > .wp-block-navigation-item:last-child > .wp-block-navigation-item__content,
.site-header__nav .wp-block-navigation__container > .wp-block-navigation-item:last-child > .wp-block-navigation-item__content:hover { color: #fff; }
.cw-filter a[aria-current="page"] { color: #fff; }
.entry-content a { color: var(--cw-accent-text); }
.entry-content a:hover { color: var(--cw-ink); }
.calc input, .calc select, input[type="search"], input[type="text"], input[type="email"], textarea { border-color: #686870; }
.card .wp-block-post-title { font-family: var(--font-body); font-size: var(--wp--preset--font-size--md); font-weight: 700; line-height: 1.2; letter-spacing: 0.02em; }
.cw-related { margin-block-start: var(--space-6); }
.cw-related .card h3 a { text-decoration: none; }
/* Kopniveau in kaarten en tijdlijn */
.tool-card h2, .cw-timeline h2 { font-family: var(--font-body); font-size: var(--wp--preset--font-size--md); font-weight: 700; line-height: 1.2; letter-spacing: 0.02em; margin: 0 0 var(--space-3); }
.tool-card h2 a, .cw-timeline h2 a { text-decoration: none; }

/* Artikelpagina: uitlijning en ritme */
.is-layout-constrained > .kicker { display: flex; }
.page-single > .wp-block-heading { margin-block-start: var(--space-12); }
.page-single .wp-block-post-date { margin-block: var(--space-3) var(--space-5); }
.cw-related { grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
.cw-related .card { padding: var(--space-6); }
.cw-related .cw-muted { margin-block-start: var(--space-3); }
/* Titels van berichten en pagina's zijn zinnen: leesbaarheid gaat voor merkuitstraling (K lijkt in het merkfont op een H). */
h1.wp-block-post-title { font-family: var(--font-body); font-weight: 700; font-size: clamp(1.9rem, 1.3rem + 2vw, 2.75rem); line-height: 1.08; letter-spacing: 0.005em; }
/* Formuliervelden: padding en rand tellen mee in de breedte (voorkomt overlappen en uitsteken) */
.calc input, .calc select, input[type="search"], input[type="text"], input[type="email"], textarea { box-sizing: border-box; max-width: 100%; }
.calc__field { min-width: 0; }
.page-single h1.wp-block-post-title { margin-block-end: var(--space-4); }
.calc input, .calc select { min-height: 3.5rem; }

/* ═══ Beeldplekken: hero, kaarten, artikelbanner, HUD ═══ */
.hero { position: relative; overflow: hidden; isolation: isolate; }
.hero > .hero__media { position: absolute; inset: 0; z-index: -1; max-width: none !important; margin: 0 !important; pointer-events: none; }
.hero__img { width: 100%; height: 100%; object-fit: cover; object-position: center right; display: block; }
.hero__shade { position: absolute; inset: 0; background: linear-gradient(90deg, var(--cw-bg) 6%, color-mix(in srgb, var(--cw-bg) 72%, transparent) 46%, color-mix(in srgb, var(--cw-bg) 20%, transparent) 100%), linear-gradient(to top, var(--cw-bg), transparent 28%); }
.hero__hud { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0.6; }
.hud-line { fill: none; stroke: var(--cw-line); stroke-width: 1.5; }
.hud-dash { stroke-dasharray: 4 8; }
.hud-red { fill: none; stroke: var(--cw-accent); stroke-width: 3; stroke-linecap: square; }
.hud-dot { fill: var(--cw-accent); }
.hud-corner { fill: none; stroke: var(--cw-muted); stroke-width: 2; opacity: 0.5; }
@media (max-width: 960px) { .hero__hud { opacity: 0.35; } }

.stat-panel { position: relative; }
.stat-panel::before, .stat-panel::after { content: ""; position: absolute; width: 18px; height: 18px; border: 0 solid var(--cw-accent); pointer-events: none; }
.stat-panel::before { top: -1px; left: -1px; border-top-width: 3px; border-left-width: 3px; border-top-left-radius: var(--radius-md); }
.stat-panel::after { bottom: -1px; right: -1px; border-bottom-width: 3px; border-right-width: 3px; border-bottom-right-radius: var(--radius-md); }

.card, .tool-card { --card-pad: var(--space-8); padding: var(--card-pad); }
@media (max-width: 600px) { .card, .tool-card { --card-pad: var(--space-6); } }
.cw-related .card { --card-pad: var(--space-6); }
.card .wp-block-post-featured-image, .card .cw-thumb { display: block; margin: calc(var(--card-pad) * -1) calc(var(--card-pad) * -1) var(--space-5); aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--radius-md) var(--radius-md) 0 0; }
.card .wp-block-post-featured-image img, .card .cw-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 400ms ease; }
.card:hover .wp-block-post-featured-image img, .card:hover .cw-thumb img { transform: scale(1.04); }
.wp-block-post .card:has(.wp-block-post-featured-image)::before, .wp-block-post .card:has(.cw-thumb)::before { display: none; }

.page-single .wp-block-post-featured-image { margin-block: var(--space-6); }
.page-single .wp-block-post-featured-image img { width: 100%; aspect-ratio: 21 / 8; object-fit: cover; border-radius: var(--radius-md); display: block; }
.cw-credit { margin: calc(var(--space-3) * -1) 0 var(--space-6); font-size: 0.8rem; color: var(--cw-muted); }
/* Hero: donkere laag zorgt dat de kop altijd leesbaar blijft, ook bij een drukke foto */
.hero__shade { background: linear-gradient(90deg, var(--cw-bg) 10%, color-mix(in srgb, var(--cw-bg) 88%, transparent) 38%, color-mix(in srgb, var(--cw-bg) 50%, transparent) 68%, color-mix(in srgb, var(--cw-bg) 14%, transparent) 100%), linear-gradient(to top, var(--cw-bg), transparent 28%); }
@media (max-width: 960px) { .hero__shade { background: linear-gradient(to bottom, color-mix(in srgb, var(--cw-bg) 80%, transparent), var(--cw-bg)); } }

/* [CoD-sfeer begin] Verwijder alles tot en met 'CoD-sfeer einde' om deze laag uit te zetten. */

/* Genummerde sectiekoppen in documentstijl: 01 // */
.site-main { counter-reset: cwsec; }
.site-main .section-head { counter-increment: cwsec; }
.site-main .section-head .kicker::before { content: counter(cwsec, decimal-leading-zero) " //"; width: auto; height: auto; background: none; letter-spacing: 0.08em; }

/* Briefing-label op de samenvatting */
p.cw-tldr { position: relative; padding-block-start: calc(var(--space-4) + 1.4rem); }
p.cw-tldr::before { content: "Briefing"; position: absolute; top: 0.75rem; inset-inline-start: var(--space-5); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.22em; text-transform: uppercase; color: var(--cw-signal); }

/* Aflopende hoeken, zoals het merkfont (alleen op gevulde knoppen en tags) */
.wp-block-button:not(.is-style-outline) > .wp-block-button__link,
.site-header__nav .wp-block-navigation__container > .wp-block-navigation-item:last-child > .wp-block-navigation-item__content {
	border-radius: 0;
	clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
}
.tool-card__tag { clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%); border-radius: 0; }
/* clip-path knipt een buitenste focusrand af: de rand komt daarom aan de binnenkant */
.wp-block-button__link:focus-visible,
.site-header__nav .wp-block-navigation-item__content:focus-visible { outline: 2px solid var(--cw-signal); outline-offset: -5px; }

/* Rode markering op de scheidingslijn tussen secties */
.section + .section::after {
	content: "";
	position: absolute;
	inset-block-start: -1px;
	inset-inline-start: max(var(--cw-container-pad), calc((100% - var(--cw-content-max)) / 2));
	width: 56px;
	border-block-start: 3px solid var(--cw-accent);
}

/* Waarschuwingsband bovenaan de footer */
.site-footer { position: relative; }

/* Subtiele scanlines in de hero, vooral rechts waar het beeld of de HUD zit */
.hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: repeating-linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 0 1px, transparent 1px 4px);
	-webkit-mask-image: linear-gradient(to left, #000 15%, transparent 75%);
	mask-image: linear-gradient(to left, #000 15%, transparent 75%);
}

/* [CoD-sfeer einde] */
/* Ontbrekende kolombreedtes van het 12-koloms grid aangevuld */
.col-span-1 { grid-column-end: span 1; }
.col-span-2 { grid-column-end: span 2; }
.col-span-9 { grid-column-end: span 9; }
.col-span-10 { grid-column-end: span 10; }
.col-span-11 { grid-column-end: span 11; }

.site-footer p + h4 { margin-block-start: var(--space-6); }

/* Mobiel: HUD veel zwakker, zodat tekst erboven leesbaar blijft */
@media (max-width: 960px) { .hero__hud { opacity: 0.22; } .hud-red { stroke-width: 2; } }

/* Hero-afbeelding: uitsnede op de operator en de gasring; op mobiel sterkere laag voor leesbaarheid */
.hero__img { object-position: 78% 28%; }
@media (max-width: 960px) {
	.hero__shade { background: linear-gradient(to bottom, color-mix(in srgb, var(--cw-bg) 35%, transparent) 0%, color-mix(in srgb, var(--cw-bg) 62%, transparent) 30%, color-mix(in srgb, var(--cw-bg) 86%, transparent) 62%, var(--cw-bg) 100%); }
}
/* Platformknoppen en MW4-tijdlijn */
.cw-platforms { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: var(--space-4); margin-block: var(--space-6); }
.cw-platform { position: relative; display: flex; flex-direction: column; gap: 0.2rem; padding: var(--space-6); background: var(--cw-surface); border: 1px solid var(--cw-line); border-radius: var(--radius-md); color: var(--cw-ink); text-decoration: none; transition: border-color var(--transition), transform var(--transition); }
.cw-platform:hover, .cw-platform:focus-visible { border-color: var(--cw-accent); transform: translateY(-2px); }
.cw-platform strong { font-size: 1.35rem; letter-spacing: 0.04em; text-transform: uppercase; }
.cw-platform__sub { color: var(--cw-muted); font-size: 0.9rem; }
.cw-platform__free { align-self: flex-start; margin-block-end: var(--space-2); padding: 0.15rem 0.55rem; background: var(--cw-signal); color: var(--cw-bg); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%); }
.cw-platform::after { content: "\2197"; position: absolute; inset-block-start: var(--space-5); inset-inline-end: var(--space-5); color: var(--cw-muted); font-size: 1.1rem; }
.cw-platform:hover::after { color: var(--cw-accent-text); }

.cw-ms { list-style: none; margin: var(--space-8) 0 var(--space-4); padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: var(--space-5); }
.cw-ms li { display: grid; gap: 0.3rem; padding: var(--space-6); background: var(--cw-surface); border: 1px solid var(--cw-line); border-radius: var(--radius-md); }
.cw-ms__date { font-family: var(--font-body); font-weight: 700; font-size: 2rem; line-height: 1; letter-spacing: 0.02em; text-transform: uppercase; color: var(--cw-signal); }
.cw-ms strong { font-size: 1.1rem; letter-spacing: 0.03em; text-transform: uppercase; }
.cw-ms__when { font-size: 0.78rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--cw-muted); min-height: 1.2em; }
.cw-ms p { margin: 0.35rem 0 0; color: var(--cw-muted); font-size: 0.95rem; }
.cw-ms li.is-next { border-color: var(--cw-accent); }
.cw-ms li.is-next .cw-ms__when { color: var(--cw-accent-text); }
.cw-ms li.is-done { opacity: 0.55; }
/* Platformknoppen binnen artikelen: de algemene linkkleur mag ze niet overschrijven */
.entry-content a.cw-platform { color: var(--cw-ink); text-decoration: none; }
.entry-content a.cw-platform:hover strong { color: var(--cw-ink); }
.cw-ms li { align-content: start; }
/* Koop-tabel Modern Warfare 4: eigen opmaak, los van de gear-tabel */
.cw-buy-table { overflow-x: auto; margin-block: var(--space-6); }
.cw-buy-table table { min-width: 34rem; }
.cw-buy-table td { vertical-align: middle; }
.cw-buy-table a { color: var(--cw-accent-text); font-weight: 600; white-space: nowrap; }
/* Platformlogo's */
.cw-platform__head { display: flex; align-items: center; gap: 0.7rem; }
.cw-platform__icon { width: 1.75rem; height: 1.75rem; flex: none; opacity: 0.92; }
.cw-platform:hover .cw-platform__icon { opacity: 1; }
.cw-platform__head--table .cw-platform__icon { width: 1.35rem; height: 1.35rem; }
.cw-platform__head--table { gap: 0.55rem; }
/* Koop-tabel: logo en platformnaam netjes boven de toelichting */
.cw-buy-table .cw-platform__head + br { display: none; }
.cw-buy-table .cw-muted { display: block; margin-top: 0.2rem; }

/* MW4-banner en footerlogo */
.cw-mw4-banner{position:relative;overflow:hidden;background:#000;border:1px solid var(--cw-line);margin:0 0 2rem;min-height:clamp(260px,25vw,380px);display:flex;align-items:center}
.cw-mw4-banner::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(0,0,0,.88) 0,rgba(0,0,0,.45) 55%,rgba(0,0,0,0) 100%)}
.cw-mw4-banner__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:75% center}
.cw-mw4-banner__body{position:relative;z-index:2;padding:clamp(1.25rem,4vw,3rem);display:flex;flex-direction:column;align-items:flex-start;gap:.9rem}
.cw-mw4-banner__logo{display:block;width:min(460px,72vw);height:auto}
.cw-mw4-banner__date{margin:0;font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:1rem;color:var(--cw-ink)}
.cw-mw4-banner__credit{position:absolute;right:.75rem;bottom:.5rem;z-index:2;font-size:.75rem;color:var(--cw-muted)}
.cw-mw4-banner__cta,.entry-content a.cw-mw4-banner__cta{display:inline-block;padding:.7rem 1.4rem;background:var(--cw-accent);color:#fff;font-weight:700;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%)}
.cw-mw4-banner__cta:hover{filter:brightness(1.12)}
.cw-mw4-banner__cta:focus-visible{outline:3px solid var(--cw-ink);outline-offset:-5px}
.cw-footer-mw4{display:inline-block;margin:1rem 0 .5rem}
.cw-footer-mw4 img{display:block;width:200px;height:auto}

/* MW4: trailer, edities, pc-beeld */
.cw-mw4-banner__actions{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}
.cw-mw4-banner__trailer,.entry-content a.cw-mw4-banner__trailer{display:inline-flex;align-items:center;gap:.5rem;padding:.65rem 1.2rem;border:2px solid var(--cw-ink);color:var(--cw-ink);font-weight:700;text-transform:uppercase;letter-spacing:.06em;text-decoration:none;background:rgba(0,0,0,.35)}
.cw-mw4-banner__trailer:hover{background:var(--cw-ink);color:#0A0A0B}
.cw-mw4-banner__trailer:focus-visible{outline:3px solid var(--cw-signal);outline-offset:2px}
.cw-trailer-card{margin:1.5rem 0;max-width:960px}
.cw-trailer-card__link,.entry-content a.cw-trailer-card__link{display:block;position:relative;border:1px solid var(--cw-line);color:var(--cw-ink);text-decoration:none;overflow:hidden}
.cw-trailer-card__link img{display:block;width:100%;height:auto;transition:transform .3s,filter .3s;filter:brightness(.8)}
.cw-trailer-card__link:hover img{transform:scale(1.03);filter:brightness(1)}
.cw-trailer-card__play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:84px;height:84px;display:flex;align-items:center;justify-content:center;background:var(--cw-accent);color:#fff;border-radius:50%}
.cw-trailer-card__label{position:absolute;left:0;bottom:0;padding:.6rem 1rem;background:rgba(0,0,0,.75);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.cw-trailer-card__link:focus-visible{outline:3px solid var(--cw-signal);outline-offset:-6px}
.cw-trailer-card figcaption{margin-top:.5rem;font-size:.85rem;color:var(--cw-muted)}
dialog.cw-trailer{padding:0;border:1px solid var(--cw-line);background:#000;color:var(--cw-ink);width:min(1100px,94vw);max-width:none;overflow:visible}
dialog.cw-trailer::backdrop{background:rgba(0,0,0,.88)}
.cw-trailer__frame{aspect-ratio:16/9;background:#000}
.cw-trailer__frame iframe{display:block;width:100%;height:100%;border:0}
.cw-trailer__close{position:absolute;top:.5rem;right:.5rem;z-index:2;width:44px;height:44px;border:1px solid var(--cw-ink);background:rgba(0,0,0,.75);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer}
.cw-trailer__close:hover{background:var(--cw-accent)}
.cw-trailer__close:focus-visible{outline:3px solid var(--cw-signal);outline-offset:2px}
.cw-trailer__note{margin:0;padding:.6rem 1rem;font-size:.8rem;color:var(--cw-muted)}
body:has(dialog.cw-trailer[open]){overflow:hidden}
.cw-editions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;margin:1.5rem 0 .75rem}
.cw-edition{display:grid;grid-template-columns:200px minmax(0,1fr);gap:1.25rem;background:var(--cw-surface);border:1px solid var(--cw-line);padding:1.25rem}
.cw-edition--vault{border-top:3px solid #FFD200}
.cw-edition__cover{display:block;width:100%;height:auto}
.cw-edition__body{display:flex;flex-direction:column;align-items:flex-start}
.cw-edition__body h3{margin:0 0 .5rem}
.cw-edition__lead{margin:0 0 .4rem;color:var(--cw-muted)}
.cw-edition__body ul{margin:0 0 1rem;padding-left:1.1rem}
.cw-edition__body li{margin:0 0 .35rem}
.cw-edition__note{margin:0 0 1rem;font-size:.9rem;color:var(--cw-muted)}
.cw-edition__btn,.entry-content a.cw-edition__btn{margin-top:auto;display:inline-block;padding:.6rem 1.1rem;border:2px solid var(--cw-ink);color:var(--cw-ink);font-weight:700;text-transform:uppercase;letter-spacing:.06em;text-decoration:none}
.cw-edition__btn:hover{background:var(--cw-ink);color:#0A0A0B}
.cw-edition__btn:focus-visible{outline:3px solid var(--cw-signal);outline-offset:2px}
@media (max-width:1000px){.cw-editions{grid-template-columns:1fr}}
@media (max-width:520px){.cw-edition{grid-template-columns:1fr}.cw-edition__cover{max-width:240px}}
.cw-pc-image{margin:1.5rem 0}
.cw-pc-image img{display:block;width:100%;height:clamp(200px,28vw,400px);object-fit:cover;object-position:60% 40%;border:1px solid var(--cw-line)}
.cw-pc-image figcaption{margin-top:.4rem;font-size:.8rem;color:var(--cw-muted)}
.entry-content > .cw-trailer-card{margin-left:0 !important;margin-right:auto !important}

/* MW4: modi en functies */
.cw-modes{display:grid;gap:1.25rem;margin:1.5rem 0 .75rem}
.cw-mode{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:var(--cw-surface);border:1px solid var(--cw-line)}
.cw-mode:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.cw-mode:nth-child(even) .cw-mode__img{order:2}
.cw-mode__img{display:block;width:100%;height:100%;min-height:240px;object-fit:cover}
.cw-mode__body{padding:clamp(1.25rem,3vw,2.25rem);display:flex;flex-direction:column;justify-content:center}
.cw-mode__kind{margin:0 0 .4rem;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--cw-signal)}
.cw-mode__body h3{margin:0 0 .75rem}
.cw-mode__body p:last-child{margin:0}
@media (max-width:800px){.cw-mode,.cw-mode:nth-child(even){grid-template-columns:1fr}.cw-mode:nth-child(even) .cw-mode__img{order:0}.cw-mode__img{min-height:0;aspect-ratio:16/9;height:auto}}

/* Hero-video en afsluitende beeldsectie */
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 100%;transform:scale(1.4);transform-origin:50% 100%;display:block}
.hero__video + .hero__shade{background:linear-gradient(90deg,rgba(10,10,11,.94) 0,rgba(10,10,11,.84) 42%,rgba(10,10,11,.5) 78%,rgba(10,10,11,.36) 100%),linear-gradient(to top,var(--cw-bg),transparent 32%)}
.hero__pause{position:absolute;right:1rem;bottom:1rem;z-index:3;padding:.45rem .8rem;background:rgba(10,10,11,.8);color:var(--cw-ink);border:1px solid var(--cw-ink);font:inherit;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;cursor:pointer}
.hero__pause:hover{background:var(--cw-ink);color:#0A0A0B}
.hero__pause:focus-visible{outline:3px solid var(--cw-signal);outline-offset:2px}
.hero__pause[hidden]{display:none}
.cw-closer{position:relative;overflow:hidden;isolation:isolate;border:1px solid var(--cw-line);min-height:clamp(260px,26vw,380px);display:flex;align-items:center}
.cw-closer__img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:78% 30%}
.cw-closer::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(10,10,11,.92) 0,rgba(10,10,11,.7) 45%,rgba(10,10,11,.15) 100%)}
.cw-closer__body{padding:clamp(1.25rem,4vw,3rem);max-width:640px}
.cw-closer__body h2{margin:.4rem 0 .75rem}
.cw-closer__body > p:not(.kicker){margin:0 0 1.25rem}
.cw-closer__credit{position:absolute;right:.75rem;bottom:.5rem;font-size:.75rem;color:var(--cw-muted)}
@media (max-width:700px){.cw-closer::before{background:linear-gradient(to bottom,rgba(10,10,11,.6),rgba(10,10,11,.9))}}

/* Warzone: modi, kaarten en functies */
.cw-wzgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;margin:1.5rem 0 .75rem}
.cw-wzcard{background:var(--cw-surface);border:1px solid var(--cw-line);display:flex;flex-direction:column}
.cw-wzcard__img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.cw-wzcard__body{padding:1.1rem 1.25rem 1.4rem}
.cw-wzcard__kind{margin:0 0 .35rem;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--cw-signal)}
.cw-wzcard__body h3{margin:0 0 .6rem}
.cw-wzcard__body p:last-child{margin:0}
@media (max-width:1000px){.cw-wzgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.cw-wzgrid{grid-template-columns:1fr}}

/* Warzone-kaarten */
.cw-maps .cw-mode__body ul{margin:0 0 1rem;padding-left:1.1rem}
.cw-maps .cw-mode__body li{margin:0 0 .5rem}
.cw-maps .cw-mode__src{margin:auto 0 0;font-size:.9rem}

/* Footer: strakkere opbouw */
.site-footer{padding-block:var(--space-12) var(--space-8)}
.site-footer__cta{position:relative;overflow:hidden;isolation:isolate;border:1px solid var(--cw-line);margin-block-end:var(--space-12);min-height:220px;display:flex;align-items:center}
.site-footer__cta-img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.site-footer__cta::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(10,10,11,.94) 0,rgba(10,10,11,.75) 50%,rgba(10,10,11,.3) 100%)}
.site-footer__cta-body{padding:clamp(1.25rem,4vw,2.5rem);max-width:620px}
.site-footer__cta h2{margin:.3rem 0 .6rem;color:var(--cw-ink)}
.site-footer__cta p:not(.kicker){margin:0 0 1.25rem;color:var(--cw-ink);font-size:1rem}
.site-footer .site-footer__cta a.wp-block-button__link{color:#fff}
.site-footer .site-footer__cta .is-style-outline a.wp-block-button__link{color:var(--cw-ink)}
.site-footer__cta-credit{position:absolute;right:.75rem;bottom:.5rem;font-size:.75rem;color:var(--cw-muted)}
.home .site-footer__cta{display:none}
.site-footer__grid{row-gap:var(--space-8)}
.site-footer h4{padding-bottom:.6rem;border-bottom:1px solid var(--cw-line);margin-bottom:var(--space-4)}
.site-footer__grid h4:not(:first-child){margin-block-start:var(--space-6)}
.site-footer__checks li{position:relative;padding-left:1.1rem}
.site-footer__checks li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;background:var(--cw-signal)}
.site-footer__studios{margin-block-start:var(--space-12);padding-block:var(--space-6);border-block:1px solid var(--cw-line)}
.site-footer__label{margin:0 0 var(--space-4);font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--cw-ink)}
.cw-studios{display:flex;flex-wrap:wrap;align-items:center;gap:1.25rem 2.75rem}
.cw-studios li{margin:0 !important;display:flex;align-items:center}
.cw-studios img{display:block;height:var(--h,26px);width:auto;opacity:.75;transition:opacity .2s}
.cw-studios li:hover img{opacity:1}
.site-footer__note{margin:var(--space-4) 0 0;font-size:.75rem}
.site-footer__legal{margin-block-start:0;padding-block-start:var(--space-6);border-block-start:0}
.site-footer__bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--space-3) var(--space-8);margin-block-start:var(--space-4)}
.site-footer__links{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem}
.site-footer__links li{margin:0 !important}
.site-footer__bar > p{margin:0}
.cw-footer-mw4{margin:0 0 var(--space-3)}
/* 404 met sfeerbeeld */
.error-404{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(4rem,10vw,8rem)}
.error-404 .error-404__bg{position:absolute;inset:0;z-index:-2;width:100% !important;max-width:none !important;height:100%;margin:0 !important;object-fit:cover}
.error-404::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(10,10,11,.55),rgba(10,10,11,.85))}
.site-footer__cta .wp-block-buttons,.cw-closer .wp-block-buttons{display:flex;flex-wrap:wrap;gap:.75rem}
.cw-footer-mw4{max-width:100%}
.cw-footer-mw4 img{max-width:100%}
.error-404{text-align:center}
.error-404 .lead{margin-inline:auto !important;max-width:640px}
.error-404 .wp-block-search{max-width:640px;margin:1.5rem auto}
.error-404 .wp-block-buttons{display:flex;justify-content:center;margin-top:1.5rem}
/* MW4-logo rechts in de studiorij */
.cw-soon{display:flex;flex-direction:column;align-items:flex-end;gap:.4rem;text-decoration:none}
.cw-soon img{display:block;width:280px;max-width:100%;height:auto}
.cw-soon__label{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:var(--cw-signal)}
.cw-soon__date{font-size:.8rem;color:var(--cw-muted)}
.site-footer__studios{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:var(--space-12);align-items:center}
.site-footer__studios > *{grid-column:1}
.site-footer__studios > p:has(> .cw-soon){grid-column:2;grid-row:1 / span 3;margin:0;justify-self:end}
@media (max-width:800px){.site-footer__studios{grid-template-columns:1fr}.site-footer__studios > p:has(> .cw-soon){grid-column:1;grid-row:auto;justify-self:start;margin-top:var(--space-6)}.cw-soon{align-items:flex-start}}