/**
 * Petoniki 0.27.1 unified thumbnail crop.
 *
 * This layer intentionally targets card/list thumbnails only. Brand marks,
 * avatars, hero slides, advertisements, article feature images, and profile
 * detail photography retain their own presentation ratios.
 */

:where(
	.xk-profile-card__media,
	.xk-guide-card__media,
	.xk-list-item__media,
	.xk-feeding-story__media,
	.xk-family-story__media,
	.xk-home-extra__article-media,
	.xk-life-card__media,
	.xk-life-card__media > a,
	.wp-block-query .wp-block-post-featured-image,
	.wp-block-latest-posts__featured-image
) {
	box-sizing: border-box;
	height: auto !important;
	aspect-ratio: 4 / 3;
	overflow: hidden;
}

:where(
	.xk-profile-card__media,
	.xk-guide-card__media,
	.xk-list-item__media,
	.xk-feeding-story__media,
	.xk-family-story__media,
	.xk-home-extra__article-media,
	.xk-life-card__media > a,
	.wp-block-query .wp-block-post-featured-image,
	.wp-block-latest-posts__featured-image
) > :where(img, picture),
:where(
	.xk-profile-card__media,
	.xk-guide-card__media,
	.xk-list-item__media,
	.xk-feeding-story__media,
	.xk-family-story__media,
	.xk-home-extra__article-media,
	.xk-life-card__media > a,
	.wp-block-query .wp-block-post-featured-image,
	.wp-block-latest-posts__featured-image
) img {
	display: block;
	width: 100%;
	height: 100% !important;
	object-fit: cover;
	object-position: center;
}

/* The profile-card shade must use the exact same crop box as its image. */
.xk-profile-card__shade {
	width: 100%;
	height: auto !important;
	aspect-ratio: 4 / 3;
}

/* Life-stage thumbnails are positioned independently inside their cards. */
.xk-life-card__media {
	height: auto !important;
}

/* Keep horizontal card media aligned to the top of its text column. */
.xk-guide-card__media,
.xk-list-item__media {
	align-self: start;
}
