/**
 * Interview & columnists block (section_interview).
 * Same card rules as the articles block; 3-column grid with the first card
 * spanning two columns. The cover-image pattern differs per breakpoint, so cards
 * carry explicit cell classes (set in PHP) instead of relying on :nth-child.
 *
 * Desktop: 8 posts, cover at 1 / 5 / 6.
 * Mobile:  first 5 posts, cover at 1 / 4.
 */

.interview__title {
	margin: 0 0 24px;
	font-size: var(--font-size-h2);
	font-weight: var(--font-weight-bold);
	line-height: 1.1;
}

.interview__grid {
	display: grid;
	gap: 15px;
}

@media (min-width: 768px) {
	.interview__grid {
		grid-template-columns: repeat(3, 1fr);
		grid-auto-rows: minmax(235px, auto);
	}

	.interview__cell--wide {
		grid-column: span 2;
	}

	.interview__cell--wide .post-card__title {
		font-size: var(--font-size-h2);
	}

	/* Cards rendered only for the mobile pattern. */
	.interview__cell--mobile-only {
		display: none;
	}
}

@media (max-width: 767px) {
	.interview__cell--wide {
		min-height: 300px;
	}

	/* Cards rendered only for the desktop pattern / hidden on mobile. */
	.interview__cell--desktop-only,
	.interview__cell--mobile-hidden {
		display: none;
	}
}