/**
 * main.css
 * Global styles: variables, typography, buttons, shared utilities.
 * VUB Champions Academy
 */

:root {
	--vub-primary: #0d2c54;
	--vub-secondary: #f5a623;
	--vub-dark: #1a1a1a;
	--vub-light: #ffffff;
	--vub-muted: #6b7280;
	--vub-max-width: 1200px;
}

/* Layout ------------------------------------------------------------------ */

/* Guard against full-bleed sections creating a sideways scrollbar. */
html,
body {
	overflow-x: hidden;
}

.vub-container {
	width: 100%;
	max-width: var(--vub-max-width);
	margin-inline: auto;
	padding-inline: 20px;
}

/* Typography -------------------------------------------------------------- */

body {
	color: var(--vub-dark);
}

/* Buttons ----------------------------------------------------------------- */

.vub-btn {
	display: inline-block;
	padding: 12px 28px;
	border-radius: 4px;
	background-color: var(--vub-primary);
	color: var(--vub-light);
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.vub-btn:hover,
.vub-btn:focus {
	background-color: var(--vub-secondary);
	color: var(--vub-dark);
}