/* ============================================
   ROYAL HISTORY — THEME GENERAL
   Variables compartidas por TODAS las páginas
   ============================================ */

:root {
  /* Colores del club */
  --gold: #C9A84C;
  --gold-light: #F0D060;
  --gold-dark: #8B6914;
  --black: #0A0A0A;
  --black-soft: #111111;
  --black-card: #161616;
  --white: #F5F0E8;
  --grey: #888888;

  /* Tipografías */
  --font-display: 'Cinzel', serif;
  --font-body: 'Raleway', sans-serif;
  --font-tech: 'Orbitron', monospace;
  --font-tagline: 'Times New Roman', serif;

  /* Efecto vidrio (glassmorphism) */
  --glass-bg: rgba(22, 22, 22, 0.55);
  --glass-border: rgba(201, 168, 76, 0.25);
  --glass-blur: blur(12px);

  /* Espaciados/velocidades comunes */
  --transition-fast: 0.2s ease;
  --transition-medium: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

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

html { scroll-behavior: smooth; }

body {
  background: var(--black);
  color: var(--white);
  font-family: var(--font-body);
  overflow-x: hidden;
}

/* ── Utilidades de efecto vidrio, reusables en cualquier página ── */
.glass {
  background: var(--glass-bg);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border: 1px solid var(--glass-border);
}

.glass-hover {
  transition: background var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);
}

.glass-hover:hover {
  background: rgba(201, 168, 76, 0.08);
  border-color: rgba(201, 168, 76, 0.45);
  transform: translateY(-1px);
}

/* ── Botones base, reusables ── */
.btn-gold {
  font-family: var(--font-tech);
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  color: var(--black);
  background: linear-gradient(135deg, var(--gold-light), var(--gold));
  border: none;
  padding: 0.75rem 1.8rem;
  cursor: pointer;
  clip-path: polygon(10px 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%);
  transition: transform var(--transition-fast), filter var(--transition-fast);
}

.btn-gold:hover { transform: translateY(-2px); filter: brightness(1.1); }

.btn-outline-gold {
  font-family: var(--font-tech);
  font-size: 0.65rem;
  letter-spacing: 0.15em;
  color: var(--gold);
  background: transparent;
  border: 1px solid rgba(201, 168, 76, 0.4);
  padding: 0.75rem 1.8rem;
  cursor: pointer;
  transition: border-color var(--transition-fast), background var(--transition-fast);
}

.btn-outline-gold:hover {
  border-color: var(--gold);
  background: rgba(201, 168, 76, 0.07);
}

/* ── Scrollbar del club ── */
::-webkit-scrollbar { width: 4px; }
::-webkit-scrollbar-track { background: var(--black); }
::-webkit-scrollbar-thumb { background: var(--gold-dark); }