/* ═════════════════════════════════════════════════════════════════
   SECTION BACKGROUNDS — Shared video/parallax background system
   Used by sections 4 (Stats) through 8 (Implementation).
   ═════════════════════════════════════════════════════════════════ */

/* ── Shared wrapper ── */
.section-bg-wrap {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
	z-index: 0;
}
/* Inner extended top/bottom so ±60px parallax never shows a hard edge */
.section-bg-inner {
	position: absolute;
	inset: -80px 0;
	will-change: transform;
}

/* Section 4 (stats): full-cover video across the full section,
   then a 30% cream overlay dims it globally (via ::after below),
   and the right stat items add 60% cream + blur for the glass effect. */
.stats .section-bg-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 1;
}

/* Thin cream wash over the full video so text stays readable on the left */
.stats .section-bg-inner::after {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(245, 243, 239, 0.15);
	pointer-events: none;
}

/* Sections 5–8: full-cover video, alternating flip via scaleX(-1).
   (FAQ video rules now live in shared components/faq.css so BAO and CAO
   inherit the same treatment.) */
.numbers .section-bg-video,
.comp    .section-bg-video,
.testi   .section-bg-video,
.impl    .section-bg-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: .45;
}
.section-bg-wrap.flip .section-bg-video {
	transform: scaleX(-1);
}

/* Sections 5–8 need position:relative + overflow:hidden to contain their backgrounds */
.numbers, .comp, .testi, .impl {
	position: relative;
	overflow: hidden;
}