/**
 * /wp-content/themes/hasakah-media-network/assets/css/sovereign-hub.css
 *
 * Sovereign Broadcast Matrix v1.01.6
 */

.hmn-sovereign-hub-root,
.hmn-broadcast-matrix {
	--hub-bg: #071426;
	--hub-text: #ffffff;
	--hub-accent: #ff8a1f;
	--hub-gold: #d4af37;
	color: var(--hub-text);
	direction: rtl;
	position: relative;
}

.hmn-front-page {
	background:
		radial-gradient(circle at 18% 10%, color-mix(in srgb, var(--hmn-primary), transparent 82%), transparent 360px),
		var(--hmn-bg);
	min-height: 100vh;
}

.hmn-front-hero {
	align-items: center;
	background:
		linear-gradient(90deg, rgba(7, 20, 38, .92), rgba(7, 20, 38, .72)),
		radial-gradient(circle at 30% 20%, rgba(255, 138, 31, .16), transparent 380px),
		url("assets/images/hasakah-media-network-logo.png");
	background-position: center;
	background-repeat: no-repeat;
	background-size: min(56vw, 640px), auto, min(48vw, 560px);
	border-bottom: 1px solid rgba(255,255,255,.12);
	display: flex;
	min-height: clamp(540px, 72vh, 820px);
	padding: clamp(32px, 7vw, 110px);
	position: relative;
}

.hmn-hero-inner {
	max-width: 920px;
	position: relative;
	z-index: 2;
}

.hmn-front-hero h1 {
	color: #fff;
	font-size: clamp(3.6rem, 9vw, 8.6rem);
	letter-spacing: -.075em;
	line-height: .92;
	margin: 12px 0 22px;
	text-shadow: 0 18px 70px rgba(0,0,0,.42);
}

.hmn-front-hero p {
	color: rgba(255,255,255,.74);
	font-size: clamp(1.1rem, 2vw, 1.4rem);
	line-height: 1.9;
	margin: 0 0 30px;
	max-width: 760px;
}

.hmn-hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.hmn-button-ghost {
	background: rgba(255,255,255,.08) !important;
	border: 1px solid rgba(255,255,255,.18) !important;
	color: #fff !important;
}

.hmn-broadcast-fallback,
.hmn-front-news,
.hmn-studio-anchor {
	margin-inline: auto;
	max-width: 1560px;
	padding: clamp(34px, 5vw, 78px) clamp(18px, 4vw, 56px);
}

.hmn-seo-broadcast-grid {
	display: grid;
	gap: 18px;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
}

.hmn-seo-broadcast-grid article {
	background:
		radial-gradient(circle at 18% 0%, rgba(255, 138, 31, .18), transparent 42%),
		linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
	border: 1px solid rgba(255,255,255,.14);
	border-radius: 28px;
	box-shadow: 0 24px 80px rgba(0,0,0,.22);
	padding: 24px;
}

.hmn-seo-broadcast-grid h3 {
	color: #fff;
	font-size: 1.45rem;
	margin: 0 0 10px;
}

.hmn-seo-broadcast-grid p {
	color: rgba(255,255,255,.68);
	line-height: 1.8;
	margin: 0;
}

.hmn-broadcast-matrix {
	display: grid;
	gap: 24px;
	isolation: isolate;
	position: relative;
}

.hmn-hub-hero,
.hmn-broadcast-layout,
.hmn-bento-card,
.hmn-broadcast-stage,
.hmn-live-studio-player,
.hmn-transcript-log {
	backdrop-filter: blur(26px) saturate(1.35);
	-webkit-backdrop-filter: blur(26px) saturate(1.35);
	background:
		radial-gradient(circle at var(--spot-x, 20%) var(--spot-y, 0%), color-mix(in srgb, var(--hub-accent), transparent 78%), transparent 42%),
		linear-gradient(135deg, color-mix(in srgb, var(--hub-bg), white 8%), color-mix(in srgb, var(--hub-bg), transparent 22%));
	border: 1px solid rgba(255,255,255,.14);
	border-radius: 34px;
	box-shadow:
		0 34px 120px rgba(0,0,0,.32),
		inset 0 1px 0 rgba(255,255,255,.15);
}

.hmn-hub-hero {
	padding: clamp(30px, 5vw, 64px);
	position: relative;
	overflow: hidden;
}

.hmn-hub-hero::after {
	background:
		linear-gradient(90deg, transparent, rgba(255,255,255,.16), transparent);
	content: "";
	height: 1px;
	inset-inline: 28px;
	position: absolute;
	top: 0;
}

.hmn-hub-hero span,
.hmn-stage-header span,
.hmn-bento-stat,
.hmn-live-player-control span {
	color: var(--hub-accent);
	font-weight: 950;
	letter-spacing: .10em;
	text-transform: uppercase;
}

.hmn-hub-hero h1 {
	color: var(--hub-text);
	font-size: clamp(2.5rem, 7vw, 6.6rem);
	letter-spacing: -.06em;
	line-height: .95;
	margin: 12px 0 16px;
}

.hmn-hub-hero p {
	color: color-mix(in srgb, var(--hub-text), transparent 28%);
	font-size: clamp(1rem, 1.7vw, 1.28rem);
	line-height: 1.9;
	margin: 0;
	max-width: 880px;
}

.hmn-broadcast-layout {
	display: grid;
	gap: 18px;
	grid-template-columns: minmax(300px, .9fr) minmax(0, 1.3fr);
	padding: 16px;
}

.hmn-bento-grid {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-rows: minmax(158px, auto);
	perspective: 1200px;
}

.hmn-bento-card {
	--tilt-x: 0deg;
	--tilt-y: 0deg;
	appearance: none;
	color: var(--hub-text);
	cursor: pointer;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 158px;
	padding: 22px;
	position: relative;
	text-align: start;
	transform:
		perspective(900px)
		rotateX(var(--tilt-x))
		rotateY(var(--tilt-y))
		translate3d(0, 0, 0);
	transform-style: preserve-3d;
	transition:
		transform 120ms ease,
		border-color 160ms ease,
		box-shadow 160ms ease;
	will-change: transform;
}

.hmn-bento-card.wide {
	grid-column: span 2;
}

.hmn-bento-card.tall {
	grid-row: span 2;
}

.hmn-bento-card::before {
	background:
		radial-gradient(circle at var(--spot-x, 50%) var(--spot-y, 20%), rgba(255,255,255,.22), transparent 180px);
	border-radius: inherit;
	content: "";
	inset: 0;
	opacity: .5;
	pointer-events: none;
	position: absolute;
	transform: translateZ(32px);
}

.hmn-bento-card.is-active {
	border-color: color-mix(in srgb, var(--hub-accent), transparent 42%);
	box-shadow:
		0 34px 110px color-mix(in srgb, var(--hub-accent), transparent 78%),
		0 26px 90px rgba(0,0,0,.34);
}

.hmn-bento-card h3 {
	font-size: clamp(1.35rem, 2.2vw, 2rem);
	margin: 12px 0 10px;
	position: relative;
	z-index: 2;
}

.hmn-bento-card p {
	color: color-mix(in srgb, var(--hub-text), transparent 32%);
	line-height: 1.8;
	margin: 0;
	position: relative;
	z-index: 2;
}

.hmn-bento-stat {
	position: relative;
	z-index: 2;
}

.hmn-broadcast-stage {
	min-height: 640px;
	overflow: hidden;
	padding: clamp(18px, 3vw, 30px);
	position: relative;
}

.hmn-stage-header {
	margin-bottom: 18px;
	position: relative;
	z-index: 3;
}

.hmn-stage-header h2 {
	color: var(--hub-text);
	font-size: clamp(2rem, 5vw, 4.2rem);
	letter-spacing: -.05em;
	line-height: 1;
	margin: 8px 0 12px;
}

.hmn-stage-header p {
	color: color-mix(in srgb, var(--hub-text), transparent 30%);
	line-height: 1.9;
	margin: 0;
	max-width: 720px;
}

.hmn-hub-identity-mark {
	inset: 0;
	opacity: .30;
	pointer-events: none;
	position: absolute;
	z-index: 0;
}

.hmn-hub-identity-mark svg {
	height: 100%;
	width: 100%;
}

.hmn-id-stars {
	fill: #dc2626;
	font-size: 58px;
	font-weight: 900;
	filter: drop-shadow(0 0 16px rgba(220,38,38,.48));
}

.hmn-id-title {
	fill: none;
	font-family: "Amiri", "Traditional Arabic", serif;
	font-size: 76px;
	font-weight: 900;
	stroke: var(--hub-gold);
	stroke-width: 1.5px;
}

.hmn-id-wheat,
.hmn-id-grain {
	fill: none;
	stroke: var(--hub-gold);
	stroke-linecap: round;
	stroke-width: 5px;
}

.hmn-id-grain {
	opacity: .74;
	stroke-width: 2.2px;
}

.hmn-live-studio-player {
	display: grid;
	gap: 14px;
	padding: 16px;
	position: relative;
	z-index: 3;
}

.hmn-live-video-shell {
	background:
		radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--hub-accent), transparent 72%), transparent 45%),
		linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 28px;
	min-height: 320px;
	overflow: hidden;
	position: relative;
}

.hmn-live-video {
	display: block;
	height: 100%;
	min-height: 320px;
	object-fit: cover;
	width: 100%;
}

.hmn-live-signal-visual {
	align-items: center;
	display: flex;
	gap: 14px;
	height: 320px;
	justify-content: center;
}

.hmn-live-signal-visual span {
	animation: hmn-signal-pulse 1.4s ease-in-out infinite alternate;
	background: linear-gradient(180deg, var(--hub-accent), var(--hub-gold));
	border-radius: 999px;
	height: calc(80px + var(--level) * 120px);
	width: 18px;
}

.hmn-live-signal-visual span:nth-child(2) {
	animation-delay: -.3s;
}

.hmn-live-signal-visual span:nth-child(3) {
	animation-delay: -.6s;
}

@keyframes hmn-signal-pulse {
	from { filter: brightness(.8); transform: scaleY(.82); }
	to { filter: brightness(1.18); transform: scaleY(1); }
}

.hmn-subtitle-overlay {
	inset: auto 16px 16px 16px;
	position: absolute;
	z-index: 4;
}

.hmn-subtitle-overlay p {
	background: rgba(0,0,0,.58);
	border: 1px solid rgba(255,255,255,.16);
	border-radius: 18px;
	color: #fff;
	font-size: clamp(1rem, 1.4vw, 1.25rem);
	font-weight: 900;
	line-height: 1.8;
	margin: 6px 0 0;
	padding: 10px 14px;
	text-shadow: 0 2px 14px rgba(0,0,0,.5);
}

.hmn-subtitle-overlay .is-interim {
	opacity: .72;
}

.hmn-live-player-control {
	align-items: center;
	display: flex;
	gap: 14px;
	justify-content: space-between;
}

.hmn-live-player-control h3 {
	font-size: 1.3rem;
	margin: 6px 0;
}

.hmn-live-player-control p {
	color: color-mix(in srgb, var(--hub-text), transparent 34%);
	line-height: 1.7;
	margin: 0;
}

.hmn-live-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	justify-content: flex-end;
}

.hmn-live-actions button {
	background: linear-gradient(135deg, var(--hub-accent), var(--hub-gold));
	border: 0;
	border-radius: 999px;
	color: #08111f;
	cursor: pointer;
	font-weight: 950;
	padding: 11px 16px;
}

.hmn-live-actions button:disabled {
	cursor: not-allowed;
	filter: grayscale(1);
	opacity: .55;
}

.hmn-transcript-log {
	margin-top: 14px;
	padding: 18px;
	position: relative;
	z-index: 3;
}

.hmn-transcript-log h3 {
	font-size: 1.25rem;
	margin: 0 0 10px;
}

.hmn-transcript-log p {
	color: color-mix(in srgb, var(--hub-text), transparent 24%);
	line-height: 1.8;
	margin: 8px 0 0;
}

@media (max-width: 1100px) {
	.hmn-broadcast-layout {
		grid-template-columns: 1fr;
	}

	.hmn-bento-card.tall {
		grid-row: auto;
	}
}

@media (max-width: 720px) {
	.hmn-front-hero {
		background-size: min(80vw, 360px);
		padding: 34px 18px;
	}

	.hmn-bento-grid {
		grid-template-columns: 1fr;
	}

	.hmn-bento-card.wide {
		grid-column: auto;
	}

	.hmn-live-player-control {
		align-items: stretch;
		flex-direction: column;
	}

	.hmn-live-actions {
		justify-content: flex-start;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hmn-bento-card,
	.hmn-live-signal-visual span {
		animation: none !important;
		transition: none !important;
		transform: none !important;
	}
}