/**
 * polytec Stadium — partner logo grid
 *
 * Used by [stadium_partner], [sport_partner], [media_partner],
 * [featured_stadium_partner] in VenuesLive\PolytecStadium\Shortcodes\PartnerGrid.
 *
 * Designed to work in two contexts without re-styling:
 *   1. Inside the existing Enfold footer (.logogridfooter, white bg, dark text)
 *   2. Inside page content on the dedicated Partners page (white bg, dark text)
 *   3. Post-cutover: inside the new FSE theme's footer block-pattern (charcoal
 *      bg, white text) — the `color: inherit` rules below handle this.
 */

.partner-grid {
	margin: 2.5rem 0;
}

.partner-grid__heading {
	text-align: center;
	font-size: clamp(1.1rem, 2vw, 1.6rem);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	margin: 0 0 1.5rem;
	color: inherit;
}

.partner-grid__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.5rem 1.25rem;
	align-items: center;
}

/* Forced 5-column layout on desktop. Each row has exactly 5 items; any
   overflow row centres via the parent's `justify-content: center` (e.g.
   11 partners → 2 rows of 5 + a centred row of 1). Widths shrink at
   breakpoints to keep logos legible. The width calc accounts for the
   inter-item column-gap: 4 gaps between 5 items = 4 * 1.25rem = 5rem. */
.partner-grid__item {
	margin: 0;
	padding: 0.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 80px;
	box-sizing: border-box;
	width: calc((100% - 5rem) / 5);
}

@media ( max-width: 1100px ) {
	/* 3 columns at tablet — 2 gaps of 1.25rem = 2.5rem */
	.partner-grid__item { width: calc((100% - 2.5rem) / 3); }
}

@media ( max-width: 640px ) {
	/* 2 columns at mobile — 1 gap of 1.25rem */
	.partner-grid__item { width: calc((100% - 1.25rem) / 2); }
}

.partner-grid__logo {
	max-width: 100%;
	max-height: 80px;
	height: auto;
	width: auto;
	object-fit: contain;
	display: block;
}

/* SVG logos — WP can't read intrinsic dimensions from SVG files without extra
   image-library support, so the IMG element ships with no width/height attrs
   (see PartnerGrid::render). Force a consistent rendered height; aspect ratio
   is preserved by the SVG's own viewBox. */
.partner-grid__logo--svg {
	width: auto;
	height: 80px;
	max-width: 100%;
	max-height: 80px;
}

/* Featured-grid logos sit slightly larger (visual hierarchy) — applies to both
   raster and SVG variants. */
.partner-grid--featured-stadium-partner .partner-grid__logo--svg {
	height: 96px;
	max-height: 96px;
}

.partner-grid__name {
	font-size: 0.95rem;
	text-align: center;
	color: inherit;
}

/* Footer placement: tighter vertical rhythm when grids stack inside the footer. */
.logogridfooter .partner-grid {
	margin: 1.25rem 0;
}

.logogridfooter .partner-grid + .partner-grid {
	margin-top: 0.25rem;
}

/* Featured grid sits above the regular sport/stadium grids in the footer —
   give it a tiny visual lift so the hierarchy reads. */
.partner-grid--featured-stadium-partner .partner-grid__item {
	min-height: 96px;
}
.partner-grid--featured-stadium-partner .partner-grid__logo {
	max-height: 96px;
}
