/*
 * GameRStar News — "Related News" section (single post template)
 * Card visuals reuse the shared .gsn-card look (gsn-card.css); this file
 * only lays out the section heading and the responsive grid, matching the
 * pattern already used by gsn-news-grid.css / gsn-upcoming.css.
 */

.gsn-related {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 clamp( 20px, 6vw, 80px ) clamp( 40px, 6vw, 88px );
}

.gsn-related__title {
	margin: 0 0 var( --space-4 );
	font-family: var( --font-display );
	font-size: var( --font-size-h2 );
	font-weight: 800;
	color: var( --color-text-primary );
}

.gsn-related__grid {
	display: grid;
	grid-template-columns: repeat( 4, 1fr );
	align-items: stretch;
	gap: var( --grid-gap );
}

@media ( max-width: 1200px ) {
	.gsn-related__grid {
		grid-template-columns: repeat( 3, 1fr );
	}
}

@media ( max-width: 768px ) {
	.gsn-related__grid {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media ( max-width: 480px ) {
	.gsn-related__grid {
		grid-template-columns: 1fr;
	}
}
