/* ==========================================================================
   Black Hole Audio — moody editorial reskin (WPVibe draft)
   ========================================================================== */

:root {
	--bha-bg: #0a0a0a;
	--bha-fg: #f4f1ec;
	--bha-muted: rgba(244, 241, 236, 0.62);
	--bha-line: rgba(255, 255, 255, 0.14);
	--bha-accent: #b3261e;
}

/* ---- Foundations ---- */

html, body {
	background-color: var(--bha-bg) !important;
	color: var(--bha-fg) !important;
}

body {
	padding-bottom: 68px !important; /* room for the sticky player */
}

body, p, li, label, input, textarea, select,
.entry-content, .wp-block-stackable-text .stk-block-text__text {
	font-family: 'Archivo', sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.wp-block-heading {
	font-family: 'Fraunces', serif !important;
	font-weight: 600 !important;
	letter-spacing: -0.01em !important;
	color: var(--bha-fg) !important;
}

.stk-block-heading__text {
	font-family: 'Fraunces', serif !important;
	font-weight: 600 !important;
	letter-spacing: -0.01em !important;
}

a {
	color: var(--bha-fg);
	text-decoration-color: var(--bha-accent);
	text-underline-offset: 3px;
}

a:hover {
	color: var(--bha-accent) !important;
}

hr.wp-block-separator {
	border-top-color: var(--bha-line) !important;
	opacity: 1 !important;
}

::selection {
	background: var(--bha-accent);
	color: #fff;
}

/* ---- Header / nav (best-effort across Blocksy markup) ---- */

header, .site-header, .ct-header, #masthead, #header {
	background-color: #000 !important;
	border-bottom: 1px solid var(--bha-line) !important;
}

header nav a, .site-header a, .ct-header a, #header a,
.ct-header-menu-item a {
	color: var(--bha-fg) !important;
	font-family: 'Archivo', sans-serif !important;
	font-size: 0.82rem !important;
	letter-spacing: 0.06em !important;
	text-transform: uppercase !important;
}

header nav a:hover, .site-header a:hover, .ct-header a:hover, #header a:hover {
	color: var(--bha-accent) !important;
}

/* ---- Footer ---- */

footer, .ct-footer, .site-footer, .footer-widgets, #colophon {
	background-color: #000 !important;
	border-top: 1px solid var(--bha-line) !important;
	color: var(--bha-muted) !important;
}

footer a, .ct-footer a, .site-footer a, #colophon a {
	color: var(--bha-fg) !important;
}

/* ---- Buttons ---- */

.wp-block-button__link,
.stk-button,
button:not(.bha-player-btn):not(.bha-hero-cta) {
	border-radius: 2px !important;
}

.stk-link.stk-button,
.wp-block-stackable-button .stk-link,
a.stk-button {
	color: var(--bha-fg) !important;
	border-color: var(--bha-fg) !important;
}

.stk-button:before,
.stk-link.stk-button:before,
a.stk-button:before {
	border-color: var(--bha-fg) !important;
}

.stk-button:hover:before,
.stk-link.stk-button:hover:before {
	border-color: var(--bha-accent) !important;
}

/* ---- Homepage hero ---- */

.wp-block-cover__image-background {
	filter: grayscale(1) contrast(1.05);
}

.bha-hero-card {
	max-width: 640px;
	margin: 0 auto;
	text-align: center;
}

.bha-eyebrow {
	font-family: 'Archivo', sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.28em;
	font-size: 0.72rem;
	color: var(--bha-muted);
	margin: 0 0 22px;
}

.bha-hero-title {
	font-family: 'Fraunces', serif;
	font-weight: 600;
	font-size: clamp(2.8rem, 8vw, 5.2rem);
	line-height: 1;
	margin: 0 0 20px;
	color: var(--bha-fg);
}

.bha-hero-tagline {
	font-family: 'Fraunces', serif;
	font-style: italic;
	font-weight: 400;
	font-size: 1.15rem;
	color: var(--bha-muted);
	max-width: 480px;
	margin: 0 auto 34px;
	line-height: 1.5;
}

.bha-hero-cta {
	font-family: 'Archivo', sans-serif;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-size: 0.8rem;
	background: transparent;
	color: var(--bha-fg);
	border: 1px solid var(--bha-fg);
	padding: 14px 30px;
	cursor: pointer;
	transition: all 0.25s ease;
}

.bha-hero-cta:hover {
	background: var(--bha-fg);
	color: #0a0a0a !important;
}

.bha-hero-cta::before {
	content: '\25B8\0020';
}

.bha-card {
	font-family: 'Archivo', sans-serif;
	color: var(--bha-fg);
}

.bha-history {
	border-top: 1px solid var(--bha-line);
	padding-top: 24px;
}

.bha-history h2 {
	font-family: 'Fraunces', serif;
}

/* ---- Sticky global player ---- */

#bha-player {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 99999;
	background: rgba(10, 10, 10, 0.94);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-top: 1px solid var(--bha-line);
	color: var(--bha-fg);
	font-family: 'Archivo', sans-serif;
}

#bha-player .bha-player-inner {
	max-width: 1100px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 10px 20px;
}

#bha-player .bha-player-btn {
	flex: 0 0 auto;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	border: 1px solid var(--bha-fg);
	background: transparent;
	color: var(--bha-fg);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 15px;
	line-height: 1;
}

#bha-player .bha-player-btn:hover {
	background: var(--bha-fg);
	color: #0a0a0a;
}

#bha-player .bha-live-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--bha-accent);
	flex: 0 0 auto;
	animation: bha-pulse 1.8s infinite;
}

@keyframes bha-pulse {
	0% { box-shadow: 0 0 0 0 rgba(179, 38, 30, 0.55); }
	70% { box-shadow: 0 0 0 8px rgba(179, 38, 30, 0); }
	100% { box-shadow: 0 0 0 0 rgba(179, 38, 30, 0); }
}

#bha-player .bha-np-art {
	width: 40px;
	height: 40px;
	border-radius: 4px;
	overflow: hidden;
	background: #111;
	flex: 0 0 auto;
}

#bha-player .bha-np-art img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

#bha-player .bha-now-playing {
	flex: 1 1 auto;
	min-width: 0;
}

#bha-player .bha-np-label {
	font-size: 0.62rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--bha-muted);
}

#bha-player .bha-np-track {
	font-family: 'Fraunces', serif;
	font-size: 0.95rem;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#bha-player .bha-vol {
	width: 80px;
	accent-color: var(--bha-accent);
}

@media (max-width: 640px) {
	#bha-player .bha-np-art,
	#bha-player .bha-vol {
		display: none;
	}
}