/* Venditore Awards 2026 — look & feel (azul cine, haces de luz, títulos condensados) */
@font-face { font-family: 'Display'; src: url('/fonts/league-gothic.woff2') format('woff2'); font-weight: 400; font-display: block; }
@font-face { font-family: 'Sans'; src: url('/fonts/montserrat.woff2') format('woff2'); font-weight: 100 900; font-display: block; }

:root {
  --bg: #01040c;
  --navy: #06112b;
  --navy-2: #0b1d47;
  --blue: #2a5bd7;      /* fondo de los "badges" (DETRÁS DE CADA) */
  --blue-deep: #12347f;
  --sky: #63b3ff;       /* color de los títulos condensados */
  --ice: #cfe5ff;
  --white: #ffffff;
  --red: #ff4d61;
  --ok: #8fe3ff;
  --line: rgba(99, 179, 255, 0.35);
  --display: 'Display', 'League Gothic', 'Arial Narrow', sans-serif;
  --sans: 'Sans', 'Montserrat', system-ui, sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { background: var(--bg); color: var(--white); font-family: var(--sans); -webkit-font-smoothing: antialiased; }

/* Escenario: fondo con haces de luz + textura tipográfica */
.scene-bg { position: absolute; inset: 0; overflow: hidden; background: radial-gradient(120% 90% at 50% 10%, #0a1a44 0%, #040b1f 45%, #01040c 100%); }
.scene-bg .texture {
  position: absolute; inset: -40px; display: flex; flex-direction: column; justify-content: center; gap: 0;
  font-family: var(--display); font-size: 210px; line-height: 0.86; color: rgba(110, 150, 255, 0.055); white-space: nowrap; letter-spacing: 0.01em;
  -webkit-mask-image: radial-gradient(70% 70% at 50% 45%, #000 30%, transparent 85%); mask-image: radial-gradient(70% 70% at 50% 45%, #000 30%, transparent 85%);
}
.scene-bg .texture span { display: block; }
.scene-bg .texture small { font-family: var(--sans); font-weight: 600; font-size: 0.22em; letter-spacing: 0.08em; vertical-align: 0.9em; margin: 0 0.6em; color: rgba(110, 150, 255, 0.07); }
.beam { position: absolute; top: -10%; width: 70%; height: 130%; pointer-events: none; mix-blend-mode: screen; filter: blur(14px); opacity: 0.85; }
.beam.r { right: -18%; background: conic-gradient(from 200deg at 85% 0%, transparent 0deg, rgba(120, 170, 255, 0.28) 14deg, rgba(160, 200, 255, 0.10) 26deg, transparent 40deg); animation: sway 9s ease-in-out infinite alternate; transform-origin: 85% 0; }
.beam.l { left: -18%; background: conic-gradient(from 130deg at 15% 0%, transparent 0deg, rgba(120, 170, 255, 0.20) 14deg, rgba(160, 200, 255, 0.07) 24deg, transparent 38deg); animation: sway 11s ease-in-out infinite alternate-reverse; transform-origin: 15% 0; }
@keyframes sway { from { transform: rotate(-3deg); } to { transform: rotate(3deg); } }
.dust { position: absolute; inset: 0; background-image: radial-gradient(1px 1px at 20% 30%, rgba(255,255,255,.35), transparent), radial-gradient(1px 1px at 70% 20%, rgba(255,255,255,.25), transparent), radial-gradient(1.5px 1.5px at 85% 60%, rgba(180,210,255,.3), transparent), radial-gradient(1px 1px at 40% 70%, rgba(255,255,255,.2), transparent), radial-gradient(1px 1px at 60% 85%, rgba(255,255,255,.2), transparent); opacity: .7; }
.vignette { position: absolute; inset: 0; background: radial-gradient(110% 100% at 50% 40%, transparent 55%, rgba(0, 0, 0, 0.75) 100%); }

/* Elementos de marca */
.badge { display: inline-block; background: var(--blue); color: var(--white); font-family: var(--sans); font-weight: 600; text-transform: uppercase; letter-spacing: 0.02em; padding: 0.12em 0.45em 0.1em; line-height: 1.15; box-shadow: 0 0 0 2px rgba(255,255,255,0.08) inset; }
.title { font-family: var(--display); color: var(--sky); text-transform: uppercase; line-height: 0.88; letter-spacing: 0.005em; text-shadow: 0 0 40px rgba(99, 179, 255, 0.25); }
.kicker { font-family: var(--sans); font-weight: 600; text-transform: uppercase; color: var(--white); letter-spacing: 0.01em; line-height: 1.1; }

.lockup { text-align: center; line-height: 1; }
.lockup .l1 { font-family: var(--sans); font-weight: 600; letter-spacing: 0.32em; color: var(--sky); font-size: 0.3em; margin-right: -0.32em; }
.lockup .l2 { font-family: var(--display); font-size: 1em; color: var(--white); letter-spacing: 0.01em; line-height: 0.85; }
.lockup .l3 { font-family: var(--sans); font-weight: 600; font-size: 0.26em; letter-spacing: 0.22em; color: var(--white); display: flex; align-items: center; justify-content: center; gap: 0.3em; }
.lockup .l3 b { font-style: italic; font-weight: 900; letter-spacing: -0.02em; font-size: 1.05em; }