/* id:Theme — модуль posts-mosaic. Подключается только там, где есть .id-posts-mosaic (inc/assets.php). */

/* --- Blog mosaic 2+5 --- */

.id-posts-mosaic .wp-block-post-template {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--wp--preset--spacing--30, 1rem);
}

@media (min-width: 782px) {
	.id-posts-mosaic .wp-block-post-template {
		grid-template-columns: repeat(10, 1fr);
	}

	.id-posts-mosaic .wp-block-post:nth-child(-n + 2) {
		grid-column: span 5;
	}

	.id-posts-mosaic .wp-block-post:nth-child(n + 3) {
		grid-column: span 2;
	}
}

.id-mosaic-card {
	position: relative;
	overflow: hidden;
	border-radius: 8px;
}

.id-mosaic-card .wp-block-post-featured-image {
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	line-height: 0;
}

.id-mosaic-card .wp-block-post-featured-image a {
	display: block;
	height: 100%;
}

.id-mosaic-card .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
}

.id-mosaic-card__body {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	padding: var(--wp--preset--spacing--30, 1rem);
	background: linear-gradient(transparent, rgb(0 0 0 / 70%));
}

.id-mosaic-card__body .wp-block-post-title,
.id-mosaic-card__body .wp-block-post-title a,
.id-mosaic-card__body .wp-block-post-date {
	color: #fff;
}

.id-mosaic-card__body .wp-block-post-title {
	font-size: var(--wp--preset--font-size--medium, 1.125rem);
	margin: 0 0 0.25rem;
}