/**
 * Сетка портфолио.
 *
 * В собранном style.css ширина плитки и её боковые линии заданы правилами
 * nth-child с шагом 7. Пока список не менялся, рисунок держался; но любой
 * новый проект сдвигал нумерацию и переразмечал всю сетку — старые карточки
 * меняли ширину и порядок.
 *
 * Здесь ширина берётся из класса, который шаблон считает по полю записи.
 * Рисунок для существующих кейсов остался прежним: 4-4-4 / 6-6 / 4-8.
 */

@media (min-width: 993px) {

	/* снимаем разметку по позиции — дальше всё задаётся классами */
	.grid-portfolio > .portfolio-cell {
		border-left: 0;
		border-right: 0;
	}

	.grid-portfolio > .portfolio-cell--w4 {
		-ms-grid-column-span: 4;
		grid-column: span 4;
	}

	.grid-portfolio > .portfolio-cell--w6 {
		-ms-grid-column-span: 6;
		grid-column: span 6;
	}

	.grid-portfolio > .portfolio-cell--w8 {
		-ms-grid-column-span: 8;
		grid-column: span 8;
	}

	/* боковые линии — у крайних плиток ряда, как и раньше */
	.grid-portfolio > .portfolio-cell--row-start {
		border-left: 0.0625rem solid #e5e6e6;
	}

	.grid-portfolio > .portfolio-cell--row-end {
		border-right: 0.0625rem solid #e5e6e6;
	}
}

/*
 * Обложка, подготовленная отдельно под сетку, показывается целиком:
 * высота плитки подстраивается под пропорции файла, а не режет композицию.
 * Плитки без своей обложки работают как раньше.
 */
.portfolio-projects__wrapper .portfolio-card__image--cover,
.portfolio-projects__wrapper .portfolio-card__image--cover .box {
	height: auto;
}

.portfolio-card__image--cover .box {
	aspect-ratio: var(--cover-ratio, 1);
}

.portfolio-card__image--cover .box img {
	-o-object-fit: contain;
	   object-fit: contain;
}
