/*
Theme Name:   Hope Channel
Theme URI:    https://hopetv.bg
Description:  Hope Channel Bulgaria — block child theme of Twenty Twenty-Five. Design system „Афиш": dark by default with a light variant, Unbounded (display) + Golos Text (body), blue/yellow/red tiles.
Author:       Hope Channel Bulgaria
Template:     twentytwentyfive
Version:      0.4.0
Requires at least: 6.7
Requires PHP: 8.1
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  hopechannel
*/

/* =============================================================
 * 0. Tokens — dark is the default; light swaps only the base.
 *    Blue, yellow and red tiles keep the same colours in both.
 * ============================================================= */
:root {
	--hc-bg: #0a1220;
	--hc-card: #111a2e;
	--hc-card2: #1a2540;
	--hc-sheet: #141f36;
	--hc-ink: #ffffff;
	--hc-ink2: rgba(255, 255, 255, .75);
	--hc-ink3: rgba(255, 255, 255, .58);
	--hc-line: rgba(255, 255, 255, .1);
	--hc-line2: rgba(255, 255, 255, .2);
	--hc-chip: rgba(255, 255, 255, .08);
	--hc-chip2: rgba(255, 255, 255, .16);
	--hc-hdr: rgba(10, 18, 32, .88);
	--hc-inv: #ffffff;
	--hc-inv-ink: #0a1220;
	--hc-accent-ink: #ffd133;
	--hc-focus: #ffd133;
	--hc-field: rgba(255, 255, 255, .04);
	--hc-sk: rgba(255, 255, 255, .06);
	--hc-sk2: rgba(255, 255, 255, .13);

	/* Footer is ink (dark) in both themes. */
	--hc-ft-bg: #050a14;
	--hc-ft-ink: #ffffff;
	--hc-ft-ink2: rgba(255, 255, 255, .75);
	--hc-ft-hi: #ffd133;
	--hc-ft-line: rgba(255, 255, 255, .12);
	--hc-ft-edge: rgba(255, 255, 255, .08);

	/* Brand tiles keep the same colours in both themes. */
	--hc-blue: #0b4da2;
	--hc-blue-deep: #083a7a;
	--hc-yellow: #ffd133;
	--hc-yellow-hover: #ffdc5c;
	--hc-red: #ff2d2d;
	--hc-red-hover: #e61e1e;
	--hc-red-text: #ff5c5c;
	--hc-red-soft: #ff6b6b;
	--hc-navy: #0a1220;

	--hc-font-display: Unbounded, system-ui, sans-serif;
	--hc-font-body: 'Golos Text', system-ui, sans-serif;
	--hc-ease: cubic-bezier(.2, .8, .2, 1);
	--hc-gutter: clamp(16px, 3vw, 32px);
	--hc-maxw: 1280px;
	--hc-maxw-wide: 1344px;
	--hc-maxw-episode: 1200px;
	--hc-maxw-narrow: 1080px;
	--hc-maxw-text: 860px;
	--hc-tabbar-space: 0px;
}

:root[data-theme="light"] {
	--hc-bg: #ffffff;
	--hc-card: #eef1f6;
	--hc-card2: #e2e7ef;
	--hc-sheet: #ffffff;
	--hc-ink: #0a1220;
	--hc-ink2: rgba(10, 18, 32, .74);
	--hc-ink3: rgba(10, 18, 32, .6);
	--hc-line: rgba(10, 18, 32, .1);
	--hc-line2: rgba(10, 18, 32, .2);
	--hc-chip: rgba(10, 18, 32, .06);
	--hc-chip2: rgba(10, 18, 32, .12);
	--hc-hdr: rgba(255, 255, 255, .9);
	--hc-inv: #0a1220;
	--hc-inv-ink: #ffffff;
	--hc-accent-ink: #0b4da2;
	--hc-focus: #0b4da2;
	--hc-field: #ffffff;
	--hc-sk: rgba(10, 18, 32, .06);
	--hc-sk2: rgba(10, 18, 32, .12);
}

/* =============================================================
 * 1. Base
 * ============================================================= */
html { scroll-behavior: smooth; }

body {
	margin: 0;
	background: var(--hc-bg);
	color: var(--hc-ink);
	font-family: var(--hc-font-body);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	transition: background .2s, color .2s;
}

.wp-site-blocks { min-height: 100vh; display: flex; flex-direction: column; }
.wp-site-blocks > * { margin-block-start: 0; }
.wp-site-blocks > main,
.wp-site-blocks > .hc-main { flex: 1 0 auto; min-height: 70vh; }

/* neutralise parent constrained-layout paddings/margins on our wrappers */
.wp-site-blocks .hc-main,
.wp-site-blocks .hc-main.is-layout-constrained > * { max-width: none; margin-left: 0 !important; margin-right: 0 !important; }
.wp-site-blocks .hc-main > * + * { margin-block-start: 0; }
.hc-main.has-global-padding { padding-left: 0; padding-right: 0; }

a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
a:hover { color: var(--hc-yellow); }
:root[data-theme="light"] a:hover { color: var(--hc-blue); }

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

input, select, textarea, button { font: inherit; color: inherit; }

/* No focus rings anywhere (Kris, 2026-09-30; same decision as aiq and tundra): nothing draws an
 * outline or a ring on click, tap or keyboard focus. Form fields keep their coloured border on focus.
 * !important because core blocks and the parent theme set their own outlines and box-shadows. */
:is(a, button, input, select, textarea, summary, video, iframe, [tabindex], [role="button"], .wp-element-button, .wp-block-button__link, .wp-block-navigation-item__content):is(:focus, :focus-visible, :focus-within, :active) {
	outline: none !important;
	outline-offset: 0 !important;
}
:is(a, button, summary, [tabindex], [role="button"], .wp-element-button, .wp-block-button__link, .wp-block-navigation-item__content):is(:focus, :focus-visible, :active) {
	box-shadow: none !important;
}
* { -webkit-tap-highlight-color: transparent; }

::selection { background: var(--hc-yellow); color: var(--hc-navy); }

@keyframes hc-pulse {
	0%, 100% { transform: scale(1); opacity: 1; }
	50% { transform: scale(1.6); opacity: .35; }
}
@keyframes hc-sk {
	0% { background-position: 100% 0; }
	100% { background-position: -100% 0; }
}
@keyframes hc-prog {
	from { width: 2%; }
	to { width: 100%; }
}

/* No prefers-reduced-motion rules anywhere in the theme (Kris, 2026-09-30; same as aiq and tundra):
 * his Mac has Reduce Motion on, which silently switched every transition and the slider off. */

/* =============================================================
 * 2. Shared helpers
 * ============================================================= */
.hc-container {
	max-width: var(--hc-maxw);
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: var(--hc-gutter);
	padding-right: var(--hc-gutter);
	box-sizing: border-box;
	width: 100%;
}
.hc-container--wide { max-width: var(--hc-maxw-wide); }
.hc-container--episode { max-width: var(--hc-maxw-episode); }
.hc-container--narrow { max-width: var(--hc-maxw-narrow); }
.hc-container--text { max-width: var(--hc-maxw-text); }

.hc-display {
	font-family: var(--hc-font-display);
	text-transform: uppercase;
	letter-spacing: -.02em;
}

.hc-label {
	font-weight: 800;
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.hc-label--accent { color: var(--hc-accent-ink); }
.hc-label--muted { color: var(--hc-ink3); }
.hc-label--lg { font-size: 12px; letter-spacing: .1em; }

.hc-tnum { font-variant-numeric: tabular-nums; }

.hc-clamp-1, .hc-clamp-2, .hc-clamp-3 {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.hc-clamp-1 { -webkit-line-clamp: 1; }
.hc-clamp-2 { -webkit-line-clamp: 2; }
.hc-clamp-3 { -webkit-line-clamp: 3; }

.hc-nowrap { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.hc-stack { display: flex; flex-direction: column; }

.hc-screen { padding-top: 24px; padding-bottom: 8px; display: flex; flex-direction: column; }
.hc-screen--home { padding-top: 0; }
.hc-sections { display: flex; flex-direction: column; gap: 44px; padding-top: 36px; }

.hc-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--hc-red);
	animation: hc-pulse 1.4s ease-in-out infinite;
	flex: none;
}
.hc-dot--white { background: #fff; }
.hc-dot--sm { width: 6px; height: 6px; }
.hc-dot--xs { width: 5px; height: 5px; }
.hc-dot--static { animation: none; }

/* Play triangle (CSS-only) */
.hc-play {
	flex: none;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--hc-yellow);
	display: grid;
	place-items: center;
}
.hc-play::after {
	content: "";
	width: 0;
	height: 0;
	border-left: 18px solid var(--hc-navy);
	border-top: 11px solid transparent;
	border-bottom: 11px solid transparent;
	margin-left: 4px;
}
.hc-play--md { width: 52px; height: 52px; }
.hc-play--md::after { border-left-width: 15px; border-top-width: 9px; border-bottom-width: 9px; margin-left: 3px; }
.hc-play--sm { width: 48px; height: 48px; }
.hc-play--sm::after { border-left-width: 14px; border-top-width: 9px; border-bottom-width: 9px; margin-left: 3px; }
.hc-play--lg { width: clamp(64px, 8vw, 88px); height: clamp(64px, 8vw, 88px); box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.hc-play--lg::after { border-left-width: 24px; border-top-width: 15px; border-bottom-width: 15px; margin-left: 6px; }

/* =============================================================
 * 3. Media thumbnails
 * ============================================================= */
.hc-thumb {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	border-radius: 8px;
	overflow: hidden;
	background: var(--hc-blue);
	flex: none;
}
.hc-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hc-thumb--r10 { border-radius: 10px; }
.hc-thumb--r12 { border-radius: 12px; }
.hc-thumb--r14 { border-radius: 14px; }
.hc-thumb--r16 { border-radius: 16px; }
.hc-thumb--r20 { border-radius: 20px; }
.hc-thumb--r22 { border-radius: clamp(14px, 2vw, 22px); }
.hc-thumb--4x3 { aspect-ratio: 4 / 3; }
.hc-thumb--16x10 { aspect-ratio: 16 / 10; }

.hc-thumb__tag { position: absolute; left: 8px; top: 8px; z-index: 2; }
.hc-thumb__tag--sm { left: 6px; top: 6px; font-size: 10px; padding: 2px 6px; }

.hc-thumb__fallback {
	position: absolute;
	inset: 0;
	padding: 12px;
	display: flex;
	align-items: flex-end;
	font-family: var(--hc-font-display);
	font-weight: 800;
	font-size: 12px;
	line-height: 1.05;
	text-transform: uppercase;
	color: #fff;
	background: linear-gradient(135deg, var(--hc-blue), var(--hc-blue-deep));
	overflow: hidden;
}
.hc-thumb__fallback--lg {
	font-size: clamp(22px, 4.4vw, 52px);
	padding: clamp(20px, 4vw, 48px);
	letter-spacing: -.02em;
	line-height: 1;
	background: linear-gradient(135deg, var(--hc-blue) 0%, var(--hc-blue-deep) 55%, var(--hc-navy) 100%);
}
.hc-thumb__fallback--sm { font-size: 9px; padding: 8px; }

.hc-thumb__progress {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4px;
	background: rgba(255, 255, 255, .25);
	z-index: 3;
}
.hc-thumb__progress > span { display: block; height: 100%; background: var(--hc-yellow); width: 0; }

.hc-thumb__play {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	pointer-events: none;
	z-index: 2;
}

/* =============================================================
 * 4. Shared kit: section heads, buttons, chips, tags, cards, rails
 * ============================================================= */
.hc-section { display: flex; flex-direction: column; gap: 16px; min-width: 0; }

.hc-section-head { display: flex; align-items: center; gap: 14px; min-width: 0; }
.hc-section-head h2 {
	margin: 0;
	font-family: var(--hc-font-display);
	font-weight: 700;
	font-size: clamp(15px, 1.6vw, 18px);
	text-transform: uppercase;
	line-height: 1.2;
	flex: none;
}
.hc-section-head__rule { flex: 1; height: 2px; background: var(--hc-line); min-width: 12px; }
.hc-section-head__link {
	flex: none;
	font-size: 13px;
	font-weight: 700;
	color: var(--hc-accent-ink);
	text-decoration: none;
	white-space: nowrap;
}
.hc-section-head__link:hover { color: var(--hc-accent-ink); text-decoration: underline; }
.hc-section-head__count { font-size: 14px; color: var(--hc-ink3); }

.hc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 50px;
	padding: 0 22px;
	border: 0;
	border-radius: 999px;
	background: var(--hc-yellow);
	color: var(--hc-navy);
	font-weight: 800;
	font-size: 15px;
	text-decoration: none;
	cursor: pointer;
	white-space: nowrap;
	transition: background .15s, border-color .15s, color .15s;
}
.hc-btn:hover { background: var(--hc-yellow-hover); color: var(--hc-navy); }
.hc-btn--outline {
	background: transparent;
	border: 2px solid var(--hc-line2);
	color: var(--hc-ink);
	font-weight: 700;
	font-size: 14px;
	padding: 0 20px;
}
.hc-btn--outline:hover { background: transparent; border-color: var(--hc-ink); color: var(--hc-ink); }
.hc-btn--outline-light { border-color: rgba(255, 255, 255, .45); color: #fff; }
.hc-btn--outline-light:hover { border-color: #fff; color: #fff; }
.hc-btn--inv { background: var(--hc-inv); color: var(--hc-inv-ink); }
.hc-btn--inv:hover { background: var(--hc-inv); color: var(--hc-inv-ink); opacity: .88; }
.hc-btn--red { background: var(--hc-red); color: #fff; }
.hc-btn--red:hover { background: var(--hc-red-hover); color: #fff; }
.hc-btn--sm { height: 42px; padding: 0 16px; font-size: 13px; font-weight: 700; }
.hc-btn--md { height: 46px; padding: 0 20px; font-size: 14px; }
.hc-btn--square { border-radius: 14px; }
.hc-btn--block { width: 100%; }

.hc-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 38px;
	padding: 0 14px;
	border: 0;
	border-radius: 999px;
	background: var(--hc-chip);
	color: var(--hc-ink);
	font-weight: 700;
	font-size: 13px;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	flex: none;
	transition: background .15s, color .15s;
}
.hc-chip:hover { background: var(--hc-chip2); color: var(--hc-ink); }
.hc-chip.is-active { background: var(--hc-inv); color: var(--hc-inv-ink); }
.hc-chip__count { font-size: 11px; opacity: .6; }
.hc-chip--tall { height: 40px; padding: 0 16px; font-size: 14px; }
.hc-chip--tag {
	height: auto;
	padding: 5px 10px;
	border-radius: 8px;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: default;
}
.hc-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.hc-chips--scroll { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }

.hc-tag {
	display: inline-block;
	padding: 3px 7px;
	border-radius: 5px;
	background: var(--hc-yellow);
	color: var(--hc-navy);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	line-height: 1.3;
}
.hc-tag--white { background: rgba(255, 255, 255, .9); }
.hc-tag--glass { background: rgba(10, 18, 32, .6); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font-weight: 700; color: #fff; }
.hc-tag--red { background: var(--hc-red); color: #fff; }
.hc-tag--lg { padding: 6px 11px; border-radius: 8px; font-size: 11px; letter-spacing: .08em; }

.hc-card {
	display: flex;
	flex-direction: column;
	gap: 9px;
	padding: 8px;
	border-radius: 14px;
	background: var(--hc-card);
	color: var(--hc-ink);
	text-decoration: none;
	transition: transform .22s var(--hc-ease), background .22s;
	min-width: 0;
}
.hc-card:hover { transform: translateY(-3px); background: var(--hc-card2); color: var(--hc-ink); }
.hc-card__body { display: flex; flex-direction: column; gap: 3px; padding: 0 4px 4px; min-width: 0; }
.hc-card__title { font-size: 13px; font-weight: 700; line-height: 1.3; }
.hc-card__meta { font-size: 11px; color: var(--hc-ink3); }
.hc-card--ring { outline: 2px solid var(--hc-yellow); outline-offset: -2px; }

.hc-showcard { display: flex; flex-direction: column; gap: 10px; color: var(--hc-ink); text-decoration: none; min-width: 0; transition: transform .15s; }
.hc-showcard:hover { transform: translateY(-3px); color: var(--hc-ink); }
.hc-showcard .hc-thumb { border-radius: 14px; background: var(--hc-card); }
.hc-showcard__title { font-size: 15px; font-weight: 700; line-height: 1.25; }
.hc-showcard__meta { font-size: 12px; color: var(--hc-ink3); }
.hc-showcard--sm .hc-showcard__title { font-size: 14px; }

.hc-newscard { display: flex; flex-direction: column; gap: 12px; color: var(--hc-ink); text-decoration: none; min-width: 0; transition: transform .22s var(--hc-ease); }
.hc-newscard:hover { transform: translateY(-3px); color: var(--hc-ink); }
.hc-newscard .hc-thumb { border-radius: 16px; background: var(--hc-card); }
.hc-newscard__date { font-size: 12px; font-weight: 700; color: var(--hc-ink3); }
.hc-newscard__title { font-size: 18px; font-weight: 700; line-height: 1.28; text-wrap: pretty; }
.hc-newscard__excerpt { font-size: 14px; line-height: 1.5; color: var(--hc-ink2); }
.hc-newscard--row { flex-direction: row; align-items: center; gap: 14px; padding: 8px; border-radius: 16px; background: var(--hc-card); }
.hc-newscard--row:hover { transform: none; background: var(--hc-card2); }
.hc-newscard--row .hc-thumb { width: clamp(96px, 11vw, 128px); border-radius: 10px; }
.hc-newscard--row .hc-newscard__title { font-size: 14px; }

.hc-row {
	display: grid;
	grid-template-columns: clamp(120px, 22vw, 240px) minmax(0, 1fr);
	gap: clamp(12px, 2vw, 20px);
	align-items: center;
	padding: 8px;
	border-radius: 16px;
	color: var(--hc-ink);
	text-decoration: none;
	transition: background .15s;
	min-width: 0;
}
.hc-row:hover { background: var(--hc-card); color: var(--hc-ink); }
.hc-row .hc-thumb { border-radius: 10px; }
.hc-row__body { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.hc-row__meta { font-size: 12px; font-weight: 700; color: var(--hc-ink3); }
.hc-row__title { font-family: var(--hc-font-display); font-weight: 700; font-size: clamp(14px, 1.6vw, 18px); line-height: 1.2; }
.hc-row__desc { font-size: 14px; line-height: 1.5; color: var(--hc-ink2); max-width: 760px; }
.hc-row--compact { grid-template-columns: 88px minmax(0, 1fr); gap: 12px; border-radius: 12px; }
.hc-row--compact .hc-thumb { border-radius: 8px; }
.hc-row--compact .hc-row__title { font-family: var(--hc-font-body); font-size: 13px; line-height: 1.25; }
.hc-row--compact.is-current { background: var(--hc-card2); }
.hc-row--search { grid-template-columns: clamp(96px, 16vw, 150px) minmax(0, 1fr); gap: 14px; border-radius: 14px; }
.hc-row--search .hc-row__title { font-family: var(--hc-font-body); font-size: 15px; line-height: 1.3; }
@media (max-width: 959px) { .hc-row__desc { display: none; } }

.hc-rail {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: max(170px, calc((100% - 56px) / 5));
	gap: 14px;
	overflow-x: auto;
	padding-bottom: 4px;
	scrollbar-width: thin;
	scroll-snap-type: x proximity;
}
.hc-rail > * { scroll-snap-align: start; min-width: 0; }
.hc-rail--4 { grid-auto-columns: max(170px, calc((100% - 42px) / 4)); }
.hc-rail--shows { grid-auto-columns: max(170px, calc((100% - 56px) / 5)); }
.hc-rail--camps { grid-auto-columns: max(220px, calc((100% - 42px) / 4)); }

.hc-grid { display: grid; gap: 22px 14px; }
.hc-grid--shows { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.hc-grid--cards { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.hc-grid--news { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 22px 16px; }
.hc-grid--today { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.hc-grid--topics { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 1099px) { .hc-grid--topics { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 519px)  { .hc-grid--topics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.hc-empty {
	padding: clamp(36px, 5vw, 48px) 24px;
	border-radius: 20px;
	background: var(--hc-card);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	text-align: center;
}
.hc-empty__title { font-family: var(--hc-font-display); font-weight: 700; font-size: clamp(17px, 2.4vw, 24px); text-transform: uppercase; line-height: 1.1; }
.hc-empty p { margin: 0; font-size: 14px; color: var(--hc-ink2); }
.hc-empty__actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }

.hc-crumbs { display: flex; gap: 8px; flex-wrap: wrap; font-size: 13px; font-weight: 600; color: var(--hc-ink3); }
.hc-crumbs a { color: inherit; text-decoration: none; }
.hc-crumbs a:hover { color: var(--hc-ink); }
.hc-crumbs [aria-current="page"] { color: var(--hc-ink); }

.hc-page-title {
	margin: 0;
	font-family: var(--hc-font-display);
	font-weight: 800;
	font-size: clamp(30px, 5vw, 56px);
	line-height: .95;
	letter-spacing: -.03em;
	text-transform: uppercase;
}

.hc-pagination { display: flex; justify-content: center; gap: 6px; flex-wrap: wrap; font-weight: 800; font-size: 14px; }
.hc-pagination .page-numbers {
	min-width: 42px;
	height: 42px;
	padding: 0 12px;
	border-radius: 12px;
	display: grid;
	place-items: center;
	background: var(--hc-chip);
	color: var(--hc-ink);
	text-decoration: none;
	box-sizing: border-box;
}
.hc-pagination a.page-numbers:hover { background: var(--hc-chip2); color: var(--hc-ink); }
.hc-pagination .page-numbers.current { background: var(--hc-yellow); color: var(--hc-navy); }
.hc-pagination .page-numbers.dots { background: transparent; }

/* =============================================================
 * 4b. The kit on core blocks
 *     Same look as section 4, for markup that Gutenberg writes:
 *     Query Loop lists, Group cards, Heading / Paragraph / Button
 *     blocks. Class names go in a block's "Additional CSS class(es)".
 * ============================================================= */

/* Page rhythm: full-width bands, 44px apart; one-off gaps are Spacer blocks. */
.wp-block-post-content > .wp-block-group.hc-section,
main > .wp-block-group.hc-section { margin-top: var(--wp--preset--spacing--60); margin-bottom: 0; }
/* Constrained layout centres children with auto margins, which a flex column would shrink-wrap: bands are plain blocks. */
.wp-block-group.hc-section { display: block; }
.wp-block-group.hc-section > * { margin-block: 0; }
.wp-block-group.hc-section > * + * { margin-top: 16px; }
.wp-block-group.hc-section > .wp-block-spacer { margin-top: 0; }
.wp-block-group.hc-section > .wp-block-spacer + * { margin-top: 0; }
/* Same selectors as the 44px rule above, plus the modifier: a bare class lost to it on specificity. */
.wp-block-post-content > .wp-block-group.hc-section.hc-section--first,
main > .wp-block-group.hc-section.hc-section--first { margin-top: 24px; }
.wp-block-post-content > .wp-block-group.hc-section.hc-section--flush,
main > .wp-block-group.hc-section.hc-section--flush { margin-top: 0; }

/* Section heading row: Heading + Separator (.hc-section-head__rule) + link paragraph. */
.wp-block-group.hc-section-head { flex-wrap: nowrap; gap: 14px; }
.hc-section-head > * { margin: 0; }
.hc-section-head > :is(h2, h3).wp-block-heading {
	font-family: var(--hc-font-display);
	font-weight: 700;
	font-size: clamp(15px, 1.6vw, 18px);
	text-transform: uppercase;
	letter-spacing: 0;
	line-height: 1.2;
	flex: none;
	max-width: 70%;
}
hr.wp-block-separator.hc-section-head__rule {
	flex: 1;
	width: auto;
	max-width: none;
	min-width: 12px;
	height: 2px;
	margin: 0;
	border: 0;
	background: var(--hc-line);
	opacity: 1;
}
p.hc-section-head__link a { color: inherit; text-decoration: none; }
p.hc-section-head__link a:hover { text-decoration: underline; }

/* Query Loop / Terms Query lists used as rails and grids. */
ul:is(.hc-rail, .hc-grid, .hc-list),
.wp-block-post-template:is(.hc-rail, .hc-grid, .hc-list) { list-style: none; margin: 0; padding: 0; }
:is(.hc-rail, .hc-grid, .hc-list) > li { margin: 0; min-width: 0; }
.hc-rail > li > .wp-block-group,
.hc-grid > li > .wp-block-group { height: 100%; box-sizing: border-box; }
.hc-list { display: flex; flex-direction: column; gap: 4px; }

/* Featured image as thumbnail. */
figure.hc-thumb { margin: 0; }
.hc-thumb > a { display: block; width: 100%; height: 100%; }
.hc-thumb.wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; }

/* Cards (Group blocks). The title link covers the whole card. */
.wp-block-group:is(.hc-card, .hc-newscard, .hc-showcard, .hc-row) { position: relative; }
:is(.hc-card, .hc-card__body, .hc-newscard, .hc-showcard, .hc-row, .hc-row__body) > * { margin-block: 0; }
.hc-card > p.hc-thumb__tag { position: absolute; left: 16px; top: 16px; z-index: 2; pointer-events: none; }
.hc-row > p.hc-thumb__tag { position: absolute; left: 14px; top: 14px; z-index: 2; pointer-events: none; }
:is(h2, h3, h4):is(.hc-card__title, .hc-newscard__title, .hc-showcard__title, .hc-row__title) {
	margin: 0;
	text-transform: none;
	letter-spacing: 0;
	color: inherit;
}
:is(h2, h3, h4):is(.hc-card__title, .hc-newscard__title, .hc-showcard__title) { font-family: var(--hc-font-body); }
h3.hc-card__title,
h3.hc-newscard__title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}
h3.hc-newscard__title { -webkit-line-clamp: 3; }
:is(.hc-card__title, .hc-newscard__title, .hc-showcard__title, .hc-row__title) a { color: inherit; text-decoration: none; }
:is(.hc-card__title, .hc-newscard__title, .hc-showcard__title, .hc-row__title) a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
:is(.hc-card__title, .hc-newscard__title, .hc-showcard__title, .hc-row__title) a:hover { color: inherit; }
.hc-card__meta.wp-block-post-date,
.hc-newscard__date.wp-block-post-date { margin: 0; }
.hc-newscard__excerpt .wp-block-post-excerpt__excerpt { margin: 0; }
.hc-newscard__excerpt .wp-block-post-excerpt__more-text { display: none; }

/* Buttons: block styles of core/button. Default = yellow pill (theme.json). */
.wp-block-button .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 50px;
	padding: 0 22px;
	box-sizing: border-box;
	font-weight: 800;
	font-size: 15px;
	line-height: 1.2;
	text-decoration: none;
	transition: background .15s, border-color .15s, color .15s, opacity .15s;
}
/* The site-wide link hover colour must never reach a button: every state names its own text colour. */
.wp-block-button .wp-block-button__link:is(:hover, :focus, :active),
.wp-element-button:is(:hover, :focus, :active) { background: var(--hc-yellow-hover); color: var(--hc-navy); }
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline-light .wp-block-button__link {
	background: transparent;
	border: 2px solid var(--hc-line2);
	color: var(--hc-ink);
	font-weight: 700;
	font-size: 14px;
	padding: 0 20px;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: transparent; border-color: var(--hc-ink); color: var(--hc-ink); }
.wp-block-button.is-style-outline-light .wp-block-button__link { border-color: rgba(255, 255, 255, .45); color: #fff; }
.wp-block-button.is-style-outline-light .wp-block-button__link:hover { background: transparent; border-color: #fff; color: #fff; }
.wp-block-button.is-style-inv .wp-block-button__link { background: var(--hc-inv); color: var(--hc-inv-ink); }
.wp-block-button.is-style-inv .wp-block-button__link:hover { background: var(--hc-inv); color: var(--hc-inv-ink); opacity: .88; }
.wp-block-button.is-style-live .wp-block-button__link { background: var(--hc-red); color: #fff; }
.wp-block-button.is-style-live .wp-block-button__link:hover { background: var(--hc-red-hover); color: #fff; }
.wp-block-button.is-style-live .wp-block-button__link::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #fff;
	animation: hc-pulse 1.4s ease-in-out infinite;
}
.wp-block-button.is-style-chip .wp-block-button__link {
	min-height: 38px;
	padding: 0 14px;
	background: var(--hc-chip);
	color: var(--hc-ink);
	font-weight: 700;
	font-size: 13px;
}
.wp-block-button.is-style-chip .wp-block-button__link:hover { background: var(--hc-chip2); color: var(--hc-ink); }
.wp-block-button.is-style-chip.is-active .wp-block-button__link,
.wp-block-button.is-style-chip .wp-block-button__link[aria-current] { background: var(--hc-inv); color: var(--hc-inv-ink); }
/* The size classes of section 4 also match the Button block wrapper: only the link is the button. */
.wp-block-button:is(.hc-btn--sm, .hc-btn--md, .hc-btn--square, .hc-btn--block) { height: auto; padding: 0; background: none; border-radius: 0; }
.wp-block-button.hc-btn--sm .wp-block-button__link { min-height: 42px; padding: 0 16px; font-size: 13px; font-weight: 700; }
.wp-block-button.hc-btn--md .wp-block-button__link { min-height: 46px; padding: 0 20px; font-size: 14px; }
.wp-block-button.hc-btn--square .wp-block-button__link { border-radius: 14px; }
.wp-block-buttons.hc-chips { gap: 8px; }

/* Bound blocks (duration, show…) with no value print an empty element. */
:is(p, h2, h3, h4)[class*="hc-"]:empty { display: none; }

/* Labels, page titles, prose as block classes. */
p.hc-label, p.hc-tag { margin: 0; }
/* margin-block only: constrained layout centres the title with auto side margins. */
:is(h1, h2).hc-page-title { margin-block: 0; }
.wp-block-post-content.hc-prose > *,
.wp-block-group.hc-prose > * { margin-block: 0; }

/* Core pagination in the kit's look. */
.wp-block-query-pagination.hc-pagination { margin-top: var(--wp--preset--spacing--60); gap: 6px; }
.wp-block-query-pagination.hc-pagination :is(.page-numbers, .wp-block-query-pagination-previous, .wp-block-query-pagination-next) {
	min-width: 42px;
	height: 42px;
	padding: 0 12px;
	margin: 0;
	border-radius: 12px;
	display: inline-grid;
	place-items: center;
	background: var(--hc-chip);
	color: var(--hc-ink);
	text-decoration: none;
	box-sizing: border-box;
}
.wp-block-query-pagination.hc-pagination .wp-block-query-pagination-numbers { display: flex; gap: 6px; flex-wrap: wrap; }
.wp-block-query-pagination.hc-pagination .page-numbers.current { background: var(--hc-yellow); color: var(--hc-navy); }
.wp-block-query-pagination.hc-pagination .page-numbers.dots { background: transparent; }

/* Video player block (hopetv/episode-player). */
.hc-player { position: relative; aspect-ratio: 16 / 9; border-radius: clamp(14px, 2vw, 22px); overflow: hidden; background: #000; }
.hc-player video { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

/* =============================================================
 * 5. Header
 * ============================================================= */
.hc-header {
	position: sticky;
	top: 0;
	z-index: 30;
	background: var(--hc-hdr);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid var(--hc-line);
}
.admin-bar .hc-header { top: var(--wp-admin--admin-bar--height, 32px); }

.hc-header__inner {
	max-width: var(--hc-maxw-wide);
	margin: 0 auto;
	padding: 12px var(--hc-gutter);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	box-sizing: border-box;
}
.hc-header__left { display: flex; align-items: center; gap: 28px; min-width: 0; }
.hc-header__right { display: flex; align-items: center; gap: 8px; flex: none; }

/* No `flex` shorthand here: it would reset the flex-basis that the editor width sets. */
:where(.hc-logo) { flex-basis: 275px; }
.hc-logo { flex-grow: 0; flex-shrink: 0; min-width: 0; display: block; line-height: 0; text-decoration: none; }
/* The logo takes the width set on the Image block in the editor (Dimensions → Width). */
.hc-logo img { width: 100%; height: auto; display: block; }
/* One logo block = one size to set in the editor. The block holds the white logo (dark theme);
 * the light theme swaps in the colour one. Both files are 1302x370, so nothing moves. */
/* Own compositing layer: the header behind it is blurred and sticky, and Chrome could leave the
 * logo unpainted after a navigation until a hover forced a repaint. */
.hc-logo img { aspect-ratio: 1302 / 370; transform: translateZ(0); backface-visibility: hidden; }
:root[data-theme="light"] .hc-logo img { content: url("assets/img/logo-color.webp"); }

.hc-nav {
	display: flex;
	gap: 4px;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .04em;
}
.hc-nav a {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	padding: 9px clamp(9px, 1.1vw, 14px);
	border-radius: 999px;
	color: var(--hc-ink2);
	text-decoration: none;
	transition: background .15s, color .15s;
}
.hc-nav a:hover { color: var(--hc-ink); }
.hc-nav a[aria-current="page"],
.hc-nav a.is-active { background: var(--hc-inv); color: var(--hc-inv-ink); }

.hc-iconbtn {
	width: 40px;
	height: 40px;
	border: 0;
	border-radius: 12px;
	background: var(--hc-chip);
	color: var(--hc-ink);
	display: grid;
	place-items: center;
	cursor: pointer;
	text-decoration: none;
	flex: none;
	transition: background .15s;
}
.hc-iconbtn:hover { background: var(--hc-chip2); color: var(--hc-ink); }
.hc-iconbtn svg { display: block; }

.hc-theme-toggle__sun { display: grid; }
.hc-theme-toggle__moon { display: none; }
:root[data-theme="light"] .hc-theme-toggle__sun { display: none; }
:root[data-theme="light"] .hc-theme-toggle__moon { display: grid; }

.hc-live-btn {
	white-space: nowrap;
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	height: 40px;
	padding: 0 15px;
	border: 0;
	border-radius: 12px;
	background: var(--hc-red);
	color: #fff;
	font-weight: 800;
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background .15s;
}
.hc-live-btn:hover { background: var(--hc-red-hover); color: #fff; }
.hc-live-btn__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #fff;
	animation: hc-pulse 1.4s ease-in-out infinite;
}

@media (max-width: 959px) {
	.hc-nav,
	.hc-header .hc-theme-toggle { display: none; }
}

/* =============================================================
 * 6. Mobile tab bar (sticky bottom, < 960px)
 * ============================================================= */
.hc-tabbar-wrap { display: none; }

@media (max-width: 959px) {
	.hc-tabbar-wrap {
		display: block;
		position: sticky;
		bottom: 0;
		z-index: 40;
		padding: 0 10px 10px;
	}
	body { padding-bottom: 0; }
}

.hc-tabbar {
	position: relative;
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	padding: 6px;
	border-radius: 22px;
	background: var(--hc-sheet);
	box-shadow: 0 -4px 24px rgba(0, 0, 0, .25);
	font-size: 10px;
	font-weight: 800;
	text-align: center;
}
.hc-tabbar a,
.hc-tabbar button {
	min-height: 52px;
	border: 0;
	border-radius: 16px;
	background: transparent;
	color: var(--hc-ink3);
	display: flex;
	flex-direction: column;
	gap: 4px;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	cursor: pointer;
	font: inherit;
	transition: background .15s, color .15s;
	min-width: 0;
}
.hc-tabbar a span,
.hc-tabbar button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.hc-tabbar a:hover,
.hc-tabbar button:hover { color: var(--hc-ink); }
.hc-tabbar a.is-active,
.hc-tabbar button.is-active,
.hc-tabbar button[aria-expanded="true"] { background: var(--hc-yellow); color: var(--hc-navy); }

.hc-more-sheet {
	position: absolute;
	left: 0;
	right: 0;
	bottom: calc(100% + 4px);
	padding: 10px;
	border-radius: 22px;
	background: var(--hc-sheet);
	box-shadow: 0 -10px 40px rgba(0, 0, 0, .35);
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.hc-more-sheet[hidden] { display: none !important; }
.hc-more-sheet:not(.is-open) { display: none; }
.hc-more-sheet a,
.hc-more-sheet button {
	height: 48px;
	padding: 0 14px;
	border: 0;
	border-radius: 14px;
	background: transparent;
	color: var(--hc-ink);
	display: flex;
	align-items: center;
	justify-content: space-between;
	font: inherit;
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
	cursor: pointer;
	transition: background .15s;
}
.hc-more-sheet a:hover,
.hc-more-sheet button:hover { background: var(--hc-chip); color: var(--hc-ink); }
.hc-more-sheet button.hc-theme-toggle { background: var(--hc-chip); }
.hc-more-sheet .hc-theme-toggle__label { font-size: 13px; color: var(--hc-ink3); text-transform: none; letter-spacing: 0; font-weight: 600; }

/* =============================================================
 * 7. Footer
 * ============================================================= */
.hc-footer {
	margin-top: 64px;
	background: var(--hc-ft-bg);
	color: var(--hc-ft-ink);
	border-top: 1px solid var(--hc-ft-edge);
}

.hc-footer__inner {
	max-width: var(--hc-maxw);
	margin: 0 auto;
	padding: 40px var(--hc-gutter) 28px;
	display: flex;
	flex-direction: column;
	gap: 32px;
	box-sizing: border-box;
}

.hc-footer__cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 28px 20px;
	font-size: 13px;
}
.hc-footer__col { display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.hc-footer__heading { font-family: var(--hc-font-display); font-weight: 700; font-size: 14px; text-transform: uppercase; margin-bottom: 4px; }
.hc-footer__col a,
.hc-footer__col span { color: var(--hc-ft-ink2); text-decoration: none; }
.hc-footer__col a:hover { color: var(--hc-ft-hi); }

.hc-footer__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	padding-top: 20px;
	border-top: 1px solid var(--hc-ft-line);
	font-size: 12px;
	color: var(--hc-ft-ink2);
}
.hc-footer__bar a { color: var(--hc-ft-ink2); text-decoration: none; font-weight: 700; }
.hc-footer__bar a:hover { color: var(--hc-ft-hi); }

/* =============================================================
 * 7b. Site chrome built from core blocks (parts/header.html,
 *     parts/tabbar.html, parts/footer.html). Everything here is
 *     editable in the Site Editor; icons are CSS masks.
 * ============================================================= */
:root {
	--hc-i-search: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2211%22 cy=%2211%22 r=%227%22/%3E%3Cpath d=%22M20 20l-3.6-3.6%22/%3E%3C/svg%3E");
	--hc-i-sun: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%224.5%22/%3E%3Cpath d=%22M12 2v2M12 20v2M2 12h2M20 12h2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4%22/%3E%3C/svg%3E");
	--hc-i-moon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M20 14.5A8 8 0 0 1 9.5 4a8 8 0 1 0 10.5 10.5z%22/%3E%3C/svg%3E");
	--hc-i-home: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M4 10.5L12 4l8 6.5V20h-5.5v-6h-5v6H4z%22/%3E%3C/svg%3E");
	--hc-i-live: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%222.5%22 fill=%22black%22/%3E%3Cpath d=%22M7.8 7.8a6 6 0 0 0 0 8.4M16.2 7.8a6 6 0 0 1 0 8.4M5 5a10 10 0 0 0 0 14M19 5a10 10 0 0 1 0 14%22/%3E%3C/svg%3E");
	--hc-i-grid: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223.5%22 y=%223.5%22 width=%227%22 height=%227%22 rx=%222%22/%3E%3Crect x=%2213.5%22 y=%223.5%22 width=%227%22 height=%227%22 rx=%222%22/%3E%3Crect x=%223.5%22 y=%2213.5%22 width=%227%22 height=%227%22 rx=%222%22/%3E%3Crect x=%2213.5%22 y=%2213.5%22 width=%227%22 height=%227%22 rx=%222%22/%3E%3C/svg%3E");
	--hc-i-calendar: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Crect x=%223.5%22 y=%225%22 width=%2217%22 height=%2215%22 rx=%223%22/%3E%3Cpath d=%22M3.5 10h17M8 3v4M16 3v4%22/%3E%3C/svg%3E");
	--hc-i-dots: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22black%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Ccircle cx=%225.5%22 cy=%2212%22 r=%222%22 fill=%22black%22 stroke=%22none%22/%3E%3Ccircle cx=%2212%22 cy=%2212%22 r=%222%22 fill=%22black%22 stroke=%22none%22/%3E%3Ccircle cx=%2218.5%22 cy=%2212%22 r=%222%22 fill=%22black%22 stroke=%22none%22/%3E%3C/svg%3E");
}

/* Template-part wrappers carry the sticky positioning (as in aiq); the
 * editable root groups inside (.hc-header, .hc-tabbar-wrap, .hc-footer) only paint. */
header.wp-block-template-part { position: sticky; top: 0; z-index: 30; }
.admin-bar header.wp-block-template-part { top: var(--wp-admin--admin-bar--height, 32px); }
header.wp-block-template-part > .hc-header { position: relative; top: auto; }
.wp-site-blocks > footer.wp-block-template-part > .hc-footer { margin-top: 64px; }
@media (max-width: 959px) {
	.wp-site-blocks > .wp-block-template-part:has(> .hc-tabbar-wrap) { position: sticky; bottom: 0; z-index: 40; }
	.wp-block-template-part > .hc-tabbar-wrap { position: relative; bottom: auto; }
}

/* Header */
.hc-header__inner.wp-block-group { flex-wrap: nowrap; }
.hc-header__left.wp-block-group { gap: 28px; flex-wrap: nowrap; }
.hc-header .hc-logo { margin: 0; }
.hc-header .hc-logo a { display: block; }
@media (max-width: 599px) {
	/* Phones: the editor width is a maximum, the logo may shrink to leave room for the buttons. */
	.hc-header .hc-logo { flex-basis: min(275px, 48vw) !important; }
}
.hc-header .wp-block-navigation.wp-block-navigation { font-size: 13px; }
.hc-nav .wp-block-navigation__container { gap: 4px; flex-wrap: nowrap; }
.hc-nav .wp-block-navigation-item__content.wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	white-space: nowrap;
	padding: 9px clamp(9px, 1.1vw, 14px);
	border-radius: 999px;
	color: var(--hc-ink2);
	text-decoration: none;
	transition: background .15s, color .15s;
}
.hc-nav .wp-block-navigation-item__content:hover { color: var(--hc-ink); }
.hc-nav .current-menu-item > .wp-block-navigation-item__content,
.hc-nav .wp-block-navigation-item__content[aria-current="page"],
body.home .hc-nav .hc-nav-home > a,
body.category .hc-nav .hc-nav-shows > a,
body.tag .hc-nav .hc-nav-shows > a,
body.single-post .hc-nav .hc-nav-shows > a,
body.post-type-archive-news .hc-nav .hc-nav-news > a,
body.single-news .hc-nav .hc-nav-news > a,
body.page-id-47 .hc-nav .hc-nav-about > a { background: var(--hc-inv); color: var(--hc-inv-ink); }

.hc-actions.wp-block-navigation { flex: none; }
.hc-actions .wp-block-navigation__container { gap: 8px; flex-wrap: nowrap; }
.hc-actions .hc-action > a.wp-block-navigation-item__content {
	position: relative;
	width: 40px;
	height: 40px;
	padding: 0;
	border-radius: 12px;
	background: var(--hc-chip);
	color: var(--hc-ink);
	overflow: hidden;
	text-indent: 200%;
	white-space: nowrap;
	text-decoration: none;
	transition: background .15s;
}
.hc-actions .hc-action > a:hover { background: var(--hc-chip2); }
.hc-actions .hc-action > a::before {
	content: "";
	position: absolute;
	inset: 0;
	margin: auto;
	width: 18px;
	height: 18px;
	background: currentColor;
	-webkit-mask: var(--hc-i-search) center / contain no-repeat;
	mask: var(--hc-i-search) center / contain no-repeat;
}
.hc-actions .hc-action--theme > a::before { -webkit-mask-image: var(--hc-i-sun); mask-image: var(--hc-i-sun); }
:root[data-theme="light"] .hc-actions .hc-action--theme > a::before { -webkit-mask-image: var(--hc-i-moon); mask-image: var(--hc-i-moon); }
.hc-actions .hc-action--live > a.wp-block-navigation-item__content {
	width: auto;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 0 15px;
	background: var(--hc-red);
	color: #fff;
	font-weight: 800;
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	text-indent: 0;
}
.hc-actions .hc-action--live > a:hover { background: var(--hc-red-hover); color: #fff; }
.hc-actions .hc-action--live > a::before {
	position: static;
	margin: 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #fff;
	-webkit-mask: none;
	mask: none;
	animation: hc-pulse 1.4s ease-in-out infinite;
}
@media (max-width: 959px) {
	.hc-header .hc-nav.wp-block-navigation,
	.hc-header .hc-action--theme { display: none; }
}

/* Mobile tab bar */
.hc-tabbar-wrap { position: relative; }
/* Size and weight are repeated with the block class: global styles set a font size on every Navigation block. */
.hc-tabbar.wp-block-navigation { display: block; font-size: 10px; font-weight: 800; line-height: 1.2; }
.hc-more-nav.wp-block-navigation { font-size: 15px; }
.hc-tabbar .wp-block-navigation__container {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 0;
	width: 100%;
}
.hc-tabbar .hc-tab { display: block; min-width: 0; }
.hc-tabbar .hc-tab > a.wp-block-navigation-item__content {
	min-height: 52px;
	padding: 0 2px;
	border-radius: 16px;
	color: var(--hc-ink3);
	display: flex;
	flex-direction: column;
	gap: 4px;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	transition: background .15s, color .15s;
}
.hc-tabbar .hc-tab > a::before {
	content: "";
	width: 20px;
	height: 20px;
	flex: none;
	background: currentColor;
	-webkit-mask: var(--hc-i-home) center / contain no-repeat;
	mask: var(--hc-i-home) center / contain no-repeat;
}
.hc-tabbar .hc-tab--live > a::before { -webkit-mask-image: var(--hc-i-live); mask-image: var(--hc-i-live); }
.hc-tabbar .hc-tab--shows > a::before { -webkit-mask-image: var(--hc-i-grid); mask-image: var(--hc-i-grid); }
.hc-tabbar .hc-tab--schedule > a::before { -webkit-mask-image: var(--hc-i-calendar); mask-image: var(--hc-i-calendar); }
.hc-tabbar .hc-tab--more > a::before { -webkit-mask-image: var(--hc-i-dots); mask-image: var(--hc-i-dots); }
.hc-tabbar .hc-tab > a:hover { color: var(--hc-ink); }
.hc-tabbar .current-menu-item > a.wp-block-navigation-item__content,
.hc-tabbar .hc-tab > a[aria-current="page"],
.hc-tabbar .hc-more-toggle[aria-expanded="true"] > a,
body.home .hc-tabbar .hc-tab--home > a,
body.category .hc-tabbar .hc-tab--shows > a,
body.tag .hc-tabbar .hc-tab--shows > a,
body.single-post .hc-tabbar .hc-tab--shows > a,
body.post-type-archive-news .hc-tabbar .hc-tab--more > a,
body.single-news .hc-tabbar .hc-tab--more > a,
body.page-id-49 .hc-tabbar .hc-tab--more > a,
body.page-id-47 .hc-tabbar .hc-tab--more > a { background: var(--hc-yellow); color: var(--hc-navy); }

.hc-more-sheet.wp-block-group { left: 10px; right: 10px; margin: 0; }
.hc-more-nav.wp-block-navigation,
.hc-more-nav .wp-block-navigation__container { display: flex; flex-direction: column; align-items: stretch; gap: 4px; width: 100%; }
.hc-more-nav .wp-block-navigation-item { display: block; }
.hc-more-nav .wp-block-navigation-item__content.wp-block-navigation-item__content {
	display: block;
	padding: 14px;
	border-radius: 14px;
	color: var(--hc-ink);
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
}
.hc-more-nav .wp-block-navigation-item__content:hover { background: var(--hc-chip); }
.hc-more-nav .hc-theme-toggle > a { background: var(--hc-chip); }

/* Footer */
.hc-footer .hc-footer__inner > *,
.hc-footer .hc-footer__cols > *,
.hc-footer .hc-footer__col > *,
.hc-footer .hc-footer__bar > * { margin-block: 0; }
.hc-footer .hc-footer__col p { margin: 0; color: var(--hc-ft-ink2); }
.hc-footer .hc-footer__col p.hc-footer__heading { color: var(--hc-ft-ink); margin-bottom: 4px; }

/* Site Editor canvas: parts are edited on their own, keep them readable. */
.editor-styles-wrapper .hc-more-sheet:not(.is-open) { display: flex; position: static; }
.editor-styles-wrapper .hc-tabbar-wrap { display: block; position: static; }
.editor-styles-wrapper .hc-header .hc-nav.wp-block-navigation { display: flex; }

/* =============================================================
 * 8. Home: hero bento
 * ============================================================= */
.hc-hero {
	max-width: var(--hc-maxw-wide);
	margin: 0 auto;
	padding: 24px var(--hc-gutter) 0;
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	grid-auto-rows: clamp(110px, 11.5vw, 150px);
	gap: 14px;
	box-sizing: border-box;
	width: 100%;
}
.hc-hero > * {
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	color: #fff;
	text-decoration: none;
	min-width: 0;
}
.hc-hero > a:hover { color: #fff; }

.hc-hero__main { grid-column: span 8; grid-row: span 3; background: var(--hc-card); display: block; }
.hc-hero__main > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.hc-hero__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 18, 32, 0) 30%, rgba(10, 18, 32, .92) 100%); }
.hc-hero__tags { position: absolute; top: 20px; left: 20px; display: flex; gap: 8px; z-index: 2; }
.hc-hero__tags .hc-tag { padding: 6px 11px; border-radius: 8px; font-size: 11px; letter-spacing: .08em; }
.hc-hero__tags .hc-tag--glass { background: rgba(10, 18, 32, .6); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font-weight: 700; color: #fff; }
.hc-hero__foot {
	position: absolute;
	left: 24px;
	right: 24px;
	bottom: 24px;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	z-index: 2;
}
.hc-hero__text { display: flex; flex-direction: column; gap: 10px; max-width: 560px; min-width: 0; }
.hc-hero__title {
	font-family: var(--hc-font-display);
	font-weight: 800;
	font-size: clamp(26px, 3.1vw, 40px);
	line-height: 1;
	letter-spacing: -.02em;
	text-transform: uppercase;
	text-wrap: pretty;
}
.hc-hero__sub { font-size: 15px; color: rgba(255, 255, 255, .8); }
.hc-hero__play {
	flex: none;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background: var(--hc-yellow);
	display: grid;
	place-items: center;
}
.hc-hero__play::after {
	content: "";
	width: 0;
	height: 0;
	border-left: 18px solid var(--hc-navy);
	border-top: 11px solid transparent;
	border-bottom: 11px solid transparent;
	margin-left: 4px;
}

.hc-hero__live {
	grid-column: span 4;
	grid-row: span 2;
	background: var(--hc-blue);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 20px;
}
.hc-hero__live > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .55; mix-blend-mode: luminosity; }
.hc-hero__live-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11, 77, 162, .2), rgba(11, 77, 162, .95)); }
.hc-hero__live-top { position: relative; display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.hc-hero__live-body { position: relative; display: flex; flex-direction: column; gap: 8px; }
.hc-hero__live-title { font-family: var(--hc-font-display); font-weight: 700; font-size: 22px; line-height: 1.1; overflow-wrap: anywhere; }
.hc-hero__live-show { font-size: 13px; color: rgba(255, 255, 255, .85); }
.hc-hero__live-prog { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; color: rgba(255, 255, 255, .85); }
.hc-hero__live-bar { flex: 1; height: 4px; border-radius: 2px; background: rgba(255, 255, 255, .25); }
.hc-hero__live-bar > span { display: block; height: 100%; border-radius: 2px; background: var(--hc-yellow); width: 0; }
.hc-hero__live-foot {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	margin-top: 6px;
	padding-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, .25);
	font-size: 12px;
}
.hc-hero__live-foot span:first-child { color: rgba(255, 255, 255, .85); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hc-hero__live-foot span:last-child { font-weight: 800; flex: none; }

.hc-hero__kids {
	grid-column: span 2;
	grid-row: span 1;
	background: var(--hc-yellow);
	color: var(--hc-navy);
	padding: 16px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	transition: transform .15s;
}
.hc-hero__kids:hover { transform: rotate(-1.5deg); color: var(--hc-navy); }
.hc-hero__kids-label { font-weight: 800; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.hc-hero__kids-title { font-family: var(--hc-font-display); font-weight: 700; font-size: clamp(11px, 1.2vw, 15px); line-height: 1.15; overflow-wrap: anywhere; }

.hc-hero__show {
	grid-column: span 2;
	grid-row: span 1;
	position: relative;
	background: #141f36;
	cursor: pointer;
}
.hc-hero__show > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hc-hero__show-shade { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(10, 18, 32, .92)); }
.hc-hero__show-title { position: absolute; left: 14px; right: 10px; bottom: 12px; font-weight: 700; font-size: 12px; line-height: 1.25; }

@media (max-width: 959px) {
	.hc-hero {
		padding: 14px 16px 0;
		grid-template-columns: 1fr 1fr;
		grid-auto-rows: auto;
		gap: 10px;
	}
	.hc-hero__main { grid-column: span 2; grid-row: auto; height: 420px; border-radius: 22px; }
	.hc-hero__main:hover { transform: none; }
	.hc-hero__main > img { object-position: 58% center; }
	.hc-hero__foot { left: 18px; right: 18px; bottom: 18px; }
	.hc-hero__title { font-size: 26px; }
	.hc-hero__sub { font-size: 13px; }
	.hc-hero__play { width: 52px; height: 52px; }
	.hc-hero__play::after { border-left-width: 15px; border-top-width: 9px; border-bottom-width: 9px; margin-left: 3px; }
	.hc-hero__live { grid-column: span 1; grid-row: auto; min-height: 118px; border-radius: 18px; padding: 14px; gap: 6px; }
	.hc-hero__live:hover { transform: none; }
	.hc-hero__live-title { font-size: 14px; }
	.hc-hero__live-foot { display: none; }
	.hc-hero__kids { grid-column: span 1; grid-row: auto; min-height: 118px; border-radius: 18px; padding: 14px; }
	.hc-hero__kids:hover { transform: none; }
	.hc-hero__show { display: none; }
}

/* =============================================================
 * 9. Continue watching ("Продължи да гледаш")
 * ============================================================= */
.hc-continue[hidden] { display: none !important; }
.hc-continue__clear { border: 0; background: none; padding: 0; font-size: 13px; font-weight: 700; color: var(--hc-ink3); cursor: pointer; flex: none; }
.hc-continue__clear:hover { color: var(--hc-ink); }
.hc-card--progress .hc-thumb::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	height: 4px;
	width: var(--hc-progress, 0%);
	background: var(--hc-yellow);
	z-index: 3;
}
.hc-card--progress .hc-thumb::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4px;
	background: rgba(255, 255, 255, .25);
	z-index: 3;
}

/* =============================================================
 * 10. Episode rail ("Нови епизоди", "Още от тази поредица")
 * ============================================================= */
.hc-card__tag { position: absolute; left: 8px; top: 8px; z-index: 2; }
.hc-card__tag--sm { left: 6px; top: 6px; font-size: 10px; padding: 2px 6px; }
.hc-card__fallback {
	position: absolute;
	inset: 0;
	pad: 0;
	padding: 12px;
	display: flex;
	align-items: flex-end;
	font-family: var(--hc-font-display);
	font-weight: 800;
	font-size: 12px;
	line-height: 1.05;
	text-transform: uppercase;
	color: #fff;
	background: linear-gradient(135deg, var(--hc-blue), var(--hc-blue-deep));
	overflow: hidden;
}
.hc-card--tight .hc-card__fallback { font-size: 9px; padding: 8px; }

/* =============================================================
 * 11. On air ("Днес в ефир")
 * ============================================================= */
.hc-onair-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.hc-onair {
	display: flex;
	gap: 12px;
	align-items: center;
	padding: 10px;
	border-radius: 14px;
	background: var(--hc-card);
	color: var(--hc-ink);
	text-decoration: none;
	border: 2px solid transparent;
	transition: background .15s;
	min-width: 0;
}
.hc-onair:hover { background: var(--hc-card2); color: var(--hc-ink); }
.hc-onair.is-now { border-color: var(--hc-red); }
.hc-onair.is-past { opacity: .55; }
.hc-onair__time { font-family: var(--hc-font-display); font-weight: 700; font-size: 15px; width: 52px; flex: none; font-variant-numeric: tabular-nums; }
.hc-onair.is-now .hc-onair__time { color: var(--hc-red-text); }
.hc-onair__body { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.hc-onair__label { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--hc-ink3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hc-onair.is-now .hc-onair__label { color: var(--hc-red-text); }
.hc-onair__title { font-size: 13px; font-weight: 700; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Hero variant: on-air tile inside the bento */
.hc-hero__onair {
	grid-column: span 4;
	grid-row: span 2;
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	background: var(--hc-blue);
	color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 20px;
	cursor: pointer;
	text-decoration: none;
}
.hc-hero__onair:hover { color: #fff; }
.hc-hero__onair > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .55; mix-blend-mode: luminosity; }
.hc-hero__onair-top { position: relative; display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.hc-hero__onair-body { position: relative; display: flex; flex-direction: column; gap: 8px; }
.hc-hero__onair-title { font-family: var(--hc-font-display); font-weight: 700; font-size: 22px; line-height: 1.1; overflow-wrap: anywhere; }
.hc-hero__onair-show { font-size: 13px; color: rgba(255, 255, 255, .85); }
.hc-hero__onair-prog { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; color: rgba(255, 255, 255, .85); }
.hc-hero__onair-bar { flex: 1; height: 4px; border-radius: 2px; background: rgba(255, 255, 255, .25); }
.hc-hero__onair-bar > span { display: block; height: 100%; border-radius: 2px; background: var(--hc-yellow); }
.hc-hero__onair-next { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 6px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, .25); font-size: 12px; }
.hc-hero__onair-next span:first-child { color: rgba(255, 255, 255, .85); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hc-hero__onair-next span:last-child { font-weight: 800; flex: none; }

@media (max-width: 959px) {
	.hc-hero__onair { grid-column: span 1; grid-row: auto; min-height: 118px; border-radius: 18px; padding: 14px; gap: 6px; }
	.hc-hero__onair-title { font-size: 14px; }
	.hc-hero__onair-next { display: none; }
}

/* =============================================================
 * 12. Topic tiles ("Какво ти се гледа?")
 * ============================================================= */
.hc-topic {
	position: relative;
	aspect-ratio: 4 / 3;
	border-radius: 18px;
	overflow: hidden;
	background: var(--hc-card);
	color: #fff;
	text-decoration: none;
	display: block;
	transition: transform .22s var(--hc-ease);
}
.hc-topic:hover { transform: translateY(-3px); color: #fff; }
.hc-topic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hc-topic__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 18, 32, .05) 15%, rgba(10, 18, 32, .92) 100%); }
.hc-topic__body { position: absolute; left: 14px; right: 12px; bottom: 12px; display: flex; flex-direction: column; gap: 4px; }
.hc-topic__name { font-family: var(--hc-font-display); font-weight: 800; font-size: clamp(11px, 1.15vw, 15px); line-height: 1; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hc-topic__count { font-size: 12px; font-weight: 600; color: rgba(255, 255, 255, .85); }

/* =============================================================
 * 13. Kids band ("За деца")
 * ============================================================= */
.hc-kids {
	display: flex;
	flex-wrap: wrap;
	border-radius: 22px;
	overflow: hidden;
	background: var(--hc-blue);
	color: #fff;
}
.hc-kids__media { flex: 1 1 340px; min-height: 240px; position: relative; }
.hc-kids__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hc-kids__body { flex: 1.5 1 420px; padding: clamp(20px, 3vw, 40px); display: flex; flex-direction: column; gap: 18px; min-width: 0; box-sizing: border-box; }
.hc-kids__intro { display: flex; flex-direction: column; gap: 10px; }
.hc-kids__label { font-weight: 800; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--hc-yellow); }
.hc-kids__title { margin: 0; font-family: var(--hc-font-display); font-weight: 800; font-size: clamp(24px, 3vw, 36px); line-height: 1; text-transform: uppercase; letter-spacing: -.02em; color: #fff; }
.hc-kids__text { margin: 0; font-size: 15px; line-height: 1.55; color: rgba(255, 255, 255, .88); max-width: 520px; }
.hc-kids__eps { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.hc-kids__ep { display: flex; flex-direction: column; gap: 8px; color: #fff; text-decoration: none; min-width: 0; transition: transform .22s var(--hc-ease); }
.hc-kids__ep:hover { transform: translateY(-3px); color: #fff; }
.hc-kids__ep .hc-thumb { border-radius: 10px; background: var(--hc-blue-deep); }
.hc-kids__ep-title { font-size: 13px; font-weight: 700; line-height: 1.3; }
.hc-kids__actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: auto; }

/* =============================================================
 * 14. Camps rail ("Лагери")
 * ============================================================= */
.hc-camp { display: flex; flex-direction: column; gap: 10px; color: var(--hc-ink); text-decoration: none; min-width: 0; transition: transform .22s var(--hc-ease); }
.hc-camp:hover { transform: translateY(-3px); color: var(--hc-ink); }
.hc-camp .hc-thumb { border-radius: 14px; background: var(--hc-card); }
.hc-camp__body { display: flex; flex-direction: column; gap: 4px; }
.hc-camp__kind { font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--hc-ink3); }
.hc-camp__title { font-size: 14px; font-weight: 700; line-height: 1.25; }

/* =============================================================
 * 15. News feature (home)
 * ============================================================= */
.hc-newsfeat { display: flex; flex-wrap: wrap; gap: 14px; }
.hc-newsfeat__big {
	flex: 1.6 1 420px;
	position: relative;
	min-height: 340px;
	border-radius: 20px;
	overflow: hidden;
	background: var(--hc-card);
	color: #fff;
	text-decoration: none;
	display: block;
}
.hc-newsfeat__big:hover { color: #fff; }
.hc-newsfeat__big img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hc-newsfeat__big-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 18, 32, 0) 35%, rgba(10, 18, 32, .94)); }
.hc-newsfeat__big-body { position: absolute; left: 22px; right: 22px; bottom: 20px; display: flex; flex-direction: column; gap: 8px; }
.hc-newsfeat__big-date { font-size: 12px; font-weight: 700; color: rgba(255, 255, 255, .8); }
.hc-newsfeat__big-title { font-family: var(--hc-font-display); font-weight: 800; font-size: clamp(20px, 2.2vw, 28px); line-height: 1.05; text-transform: uppercase; text-wrap: pretty; }
.hc-newsfeat__list { flex: 1 1 300px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.hc-newsfeat__list .hc-newscard--row { flex: 1; }

/* =============================================================
 * 16. Live page
 * ============================================================= */
.hc-live { display: flex; flex-direction: column; gap: 20px; padding-top: 24px; }
.hc-live__cols { display: flex; flex-wrap: wrap; gap: 16px; align-items: flex-start; }
.hc-live__main { flex: 2.2 1 560px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.hc-live__player { position: relative; aspect-ratio: 16 / 9; border-radius: 20px; overflow: hidden; background: #000; }
.hc-live__player iframe, .hc-live__player video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.hc-live__info { display: flex; flex-direction: column; gap: 6px; }
.hc-live__now-show { font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--hc-accent-ink); }
.hc-live__now-title { margin: 0; font-family: var(--hc-font-display); font-weight: 700; font-size: clamp(20px, 2.4vw, 28px); line-height: 1.1; }
.hc-live__now-desc { margin: 0; font-size: 15px; line-height: 1.55; color: var(--hc-ink2); max-width: 640px; }
.hc-live__badge { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border-radius: 10px; background: var(--hc-red); color: #fff; font-weight: 800; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.hc-live__badge-dot { width: 8px; height: 8px; border-radius: 50%; background: #fff; animation: hc-pulse 1.4s ease-in-out infinite; }
.hc-live__heading { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

/* =============================================================
 * 17. Shows page
 * ============================================================= */
.hc-shows { display: flex; flex-direction: column; gap: 22px; padding-top: 28px; }
.hc-shows__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.hc-shows__count { font-size: 14px; color: var(--hc-ink3); }
.hc-shows__empty { padding: clamp(36px, 5vw, 48px) 24px; border-radius: 20px; background: var(--hc-card); display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; }

/* =============================================================
 * 18. Show detail (category archive)
 * ============================================================= */
.hc-show { display: flex; flex-direction: column; gap: 28px; padding-top: 22px; }
.hc-show__hero { display: flex; flex-wrap: wrap-reverse; gap: 28px; align-items: center; }
.hc-show__text { flex: 1 1 360px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.hc-show__topics { display: flex; gap: 6px; flex-wrap: wrap; }
.hc-show__title { margin: 0; font-family: var(--hc-font-display); font-weight: 800; font-size: clamp(30px, 4.6vw, 56px); line-height: .98; letter-spacing: -.03em; text-transform: uppercase; text-wrap: pretty; }
.hc-show__desc { margin: 0; font-size: 16px; line-height: 1.6; color: var(--hc-ink2); max-width: 560px; text-wrap: pretty; }
.hc-show__actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 4px; }
.hc-show__media { flex: 1.3 1 420px; aspect-ratio: 16 / 9; border-radius: 22px; overflow: hidden; background: var(--hc-card); }
.hc-show__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.hc-eplist { display: flex; flex-direction: column; gap: 6px; }
.hc-eplist__head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.hc-eplist__head h2 { margin: 0; font-family: var(--hc-font-display); font-weight: 700; font-size: 18px; text-transform: uppercase; }
.hc-eplist__head .hc-section-head__rule { flex: 1; }
.hc-sort { display: flex; padding: 3px; border-radius: 12px; background: var(--hc-chip); font-size: 12px; font-weight: 700; }
.hc-sort a { padding: 7px 12px; border-radius: 9px; color: var(--hc-ink2); text-decoration: none; }
.hc-sort a.is-active { background: var(--hc-inv); color: var(--hc-inv-ink); }

/* =============================================================
 * 19. Episode page
 * ============================================================= */
.hc-episode { display: flex; flex-direction: column; gap: 22px; padding-top: 22px; max-width: var(--hc-maxw-episode); }
.hc-episode__cols { display: flex; flex-wrap: wrap; gap: 28px; align-items: flex-start; }
.hc-episode__main { flex: 2 1 480px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.hc-episode__show { font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--hc-accent-ink); text-decoration: none; }
.hc-episode__title { margin: 0; font-family: var(--hc-font-display); font-weight: 700; font-size: clamp(22px, 3vw, 36px); line-height: 1.12; letter-spacing: -.01em; text-wrap: pretty; }
.hc-episode__meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px; color: var(--hc-ink3); }

.hc-prose { display: flex; flex-direction: column; gap: 12px; font-size: 16px; line-height: 1.65; color: var(--hc-ink2); max-width: 680px; margin-top: 6px; }
.hc-prose > * { margin: 0; text-wrap: pretty; }
.hc-prose--wide { max-width: 760px; font-size: 17px; line-height: 1.7; }
.hc-prose h2 { font-family: var(--hc-font-display); font-weight: 700; font-size: clamp(18px, 2vw, 22px); text-transform: uppercase; color: var(--hc-ink); margin-top: 16px; }
.hc-prose ul, .hc-prose ol { padding-left: 22px; }
/* Quotes: Lora italic (self-hosted, Cyrillic + Latin) with a large yellow opening mark.
 * Font, size and weight come from theme.json (styles.blocks.core/quote), so they can be changed
 * in the Site Editor → Styles → Blocks → Quote. */
:is(.hc-prose, .wp-block-post-content, .hc-main) blockquote:where(.wp-block-quote, :not([class])) {
	position: relative;
	margin: 28px 0;
	padding: 4px 0 4px clamp(44px, 6vw, 68px);
	border: 0;
	font-family: var(--wp--preset--font-family--quote);
	font-style: italic;
	font-weight: 500;
	font-size: clamp(20px, 2.4vw, 28px);
	line-height: 1.4;
	color: var(--hc-ink);
	text-wrap: pretty;
}
:is(.hc-prose, .wp-block-post-content, .hc-main) blockquote:where(.wp-block-quote, :not([class]))::before {
	content: "„";
	position: absolute;
	left: 0;
	top: -.5em;
	font-family: var(--wp--preset--font-family--quote);
	font-style: italic;
	font-weight: 700;
	font-size: clamp(64px, 8vw, 96px);
	line-height: 1;
	color: var(--hc-yellow);
}
:root[data-theme="light"] :is(.hc-prose, .wp-block-post-content, .hc-main) blockquote::before { color: var(--hc-blue); }
blockquote:where(.wp-block-quote, :not([class])) > p { margin: 0 0 .5em; font: inherit; color: inherit; }
blockquote:where(.wp-block-quote, :not([class])) > p:last-of-type { margin-bottom: 0; }
blockquote:where(.wp-block-quote, :not([class])) cite,
blockquote:where(.wp-block-quote, :not([class])) footer {
	display: block;
	margin-top: 14px;
	font-family: var(--hc-font-body);
	font-style: normal;
	font-weight: 800;
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--hc-ink3);
}
blockquote:where(.wp-block-quote, :not([class])) cite::before { content: "— "; }

.hc-episode__aside { flex: 1 1 300px; display: flex; flex-direction: column; gap: 12px; padding: 16px; border-radius: 20px; background: var(--hc-card); min-width: 0; box-sizing: border-box; }
.hc-episode__aside-head { display: flex; align-items: center; justify-content: space-between; }
.hc-episode__aside-title { font-family: var(--hc-font-display); font-weight: 700; font-size: 13px; text-transform: uppercase; }

.hc-autoplay { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--hc-ink2); cursor: pointer; border: 0; background: none; padding: 0; }
.hc-autoplay__track { width: 36px; height: 20px; border-radius: 999px; background: var(--hc-line2); position: relative; transition: background .15s; }
.hc-autoplay__track::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: left .15s; }
.hc-autoplay[aria-pressed="true"] .hc-autoplay__track { background: var(--hc-yellow); }
.hc-autoplay[aria-pressed="true"] .hc-autoplay__track::after { left: 18px; }

.hc-episode__next { display: flex; flex-direction: column; gap: 10px; color: var(--hc-ink); text-decoration: none; min-width: 0; }
.hc-episode__next:hover { color: var(--hc-ink); }
.hc-episode__next .hc-thumb { border-radius: 12px; }
.hc-episode__next-title { font-size: 14px; font-weight: 700; line-height: 1.3; }
.hc-episode__next-meta { font-size: 12px; color: var(--hc-ink3); }
.hc-episode__next-note { font-size: 12px; color: var(--hc-ink3); }
.hc-episode__next-note[hidden] { display: none; }

@media (max-width: 959px) {
	.hc-episode__main { flex: 1 1 100%; }
	.hc-episode__aside { flex: 1 1 100%; }
}

/* =============================================================
 * 20. Schedule page ("Програма")
 * ============================================================= */
.hc-schedule { display: flex; flex-direction: column; gap: 20px; padding-top: 28px; }
.hc-days { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 4px; border-radius: 16px; background: var(--hc-chip); max-width: 1080px; }
.hc-days a { height: 54px; border-radius: 12px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; text-decoration: none; color: var(--hc-ink); transition: background .15s; }
.hc-days a:hover { background: var(--hc-chip2); }
.hc-days a.is-active { background: var(--hc-blue); color: #fff; }
.hc-days__dow { font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.hc-days__date { font-family: var(--hc-font-display); font-weight: 700; font-size: 15px; }
.hc-slots { display: flex; flex-direction: column; gap: 8px; max-width: 1080px; }
.hc-slot {
	display: grid;
	grid-template-columns: clamp(46px, 7vw, 72px) clamp(92px, 18vw, 176px) minmax(0, 1fr) auto;
	gap: clamp(10px, 2vw, 20px);
	align-items: center;
	padding: 10px clamp(10px, 1.6vw, 16px);
	border-radius: 16px;
	background: var(--hc-card);
	color: var(--hc-ink);
	text-decoration: none;
	box-shadow: inset 4px 0 0 transparent;
	transition: filter .15s;
	min-width: 0;
}
.hc-slot:hover { filter: brightness(1.08); color: var(--hc-ink); }
.hc-slot.is-past { opacity: .55; }
.hc-slot.is-now { background: var(--hc-blue); color: #fff; box-shadow: inset 4px 0 0 var(--hc-red); }
.hc-slot.is-now:hover { color: #fff; }
.hc-slot__time { font-family: var(--hc-font-display); font-weight: 700; font-size: clamp(13px, 1.6vw, 17px); font-variant-numeric: tabular-nums; }
.hc-slot img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; display: block; }
.hc-slot__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.hc-slot__top { display: flex; align-items: center; gap: 8px; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; opacity: .85; min-width: 0; }
.hc-slot__show { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hc-slot__now { flex: none; display: inline-flex; align-items: center; gap: 5px; padding: 2px 6px; border-radius: 5px; background: var(--hc-red); color: #fff; }
.hc-slot__aired { flex: none; padding: 2px 6px; border-radius: 5px; background: var(--hc-chip); }
.hc-slot__title { font-size: clamp(13px, 1.6vw, 16px); font-weight: 700; line-height: 1.3; }
.hc-slot__prog { display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; max-width: 420px; }
.hc-slot__prog-bar { flex: 1; height: 4px; border-radius: 2px; background: rgba(255, 255, 255, .25); }
.hc-slot__prog-bar > span { display: block; height: 100%; border-radius: 2px; background: var(--hc-yellow); width: 0; }
.hc-slot__desc { font-size: 13px; line-height: 1.45; opacity: .75; }
.hc-slot__cta { white-space: nowrap; height: 40px; padding: 0 16px; border-radius: 999px; display: inline-flex; align-items: center; font-weight: 800; font-size: 13px; background: var(--hc-chip); color: var(--hc-ink); }
.hc-slot.is-now .hc-slot__cta { background: var(--hc-red); color: #fff; }
.hc-slot.is-past .hc-slot__cta { background: transparent; }
.hc-slot__chev { font-size: 18px; opacity: .6; display: none; }
@media (max-width: 959px) {
	.hc-slot { grid-template-columns: clamp(46px, 12vw, 72px) clamp(92px, 26vw, 176px) minmax(0, 1fr) auto; }
	.hc-slot__desc, .hc-slot__cta { display: none; }
	.hc-slot__chev { display: block; }
}
@media (max-width: 519px) {
	.hc-days a { height: 50px; }
	.hc-days__date { font-size: 13px; }
}

/* =============================================================
 * 21. News archive + article
 * ============================================================= */
.hc-news { display: flex; flex-direction: column; gap: 22px; padding-top: 28px; }
.hc-article { display: flex; flex-direction: column; gap: 18px; padding-top: 22px; }
.hc-article__date { font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--hc-accent-ink); }
.hc-article__title { margin: 0; font-family: var(--hc-font-display); font-weight: 700; font-size: clamp(24px, 3.6vw, 40px); line-height: 1.1; letter-spacing: -.01em; text-wrap: pretty; }
.hc-article__media { aspect-ratio: 16 / 9; border-radius: 20px; overflow: hidden; background: var(--hc-card); position: relative; }
.hc-article__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hc-article__lead { margin: 0; font-size: 18px; line-height: 1.65; color: var(--hc-ink2); text-wrap: pretty; }
.hc-article__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.hc-article__more { display: flex; flex-direction: column; gap: 14px; margin-top: 20px; }

/* =============================================================
 * 22. About / contact
 * ============================================================= */
.hc-about { display: flex; flex-direction: column; gap: 28px; padding-top: 28px; }
.hc-about__hero { display: flex; flex-wrap: wrap; gap: 14px; }
.hc-about__mission { flex: 2 1 440px; min-height: 300px; border-radius: 22px; background: var(--hc-blue); color: #fff; padding: clamp(22px, 3.4vw, 40px); display: flex; flex-direction: column; justify-content: space-between; gap: 24px; box-sizing: border-box; min-width: 0; }
.hc-about__mission-label { font-weight: 800; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--hc-yellow); }
.hc-about__mission-text { font-family: var(--hc-font-display); font-weight: 700; font-size: clamp(20px, 2.6vw, 32px); line-height: 1.18; text-wrap: pretty; }
.hc-about__stats { flex: 1 1 260px; display: grid; grid-template-rows: repeat(3, 1fr); gap: 14px; min-width: 0; }
.hc-about__stat { border-radius: 18px; padding: 16px 20px; display: flex; align-items: baseline; gap: 12px; background: var(--hc-card); min-width: 0; }
.hc-about__stat--yellow { background: var(--hc-yellow); color: var(--hc-navy); }
.hc-about__stat-num { font-family: var(--hc-font-display); font-weight: 800; font-size: clamp(30px, 3.6vw, 44px); line-height: 1; }
.hc-about__stat-label { font-weight: 700; font-size: 14px; color: var(--hc-ink2); }
.hc-about__stat--yellow .hc-about__stat-label { color: var(--hc-navy); }
.hc-contact { display: flex; flex-wrap: wrap; gap: 14px; scroll-margin-top: 90px; }
.hc-contact__info { flex: 1 1 280px; display: flex; flex-direction: column; gap: 14px; padding: clamp(20px, 3vw, 32px); border-radius: 22px; background: var(--hc-card); min-width: 0; box-sizing: border-box; }
.hc-contact__info h2 { margin: 0; font-family: var(--hc-font-display); font-weight: 800; font-size: clamp(22px, 2.8vw, 32px); text-transform: uppercase; line-height: 1; }
.hc-contact__info p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--hc-ink2); }
.hc-contact__social { display: flex; gap: 8px; flex-wrap: wrap; margin-top: auto; }
.hc-contact__form-wrap { flex: 1.6 1 380px; padding: clamp(20px, 3vw, 32px); border-radius: 22px; border: 2px solid var(--hc-line); min-width: 0; box-sizing: border-box; }
.hc-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.hc-form__field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 700; min-width: 0; }
.hc-form__field--wide { grid-column: 1 / -1; }
.hc-form__field input, .hc-form__field select, .hc-form__field textarea { height: 48px; padding: 0 14px; border-radius: 12px; border: 2px solid var(--hc-line2); background: var(--hc-field); color: var(--hc-ink); font-size: 15px; font-weight: 400; outline: none; box-sizing: border-box; width: 100%; }
.hc-form__field textarea { height: auto; padding: 12px 14px; line-height: 1.5; resize: vertical; }
.hc-form__field input:focus, .hc-form__field select:focus, .hc-form__field textarea:focus { border-color: var(--hc-yellow); }
.hc-form__field.has-error input, .hc-form__field.has-error textarea { border-color: var(--hc-red-soft); }
.hc-form__error { font-weight: 600; font-size: 12px; color: var(--hc-red-soft); min-height: 16px; }
.hc-form__foot { grid-column: 1 / -1; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.hc-form__note { font-size: 12px; color: var(--hc-ink3); }
.hc-form__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.hc-form__sent { min-height: 320px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 14px; }
.hc-form__sent[hidden], .hc-form[hidden] { display: none !important; }
.hc-form__check { width: 56px; height: 56px; border-radius: 50%; background: var(--hc-yellow); color: var(--hc-navy); display: grid; place-items: center; }
.hc-form__sent-title { font-family: var(--hc-font-display); font-weight: 800; font-size: 24px; text-transform: uppercase; line-height: 1.1; }
.hc-form__sent p { margin: 0; font-size: 15px; color: var(--hc-ink2); }

/* =============================================================
 * 23. Search page ("Търсене")
 * ============================================================= */
.hc-search { display: flex; flex-direction: column; gap: 20px; padding-top: 28px; max-width: var(--hc-maxw-narrow); }
.hc-search__box { display: flex; align-items: center; gap: 12px; height: clamp(56px, 7vw, 72px); padding: 0 20px; border-radius: 20px; background: var(--hc-card); border: 2px solid var(--hc-line2); box-sizing: border-box; }
.hc-search__box:focus-within { border-color: var(--hc-yellow); }
.hc-search__box svg { flex: none; opacity: .6; }
.hc-search__input { flex: 1; min-width: 0; height: 100%; border: 0 !important; background: transparent !important; outline: none !important; padding: 0 !important; font-family: var(--hc-font-display); font-weight: 600; font-size: clamp(16px, 2.2vw, 24px); color: var(--hc-ink); }
.hc-search__input::placeholder { color: var(--hc-ink3); }
.hc-search__clear { flex: none; height: 34px; padding: 0 12px; border-radius: 10px; border: 0; background: var(--hc-chip); color: var(--hc-ink); font-weight: 700; font-size: 12px; display: inline-flex; align-items: center; text-decoration: none; }
.hc-search__clear:hover { background: var(--hc-chip2); color: var(--hc-ink); }
.hc-search__count { font-size: 14px; color: var(--hc-ink3); }
.hc-search__suggest { display: flex; flex-direction: column; gap: 12px; }
.hc-search__group { display: flex; flex-direction: column; gap: 12px; }
.hc-search__group-title { margin: 0; font-family: var(--hc-font-display); font-weight: 700; font-size: 14px; text-transform: uppercase; }

/* =============================================================
 * 24. 404
 * ============================================================= */
.hc-404 { display: flex; flex-wrap: wrap; gap: 14px; padding-top: 28px; }
.hc-404__big { flex: 1.4 1 380px; min-height: 360px; border-radius: 24px; background: var(--hc-yellow); color: var(--hc-navy); padding: clamp(24px, 4vw, 44px); display: flex; flex-direction: column; justify-content: space-between; gap: 20px; box-sizing: border-box; min-width: 0; }
.hc-404__code { font-family: var(--hc-font-display); font-weight: 800; font-size: clamp(72px, 14vw, 180px); line-height: .85; letter-spacing: -.05em; }
.hc-404__title { font-family: var(--hc-font-display); font-weight: 700; font-size: clamp(18px, 2.2vw, 26px); line-height: 1.15; text-transform: uppercase; }
.hc-404__side { flex: 1 1 300px; border-radius: 24px; background: var(--hc-card); padding: clamp(22px, 3vw, 36px); display: flex; flex-direction: column; gap: 14px; justify-content: center; min-width: 0; box-sizing: border-box; }
.hc-404__side p { margin: 0; font-size: 16px; line-height: 1.6; color: var(--hc-ink2); }
.hc-404__actions { display: flex; flex-direction: column; gap: 8px; }