/* Terae — thème Terae (aplats unis, images à venir) */

:root {
	--font-sans: "Montserrat", "Segoe UI", system-ui, -apple-system, sans-serif;
	--font-display: "Cinzel", Georgia, "Times New Roman", serif;
	--t-bg: #080606;
	--t-bg-elevated: #120c0c;
	--t-bg-card: #181010;
	--t-bg-card-hover: #1f1414;
	--t-red: #8b1515;
	--t-red-bright: #c41e3a;
	--t-red-dark: #4a0a0a;
	--t-red-glow: rgba(196, 30, 58, 0.35);
	--t-gold: #c9a227;
	--t-gold-light: #e8c84a;
	--t-gold-muted: rgba(201, 162, 39, 0.55);
	--t-text: #f2ece2;
	--t-muted: #9a8f82;
	--t-border: rgba(201, 162, 39, 0.22);
	--t-border-red: rgba(196, 30, 58, 0.35);
	--t-success: #3dba6a;
	--t-radius: 4px;
	--t-radius-lg: 8px;
	--t-shadow: 0 14px 48px rgba(0, 0, 0, 0.55);
	--t-hero-bg: linear-gradient(145deg, #1a0808 0%, #3d1818 28%, #120808 55%, #0a0606 100%);
	--t-hero-glow: radial-gradient(ellipse 70% 55% at 50% 35%, rgba(196, 30, 58, 0.22), transparent 70%);
	--t-placeholder-1: #2a1212;
	--t-placeholder-2: #3d1818;
	--t-placeholder-3: #1e1010;
	--navbar-height: 64px;
}

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

body {
	background: var(--t-bg);
	color: var(--t-text);
	font-family: var(--font-sans);
	font-weight: 500;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	min-height: 100vh;
	padding-top: var(--navbar-height);
}

.page-home {
	padding-top: 0;
}

a {
	color: var(--t-gold-light);
}

/* ——— Layout global ——— */
.page-home .content {
	margin-top: 0;
	padding-top: 0;
}

.layout.layout--home {
	display: block;
	grid-template-columns: none;
	max-width: none;
	width: 100%;
	padding: 0;
	margin: 0;
	gap: 0;
}

.layout.layout--home > .right {
	display: block;
	width: 100%;
	max-width: none;
	min-width: 0;
}

.page-home .footer {
	margin-top: 0;
	border-top-color: var(--t-border);
}

/* Pages internes */
.layout:not(.layout--home) {
	padding-top: 1.5rem;
}

/* ——— Boutons génériques ——— */
.btn-t-primary,
.home__btn--gold,
.sidebar__btn--gold {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.6rem 1.25rem;
	font-family: var(--font-sans);
	font-size: 0.75rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	text-decoration: none;
	color: #fff;
	background: linear-gradient(180deg, var(--t-red-bright) 0%, var(--t-red) 55%, var(--t-red-dark) 100%);
	border: 1px solid var(--t-border-red);
	border-radius: var(--t-radius);
	box-shadow: 0 4px 18px var(--t-red-glow);
	transition: filter 0.15s, transform 0.15s;
}

.btn-t-primary:hover,
.home__btn--gold:hover,
.sidebar__btn--gold:hover {
	filter: brightness(1.08);
	transform: translateY(-1px);
	color: #fff;
}

/* Cards globales */
.card,
.sidebar__card {
	background: var(--t-bg-card);
	border: 1px solid var(--t-border);
	border-radius: var(--t-radius-lg);
	box-shadow: var(--t-shadow);
}

/* Formulaires */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
select,
textarea {
	background: var(--t-bg-elevated);
	border: 1px solid var(--t-border);
	color: var(--t-text);
	border-radius: var(--t-radius);
}

input:focus,
select:focus,
textarea:focus {
	outline: none;
	border-color: var(--t-gold-muted);
	box-shadow: 0 0 0 2px rgba(201, 162, 39, 0.15);
}

/* Titres pages internes */
.right h1,
.right h2,
.right h3 {
	font-family: var(--font-sans);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--t-gold-light);
}

.right h1 {
	font-weight: 800;
	letter-spacing: 0.1em;
}

/* Footer */
.footer {
	background: linear-gradient(to bottom, rgba(12, 8, 8, 0.95), #060404);
	border-top: 1px solid var(--t-border);
}

.footer-logo {
	color: var(--t-text);
}

.footer-logo::after {
	background: linear-gradient(90deg, var(--t-red-bright), transparent);
}

.footer-links a {
	color: var(--t-muted);
}

.footer-links a:hover {
	color: var(--t-gold-light);
}

.footer-social a {
	color: var(--t-muted);
	text-decoration: none;
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	transition: color 0.15s;
}

.footer-social a:hover {
	color: var(--t-red-bright);
}

.footer-inner {
	grid-template-columns: 1fr auto auto;
}

/* Hero vidéo pages internes */
.hero-video::after {
	background: linear-gradient(
		to bottom,
		transparent 0%,
		rgba(12, 6, 6, 0.4) 50%,
		var(--t-bg, #080606) 100%
	);
}

.hero-overlay {
	background: linear-gradient(to bottom, rgba(8, 4, 4, 0.15), rgba(8, 4, 4, 0.85));
}

/* Pages internes — shells */
.presentation,
.classement,
.faq,
.vote,
.recharge,
.vip-guide,
.inscription,
.personnage {
	color: var(--t-text);
}

.presentation h1,
.classement h1,
.faq h1,
.vip-guide h1 {
	color: var(--t-gold-light);
}