/*
Theme Name: Reese Sabatka
Author: Reese Sabatka
Description: Football recruiting website for Reese Sabatka.
Version: 1.0
*/


/* =========================================================
   VARIABLES
========================================================= */

:root {
	--navy: #062b5c;
	--navy-dark: #031a38;
	--navy-black: #020e1d;

	--crimson: #922c46;
	--crimson-light: #b83757;
	--crimson-dark: #6e1d33;

	--white: #ffffff;
	--off-white: #f6f7f9;
	--gray: #68707c;
	--light-gray: #e5e8ec;

	--body-font: Arial, Helvetica, sans-serif;
}


/* =========================================================
   GLOBAL
========================================================= */

html {
	scroll-behavior: smooth;
	scroll-padding-top: 82px;
	overflow-x: clip;
}

body {
	margin: 0;
	background: #fff;
	color: #18202a;
	font-family: var(--body-font);
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	width: 100%;
	max-width: 100%;
	overflow-x: clip;	
}
/* Make sizing predictable everywhere */

*,
*::before,
*::after {
	box-sizing: border-box;
}


/* Bootstrap columns must be allowed to shrink */

.row > * {
	min-width: 0;
}


/* Grid/Flex children must be allowed to shrink */

[class*="col-"] {
	min-width: 0;
}


/* Media can never force the page wider */

img,
video,
iframe,
svg {
	max-width: 100%;
}
/* Long text/links shouldn't force containers wider */

p,
a,
span,
strong,
small {
	overflow-wrap: break-word;
}
img {
	max-width: 100%;
	height: auto;
}

a {
	color: var(--crimson);
}

section {
	position: relative;
}

.section-padding {
	padding: 90px 0;
}


/* =========================================================
   HEADER
========================================================= */

.site-header {
	position: sticky;
	top: 0;
	z-index: 1000;

	background: rgba(255, 255, 255, 0.97);
	border-bottom: 1px solid rgba(6, 43, 92, 0.12);
	box-shadow: 0 5px 25px rgba(0, 0, 0, 0.05);

	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

.site-header .navbar {
	min-height: 82px;
	padding: 8px 0;
}

.header-logo {
	width: 72px;
	height: 48px;
	object-fit: contain;
}

.brand-name {
	display: flex;
	align-items: center;
	gap: 6px;

	font-size: 1.35rem;
	font-weight: 900;
	line-height: 1;
	letter-spacing: -0.04em;
}

.brand-first {
	color: var(--navy);
}

.brand-last {
	color: var(--crimson);
}

.site-header .nav-link {
	position: relative;

	margin: 0 5px;
	padding: 30px 11px !important;

	color: var(--navy);

	font-size: 0.76rem;
	font-weight: 800;
	letter-spacing: 0.05em;
	text-transform: uppercase;

	transition: color 0.2s ease;
}

.site-header .nav-link::after {
	content: "";

	position: absolute;

	left: 50%;
	bottom: 18px;

	width: 0;
	height: 3px;

	background-color: var(--crimson);

	transform: translateX(-50%);

	transition: width 0.25s ease;
}

.site-header .nav-link:hover,
.site-header .nav-link.active {
	color: var(--crimson);
}

.site-header .nav-link:hover::after,
.site-header .nav-link.active::after {
	width: calc(100% - 22px);
}

.site-header .nav-link:hover {
	color: var(--crimson);
}

.site-header .nav-link:hover::after {
	width: calc(100% - 22px);
}


/* =========================================================
   HERO
========================================================= */

.recruit-hero {
	position: relative;
	min-height: 650px;
	overflow: hidden;

	background-image:
		linear-gradient(
			90deg,
			rgba(2, 14, 29, 0.25) 0%,
			rgba(2, 14, 29, 0.10) 45%,
			rgba(2, 14, 29, 0.30) 100%
		),
		url("assets/images/hero-background.jpg");

	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;

	color: #fff;
}

.recruit-hero::before {
	content: "";

	position: absolute;
	inset: 0;

	background:
		linear-gradient(
			0deg,
			rgba(0, 0, 0, 0.55) 0%,
			transparent 55%
		);

	pointer-events: none;
}

.recruit-hero::after {
	content: "";

	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;

	height: 3px;

	background: var(--crimson);
}

.min-vh-hero {
	min-height: 650px;
}

.hero-player-column {
	position: relative;
	align-self: stretch;
}

.hero-player {
	position: absolute;

	left: 50%;
	bottom: 0;

	width: min(600px, 120%);
	max-width: none;
	max-height: 620px;

	object-fit: contain;
	object-position: bottom;

	transform: translateX(-50%);

	filter:
		drop-shadow(0 15px 25px rgba(0, 0, 0, 0.35));
}

.hero-content {
	position: relative;
	z-index: 5;

	max-width: 680px;
	padding: 75px 0 75px 20px;
}


.hero-eyebrow {
	margin-bottom: 12px;

	color: rgba(255, 255, 255, 0.75);

	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.4em;
	text-transform: uppercase;
}

.hero-title {
	margin: 0;

	font-size: clamp(4rem, 7vw, 6.8rem);
	font-weight: 900;
	line-height: 0.82;
	letter-spacing: -0.055em;
	text-transform: uppercase;
}

.hero-title span,
.hero-title strong {
	display: block;
}

.hero-title span {
	color: #fff;
}

.hero-title strong {
	color: var(--crimson-light);
	font-weight: 900;

	text-shadow:
		0 5px 20px rgba(0, 0, 0, 0.3);
}

.hero-school {
	position: relative;

	margin-top: 24px;

	color: #fff;

	font-size: clamp(1rem, 2vw, 1.4rem);
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.hero-number {
	margin-left: 15px;

	color: var(--crimson-light);

	font-size: 2.4rem;
	font-weight: 900;
	letter-spacing: 0;
}

.hero-rule {
	width: 100%;
	height: 3px;

	margin: 13px 0 18px;

	background: var(--crimson);
}

.hero-measurables {
	display: flex;
	flex-wrap: wrap;

	margin-bottom: 12px;
}

.hero-measurables span {
	position: relative;

	padding: 0 18px;

	font-size: 1.1rem;
	font-weight: 800;
	letter-spacing: 0.08em;
}

.hero-measurables span:first-child {
	padding-left: 0;
}

.hero-measurables span:not(:last-child)::after {
	content: "";

	position: absolute;
	top: 5px;
	right: 0;

	width: 1px;
	height: 18px;

	background: rgba(255, 255, 255, 0.4);
}

.hero-awards {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 25px;

	margin-top: 15px;

	color: rgba(255, 255, 255, 0.8);

	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.06em;
}

.hero-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;

	margin-top: 30px;
}


/* =========================================================
   BUTTONS
========================================================= */

.btn-recruit-primary,
.btn-recruit-outline {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;

	min-height: 48px;
	padding: 12px 24px;

	border-radius: 0;

	font-size: 0.8rem;
	font-weight: 800;
	letter-spacing: 0.045em;
	text-transform: uppercase;

	transition:
		transform 0.2s ease,
		background 0.2s ease,
		border-color 0.2s ease;
}

.btn-recruit-primary {
	border: 1px solid var(--crimson);
	background: var(--crimson);
	color: #fff;
}

.btn-recruit-primary:hover {
	border-color: var(--crimson-light);
	background: var(--crimson-light);
	color: #fff;

	transform: translateY(-2px);
}

.btn-recruit-outline {
	border: 1px solid rgba(255, 255, 255, 0.65);
	background: transparent;
	color: #fff;
}

.btn-recruit-outline:hover {
	border-color: #fff;
	background: #fff;
	color: var(--navy);

	transform: translateY(-2px);
}


/* =========================================================
   QUICK LINKS
========================================================= */

.quick-links {
	position: relative;
	z-index: 10;

	background: #fff;

	box-shadow: 0 8px 35px rgba(0, 0, 0, 0.08);
}

.quick-link {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;

	min-height: 100px;
	padding: 20px;

	border-right: 1px solid var(--light-gray);

	color: var(--navy);

	text-decoration: none;

	transition:
		background 0.2s ease,
		color 0.2s ease;
}

.quick-link:hover {
	background: var(--navy);
	color: #fff;
}

.quick-link i {
	color: var(--navy);

	font-size: 1.8rem;
}

.quick-link:hover i {
	color: var(--crimson-light);
}

.quick-link span {
	display: flex;
	flex-direction: column;
}

.quick-link strong {
	font-size: 0.8rem;
	font-weight: 900;
	text-transform: uppercase;
}

.quick-link small {
	margin-top: 2px;

	color: #7b838d;

	font-size: 0.7rem;
}

.quick-link:hover small {
	color: rgba(255, 255, 255, 0.7);
}


/* =========================================================
   HEADINGS
========================================================= */

.section-eyebrow {
	margin-bottom: 8px;

	color: var(--crimson);

	font-size: 0.8rem;
	font-weight: 800;
	letter-spacing: 0.25em;
	text-transform: uppercase;
}

.section-title {
	margin: 0;

	color: var(--navy);

	font-size: clamp(2.5rem, 5vw, 4rem);
	font-weight: 900;
	line-height: 0.95;
	letter-spacing: -0.045em;
	text-transform: uppercase;
}

.section-title span {
	display: block;

	color: var(--crimson);
}

.section-title-light {
	color: #fff;
}

.title-line {
	width: 50px;
	height: 4px;

	margin: 20px 0;

	background: var(--crimson);
}


/* =========================================================
   HIGHLIGHTS
========================================================= */

.highlights-section {
	background:
		linear-gradient(
			135deg,
			#fff 0%,
			#f4f6f8 100%
		);
	position: relative;
}
/* ---------------------------------------------------------
   LATEST REEL — WEEKS 4–6
--------------------------------------------------------- */

.highlights-latest {
	padding-top: 90px;
	padding-bottom: 90px;

	background:
		linear-gradient(
			135deg,
			#ffffff 0%,
			#f4f6f8 100%
		);
}


/* ---------------------------------------------------------
   ARCHIVE REEL — WEEKS 1–5
--------------------------------------------------------- */

.highlights-archive {
	padding-top: 90px;
	padding-bottom: 90px;

	background:
		linear-gradient(
			135deg,
			#eef2f6 0%,
			#f7f8fa 50%,
			#ffffff 100%
		);

	border-top: 1px solid rgba(6, 43, 92, 0.12);
}


/* Stronger visual transition between reels */

.highlights-archive::before {
	content: "";

	position: absolute;
	top: 0;
	left: 50%;

	width: min(1320px, calc(100% - 40px));
	height: 4px;

	background:
		linear-gradient(
			90deg,
			var(--navy) 0%,
			var(--navy) 72%,
			var(--crimson) 72%,
			var(--crimson) 100%
		);

	transform: translateX(-50%);
}


/* ---------------------------------------------------------
   OPTIONAL REEL LABEL
--------------------------------------------------------- */

.highlight-reel-label {
	display: inline-flex;
	align-items: center;
	gap: 8px;

	margin-bottom: 18px;
	padding: 6px 10px;

	background: var(--navy);

	color: #fff;

	font-size: .58rem;
	font-weight: 900;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.highlight-reel-label i {
	color: var(--crimson-light);
}


/* Archived reel gets a quieter label */

.highlights-archive .highlight-reel-label {
	background: #dfe4e9;
	color: var(--navy);
}


/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media (max-width: 767.98px) {

	.highlights-latest,
	.highlights-archive {
		padding-top: 65px;
		padding-bottom: 65px;
	}

	.highlights-archive::before {
		width: calc(100% - 30px);
	}

}
.video-frame {
	position: relative;

	padding: 7px;

	background: var(--navy);

	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.18);
}

.video-frame::before {
	content: "";

	position: absolute;

	left: -14px;
	bottom: -14px;

	width: 80%;
	height: 60%;

	z-index: -1;

	background: var(--crimson);
}

.video-frame video {
	width: 100%;
	height: 100%;
	object-fit: cover;

	background: #000;
}


/* =========================================================
   STATS
========================================================= */

.stats-section {
	position: relative;
	padding: 80px 0;
	overflow: hidden;

	background:
		radial-gradient(
			circle at 90% 10%,
			rgba(146, 44, 70, 0.14),
			transparent 32%
		),
		linear-gradient(
			120deg,
			#031a38 0%,
			#062b5c 55%,
			#092d58 100%
		);

	color: #fff;
}


/* Subtle field/grid texture */

.stats-section::before {
	content: "";
	position: absolute;
	inset: 0;

	background-image:
		linear-gradient(
			rgba(255, 255, 255, 0.018) 1px,
			transparent 1px
		),
		linear-gradient(
			90deg,
			rgba(255, 255, 255, 0.018) 1px,
			transparent 1px
		);

	background-size: 60px 60px;

	pointer-events: none;
}


.stats-section .container {
	position: relative;
	z-index: 2;
}


/* =========================================================
   HEADER
========================================================= */

.stats-header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 30px;

	margin-bottom: 35px;
	padding-bottom: 18px;

	border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}


.stats-eyebrow {
	margin-bottom: 5px;

	color: var(--crimson-light);

	font-size: 0.72rem;
	font-weight: 900;
	letter-spacing: 0.25em;
	text-transform: uppercase;
}


.stats-header h2 {
	margin: 0;

	color: #fff;

	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 900;
	line-height: 1;
	letter-spacing: -0.035em;
	text-transform: uppercase;
}


.stats-games {
	padding: 8px 14px;

	border: 1px solid rgba(255, 255, 255, 0.2);

	background: rgba(255, 255, 255, 0.05);

	color: rgba(255, 255, 255, 0.7);

	font-size: 0.65rem;
	font-weight: 800;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}


/* =========================================================
   PRIMARY STATS
========================================================= */

.stats-primary {
	display: grid;

	grid-template-columns:
		1.15fr
		1.15fr
		1.7fr;

	gap: 16px;
}


/* LARGE STAT */

.stat-hero {
	position: relative;

	display: flex;
	flex-direction: column;
	justify-content: center;

	min-height: 265px;
	padding: 30px;

	overflow: hidden;

	border: 1px solid rgba(255, 255, 255, 0.13);

	background:
		linear-gradient(
			145deg,
			rgba(255, 255, 255, 0.09),
			rgba(255, 255, 255, 0.025)
		);
}


.stat-hero::after {
	content: "";

	position: absolute;
	left: 0;
	bottom: 0;

	width: 100%;
	height: 4px;

	background: var(--crimson);
}


.stat-hero-icon {
	position: absolute;

	right: 20px;
	top: 18px;

	color: rgba(255, 255, 255, 0.07);

	font-size: 5rem;
}


.stat-hero-number {
	position: relative;
	z-index: 2;

	color: #fff;

	font-size: clamp(4.5rem, 7vw, 7rem);
	font-weight: 900;
	line-height: 0.8;
	letter-spacing: -0.06em;
}


.stat-hero-label {
	position: relative;
	z-index: 2;

	margin-top: 18px;

	color: #fff;

	font-size: 0.9rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}


.stat-hero-detail {
	position: relative;
	z-index: 2;

	display: flex;
	align-items: center;
	gap: 10px;

	margin-top: 9px;

	color: rgba(255, 255, 255, 0.55);

	font-size: 0.68rem;
	font-weight: 700;
	text-transform: uppercase;
}


.stat-hero-detail span {
	width: 3px;
	height: 3px;

	border-radius: 50%;

	background: var(--crimson-light);
}


/* =========================================================
   TFL FEATURE
========================================================= */

.stat-hero-featured {
	background:
		linear-gradient(
			145deg,
			rgba(146, 44, 70, 0.35),
			rgba(146, 44, 70, 0.08)
		);
}


.stat-hero-featured .stat-hero-number {
	color: #cf3f63;
}


.stat-rank {
	position: absolute;

	top: 20px;
	right: 20px;

	display: inline-flex;
	align-items: center;
	gap: 6px;

	padding: 6px 9px;

	background: var(--crimson);

	color: #fff;

	font-size: 0.55rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}


/* =========================================================
   SUPPORTING DEFENSIVE STATS
========================================================= */

.stats-support {
	display: grid;
	grid-template-columns: 1fr 1fr;

	gap: 1px;

	overflow: hidden;

	border: 1px solid rgba(255, 255, 255, 0.13);

	background: rgba(255, 255, 255, 0.12);
}


.support-stat {
	display: flex;
	align-items: center;
	gap: 16px;

	min-height: 132px;
	padding: 22px;

	background: rgba(3, 26, 56, 0.92);

	transition:
		background 0.2s ease,
		transform 0.2s ease;
}


.support-stat:hover {
	background: rgba(146, 44, 70, 0.18);
}


.support-icon {
	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 42px;

	width: 42px;
	height: 42px;

	border: 1px solid rgba(255, 255, 255, 0.14);

	color: var(--crimson-light);

	font-size: 1rem;
}


.support-stat > div:last-child {
	display: flex;
	flex-direction: column;
}


.support-stat strong {
	color: #fff;

	font-size: 2.25rem;
	font-weight: 900;
	line-height: 1;
}


.support-stat span {
	margin-top: 5px;

	color: rgba(255, 255, 255, 0.55);

	font-size: 0.62rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}


/* =========================================================
   LOWER ROW
========================================================= */

.stats-lower {
	display: grid;
	grid-template-columns: 1fr 1fr;

	gap: 16px;

	margin-top: 16px;
}


.stats-category {
	display: flex;
	align-items: stretch;

	min-height: 110px;

	border: 1px solid rgba(255, 255, 255, 0.12);

	background: rgba(255, 255, 255, 0.04);
}


.stats-category-heading {
	display: flex;
	align-items: center;
	gap: 13px;

	flex: 0 0 155px;

	padding: 20px;

	border-right: 1px solid rgba(255, 255, 255, 0.12);
}


.stats-category-heading i {
	color: var(--crimson-light);

	font-size: 1.35rem;
}


.stats-category-heading > div {
	display: flex;
	flex-direction: column;
}


.stats-category-heading small {
	color: rgba(255, 255, 255, 0.45);

	font-size: 0.55rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}


.stats-category-heading strong {
	color: #fff;

	font-size: 0.78rem;
	font-weight: 900;
	text-transform: uppercase;
}


.category-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);

	flex: 1;
}


.category-stats > div {
	display: flex;
	flex-direction: column;
	justify-content: center;

	padding: 15px;

	border-right: 1px solid rgba(255, 255, 255, 0.1);

	text-align: center;
}


.category-stats > div:last-child {
	border-right: 0;
}


.category-stats strong {
	color: #fff;

	font-size: 1.6rem;
	font-weight: 900;
	line-height: 1;
}


.category-stats span {
	margin-top: 7px;

	color: rgba(255, 255, 255, 0.5);

	font-size: 0.55rem;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}


.category-testing {
	grid-template-columns: repeat(3, 1fr);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1199.98px) {

	.stats-primary {
		grid-template-columns: 1fr 1fr;
	}

	.stats-support {
		grid-column: 1 / -1;
	}

	.support-stat {
		min-height: 105px;
	}

	.stats-support {
		grid-template-columns: repeat(4, 1fr);
	}

	.stats-lower {
		grid-template-columns: 1fr;
	}

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

	.stats-section {
		padding: 60px 0;
	}

	.stats-header {
		align-items: flex-start;
		flex-direction: column;

		gap: 12px;
	}

	.stats-primary {
		grid-template-columns: 1fr;
	}

	.stat-hero {
		min-height: 220px;
	}

	.stat-hero-number {
		font-size: 5.5rem;
	}

	.stats-support {
		grid-template-columns: 1fr 1fr;
	}



	.support-stat {
		min-height: 110px;
		padding: 17px;
	}

	.support-icon {
		display: none;
	}

	.stats-category {
		flex-direction: column;
	}

	.stats-category-heading {
		flex: auto;

		padding: 15px 18px;

		border-right: 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	}

	.category-stats {
		width: 100%;
	}

	.category-stats strong {
		font-size: 1.3rem;
	}

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 479.98px) {

	.stats-support {
		grid-template-columns: 1fr 1fr;
	}

	.category-stats {
		grid-template-columns: 1fr 1fr;
	}

	.category-testing {
		grid-template-columns: repeat(3, 1fr);
	}

	.category-stats > div {
		min-height: 85px;

		border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	}

}

/* =========================================================
   UPCOMING GAME
========================================================= */

.game-highlight-card.game-upcoming {
	position: relative;
	opacity: .58;
	filter: grayscale(1);
	background: #f2f3f5;
}


/* Keep content readable */

.game-highlight-card.game-upcoming .game-week,
.game-highlight-card.game-upcoming .game-info,
.game-highlight-card.game-upcoming .game-player-stats,
.game-highlight-card.game-upcoming .game-action {
	position: relative;
	z-index: 2;
}


/* Upcoming result */

.game-result-upcoming span {
	display: inline-flex;
	align-items: center;

	padding: 5px 9px;

	border: 1px solid #c8cdd3;

	background: #e5e8ec;

	color: #68707c;

	font-size: .58rem;
	font-weight: 900;
	letter-spacing: .1em;
	text-transform: uppercase;
}


/* Empty stat area */

.game-upcoming-message {
	grid-column: 1 / -1;

	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;

	width: 100%;
	min-height: 80px;

	color: #7b8189;

	font-size: .65rem;
	font-weight: 900;
	letter-spacing: .08em;
	text-transform: uppercase;
}


.game-upcoming-message i {
	font-size: 1rem;
}


/* Upcoming action */

.game-highlight-card.game-upcoming .game-coming-soon {
	cursor: default;
	background: #d9dde2;
	color: #737981;
}


/* No hover effects on upcoming game */

.game-highlight-card.game-upcoming:hover {
	transform: none;
	box-shadow: none;
}

/* =========================================================
   ABOUT
========================================================= */

.about-section {
	overflow: hidden;

	background: #fff;
}


/* Prevent Bootstrap columns/content from forcing overflow */

.about-section .row > * {
	min-width: 0;
}


/* =========================================================
   IMAGE
========================================================= */

.about-image-wrap {
	position: relative;

	width: 100%;
	max-width: 100%;

	padding: 0 20px 20px 0;
}


.about-image-wrap::before {
	content: "";

	position: absolute;
	left: -15px;
	bottom: 0;

	width: 85%;
	height: 85%;

	background: var(--crimson);

	z-index: 0;
}


.about-image-wrap img {
	position: relative;
	z-index: 1;

	display: block;

	width: 100%;
	max-width: 100%;
	min-height: 450px;

	object-fit: cover;
}


/* =========================================================
   COPY
========================================================= */

.about-copy {
	max-width: 700px;

	font-size: 1.05rem;
}


/* =========================================================
   PROFILE GRID
========================================================= */

.profile-grid {
	display: grid;

	grid-template-columns:
		repeat(4, minmax(0, 1fr));

	width: 100%;
	max-width: 100%;

	margin-top: 35px;
	padding-top: 30px;

	border-top: 1px solid var(--light-gray);
}


.profile-item {
	display: flex;
	align-items: center;
	gap: 12px;

	min-width: 0;

	padding: 10px 18px;

	border-right: 1px solid var(--light-gray);
}


.profile-item:first-child {
	padding-left: 0;
}


.profile-item:last-child {
	border-right: 0;
}


.profile-item i {
	flex: 0 0 auto;

	color: var(--navy);

	font-size: 1.5rem;
}


.profile-item span {
	display: flex;
	flex-direction: column;

	min-width: 0;
}


.profile-item small {
	color: #818894;

	font-size: 0.62rem;
	font-weight: 700;
	line-height: 1.25;

	text-transform: uppercase;
}


.profile-item strong {
	color: var(--navy);

	font-size: 0.78rem;
	font-weight: 900;
	line-height: 1.3;

	overflow-wrap: anywhere;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

	.profile-grid {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));
	}


	.profile-item {
		padding: 15px;
		border-bottom: 1px solid var(--light-gray);
	}


	.profile-item:first-child {
		padding-left: 15px;
	}


	.profile-item:nth-child(2n) {
		border-right: 0;
	}


	.profile-item:nth-last-child(-n + 2) {
		border-bottom: 0;
	}

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

	.about-section .row {
		--bs-gutter-x: 1.5rem;
		--bs-gutter-y: 2.5rem;
	}


	.about-image-wrap {
		padding: 0 14px 14px 0;
	}


	.about-image-wrap::before {
		left: -8px;

		width: 85%;
	}


	.about-image-wrap img {
		min-height: 0;

		aspect-ratio: 5 / 6;

		object-fit: cover;
	}


	.about-copy {
		font-size: 1rem;
	}


	.profile-grid {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));

		margin-top: 28px;
		padding-top: 20px;
	}


	.profile-item {
		gap: 10px;

		padding: 15px 10px;
	}


	.profile-item:first-child {
		padding-left: 10px;
	}


	.profile-item i {
		font-size: 1.25rem;
	}

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 479.98px) {

	.about-image-wrap {
		padding-right: 10px;
		padding-bottom: 10px;
	}


	.profile-item {
		gap: 8px;

		padding: 14px 8px;
	}


	.profile-item:first-child {
		padding-left: 8px;
	}


	.profile-item i {
		font-size: 1.1rem;
	}


	.profile-item small {
		font-size: 0.55rem;
	}


	.profile-item strong {
		font-size: 0.72rem;
	}

}

/* =========================================================
   ACADEMICS
========================================================= */

.academics-section {
	position: relative;

	padding: 80px 0;

	overflow: hidden;

	background:
		linear-gradient(
			125deg,
			var(--navy-dark),
			var(--navy)
		);

	color: rgba(255, 255, 255, 0.8);
}


/* Prevent Bootstrap columns from being forced wider
   by content inside the academic card */

.academics-section .row > * {
	min-width: 0;
}


.academics-section p {
	max-width: 680px;

	margin-bottom: 0;

	color: rgba(255, 255, 255, 0.75);
}


/* =========================================================
   ACADEMIC CARD
========================================================= */

.academic-card {
	display: grid;

	grid-template-columns:
		repeat(3, minmax(0, 1fr));

	width: 100%;
	max-width: 100%;

	overflow: hidden;

	border: 1px solid rgba(255, 255, 255, 0.2);

	background: rgba(255, 255, 255, 0.05);

	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}


.academic-card > div {
	display: flex;
	flex-direction: column;
	justify-content: center;

	min-width: 0;

	padding: 25px;

	border-right: 1px solid rgba(255, 255, 255, 0.15);
}


.academic-card > div:last-child {
	border-right: 0;
}


.academic-card small {
	color: rgba(255, 255, 255, 0.55);

	font-size: 0.65rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}


.academic-card strong {
	min-width: 0;

	margin-top: 4px;

	color: #fff;

	font-size: 1.1rem;
	font-weight: 800;
	line-height: 1.3;

	overflow-wrap: anywhere;
	word-break: normal;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

	.academics-section {
		padding: 70px 0;
	}


	.academic-card {
		margin-top: 20px;
	}

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

	.academics-section {
		padding: 60px 0;
	}


	.academics-section .row {
		--bs-gutter-x: 1.5rem;
		--bs-gutter-y: 2rem;
	}


	.academic-card {
		grid-template-columns: 1fr;

		margin-top: 0;
	}


	.academic-card > div {
		width: 100%;

		padding: 20px;

		border-right: 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.15);
	}


	.academic-card > div:last-child {
		border-bottom: 0;
	}


	.academic-card strong {
		font-size: 1rem;
	}

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 479.98px) {

	.academics-section {
		padding: 50px 0;
	}


	.academics-section .section-title {
		font-size: clamp(2.2rem, 12vw, 2.7rem);
	}


	.academic-card > div {
		padding: 18px;
	}

}

/* =========================================================
   CONTACT
========================================================= */

.contact-section {
	position: relative;

	padding: 100px 0;

	overflow: hidden;

	background:
		radial-gradient(
			circle at 15% 50%,
			rgba(146, 44, 70, 0.16),
			transparent 32%
		),
		linear-gradient(
			120deg,
			#020c18 0%,
			#031a38 45%,
			#062b5c 100%
		);

	color: #fff;
}


.contact-section::before {
	content: "6";

	position: absolute;

	left: -30px;
	top: 50%;

	color: rgba(255, 255, 255, 0.025);

	font-size: 32rem;
	font-weight: 900;
	line-height: 1;

	transform: translateY(-50%);

	pointer-events: none;
}


.contact-section .container {
	position: relative;
	z-index: 2;
}


/* =========================================================
   CONTACT CONTENT
========================================================= */

.contact-content h2 {
	margin: 0;

	color: #fff;

	font-size: clamp(3rem, 6vw, 5rem);
	font-weight: 900;
	line-height: 0.9;
	letter-spacing: -0.055em;
	text-transform: uppercase;
}


.contact-content h2 span {
	display: block;

	color: var(--crimson-light);
}


.contact-line {
	width: 55px;
	height: 4px;

	margin: 24px 0;

	background: var(--crimson);
}


.contact-content > p {
	max-width: 500px;

	margin-bottom: 35px;

	color: rgba(255, 255, 255, 0.68);

	font-size: 1rem;
	line-height: 1.7;
}


/* =========================================================
   PROFILE DETAILS
========================================================= */

.contact-profile {
	display: grid;
	grid-template-columns: 1fr 1fr;

	max-width: 520px;

	border-top: 1px solid rgba(255, 255, 255, 0.12);
	border-left: 1px solid rgba(255, 255, 255, 0.12);
}


.contact-profile-item {
	display: flex;
	align-items: center;
	gap: 13px;

	min-height: 85px;
	padding: 16px;

	border-right: 1px solid rgba(255, 255, 255, 0.12);
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}


.contact-profile-icon {
	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 38px;

	width: 38px;
	height: 38px;

	background: rgba(146, 44, 70, 0.18);

	color: var(--crimson-light);
}


.contact-profile-item > div:last-child {
	display: flex;
	flex-direction: column;
}


.contact-profile-item small {
	color: rgba(255, 255, 255, 0.42);

	font-size: 0.57rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}


.contact-profile-item strong {
	color: #fff;

	font-size: 0.75rem;
	font-weight: 800;
}


.recruiting-motto {
	margin-top: 30px;

	color: rgba(255, 255, 255, 0.4);

	font-size: 0.6rem;
	font-weight: 800;
	letter-spacing: 0.25em;
}


.recruiting-motto span {
	margin: 0 7px;

	color: var(--crimson);
}
/* =========================================================
   DIRECT CONTACT
========================================================= */

.direct-contact {
	display: flex;
	flex-direction: column;

	max-width: 520px;

	margin-top: 20px;

	border: 1px solid rgba(255, 255, 255, 0.14);

	background: rgba(255, 255, 255, 0.035);
}


.direct-contact-item {
	display: flex;
	align-items: center;
	gap: 15px;

	min-height: 72px;
	padding: 14px 18px;

	border-bottom: 1px solid rgba(255, 255, 255, 0.12);

	color: #fff;

	text-decoration: none;

	transition:
		background 0.2s ease,
		border-color 0.2s ease;
}


.direct-contact-item:last-child {
	border-bottom: 0;
}


.direct-contact-item:hover {
	background: rgba(146, 44, 70, 0.18);

	color: #fff;
}


.direct-contact-icon {
	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 42px;

	width: 42px;
	height: 42px;

	background: var(--crimson);

	color: #fff;

	font-size: 1rem;

	transition:
		background 0.2s ease,
		transform 0.2s ease;
}


.direct-contact-item:hover .direct-contact-icon {
	background: var(--crimson-light);

	transform: translateY(-2px);
}


.direct-contact-item > div:last-child {
	display: flex;
	flex-direction: column;

	min-width: 0;
}


.direct-contact-item small {
	margin-bottom: 2px;

	color: rgba(255, 255, 255, 0.45);

	font-size: 0.56rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}


.direct-contact-item strong {
	color: #fff;

	font-size: 0.85rem;
	font-weight: 800;
	line-height: 1.3;
}


/* MOBILE */

@media (max-width: 575.98px) {

	.direct-contact-item {
		padding: 13px 14px;
	}

	.direct-contact-item strong {
		font-size: 0.78rem;
	}

}

/* =========================================================
   FORM CARD
========================================================= */

.recruiting-form {
	overflow: hidden;

	border: 1px solid rgba(255, 255, 255, 0.15);

	background: #fff;

	box-shadow:
		0 30px 70px rgba(0, 0, 0, 0.28);
}


.recruiting-form-header {
	display: flex;
	align-items: center;
	gap: 15px;

	padding: 22px 28px;

	background: var(--crimson);

	color: #fff;
}


.form-icon {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 44px;
	height: 44px;

	border: 1px solid rgba(255, 255, 255, 0.3);

	font-size: 1.1rem;
}


.recruiting-form-header span {
	display: block;

	margin-bottom: 2px;

	color: rgba(255, 255, 255, 0.65);

	font-size: 0.58rem;
	font-weight: 800;
	letter-spacing: 0.15em;
	text-transform: uppercase;
}


.recruiting-form-header h3 {
	margin: 0;

	color: #fff;

	font-size: 1.3rem;
	font-weight: 900;
	text-transform: uppercase;
}


.recruiting-form-body {
	padding: 30px;
}


/* =========================================================
   GRAVITY FORMS
========================================================= */

.recruiting-form .gform_wrapper {
	margin: 0;
}


.recruiting-form .gform_fields {
	row-gap: 18px;
}


.recruiting-form .gfield_label {
	margin-bottom: 7px !important;

	color: var(--navy);

	font-size: 0.68rem !important;
	font-weight: 900 !important;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}


.recruiting-form input[type="text"],
.recruiting-form input[type="email"],
.recruiting-form input[type="tel"],
.recruiting-form input[type="url"],
.recruiting-form select,
.recruiting-form textarea {
	width: 100% !important;

	padding: 12px 14px !important;

	border: 1px solid #d9dde3 !important;
	border-radius: 0 !important;

	background: #f8f9fa !important;

	color: #18202a !important;

	font-size: 0.9rem !important;

	box-shadow: none !important;

	transition:
		border-color 0.2s ease,
		background 0.2s ease;
}


.recruiting-form input:focus,
.recruiting-form select:focus,
.recruiting-form textarea:focus {
	outline: 0 !important;

	border-color: var(--crimson) !important;

	background: #fff !important;

	box-shadow:
		0 0 0 3px rgba(146, 44, 70, 0.08) !important;
}


.recruiting-form textarea {
	min-height: 125px;

	resize: vertical;
}


/* Submit */

.recruiting-form .gform_footer {
	margin-top: 20px !important;
	padding: 0 !important;
}


.recruiting-form .gform_button {
	min-height: 50px !important;

	padding: 12px 28px !important;

	border: 1px solid var(--crimson) !important;
	border-radius: 0 !important;

	background: var(--crimson) !important;

	color: #fff !important;

	font-size: 0.75rem !important;
	font-weight: 900 !important;
	letter-spacing: 0.07em;
	text-transform: uppercase;

	transition:
		background 0.2s ease,
		transform 0.2s ease;
}


.recruiting-form .gform_button:hover {
	border-color: var(--crimson-light) !important;

	background: var(--crimson-light) !important;

	transform: translateY(-2px);
}


/* Required indicator */

.recruiting-form .gfield_required {
	color: var(--crimson) !important;
}


/* Validation */

.recruiting-form .gfield_validation_message,
.recruiting-form .validation_message {
	color: #a01d3e !important;

	font-size: 0.75rem !important;
}


.recruiting-form .gform_validation_errors {
	border: 1px solid var(--crimson) !important;
	border-radius: 0 !important;

	background: rgba(146, 44, 70, 0.05) !important;

	box-shadow: none !important;
}


/* Confirmation */

.recruiting-form .gform_confirmation_message {
	padding: 25px;

	border-left: 4px solid var(--crimson);

	background: #f5f7f9;

	color: var(--navy);

	font-weight: 700;
}


/* =========================================================
   MOBILE
========================================================= */
@media (max-width: 575.98px) {

	.contact-profile {
		grid-template-columns: 1fr;
	}

	.recruiting-form-body {
		padding: 22px 18px;
	}

	.recruiting-form-header {
		padding: 20px;
	}

	.recruiting-motto {
		line-height: 2;
	}

}


/* =========================================================
   FOOTER
========================================================= */

.site-footer {
	padding: 35px 0 20px;

	background: #010914;
	color: rgba(255, 255, 255, 0.6);
}

.footer-brand {
	color: #fff;

	font-size: 1.25rem;
	font-weight: 900;
}

.footer-brand span {
	color: var(--crimson-light);
}

.footer-meta {
	margin-top: 3px;

	font-size: 0.72rem;
}

.footer-social {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 42px;
	height: 42px;

	margin-left: 5px;

	border: 1px solid rgba(255, 255, 255, 0.2);

	color: #fff;

	text-decoration: none;

	transition: 0.2s ease;
}

.footer-social:hover {
	border-color: var(--crimson);
	background: var(--crimson);
	color: #fff;
}

.footer-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;

	margin-top: 25px;
	padding-top: 18px;

	border-top: 1px solid rgba(255, 255, 255, 0.1);

	font-size: 0.7rem;
}

.footer-bottom a {
	color: rgba(255, 255, 255, 0.7);

	text-decoration: none;
}

.footer-bottom a:hover {
	color: #fff;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

	html {
		scroll-padding-top: 70px;
	}

	.site-header .navbar {
		min-height: 70px;
	}

	.site-header .nav-link {
		padding: 12px 0 !important;
	}

	.site-header .nav-link::after {
		display: none;
	}

	.navbar-collapse {
		padding: 15px 0;
	}

	.recruit-hero {
		background-position: 58% center;
	}

	.min-vh-hero {
		min-height: auto;
	}

	.hero-content {
		max-width: 700px;

		margin: 0 auto;
		padding: 70px 0 30px;

		text-align: center;
	}

	.hero-measurables,
	.hero-awards,
	.hero-buttons {
		justify-content: center;
	}

	.hero-player-column {
		min-height: 500px;
	}

	.hero-player {
		max-height: 500px;
	}

	.profile-grid {
		grid-template-columns:
			repeat(2, minmax(0, 1fr));
	}

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

	.section-padding {
		padding: 65px 0;
	}

	.header-logo {
		width: 55px;
		height: 38px;
	}

	.brand-name {
		font-size: 1rem;
	}

	.hero-content {
		padding-top: 50px;
	}

	.hero-title {
		font-size: clamp(3.4rem, 17vw, 5rem);
	}

	.hero-school {
		font-size: 0.85rem;
	}

	.hero-number {
		display: block;

		margin: 8px 0 0;

		font-size: 2rem;
	}

	.hero-measurables {
		gap: 7px 0;
	}

	.hero-measurables span {
		padding: 0 10px;

		font-size: 0.85rem;
	}

	.hero-player-column {
		min-height: 400px;
	}

	.hero-player {
		width: 115%;
		max-height: 410px;
	}

	.quick-link {
		min-height: 90px;

		border-bottom: 1px solid var(--light-gray);
	}

	.section-title {
		font-size: 2.7rem;
	}


	.profile-grid {
		grid-template-columns: 1fr 1fr;
	}

	.profile-item {
		padding: 15px 10px;

		border-bottom: 1px solid var(--light-gray);
	}

	.footer-bottom {
		flex-direction: column;
		gap: 10px;
	}

}

/* =========================================================
   GAME HIGHLIGHTS
========================================================= */

.game-highlights-section {
	padding: 90px 0;

	background: #f4f6f8;
}


.game-highlights-heading {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 50px;

	margin-bottom: 40px;
}


.game-highlights-heading > p {
	max-width: 440px;

	margin: 0 0 5px;

	color: #68707c;

	font-size: 0.95rem;
	line-height: 1.65;
}


/* =========================================================
   GAME LIST
========================================================= */

.game-highlight-list {
	border-top: 4px solid var(--navy);

	background: #fff;

	box-shadow:
		0 15px 45px rgba(3, 26, 56, 0.08);
}


.game-highlight-card {
	display: grid;
	grid-template-columns:
		110px
		minmax(230px, 1.2fr)
		minmax(420px, 2fr)
		210px;

	align-items: stretch;

	min-height: 155px;

	border-bottom: 1px solid #e2e5e9;

	background: #fff;

	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease;
}


.game-highlight-card:last-child {
	border-bottom: 0;
}


.game-highlight-card.has-video:hover {
	position: relative;
	z-index: 2;

	transform: translateY(-2px);

	box-shadow:
		0 12px 30px rgba(3, 26, 56, 0.12);
}


/* =========================================================
   WEEK
========================================================= */

.game-week {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	border-right: 1px solid #e2e5e9;

	background: var(--navy-dark);

	color: #fff;
}


.game-week span {
	margin-bottom: 3px;

	color: rgba(255, 255, 255, 0.45);

	font-size: 0.58rem;
	font-weight: 900;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}


.game-week strong {
	font-size: 2.8rem;
	font-weight: 900;
	line-height: 1;

	letter-spacing: -0.06em;
}


/* =========================================================
   GAME INFO
========================================================= */

.game-info {
	display: flex;
	flex-direction: column;
	justify-content: center;

	padding: 25px 28px;

	border-right: 1px solid #e2e5e9;
}


.game-meta {
	margin-bottom: 7px;

	color: #8a919a;

	font-size: 0.59rem;
	font-weight: 800;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}


.game-meta span {
	margin: 0 5px;

	color: var(--crimson);
}


.game-info h3 {
	margin: 0 0 12px;

	color: var(--navy);

	font-size: 1.35rem;
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -0.025em;
	text-transform: uppercase;
}


.game-location {
	margin-right: 4px;

	color: var(--crimson);

	font-size: 0.7em;
}


.game-result {
	display: flex;
	align-items: center;
	gap: 8px;
}


.game-win {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	width: 25px;
	height: 25px;

	background: var(--crimson);

	color: #fff;

	font-size: 0.7rem;
	font-weight: 900;
}


.game-result strong {
	color: #1d2732;

	font-size: 1rem;
	font-weight: 900;
}


.game-result small {
	color: #7e8791;

	font-size: 0.62rem;
	font-weight: 800;
}


/* =========================================================
   GAME STATS
========================================================= */

.game-player-stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);

	align-self: center;

	padding: 20px 25px;
}


.game-player-stats > div {
	display: flex;
	flex-direction: column;
	justify-content: center;

	min-height: 52px;

	padding: 7px 12px;

	border-right: 1px solid #e5e8ec;
}


.game-player-stats > div:nth-child(3n) {
	border-right: 0;
}


.game-player-stats strong {
	color: var(--navy);

	font-size: 1.35rem;
	font-weight: 900;
	line-height: 1;
}


.game-player-stats span {
	margin-top: 4px;

	color: #858d97;

	font-size: 0.53rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}


.game-player-stats .featured-game-stat strong {
	color: var(--crimson);
}


/* =========================================================
   VIDEO ACTION
========================================================= */

.game-action {
	display: flex;
	align-items: stretch;

	border-left: 1px solid #e2e5e9;
}


.game-video-button,
.game-coming-soon {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 13px;

	width: 100%;

	padding: 20px;

	border: 0;

	text-align: left;
}


.game-action .game-video-button {
	background: var(--crimson);
	color: #fff;
	cursor: pointer;
	transition: background 0.2s ease;
}

.game-action .game-video-button:hover {
	background: var(--crimson-light);
}


.game-action .game-video-button > i {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 43px;
	height: 43px;

	border: 1px solid rgba(255, 255, 255, 0.35);

	font-size: 0.9rem;
}


.game-action .game-video-button span,
.game-action .game-coming-soon span {
	display: flex;
	flex-direction: column;
}


.game-action .game-video-button small,
.game-action .game-coming-soon small {
	margin-bottom: 2px;

	font-size: 0.53rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}


.game-action .game-video-button small {
	color: rgba(255, 255, 255, 0.65);
}


.game-action .game-video-button strong {
	color: #fff;

	font-size: 0.7rem;
	font-weight: 900;
	text-transform: uppercase;
}


.game-coming-soon {
	background: #f5f6f7;

	color: #9ca2aa;
}


.game-coming-soon > i {
	font-size: 1.35rem;
}


.game-coming-soon small {
	color: #a6abb2;
}


.game-coming-soon strong {
	color: #737b85;

	font-size: 0.68rem;
	font-weight: 900;
	text-transform: uppercase;
}


/* =========================================================
   VIDEO MODAL
========================================================= */

.game-video-modal .modal-content {
	overflow: hidden;

	border: 0;
	border-radius: 0;

	background: var(--navy-black);

	box-shadow:
		0 30px 100px rgba(0, 0, 0, 0.55);
}


.game-video-modal .modal-header {
	padding: 18px 22px;

	border: 0;

	background: var(--navy-dark);

	color: #fff;
}


.modal-eyebrow {
	margin-bottom: 2px;

	color: var(--crimson-light);

	font-size: 0.55rem;
	font-weight: 900;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}


.game-video-modal .modal-title {
	margin: 0;

	color: #fff;

	font-size: 1rem;
	font-weight: 900;
	text-transform: uppercase;
}


.game-video-modal .modal-body {
	padding: 0;

	background: #000;
}


.game-video-modal video {
	width: 100%;
	height: 100%;

	background: #000;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1199.98px) {

	.game-highlight-card {
		grid-template-columns:
			90px
			minmax(220px, 1fr)
			1.5fr;
	}


	.game-action {
		grid-column: 2 / -1;

		min-height: 65px;

		border-top: 1px solid #e2e5e9;
		border-left: 0;
	}


	.game-video-button,
	.game-coming-soon {
		justify-content: flex-start;

		padding-left: 28px;
	}

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

	.game-highlights-section {
		padding: 65px 0;
	}


	.game-highlights-heading {
		display: block;
	}


	.game-highlights-heading > p {
		margin-top: 20px;
	}


	.game-highlight-list {
		display: flex;
		flex-direction: column;
		gap: 16px;

		border-top: 0;

		background: transparent;

		box-shadow: none;
	}


	.game-highlight-card {
		display: grid;

		grid-template-columns: 70px 1fr;

		min-height: 0;

		border: 1px solid #e0e4e8;

		box-shadow:
			0 8px 25px rgba(3, 26, 56, 0.07);
	}


	.game-week {
		grid-row: 1 / 3;
	}


	.game-week strong {
		font-size: 2rem;
	}


	.game-info {
		padding: 20px;

		border-right: 0;
	}


	.game-player-stats {
		grid-column: 1 / -1;

		padding: 15px;


		border-top: 1px solid #e2e5e9;
	}


	.game-action {
		grid-column: 1 / -1;

		border-top: 1px solid #e2e5e9;
	}


	.game-video-button,
	.game-coming-soon {
		min-height: 65px;

		padding: 13px 18px;
	}

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 479.98px) {

	.game-player-stats {
		grid-template-columns: repeat(2, 1fr);
	}


	.game-player-stats > div,
	.game-player-stats > div:nth-child(3n) {
		border-right: 1px solid #e5e8ec;
	}


	.game-player-stats > div:nth-child(2n) {
		border-right: 0;
	}

}
/* =========================================================
   FEATURED PLAY
========================================================= */

.featured-play {
	position: relative;

	margin-top: 28px;

	overflow: hidden;

	background:
		linear-gradient(
			120deg,
			var(--navy-dark) 0%,
			var(--navy) 65%,
			#0a3568 100%
		);

	box-shadow:
		0 15px 40px rgba(3, 26, 56, 0.15);
}


/* Background jersey number */

.featured-play::before {
	content: "6";

	position: absolute;
	top: 50%;
	right: 15%;

	color: rgba(255, 255, 255, 0.035);

	font-size: 12rem;
	font-weight: 900;
	line-height: 1;

	transform: translateY(-50%);

	pointer-events: none;
}


/* =========================================================
   INNER CONTAINER
========================================================= */

.featured-play > .container {
	position: relative;
	z-index: 2;

	display: flex;
	align-items: stretch;
	justify-content: space-between;

	padding-left: 0;
	padding-right: 0;
}


/* =========================================================
   CONTENT
========================================================= */

.featured-play-content {
	display: flex;
	align-items: center;
	gap: 24px;

	flex: 1;

	min-width: 0;

	padding: 30px 35px;
}


.featured-play-icon {
	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 65px;

	width: 65px;
	height: 65px;

	border: 1px solid rgba(255, 255, 255, 0.2);

	background: rgba(146, 44, 70, 0.22);

	color: var(--crimson-light);

	font-size: 1.6rem;
}


.featured-play-copy {
	min-width: 0;
}


.featured-play-eyebrow {
	margin-bottom: 5px;

	color: var(--crimson-light);

	font-size: 0.6rem;
	font-weight: 900;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}


.featured-play h3 {
	margin: 0;

	color: #fff;

	font-size: clamp(1.25rem, 2vw, 1.75rem);
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -0.025em;
	text-transform: uppercase;
}


.featured-play h3 span {
	color: var(--crimson-light);
}


.featured-play p {
	margin: 8px 0 0;

	color: rgba(255, 255, 255, 0.55);

	font-size: 0.78rem;
	line-height: 1.5;
}


/* =========================================================
   WATCH BUTTON
========================================================= */

.featured-play .featured-play-button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 13px;

	flex: 0 0 225px;

	width: 225px;

	padding: 20px 24px;

	border: 0;
	border-left: 1px solid rgba(255, 255, 255, 0.15);

	background: var(--crimson);

	color: #fff;

	text-align: left;

	cursor: pointer;

	transition:
		background 0.2s ease;
}


.featured-play .featured-play-button:hover {
	background: var(--crimson-light);
}


.featured-play .featured-play-button > i {
	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 43px;

	width: 43px;
	height: 43px;

	border: 1px solid rgba(255, 255, 255, 0.35);

	color: #fff;

	font-size: 0.9rem;
}


.featured-play .featured-play-button > span {
	display: flex;
	flex-direction: column;
}


.featured-play .featured-play-button small {
	margin-bottom: 2px;

	color: rgba(255, 255, 255, 0.65);

	font-size: 0.53rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}


.featured-play .featured-play-button strong {
	color: #fff;

	font-size: 0.7rem;
	font-weight: 900;
	line-height: 1.25;
	text-transform: uppercase;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

	.featured-play > .container {
		max-width: 100%;
	}


	.featured-play-content {
		padding: 28px 25px;
	}


	.featured-play .featured-play-button {
		flex: 0 0 200px;

		width: 200px;

		padding: 18px;
	}

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

	.featured-play > .container {
		display: block;

		padding-left: 0;
		padding-right: 0;
	}


	.featured-play-content {
		align-items: flex-start;

		padding: 25px 20px;
	}


	.featured-play-icon {
		flex: 0 0 50px;

		width: 50px;
		height: 50px;

		font-size: 1.2rem;
	}


	.featured-play .featured-play-button {
		width: 100%;

		min-height: 70px;

		padding: 13px 20px;

		border-left: 0;
		border-top: 1px solid rgba(255, 255, 255, 0.15);

		justify-content: flex-start;
	}


	.featured-play::before {
		right: 20px;

		font-size: 9rem;
	}

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 479.98px) {

	.featured-play-content {
		gap: 15px;
	}


	.featured-play-icon {
		display: none;
	}


	.featured-play h3 span {
		display: block;
	}


	.featured-play p {
		font-size: 0.72rem;
	}

}

/* =========================================================
   GAME FILM JUMP
========================================================= */

.game-film-jump {
	margin-top: 28px;
}


.game-film-jump a {
	display: inline-flex;
	align-items: center;
	gap: 14px;

	min-width: 320px;
	padding: 13px 16px;

	border: 1px solid #dce1e6;
	border-left: 4px solid var(--crimson);

	background: #fff;

	color: var(--navy);

	text-decoration: none;

	box-shadow:
		0 6px 20px rgba(3, 26, 56, 0.06);

	transition:
		transform 0.2s ease,
		border-color 0.2s ease,
		box-shadow 0.2s ease;
}


.game-film-jump a:hover {
	border-color: #cfd5dc;
	border-left-color: var(--crimson-light);

	color: var(--navy);

	transform: translateY(-2px);

	box-shadow:
		0 10px 28px rgba(3, 26, 56, 0.1);
}


.game-film-jump-icon {
	display: flex;
	align-items: center;
	justify-content: center;

	flex: 0 0 40px;

	width: 40px;
	height: 40px;

	background: var(--navy);

	color: #fff;

	font-size: 0.95rem;
}


.game-film-jump-copy {
	display: flex;
	flex-direction: column;

	flex: 1;
}


.game-film-jump-copy small {
	margin-bottom: 2px;

	color: #8a919a;

	font-size: 0.55rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}


.game-film-jump-copy strong {
	color: var(--navy);

	font-size: 0.72rem;
	font-weight: 900;
	letter-spacing: 0.025em;
	text-transform: uppercase;
}


.game-film-jump-arrow {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 30px;
	height: 30px;

	color: var(--crimson);

	transition: transform 0.2s ease;
}


.game-film-jump a:hover .game-film-jump-arrow {
	transform: translateY(3px);
}


@media (max-width: 575.98px) {

	.game-film-jump a {
		width: 100%;
		min-width: 0;
	}

}

/* =========================================================
   HEADER SOCIAL
========================================================= */
.nav-social-item {
	display: flex;
	align-items: center;
	margin-left: 6px;
}

.header-social-link {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 38px;
	height: 38px;

	border: 1px solid var(--navy);
	background: var(--navy);

	color: #fff;
	font-size: 0.95rem;
	text-decoration: none;

	transition:
		background 0.2s ease,
		border-color 0.2s ease,
		transform 0.2s ease;
}

.header-social-link:hover {
	border-color: var(--crimson);
	background: var(--crimson);
	color: #fff;
	transform: translateY(-2px);
}

@media (max-width: 991.98px) {

	.nav-social-item {
		display: inline-flex;
		margin: 10px 6px 18px 0;
	}

	.header-social-link {
		width: 42px;
		height: 42px;
	}

}

/* =========================================================
   PHOTO GALLERY
========================================================= */

.photo-gallery-section {
	position: relative;
	padding: 90px 0 0;
	overflow: hidden;
	background: #fff;
}


/* HEADING
--------------------------------------------------------- */

.gallery-heading {
	max-width: 700px;
	margin-bottom: 45px;
}

.gallery-heading p {
	max-width: 620px;
	margin: 20px 0 0;

	color: var(--gray);

	font-size: 1rem;
	line-height: 1.7;
}


/* =========================================
   JUSTIFIED PHOTO GALLERY
========================================= */

.photo-gallery-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    width: 100%;
}

.photo-gallery-grid .gallery-photo {
    display: block;
    position: relative;
    flex: 1 1 auto;
    width: auto;
    height: 400px;
    min-width: 0;
    overflow: hidden;
}

.photo-gallery-grid .gallery-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

@media (max-width: 991px) {
    .photo-gallery-grid .gallery-photo {
        height: 300px;
    }
}

@media (max-width: 575px) {
    .photo-gallery-grid .gallery-photo {
        height: 220px;
    }
}



/* PHOTO
--------------------------------------------------------- */

.gallery-photo {
	position: relative;

	min-width: 0;
	min-height: 0;

	overflow: hidden;

	background: var(--navy-dark);
}

.gallery-photo img {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;
	object-position: center;

	transition:
		transform .55s ease,
		filter .55s ease;
}


/* FEATURED PHOTOS
--------------------------------------------------------- */

.gallery-photo-large {
	grid-column: span 2;
	grid-row: span 2;
}

.gallery-photo-wide {
	grid-column: span 2;
}


/* OVERLAY
--------------------------------------------------------- */

.gallery-photo::after {
	content: "";

	position: absolute;
	inset: 0;

	background:
		linear-gradient(
			180deg,
			rgba(3, 26, 56, 0) 55%,
			rgba(3, 26, 56, .16) 100%
		);

	pointer-events: none;

	transition: background .4s ease;
}


/* HOVER
--------------------------------------------------------- */

.gallery-photo:hover img {
	transform: scale(1.035);
}

.gallery-photo:hover::after {
	background:
		linear-gradient(
			180deg,
			rgba(3, 26, 56, 0) 40%,
			rgba(146, 44, 70, .20) 100%
		);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

	.photo-gallery-section {
		padding-top: 70px;
	}

	.photo-gallery-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		grid-auto-rows: 230px;
	}

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

	.photo-gallery-section {
		padding-top: 60px;
	}

	.gallery-heading {
		margin-bottom: 30px;
	}

	.photo-gallery-grid {
		/*
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-auto-rows: 200px;

		gap: 3px;
		*/
		display: block;
	}

	.gallery-photo-large {
		grid-column: span 2;
		grid-row: span 2;
	}

	.gallery-photo-wide {
		grid-column: span 2;
	}

	.gallery-photo:hover img {
		transform: none;
	}

}

/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .photo-gallery-grid {
        display: block;
        /* grid-auto-rows: 170px; */
    }

}

/* =========================================================
   FEATURED HIGHLIGHT FILMS
========================================================= */

/* Full junior season — Weeks 1–9 */
#junior-year-full .highlight-reel-label {
    background: var(--navy);
    color: #fff;
}

/* Junior season — Weeks 7–9 */
#highlights-weeks-7-9 .highlight-reel-label {
    background: #dfe4e9;
    color: var(--navy);
}

/* =========================================================
   FEATURED FILM SECTION ORDER
   Weeks 1–9: light background, no top divider
   Weeks 7–9: gray background with top divider
========================================================= */

#junior-year-full {
    background: linear-gradient(135deg, #ffffff 0%, #f4f6f8 100%);
    border-top: 0;
}

#junior-year-full::before {
    content: none;
}

#highlights-weeks-7-9 {
    background: linear-gradient(135deg, #eef2f6 0%, #f7f8fa 50%, #ffffff 100%);
    border-top: 1px solid rgba(6, 43, 92, 0.12);
}

#highlights-weeks-7-9::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: min(1320px, calc(100% - 40px));
    height: 4px;
    background: linear-gradient(90deg, var(--navy) 0%, var(--navy) 72%, var(--crimson) 72%, var(--crimson) 100%);
    transform: translateX(-50%);
}

@media (max-width: 767.98px) {
    #highlights-weeks-7-9::before {
        width: calc(100% - 30px);
    }
}

/* =========================================================
   AWARDS & HONORS
========================================================= */
.awards-section { background: var(--off-white); }
.awards-intro { max-width: 680px; margin: 0 0 32px; color: var(--gray); }
.award-card { height: 100%; min-height: 195px; padding: 27px; background: #fff; border: 1px solid var(--light-gray); border-top: 3px solid var(--crimson); transition: transform .2s ease, box-shadow .2s ease; }
.award-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(6,43,92,.09); }
.award-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; color: var(--crimson); }
.award-card-top i { font-size: 1.5rem; }
.award-card-top span { font-size: .8rem; font-weight: 800; color: var(--gray); }
.award-card h3 { color: var(--navy); font-size: 1.1rem; font-weight: 850; line-height: 1.4; margin-bottom: 12px; }
.award-category { font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--crimson); }
@media (max-width: 767px) { .award-card { min-height: 0; padding: 22px; } }


/* HERO AWARDS */
.hero-awards {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-top: 18px;
    letter-spacing: normal;
}

.hero-awards-featured {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.hero-awards-featured span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    font-size: 0.68rem;
    font-weight: 800;
    line-height: 1.4;
    text-transform: uppercase;
}

.hero-award-primary {
    background: var(--crimson);
    color: #fff;
}

.hero-award-secondary {
    background: rgba(6, 43, 92, 0.9);
    border: 1px solid rgba(255,255,255,.25);
    color: #fff;
}

.hero-awards-conference {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    color: rgba(255,255,255,.9);
    font-size: .72rem;
    font-weight: 700;
}

.hero-awards-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-size: .7rem;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 4px;
    text-transform: uppercase;
}

.hero-awards-link:hover {
    color: #e8a6b8;
}

@media (max-width: 767px) {
    .hero-awards-featured {
        gap: 6px;
    }

    .hero-awards-featured span {
        font-size: .62rem;
        padding: 7px 9px;
    }

    .hero-awards-conference {
        font-size: .67rem;
    }
}

/* Junior Year Full Season — individual camera angles */
#junior-year-full .junior-film-angle-card { height: 100%; padding: 20px; background: #fff; border: 1px solid var(--light-gray); border-top: 3px solid var(--crimson); }
#junior-year-full .junior-film-angle-title { min-height: 3.2em; margin: 0 0 18px; color: var(--navy); font-size: 1.1rem; font-weight: 900; line-height: 1.4; text-transform: uppercase; }
#junior-year-full .junior-film-angle-title span { color: var(--crimson); }
#junior-year-full .junior-film-angle-button { margin-top: 20px; cursor: pointer; }
#junior-year-full .junior-film-angles .video-frame::before { z-index: 0; }
#junior-year-full .junior-film-angles .video-frame .ratio { position: relative; z-index: 1; }
@media (max-width: 767.98px) { #junior-year-full .junior-film-angle-card { padding: 15px; } #junior-year-full .junior-film-angle-title { min-height: 0; font-size: 1rem; } #junior-year-full .junior-film-angle-button { width: 100%; } }
