@font-face {
  font-family: 'BrownStdBold';
  src: url('/assets/fonts/brownstd-bold.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
}
* {
	box-sizing: border-box;
}
html, body {
	font-size: 16px;
	-webkit-text-size-adjust: 100%;
	height: 100%;
	font-family: 'BrownStdBold', system-ui, BlinkMacSystemFont, -apple-system, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
}
body {
	margin: 0;
	padding: 0;
	background-color: #000;
	color: #ddd;
}
h1, h2, h3, h4, h5, h6, nav, .brand-font, .btn {
	font-family: 'BrownStdBold';
	text-transform: uppercase;
	letter-spacing: 0.15em;
	color: #fff;
}
img, video {
	max-width: 100%;
	height: auto;
}
nav {
	position: fixed;
	width: 100%;
	top: 0;
	z-index: 999;
	.container {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding-block: 0.5rem;
	}
	a {
		display: block;
		padding: 1rem;
	}
}
ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
a, a:link {
	color: inherit;
	text-decoration: none;
}
footer {
	padding-block: 2rem;
	p {
		color: var(--color-text-muted);
	}
}
.logo img {
	width: 200px;
	display: block;
}
.brand-list {
	display: flex;
	gap: 2rem;
	justify-content: space-between;
	flex-wrap: wrap;
	text-transform: uppercase;
	font-size: 12px;
	color: #888;
	margin-block: 3rem;
	li {
		flex: 1 1 160px;
		max-width: 300px;
	}
}
.brand-tile {
	width: 100%;
	display: flex;
    align-items: center;
    justify-content: center;
	aspect-ratio: 1.75;
	padding: 15%;
	border-radius: 0.75rem;
	overflow: hidden;
	img {
		max-width: 100%;
		max-height: 100%;
		object-fit: contain;
	}
}
.tile-sports {
	background-color: #111;
	border: 1px solid #fff3;
}
.tile-buce {
	background-color: #490970;
}
.tile-rehab {
	background: radial-gradient(circle, #000 0%, #333 100%);
	border: 1px solid #fff3;
}
.tile-red {
	background-color: #7F004C;
}
.container {
	max-width: 1480px;
	margin: 0 auto;
	padding-inline: 2rem;
}
.video-container {
	max-width: 1600px;
	margin: 0 auto;
}
.main-nav {
	display: flex;
	gap: 2rem;
	text-transform: uppercase;
	color: #fff;
	text-shadow: 0 0 6px #0008;
}
.events-img {
	display: block;
	width: 100%;
}
.tagline {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 2.5rem;
	flex-wrap: wrap;
	img {
		width: 90px;
	}
	h1, p {
		margin-block: 0.75rem;
	}
}
.underg-times {
	display: flex;
	align-items: center;
	gap: 1rem;
	font-family: 'BrownStdBold';
}
.private-event {
	background: url('/assets/img/brushed-metal.jpg') center center / cover no-repeat;
	padding: 1.25rem;
	border-radius: 0.75rem;
	h2 {
		margin-top: 0;
		margin-bottom: 0.5rem;
	}
	p {
		margin-block: 0;
	}
}
.border-bottom {
	border-bottom: 2px solid #fff2;
}
.py-2 {
	padding-block: 2rem;
}
.text-uc {
	text-transform: uppercase;
}
.let-sp {
	letter-spacing: 0.2em;
}
.text-center {
	text-align: center;
}

@media (max-width: 767px) {
	.main-nav {
		display: none;
	}
	nav .container {
		justify-content: center;
	}
	.video-container {
		margin-top: 5.5rem;
	}
	.tagline {
		gap: 1rem;
	}
	.brand-list {
		flex-direction: column;
		align-items: center;
		li {
			width: 100%;
		}
	}
}