/**
 * PX Video Module - Static CSS
 *
 * Module-specific layout only. Shared play button / facade styles
 * live in /assets/css/px-video.css (globally enqueued).
 */


/* ── Section ──────────────────────────────────── */

.px-video-section {
	padding: var(--space-d3) 0;
}

/* Offset background split to center on content when heading is present */
.px-video-section:has(.px-heading) {
	--bg-split-offset: calc((var(--text-d3) * 1.37 + var(--space-d2)) / 2);
}


/* ── Container (centered, max-width) ─────────── */

.px-video-section__container {
	display: flex;
	flex-direction: column;
	max-width: var(--row-width);
	width: 100%;
	margin: var(--space-d3) auto;
}


/* ── Player ─────────────────────────────────── */

.px-video-section__player {
	margin-top: var(--space-d2);
}


/* ── Caption ─────────────────────────────────── */

.px-video-section__caption {
	margin: var(--space-d1) auto 0;
	padding: 0 var(--space-d3);

	font-family: var(--font-body);
	font-size: var(--text-body);
	font-style: italic;
	font-weight: 400;
	line-height: var(--lh-relaxed);
	color: var(--text-muted, var(--text-base));
	text-align: center;
}


/* ── Responsive — Mobile (≤ 768px) ──────────── */