/**
 * ColourFull Ultimate — clean editorial skin (colourfull-media-site-clean).
 * Light cream surfaces, Colour_Full red accent, greyscale → colour image cards.
 */

.cfu-root {
	--cfu-brand-red: #b50c08;
	--cfu-brand-dark: #1c1b1b;
	--cfu-cream: #fcf9f8;
	--cfu-surface: #f6f3f2;
	--cfu-surface-high: #f0eded;
	--cfu-paper: #ffffff;
	--cfu-ink: #1c1b1b;
	--cfu-muted-ink: #5c403b;
	--cfu-muted: rgba(28, 27, 27, 0.68);
	--cfu-muted-dark: rgba(92, 64, 59, 0.88);
	--cfu-line: rgba(229, 189, 183, 0.35);
	--cfu-line-dark: rgba(229, 189, 183, 0.45);
	--cfu-border-strong: rgba(181, 12, 8, 0.18);
	--cfu-radius: 12px;
	--cfu-radius-sm: 10px;
	--cfu-max: 1200px;
	isolation: isolate;
	contain: layout style;
	min-width: 0;
	overflow-x: clip;
	background: var(--cfu-cream);
	color: var(--cfu-ink);
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif;
	line-height: 1.6;
	font-size: 1rem;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

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

.cfu-root a {
	color: inherit;
}

.cfu-wrap {
	width: min(100% - 2rem, var(--cfu-max));
	margin-inline: auto;
}

.cfu-narrow {
	width: min(100% - 2rem, 760px);
	margin-inline: auto;
}

.cfu-kicker {
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-size: 0.72rem;
	margin: 0 0 0.75rem;
	color: var(--cfu-brand-red);
	font-weight: 700;
}

.cfu-display {
	font-size: clamp(2.1rem, 5vw, 3.4rem);
	line-height: 1.05;
	letter-spacing: -0.04em;
	margin: 0 0 1rem;
	color: var(--cfu-brand-red);
}

.cfu-display--sm {
	font-size: clamp(1.85rem, 4vw, 2.75rem);
	color: var(--cfu-brand-red);
}

.cfu-lede {
	font-size: clamp(1.05rem, 2.2vw, 1.2rem);
	color: var(--cfu-muted-ink);
	margin: 0 0 1.25rem;
	max-width: 42rem;
	line-height: 1.65;
}

.cfu-h2 {
	font-size: clamp(1.25rem, 2.4vw, 1.6rem);
	margin: 0 0 0.75rem;
	letter-spacing: -0.02em;
	color: var(--cfu-ink);
}

.cfu-h3 {
	font-size: 1.05rem;
	margin: 0.75rem 0 0.35rem;
	letter-spacing: -0.01em;
	color: var(--cfu-ink);
}

.cfu-muted {
	color: var(--cfu-muted-dark);
	margin: 0;
	max-width: 65ch;
}

.cfu-band--light .cfu-muted {
	color: var(--cfu-muted-dark);
}

.cfu-stack {
	margin-top: 0.5rem;
}

.cfu-stack-lg {
	margin-top: 1.5rem;
}

.cfu-hero {
	padding: clamp(2rem, 5vw, 4rem) 0;
	background: var(--cfu-cream);
	color: var(--cfu-ink);
}

/* Homepage editorial hero (merged from colourfull-editorial-theme) */
.cfu-hero--editorial {
	padding: clamp(1.75rem, 4vw, 3rem) 0 clamp(2.25rem, 5vw, 4rem);
	background: var(--cfu-cream);
	color: var(--cfu-brand-dark);
}

.cfu-hero--editorial .cfu-display,
.cfu-hero--editorial .cfu-hero__title {
	color: var(--cfu-brand-red);
}

.cfu-hero__subtitle {
	margin: 0 0 1rem;
	font-family: ui-monospace, "IBM Plex Mono", "SFMono-Regular", Menlo, Consolas, monospace;
	font-size: 0.75rem;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: rgba(28, 27, 27, 0.55);
}

.cfu-hero--editorial .cfu-lede,
.cfu-hero--editorial .cfu-hero__about {
	color: rgba(28, 27, 27, 0.62);
}

.cfu-hero__media {
	position: relative;
	align-self: stretch;
	min-height: min(420px, 62vw);
	border-radius: 28px;
	overflow: hidden;
	background: #e8ddd8;
	border: 1px solid rgba(181, 12, 8, 0.18);
	box-shadow: 0 22px 55px rgba(28, 27, 27, 0.12);
}

.cfu-hero__media .cfu-imgcard--hero {
	min-height: min(420px, 62vw);
	aspect-ratio: auto;
	border: none;
	border-radius: 0;
}

.cfu-hero__media .cfu-hero__image,
.cfu-hero__visual .cfu-imgcard--hero img {
	object-position: center 20%;
}

.cfu-hero__play {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: grid;
	place-items: center;
	opacity: 0;
	transition: opacity 0.35s ease;
	background: rgba(0, 0, 0, 0.12);
	text-decoration: none;
	color: inherit;
}

.cfu-hero__media:hover .cfu-hero__play,
.cfu-hero__media:focus-within .cfu-hero__play {
	opacity: 1;
}

.cfu-hero__play:focus-visible {
	opacity: 1;
	outline: 2px solid var(--cfu-brand-red);
	outline-offset: 4px;
}

/* Win over generic hero visual sizing when play shell wraps the card */
.cfu-hero__visual .cfu-hero__media .cfu-imgcard--hero {
	aspect-ratio: auto;
	min-height: min(420px, 62vw);
}

.cfu-listen-hub .cfu-textlink--subtle {
	font-weight: 600;
	color: var(--cfu-muted-ink);
}

.cfu-listen-hub .cfu-textlink--subtle:hover {
	color: var(--cfu-brand-red);
}

.cfu-hero__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: clamp(1.25rem, 3vw, 2.5rem);
	align-items: center;
	width: min(100% - 2rem, var(--cfu-max));
	margin-inline: auto;
}

@media (min-width: 900px) {
	.cfu-hero__grid {
		grid-template-columns: 1.1fr 0.9fr;
	}
}

.cfu-hero__cta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
	margin: 1rem 0 1.25rem;
}

.cfu-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.35rem;
	padding: 0.75rem 1.1rem;
	border-radius: 999px;
	border: 1px solid transparent;
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none;
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease, filter 0.2s ease;
}

.cfu-btn:focus-visible {
	outline: 2px solid color-mix(in oklab, var(--cfu-brand-red), white 35%);
	outline-offset: 3px;
}

.cfu-btn--primary {
	background: var(--cfu-brand-red);
	color: #fff;
	box-shadow: 0 4px 14px rgba(181, 12, 8, 0.25);
}

.cfu-btn--primary:hover {
	background: #8a0906;
	transform: translateY(-1px);
	box-shadow: 0 8px 20px rgba(181, 12, 8, 0.3);
}

.cfu-btn--ghost {
	background: transparent;
	border: 1px solid var(--cfu-border-strong);
	color: var(--cfu-brand-red);
}

.cfu-btn--ghost:hover {
	background: var(--cfu-surface-high);
	border-color: var(--cfu-brand-red);
}

/* Editorial secondary (cream / light surfaces) */
.cfu-btn--secondary {
	background: transparent;
	border: 1px solid rgba(181, 12, 8, 0.35);
	color: var(--cfu-brand-red);
	box-shadow: none;
}

.cfu-btn--secondary:hover {
	background: rgba(181, 12, 8, 0.07);
	transform: translateY(-1px);
}

.cfu-pills {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.cfu-pill {
	display: inline-flex;
	padding: 0.45rem 0.75rem;
	border-radius: 999px;
	border: 1px solid var(--cfu-line-dark);
	text-decoration: none;
	font-size: 0.85rem;
	color: var(--cfu-ink);
	background: rgba(255, 255, 255, 0.85);
}

.cfu-pill:hover {
	border-color: var(--cfu-brand-red);
	color: var(--cfu-brand-red);
}

.cfu-pills--on-cream .cfu-pill {
	color: var(--cfu-brand-dark);
	background: rgba(255, 255, 255, 0.72);
	border-color: rgba(28, 27, 27, 0.12);
}

.cfu-pills--on-cream .cfu-pill:hover {
	border-color: rgba(181, 12, 8, 0.45);
}

.cfu-pill--quiet {
	font-size: 0.8rem;
	opacity: 0.92;
}

.cfu-hero__visual .cfu-imgcard--hero {
	min-height: clamp(260px, 42vw, 520px);
	aspect-ratio: 3 / 3.6;
}

.cfu-band {
	padding: clamp(2rem, 5vw, 3.5rem) 0;
	background: var(--cfu-surface);
	color: var(--cfu-ink);
}

.cfu-band--surface {
	background: var(--cfu-surface);
	color: var(--cfu-ink);
}

.cfu-band--cream {
	background: var(--cfu-cream);
	color: var(--cfu-brand-dark);
}

.cfu-brand-bar {
	padding: 1rem 0 0.35rem;
	border-bottom: 1px solid rgba(28, 27, 27, 0.08);
}

.cfu-brand-bar__inner {
	display: flex;
	justify-content: center;
	align-items: center;
}

.cfu-brand-bar__link {
	text-decoration: none;
	display: inline-block;
}

.cfu-brand-bar__logo {
	height: clamp(36px, 5vw, 44px);
	width: auto;
	display: block;
}

.cfu-brand-bar__text {
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--cfu-brand-red);
	font-size: 1.25rem;
}

.cfu-band--light {
	background: var(--cfu-paper);
	color: var(--cfu-ink);
}

.cfu-band--light .cfu-h2,
.cfu-band--light .cfu-h3 {
	color: var(--cfu-ink);
}

.cfu-band--light .cfu-btn--ghost {
	color: var(--cfu-brand-red);
	background: transparent;
	border-color: var(--cfu-border-strong);
}

.cfu-band--light .cfu-btn--ghost:hover {
	background: var(--cfu-surface-high);
	border-color: var(--cfu-brand-red);
}

.cfu-band--heroish {
	padding-top: clamp(2.25rem, 5vw, 3.5rem);
}

.cfu-band--tight {
	padding-top: 1.5rem;
}

.cfu-split {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem 2rem;
	align-items: start;
}

@media (min-width: 860px) {
	.cfu-split {
		grid-template-columns: 1fr 1fr;
		align-items: center;
	}
}

.cfu-textlink {
	font-weight: 700;
	color: var(--cfu-brand-red);
	text-decoration: none;
	white-space: nowrap;
}

.cfu-textlink:hover {
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.cfu-page-intro .cfu-lede {
	max-width: 42rem;
}

.cfu-about-gallery {
	display: grid;
	gap: 1rem;
	margin: 0 0 2rem;
}

@media (min-width: 780px) {
	.cfu-about-gallery {
		grid-template-columns: 1fr 1fr;
	}
}

.cfu-about-gallery__fig {
	margin: 0;
}

.cfu-imgcard--about {
	border-radius: var(--cfu-radius);
}

.cfu-quote {
	margin: 1.5rem 0;
	padding: 1rem 1.25rem;
	border-left: 4px solid var(--cfu-brand-red);
	background: var(--cfu-surface);
	font-style: italic;
	color: var(--cfu-muted-ink);
}

.cfu-quote p {
	margin: 0;
}

.cfu-cards {
	display: grid;
	gap: 1rem;
}

.cfu-cards--3 {
	grid-template-columns: 1fr;
}

@media (min-width: 780px) {
	.cfu-cards--3 {
		grid-template-columns: repeat(3, 1fr);
	}
}

.cfu-cards--2 {
	grid-template-columns: 1fr;
}

@media (min-width: 780px) {
	.cfu-cards--2 {
		grid-template-columns: repeat(2, 1fr);
	}
}

.cfu-card {
	border: 1px solid var(--cfu-line-dark);
	border-radius: var(--cfu-radius);
	padding: 1rem;
	background: #fff;
	box-shadow: 0 18px 50px rgba(11, 11, 12, 0.08);
}

.cfu-btnrow {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
}

.cfu-btnrow--sm {
	margin-top: 0.75rem;
}

.cfu-mosaic {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.75rem;
}

@media (min-width: 780px) {
	.cfu-mosaic {
		grid-template-columns: repeat(3, 1fr);
	}
}

.cfu-mosaic__cell {
	min-width: 0;
}

.cfu-gallery {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.75rem;
}

@media (min-width: 720px) {
	.cfu-gallery {
		grid-template-columns: repeat(3, 1fr);
	}
}

.cfu-gallery__item {
	min-width: 0;
}

.cfu-prose p {
	margin: 0 0 1rem;
	color: var(--cfu-muted-dark);
	max-width: 70ch;
}

.cfu-list {
	margin: 1rem 0 0;
	padding-left: 1.1rem;
	color: var(--cfu-muted-dark);
}

.cfu-list a {
	color: var(--cfu-ink);
	font-weight: 650;
}

.cfu-episodes {
	display: grid;
	gap: 1rem;
}

.cfu-episode {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	border: 1px solid var(--cfu-line-dark);
	border-radius: var(--cfu-radius);
	padding: 1rem;
	background: #fff;
}

@media (min-width: 780px) {
	.cfu-episode {
		grid-template-columns: 220px 1fr;
		align-items: center;
	}
}

.cfu-episode__body {
	min-width: 0;
}

/* Image cards: stable box + grayscale → colour (no layout jump) */
.cfu-imgcard {
	display: block;
	border-radius: var(--cfu-radius-sm);
	overflow: hidden;
	border: 1px solid var(--cfu-line);
	background: var(--cfu-surface);
	position: relative;
	aspect-ratio: 4 / 3;
	transform: translateZ(0);
}

.cfu-band--light .cfu-imgcard {
	border-color: var(--cfu-line-dark);
	background: rgba(11, 11, 12, 0.04);
}

.cfu-imgcard img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: grayscale(100%) brightness(0.96);
	transition: filter 0.65s ease, transform 0.65s ease;
	will-change: filter;
}

@media (hover: hover) and (pointer: fine) {
	.cfu-imgcard:hover img,
	.cfu-imgcard:focus-within img,
	.cfu-imgcard:focus-visible img {
		filter: grayscale(0%) brightness(1.04);
		transform: scale(1.03);
	}
}

@media (hover: none), (pointer: coarse) {
	a.cfu-imgcard img {
		filter: grayscale(0);
		transform: none;
	}
}

.cfu-imgcard.cfu-touch-colour img {
	filter: grayscale(0) contrast(1);
	transform: scale(1.03);
}

.cfu-imgcard--tall {
	aspect-ratio: 3 / 4;
	min-height: clamp(280px, 42vw, 520px);
}

.cfu-imgcard--tall > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.cfu-ph {
	width: 100%;
	height: 100%;
}

.cfu-ph--a,
.cfu-ph--b,
.cfu-ph--c,
.cfu-ph--neutral {
	background: linear-gradient(145deg, #e8e4e1 0%, #d8d2ce 48%, #cfc8c4 100%);
}

.cfu-band--light .cfu-ph--a,
.cfu-band--light .cfu-ph--b,
.cfu-band--light .cfu-ph--c,
.cfu-band--light .cfu-ph--neutral {
	background: linear-gradient(145deg, #ece8e5 0%, #e0dbd7 50%, #d5cfca 100%);
}

/* Form */
.cfu-form {
	margin-top: 1rem;
	padding: 1rem 1.1rem;
	border-radius: var(--cfu-radius-sm);
	border: 1px solid var(--cfu-line-dark);
	background: #fff;
}

.cfu-form__field {
	margin: 0 0 0.85rem;
}

.cfu-form__label {
	display: block;
	font-size: 0.85rem;
	margin-bottom: 0.35rem;
	color: rgba(11, 11, 12, 0.75);
	font-weight: 650;
}

.cfu-form__input,
.cfu-form__textarea {
	width: 100%;
	padding: 0.65rem 0.75rem;
	border-radius: 12px;
	border: 1px solid var(--cfu-line-dark);
	font: inherit;
	background: #fff;
	color: var(--cfu-ink);
}

.cfu-form__input:focus-visible,
.cfu-form__textarea:focus-visible {
	outline: 2px solid color-mix(in oklab, var(--cfu-brand-red), white 10%);
	outline-offset: 2px;
	border-color: rgba(225, 29, 72, 0.45);
}

.cfu-form__notice {
	margin: 0 0 0.85rem;
	padding: 0.65rem 0.75rem;
	border-radius: 12px;
	font-size: 0.92rem;
}

.cfu-form__notice--ok {
	background: rgba(34, 197, 94, 0.12);
	border: 1px solid rgba(34, 197, 94, 0.35);
	color: #166534;
}

.cfu-form__notice--err {
	background: rgba(248, 113, 113, 0.12);
	border: 1px solid rgba(248, 113, 113, 0.35);
	color: #991b1b;
}

.cfu-form__submit-wrap {
	margin: 0;
}

@media (prefers-reduced-motion: reduce) {
	.cfu-btn,
	.cfu-imgcard img {
		transition: none;
	}

	.cfu-imgcard img {
		filter: none;
	}

	.cfu-hero__play {
		transition: none;
	}
}

/* -------------------------------------------------------------------------
   Block themes (Twenty Twenty-Four): no duplicate title, full width, hero contrast
   Only when body.cfu-colourfull-page (set by Colourfull_Ultimate_Assets::body_class).
   ------------------------------------------------------------------------- */

/* Fallback: hide theme post title if it still renders (classic + some FSE edge cases) */
body.cfu-colourfull-page .wp-block-post-title,
body.cfu-colourfull-page h1.wp-block-post-title,
body.cfu-colourfull-page .entry-header .entry-title,
body.cfu-colourfull-page .wp-block-query-title {
	display: none !important;
}

/* Full-width column: remove theme “content width” padding */
body.cfu-colourfull-page .wp-block-post-content,
body.cfu-colourfull-page .entry-content {
	max-width: none !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* TT4 outer wrappers often add padding — strip around ColourFull output only */
body.cfu-colourfull-page main .wp-block-group.alignfull,
body.cfu-colourfull-page main > .wp-block-group {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.cfu-colourfull-page .wp-block-post-content > *:has(.cfu-root),
body.cfu-colourfull-page .wp-block-post-content .cfu-root {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
	padding-block-start: 0 !important;
	padding-block-end: 0 !important;
}

body.cfu-colourfull-page .wp-block-post-content > .alignwide:has(.cfu-root),
body.cfu-colourfull-page .wp-block-post-content > .alignfull:has(.cfu-root),
body.cfu-colourfull-page .wp-block-group:has(> .cfu-root) {
	max-width: none !important;
	width: 100% !important;
	padding-inline: 0 !important;
	margin-inline: 0 !important;
}

body.cfu-colourfull-page .is-layout-constrained:has(.wp-block-post-content .cfu-root),
body.cfu-colourfull-page .wp-block-group.is-layout-constrained:has(.cfu-root) {
	max-width: none !important;
	padding-inline: 0 !important;
}

body.cfu-colourfull-page main .wp-block-group__inner-container:has(.cfu-root),
body.cfu-colourfull-page .wp-block-post-content:has(.cfu-root) {
	max-width: none !important;
	padding-inline: 0 !important;
}

/* Site chrome: let first screenful be plugin (optional top padding kill on main) */
body.cfu-theme-twentytwentyfour.cfu-colourfull-page main.wp-block-group {
	padding-top: 0 !important;
}

/* Full editorial canvas behind TT4 */
body.cfu-editorial-light.cfu-colourfull-page {
	background-color: #fcf9f8 !important;
}

/* Full-bleed sections inside plugin root */
body.cfu-colourfull-page .cfu-root .cfu-band {
	width: 100%;
	margin-inline: 0;
}

body.cfu-colourfull-page .cfu-root .cfu-hero__grid,
body.cfu-colourfull-page .cfu-root .cfu-wrap {
	max-width: min(100% - 2rem, var(--cfu-max));
}

body.cfu-colourfull-page .cfu-root .cfu-hero {
	position: relative;
	z-index: 1;
}

/* Beat TT4 theme.json — light editorial (titles red, body muted) */
body.cfu-colourfull-page .cfu-root .cfu-page-intro .cfu-display,
body.cfu-colourfull-page .cfu-root .cfu-page-intro .cfu-display--sm,
body.cfu-colourfull-page .cfu-root .cfu-hero--editorial .cfu-display,
body.cfu-colourfull-page .cfu-root .cfu-hero--editorial .cfu-hero__title {
	color: var(--cfu-brand-red) !important;
}

body.cfu-colourfull-page .cfu-root .cfu-page-intro .cfu-lede,
body.cfu-colourfull-page .cfu-root .cfu-hero--editorial .cfu-lede,
body.cfu-colourfull-page .cfu-root .cfu-hero--editorial .cfu-hero__about {
	color: rgba(92, 64, 59, 0.92) !important;
}

body.cfu-colourfull-page .cfu-root .cfu-hero--editorial .cfu-hero__subtitle {
	color: rgba(92, 64, 59, 0.78) !important;
}

body.cfu-colourfull-page .cfu-root .cfu-band .cfu-h2,
body.cfu-colourfull-page .cfu-root .cfu-band .cfu-h3 {
	color: var(--cfu-ink) !important;
}

body.cfu-colourfull-page .cfu-root .cfu-band .cfu-muted {
	color: rgba(92, 64, 59, 0.9) !important;
}

body.cfu-colourfull-page .cfu-root .cfu-kicker {
	color: var(--cfu-brand-red) !important;
}

body.cfu-colourfull-page .cfu-root .cfu-btn--primary {
	box-shadow: 0 4px 14px rgba(181, 12, 8, 0.28);
}

body.cfu-colourfull-page .cfu-root .cfu-imgcard img {
	filter: grayscale(100%) brightness(0.96);
}

body.cfu-colourfull-page .cfu-root .cfu-hero__media .cfu-hero__image,
body.cfu-colourfull-page .cfu-root .cfu-hero__visual .cfu-imgcard--hero img {
	object-position: center 20% !important;
}

@media (hover: hover) and (pointer: fine) {
	body.cfu-colourfull-page .cfu-root .cfu-imgcard:hover img,
	body.cfu-colourfull-page .cfu-root .cfu-imgcard:focus-within img {
		filter: grayscale(0%) brightness(1.04);
	}
}