/* ============================================================
	Root Variables (Design System)
============================================================ */

:root {
	--rtb-black: #111111;
	--rtb-black-soft: #1b1b1b;
	--rtb-blue: #2d9cdb;
	--rtb-blue-soft: rgba(45, 156, 219, 0.1);
	--rtb-border: #e8e8e5;
	--rtb-flash: #00b894;
	--rtb-flash-soft: rgba(0, 184, 148, 0.12);
	--rtb-gymnastics: #9b6dff;
	--rtb-gymnastics-soft: rgba(155, 109, 255, 0.12);
	--rtb-offwhite: #f7f7f5;
	--rtb-oly: #f4b400;
	--rtb-oly-soft: rgba(244, 180, 0, 0.14);
	--rtb-red: #d61f26;
	--rtb-red-soft: rgba(214, 31, 38, 0.08);
	--rtb-strength: #ff7a59;
	--rtb-strength-soft: rgba(255, 122, 89, 0.12);
	--rtb-text-muted: #6b7280;
	--rtb-white: #ffffff;
}


/* ============================================================
	Base / Reset
============================================================ */
html {
	scroll-behavior: smooth;
}

html,
body {
	max-width: 100%;
	overflow-x: clip;
}

body {
	background: var(--rtb-white);
	color: var(--rtb-black);
	font-family:
		'Manrope',
		-apple-system,
		BlinkMacSystemFont,
		'Segoe UI',
		sans-serif;
	margin: 0;
	padding: 0;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

body.mobile-menu-open {
	overflow: hidden;
}

/* ============================================================
	Typography
============================================================ */

h2 {
	color: var(--rtb-black);
	font-size: clamp(2rem, 4vw, 3rem);
	font-weight: 700;
	letter-spacing: -0.04em;
}


/* ============================================================
	Links
============================================================ */
a {
	color: inherit;
	text-decoration: none;
}

a:hover {
	color: inherit;
}


/* ============================================================
	Buttons (Global)
============================================================ */
.btn {
	border-radius: 999px;
	font-weight: 700;
	padding: 0.8rem 1.4rem;
	transition: all 0.2s ease;
}

.btn-dark {
	background: var(--rtb-red);
	border-color: var(--rtb-red);
	color: var(--rtb-white);
}

.btn-dark:hover,
.btn-dark:focus {
	background: #bb171e;
	border-color: #bb171e;
	color: var(--rtb-white);
	transform: translateY(-1px);
}

.btn-outline-dark {
	background: transparent;
	border: 2px solid var(--rtb-black);
	color: var(--rtb-black);
}

.btn-outline-dark:hover,
.btn-outline-dark:focus {
	background: var(--rtb-black);
	border-color: var(--rtb-black);
	color: var(--rtb-white);
	transform: translateY(-1px);
}

.btn-outline-light {
	background: transparent;
	border-color: rgba(255, 255, 255, 0.35);
	color: #ffffff;
}

.btn-outline-light:hover,
.btn-outline-light:focus {
	background: #ffffff;
	border-color: #ffffff;
	color: var(--rtb-black);
	transform: translateY(-1px);
}


/* ============================================================
	Utilities
============================================================ */
.no-break {
	white-space: nowrap;
}

.spinner-border-sm {
	margin-right: 0.5rem;
}


/* ============================================================
	Responsive Fixes
============================================================ */
@media (max-width: 767.98px) {
	html,
	body {
		overflow-x: hidden;
	}
}