/* CAMRED archive filters — Option B tokens */

.md-archive {
	box-sizing: border-box;
	position: relative;
	left: auto;
	transform: none;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
	background: transparent;
}

.md-archive__layout {
	/*
	 * Filter sidebar — keep the generous fixed clamp (extra width helps
	 * checkboxes/labels). Jump-nav uses a tighter % scale in the theme.
	 */
	--md-archive-sidebar: clamp(
		13.5rem,
		calc((var(--wp--style--global--content-size, 1400px) - var(--md-gutter, 2rem)) * 0.25),
		18rem
	);
	display: grid;
	grid-template-columns: var(--md-archive-sidebar) minmax(0, 1fr);
	gap: var(--md-gutter, 2rem);
	align-items: start;
	box-sizing: border-box;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	color: var(--md-color-contrast, #1c1b1a);
}

.md-archive__main {
	padding: 0;
	background: transparent;
	border-radius: 0;
}

/* Shell (sticky, frosted panel) lives in theme — shared .md-sidebar-panel with .md-jump-nav.
 * Theme shell is 0.625rem; no padding-block override needed. */
.md-archive__filters.md-sidebar-panel {
	align-self: start;
	min-width: 0;
}

/* Filter heading — theme .md-sidebar-panel__title is slightly smaller by default */
.md-archive__filters-title {
	font-size: var(--md-text-body, 1.125rem);
	line-height: 1;
}

.md-archive__filters-drawer {
	margin: 0;
	padding: 0;
	border: 0;
}

/* JS wraps the form for mobile expand animation — desktop stays a normal block. */
.md-archive__filters-drawer .md-details__panel {
	display: block;
}

.md-archive__filters-drawer .md-details__inner {
	min-height: 0;
}

.md-archive__filters-summary {
	display: none;
	list-style: none;
	cursor: pointer;
	font-weight: 700;
	font-size: var(--md-text-body, 1.125rem);
	line-height: 1;
	padding: 0;
	margin: 0;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-archive__filters-summary::-webkit-details-marker {
	display: none;
}

.md-archive__filters-summary::marker {
	content: "";
}

.md-archive__filters-summary:focus {
	outline: none;
}

.md-archive__filters-summary:focus-visible {
	outline: 2px solid var(--md-color-contrast, #1c1b1a);
	outline-offset: 2px;
	border-radius: var(--md-radius-pill, 0.25rem);
}

.md-archive__filters-summary-count {
	font-weight: 400;
	opacity: 0.85;
	margin-inline-start: 0.35em;
}

.md-archive__form {
	--md-archive-rule-gap: 1rem;
	/* Match jump-nav / submenu content inset. */
	--md-archive-content-pad-x: var(--md-nav-pill-pad-x, 0.85rem);
	/* One muted tone for rules, counts, and empty options. */
	--md-archive-muted: color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 42%, transparent);
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-size: var(--md-text-meta, 0.925rem);
	line-height: 1.35;
	margin: 0;
}

.md-archive__filters .md-archive__filters-title,
.md-archive__filters .md-sidebar-panel__title {
	margin-bottom: var(--md-archive-rule-gap, 0.75rem);
	padding-left: var(--md-archive-content-pad-x, 0.85rem);
	padding-right: var(--md-archive-content-pad-x, 0.85rem);
}

.md-archive__group {
	margin: 0;
	padding: 0;
	border: 0;
}

/* Space between groups (no divider lines). */
.md-archive__group + .md-archive__group {
	margin-top: var(--md-archive-rule-gap, 0.75rem);
}

.md-archive__group-label {
	display: block;
	float: none;
	width: 100%;
	box-sizing: border-box;
	padding: 0 var(--md-archive-content-pad-x, 0.85rem);
	margin: 0 0 0.35rem;
	font-family: inherit;
	font-weight: 700;
	font-size: var(--md-text-small, 0.875rem);
	line-height: 1.35;
	color: var(--md-color-contrast, #1c1b1a);
	border: 0;
}

.md-archive__options {
	list-style: none;
	margin: 0;
	padding: 0 var(--md-archive-content-pad-x, 0.85rem);
	display: flex;
	flex-direction: column;
	gap: 0;
}

.md-archive__option {
	margin: 0;
}

.md-archive__option label {
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	gap: 0.45rem;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 0.15rem 0;
	cursor: pointer;
	font-family: inherit;
	font-size: var(--md-text-meta, 0.925rem);
	font-weight: 400;
	line-height: 1.35;
	text-align: left;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-archive__checkbox {
	appearance: none;
	-webkit-appearance: none;
	flex: 0 0 auto;
	align-self: flex-start;
	width: 1rem;
	height: 1rem;
	min-width: 1rem;
	min-height: 1rem;
	margin: 0.1em 0 0;
	border: 1px solid var(--md-color-contrast, #1c1b1a);
	border-radius: var(--md-radius-pill, 0.25rem);
	background-color: var(--md-color-surface, #fff);
	cursor: pointer;
}

.md-archive__checkbox:checked {
	background-color: var(--md-color-contrast, #1c1b1a);
	border-color: var(--md-color-contrast, #1c1b1a);
	background-image: none;
}

.md-archive__checkbox:focus-visible {
	outline: 2px solid var(--md-color-contrast, #1c1b1a);
	outline-offset: 2px;
}

.md-archive__checkbox:disabled {
	cursor: not-allowed;
	border-color: var(--md-archive-muted);
	background-color: transparent;
	opacity: 1;
}

.md-archive__checkbox:disabled:checked {
	background-color: var(--md-archive-muted);
	border-color: var(--md-archive-muted);
	background-image: none;
}

.md-archive__option-text {
	flex: 1 1 auto;
	min-width: 0;
}

.md-archive__count {
	font-family: var(--wp--preset--font-family--space-mono, "Space Mono", ui-monospace, monospace);
	font-size: 0.8em;
	color: inherit;
	opacity: 1;
}

.md-archive__option--empty {
	opacity: 1;
	color: var(--md-archive-muted);
}

.md-archive__option--empty label {
	cursor: not-allowed;
	color: inherit;
}

html[data-md-theme="dark"] .md-archive__group-label,
html[data-md-theme="dark"] .md-archive__filters-summary,
html[data-md-theme="dark"] .md-archive__option label {
	color: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-archive__checkbox {
	border-color: var(--md-color-border, #3f3e3c);
	background-color: var(--md-color-surface, #2a2928);
}

/* Checked fill must be the light contrast token, not the dark surface —
 * without this override, the higher-specificity unchecked dark rule above
 * wins over the base :checked rule and hides the checked state. */
html[data-md-theme="dark"] .md-archive__checkbox:checked {
	background-color: var(--md-color-contrast, #f5f5f4);
	border-color: var(--md-color-contrast, #f5f5f4);
	background-image: none;
}

html[data-md-theme="dark"] .md-archive__form {
	--md-archive-muted: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 42%, transparent);
}

html[data-md-theme="dark"] .md-archive__filters-title {
	color: var(--md-color-contrast, #f5f5f4);
}

.md-archive__filters-drawer[open] > .md-archive__form,
.md-archive__filters-drawer[open] .md-details__inner {
	margin-top: 0.75rem;
}

@media (min-width: 900px) {
	.md-archive__filters-drawer[open] > .md-archive__form,
	.md-archive__filters-drawer > .md-archive__form,
	.md-archive__filters-drawer .md-details__inner {
		margin-top: 0;
	}
}

.md-archive--enhanced .md-archive__apply {
	display: none;
}

.md-archive__apply,
.md-archive__load-more {
	font: inherit;
	font-weight: 700;
	letter-spacing: 0;
	padding: 0.55rem 1.15rem;
	border: none;
	border-radius: var(--md-radius, 0.5rem);
	background: #fff;
	color: var(--md-color-contrast, #1c1b1a);
	cursor: pointer;
	box-shadow: none;
	transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.md-archive__apply:hover,
.md-archive__apply:focus-visible,
.md-archive__load-more:hover,
.md-archive__load-more:focus-visible {
	background: #fff;
	color: var(--md-color-contrast, #1c1b1a);
	text-decoration: none;
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

.md-archive__apply:focus-visible,
.md-archive__load-more:focus-visible {
	outline: var(--md-focus-outline, 2px solid color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 70%, transparent));
	outline-offset: var(--md-focus-outline-offset, 2px);
}

/* Dark mode — reverse the light pill (white bg was invisible against the dark page). */
html[data-md-theme="dark"] .md-archive__apply,
html[data-md-theme="dark"] .md-archive__load-more {
	background: var(--md-color-surface, #2a2928);
	color: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-archive__apply:hover,
html[data-md-theme="dark"] .md-archive__apply:focus-visible,
html[data-md-theme="dark"] .md-archive__load-more:hover,
html[data-md-theme="dark"] .md-archive__load-more:focus-visible {
	background: var(--md-color-surface, #2a2928);
	color: var(--md-color-contrast, #f5f5f4);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

.md-archive__actions {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	align-items: stretch;
	margin-top: 0.75rem;
	padding: 0.75rem var(--md-archive-content-pad-x, 0.85rem) var(--md-archive-content-pad-x, 0.85rem);
}

.md-archive__clear {
	display: block;
	width: 100%;
	box-sizing: border-box;
	font: inherit;
	font-weight: 400;
	font-size: var(--md-text-meta, 0.925rem);
	line-height: 1;
	/* Match jump-nav / Projects submenu pill text inset */
	padding: var(--md-nav-pill-pad-y, 0.85rem) var(--md-nav-pill-pad-x, 0.85rem);
	border: none;
	border-radius: var(--md-radius-pill, 0.25rem);
	text-decoration: none;
	text-align: center;
	background: var(--md-color-subtle, #f3f3f3);
	color: var(--md-color-contrast, #1c1b1a);
	cursor: pointer;
	box-shadow: none;
	transition: background 0.15s ease;
}

.md-archive__clear:hover,
.md-archive__clear:focus-visible {
	background: color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 10%, var(--md-color-subtle, #f3f3f3));
	text-decoration: none;
}

.md-archive__clear:focus-visible {
	outline: var(--md-focus-outline, 2px solid color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 70%, transparent));
	outline-offset: var(--md-focus-outline-offset, 2px);
}

html[data-md-theme="dark"] .md-archive__clear {
	background: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 12%, var(--md-color-surface, #2a2928));
	color: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-archive__clear:hover,
html[data-md-theme="dark"] .md-archive__clear:focus-visible {
	background: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 18%, var(--md-color-surface, #2a2928));
}

.md-archive__noscript {
	font-size: 0.9rem;
	margin: 0.75rem 0 0;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-archive__status {
	margin: 0 0 var(--md-space-stack, 3rem);
	font-size: var(--md-type-display, clamp(2.75rem, 5.5vw, 4.25rem));
	font-weight: 300;
	line-height: 1.2;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-archive--loading .md-archive__results {
	opacity: 0.55;
	pointer-events: none;
}

.md-archive__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: var(--md-gutter, 2rem);
	row-gap: var(--md-gutter, 2rem);
}

.md-archive__item {
	margin: 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.md-archive__card {
	position: relative;
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 0;
	width: 100%;
	padding: 0;
	background: var(--md-color-surface, #fff);
	border-radius: var(--md-radius, 0.5rem);
	overflow: hidden;
	box-shadow: none;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.md-archive__card:has(.md-archive__card-link:hover),
.md-archive__card:has(.md-archive__card-link:focus-visible) {
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

.md-archive__card--kenya:has(.md-archive__card-link:hover),
.md-archive__card--kenya:has(.md-archive__card-link:focus-visible) {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-accent, #34f58c) 45%, transparent);
}

.md-archive__card--uk:has(.md-archive__card-link:hover),
.md-archive__card--uk:has(.md-archive__card-link:focus-visible) {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-primary, #f579f5) 45%, transparent);
}

.md-archive__card-link {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: block;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: var(--md-radius, 0.5rem);
	font-size: 0;
	line-height: 0;
	text-decoration: none;
	color: inherit;
	cursor: pointer;
}

.md-archive__card-link:focus:not(:focus-visible) {
	outline: none;
}

.md-archive__card-link:focus-visible {
	outline: none;
}

.md-archive__media {
	display: block;
	overflow: hidden;
	margin: 0;
	border-radius: var(--md-radius, 0.5rem) var(--md-radius, 0.5rem) 0 0;
	aspect-ratio: 16 / 9;
	background: var(--md-color-base, #e5e5e5);
	pointer-events: none;
}

.md-archive__image {
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	object-fit: cover;
}

.md-archive__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	padding: var(--md-space, 1.5rem);
	padding-bottom: calc(var(--md-space, 1.5rem) + 0.375rem);
	background: var(--md-color-surface, #fff);
	border-radius: 0 0 var(--md-radius, 0.5rem) var(--md-radius, 0.5rem);
	box-shadow: none;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	pointer-events: none;
}

.md-archive__card:not(:has(.md-archive__media)) .md-archive__body {
	border-radius: var(--md-radius, 0.5rem);
}

.md-archive__meta,
.md-latest__meta,
.md-hero__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	gap: 0.35rem 0.75rem;
	margin: 0;
}

.md-archive__meta .md-archive__badges,
.md-latest__meta .md-latest__badges,
.md-hero__meta .md-hero__badges {
	margin: 0;
}

.md-archive__badge,
.md-latest__badge,
.md-hero__badge {
	display: inline-block;
	align-self: flex-start;
	width: fit-content;
	max-width: 100%;
	margin: 0;
	padding: 0.2rem 0.65rem;
	font-family: var(--wp--preset--font-family--space-mono, "Space Mono", ui-monospace, monospace);
	font-size: var(--md-text-small, 0.875rem);
	font-weight: 400;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	border-radius: var(--md-radius-pill, 0.25rem);
	background: #fff;
	color: #1c1b1a;
}

.md-archive__badges,
.md-latest__badges,
.md-hero__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
	margin: 0 0 0.35rem;
}

.md-archive__badge--kenya,
.md-latest__badge--kenya,
.md-hero__badge--kenya,
.md-archive__badge--uk,
.md-latest__badge--uk,
.md-hero__badge--uk {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.2rem 0.9rem 0.2rem 0.65rem;
	color: #1c1b1a;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-weight: 400;
	text-transform: none;
	border-radius: var(--md-radius-pill, 0.25rem);
}

.md-archive__badge--kenya,
.md-latest__badge--kenya,
.md-hero__badge--kenya {
	background: color-mix(in srgb, var(--md-color-accent, #34f58c) 10%, #fff);
}

.md-archive__badge--uk,
.md-latest__badge--uk,
.md-hero__badge--uk {
	background: color-mix(in srgb, var(--md-color-primary, #f579f5) 10%, #fff);
}

.md-archive__badge--kenya::before,
.md-latest__badge--kenya::before,
.md-hero__badge--kenya::before,
.md-archive__badge--uk::before,
.md-latest__badge--uk::before,
.md-hero__badge--uk::before {
	content: "";
	flex-shrink: 0;
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
}

.md-archive__badge--kenya::before,
.md-latest__badge--kenya::before,
.md-hero__badge--kenya::before {
	background: var(--md-color-accent, #34f58c);
}

.md-archive__badge--uk::before,
.md-latest__badge--uk::before,
.md-hero__badge--uk::before {
	background: var(--md-color-primary, #f579f5);
}

html[data-md-theme="dark"] .md-archive__badge--kenya,
html[data-md-theme="dark"] .md-latest__badge--kenya,
html[data-md-theme="dark"] .md-hero__badge--kenya {
	background: color-mix(in srgb, var(--md-color-accent, #34f58c) 10%, #fff);
	color: #1c1b1a;
}

html[data-md-theme="dark"] .md-archive__badge--uk,
html[data-md-theme="dark"] .md-latest__badge--uk,
html[data-md-theme="dark"] .md-hero__badge--uk {
	background: color-mix(in srgb, var(--md-color-primary, #f579f5) 10%, #fff);
	color: #1c1b1a;
}

.md-archive__badge--type,
.md-latest__badge--type,
.md-hero__badge--type {
	background: color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 8%, #fff);
	color: #1c1b1a;
	border: none;
	font-weight: 400;
	text-transform: none;
	border-radius: var(--md-radius-pill, 0.25rem);
}

html[data-md-theme="dark"] .md-archive__badge--type,
html[data-md-theme="dark"] .md-latest__badge--type,
html[data-md-theme="dark"] .md-hero__badge--type {
	background: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 12%, var(--md-color-surface, #2a2928));
	color: var(--md-color-contrast, #f5f5f4);
}

/* Single post — labeled Project / Theme / Type pill rows */
.md-post-terms {
	display: flex;
	flex-direction: column;
	gap: 0;
	width: 100%;
	max-width: none;
	margin: 0;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
}

.md-post-terms__row {
	display: grid;
	grid-template-columns: 5.5rem minmax(0, 1fr);
	column-gap: 1rem;
	row-gap: 0.65rem;
	align-items: baseline;
	border-top: 1px solid var(--md-color-contrast, #1c1b1a);
	padding-block: 0.5rem;
}

.md-post-terms__row:last-child {
	border-bottom: 1px solid var(--md-color-contrast, #1c1b1a);
}

.md-post-terms__label {
	grid-column: 1;
	margin: 0;
	font-family: var(--wp--preset--font-family--space-mono, "Space Mono", ui-monospace, monospace);
	font-size: var(--md-text-small, 0.875rem);
	font-weight: 400;
	letter-spacing: 0.02em;
	text-transform: none;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-post-terms__caption {
	grid-column: 2;
	min-width: 0;
	margin: 0;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-size: var(--md-text-small, 0.875rem);
	font-weight: 400;
	line-height: 1.45;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-post-terms__caption p {
	margin: 0;
}

.md-post-terms__pills {
	grid-column: 2;
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
	list-style: none;
	margin: 0;
	padding: 0;
	min-width: 0;
}

.md-post-terms__item {
	margin: 0;
}

.md-post-terms__pill {
	display: inline-block;
	padding: 0.2rem 0.65rem;
	font-size: var(--md-text-small, 0.875rem);
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: var(--md-radius-pill, 0.25rem);
	background: #fff;
	color: #1c1b1a;
	box-shadow: none;
}

.md-post-terms__pill:hover,
.md-post-terms__pill:focus-visible {
	text-decoration: none;
	box-shadow: none;
	transform: none;
}

.md-post-terms__pill:focus-visible {
	outline: 2px solid var(--md-color-contrast, #1c1b1a);
	outline-offset: 2px;
}

.md-post-terms__pill--neutral {
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	background: color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 8%, #fff);
	color: #1c1b1a;
}

.md-post-terms__pill--kenya,
.md-post-terms__pill--uk {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.2rem 0.9rem 0.2rem 0.65rem;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	color: #1c1b1a;
}

.md-post-terms__pill--kenya {
	background: color-mix(in srgb, var(--md-color-accent, #34f58c) 10%, #fff);
}

.md-post-terms__pill--uk {
	background: color-mix(in srgb, var(--md-color-primary, #f579f5) 10%, #fff);
}

.md-post-terms__pill--kenya::before,
.md-post-terms__pill--uk::before {
	content: "";
	flex-shrink: 0;
	width: 0.5rem;
	height: 0.5rem;
	border-radius: 50%;
}

.md-post-terms__pill--kenya::before {
	background: var(--md-color-accent, #34f58c);
}

.md-post-terms__pill--uk::before {
	background: var(--md-color-primary, #f579f5);
}

html[data-md-theme="dark"] .md-post-terms__label {
	color: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-post-terms__pill--neutral {
	background: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 12%, var(--md-color-surface, #2a2928));
	color: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-post-terms__pill--kenya,
html[data-md-theme="dark"] .md-post-terms__pill--uk,
html[data-md-theme="dark"] .md-post-terms__pill--kenya:hover,
html[data-md-theme="dark"] .md-post-terms__pill--kenya:focus-visible,
html[data-md-theme="dark"] .md-post-terms__pill--uk:hover,
html[data-md-theme="dark"] .md-post-terms__pill--uk:focus-visible {
	/* Light pastel fill stays legible: force dark text, never inherit the
	 * theme's default light/contrast link colour used elsewhere in dark mode. */
	color: #1c1b1a !important;
}

html[data-md-theme="dark"] .md-post-terms__pill--kenya {
	background: color-mix(in srgb, var(--md-color-accent, #34f58c) 10%, #fff);
}

html[data-md-theme="dark"] .md-post-terms__pill--uk {
	background: color-mix(in srgb, var(--md-color-primary, #f579f5) 10%, #fff);
}

html[data-md-theme="dark"] .md-post-terms__pill:focus-visible {
	outline-color: var(--md-color-contrast, #f5f5f4);
}

.md-post-terms__share {
	grid-column: 2;
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
	list-style: none;
	margin: 0;
	padding: 0;
	min-width: 0;
}

.md-post-terms__share-link {
	display: inline-block;
	margin: 0;
	padding: 0.2rem 0.65rem;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	font-size: var(--md-text-small, 0.875rem);
	font-weight: 400;
	line-height: 1.35;
	letter-spacing: 0;
	text-transform: none;
	text-decoration: none;
	border: none;
	border-radius: var(--md-radius-pill, 0.25rem);
	background: color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 8%, #fff);
	color: #1c1b1a;
	box-shadow: none;
	cursor: pointer;
}

.md-post-terms__share-link:hover,
.md-post-terms__share-link:focus-visible {
	text-decoration: none;
	background: color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 14%, #fff);
}

.md-post-terms__share-link:focus-visible {
	outline: 2px solid var(--md-color-contrast, #1c1b1a);
	outline-offset: 2px;
}

.md-post-terms__share-link--copy.is-copied {
	background: color-mix(in srgb, var(--md-color-accent, #34f58c) 28%, #fff);
}

html[data-md-theme="dark"] .md-post-terms__share-link {
	background: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 12%, var(--md-color-surface, #2a2928));
	color: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-post-terms__share-link:hover,
html[data-md-theme="dark"] .md-post-terms__share-link:focus-visible {
	background: color-mix(in srgb, var(--md-color-contrast, #f5f5f4) 18%, var(--md-color-surface, #2a2928));
}

html[data-md-theme="dark"] .md-post-terms__share-link--copy.is-copied {
	background: color-mix(in srgb, var(--md-color-accent, #34f58c) 22%, var(--md-color-surface, #2a2928));
}

html[data-md-theme="dark"] .md-post-terms__share-link:focus-visible {
	outline-color: var(--md-color-contrast, #f5f5f4);
}


html[data-md-theme="dark"] .md-archive {
	background: transparent;
}

html[data-md-theme="dark"] .md-latest__card:has(.md-latest__card-link:hover),
html[data-md-theme="dark"] .md-latest__card:has(.md-latest__card-link:focus-visible),
html[data-md-theme="dark"] .md-archive__card:has(.md-archive__card-link:hover),
html[data-md-theme="dark"] .md-archive__card:has(.md-archive__card-link:focus-visible) {
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

html[data-md-theme="dark"] .md-latest__card--kenya:has(.md-latest__card-link:hover),
html[data-md-theme="dark"] .md-latest__card--kenya:has(.md-latest__card-link:focus-visible),
html[data-md-theme="dark"] .md-archive__card--kenya:has(.md-archive__card-link:hover),
html[data-md-theme="dark"] .md-archive__card--kenya:has(.md-archive__card-link:focus-visible) {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-accent, #34f58c) 50%, transparent);
}

html[data-md-theme="dark"] .md-latest__card--uk:has(.md-latest__card-link:hover),
html[data-md-theme="dark"] .md-latest__card--uk:has(.md-latest__card-link:focus-visible),
html[data-md-theme="dark"] .md-archive__card--uk:has(.md-archive__card-link:hover),
html[data-md-theme="dark"] .md-archive__card--uk:has(.md-archive__card-link:focus-visible) {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-primary, #f579f5) 50%, transparent);
}

.md-archive__title {
	margin: 0.4rem 0 0;
	font-size: var(--md-text-card-title, clamp(1.35rem, 2vw, 1.55rem));
	line-height: 1.25;
	font-weight: 600;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-archive__excerpt {
	margin: 0.5rem 0 0;
	line-height: var(--md-body-leading, 1.5);
	font-size: var(--wp--preset--font-size--medium, 1.125rem);
	color: var(--md-color-contrast, #1c1b1a);
}

.md-archive__date,
.md-latest__date,
.md-hero__date {
	display: block;
	margin: 0;
	font-family: var(--wp--preset--font-family--space-mono, "Space Mono", ui-monospace, monospace);
	font-size: var(--md-text-small, 0.875rem);
	font-weight: 400;
	line-height: 1.4;
	color: var(--md-color-contrast, #1c1b1a);
	white-space: nowrap;
}

.md-archive__empty {
	margin: 0;
}

.md-archive__footer {
	margin-top: 1.75rem;
	display: flex;
	justify-content: center;
}

.md-archive__load-more {
	min-width: 10rem;
}

.md-archive__pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.md-archive__page {
	display: inline-block;
	min-width: 2rem;
	padding: 0.35rem 0.55rem;
	text-align: center;
	border: none;
	border-radius: var(--md-radius-pill, 0.25rem);
	background: var(--md-color-subtle, #f3f3f3);
	text-decoration: none;
	color: var(--md-color-contrast, #1c1b1a);
	font-weight: 700;
}

.md-archive__page--current {
	background: var(--md-color-contrast, #1c1b1a);
	color: var(--md-color-surface, #fff);
}

.md-latest__list {
	list-style: none;
	margin: 0 0 var(--md-space-stack, 3rem);
	padding: 0;
	display: grid;
	gap: var(--md-gutter, 2rem);
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
}

.md-latest__list--cards {
	grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}

.md-latest__list--cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.md-latest__list--cols-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.md-latest__footer {
	display: flex;
	justify-content: center;
	margin: var(--md-gutter, 2rem) 0 var(--md-space-stack, 3rem);
}

.md-latest__load-more {
	appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.75rem;
	padding: 0.55rem 1.35rem;
	border: none;
	border-radius: var(--md-radius, 0.5rem);
	background: #fff;
	color: var(--md-color-contrast, #1c1b1a);
	font: inherit;
	font-size: var(--md-text-body, 1.125rem);
	font-weight: 700;
	letter-spacing: 0;
	line-height: 1.2;
	cursor: pointer;
	box-shadow: none;
	transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.md-latest__load-more:hover,
.md-latest__load-more:focus-visible {
	background: #fff;
	color: var(--md-color-contrast, #1c1b1a);
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

.md-latest__load-more:focus-visible {
	outline: var(--md-focus-outline, 2px solid color-mix(in srgb, var(--md-color-contrast, #1c1b1a) 70%, transparent));
	outline-offset: var(--md-focus-outline-offset, 2px);
}

.md-latest__load-more:disabled {
	opacity: 0.65;
	cursor: wait;
}

/* Dark mode — reverse the light pill (white bg was invisible against the dark page). */
html[data-md-theme="dark"] .md-latest__load-more {
	background: var(--md-color-surface, #2a2928);
	color: var(--md-color-contrast, #f5f5f4);
}

html[data-md-theme="dark"] .md-latest__load-more:hover,
html[data-md-theme="dark"] .md-latest__load-more:focus-visible {
	background: var(--md-color-surface, #2a2928);
	color: var(--md-color-contrast, #f5f5f4);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

@media (max-width: 700px) {
	.md-latest__list--cols-2,
	.md-latest__list--cols-3 {
		grid-template-columns: 1fr !important;
	}
}

.md-latest__item {
	margin: 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

.md-latest__list--banner {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0 0 var(--md-space-stack, 3rem);
}

/* Match archive cards (Impact / Outputs / Resources) — stacked image + body */
.md-latest__card {
	position: relative;
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 0;
	width: 100%;
	padding: 0;
	background: var(--md-color-surface, #fff);
	border-radius: var(--md-radius, 0.5rem);
	overflow: hidden;
	box-shadow: none;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.md-latest__card:has(.md-latest__card-link:hover),
.md-latest__card:has(.md-latest__card-link:focus-visible) {
	transform: translateY(-1px);
	box-shadow: 0 6px 18px rgba(28, 27, 26, 0.12);
}

.md-latest__card--kenya:has(.md-latest__card-link:hover),
.md-latest__card--kenya:has(.md-latest__card-link:focus-visible) {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-accent, #34f58c) 45%, transparent);
}

.md-latest__card--uk:has(.md-latest__card-link:hover),
.md-latest__card--uk:has(.md-latest__card-link:focus-visible) {
	box-shadow: 0 6px 22px color-mix(in srgb, var(--md-color-primary, #f579f5) 45%, transparent);
}

.md-latest__card-link {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: block;
	border-radius: var(--md-radius, 0.5rem);
	text-decoration: none;
	color: inherit;
	cursor: pointer;
}

.md-latest__card-link:focus:not(:focus-visible) {
	outline: none;
}

.md-latest__card-link:focus-visible {
	outline: none;
}

.md-latest__media {
	display: block;
	overflow: hidden;
	border-radius: var(--md-radius, 0.5rem) var(--md-radius, 0.5rem) 0 0;
	aspect-ratio: 16 / 9;
	background: var(--md-color-base, #e5e5e5);
	pointer-events: none;
}

.md-latest__media--empty {
	min-height: 0;
	background: var(--md-color-base, #e5e5e5);
}

.md-latest__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.md-latest__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	padding: var(--md-space, 1.5rem);
	padding-bottom: calc(var(--md-space, 1.5rem) + 0.375rem);
	background: var(--md-color-surface, #fff);
	border-radius: 0 0 var(--md-radius, 0.5rem) var(--md-radius, 0.5rem);
	box-shadow: none;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	pointer-events: none;
}

.md-latest__card:not(:has(.md-latest__media)) .md-latest__body {
	border-radius: var(--md-radius, 0.5rem);
}

.md-latest__title {
	margin: 0.4rem 0 0;
	font-size: var(--md-text-card-title, clamp(1.35rem, 2vw, 1.55rem));
	line-height: 1.25;
	font-weight: 600;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-latest__banner-title {
	margin: 0;
	font-size: 0.95rem;
	font-weight: 500;
}

.md-latest__banner-title a {
	color: var(--md-color-contrast, #1c1b1a);
	text-decoration: none;
}

.md-latest__banner-title a:hover,
.md-latest__banner-title a:focus-visible {
	text-decoration: underline;
}

.md-latest__excerpt {
	margin: 0.5rem 0 0;
	line-height: var(--md-body-leading, 1.5);
	font-size: var(--wp--preset--font-size--medium, 1.125rem);
	color: var(--md-color-contrast, #1c1b1a);
}

/* —— Home hero carousel (in-grid image + title overlay) —— */

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.md-hero.alignfull,
.md-hero {
	--md-hero-height: 50vh;
	--md-hero-content-inset-left: var(--md-space, 1.5rem);
	--md-hero-content-inset-right: var(--md-space, 1.5rem);
	position: relative;
	left: auto;
	right: auto;
	transform: none;
	width: 100% !important;
	max-width: var(--wp--style--global--content-size, 1400px) !important;
	margin-top: 0 !important;
	margin-bottom: var(--md-space-section, 6rem) !important;
	margin-left: auto !important;
	margin-right: auto !important;
	background: var(--md-color-contrast, #1c1b1a);
	border-radius: var(--md-radius, 0.5rem);
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
	overflow: hidden;
}

/* Keep shortcode wrapper on the content grid (do not break out full-bleed) */
.wp-block-shortcode:has(> .md-hero),
.entry-content > .wp-block-shortcode:has(.md-hero),
.wp-block-post-content > .wp-block-shortcode:has(.md-hero),
.is-layout-constrained > .wp-block-shortcode:has(.md-hero) {
	display: block;
	position: relative;
	left: auto;
	transform: none;
	width: 100% !important;
	max-width: var(--wp--style--global--content-size, 1400px) !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding: 0 !important;
}

.wp-block-shortcode:has(> .md-hero) > .md-hero {
	left: auto;
	transform: none;
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.md-hero__viewport {
	position: relative;
	min-height: var(--md-hero-height);
	overflow: hidden;
}

.md-hero__track {
	position: relative;
	min-height: var(--md-hero-height);
}

.md-hero__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.45s ease, visibility 0.45s ease;
}

.md-hero__slide.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	z-index: 1;
}

.md-hero__media {
	position: absolute;
	inset: 0;
	background: var(--md-color-base, #e5e5e5);
}

.md-hero__image,
.md-hero__media-fallback {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	position: absolute;
	inset: 0;
}

.md-hero__media-fallback {
	background:
		linear-gradient(135deg, var(--md-color-primary, #f579f5) 0%, var(--md-color-accent, #34f58c) 100%);
}

.md-hero__slide-link {
	position: absolute;
	inset: 0;
	z-index: 3;
	display: block;
	text-decoration: none;
	color: inherit;
	cursor: pointer;
}

.md-hero__slide-link:focus:not(:focus-visible) {
	outline: none;
}

.md-hero__slide-link:focus-visible {
	outline: none;
}

.md-hero,
.md-single-hero {
	--md-hero-content-inset-left: max(
		var(--wp--style--root--padding-left, var(--wp--preset--spacing--50, 1.5rem)),
		calc((100vw - var(--wp--style--global--content-size, 1400px)) / 2)
	);
	--md-hero-content-inset-right: max(
		var(--wp--style--root--padding-right, var(--wp--preset--spacing--50, 1.5rem)),
		calc((100vw - var(--wp--style--global--content-size, 1400px)) / 2)
	);
	/*
	 * Half-column of the content band, minus one gutter — same math as
	 * .md-home-projects__list (2 cols + gap). Single is full-bleed, so the
	 * band is 100% minus the viewport content insets; panel already sits on
	 * the content left edge, so no further inset subtraction.
	 */
	--md-hero-panel-col: calc(
		(
				100% - var(--md-hero-content-inset-left) - var(--md-hero-content-inset-right) -
					var(--md-gutter, 2rem)
			) / 2
	);
}

/* Home hero is in-grid — panel insets match the shared space token.
 * Panel is inset from the hero edge; subtract that so its right edge meets
 * the same gutter as the left Projects card. */
.md-hero {
	--md-hero-content-inset-left: var(--md-space, 1.5rem);
	--md-hero-content-inset-right: var(--md-space, 1.5rem);
	--md-hero-panel-col: calc(
		(100% - var(--md-gutter, 2rem)) / 2 - var(--md-hero-content-inset-left)
	);
}

/* Frosted content card over the image (matches header tools).
 * Hugs short copy (min of max-content and the half-column); long titles /
 * excerpts grow until the right edge matches the Projects half-column. */
.md-hero__panel {
	position: absolute;
	left: var(--md-hero-content-inset-left);
	top: auto;
	bottom: var(--md-space, 1.5rem);
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-start;
	gap: 0.65rem;
	width: min(max-content, var(--md-hero-panel-col));
	max-width: min(
		var(--md-hero-panel-col),
		calc(100% - var(--md-hero-content-inset-left) - var(--md-hero-content-inset-right))
	);
	box-sizing: border-box;
	padding: var(--md-space, 1.5rem);
	padding-bottom: calc(var(--md-space, 1.5rem) + 0.375rem);
	background-color: var(--md-frost-nav-shell, rgba(255, 255, 255, 0.8));
	background: var(--md-frost-nav-shell, rgba(255, 255, 255, 0.8));
	color: var(--md-color-contrast, #1c1b1a);
	border: none;
	border-radius: max(var(--md-radius-pill, 0.25rem), calc(var(--md-radius, 0.5rem) - var(--md-space, 1.5rem)));
	box-shadow: 0 4px 18px rgba(28, 27, 26, 0.08);
	backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
	-webkit-backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
	pointer-events: none;
}

.md-hero__panel :is(.md-hero__title, .md-single-hero__title, .wp-block-post-title) {
	max-width: 100%;
	min-width: 0;
}

.md-hero__panel :is(.md-hero__excerpt) {
	max-width: 100%;
	min-width: 0;
}

.md-hero__title {
	margin: 0.4rem 0 0;
	max-width: none;
	font-size: var(--md-text-hero-title, clamp(1.45rem, 3vw, 2.25rem));
	line-height: 1.15;
	font-weight: 700;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-hero__excerpt {
	margin: 0;
	max-width: none;
	font-size: var(--md-text-body, 1.125rem);
	line-height: 1.45;
	color: var(--md-color-contrast, #1c1b1a);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.md-hero__controls {
	position: absolute;
	right: var(--md-hero-content-inset-right);
	bottom: var(--md-space, 1.5rem);
	z-index: 5;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	background: transparent;
	border: none;
	box-shadow: none;
}

.md-hero__dots {
	display: inline-flex;
	gap: 0.4rem;
	align-items: center;
	padding: 0;
}

.md-hero__dot {
	appearance: none;
	width: 0.7rem;
	height: 0.7rem;
	padding: 0;
	border: none;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.55);
	cursor: pointer;
}

.md-hero__dot.is-active,
.md-hero__dot[aria-current="true"] {
	background: var(--md-color-contrast, #1c1b1a);
}

html[data-md-theme="dark"] .md-hero__panel {
	background-color: var(--md-frost-nav-shell, rgba(42, 41, 40, 0.8));
	background: var(--md-frost-nav-shell, rgba(42, 41, 40, 0.8));
	color: var(--md-color-contrast, #f5f5f4);
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
	backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
	-webkit-backdrop-filter: var(--md-frost-blur, saturate(180%) blur(18px));
}

html[data-md-theme="dark"] .md-archive__card,
html[data-md-theme="dark"] .md-latest__card {
	background: var(--md-color-surface, #2a2928);
	box-shadow: none;
}

html[data-md-theme="dark"] .md-archive__body,
html[data-md-theme="dark"] .md-latest__body {
	background: var(--md-color-surface, #2a2928);
	color: var(--md-color-contrast, #f5f5f4);
	box-shadow: none;
}

html[data-md-theme="dark"] .md-hero__controls {
	background: transparent;
	box-shadow: none;
}

html[data-md-theme="dark"] .md-hero__title {
	color: var(--md-color-contrast, #f5f5f4);
}

/*
 * Single CPT header — full-bleed image (edge-to-edge), frosted panel stays on
 * the content grid via shared --md-hero-content-inset-* (viewport-based calc
 * above). Home .md-hero stays in-grid with radius; do not copy that here.
 * Breakout uses margin calc (not transform) so backdrop-filter frost still works.
 */
.md-single-hero {
	--md-hero-height: 50vh;
	position: relative;
	left: auto;
	right: auto;
	transform: none;
	width: 100vw !important;
	max-width: 100vw !important;
	min-height: var(--md-hero-height);
	margin-top: 0 !important;
	margin-bottom: var(--md-space-section, 6rem) !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
	background: var(--md-color-contrast, #1c1b1a);
	border-radius: 0;
	overflow: hidden;
	box-sizing: border-box;
}

.md-single-hero .wp-block-post-featured-image,
.md-single-hero .md-single-hero__figure {
	position: absolute;
	inset: 0;
	margin: 0;
	width: 100%;
	height: 100%;
	border-radius: 0;
	z-index: 1;
}

/* FSE block image or classic theme figure (.md-single-hero__img) */
.md-single-hero .wp-block-post-featured-image img,
.md-single-hero .md-single-hero__figure img,
.md-single-hero .md-single-hero__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	border-radius: 0;
}

.md-single-hero__panel {
	z-index: 3;
	pointer-events: auto;
}

.md-single-hero__meta {
	width: 100%;
}

/* Shortcode wrapper must not break the meta flex row */
.md-single-hero__meta > .wp-block-shortcode {
	display: contents;
}

.md-single-hero__date,
.md-single-hero .wp-block-post-date {
	margin: 0;
}

.md-single-hero__title,
.md-single-hero .wp-block-post-title {
	margin: 0.4rem 0 0;
}

/*
 * No-image fallback — classic single.php uses .md-single-hero__figure;
 * FSE used .wp-block-post-featured-image. Match either.
 */
.md-single-hero:not(:has(.wp-block-post-featured-image img, .md-single-hero__figure img)) {
	min-height: auto;
	width: auto !important;
	max-width: none !important;
	left: auto;
	transform: none;
	margin-left: auto !important;
	margin-right: auto !important;
	margin-bottom: var(--wp--preset--spacing--50, 2rem);
	background: transparent;
	border-radius: 0;
	overflow: visible;
	padding-top: 0;
}

.md-single-hero:not(:has(.wp-block-post-featured-image img, .md-single-hero__figure img))::before {
	display: none;
}

.md-single-hero:not(:has(.wp-block-post-featured-image img, .md-single-hero__figure img)) .md-single-hero__panel {
	position: static;
	width: 100%;
	max-width: none;
	margin-inline: 0;
	background: transparent;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	box-shadow: none;
	padding: 0;
	border-radius: 0;
}

/* Related posts on single CPT templates */
.md-related {
	width: 100%;
	max-width: none;
	margin: 0;
	font-family: var(--wp--preset--font-family--inclusive-sans, "Inclusive Sans", system-ui, sans-serif);
}

.md-related__title {
	margin: 0 0 var(--md-space-stack, 3rem);
	font-size: var(--md-type-display, clamp(2.75rem, 5.5vw, 4.25rem));
	font-weight: 300;
	line-height: 1.2;
	color: var(--md-color-contrast, #1c1b1a);
}

.md-related .md-archive__list {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

html[data-md-theme="dark"] .md-related__title {
	color: var(--md-color-contrast, #f5f5f4);
}

@media (max-width: 900px) {
	.md-hero,
	.md-single-hero {
		--md-hero-height: 75vh;
	}

	.md-hero__panel,
	.md-single-hero__panel {
		left: var(--md-hero-content-inset-left);
		right: var(--md-hero-content-inset-right);
		top: auto;
		bottom: var(--md-space, 1.5rem);
		width: auto;
		max-width: none;
	}

	.md-hero__controls {
		top: var(--md-space, 1.5rem);
		right: var(--md-hero-content-inset-right);
		bottom: auto;
		left: auto;
		transform: none;
	}

	.md-related .md-archive__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 899px) {
	.md-archive__layout {
		grid-template-columns: 1fr;
	}

	/* Collapsed drawer: tight vertical inset; open restores comfortable form padding.
	 * padding-inline matches mobile nav panel; full width aligns with cards below. */
	.md-archive__filters.md-sidebar-panel {
		position: static;
		margin-inline: 0;
		padding-block: 0.5rem;
		padding-inline: var(--md-header-pad-x-start, 1.35rem);
		transition: padding-bottom 0.35s ease;
	}

	/* Smooth expand + fade — same grid/opacity pattern as theme .wp-block-details */
	.md-archive__filters-drawer.md-details--animated .md-details__panel {
		display: grid;
		grid-template-rows: 0fr;
		transition: grid-template-rows 0.35s ease;
	}

	.md-archive__filters-drawer.md-details--animated.md-details--revealed .md-details__panel {
		grid-template-rows: 1fr;
	}

	.md-archive__filters-drawer.md-details--animated .md-details__inner {
		overflow: hidden;
		opacity: 0;
		transition: opacity 0.35s ease;
	}

	.md-archive__filters-drawer.md-details--animated.md-details--revealed .md-details__inner {
		opacity: 1;
	}

	.md-archive__filters.md-sidebar-panel:has(.md-archive__filters-drawer[open]) {
		/* Keep padding-top fixed so the summary bar does not shift when opening. */
		padding-bottom: 1.75rem;
	}

	.md-archive__filters-summary {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 0;
		width: 100%;
		min-height: 2.75rem;
	}

	/* Match .wp-block-details accordion + / −; icon on the right for filter bar. */
	.md-archive__filters-summary::after {
		content: "+";
		flex: 0 0 2.75rem;
		width: 2.75rem;
		height: 2.75rem;
		margin-left: auto;
		line-height: 2.75rem;
		text-align: center;
		font-size: 1.375rem;
		font-weight: 400;
	}

	.md-archive__filters-drawer[open] > .md-archive__filters-summary::after {
		content: "−";
	}

	.md-archive__filters-title {
		display: none;
	}

	.md-archive__option label {
		align-items: flex-start;
	}
}

@media (max-width: 781px) {
	.md-latest__list--banner {
		grid-template-columns: 1fr;
	}

	.md-archive__list {
		grid-template-columns: 1fr;
	}

	.md-related .md-archive__list {
		grid-template-columns: 1fr;
	}
}

@media (min-width: 900px) {
	.md-archive__filters-summary {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.md-archive--loading .md-archive__results {
		transition: none;
	}

	.md-archive__filters.md-sidebar-panel,
	.md-archive__filters-drawer.md-details--animated .md-details__panel,
	.md-archive__filters-drawer.md-details--animated .md-details__inner {
		transition: none;
	}

	.md-hero__slide {
		transition: none;
	}

	.md-latest__card,
	.md-archive__card {
		transition: none;
	}

	.md-latest__card:has(.md-latest__card-link:hover),
	.md-latest__card:has(.md-latest__card-link:focus-visible),
	.md-archive__card:has(.md-archive__card-link:hover),
	.md-archive__card:has(.md-archive__card-link:focus-visible) {
		transform: none;
		box-shadow: none;
	}
}