/* ==========================================================================
   ROUND 4 — UGIS PROFESSIONAL ALUMNI (Alumni Roster page + Alumni & Results)
   Reference: overtimeathletes.com "Real Athletes. Real Results." — big-number
   stats band, then a grid of square athlete cards. Built on the existing
   UGIS brand tokens/section system in style.css (dark base, red/orange
   accents, Oswald display, square 1:1 cards, hover lift).
   See CLAUDE-EDITS-ROUND-4.md §3.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Roster page hero / strapline
   -------------------------------------------------------------------------- */
.ugis-roster-hero {
	text-align: center;
}
.ugis-roster-hero__strap {
	display: inline-block;
	font-family: var(--ugis-font-display);
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--ugis-orange);
	letter-spacing: 0.03em;
	margin: 0.25rem 0 0;
}

/* --------------------------------------------------------------------------
   Stats band — big numbers, OTA-style
   -------------------------------------------------------------------------- */
.ugis-stats-band {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.5rem;
	text-align: center;
}
.ugis-stat-tile {
	padding: 1.5rem 1rem;
	border-left: 1px solid var(--ugis-line);
}
.ugis-stat-tile:first-child {
	border-left: none;
}
.ugis-stat-tile__number {
	display: block;
	font-family: var(--ugis-font-display);
	font-weight: 700;
	font-size: clamp(2.5rem, 5vw, 3.75rem);
	line-height: 1;
	background: var(--ugis-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	margin-bottom: 0.5rem;
}
.ugis-stat-tile__label {
	display: block;
	font-family: var(--ugis-font-display);
	font-size: 0.85rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--ugis-gray);
}
.ugis-section--offwhite .ugis-stat-tile__label,
.ugis-section--light .ugis-stat-tile__label,
.ugis-section--yellow .ugis-stat-tile__label {
	color: var(--ugis-dark-text-muted);
}
.ugis-section--offwhite .ugis-stat-tile,
.ugis-section--light .ugis-stat-tile,
.ugis-section--yellow .ugis-stat-tile {
	border-left-color: var(--ugis-light-line);
}

@media (max-width: 768px) {
	.ugis-stats-band {
		grid-template-columns: repeat(2, 1fr);
		gap: 1rem 0.5rem;
	}
	.ugis-stat-tile:nth-child(3) {
		border-left: none;
	}
}

/* --------------------------------------------------------------------------
   Roster grid — matches the Gallery page's "Alumni" section (Mike, Round-4
   review): the same square 1:1 tiles, 4-up desktop / 3 tablet / 2 mobile,
   1rem gap, bordered + rounded, hover-zoom — mirroring .ugis-gallery-grid /
   .ugis-gallery-tile in style.css so the two pages read as one system. The
   roster keeps a name + credential caption beneath each tile (that's what
   makes it a roster rather than a plain photo gallery).
   -------------------------------------------------------------------------- */
.ugis-roster-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: 1rem;
	row-gap: 1.75rem;
}
.ugis-roster-grid > * { min-width: 0; }
@media (max-width: 960px) {
	.ugis-roster-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media (max-width: 600px) {
	.ugis-roster-grid {
		grid-template-columns: repeat(2, 1fr);
		column-gap: 0.75rem;
		row-gap: 1.25rem;
	}
}

/* Tile = square athlete photo (pre-composed square "-card" images — blurred
   backdrop + full athlete in frame, nobody cropped out), styled to match
   .ugis-gallery-tile; name + credential caption sits BENEATH it. */
.ugis-roster-card {
	position: relative;
	text-align: center;
}
.ugis-roster-card__photo {
	position: relative;
	aspect-ratio: 1 / 1;
	border-radius: 6px;
	overflow: hidden;
	background-color: var(--ugis-surface);
	border: 1px solid var(--ugis-line);
	transition: border-color 0.25s ease;
}
.ugis-roster-card:hover .ugis-roster-card__photo {
	border-color: var(--ugis-orange);
}
.ugis-roster-card__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.35s ease;
}
.ugis-roster-card:hover .ugis-roster-card__img {
	transform: scale(1.08);
}

/* No-photo variant — same square footprint, brand-gradient tile with
   initials standing in for the missing photo, kept visually consistent
   with the photo cards rather than looking like a broken/empty slot. */
.ugis-roster-card__photo--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	background:
		radial-gradient(ellipse at top left, rgba(224, 26, 34, 0.28), transparent 62%),
		radial-gradient(ellipse at bottom right, rgba(247, 148, 29, 0.22), transparent 62%),
		var(--ugis-surface);
}
.ugis-roster-card__initials {
	font-family: var(--ugis-font-display);
	font-weight: 700;
	font-size: clamp(2.75rem, 6vw, 3.75rem);
	background: var(--ugis-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	letter-spacing: 0.02em;
}

/* Caption beneath the photo — kept tight to its OWN photo (small top
   padding) so the name reads as attached to the card above it; the row-gap
   on .ugis-roster-grid (not this padding) is what separates it from the
   next row's card down. */
.ugis-roster-card__caption {
	padding: 0.4rem 0.25rem 0;
}
.ugis-roster-card__name {
	margin: 0 0 0.15rem;
	font-family: var(--ugis-font-display);
	font-weight: 600;
	font-size: 1.1rem;
	line-height: 1.2;
	color: var(--ugis-white);
}
.ugis-roster-card__credential {
	margin: 0;
	font-size: 0.85rem;
	line-height: 1.35;
	color: var(--ugis-gray);
}
/* Light-section variants keep the name readable if the grid is ever
   placed on an off-white/light band. */
.ugis-section--offwhite .ugis-roster-card__name,
.ugis-section--light .ugis-roster-card__name,
.ugis-section--yellow .ugis-roster-card__name {
	color: var(--ugis-dark-text);
}
.ugis-section--offwhite .ugis-roster-card__credential,
.ugis-section--light .ugis-roster-card__credential,
.ugis-section--yellow .ugis-roster-card__credential {
	color: var(--ugis-dark-text-muted);
}

@media (max-width: 768px) {
	.ugis-roster-card__initials {
		font-size: 2.5rem;
	}
}

/* --------------------------------------------------------------------------
   Open-item callout (visible marker for Mike, distinct from the dashed
   .ugis-placeholder style used for missing assets — this is a note about
   pending confirmation, not a missing element).
   -------------------------------------------------------------------------- */
.ugis-open-item {
	border-left: 3px solid var(--ugis-orange);
	background: rgba(247, 148, 29, 0.06);
	padding: 0.85rem 1.25rem;
	border-radius: 0 6px 6px 0;
	font-size: 0.85rem;
	color: var(--ugis-gray);
	margin: 1.5rem 0 0;
}
.ugis-open-item strong {
	color: var(--ugis-orange);
}
.ugis-section--offwhite .ugis-open-item,
.ugis-section--light .ugis-open-item,
.ugis-section--yellow .ugis-open-item {
	color: var(--ugis-dark-text-muted);
}

/* Alumni-section slideshow source: hidden tiles that feed the gallery
   lightbox for the "View Slideshow" button on the Gallery page's UGIS
   Professional Alumni section — never shown as a visible grid. */
.ugis-alumni-slideshow-source {
	display: none !important;
}