/* =====================================================================
   Vignettes des cartes de la liste du blog (page « Blog »)
   La structure et les dimensions sont déjà définies par la feuille de la
   page Blog (.wbl-image, ratio 3/2, coins arrondis) : ici, seulement le
   confort visuel de l'image injectée.
   ===================================================================== */

.wbl-page .wbl-image {
	background: #eef1f4;
}

.wbl-page .wbl-image img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	margin: 0;
	border: 0;
	transition: transform .4s ease;
}

.wbl-page .wbl-card:hover .wbl-image img,
.wbl-page .wbl-card:focus-within .wbl-image img {
	transform: scale(1.035);
}

/* pas de zoom ni de transition si l'utilisateur préfère moins d'animations */
@media (prefers-reduced-motion: reduce) {
	.wbl-page .wbl-image img,
	.wbl-page .wbl-card:hover .wbl-image img {
		transition: none;
		transform: none;
	}
}