/**
 * SEO/a11y cover-img helper.
 *
 * Replaces invisible CSS `background-image` containers with a real <img> tag so:
 *   - Google Image Search & Yoast image sitemap can index it (CSS bgs are invisible to image crawlers).
 *   - The image still renders visually identical to a `background-size:cover; background-position:center` bg.
 *   - The original inline `background-image` style stays in markup as an instant-paint fallback; the
 *     browser dedupes the request (same URL, same cache entry).
 *
 * Mechanics:
 *   - `:has(> .qts-bg-img)` makes the parent a positioning + stacking context.
 *     `isolation:isolate` confines the negative z-index of the image so it cannot escape and paint
 *     behind unrelated ancestors.
 *   - The image fills the parent with `inset:0` + `object-fit:cover` (matches `background-size:cover`).
 *   - `pointer-events:none` keeps it from intercepting clicks intended for the underlying CTA/anchor.
 *
 * Modern-browser CSS only. `:has()` is Baseline 2023; `isolation`/`object-fit` are universal.
 */
:has(> .qts-bg-img) {
	position: relative;
	isolation: isolate;
}

.qts-bg-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	z-index: -1;
	pointer-events: none;
}