/* ── promo card ── */
.promo { display: block; }
.promo__img {
	aspect-ratio: 3/2;
	background: var(--kk-wash);
	overflow: hidden;
	position: relative;
}
.promo__img img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--med) var(--ease); }
.promo:hover .promo__img img { transform: scale(1.03); }
.promo__body { padding: var(--s3); background: var(--kk-wash); }
.promo__tag,
.promo__meta-overlay {
	position: absolute; top: var(--s2); z-index: 2;
	font: 500 0.75rem/1 var(--sans);
	color: var(--kk-white);
	text-shadow: 0 1px 4px rgba(0,0,0,0.6);
}
.promo__meta-overlay { left: var(--s2); }
.promo__tag { right: var(--s2); }
.promo__headline {
	font-family: var(--serif);
	font-weight: 700;
	color: var(--kk-ink);
	letter-spacing: -0.01em;
	transition: color var(--fast) var(--ease);
}
.promo:hover .promo__headline { color: var(--kk-brand-blue); }
.promo__summary {
	font-family: var(--sans);
	color: var(--kk-ink-light);
	margin-top: var(--s1);
}
.promo__meta {
	font: 500 0.8125rem/1 var(--sans);
	color: var(--kk-ink-muted);
	margin-top: var(--s2);
}

/* promo sizes */
.promo--hero .promo__headline { font: 900 2rem/2.25rem var(--serif); }
.promo--standard .promo__headline { font: 700 1.25rem/1.5rem var(--serif); }
.promo--compact .promo__headline { font: 700 1rem/1.25rem var(--serif); }
.promo--standard .promo__summary { font-size: 0.9375rem; line-height: 1.25rem; }
.promo--compact .promo__img { aspect-ratio: 1/1; }

@media (min-width: 400px) {
	.promo--hero .promo__headline { font-size: 2.25rem; line-height: 2.5rem; }
}
@media (min-width: 600px) {
	.promo--hero .promo__headline { font-size: 2.75rem; line-height: 3rem; }
	.promo--standard .promo__headline { font-size: 1.375rem; line-height: 1.625rem; }
}
@media (min-width: 900px) {
	.promo--hero .promo__headline { font-size: 3.25rem; line-height: 3.5rem; }
	.promo--hero .promo__summary { font-size: 1.3125rem; line-height: 1.625rem; }
	.promo--standard .promo__headline { font-size: 1.625rem; line-height: 1.875rem; }
}

/* ── horizontal promo (image left, text right) ── */
.promo--horizontal {
	display: grid;
	grid-template-columns: 140px 1fr;
	gap: var(--s3);
	align-items: start;
}
.promo--horizontal .promo__img { aspect-ratio: 4/3; }
.promo--horizontal .promo__body { padding: var(--s3); }

/* ── section block header (BBC-style bold rule + label) ── */
.block-header {
	border-top: 2px solid var(--kk-ink);
	padding-top: var(--s2);
	margin-bottom: var(--s4);
}
.block-header__label {
	font: 700 0.875rem/1 var(--sans);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--kk-ink);
}

/* ── site header ── */
.site-header {
	background: var(--kk-canvas);
	border-bottom: 1px solid var(--kk-rule);
	padding: var(--s4) 0;
}
.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.site-header__brand {
	font: 700 1.75rem/1 var(--serif);
	color: var(--kk-brand-blue);
	letter-spacing: -0.02em;
}
.site-header__nav { display: flex; gap: var(--s5); }
.site-header__nav a {
	font: 700 0.9375rem/1 var(--sans);
	color: var(--kk-ink);
	padding: var(--s1) 0;
	border-bottom: 2px solid transparent;
	transition: border-color var(--fast) var(--ease);
}
.site-header__nav a:hover { border-bottom-color: var(--kk-brand-red); color: var(--kk-ink); }

/* ── article body ── */
.article-body h1 { font: 700 2.25rem/2.5rem var(--serif); color: var(--kk-ink); letter-spacing: -0.01em; margin-bottom: var(--s4); }
.article-body h2 { font: 700 1.625rem/1.875rem var(--serif); color: var(--kk-ink); margin: var(--s6) 0 var(--s3); }
.article-body h3 { font: 700 1.25rem/1.5rem var(--serif); color: var(--kk-ink); margin: var(--s5) 0 var(--s2); }
.article-body p { font: 400 1.125rem/1.75rem var(--sans); color: var(--kk-ink-light); max-width: var(--measure); margin-bottom: var(--s4); }
.article-body p.lead { font-weight: 700; color: var(--kk-ink); font-size: 1.3125rem; line-height: 1.875rem; }

/* ── note list ── */
.note-list { list-style: none; padding: 0; }
.note-list li { padding: var(--s3) 0; border-bottom: 1px solid var(--kk-rule); }
.note-list li:last-child { border-bottom: none; }
.note-list a { font: 600 1rem/1.375rem var(--sans); color: var(--kk-ink); transition: color var(--fast) var(--ease); }
.note-list a:hover { color: var(--kk-brand-blue); }
.note-list .note-date { font: 400 0.8125rem/1 var(--sans); color: var(--kk-ink-muted); margin-top: var(--s1); }

/* ── footer ── */
.site-footer {
	background: var(--kk-canvas);
	border-top: 1px solid var(--kk-rule);
	padding: var(--s7) 0;
	margin-top: var(--s8);
}
.site-footer__brand {
	font: 700 1.25rem/1 var(--serif);
	color: var(--kk-brand-blue);
}
.site-footer__links { display: flex; gap: var(--s4); margin-top: var(--s3); flex-wrap: wrap; }
.site-footer__links a { font: 400 0.875rem/1 var(--sans); color: var(--kk-ink-subtle); transition: color var(--fast) var(--ease); }
.site-footer__links a:hover { color: var(--kk-ink); }
.site-footer__copy { font: 400 0.75rem/1 var(--sans); color: var(--kk-ink-muted); margin-top: var(--s5); }

/* ── flash messages ── */
.flash {
	font: 500 0.9375rem/1.375rem var(--sans);
	padding: var(--s3) var(--s4);
	border-radius: 4px;
}
.flash--notice { background: #e8f5e9; color: #1b5e20; }
.flash--alert { background: #fbe9e7; color: #bf360c; }

/* ── editor tools ── */
.editor-tools { display: flex; gap: var(--s3); }
.editor-btn {
	font: 500 0.8125rem/1 var(--sans);
	color: var(--kk-ink-subtle);
	background: var(--kk-canvas);
	border: 1px solid var(--kk-border);
	border-radius: 4px;
	padding: var(--s2) var(--s3);
	cursor: pointer;
	transition: all var(--fast) var(--ease);
}
.editor-btn:hover { background: var(--kk-wash); color: var(--kk-ink); border-color: var(--kk-ink-muted); }

/* ── Kicker overlays on promo images ── */
.promo__kicker-overlay {
	position: absolute; z-index: 2;
	pointer-events: none;
}

/* Shared dimmed backdrop for all splash variants */
.promo__kicker-overlay[class*="--splash"] {
	inset: 0;
	display: flex;
	background: rgba(0,0,0,0.35);
	color: var(--kk-white);
	text-shadow: 0 2px 8px rgba(0,0,0,0.4);
	padding: var(--s8) var(--s4) var(--s4);
}

/* 1 · Center (the original) */
.promo__kicker-overlay--splash-center {
	align-items: center; justify-content: center;
	font: 900 clamp(1.5rem, 4vw, 2.5rem)/1.1 var(--serif);
	text-align: center;
	text-wrap: balance;
}

/* 2 · Top-left */
.promo__kicker-overlay--splash-tl {
	align-items: flex-start; justify-content: flex-start;
	font: 900 clamp(1.25rem, 3.5vw, 2.25rem)/1.1 var(--serif);
	text-align: left;
	padding: 2.5rem var(--s4) var(--s4);
}

/* 3 · Bottom-right */
.promo__kicker-overlay--splash-br {
	align-items: flex-end; justify-content: flex-end;
	font: 900 clamp(1.25rem, 3.5vw, 2.25rem)/1.1 var(--serif);
	text-align: right;
}

/* 4 · Bottom-left */
.promo__kicker-overlay--splash-bl {
	align-items: flex-end; justify-content: flex-start;
	font: 900 clamp(1.25rem, 3.5vw, 2.25rem)/1.1 var(--serif);
	text-align: left;
}

/* 5 · Top-right */
.promo__kicker-overlay--splash-tr {
	align-items: flex-start; justify-content: flex-end;
	font: 900 clamp(1.25rem, 3.5vw, 2.25rem)/1.1 var(--serif);
	text-align: right;
	padding: 2.5rem var(--s4) var(--s4);
}



/* placeholder images */
.placeholder {
	background: linear-gradient(135deg, var(--kk-wash) 0%, #e0e0e0 100%);
	display: flex; align-items: center; justify-content: center;
	color: var(--kk-ink-muted); font: 400 0.75rem/1 var(--sans);
}