/*
 * Vimeo background loop — covers its positioned parent.
 *
 * The wrapper is a SIZE CONTAINER and the iframe sizes itself in
 * container-query units: as wide/tall as the container demands for a
 * 16:9 clip to cover it, centred, cropping only the overflow axis.
 * (Sizing against the viewport here was the "blurry/zoomed" bug: a
 * card-sized container got a viewport-sized player, i.e. a massive
 * centre crop.) In an exactly-16:9 slot — the work cards — this
 * resolves to a perfect 100% × 100% fit, no crop at all.
 */

.tek-vimeo-bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
	z-index: 0;
	pointer-events: none;
	container-type: size;
}

.tek-vimeo-bg iframe {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	/* Fallback for browsers without container-query units: plain fill,
	   correct in 16:9 slots, letterboxed elsewhere. */
	width: 100%;
	height: 100%;
	border: 0;
}

@supports (width: 100cqw) {
	.tek-vimeo-bg iframe {
		width: max(100cqw, calc(100cqh * 16 / 9));
		height: max(100cqh, calc(100cqw * 9 / 16));
	}
}

@media (max-width: 767px) {
	.tek-vimeo-bg--hide-mobile {
		display: none;
	}
}