/* Blur Lazy Load – frontend styles */

img.bll-lazy {
	filter: blur(var(--bll-blur, 20px));
	transition: filter var(--bll-fade, 400ms) ease-out, opacity var(--bll-fade, 400ms) ease-out;
	opacity: 1;
	/* Avoid the browser upscaling the tiny placeholder awkwardly */
	background-repeat: no-repeat;
	background-size: cover;
}

img.bll-loaded {
	filter: blur(0);
}

img.bll-lazy.bll-loading {
	opacity: 0.85;
}

/* Respect users who've asked for reduced motion */
@media (prefers-reduced-motion: reduce) {
	img.bll-lazy {
		transition: none;
	}
}
