/* =============================================
   NEOsubverso — Estilos Centralizados
   ============================================= */

/* --- VARIABLES Y RESET --- */
:root {
  --black:      #000000;
  --deep:       #080810;
  --surface:    #0d0d1a;
  --surface2:   #12121f;
  --border:     #1e1e35;
  --border2:    #2a2a45;
  --blue:       #3B2FD9;
  --blue-light: #5548f0;
  --cyan:       #00C8FF;
  --cyan-dim:   rgba(0,200,255,0.15);
  --cyan-glow:  rgba(0,200,255,0.25);
  --magenta:    #FF5ECC;
  --mag-dim:    rgba(255,94,204,0.12);
  --violet:     #7B5EA7;
  --white:      #F0EEF8;
  --gray:       #5a5a7a;
  --gray-light: #8888aa;
  --font-display: 'Orbitron', sans-serif;
  --font-ui:      'Rajdhani', sans-serif;
  --font-body:    'Inter', sans-serif;
}

*, *::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);
  font-size: 15px;
  line-height: 1.6;
  overflow-x: hidden;
}

body::after {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
  pointer-events: none;
  z-index: 9998;
}

::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: var(--black); }
::-webkit-scrollbar-thumb { background: var(--blue); }

img { display: block; max-width: 100%; }
a { text-decoration: none; color: inherit; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }

/* --- TIPOGRAFÍA --- */
.label {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gray-light);
}
.label-cyan { color: var(--cyan); }
.label-mag  { color: var(--magenta); }

/* --- BOTONES --- */
.btn {
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 12px 28px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: all 0.22s ease;
  position: relative;
}
.btn-cyan {
  background: var(--cyan);
  color: var(--black);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
}
.btn-cyan:hover {
  background: #22d4ff;
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(0,200,255,0.3);
}
.btn-outline {
  background: transparent;
  color: var(--white);
  border: 1px solid var(--border2);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
}
.btn-outline:hover {
  border-color: var(--cyan);
  color: var(--cyan);
}
.btn-mag {
  background: var(--magenta);
  color: var(--black);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
}
.btn-mag:hover {
  background: #ff7ad4;
  transform: translateY(-1px);
  box-shadow: 0 8px 24px rgba(255,94,204,0.3);
}
/* =============================================
   NAVBAR
============================================= */
#navbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 500;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 40px;
  background: rgba(0,0,0,0.88);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--border);
  transition: border-color 0.3s;
}

/* LOGO VERSION A — Tipográfica CSS */
.logo-a {
  display: flex;
  align-items: center;
  gap: 10px;
}
.logo-a .neo {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 900;
  color: var(--cyan);
  letter-spacing: 0.05em;
  text-shadow: 0 0 20px rgba(0,200,255,0.5);
}
.logo-a .tickets, .logo-a .subverso {
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.25em;
  color: var(--gray-light);
  text-transform: uppercase;
  border-left: 1px solid var(--border2);
  padding-left: 10px;
  margin-left: 2px;
}

/* LOGO VERSION B — Con símbolo */
.logo-b {
  display: flex;
  align-items: center;
  gap: 8px;
}
.logo-b .sym {
  width: 30px; height: 30px;
  border: 1.5px solid var(--cyan);
  display: flex; align-items: center; justify-content: center;
  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%);
  background: var(--cyan-dim);
  flex-shrink: 0;
}
.logo-b .sym span {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 900;
  color: var(--cyan);
}
.logo-b .wordmark {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--white);
}
.logo-b .wordmark em {
  font-style: normal;
  color: var(--cyan);
}

/* Toggle logos */
.logo-b { display: none; }
body.logo-ver-b .logo-a { display: none; }
body.logo-ver-b .logo-b { display: flex; }

.nav-links {
  display: flex;
  align-items: center;
  gap: 36px;
  list-style: none;
}
.nav-links a {
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gray-light);
  transition: color 0.2s;
  position: relative;
}
.nav-links a::after {
  content: '';
  position: absolute;
  bottom: -4px; left: 0; right: 0;
  height: 1px;
  background: var(--cyan);
  transform: scaleX(0);
  transition: transform 0.2s;
}
.nav-links a:hover { color: var(--white); }
.nav-links a:hover::after { transform: scaleX(1); }

.nav-right {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Logo version toggle button */
.logo-toggle {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gray);
  border: 1px solid var(--border);
  padding: 4px 10px;
  cursor: pointer;
  transition: all 0.2s;
  background: none;
}
.logo-toggle:hover { border-color: var(--cyan); color: var(--cyan); }

/* Mobile menu */
.nav-hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 4px;
}
.nav-hamburger span {
  display: block;
  width: 22px; height: 2px;
  background: var(--white);
  transition: all 0.3s;
}

/* =============================================
   HERO
============================================= */
#hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 100px 40px 80px;
  overflow: hidden;
}

/* Background glow orbs */
.hero-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  pointer-events: none;
}
.orb-1 {
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(59,47,217,0.35) 0%, transparent 70%);
  top: -100px; right: -100px;
  animation: orbFloat 8s ease-in-out infinite;
}
.orb-2 {
  width: 350px; height: 350px;
  background: radial-gradient(circle, rgba(255,94,204,0.2) 0%, transparent 70%);
  bottom: 0; left: 10%;
  animation: orbFloat 10s ease-in-out infinite reverse;
}
.orb-3 {
  width: 200px; height: 200px;
  background: radial-gradient(circle, rgba(0,200,255,0.15) 0%, transparent 70%);
  top: 40%; left: 50%;
  animation: orbFloat 6s ease-in-out infinite;
}

@keyframes orbFloat {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-30px); }
}

/* Diagonal scan line */
.hero-scanline {
  position: absolute;
  top: 0; bottom: 0;
  left: 60%;
  width: 1px;
  background: linear-gradient(to bottom, transparent, var(--border2) 30%, var(--border2) 70%, transparent);
  pointer-events: none;
}

/* Glitch flash — solo al cargar */
.hero-glitch {
  position: absolute;
  inset: 0;
  pointer-events: none;
  animation: glitchFlash 3s 0.5s ease forwards;
  opacity: 0;
}
@keyframes glitchFlash {
  0%   { opacity: 0; }
  5%   { opacity: 1; background: rgba(0,200,255,0.03); }
  6%   { opacity: 0; }
  10%  { opacity: 1; background: rgba(255,94,204,0.03); transform: translateX(2px); }
  11%  { opacity: 0; transform: translateX(0); }
  100% { opacity: 0; }
}

.hero-content {
  position: relative;
  z-index: 1;
  max-width: 700px;
}

.hero-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
  opacity: 0;
  animation: fadeUp 0.7s 0.3s ease forwards;
}

.hero-eyebrow-dot {
  width: 6px; height: 6px;
  background: var(--cyan);
  border-radius: 50%;
  animation: pulse 2s ease infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(0,200,255,0.4); }
  50% { opacity: 0.7; box-shadow: 0 0 0 6px rgba(0,200,255,0); }
}

.hero-title {
  font-family: var(--font-display);
  font-size: clamp(40px, 7vw, 88px);
  font-weight: 900;
  line-height: 1.0;
  letter-spacing: 0.02em;
  color: var(--white);
  margin-bottom: 20px;
  opacity: 0;
  animation: fadeUp 0.7s 0.5s ease forwards;
}

.hero-title .line-cyan { color: var(--cyan); display: block; }
.hero-title .line-mag  { color: var(--magenta); display: block; font-size: 0.55em; font-weight: 700; letter-spacing: 0.15em; margin-top: 8px; }

.hero-desc {
  font-size: 16px;
  color: var(--gray-light);
  max-width: 480px;
  margin-bottom: 40px;
  line-height: 1.8;
  opacity: 0;
  animation: fadeUp 0.7s 0.7s ease forwards;
}

.hero-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  opacity: 0;
  animation: fadeUp 0.7s 0.9s ease forwards;
}

/* Hero stats */
.hero-stats {
  position: absolute;
  right: 40px;
  bottom: 80px;
  display: flex;
  flex-direction: column;
  gap: 28px;
  z-index: 1;
  opacity: 0;
  animation: fadeIn 1s 1.2s ease forwards;
}

.hero-stat {
  text-align: right;
  border-right: 2px solid var(--blue);
  padding-right: 20px;
}

.hero-stat-num {
  font-family: var(--font-display);
  font-size: 36px;
  font-weight: 900;
  color: var(--cyan);
  line-height: 1;
  letter-spacing: 0.05em;
}

.hero-stat-label {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #FF5ECC;
  margin-top: 2px;
}

/* Diagonal speed lines */
.speed-lines {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  opacity: 0;
  animation: fadeIn 1.5s 0.5s ease forwards;
}
.speed-line {
  position: absolute;
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(0,200,255,0.15), transparent);
  transform-origin: left center;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* =============================================
   TICKER TAPE (Marquee NEO cyberpunk)
============================================= */
.ticker {
  overflow: hidden;
  padding: 13px 0;
  position: relative;
  z-index: 2;
  background: repeating-linear-gradient(180deg, rgba(0, 0, 0, 0.12) 0 1px, transparent 1px 4px);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.ticker::before, .ticker::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  pointer-events: none;
  z-index: 1;
}
.ticker::before {
  top: 0;
  background: linear-gradient(90deg, transparent, rgba(0, 200, 255, 0.65) 25%, rgba(255, 94, 204, 0.65) 75%, transparent);
  box-shadow: 0 0 10px rgba(0, 200, 255, 0.3);
}
.ticker::after {
  bottom: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 94, 204, 0.55) 25%, rgba(0, 200, 255, 0.55) 75%, transparent);
  box-shadow: 0 0 10px rgba(255, 94, 204, 0.25);
}
.ticker-track {
  display: inline-flex;
  animation: ticker 28s linear infinite;
  white-space: nowrap;
}
.ticker-item {
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #b9c4e8;
  padding: 0 30px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  position: relative;
  will-change: transform;
  animation: tickerNeon 3.6s ease-in-out infinite;
}
.ticker-item:nth-child(odd) {
  text-shadow: 0 0 6px rgba(0, 200, 255, 0.5), 0 0 20px rgba(0, 200, 255, 0.25);
}
.ticker-item:nth-child(even) {
  text-shadow: 0 0 6px rgba(255, 94, 204, 0.5), 0 0 20px rgba(255, 94, 204, 0.25);
}
.ticker-item:nth-child(4n+1) { animation-delay: 0s; }
.ticker-item:nth-child(4n+2) { animation-delay: 0.9s; }
.ticker-item:nth-child(4n+3) { animation-delay: 1.8s; }
.ticker-item:nth-child(4n)   { animation-delay: 2.7s; }
@keyframes tickerNeon {
  0%, 90% { filter: none; }
  92% { filter: brightness(1.45); }
  94% { filter: none; }
  97% { filter: brightness(1.2); }
  100% { filter: none; }
}
.ticker-item .t-dot { width: 4px; height: 4px; border-radius: 50%; flex-shrink: 0; }
.t-cyan { background: var(--cyan); }
.t-mag  { background: var(--magenta); }
.t-blue { background: #5548f0; }
@keyframes ticker { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* =============================================
   SEARCH
============================================= */
#search {
  padding: 48px 40px;
  position: relative;
  z-index: 2;
}

.search-wrap {
  max-width: 860px;
  background: var(--surface);
  border: 1px solid var(--border2);
  display: grid;
  /* 🌟 Actualizado: Añadimos un separador más y distribuimos las columnas */
  grid-template-columns: 1fr 1px auto 1px auto 1px auto;
  align-items: stretch;
  transition: border-color 0.2s;
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}
.search-wrap:focus-within {
  border-color: var(--cyan);
  box-shadow: 0 0 0 1px rgba(0,200,255,0.2);
}

.search-input {
  background: transparent;
  border: none;
  outline: none;
  padding: 18px 24px;
  font-family: var(--font-body);
  font-size: 15px;
  color: var(--white);
  width: 100%;
}
.search-input::placeholder { color: var(--gray); }

.search-sep { background: var(--border); }

.search-select {
  background: transparent;
  border: none;
  outline: none;
  padding: 18px 20px;
  font-family: var(--font-ui);
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gray-light);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  min-width: 120px;
}
.search-select option { background: var(--surface2); }

.search-btn {
  background: var(--cyan);
  border: none;
  padding: 18px 32px;
  font-family: var(--font-ui);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--black);
  cursor: pointer;
  transition: background 0.2s;
  white-space: nowrap;
}
.search-btn:hover { background: #22d4ff; }

/* =============================================
   SECTION SHELL
============================================= */
.section {
  padding: 0 40px 80px;
  position: relative;
  z-index: 1;
}

.section-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 36px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border);
}

.section-title {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--white);
}
.section-title span { color: var(--cyan); }
.section-title .mag { color: var(--magenta); }

.section-sub {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #FF5ECC;
  margin-top: 4px;
}

.see-all {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--cyan);
  transition: opacity 0.2s;
  display: flex;
  align-items: center;
  gap: 6px;
}
.see-all:hover { opacity: 0.7; }

/* =============================================
   FEATURED EVENT
============================================= */
.featured-card {
  display: grid;
  grid-template-columns: 1fr 400px;
  background: var(--surface);
  border: 1px solid var(--border2);
  clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%);
  overflow: hidden;
  cursor: pointer;
  transition: border-color 0.3s;
}
.featured-card:hover { border-color: rgba(0,200,255,0.3); }

.featured-img {
  position: relative;
  min-height: 380px;
  background: linear-gradient(135deg, #0a0a1f 0%, #0d0820 50%, #080810 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.featured-img-overlay {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 40% 50%, rgba(59,47,217,0.25) 0%, transparent 60%),
    radial-gradient(ellipse at 80% 20%, rgba(0,200,255,0.12) 0%, transparent 50%);
}

.featured-img-placeholder {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.featured-img-placeholder svg { opacity: 0.2; }

.featured-img-label {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--gray);
}

.featured-badge {
  position: absolute;
  top: 24px;
  left: 0;
  background: var(--cyan);
  color: var(--black);
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 6px 16px 6px 20px;
  clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
}

.featured-info {
  padding: 44px 36px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-left: 1px solid var(--border);
}

.f-cat {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--cyan);
  margin-bottom: 14px;
}

.f-title {
  font-family: var(--font-display);
  font-size: 36px;
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: 0.04em;
  color: var(--white);
  margin-bottom: 14px;
}

.f-desc {
  font-size: 14px;
  color: var(--gray-light);
  line-height: 1.8;
  margin-bottom: 28px;
}

.f-meta { display: flex; flex-direction: column; gap: 10px; margin-bottom: 32px; }

.f-meta-item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-ui);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--gray-light);
}
.f-meta-icon { color: var(--cyan); font-size: 14px; width: 18px; }

.f-price-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 24px;
  border-top: 1px solid var(--border);
}

.f-price-label { font-family: var(--font-ui); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray); }

.f-price-val {
  font-family: var(--font-display);
  font-size: 32px;
  font-weight: 900;
  color: var(--cyan);
  letter-spacing: 0.05em;
}

/* =============================================
   EVENTS GRID (Rediseño Vertical - 5 columnas)
============================================= */
.events-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 20px !important;
}

/* Tarjeta con orientación vertical para flyers */
.event-card {
  background: var(--surface);
  border: 1px solid var(--border);
  cursor: pointer;
  transition: all 0.25s ease;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  width: auto !important; /* Evita que se fuerce a 100% */
  min-width: 1 !important; /* Permite que el grid encoja la tarjeta */
}
.event-card:active {
  transform: scale(0.97);
  transition: transform 0.1s ease;
}
.event-card:hover {
  border-color: var(--border2);
  transform: translateY(-3px);
  box-shadow: 0 16px 48px rgba(0,0,0,0.5);
}
.event-card:hover .event-card-img img {
  transform: scale(1.05);
}

/* Imagen del flyer con altura generosa para orientación vertical */
.event-card-img {
  width: 100%;
  height: 300px;
  background: var(--surface2);
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid var(--border);
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}
.event-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
  position: absolute;
  inset: 0;
}
.event-card-img-bg {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(59,47,217,0.2) 0%, transparent 60%);
  z-index: 1;
}
.event-card-img-placeholder {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  opacity: 0.25;
}
.event-card-img-placeholder span {
  font-family: var(--font-ui);
  font-size: 9px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gray);
}
.event-card-badge {
  position: absolute;
  top: 0; left: 0;
  background: var(--cyan);
  color: var(--black);
  font-family: var(--font-ui);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 5px 14px;
  clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
  z-index: 3;
}
.event-card-badge-wrap {
  position: absolute;
  top: 0; left: 0;
  display: flex;
  align-items: stretch;
  z-index: 3;
}
.event-card-badge-wrap .event-card-badge { position: static; }
.event-card-count {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: 4px;
  padding: 5px 8px;
  background: rgba(0,0,0,0.75);
  border: 1px solid var(--border2);
  border-radius: 0 4px 4px 0;
  backdrop-filter: blur(4px);
  white-space: nowrap;
}
.event-card-count-num {
  font-family: var(--font-ui);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--cyan);
  line-height: 1.2;
  display: inline-block;
  animation: countdown-bounce 1.2s ease-in-out infinite;
}
.event-card-count-emoji {
  display: inline-block;
  font-size: 10px;
  line-height: 1.2;
  animation: countdown-bounce 1.2s ease-in-out infinite;
}
@keyframes countdown-bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
.event-card-date-multi {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 6px 10px;
  align-items: center;
}
.event-card-date-line {
  font-family: var(--font-ui);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--cyan);
  white-space: nowrap;
  line-height: 1.2;
}
.event-card-date-line.dur {
  color: var(--white);
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.event-card-date {
  position: absolute;
  top: 0; right: 8px;
  background: rgba(0,0,0,0.75);
  border: 1px solid var(--border2);
  padding: 5px 9px;
  text-align: center;
  z-index: 3;
  backdrop-filter: blur(4px);
}
.event-card-day {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 900;
  color: var(--cyan);
  line-height: 1;
}
.event-card-month {
  font-family: var(--font-ui);
  font-size: 8px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gray);
}
.event-card-body {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}
.event-card-tag {
  font-family: var(--font-ui);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 3px 10px;
  border: 1px solid;
  display: inline-block;
  align-self: flex-start;
  clip-path: polygon(0 0, calc(100% - 5px) 0, 100% 5px, 100% 100%, 0 100%);
  margin-bottom: 4px;
}
.tag-music   { color: var(--magenta); border-color: rgba(255,94,204,0.35); background: rgba(255,94,204,0.07); }
.tag-gaming  { color: var(--cyan);    border-color: rgba(0,200,255,0.35);  background: rgba(0,200,255,0.07); }
.tag-art     { color: #ffb347;        border-color: rgba(255,179,71,0.35); background: rgba(255,179,71,0.07); }
.tag-sports  { color: #ff6b6b;        border-color: rgba(255,107,107,0.35);background: rgba(255,107,107,0.07); }
.tag-theater { color: #4ade80;        border-color: rgba(74,222,128,0.35); background: rgba(74,222,128,0.07); }
.tag-culture { color: var(--violet);  border-color: rgba(123,94,167,0.35); background: rgba(123,94,167,0.07); }
.event-card-title {
  font-family: var(--font-ui);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.03em;
  color: var(--white);
  line-height: 1.2;
}
.event-card-venue {
  font-size: 11px;
  color: var(--gray);
  display: flex;
  align-items: center;
  gap: 4px;
}
.event-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 10px;
  margin-top: auto;
  border-top: 1px solid var(--border);
}
.event-card-price {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 700;
  color: var(--white);
  letter-spacing: 0.04em;
}
.event-card-price small {
  font-family: var(--font-ui);
  font-size: 9px;
  color: var(--gray);
  font-weight: normal;
}
.event-card-avail {
  font-family: var(--font-ui);
  font-size: 9px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
.avail-ok  { color: #4ade80; }
.avail-low { color: #ffb347; }
.avail-out { color: #ff6b6b; }
.event-card-btn {
  display: block;
  width: 100%;
  text-align: center;
  font-family: var(--font-ui);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  background: transparent;
  border: 1px solid var(--border2);
  color: var(--gray-light);
  padding: 8px;
  cursor: pointer;
  transition: all 0.2s;
  margin-top: 8px;
  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%);
}
.event-card-btn:hover {
  border-color: var(--cyan);
  color: var(--cyan);
  background: var(--cyan-dim);
}
.event-card-zonas {
  font-size: 10px;
  color: var(--cyan);
  font-family: var(--font-ui);
  letter-spacing: 0.04em;
  margin-top: 2px;
}
.event-card-year {
  font-family: var(--font-ui);
  font-size: 7px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gray);
  text-align: center;
}

/* =============================================
   RESPONSIVE - Blindado con !important
============================================= */
@media (max-width: 1024px) {
  .events-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (max-width: 768px) {
  .events-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
  .event-card-img {
    height: 200px !important;
  }
  .event-card-title {
    font-size: 12px !important;
  }
  .event-card-price {
    font-size: 14px !important;
  }
}
/* =============================================
   CATEGORIES
============================================= */
.cat-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
}

.cat-card {
  background: var(--surface);
  border: 1px solid var(--border);
  padding: 28px 16px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  transition: all 0.22s ease;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  text-align: center;
}
.cat-card:hover {
  border-color: var(--border2);
  background: var(--surface2);
  transform: translateY(-3px);
  box-shadow: 0 8px 30px rgba(0,0,0,0.3);
}

.cat-icon { font-size: 26px; line-height: 1; }
.cat-name { font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gray-light); }
.cat-count { font-family: var(--font-display); font-size: 22px; font-weight: 700; color: var(--cyan); letter-spacing: 0.05em; }

/* =============================================
   HOW IT WORKS
============================================= */
.how-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border: 1px solid var(--border);
}

.how-item {
  padding: 40px 28px;
  border-right: 1px solid var(--border);
  position: relative;
  overflow: hidden;
  transition: background 0.2s;
}
.how-item:last-child { border-right: none; }
.how-item:hover { background: var(--surface2); }

.how-num {
  font-family: var(--font-display);
  font-size: 80px;
  font-weight: 900;
  line-height: 0.8;
  color: rgba(0,200,255,0.05);
  letter-spacing: 0.02em;
  margin-bottom: 20px;
  position: absolute;
  top: 20px; right: 16px;
}

.how-icon { font-size: 26px; margin-bottom: 16px; }
.how-title { font-family: var(--font-ui); font-size: 16px; font-weight: 700; letter-spacing: 0.06em; color: var(--white); margin-bottom: 10px; }
.how-desc { font-size: 13px; color: var(--gray-light); line-height: 1.75; }

/* =============================================
   NEOSTORE
============================================= */
.store-toolbar {
  display: flex;
  gap: 12px;
  margin-bottom: 28px;
  flex-wrap: wrap;
  align-items: center;
}

.store-search {
  flex: 1;
  min-width: 200px;
  background: var(--surface);
  border: 1px solid var(--border2);
  display: flex;
  align-items: center;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
}
.store-search input {
  background: transparent;
  border: none;
  outline: none;
  padding: 12px 18px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--white);
  width: 100%;
}
.store-search input::placeholder { color: var(--gray); }
.store-search-icon { padding: 0 14px; color: var(--gray); font-size: 14px; }

.store-filter {
  background: var(--surface);
  border: 1px solid var(--border2);
  padding: 12px 18px;
  font-family: var(--font-ui);
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gray-light);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  outline: none;
  transition: border-color 0.2s;
}
.store-filter:hover { border-color: var(--cyan); }
.store-filter option { background: var(--surface2); }

.store-cats {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 28px;
}

.store-cat-btn {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 7px 16px;
  border: 1px solid var(--border2);
  color: var(--gray-light);
  background: transparent;
  cursor: pointer;
  transition: all 0.2s;
  clip-path: polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 0 100%);
}
.store-cat-btn:hover,
.store-cat-btn.active {
  border-color: var(--cyan);
  color: var(--cyan);
  background: var(--cyan-dim);
}

.products-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.product-card {
  background: var(--surface);
  border: 1px solid var(--border);
  cursor: pointer;
  transition: all 0.22s ease;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
  overflow: hidden;
}
.product-card:hover {
  border-color: var(--border2);
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(0,0,0,0.35);
}

.product-img {
  width: 100%;
  height: 180px;
  background: var(--surface2);
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid var(--border);
  position: relative;
  overflow: hidden;
}

.product-img-inner { opacity: 0.2; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.product-img-inner span { font-family: var(--font-ui); font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray); }

.product-body { padding: 18px 18px 20px; }

.product-brand {
  font-family: var(--font-ui);
  font-size: 9px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--cyan);
  margin-bottom: 6px;
}

.product-name {
  font-family: var(--font-ui);
  font-size: 15px;
  font-weight: 600;
  color: var(--white);
  margin-bottom: 4px;
  line-height: 1.3;
}

.product-seller {
  font-size: 12px;
  color: var(--gray);
  margin-bottom: 14px;
}

.product-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.product-price { font-family: var(--font-display); font-size: 20px; font-weight: 700; color: var(--white); letter-spacing: 0.04em; }
.product-price small { font-family: var(--font-ui); font-size: 9px; color: var(--gray); font-weight: normal; }

.product-contact {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--magenta);
  border: 1px solid rgba(255,94,204,0.3);
  padding: 5px 12px;
  background: var(--mag-dim);
  transition: all 0.2s;
}
.product-contact:hover { border-color: var(--magenta); }

/* =============================================
   ABOUT / NOSOTROS
============================================= */
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}

.about-text .eyebrow {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--cyan);
  margin-bottom: 16px;
}

.about-text h2 {
  font-family: var(--font-display);
  font-size: 32px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 20px;
}

.about-text p {
  font-size: 15px;
  color: var(--gray-light);
  line-height: 1.85;
  margin-bottom: 16px;
}

.about-vals {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 32px;
}

.about-val {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.about-val-icon {
  width: 36px; height: 36px;
  background: var(--cyan-dim);
  border: 1px solid rgba(0,200,255,0.2);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
  flex-shrink: 0;
  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%);
}

.about-val-text strong {
  display: block;
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--white);
  margin-bottom: 3px;
}
.about-val-text span { font-size: 13px; color: var(--gray-light); }

.about-visual {
  position: relative;
  height: 400px;
  background: var(--surface);
  border: 1px solid var(--border2);
  display: flex;
  align-items: center;
  justify-content: center;
  clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%);
  overflow: hidden;
}

.about-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
}
.about-orb-1 {
  width: 300px; height: 300px;
  background: radial-gradient(circle, rgba(59,47,217,0.4) 0%, transparent 70%);
  top: -50px; right: -50px;
}
.about-orb-2 {
  width: 200px; height: 200px;
  background: radial-gradient(circle, rgba(255,94,204,0.25) 0%, transparent 70%);
  bottom: 0; left: 0;
}

.about-visual-content {
  position: relative;
  z-index: 1;
  text-align: center;
}

.about-visual-content .big-text {
  font-family: var(--font-display);
  font-size: 64px;
  font-weight: 900;
  color: rgba(255,255,255,0.05);
  letter-spacing: 0.05em;
  line-height: 1;
  margin-bottom: 8px;
}

.about-stat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 16px;
}

.about-stat { text-align: center; }
.about-stat-num { font-family: var(--font-display); font-size: 38px; font-weight: 900; letter-spacing: 0.05em; }
.about-stat-label { font-family: var(--font-ui); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray); margin-top: 2px; }
.num-cyan { color: var(--cyan); }
.num-mag  { color: var(--magenta); }

/* =============================================
   FOOTER
============================================= */
footer {
  border-top: 1px solid var(--border);
  padding: 60px 40px 32px;
  position: relative;
  z-index: 2;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 48px;
}

.footer-brand-logo {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 900;
  letter-spacing: 0.06em;
  color: var(--white);
  margin-bottom: 14px;
}
.footer-brand-logo span { color: var(--cyan); }

.footer-brand-desc {
  font-size: 13px;
  color: var(--gray);
  line-height: 1.8;
  margin-bottom: 24px;
  max-width: 260px;
}

.footer-socials {
  display: flex;
  gap: 10px;
}

.social-btn {
  width: 38px; height: 38px;
  border: 1px solid var(--border2);
  display: flex; align-items: center; justify-content: center;
  font-size: 16px;
  cursor: pointer;
  transition: all 0.2s;
  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%);
  background: var(--surface);
  color: var(--white);
  text-decoration: none;
}
.social-btn:hover { border-color: var(--cyan); color: var(--cyan); background: var(--cyan-dim); }

.footer-col-title {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--cyan);
  margin-bottom: 20px;
}

.footer-links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-links a {
  font-size: 13px;
  color: var(--gray);
  transition: color 0.2s;
  display: flex;
  align-items: center;
  gap: 8px;
}
.footer-links a::before {
  content: '›';
  color: var(--blue);
  font-size: 16px;
}
.footer-links a:hover { color: var(--white); }

.footer-bottom {
  border-top: 1px solid var(--border);
  padding-top: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.footer-copy {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--gray);
}
.footer-copy span { color: var(--cyan); }

.footer-pay {
  display: flex;
  gap: 8px;
  align-items: center;
}

.pay-badge {
  font-family: var(--font-ui);
  font-size: 9px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  border: 1px solid var(--border2);
  padding: 4px 10px;
  color: var(--gray);
}

/* =============================================
   MODAL CARRITO
============================================= */
.cart-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.88);
  backdrop-filter: blur(10px);
  z-index: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s;
  padding: 20px;
}
.cart-overlay.open { opacity: 1; pointer-events: all; }

.cart-modal {
  background: var(--surface);
  border: 1px solid var(--border2);
  width: 100%;
  max-width: 500px;
  max-height: 90vh;
  overflow-y: auto;
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%);
  transform: translateY(16px);
  transition: transform 0.25s;
}
.cart-overlay.open .cart-modal { transform: translateY(0); }

.cart-head {
  padding: 24px 28px;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.cart-head-title {
  font-family: var(--font-ui);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--white);
}
.cart-head-sub {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.15em;
  color: var(--gray);
}

.cart-body { padding: 24px 28px; }

.cart-item {
  background: var(--deep);
  border: 1px solid var(--border);
  padding: 16px;
  margin-bottom: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.cart-item-info { flex: 1; }
.cart-item-title { font-family: var(--font-ui); font-size: 14px; font-weight: 700; color: var(--white); letter-spacing: 0.04em; }
.cart-item-zone { font-size: 11px; color: var(--cyan); margin-top: 2px; }
.cart-item-qty { font-size: 11px; color: var(--gray); margin-top: 2px; }
.cart-item-price { font-family: var(--font-display); font-size: 18px; font-weight: 700; color: var(--white); margin-left: 16px; }

.cart-remove {
  color: var(--red);
  font-size: 12px;
  margin-left: 12px;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.2s;
}
.cart-remove:hover { opacity: 1; }

.cart-pay-methods {
  margin-top: 20px;
}
.cart-pay-title {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gray);
  margin-bottom: 12px;
}
.cart-pay-opt {
  background: var(--deep);
  border: 1px solid var(--border);
  padding: 14px 18px;
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  transition: all 0.2s;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
}
.cart-pay-opt:hover, .cart-pay-opt.sel { border-color: var(--cyan); background: var(--cyan-dim); }
.cart-pay-name { font-family: var(--font-ui); font-size: 14px; font-weight: 600; color: var(--white); }
.cart-pay-desc { font-size: 11px; color: var(--gray); margin-top: 2px; }
.cart-pay-tag {
  font-family: var(--font-ui);
  font-size: 9px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--cyan);
  border: 1px solid rgba(0,200,255,0.3);
  padding: 3px 8px;
  background: var(--cyan-dim);
}

.cart-total-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 20px;
  border-top: 1px solid var(--border);
  margin-top: 24px;
  margin-bottom: 20px;
}
.cart-total-label { font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray); }
.cart-total-val { font-family: var(--font-display); font-size: 32px; font-weight: 900; color: var(--cyan); letter-spacing: 0.05em; }

.cart-empty {
  text-align: center;
  padding: 40px 20px;
  color: var(--gray);
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: 0.1em;
}

/* =============================================
   AUTH MODAL
============================================= */
.auth-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.88);
  backdrop-filter: blur(8px);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s;
  padding: 20px;
}
.auth-overlay.open { opacity: 1; pointer-events: all; }

.auth-modal {
  background: var(--surface);
  border: 1px solid var(--border2);
  width: 100%;
  max-width: 460px;
  max-height: 90vh;
  overflow-y: auto;
  clip-path: none;
  border-radius: 2px;
  transform: translateY(14px);
  transition: transform 0.25s;
}
.auth-overlay.open .auth-modal { transform: translateY(0); }

.auth-head {
  padding: 24px 28px 20px;
  border-bottom: 1px solid var(--border);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.auth-tabs { display: flex; gap: 0; }

.auth-tab {
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 8px 20px;
  border: 1px solid var(--border2);
  color: var(--gray);
  background: transparent;
  cursor: pointer;
  transition: all 0.2s;
}
.auth-tab.active {
  background: var(--cyan);
  color: var(--black);
  border-color: var(--cyan);
}

.auth-body { padding: 24px 28px 28px; }

.auth-form { display: none; flex-direction: column; gap: 14px; }
.auth-form.active { display: flex; }

.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

.form-group { display: flex; flex-direction: column; gap: 6px; }

.form-label {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cyan);
}

.form-input {
  background: var(--deep);
  border: 1px solid var(--border2);
  outline: none;
  padding: 12px 14px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--white);
  transition: border-color 0.2s;
  width: 100%;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
}
.form-input:focus { border-color: var(--cyan); }
.form-input::placeholder { color: var(--gray); font-size: 13px; }

.form-select {
  background: var(--deep);
  border: 1px solid var(--border2);
  outline: none;
  padding: 12px 14px;
  font-family: var(--font-ui);
  font-size: 13px;
  color: var(--white);
  width: 100%;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
  transition: border-color 0.2s;
}
.form-select:focus { border-color: var(--cyan); }
.form-select option { background: var(--surface2); }

.date-row { display: grid; grid-template-columns: 1fr 2fr 1fr; gap: 8px; }

#auth-msg {
  font-family: var(--font-ui);
  font-size: 12px;
  letter-spacing: 0.06em;
  min-height: 18px;
  text-align: center;
}

.auth-switch {
  font-family: var(--font-ui);
  font-size: 12px;
  letter-spacing: 0.06em;
  color: var(--gray);
  text-align: center;
}
.auth-switch a { color: var(--cyan); cursor: pointer; }
.auth-switch a:hover { text-decoration: underline; }

/* =============================================
   MODAL DE EVENTO
============================================= */
.ev-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.88);
  backdrop-filter: blur(10px);
  z-index: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s;
  padding: 20px;
}
.ev-overlay.open { opacity: 1; pointer-events: all; }

.ev-modal {
  background: var(--surface);
  border: 1px solid var(--border2);
  width: 100%;
  max-width: 920px;
  max-height: 88vh;
  overflow-y: auto;
  clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%);
  transform: translateY(16px);
  transition: transform 0.25s;
  display: grid;
  grid-template-columns: 1fr 380px;
  position: relative;
}
.ev-overlay.open .ev-modal { transform: translateY(0); }

.ev-left {
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
}

.ev-flyer {
  width: 100%;
  height: 280px;
  background: var(--surface2);
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid var(--border);
  position: relative;
  overflow: hidden;
}
.ev-flyer-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 30% 50%, rgba(59,47,217,0.3) 0%, transparent 60%),
    radial-gradient(ellipse at 80% 20%, rgba(0,200,255,0.15) 0%, transparent 50%);
}
.ev-flyer-ph {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  opacity: 0.25;
}
.ev-flyer-ph span {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--gray);
}
.ev-flyer-badge {
  position: absolute;
  top: 0; left: 0;
  background: var(--cyan);
  color: var(--black);
  font-family: var(--font-ui);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  padding: 6px 16px;
  clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
  z-index: 2;
}

.ev-info { padding: 28px; flex: 1; }
.ev-cat { font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--cyan); margin-bottom: 10px; }
.ev-title { font-family: var(--font-display); font-size: 28px; font-weight: 700; letter-spacing: 0.04em; color: var(--white); line-height: 1.05; margin-bottom: 12px; }
.ev-desc { font-size: 14px; color: var(--gray-light); line-height: 1.8; margin-bottom: 20px; }
.ev-metas { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
.ev-meta-item { display: flex; align-items: center; gap: 10px; font-family: var(--font-ui); font-size: 12px; color: var(--gray-light); letter-spacing: 0.06em; }
.ev-meta-icon { color: var(--cyan); width: 16px; font-size: 14px; }

.ev-map {
  margin: 0 28px 28px;
  border: 1px solid var(--border2);
  background: var(--deep);
  height: 140px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  position: relative;
  overflow: hidden;
}
.ev-map::before {
  content: '';
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(0,200,255,0.02) 10px, rgba(0,200,255,0.02) 20px);
}
.ev-map-icon { font-size: 28px; opacity: 0.3; }
.ev-map-label { font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray); }
.ev-map-sub { font-family: var(--font-ui); font-size: 10px; letter-spacing: 0.15em; color: rgba(0,200,255,0.4); }

.ev-right { padding: 28px; display: flex; flex-direction: column; }
.ev-right-title { font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray); margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--border); }

.ev-ticket-opt {
  border: 1px solid var(--border2);
  padding: 14px 16px;
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  transition: all 0.2s;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
}
.ev-ticket-opt:hover { border-color: rgba(0,200,255,0.3); background: var(--surface2); }
.ev-ticket-opt.sel { border-color: var(--cyan); background: var(--cyan-dim); }
.ev-ticket-opt-name { font-family: var(--font-ui); font-size: 15px; font-weight: 700; letter-spacing: 0.05em; color: var(--white); }
.ev-ticket-opt-desc { font-size: 11px; color: var(--gray); margin-top: 2px; }
.ev-ticket-opt-price { font-family: var(--font-display); font-size: 20px; font-weight: 700; color: var(--cyan); text-align: right; }
.ev-ticket-opt-price small { display: block; font-family: var(--font-ui); font-size: 9px; color: var(--gray); font-weight: normal; }

.ev-qty-block {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: var(--deep);
  border: 1px solid var(--border);
  margin: 14px 0;
}
.ev-qty-label { font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gray-light); }
.ev-qty-controls { display: flex; align-items: center; gap: 14px; }
.ev-qty-btn {
  width: 28px; height: 28px;
  background: var(--surface2);
  border: 1px solid var(--border2);
  color: var(--white);
  font-size: 16px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  transition: all 0.2s;
  line-height: 1;
}
.ev-qty-btn:hover { border-color: var(--cyan); color: var(--cyan); }
.ev-qty-num { font-family: var(--font-display); font-size: 22px; font-weight: 700; color: var(--white); min-width: 24px; text-align: center; }

.ev-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0;
  border-top: 1px solid var(--border);
  margin-bottom: 14px;
}
.ev-total-label { font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray); }
.ev-total-val { font-family: var(--font-display); font-size: 30px; font-weight: 900; color: var(--cyan); letter-spacing: 0.05em; }

.ev-note { font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.06em; color: var(--gray); line-height: 1.7; margin-bottom: 14px; }
.ev-actions { display: flex; flex-direction: column; gap: 8px; margin-top: auto; }

.ev-close {
  position: absolute;
  top: 16px; right: 16px;
  background: transparent;
  border: 1px solid var(--border2);
  color: var(--gray);
  width: 30px; height: 30px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  font-size: 14px;
  transition: all 0.2s;
  z-index: 10;
}
.ev-close:hover { border-color: #ff6b6b; color: #ff6b6b; }

/* =============================================
   CARRUSEL DE DESTACADOS (Blindaje Final V2)
============================================= */
.carousel-section {
  position: relative;
  max-width: 950px;
  margin: 0 auto 48px;
  padding: 0 40px;
  z-index: 1;
}

.carousel-wrap {
  position: relative;
  overflow: hidden;
  border-radius: 2px;
}

/* FORZAMOS EL TRACK HORIZONTAL */
.carousel-track {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  transition: transform 0.5s ease;
  will-change: transform;
}

/* CADA SLIDE OCUPA EL 100% DEL ANCHO */
.carousel-slide {
  min-width: 100% !important;
  width: 100% !important;
  flex-shrink: 0;
  display: grid;
  grid-template-columns: 1fr 350px;
  background: var(--surface);
  border: 1px solid var(--border2);
  clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 0 100%);
  overflow: hidden;
  min-height: 440px;
}

/* Imagen y contenido del slide */
.carousel-img {
  position: relative;
  background: linear-gradient(135deg, #0a0a1f 0%, #0d0820 50%, #080810 100%);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.carousel-img-overlay {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 40% 50%, rgba(59,47,217,0.25) 0%, transparent 60%),
    radial-gradient(ellipse at 80% 20%, rgba(0,200,255,0.12) 0%, transparent 50%);
}
.carousel-img img {
  width: 100%; height: 100%; object-fit: cover;
  position: absolute; inset: 0;
}
.carousel-img-ph {
  position: relative; z-index: 1;
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  opacity: 0.2;
}
.carousel-img-ph span {
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--gray);
}
.carousel-badge {
  position: absolute; top: 0; left: 0;
  background: var(--cyan); color: var(--black);
  font-family: var(--font-ui); font-size: 9px; font-weight: 700;
  letter-spacing: 0.2em; text-transform: uppercase;
  padding: 6px 16px;
  clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0 100%);
  z-index: 2;
}
.carousel-info {
  padding: 44px 36px;
  display: flex; flex-direction: column; justify-content: space-between;
  border-left: 1px solid var(--border);
}
.carousel-cat {
  font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--cyan); margin-bottom: 12px;
}
.carousel-title {
  font-family: var(--font-display); font-size: 32px; font-weight: 700;
  line-height: 1.05; letter-spacing: 0.04em; color: var(--white);
  margin-bottom: 12px;
}
.carousel-desc {
  font-size: 14px; color: var(--gray-light); line-height: 1.8;
  margin-bottom: 24px;
}
.carousel-meta {
  display: flex; flex-direction: column; gap: 8px; margin-bottom: 28px;
}
.carousel-meta-item {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--font-ui); font-size: 12px; color: var(--gray-light);
}
.carousel-meta-icon { color: var(--cyan); width: 16px; }
.carousel-price-row {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 20px; border-top: 1px solid var(--border);
}
.carousel-price-label {
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--gray);
}
.carousel-price-val {
  font-family: var(--font-display); font-size: 28px; font-weight: 900;
  color: var(--cyan); letter-spacing: 0.05em;
}

/* Flechas flotantes */
.carousel-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20;
  width: 44px; height: 44px;
  background: rgba(13,13,26,0.8);
  backdrop-filter: blur(6px);
  border: 1px solid var(--border2);
  color: var(--white);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; font-size: 18px;
  transition: all 0.2s;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
}
.carousel-arrow:hover {
  border-color: var(--cyan); color: var(--cyan);
  background: rgba(0,200,255,0.1);
}
.carousel-arrow-left  { left: 10px; }
.carousel-arrow-right { right: 10px; }

/* Dots */
.carousel-dots {
  display: flex; justify-content: center; gap: 8px;
  margin-top: 16px;
}
.carousel-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--border2); cursor: pointer;
  transition: all 0.3s; border: none;
}
.carousel-dot.active {
  background: var(--cyan); width: 24px; border-radius: 4px;
}

.carousel-empty {
  background: var(--surface); border: 1px solid var(--border2);
  padding: 60px; text-align: center;
  font-family: var(--font-ui); font-size: 12px; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--gray);
}

/* =============================================
   RESPONSIVO OPTIMIZADO (Swipe + CSS Snap Centrado)
============================================= */
@media (max-width: 768px) {
  .carousel-section {
    max-width: 100%;
    padding: 0 16px; /* Reducimos un poco el padding lateral para ganar espacio */
    margin-bottom: 32px;
  }
  
  .carousel-track {
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    transform: none !important;
    gap: 16px; /* Añade un espacio limpio entre tarjetas para que no se peguen */
  }
  
  .carousel-track::-webkit-scrollbar {
    display: none !important;
  }

  /* 🌟 CORREGIDO: Ancho exacto calculado y snap centrado */
  .carousel-slide {
    grid-template-columns: 1fr;
    min-height: auto;
    min-width: calc(100vw - 32px) !important; /* Ocupa el ancho de la pantalla menos los márgenes */
    width: calc(100vw - 32px) !important;
    scroll-snap-align: center !important; /* 👈 Esto centra la tarjeta perfectamente al deslizar */
  }
  
  .carousel-img {
    height: 320px;
  }
  
  .carousel-info {
    display: none;
  }
  
  .carousel-arrow {
    display: none !important;
  } 
}

/* =============================================
   USER BUTTON & MENU
============================================= */
.nav-user-wrap {
  position: relative;
}

#btn-user {
  background: var(--surface);
  border: 1px solid var(--border2);
  color: var(--gray-light);
  width: auto;
  min-width: 38px;
  height: 38px;
  padding: 0 12px;
  display: flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  font-family: var(--font-ui);
  font-size: 12px;
  letter-spacing: 0.08em;
  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%);
  transition: all 0.2s;
}
#btn-user:hover { border-color: var(--cyan); color: var(--cyan); }

#user-menu {
  display: none;
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  background: var(--surface);
  border: 1px solid var(--border2);
  min-width: 200px;
  z-index: 600;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  padding: 8px 0;
}
#user-menu.open { display: block; }

.umenu-name {
  font-family: var(--font-ui);
  font-size: 10px;
  letter-spacing: 0.12em;
  color: var(--gray);
  padding: 8px 16px 12px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 4px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.umenu-item {
  display: block;
  padding: 10px 16px;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: 0.06em;
  color: var(--gray-light);
  transition: all 0.15s;
  text-decoration: none;
}
.umenu-item:hover { color: var(--white); background: var(--surface2); }
.umenu-out { color: #ff6b6b !important; }
.umenu-out:hover { background: rgba(255,107,107,0.08) !important; }
.umenu-sep { height: 1px; background: var(--border); margin: 4px 0; }

/* =============================================
   RESPONSIVE (Actualización Demo Privada v1.2)
============================================= */
@media (max-width: 1024px) {
  .events-grid { grid-template-columns: repeat(2, 1fr); }
  .cat-grid { grid-template-columns: repeat(3, 1fr); }
  .products-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .how-grid { grid-template-columns: repeat(2, 1fr); }
  .how-item { border-bottom: 1px solid var(--border); }
  .featured-card { grid-template-columns: 1fr; }
  .featured-img { min-height: 220px; }
  .about-grid { grid-template-columns: 1fr; }
  .about-visual { display: none; }
}

@media (max-width: 768px) {
  #navbar { padding: 0 20px; }
  .nav-links {
    display: none;
    position: fixed;
    top: 64px; left: 0; right: 0;
    background: rgba(0,0,0,0.97);
    border-bottom: 1px solid var(--border);
    flex-direction: column;
    padding: 24px 20px;
    gap: 20px;
    z-index: 400;
  }
  .nav-links.open { display: flex; }
  .nav-hamburger { display: flex; }
  .nav-right .btn { display: none; }

  #hero { padding: 80px 20px 40px; }
  .hero-title { font-size: 36px; }
  .hero-desc { font-size: 14px; }
  .hero-stats { display: none; }
  .hero-scanline { display: none; }

  /* 🌟 BUSCADOR Y FILTROS MÓVILES (OPTIMIZADO V1.2) */
  #search { padding: 24px 16px; }
  
  .search-wrap { 
    display: grid !important;
    grid-template-columns: 1fr 1fr; /* 2 columnas simétricas para los selects */
    gap: 10px;
    padding: 12px;
    background: var(--surface, #121826);
    border: 1px solid var(--border, #1f293d);
    border-radius: 8px;
  }

  /* Campo de texto (Fila 1 completa) */
  .search-wrap .search-input {
    grid-column: 1 / -1;
    width: 100%;
    box-sizing: border-box;
    font-size: 14px;
  }

  /* Ocultar separadores de línea vertical en teléfonos */
  .search-wrap .search-sep { 
    display: none !important; 
  }

  /* Mostrar selects de Ciudad y Categoría (Fila 2 lado a lado) */
  .search-wrap .search-select { 
    display: block !important; 
    width: 100%;
    box-sizing: border-box;
    background: #0a0f1d;
    color: var(--white, #ffffff);
    border: 1px solid var(--border, #1f293d);
    padding: 10px;
    border-radius: 6px;
    font-size: 13px;
  }

  /* Botón de buscar (Fila 3 completa) */
  .search-wrap .search-btn { 
    grid-column: 1 / -1;
    width: 100%;
    padding: 12px;
    justify-content: center;
    box-sizing: border-box;
  }

  .section { padding: 0 16px 40px; }
  .section-head { flex-direction: column; gap: 12px; align-items: flex-start; }

  .events-grid { grid-template-columns: 1fr; gap: 12px; }
  .event-card-img { height: 180px; }
  .event-card-title { font-size: 14px; }

  .cat-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .products-grid { grid-template-columns: 1fr; }
  .how-grid { grid-template-columns: 1fr; }
  .how-item { border-right: none; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; text-align: center; }

  .auth-modal { max-height: 85vh; overflow-y: auto; padding-bottom: 40px; }
  .ev-modal { grid-template-columns: 1fr; }
  .ev-right { border-top: 1px solid var(--border); }

  .carousel-section { padding: 0 20px 40px; }
  .carousel-slide { grid-template-columns: 1fr; min-height: auto; }
  .carousel-img { min-height: 200px; }
  .carousel-info { padding: 20px; border-left: none; border-top: 1px solid var(--border); }
  .carousel-title { font-size: 22px; }

  footer { padding: 40px 20px 24px; }
}
/* =============================================
   PRÓXIMAMENTE OVERLAY (NEOSTORE)
============================================= */
.coming-soon-overlay {
  position: absolute; inset: 0;
  background: rgba(8, 8, 16, 0.82);
  backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center;
  z-index: 10; pointer-events: all;
}
.coming-soon-badge {
  border: 1px solid rgba(0,200,255,0.2);
  background: rgba(0,200,255,0.05);
  padding: 10px 28px;
  display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.coming-soon-badge span:first-child {
  font-family: var(--font-display); font-size: 18px; font-weight: 700;
  letter-spacing: 0.15em; color: rgba(0,200,255,0.6);
}
.coming-soon-badge span:last-child {
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 0.25em;
  text-transform: uppercase; color: rgba(0,200,255,0.35);
}
.nav-soon {
  font-family: var(--font-ui); font-size: 8px; letter-spacing: 0.15em;
  text-transform: uppercase; color: #FF5ECC;
  border: 1px solid rgba(255,94,204,0.4); padding: 2px 6px;
  margin-left: 4px; vertical-align: middle; position: relative; top: -1px;
}

/* =============================================
   PRODUCT CARD (NEOSTORE)
============================================= */
.product-card {
  background: var(--surface);
  border: 1px solid var(--border);
  cursor: pointer;
  transition: all 0.22s ease;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
  overflow: hidden;
}
.product-card:hover {
  border-color: var(--border2);
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(0,0,0,0.35);
}
.product-img {
  width: 100%;
  height: 180px;
  background: var(--surface2);
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid var(--border);
  position: relative;
  overflow: hidden;
}
.product-img-inner { opacity: 0.2; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.product-img-inner span { font-family: var(--font-ui); font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gray); }
.product-body { padding: 18px 18px 20px; }
.product-brand { font-family: var(--font-ui); font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--cyan); margin-bottom: 6px; }
.product-name { font-family: var(--font-ui); font-size: 15px; font-weight: 600; color: var(--white); margin-bottom: 4px; line-height: 1.3; }
.product-seller { font-size: 12px; color: var(--gray); margin-bottom: 14px; }
.product-footer { display: flex; align-items: center; justify-content: space-between; padding-top: 12px; border-top: 1px solid var(--border); }
.product-price { font-family: var(--font-display); font-size: 20px; font-weight: 700; color: var(--white); letter-spacing: 0.04em; }
.product-price small { font-family: var(--font-ui); font-size: 9px; color: var(--gray); font-weight: normal; }
.product-contact {
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--magenta);
  border: 1px solid rgba(255,94,204,0.3); padding: 5px 12px;
  background: var(--mag-dim); transition: all 0.2s;
}
.product-contact:hover { border-color: var(--magenta); }
/* =============================================
   REGLAS BLINDADAS PARA PANEL ADMIN Y STAFF
   (Al final del archivo para máxima prioridad)
============================================= */

/* --- Overlay de Próximamente (NEOtienda) --- */
.coming-soon-overlay {
  position: absolute; inset: 0;
  background: rgba(8, 8, 16, 0.82);
  backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center;
  z-index: 10; pointer-events: all;
}
.coming-soon-badge {
  border: 1px solid rgba(0,200,255,0.2);
  background: rgba(0,200,255,0.05);
  padding: 10px 28px;
  display: flex; flex-direction: column; align-items: center; gap: 6px;
}
.coming-soon-badge span:first-child {
  font-family: var(--font-display); font-size: 18px; font-weight: 700;
  letter-spacing: 0.15em; color: rgba(0,200,255,0.6);
}
.coming-soon-badge span:last-child {
  font-family: var(--font-ui); font-size: 10px; letter-spacing: 0.25em;
  text-transform: uppercase; color: rgba(0,200,255,0.35);
}

/* --- Inputs y Botones del Panel Admin (evita que los pise el CSS genérico) --- */
.admin-input, .admin-select, .admin-textarea {
  background: var(--deep) !important;
  border: 1px solid var(--border2) !important;
  outline: none;
  padding: 12px 14px;
  font-size: 14px; color: var(--white);
  width: 100%;
  transition: border-color 0.2s;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
}
.admin-input:focus, .admin-select:focus, .admin-textarea:focus { border-color: var(--cyan) !important; }

.btn-sm {
  font-family: var(--font-ui); font-size: 10px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
  padding: 7px 14px;
  display: inline-flex; align-items: center; gap: 6px;
  cursor: pointer; border: none;
  transition: all 0.2s;
  clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%);
}
.btn-sm-cyan { background: var(--cyan); color: var(--black); }
.btn-sm-red { background: rgba(255,107,107,0.15); color: var(--red); border: 1px solid rgba(255,107,107,0.3); }
.btn-sm-outline { background: transparent; color: var(--gray-light); border: 1px solid var(--border2); }

.btn-outline-red { background: transparent; color: var(--red); border: 1px solid rgba(255,107,107,0.4); width: auto; padding: 13px 28px; }
.btn-outline-red:hover { background: rgba(255,107,107,0.1); border-color: var(--red); }
.btn-red { background: var(--red); color: var(--black); }

/* --- Layout del Staff (para que la barra lateral no se rompa) --- */
.staff-layout { display: flex; min-height: 100vh; }
.staff-sidebar { background: var(--surface); border-right: 1px solid var(--border); padding: 32px 0; position: fixed; top: 0; left: 0; bottom: 0; width: 240px; overflow-y: auto; z-index: 100; }
.staff-main { flex: 1; margin-left: 240px; padding: 40px; min-height: 100vh; width: calc(100% - 240px); }
.staff-section { display: none; }
.staff-section.active { display: block; }

/* --- Aseguramos que los emojis y iconos se vean bien --- */
.cat-icon, .how-icon, .ev-meta-icon, .carousel-meta-icon, .ev-map-icon {
  font-family: 'Segoe UI Emoji', 'Apple Color Emoji', 'Noto Color Emoji', sans-serif;
}

/* --- Ajuste final para menú móvil --- */
.nav-links.open { display: flex !important; }
/* =============================================
   REGLAS BLINDADAS PARA CATÁLOGO
============================================= */

/* Layout de página */
.page-wrap { padding-top: 64px; min-height: 100vh; }
.page-header { padding: 48px 40px 32px; border-bottom: 1px solid var(--border); position: relative; overflow: hidden; }
.page-header::before { content: ''; position: absolute; top: -60px; right: -60px; width: 300px; height: 300px; background: radial-gradient(circle, rgba(59,47,217,0.2) 0%, transparent 70%); pointer-events: none; }
.page-header-eyebrow { font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.25em; text-transform: uppercase; color: var(--cyan); margin-bottom: 8px; display: flex; align-items: center; gap: 10px; }
.page-header-eyebrow::before { content: ''; width: 6px; height: 6px; background: var(--cyan); border-radius: 50%; animation: pulse 2s ease infinite; }
.page-header h1 { font-family: var(--font-display); font-size: clamp(28px, 5vw, 52px); font-weight: 900; letter-spacing: 0.04em; color: var(--white); line-height: 1; }
.page-header h1 span { color: var(--cyan); }

/* Barra de búsqueda */
.search-bar-wrap { padding: 28px 40px 0; display: flex; gap: 12px; align-items: stretch; }
.search-box { flex: 1; background: var(--surface); border: 1px solid var(--border2); display: flex; align-items: center; clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%); transition: border-color 0.2s; }
.search-box:focus-within { border-color: var(--cyan); }
.search-box-icon { padding: 0 16px; color: var(--gray); font-size: 16px; }
.search-box input { background: transparent; border: none; outline: none; padding: 14px 0; font-family: var(--font-body); font-size: 15px; color: var(--white); width: 100%; }
.search-box input::placeholder { color: var(--gray); }
.filter-btn { background: var(--surface); border: 1px solid var(--border2); padding: 0 24px; font-family: var(--font-ui); font-size: 12px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gray-light); display: flex; align-items: center; gap: 10px; clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%); transition: all 0.2s; cursor: pointer; }
.filter-btn:hover { border-color: var(--cyan); color: var(--cyan); }
.filter-btn.active { border-color: var(--cyan); color: var(--cyan); background: var(--cyan-dim); }

/* Panel de filtros */
.filter-panel { background: var(--surface); border-bottom: 1px solid var(--border); padding: 20px 40px; display: none; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.filter-panel.open { display: grid; }
.filter-group label { font-family: var(--font-ui); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--cyan); display: block; margin-bottom: 8px; }
.filter-select { background: var(--deep); border: 1px solid var(--border2); outline: none; padding: 10px 14px; font-family: var(--font-ui); font-size: 12px; color: var(--white); width: 100%; cursor: pointer; appearance: none; clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%); }
.filter-select option { background: var(--surface2); }

/* Barra de categorías */
.cats-bar { padding: 16px 40px 0; display: flex; gap: 8px; flex-wrap: wrap; }
.cat-pill { font-family: var(--font-ui); font-size: 11px; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; padding: 7px 16px; border: 1px solid var(--border2); color: var(--gray-light); background: transparent; cursor: pointer; transition: all 0.2s; clip-path: polygon(0 0, calc(100% - 7px) 0, 100% 7px, 100% 100%, 0 100%); }
.cat-pill:hover, .cat-pill.active { border-color: var(--cyan); color: var(--cyan); background: var(--cyan-dim); }

/* Grid del catálogo */
.catalog-grid { padding: 0 40px; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; margin-bottom: 48px; }
.results-count { font-family: var(--font-ui); font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gray); }
.results-count span { color: var(--cyan); }
.divider { margin: 0 40px 24px; border: none; border-top: 1px solid var(--border); position: relative; }
.divider::before { content: 'TODOS LOS EVENTOS'; position: absolute; top: -9px; left: 0; background: var(--black); padding-right: 16px; font-family: var(--font-ui); font-size: 10px; letter-spacing: 0.2em; color: var(--gray); }

/* Paginación */
.pagination { display: flex; justify-content: center; align-items: center; gap: 8px; padding: 0 40px 60px; }
.page-btn { font-family: var(--font-ui); font-size: 13px; font-weight: 600; letter-spacing: 0.1em; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border2); color: var(--gray-light); background: var(--surface); cursor: pointer; transition: all 0.2s; clip-path: polygon(0 0, calc(100% - 6px) 0, 100% 6px, 100% 100%, 0 100%); }
.page-btn:hover { border-color: var(--cyan); color: var(--cyan); }
.page-btn.active { background: var(--cyan); color: var(--black); border-color: var(--cyan); }
.page-btn-prev, .page-btn-next { width: auto; padding: 0 16px; font-size: 11px; letter-spacing: 0.15em; }

/* Nav del catálogo */
.nav-back { font-family: var(--font-ui); font-size: 12px; letter-spacing: 0.15em; text-transform: uppercase; color: var(--gray-light); border: 1px solid var(--border2); padding: 8px 16px; transition: all 0.2s; display: flex; align-items: center; gap: 8px; }
.nav-back:hover { border-color: var(--cyan); color: var(--cyan); }

/* Responsive del catálogo */
@media (max-width: 1200px) { .catalog-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 1024px) { .catalog-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 768px) { 
  .catalog-grid { padding: 0 20px; grid-template-columns: repeat(2, 1fr); }
  .page-header { padding: 32px 20px 24px; }
  .search-bar-wrap { padding: 20px 20px 0; flex-wrap: wrap; }
  .cats-bar { padding: 12px 20px 0; }
  .filter-panel { padding: 16px 20px; grid-template-columns: 1fr 1fr; }
  .divider { margin: 0 20px 20px; }
  .pagination { padding: 0 20px 40px; }
}
/* =============================================
   REGLA BLINDADA PARA NAV DEL CATÁLOGO
   (Fuerza Flexbox aunque no tenga id="navbar")
============================================= */
nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 64px !important;
  padding: 0 40px !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 500 !important;
  background: rgba(0,0,0,0.9) !important;
  backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* Aseguramos que los elementos internos no se estiren */
nav .nav-logo { flex-shrink: 0; }
nav .nav-right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
/* =============================================
   REGLA BLINDADA PARA NAV DEL CATÁLOGO
   (Fuerza Flexbox aunque no tenga id="navbar")
============================================= */
nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 64px !important;
  padding: 0 40px !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 500 !important;
  background: rgba(0,0,0,0.9) !important;
  backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid var(--border) !important;
}

/* Aseguramos que los elementos internos no se estiren */
nav .nav-logo { flex-shrink: 0; }
nav .nav-right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

/* Estilo del logo para que coincida con el de la landing */
nav .nav-logo .neo {
  font-family: var(--font-display); font-size: 18px; font-weight: 900;
  color: var(--cyan); letter-spacing: 0.05em;
  text-shadow: 0 0 20px rgba(0,200,255,0.5);
}
nav .nav-logo .subverso {
  font-family: var(--font-ui); font-size: 13px; font-weight: 600;
  letter-spacing: 0.25em; color: var(--gray-light);
  text-transform: uppercase;
  border-left: 1px solid var(--border2);
  padding-left: 10px; margin-left: 2px;
}

/* Aseguramos que el contenedor principal tenga márgenes laterales */
.page-wrap {
  padding-left: 40px !important;
  padding-right: 40px !important;
}

/* Responsive */
@media (max-width: 768px) {
  nav {
    padding: 0 20px !important;
  }
  .page-wrap {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}/* Forzar repintado del contenedor principal del admin */
.admin-main {
  contain: layout style paint;
  overflow-y: auto;
  max-height: calc(100vh - 60px);
  position: relative;
  z-index: 1;
}

/* Asegurar que solo una sección sea visible */
.admin-section {
  display: none;
  width: 100%;
}
.admin-section.active {
  display: block;
  min-height: 200px;
}
/* ==========================================================================
   MODALES GLOBAL (Optimizado contra bloqueos de clics)
   ========================================================================== */

/* Contenedor base para AMBAS modales (Oculto por completo) */
.ev-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(5, 7, 12, 0.95);
  display: none; /* <-- Cambiado: No existe en el mapa de clics si está cerrado */
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 20px;
}

/* Estado activo: Solo aquí aparece y permite interacciones */
.ev-modal-overlay.active {
  display: flex; /* <-- Se vuelve visible y activa */
}

/* MODAL 2: ZOOM (Capa superior) */
.zoom-overlay {
  z-index: 10000; /* Asegura estar por encima de la Modal 1 */
  background: rgba(3, 5, 10, 0.98);
}

.ev-modal-zoom-content {
  position: relative;
  width: 90%;
  max-width: 900px;
  max-height: 85vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

#zoom-img-target {
  width: 100%;
  height: auto;
  max-height: 85vh;
  object-fit: contain;
  border-radius: 6px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.8);
}

/* Estilos de la Modal 1 (Detalles) */
.ev-modal-content {
  background: #0d1220;
  border: 1px solid #1f293d;
  border-radius: 8px;
  position: relative;
  width: 100%;
  max-width: 850px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 30px;
  color: #ffffff;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
}

.ev-modal-body-layout {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 28px;
  margin-top: 15px;
}

.ev-modal-title {
  font-family: var(--font-display, sans-serif);
  font-size: 24px;
  font-weight: 800;
  text-transform: uppercase;
  color: #ffffff;
  margin-bottom: 10px;
  line-height: 1.2;
}

.ev-modal-date, .ev-modal-location {
  font-size: 14px;
  color: var(--cyan, #00ffff);
  margin-bottom: 6px;
  font-weight: 500;
}

.ev-modal-desc {
  font-size: 14px;
  line-height: 1.6;
  color: #a0aec0;
  margin-top: 15px;
}

.ev-modal-close {
  position: absolute;
  top: 15px;
  right: 20px;
  background: transparent;
  border: none;
  color: #a0aec0;
  font-size: 32px;
  line-height: 1;
  cursor: pointer;
  transition: color 0.2s ease;
  z-index: 10;
}

.ev-modal-close:hover {
  color: var(--cyan, #00ffff);
}

@media (max-width: 768px) {
  .ev-modal-body-layout { grid-template-columns: 1fr; gap: 20px; }
  .ev-modal-content { padding: 20px; padding-top: 40px; }
}

/* ─── FONDO ESTRELLADO ANIMADO ─── */
/* From Uiverse.io by jaykdoe (azul atenuado) */
.stars-bg {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background: radial-gradient(ellipse at bottom, var(--stars-fondo, #0a0f1a) 0%, #090a0f 100%);
}

#stars {
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 1px;
  background: transparent;
  box-shadow:
    501px 811px #fff,
    1450px 1324px #fff,
    1093px 1780px #fff,
    1469px 678px #fff,
    904px 741px #fff,
    1160px 781px #fff,
    1841px 1962px #fff,
    1630px 1667px #fff,
    1788px 676px #fff,
    367px 1734px #fff,
    1343px 156px #fff,
    1283px 1142px #fff,
    1062px 378px #fff,
    1395px 467px #fff,
    1017px 1891px #fff,
    137px 1114px #fff,
    1767px 1403px #fff,
    1543px 11px #fff,
    1078px 181px #fff,
    1189px 1574px #fff,
    1697px 1551px #fff,
    439px 472px #fff,
    1491px 677px #fff,
    1364px 599px #fff,
    34px 382px #fff,
    1221px 1584px #fff,
    1266px 1499px #fff,
    169px 1907px #fff,
    1219px 1125px #fff,
    659px 18px #fff,
    1731px 1959px #fff,
    332px 1216px #fff,
    1913px 788px #fff,
    80px 712px #fff,
    326px 1605px #fff,
    574px 1502px #fff,
    473px 1653px #fff,
    404px 975px #fff,
    322px 1797px #fff,
    425px 1321px #fff,
    1121px 1797px #fff,
    731px 647px #fff,
    891px 1584px #fff,
    1523px 109px #fff,
    1379px 244px #fff,
    865px 1064px #fff,
    493px 956px #fff,
    624px 1380px #fff,
    440px 619px #fff,
    1630px 767px #fff,
    955px 1196px #fff,
    62px 729px #fff,
    126px 946px #fff,
    1256px 896px #fff,
    1444px 256px #fff,
    661px 1628px #fff,
    1078px 1716px #fff,
    300px 737px #fff,
    1734px 413px #fff,
    1296px 129px #fff,
    1771px 1678px #fff,
    977px 1764px #fff,
    1879px 549px #fff,
    665px 1531px #fff,
    89px 701px #fff,
    1084px 1183px #fff,
    1597px 1576px #fff,
    1354px 1774px #fff,
    554px 1471px #fff,
    1469px 287px #fff,
    887px 106px #fff,
    1962px 766px #fff,
    638px 805px #fff,
    1651px 741px #fff,
    1517px 1826px #fff,
    24px 1152px #fff,
    507px 558px #fff,
    1262px 652px #fff,
    246px 1048px #fff,
    1077px 421px #fff,
    1866px 1847px #fff,
    1986px 1561px #fff,
    704px 632px #fff,
    1991px 1875px #fff,
    1227px 395px #fff,
    45px 1116px #fff,
    247px 786px #fff,
    890px 607px #fff,
    787px 1235px #fff,
    557px 524px #fff,
    1582px 1285px #fff,
    1725px 1366px #fff,
    952px 747px #fff,
    251px 458px #fff,
    1500px 1250px #fff,
    1999px 1734px #fff,
    1336px 1955px #fff,
    1705px 1464px #fff,
    728px 697px #fff,
    594px 510px #fff,
    1345px 1990px #fff,
    1919px 1803px #fff,
    1117px 966px #fff,
    1629px 97px #fff,
    1046px 1196px #fff,
    810px 1092px #fff,
    722px 976px #fff,
    406px 18px #fff,
    1665px 1860px #fff,
    1758px 1628px #fff,
    1183px 463px #fff,
    564px 239px #fff,
    13px 1767px #fff,
    1482px 1472px #fff,
    1700px 347px #fff,
    1362px 244px #fff,
    1141px 1708px #fff,
    22px 885px #fff,
    374px 1309px #fff,
    1034px 1037px #fff,
    1725px 1086px #fff,
    1343px 1921px #fff,
    596px 903px #fff,
    1061px 478px #fff,
    18px 1409px #fff,
    729px 1364px #fff,
    264px 911px #fff,
    677px 1442px #fff,
    123px 33px #fff,
    1303px 646px #fff,
    1945px 792px #fff,
    1305px 938px #fff,
    918px 1536px #fff,
    620px 948px #fff,
    183px 646px #fff,
    695px 687px #fff,
    881px 272px #fff,
    1521px 1212px #fff,
    1423px 1022px #fff,
    1545px 1271px #fff,
    1393px 348px #fff,
    685px 1910px #fff,
    1446px 856px #fff,
    73px 1201px #fff,
    736px 999px #fff,
    673px 796px #fff,
    469px 850px #fff,
    1912px 142px #fff,
    1278px 664px #fff,
    184px 1990px #fff,
    1173px 1312px #fff,
    782px 1879px #fff,
    323px 1035px #fff,
    611px 908px #fff,
    565px 1449px #fff,
    748px 1713px #fff,
    1047px 490px #fff,
    1040px 1872px #fff,
    1818px 1659px #fff,
    1806px 1327px #fff,
    386px 575px #fff,
    1550px 463px #fff,
    148px 687px #fff,
    651px 1683px #fff,
    1588px 1194px #fff,
    1831px 2px #fff,
    581px 876px #fff,
    1396px 1743px #fff,
    1212px 1810px #fff,
    421px 1920px #fff,
    658px 1461px #fff,
    1859px 1809px #fff,
    1456px 388px #fff,
    186px 1627px #fff,
    1528px 1145px #fff,
    171px 97px #fff,
    674px 1072px #fff,
    676px 1052px #fff,
    1165px 1131px #fff,
    1088px 781px #fff,
    1231px 948px #fff,
    330px 257px #fff,
    426px 1046px #fff,
    549px 652px #fff,
    1338px 74px #fff,
    1749px 364px #fff,
    931px 369px #fff,
    383px 1428px #fff,
    1558px 389px #fff,
    927px 133px #fff,
    234px 1888px #fff,
    1785px 1617px #fff,
    556px 643px #fff,
    401px 275px #fff,
    406px 1644px #fff,
    1253px 1852px #fff,
    1599px 883px #fff,
    744px 1721px #fff,
    524px 1297px #fff,
    1226px 1177px #fff,
    1679px 55px #fff,
    874px 1811px #fff,
    838px 790px #fff,
    1241px 430px #fff,
    1676px 652px #fff,
    1191px 568px #fff,
    53px 1990px #fff,
    1163px 237px #fff,
    61px 223px #fff,
    592px 456px #fff,
    1844px 271px #fff,
    1324px 1488px #fff,
    1373px 717px #fff,
    1822px 709px #fff,
    1464px 941px #fff,
    1445px 1118px #fff,
    991px 1414px #fff,
    1964px 1076px #fff,
    108px 172px #fff,
    641px 1722px #fff,
    1539px 427px #fff,
    1697px 45px #fff,
    1301px 1353px #fff,
    1060px 329px #fff,
    967px 1396px #fff,
    493px 301px #fff,
    1228px 1406px #fff,
    1211px 1653px #fff,
    444px 1822px #fff,
    1746px 353px #fff,
    1449px 381px #fff,
    671px 887px #fff,
    650px 138px #fff,
    30px 1839px #fff,
    1094px 1405px #fff,
    273px 796px #fff,
    1618px 1964px #fff,
    1045px 1849px #fff,
    1472px 1155px #fff,
    1529px 1312px #fff,
    728px 448px #fff,
    44px 1908px #fff,
    691px 818px #fff,
    254px 293px #fff,
    1981px 1133px #fff,
    1307px 375px #fff,
    196px 316px #fff,
    1241px 1975px #fff,
    1138px 1706px #fff,
    1769px 463px #fff,
    1768px 1428px #fff,
    1730px 590px #fff,
    1780px 523px #fff,
    1862px 1526px #fff,
    1613px 909px #fff,
    1266px 1781px #fff,
    470px 352px #fff,
    699px 1682px #fff,
    1002px 614px #fff,
    1209px 133px #fff,
    1842px 518px #fff,
    1422px 1836px #fff,
    1720px 1901px #fff,
    470px 1788px #fff,
    1355px 1387px #fff,
    146px 1162px #fff,
    933px 80px #fff,
    681px 1063px #fff,
    313px 1341px #fff,
    740px 1498px #fff,
    168px 1014px #fff,
    345px 1355px #fff,
    1498px 1562px #fff,
    1626px 1358px #fff,
    890px 403px #fff,
    663px 562px #fff,
    1481px 168px #fff,
    22px 719px #fff,
    774px 1041px #fff,
    1899px 829px #fff,
    430px 158px #fff,
    430px 361px #fff,
    1592px 1334px #fff,
    224px 323px #fff,
    1639px 1131px #fff,
    7px 271px #fff,
    1646px 1514px #fff,
    1605px 1444px #fff,
    1820px 1665px #fff,
    1549px 1641px #fff,
    1609px 1377px #fff,
    486px 1098px #fff,
    229px 613px #fff,
    542px 1694px #fff,
    318px 256px #fff,
    1861px 918px #fff,
    889px 892px #fff,
    442px 1524px #fff,
    19px 422px #fff,
    1935px 1908px #fff,
    828px 109px #fff,
    862px 1248px #fff,
    1275px 560px #fff,
    906px 63px #fff,
    337px 1605px #fff,
    1691px 918px #fff,
    1414px 679px #fff,
    1726px 749px #fff,
    1540px 1149px #fff,
    1337px 1466px #fff,
    446px 430px #fff,
    676px 1616px #fff,
    840px 326px #fff,
    976px 977px #fff,
    1840px 642px #fff,
    1273px 804px #fff,
    1071px 928px #fff,
    1292px 1675px #fff,
    29px 1148px #fff,
    1585px 135px #fff,
    1007px 563px #fff,
    1035px 78px #fff,
    1174px 574px #fff,
    120px 1304px #fff,
    845px 1292px #fff,
    861px 540px #fff,
    234px 232px #fff,
    1940px 1367px #fff,
    759px 639px #fff,
    1775px 1381px #fff,
    906px 372px #fff,
    1104px 1165px #fff,
    1524px 911px #fff,
    1882px 330px #fff,
    1389px 700px #fff,
    300px 1629px #fff,
    220px 1614px #fff,
    563px 140px #fff,
    1611px 1586px #fff,
    793px 1316px #fff,
    325px 1070px #fff,
    1722px 1462px #fff,
    1406px 1120px #fff,
    1169px 1768px #fff,
    1956px 1053px #fff,
    959px 1587px #fff,
    585px 1566px #fff,
    370px 204px #fff,
    1606px 1416px #fff,
    443px 1606px #fff,
    1499px 1102px #fff,
    1943px 105px #fff,
    1121px 1594px #fff,
    1512px 32px #fff,
    871px 1425px #fff,
    433px 100px #fff,
    294px 1471px #fff,
    1688px 1755px #fff,
    1666px 591px #fff,
    1034px 300px #fff,
    734px 1178px #fff,
    1342px 313px #fff,
    1616px 1590px #fff,
    1763px 1472px #fff,
    632px 1935px #fff,
    1708px 872px #fff,
    1871px 915px #fff,
    1829px 1020px #fff,
    1599px 578px #fff,
    42px 585px #fff,
    1163px 1382px #fff,
    1744px 1272px #fff,
    984px 1426px #fff,
    1786px 1584px #fff,
    1813px 379px #fff,
    1867px 1127px #fff,
    97px 567px #fff,
    626px 988px #fff,
    1178px 79px #fff,
    1703px 211px #fff,
    961px 1785px #fff,
    110px 975px #fff,
    953px 1941px #fff,
    1027px 1790px #fff,
    1665px 107px #fff,
    11px 964px #fff,
    1718px 1147px #fff,
    21px 1728px #fff,
    1358px 1922px #fff,
    872px 65px #fff,
    1191px 1635px #fff,
    762px 681px #fff,
    1519px 1033px #fff,
    906px 566px #fff,
    1074px 657px #fff,
    1093px 415px #fff,
    51px 198px #fff,
    1075px 1418px #fff,
    1547px 1070px #fff,
    225px 920px #fff,
    850px 1974px #fff,
    981px 595px #fff,
    1425px 131px #fff,
    460px 917px #fff,
    56px 495px #fff,
    714px 428px #fff,
    920px 493px #fff,
    470px 1521px #fff,
    532px 821px #fff,
    1905px 71px #fff,
    883px 1501px #fff,
    294px 196px #fff,
    381px 1999px #fff,
    332px 793px #fff,
    1246px 408px #fff,
    233px 149px #fff,
    315px 231px #fff,
    1594px 1302px #fff,
    696px 1585px #fff,
    791px 136px #fff,
    479px 199px #fff,
    1627px 1413px #fff,
    1824px 924px #fff,
    1631px 342px #fff,
    1251px 1151px #fff,
    284px 1781px #fff,
    497px 1052px #fff,
    204px 1161px #fff,
    646px 1499px #fff,
    1762px 558px #fff,
    854px 1833px #fff,
    883px 945px #fff,
    44px 982px #fff,
    1101px 834px #fff,
    515px 1748px #fff,
    1578px 1435px #fff,
    819px 1258px #fff,
    776px 670px #fff,
    115px 385px #fff,
    1478px 434px #fff,
    885px 20px #fff,
    192px 1513px #fff,
    78px 1129px #fff,
    1774px 1105px #fff,
    955px 1149px #fff,
    1817px 1929px #fff,
    1106px 1832px #fff,
    1107px 1997px #fff,
    94px 23px #fff,
    243px 982px #fff,
    43px 1972px #fff,
    1798px 673px #fff,
    1131px 1589px #fff,
    841px 14px #fff,
    826px 345px #fff,
    687px 56px #fff,
    1084px 32px #fff,
    1887px 1878px #fff,
    153px 526px #fff,
    1828px 253px #fff,
    1947px 1105px #fff,
    886px 700px #fff,
    1307px 1723px #fff,
    1274px 651px #fff,
    1530px 837px #fff,
    1699px 1637px #fff,
    1703px 1331px #fff,
    1929px 1557px #fff,
    1763px 737px #fff,
    1118px 1680px #fff,
    1545px 692px #fff,
    1462px 1092px #fff,
    208px 1667px #fff,
    1393px 859px #fff,
    186px 1794px #fff,
    351px 1199px #fff,
    642px 1995px #fff,
    1061px 1726px #fff,
    1708px 115px #fff,
    1233px 1305px #fff,
    637px 1786px #fff,
    1730px 603px #fff,
    75px 1240px #fff,
    1704px 1326px #fff,
    584px 346px #fff,
    438px 1554px #fff,
    561px 513px #fff,
    1382px 225px #fff,
    467px 1674px #fff,
    1403px 815px #fff,
    1546px 1835px #fff,
    127px 1119px #fff,
    276px 591px #fff,
    688px 1458px #fff,
    765px 646px #fff,
    474px 984px #fff,
    171px 361px #fff,
    94px 1480px #fff,
    1962px 1666px #fff,
    909px 1037px #fff,
    1725px 222px #fff,
    253px 1355px #fff,
    1892px 1901px #fff,
    275px 1847px #fff,
    28px 1184px #fff,
    1725px 1382px #fff,
    882px 647px #fff,
    1935px 1046px #fff,
    10px 344px #fff,
    292px 1328px #fff,
    127px 1352px #fff,
    752px 929px #fff,
    1589px 384px #fff,
    284px 1829px #fff,
    381px 820px #fff,
    1229px 1125px #fff,
    777px 429px #fff,
    1811px 1499px #fff,
    1573px 287px #fff,
    295px 756px #fff,
    389px 616px #fff,
    781px 41px #fff,
    1092px 333px #fff,
    794px 1588px #fff,
    386px 1847px #fff,
    1802px 710px #fff,
    662px 60px #fff,
    640px 264px #fff,
    463px 746px #fff,
    1859px 799px #fff,
    763px 37px #fff,
    639px 396px #fff,
    357px 1071px #fff,
    1190px 1430px #fff,
    1814px 257px #fff,
    1382px 235px #fff,
    606px 1304px #fff,
    1939px 1470px #fff,
    1124px 349px #fff,
    307px 1567px #fff,
    310px 1323px #fff,
    1145px 922px #fff,
    1196px 1922px #fff,
    1647px 544px #fff,
    788px 1337px #fff,
    257px 632px #fff,
    1413px 414px #fff,
    590px 620px #fff,
    582px 794px #fff,
    1702px 1481px #fff,
    1055px 53px #fff,
    157px 346px #fff,
    50px 1901px #fff,
    1038px 1369px #fff,
    796px 1941px #fff,
    215px 194px #fff,
    1567px 1538px #fff,
    367px 800px #fff,
    1044px 489px #fff,
    1109px 1712px #fff,
    524px 327px #fff,
    525px 1252px #fff,
    1475px 1240px #fff,
    529px 436px #fff,
    795px 834px #fff,
    122px 1371px #fff,
    79px 482px #fff,
    520px 1249px #fff,
    336px 1878px #fff,
    188px 944px #fff,
    325px 1259px #fff,
    1491px 1942px #fff,
    620px 1054px #fff,
    1606px 1153px #fff,
    1448px 502px #fff,
    53px 1381px #fff,
    107px 1670px #fff,
    1380px 618px #fff,
    967px 1557px #fff,
    1116px 1722px #fff,
    1174px 1044px #fff,
    1805px 717px #fff,
    663px 394px #fff,
    1848px 1007px #fff,
    389px 802px #fff,
    49px 392px #fff,
    1650px 852px #fff,
    1678px 1012px #fff,
    335px 1009px #fff,
    1818px 1631px #fff,
    1568px 742px #fff,
    1162px 1991px #fff,
    52px 1190px #fff,
    1401px 928px #fff,
    119px 1549px #fff,
    537px 1529px #fff,
    2px 1709px #fff,
    122px 387px #fff,
    543px 2px #fff,
    27px 1971px #fff,
    507px 1377px #fff,
    1362px 1080px #fff,
    1031px 1544px #fff,
    1631px 1174px #fff,
    1603px 312px #fff,
    1626px 1422px #fff,
    1430px 615px #fff,
    1958px 1431px #fff,
    1946px 1412px #fff,
    1848px 247px #fff,
    984px 1808px #fff,
    1396px 225px #fff,
    319px 717px #fff,
    1252px 875px #fff,
    1619px 156px #fff,
    951px 1971px #fff,
    386px 355px #fff,
    1406px 1151px #fff,
    273px 1538px #fff,
    844px 1570px #fff,
    947px 151px #fff,
    1363px 525px #fff,
    209px 307px #fff,
    1923px 1718px #fff,
    993px 1741px #fff,
    1513px 353px #fff,
    1353px 61px #fff,
    664px 352px #fff,
    1382px 359px #fff,
    1487px 1707px #fff,
    657px 1045px #fff,
    1107px 490px #fff,
    1834px 1176px #fff,
    837px 1438px #fff,
    1947px 448px #fff,
    1196px 333px #fff,
    151px 555px #fff,
    18px 992px #fff,
    458px 748px #fff,
    1801px 890px #fff,
    1093px 1012px #fff,
    315px 1101px #fff,
    194px 323px #fff,
    754px 292px #fff,
    1737px 7px #fff,
    40px 840px #fff,
    1170px 805px #fff,
    176px 1753px #fff,
    805px 1148px #fff,
    1578px 1271px #fff,
    367px 1494px #fff,
    363px 1111px #fff,
    1955px 243px #fff,
    1451px 1093px #fff,
    375px 617px #fff,
    1223px 720px #fff,
    1178px 13px #fff,
    1456px 865px #fff,
    1440px 49px #fff,
    186px 1569px #fff,
    320px 1853px #fff,
    300px 539px #fff,
    1559px 509px #fff,
    1985px 1108px #fff,
    1588px 828px #fff,
    525px 1432px #fff,
    831px 363px #fff,
    141px 281px #fff,
    1319px 402px #fff,
    40px 456px #fff,
    1955px 478px #fff,
    1758px 818px #fff,
    1924px 688px #fff,
    1030px 953px #fff,
    1982px 210px #fff,
    917px 1401px #fff,
    1051px 1837px #fff,
    1045px 463px #fff,
    1744px 573px #fff,
    529px 1530px #fff,
    542px 469px #fff,
    1982px 324px #fff,
    1902px 1422px #fff,
    1968px 782px #fff,
    1666px 1561px #fff,
    955px 304px #fff,
    323px 778px #fff,
    272px 443px #fff,
    485px 581px #fff,
    1353px 1058px #fff,
    1257px 131px #fff,
    434px 98px #fff,
    1587px 1953px #fff,
    1749px 68px #fff,
    1984px 839px #fff,
    1518px 183px #fff,
    1071px 855px #fff,
    1662px 1994px #fff,
    1111px 106px #fff,
    1954px 838px #fff;
  animation: animStar 50s linear infinite;
}
#stars:after {
  content: " ";
  position: absolute;
  top: 2000px;
  width: 1px;
  height: 1px;
  background: transparent;
  box-shadow:
    501px 811px #fff,
    1450px 1324px #fff,
    1093px 1780px #fff,
    1469px 678px #fff,
    904px 741px #fff,
    1160px 781px #fff,
    1841px 1962px #fff,
    1630px 1667px #fff,
    1788px 676px #fff,
    367px 1734px #fff,
    1343px 156px #fff,
    1283px 1142px #fff,
    1062px 378px #fff,
    1395px 467px #fff,
    1017px 1891px #fff,
    137px 1114px #fff,
    1767px 1403px #fff,
    1543px 11px #fff,
    1078px 181px #fff,
    1189px 1574px #fff,
    1697px 1551px #fff,
    439px 472px #fff,
    1491px 677px #fff,
    1364px 599px #fff,
    34px 382px #fff,
    1221px 1584px #fff,
    1266px 1499px #fff,
    169px 1907px #fff,
    1219px 1125px #fff,
    659px 18px #fff,
    1731px 1959px #fff,
    332px 1216px #fff,
    1913px 788px #fff,
    80px 712px #fff,
    326px 1605px #fff,
    574px 1502px #fff,
    473px 1653px #fff,
    404px 975px #fff,
    322px 1797px #fff,
    425px 1321px #fff,
    1121px 1797px #fff,
    731px 647px #fff,
    891px 1584px #fff,
    1523px 109px #fff,
    1379px 244px #fff,
    865px 1064px #fff,
    493px 956px #fff,
    624px 1380px #fff,
    440px 619px #fff,
    1630px 767px #fff,
    955px 1196px #fff,
    62px 729px #fff,
    126px 946px #fff,
    1256px 896px #fff,
    1444px 256px #fff,
    661px 1628px #fff,
    1078px 1716px #fff,
    300px 737px #fff,
    1734px 413px #fff,
    1296px 129px #fff,
    1771px 1678px #fff,
    977px 1764px #fff,
    1879px 549px #fff,
    665px 1531px #fff,
    89px 701px #fff,
    1084px 1183px #fff,
    1597px 1576px #fff,
    1354px 1774px #fff,
    554px 1471px #fff,
    1469px 287px #fff,
    887px 106px #fff,
    1962px 766px #fff,
    638px 805px #fff,
    1651px 741px #fff,
    1517px 1826px #fff,
    24px 1152px #fff,
    507px 558px #fff,
    1262px 652px #fff,
    246px 1048px #fff,
    1077px 421px #fff,
    1866px 1847px #fff,
    1986px 1561px #fff,
    704px 632px #fff,
    1991px 1875px #fff,
    1227px 395px #fff,
    45px 1116px #fff,
    247px 786px #fff,
    890px 607px #fff,
    787px 1235px #fff,
    557px 524px #fff,
    1582px 1285px #fff,
    1725px 1366px #fff,
    952px 747px #fff,
    251px 458px #fff,
    1500px 1250px #fff,
    1999px 1734px #fff,
    1336px 1955px #fff,
    1705px 1464px #fff,
    728px 697px #fff,
    594px 510px #fff,
    1345px 1990px #fff,
    1919px 1803px #fff,
    1117px 966px #fff,
    1629px 97px #fff,
    1046px 1196px #fff,
    810px 1092px #fff,
    722px 976px #fff,
    406px 18px #fff,
    1665px 1860px #fff,
    1758px 1628px #fff,
    1183px 463px #fff,
    564px 239px #fff,
    13px 1767px #fff,
    1482px 1472px #fff,
    1700px 347px #fff,
    1362px 244px #fff,
    1141px 1708px #fff,
    22px 885px #fff,
    374px 1309px #fff,
    1034px 1037px #fff,
    1725px 1086px #fff,
    1343px 1921px #fff,
    596px 903px #fff,
    1061px 478px #fff,
    18px 1409px #fff,
    729px 1364px #fff,
    264px 911px #fff,
    677px 1442px #fff,
    123px 33px #fff,
    1303px 646px #fff,
    1945px 792px #fff,
    1305px 938px #fff,
    918px 1536px #fff,
    620px 948px #fff,
    183px 646px #fff,
    695px 687px #fff,
    881px 272px #fff,
    1521px 1212px #fff,
    1423px 1022px #fff,
    1545px 1271px #fff,
    1393px 348px #fff,
    685px 1910px #fff,
    1446px 856px #fff,
    73px 1201px #fff,
    736px 999px #fff,
    673px 796px #fff,
    469px 850px #fff,
    1912px 142px #fff,
    1278px 664px #fff,
    184px 1990px #fff,
    1173px 1312px #fff,
    782px 1879px #fff,
    323px 1035px #fff,
    611px 908px #fff,
    565px 1449px #fff,
    748px 1713px #fff,
    1047px 490px #fff,
    1040px 1872px #fff,
    1818px 1659px #fff,
    1806px 1327px #fff,
    386px 575px #fff,
    1550px 463px #fff,
    148px 687px #fff,
    651px 1683px #fff,
    1588px 1194px #fff,
    1831px 2px #fff,
    581px 876px #fff,
    1396px 1743px #fff,
    1212px 1810px #fff,
    421px 1920px #fff,
    658px 1461px #fff,
    1859px 1809px #fff,
    1456px 388px #fff,
    186px 1627px #fff,
    1528px 1145px #fff,
    171px 97px #fff,
    674px 1072px #fff,
    676px 1052px #fff,
    1165px 1131px #fff,
    1088px 781px #fff,
    1231px 948px #fff,
    330px 257px #fff,
    426px 1046px #fff,
    549px 652px #fff,
    1338px 74px #fff,
    1749px 364px #fff,
    931px 369px #fff,
    383px 1428px #fff,
    1558px 389px #fff,
    927px 133px #fff,
    234px 1888px #fff,
    1785px 1617px #fff,
    556px 643px #fff,
    401px 275px #fff,
    406px 1644px #fff,
    1253px 1852px #fff,
    1599px 883px #fff,
    744px 1721px #fff,
    524px 1297px #fff,
    1226px 1177px #fff,
    1679px 55px #fff,
    874px 1811px #fff,
    838px 790px #fff,
    1241px 430px #fff,
    1676px 652px #fff,
    1191px 568px #fff,
    53px 1990px #fff,
    1163px 237px #fff,
    61px 223px #fff,
    592px 456px #fff,
    1844px 271px #fff,
    1324px 1488px #fff,
    1373px 717px #fff,
    1822px 709px #fff,
    1464px 941px #fff,
    1445px 1118px #fff,
    991px 1414px #fff,
    1964px 1076px #fff,
    108px 172px #fff,
    641px 1722px #fff,
    1539px 427px #fff,
    1697px 45px #fff,
    1301px 1353px #fff,
    1060px 329px #fff,
    967px 1396px #fff,
    493px 301px #fff,
    1228px 1406px #fff,
    1211px 1653px #fff,
    444px 1822px #fff,
    1746px 353px #fff,
    1449px 381px #fff,
    671px 887px #fff,
    650px 138px #fff,
    30px 1839px #fff,
    1094px 1405px #fff,
    273px 796px #fff,
    1618px 1964px #fff,
    1045px 1849px #fff,
    1472px 1155px #fff,
    1529px 1312px #fff,
    728px 448px #fff,
    44px 1908px #fff,
    691px 818px #fff,
    254px 293px #fff,
    1981px 1133px #fff,
    1307px 375px #fff,
    196px 316px #fff,
    1241px 1975px #fff,
    1138px 1706px #fff,
    1769px 463px #fff,
    1768px 1428px #fff,
    1730px 590px #fff,
    1780px 523px #fff,
    1862px 1526px #fff,
    1613px 909px #fff,
    1266px 1781px #fff,
    470px 352px #fff,
    699px 1682px #fff,
    1002px 614px #fff,
    1209px 133px #fff,
    1842px 518px #fff,
    1422px 1836px #fff,
    1720px 1901px #fff,
    470px 1788px #fff,
    1355px 1387px #fff,
    146px 1162px #fff,
    933px 80px #fff,
    681px 1063px #fff,
    313px 1341px #fff,
    740px 1498px #fff,
    168px 1014px #fff,
    345px 1355px #fff,
    1498px 1562px #fff,
    1626px 1358px #fff,
    890px 403px #fff,
    663px 562px #fff,
    1481px 168px #fff,
    22px 719px #fff,
    774px 1041px #fff,
    1899px 829px #fff,
    430px 158px #fff,
    430px 361px #fff,
    1592px 1334px #fff,
    224px 323px #fff,
    1639px 1131px #fff,
    7px 271px #fff,
    1646px 1514px #fff,
    1605px 1444px #fff,
    1820px 1665px #fff,
    1549px 1641px #fff,
    1609px 1377px #fff,
    486px 1098px #fff,
    229px 613px #fff,
    542px 1694px #fff,
    318px 256px #fff,
    1861px 918px #fff,
    889px 892px #fff,
    442px 1524px #fff,
    19px 422px #fff,
    1935px 1908px #fff,
    828px 109px #fff,
    862px 1248px #fff,
    1275px 560px #fff,
    906px 63px #fff,
    337px 1605px #fff,
    1691px 918px #fff,
    1414px 679px #fff,
    1726px 749px #fff,
    1540px 1149px #fff,
    1337px 1466px #fff,
    446px 430px #fff,
    676px 1616px #fff,
    840px 326px #fff,
    976px 977px #fff,
    1840px 642px #fff,
    1273px 804px #fff,
    1071px 928px #fff,
    1292px 1675px #fff,
    29px 1148px #fff,
    1585px 135px #fff,
    1007px 563px #fff,
    1035px 78px #fff,
    1174px 574px #fff,
    120px 1304px #fff,
    845px 1292px #fff,
    861px 540px #fff,
    234px 232px #fff,
    1940px 1367px #fff,
    759px 639px #fff,
    1775px 1381px #fff,
    906px 372px #fff,
    1104px 1165px #fff,
    1524px 911px #fff,
    1882px 330px #fff,
    1389px 700px #fff,
    300px 1629px #fff,
    220px 1614px #fff,
    563px 140px #fff,
    1611px 1586px #fff,
    793px 1316px #fff,
    325px 1070px #fff,
    1722px 1462px #fff,
    1406px 1120px #fff,
    1169px 1768px #fff,
    1956px 1053px #fff,
    959px 1587px #fff,
    585px 1566px #fff,
    370px 204px #fff,
    1606px 1416px #fff,
    443px 1606px #fff,
    1499px 1102px #fff,
    1943px 105px #fff,
    1121px 1594px #fff,
    1512px 32px #fff,
    871px 1425px #fff,
    433px 100px #fff,
    294px 1471px #fff,
    1688px 1755px #fff,
    1666px 591px #fff,
    1034px 300px #fff,
    734px 1178px #fff,
    1342px 313px #fff,
    1616px 1590px #fff,
    1763px 1472px #fff,
    632px 1935px #fff,
    1708px 872px #fff,
    1871px 915px #fff,
    1829px 1020px #fff,
    1599px 578px #fff,
    42px 585px #fff,
    1163px 1382px #fff,
    1744px 1272px #fff,
    984px 1426px #fff,
    1786px 1584px #fff,
    1813px 379px #fff,
    1867px 1127px #fff,
    97px 567px #fff,
    626px 988px #fff,
    1178px 79px #fff,
    1703px 211px #fff,
    961px 1785px #fff,
    110px 975px #fff,
    953px 1941px #fff,
    1027px 1790px #fff,
    1665px 107px #fff,
    11px 964px #fff,
    1718px 1147px #fff,
    21px 1728px #fff,
    1358px 1922px #fff,
    872px 65px #fff,
    1191px 1635px #fff,
    762px 681px #fff,
    1519px 1033px #fff,
    906px 566px #fff,
    1074px 657px #fff,
    1093px 415px #fff,
    51px 198px #fff,
    1075px 1418px #fff,
    1547px 1070px #fff,
    225px 920px #fff,
    850px 1974px #fff,
    981px 595px #fff,
    1425px 131px #fff,
    460px 917px #fff,
    56px 495px #fff,
    714px 428px #fff,
    920px 493px #fff,
    470px 1521px #fff,
    532px 821px #fff,
    1905px 71px #fff,
    883px 1501px #fff,
    294px 196px #fff,
    381px 1999px #fff,
    332px 793px #fff,
    1246px 408px #fff,
    233px 149px #fff,
    315px 231px #fff,
    1594px 1302px #fff,
    696px 1585px #fff,
    791px 136px #fff,
    479px 199px #fff,
    1627px 1413px #fff,
    1824px 924px #fff,
    1631px 342px #fff,
    1251px 1151px #fff,
    284px 1781px #fff,
    497px 1052px #fff,
    204px 1161px #fff,
    646px 1499px #fff,
    1762px 558px #fff,
    854px 1833px #fff,
    883px 945px #fff,
    44px 982px #fff,
    1101px 834px #fff,
    515px 1748px #fff,
    1578px 1435px #fff,
    819px 1258px #fff,
    776px 670px #fff,
    115px 385px #fff,
    1478px 434px #fff,
    885px 20px #fff,
    192px 1513px #fff,
    78px 1129px #fff,
    1774px 1105px #fff,
    955px 1149px #fff,
    1817px 1929px #fff,
    1106px 1832px #fff,
    1107px 1997px #fff,
    94px 23px #fff,
    243px 982px #fff,
    43px 1972px #fff,
    1798px 673px #fff,
    1131px 1589px #fff,
    841px 14px #fff,
    826px 345px #fff,
    687px 56px #fff,
    1084px 32px #fff,
    1887px 1878px #fff,
    153px 526px #fff,
    1828px 253px #fff,
    1947px 1105px #fff,
    886px 700px #fff,
    1307px 1723px #fff,
    1274px 651px #fff,
    1530px 837px #fff,
    1699px 1637px #fff,
    1703px 1331px #fff,
    1929px 1557px #fff,
    1763px 737px #fff,
    1118px 1680px #fff,
    1545px 692px #fff,
    1462px 1092px #fff,
    208px 1667px #fff,
    1393px 859px #fff,
    186px 1794px #fff,
    351px 1199px #fff,
    642px 1995px #fff,
    1061px 1726px #fff,
    1708px 115px #fff,
    1233px 1305px #fff,
    637px 1786px #fff,
    1730px 603px #fff,
    75px 1240px #fff,
    1704px 1326px #fff,
    584px 346px #fff,
    438px 1554px #fff,
    561px 513px #fff,
    1382px 225px #fff,
    467px 1674px #fff,
    1403px 815px #fff,
    1546px 1835px #fff,
    127px 1119px #fff,
    276px 591px #fff,
    688px 1458px #fff,
    765px 646px #fff,
    474px 984px #fff,
    171px 361px #fff,
    94px 1480px #fff,
    1962px 1666px #fff,
    909px 1037px #fff,
    1725px 222px #fff,
    253px 1355px #fff,
    1892px 1901px #fff,
    275px 1847px #fff,
    28px 1184px #fff,
    1725px 1382px #fff,
    882px 647px #fff,
    1935px 1046px #fff,
    10px 344px #fff,
    292px 1328px #fff,
    127px 1352px #fff,
    752px 929px #fff,
    1589px 384px #fff,
    284px 1829px #fff,
    381px 820px #fff,
    1229px 1125px #fff,
    777px 429px #fff,
    1811px 1499px #fff,
    1573px 287px #fff,
    295px 756px #fff,
    389px 616px #fff,
    781px 41px #fff,
    1092px 333px #fff,
    794px 1588px #fff,
    386px 1847px #fff,
    1802px 710px #fff,
    662px 60px #fff,
    640px 264px #fff,
    463px 746px #fff,
    1859px 799px #fff,
    763px 37px #fff,
    639px 396px #fff,
    357px 1071px #fff,
    1190px 1430px #fff,
    1814px 257px #fff,
    1382px 235px #fff,
    606px 1304px #fff,
    1939px 1470px #fff,
    1124px 349px #fff,
    307px 1567px #fff,
    310px 1323px #fff,
    1145px 922px #fff,
    1196px 1922px #fff,
    1647px 544px #fff,
    788px 1337px #fff,
    257px 632px #fff,
    1413px 414px #fff,
    590px 620px #fff,
    582px 794px #fff,
    1702px 1481px #fff,
    1055px 53px #fff,
    157px 346px #fff,
    50px 1901px #fff,
    1038px 1369px #fff,
    796px 1941px #fff,
    215px 194px #fff,
    1567px 1538px #fff,
    367px 800px #fff,
    1044px 489px #fff,
    1109px 1712px #fff,
    524px 327px #fff,
    525px 1252px #fff,
    1475px 1240px #fff,
    529px 436px #fff,
    795px 834px #fff,
    122px 1371px #fff,
    79px 482px #fff,
    520px 1249px #fff,
    336px 1878px #fff,
    188px 944px #fff,
    325px 1259px #fff,
    1491px 1942px #fff,
    620px 1054px #fff,
    1606px 1153px #fff,
    1448px 502px #fff,
    53px 1381px #fff,
    107px 1670px #fff,
    1380px 618px #fff,
    967px 1557px #fff,
    1116px 1722px #fff,
    1174px 1044px #fff,
    1805px 717px #fff,
    663px 394px #fff,
    1848px 1007px #fff,
    389px 802px #fff,
    49px 392px #fff,
    1650px 852px #fff,
    1678px 1012px #fff,
    335px 1009px #fff,
    1818px 1631px #fff,
    1568px 742px #fff,
    1162px 1991px #fff,
    52px 1190px #fff,
    1401px 928px #fff,
    119px 1549px #fff,
    537px 1529px #fff,
    2px 1709px #fff,
    122px 387px #fff,
    543px 2px #fff,
    27px 1971px #fff,
    507px 1377px #fff,
    1362px 1080px #fff,
    1031px 1544px #fff,
    1631px 1174px #fff,
    1603px 312px #fff,
    1626px 1422px #fff,
    1430px 615px #fff,
    1958px 1431px #fff,
    1946px 1412px #fff,
    1848px 247px #fff,
    984px 1808px #fff,
    1396px 225px #fff,
    319px 717px #fff,
    1252px 875px #fff,
    1619px 156px #fff,
    951px 1971px #fff,
    386px 355px #fff,
    1406px 1151px #fff,
    273px 1538px #fff,
    844px 1570px #fff,
    947px 151px #fff,
    1363px 525px #fff,
    209px 307px #fff,
    1923px 1718px #fff,
    993px 1741px #fff,
    1513px 353px #fff,
    1353px 61px #fff,
    664px 352px #fff,
    1382px 359px #fff,
    1487px 1707px #fff,
    657px 1045px #fff,
    1107px 490px #fff,
    1834px 1176px #fff,
    837px 1438px #fff,
    1947px 448px #fff,
    1196px 333px #fff,
    151px 555px #fff,
    18px 992px #fff,
    458px 748px #fff,
    1801px 890px #fff,
    1093px 1012px #fff,
    315px 1101px #fff,
    194px 323px #fff,
    754px 292px #fff,
    1737px 7px #fff,
    40px 840px #fff,
    1170px 805px #fff,
    176px 1753px #fff,
    805px 1148px #fff,
    1578px 1271px #fff,
    367px 1494px #fff,
    363px 1111px #fff,
    1955px 243px #fff,
    1451px 1093px #fff,
    375px 617px #fff,
    1223px 720px #fff,
    1178px 13px #fff,
    1456px 865px #fff,
    1440px 49px #fff,
    186px 1569px #fff,
    320px 1853px #fff,
    300px 539px #fff,
    1559px 509px #fff,
    1985px 1108px #fff,
    1588px 828px #fff,
    525px 1432px #fff,
    831px 363px #fff,
    141px 281px #fff,
    1319px 402px #fff,
    40px 456px #fff,
    1955px 478px #fff,
    1758px 818px #fff,
    1924px 688px #fff,
    1030px 953px #fff,
    1982px 210px #fff,
    917px 1401px #fff,
    1051px 1837px #fff,
    1045px 463px #fff,
    1744px 573px #fff,
    529px 1530px #fff,
    542px 469px #fff,
    1982px 324px #fff,
    1902px 1422px #fff,
    1968px 782px #fff,
    1666px 1561px #fff,
    955px 304px #fff,
    323px 778px #fff,
    272px 443px #fff,
    485px 581px #fff,
    1353px 1058px #fff,
    1257px 131px #fff,
    434px 98px #fff,
    1587px 1953px #fff,
    1749px 68px #fff,
    1984px 839px #fff,
    1518px 183px #fff,
    1071px 855px #fff,
    1662px 1994px #fff,
    1111px 106px #fff,
    1954px 838px #fff;
  animation: animStar 50s linear infinite;
}

#stars2 {
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 2px;
  background: transparent;
  box-shadow:
    1925px 1320px #fff,
    693px 1778px #fff,
    1016px 711px #fff,
    1171px 563px #fff,
    661px 1919px #fff,
    1610px 44px #fff,
    1275px 140px #fff,
    1208px 1802px #fff,
    1473px 1587px #fff,
    11px 1117px #fff,
    853px 1757px #fff,
    1149px 937px #fff,
    1353px 428px #fff,
    270px 279px #fff,
    258px 1404px #fff,
    417px 1188px #fff,
    286px 561px #fff,
    393px 1765px #fff,
    147px 881px #fff,
    666px 1097px #fff,
    1425px 1278px #fff,
    806px 156px #fff,
    1252px 561px #fff,
    218px 52px #fff,
    1371px 1980px #fff,
    171px 745px #fff,
    1424px 89px #fff,
    137px 244px #fff,
    939px 1922px #fff,
    137px 1080px #fff,
    1757px 50px #fff,
    904px 536px #fff,
    1938px 1001px #fff,
    1172px 440px #fff,
    72px 1475px #fff,
    102px 121px #fff,
    804px 1671px #fff,
    1314px 270px #fff,
    440px 1341px #fff,
    1216px 511px #fff,
    1061px 1523px #fff,
    97px 274px #fff,
    704px 1318px #fff,
    52px 1872px #fff,
    1962px 296px #fff,
    111px 289px #fff,
    1157px 1236px #fff,
    1347px 1451px #fff,
    820px 286px #fff,
    1389px 1169px #fff,
    644px 841px #fff,
    1286px 522px #fff,
    955px 659px #fff,
    428px 1805px #fff,
    237px 557px #fff,
    1689px 1058px #fff,
    636px 1882px #fff,
    1349px 1664px #fff,
    1548px 432px #fff,
    1841px 504px #fff,
    302px 252px #fff,
    827px 1765px #fff,
    620px 123px #fff,
    207px 748px #fff,
    1454px 1234px #fff,
    1967px 1790px #fff,
    542px 33px #fff,
    742px 1214px #fff,
    255px 1402px #fff,
    74px 1772px #fff,
    699px 475px #fff,
    980px 1253px #fff,
    534px 1676px #fff,
    909px 202px #fff,
    1498px 1251px #fff,
    1796px 120px #fff,
    1409px 1263px #fff,
    1627px 995px #fff,
    969px 710px #fff,
    1674px 676px #fff,
    1832px 759px #fff,
    1623px 563px #fff,
    251px 1790px #fff,
    96px 1688px #fff,
    886px 239px #fff,
    778px 150px #fff,
    1767px 430px #fff,
    765px 1259px #fff,
    1189px 877px #fff,
    444px 1629px #fff,
    1560px 324px #fff,
    1952px 1097px #fff,
    712px 1173px #fff,
    541px 911px #fff,
    827px 1420px #fff,
    1233px 285px #fff,
    784px 546px #fff,
    645px 285px #fff,
    1273px 1255px #fff,
    1821px 174px #fff,
    221px 1795px #fff,
    1004px 456px #fff,
    1298px 941px #fff,
    274px 387px #fff,
    174px 376px #fff,
    1491px 258px #fff,
    1489px 1946px #fff,
    1134px 1382px #fff,
    1289px 1145px #fff,
    464px 358px #fff,
    1249px 1842px #fff,
    1665px 831px #fff,
    1982px 84px #fff,
    541px 774px #fff,
    1994px 523px #fff,
    762px 1644px #fff,
    1730px 867px #fff,
    1951px 1287px #fff,
    911px 1691px #fff,
    1454px 725px #fff,
    1287px 1940px #fff,
    70px 564px #fff,
    1980px 638px #fff,
    1674px 1774px #fff,
    1720px 116px #fff,
    1747px 182px #fff,
    1040px 450px #fff,
    1795px 375px #fff,
    857px 1471px #fff,
    1326px 1730px #fff,
    915px 274px #fff,
    1224px 358px #fff,
    1808px 60px #fff,
    43px 1870px #fff,
    1810px 1536px #fff,
    1564px 1719px #fff,
    731px 1388px #fff,
    1953px 1967px #fff,
    1744px 1119px #fff,
    794px 1384px #fff,
    959px 714px #fff,
    18px 1932px #fff,
    1358px 1437px #fff,
    355px 939px #fff,
    1355px 1648px #fff,
    608px 719px #fff,
    383px 758px #fff,
    1164px 1681px #fff,
    1045px 253px #fff,
    424px 1279px #fff,
    1899px 359px #fff,
    379px 488px #fff,
    214px 465px #fff,
    179px 905px #fff,
    830px 1993px #fff,
    448px 1077px #fff,
    1880px 1354px #fff,
    1973px 347px #fff,
    745px 1025px #fff,
    788px 1007px #fff,
    1377px 883px #fff,
    6px 290px #fff,
    1312px 407px #fff,
    1398px 622px #fff,
    1405px 339px #fff,
    1198px 1709px #fff,
    988px 1226px #fff,
    87px 1459px #fff,
    1113px 1698px #fff,
    997px 732px #fff,
    708px 331px #fff,
    1876px 1112px #fff,
    1729px 1797px #fff,
    719px 703px #fff,
    1295px 522px #fff,
    758px 1061px #fff,
    1309px 1014px #fff,
    1327px 1365px #fff,
    854px 1317px #fff,
    531px 1001px #fff,
    1751px 1040px #fff,
    1354px 190px #fff,
    800px 1538px #fff,
    88px 1455px #fff,
    668px 39px #fff,
    1379px 41px #fff,
    892px 524px #fff,
    54px 649px #fff,
    1289px 730px #fff,
    727px 488px #fff,
    181px 842px #fff,
    1230px 64px #fff,
    3px 857px #fff,
    292px 1201px #fff,
    1343px 673px #fff,
    1096px 1412px #fff,
    1520px 292px #fff,
    104px 1683px #fff,
    934px 1387px #fff,
    314px 739px #fff;
  animation: animStar 100s linear infinite;
}
#stars2:after {
  content: " ";
  position: absolute;
  top: 2000px;
  width: 2px;
  height: 2px;
  background: transparent;
  box-shadow:
    1925px 1320px #fff,
    693px 1778px #fff,
    1016px 711px #fff,
    1171px 563px #fff,
    661px 1919px #fff,
    1610px 44px #fff,
    1275px 140px #fff,
    1208px 1802px #fff,
    1473px 1587px #fff,
    11px 1117px #fff,
    853px 1757px #fff,
    1149px 937px #fff,
    1353px 428px #fff,
    270px 279px #fff,
    258px 1404px #fff,
    417px 1188px #fff,
    286px 561px #fff,
    393px 1765px #fff,
    147px 881px #fff,
    666px 1097px #fff,
    1425px 1278px #fff,
    806px 156px #fff,
    1252px 561px #fff,
    218px 52px #fff,
    1371px 1980px #fff,
    171px 745px #fff,
    1424px 89px #fff,
    137px 244px #fff,
    939px 1922px #fff,
    137px 1080px #fff,
    1757px 50px #fff,
    904px 536px #fff,
    1938px 1001px #fff,
    1172px 440px #fff,
    72px 1475px #fff,
    102px 121px #fff,
    804px 1671px #fff,
    1314px 270px #fff,
    440px 1341px #fff,
    1216px 511px #fff,
    1061px 1523px #fff,
    97px 274px #fff,
    704px 1318px #fff,
    52px 1872px #fff,
    1962px 296px #fff,
    111px 289px #fff,
    1157px 1236px #fff,
    1347px 1451px #fff,
    820px 286px #fff,
    1389px 1169px #fff,
    644px 841px #fff,
    1286px 522px #fff,
    955px 659px #fff,
    428px 1805px #fff,
    237px 557px #fff,
    1689px 1058px #fff,
    636px 1882px #fff,
    1349px 1664px #fff,
    1548px 432px #fff,
    1841px 504px #fff,
    302px 252px #fff,
    827px 1765px #fff,
    620px 123px #fff,
    207px 748px #fff,
    1454px 1234px #fff,
    1967px 1790px #fff,
    542px 33px #fff,
    742px 1214px #fff,
    255px 1402px #fff,
    74px 1772px #fff,
    699px 475px #fff,
    980px 1253px #fff,
    534px 1676px #fff,
    909px 202px #fff,
    1498px 1251px #fff,
    1796px 120px #fff,
    1409px 1263px #fff,
    1627px 995px #fff,
    969px 710px #fff,
    1674px 676px #fff,
    1832px 759px #fff,
    1623px 563px #fff,
    251px 1790px #fff,
    96px 1688px #fff,
    886px 239px #fff,
    778px 150px #fff,
    1767px 430px #fff,
    765px 1259px #fff,
    1189px 877px #fff,
    444px 1629px #fff,
    1560px 324px #fff,
    1952px 1097px #fff,
    712px 1173px #fff,
    541px 911px #fff,
    827px 1420px #fff,
    1233px 285px #fff,
    784px 546px #fff,
    645px 285px #fff,
    1273px 1255px #fff,
    1821px 174px #fff,
    221px 1795px #fff,
    1004px 456px #fff,
    1298px 941px #fff,
    274px 387px #fff,
    174px 376px #fff,
    1491px 258px #fff,
    1489px 1946px #fff,
    1134px 1382px #fff,
    1289px 1145px #fff,
    464px 358px #fff,
    1249px 1842px #fff,
    1665px 831px #fff,
    1982px 84px #fff,
    541px 774px #fff,
    1994px 523px #fff,
    762px 1644px #fff,
    1730px 867px #fff,
    1951px 1287px #fff,
    911px 1691px #fff,
    1454px 725px #fff,
    1287px 1940px #fff,
    70px 564px #fff,
    1980px 638px #fff,
    1674px 1774px #fff,
    1720px 116px #fff,
    1747px 182px #fff,
    1040px 450px #fff,
    1795px 375px #fff,
    857px 1471px #fff,
    1326px 1730px #fff,
    915px 274px #fff,
    1224px 358px #fff,
    1808px 60px #fff,
    43px 1870px #fff,
    1810px 1536px #fff,
    1564px 1719px #fff,
    731px 1388px #fff,
    1953px 1967px #fff,
    1744px 1119px #fff,
    794px 1384px #fff,
    959px 714px #fff,
    18px 1932px #fff,
    1358px 1437px #fff,
    355px 939px #fff,
    1355px 1648px #fff,
    608px 719px #fff,
    383px 758px #fff,
    1164px 1681px #fff,
    1045px 253px #fff,
    424px 1279px #fff,
    1899px 359px #fff,
    379px 488px #fff,
    214px 465px #fff,
    179px 905px #fff,
    830px 1993px #fff,
    448px 1077px #fff,
    1880px 1354px #fff,
    1973px 347px #fff,
    745px 1025px #fff,
    788px 1007px #fff,
    1377px 883px #fff,
    6px 290px #fff,
    1312px 407px #fff,
    1398px 622px #fff,
    1405px 339px #fff,
    1198px 1709px #fff,
    988px 1226px #fff,
    87px 1459px #fff,
    1113px 1698px #fff,
    997px 732px #fff,
    708px 331px #fff,
    1876px 1112px #fff,
    1729px 1797px #fff,
    719px 703px #fff,
    1295px 522px #fff,
    758px 1061px #fff,
    1309px 1014px #fff,
    1327px 1365px #fff,
    854px 1317px #fff,
    531px 1001px #fff,
    1751px 1040px #fff,
    1354px 190px #fff,
    800px 1538px #fff,
    88px 1455px #fff,
    668px 39px #fff,
    1379px 41px #fff,
    892px 524px #fff,
    54px 649px #fff,
    1289px 730px #fff,
    727px 488px #fff,
    181px 842px #fff,
    1230px 64px #fff,
    3px 857px #fff,
    292px 1201px #fff,
    1343px 673px #fff,
    1096px 1412px #fff,
    1520px 292px #fff,
    104px 1683px #fff,
    934px 1387px #fff,
    314px 739px #fff;
  animation: animStar 100s linear infinite;
}

#stars3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 3px;
  background: transparent;
  box-shadow:
    200px 981px #fff,
    1731px 521px #fff,
    132px 1039px #fff,
    1888px 1547px #fff,
    899px 1226px #fff,
    1887px 580px #fff,
    1548px 1092px #fff,
    1626px 689px #fff,
    254px 1072px #fff,
    1684px 1211px #fff,
    672px 1267px #fff,
    939px 668px #fff,
    1969px 645px #fff,
    1126px 983px #fff,
    457px 568px #fff,
    476px 876px #fff,
    829px 1896px #fff,
    1364px 1846px #fff,
    1507px 1120px #fff,
    936px 1948px #fff,
    1833px 832px #fff,
    1424px 285px #fff,
    1377px 1596px #fff,
    432px 153px #fff,
    1348px 1410px #fff,
    1529px 954px #fff,
    1102px 387px #fff,
    264px 297px #fff,
    811px 977px #fff,
    1931px 673px #fff,
    1734px 978px #fff,
    1772px 1567px #fff,
    1197px 1400px #fff,
    764px 282px #fff,
    1103px 822px #fff,
    872px 1803px #fff,
    1057px 1763px #fff,
    52px 1299px #fff,
    1312px 1236px #fff,
    235px 1082px #fff,
    299px 1086px #fff,
    1017px 1602px #fff,
    1950px 626px #fff,
    1306px 132px #fff,
    1358px 1618px #fff,
    1873px 1718px #fff,
    1447px 940px #fff,
    1888px 1195px #fff,
    1704px 1765px #fff,
    872px 1357px #fff,
    1555px 1120px #fff,
    250px 1415px #fff,
    450px 415px #fff,
    492px 901px #fff,
    170px 1641px #fff,
    56px 1129px #fff,
    627px 1514px #fff,
    1221px 500px #fff,
    324px 1895px #fff,
    1397px 1775px #fff,
    1966px 598px #fff,
    1550px 763px #fff,
    326px 1605px #fff,
    261px 969px #fff,
    890px 281px #fff,
    736px 544px #fff,
    589px 1262px #fff,
    1581px 368px #fff,
    1900px 1132px #fff,
    1914px 585px #fff,
    1864px 1517px #fff,
    241px 217px #fff,
    859px 787px #fff,
    996px 1729px #fff,
    741px 121px #fff,
    418px 414px #fff,
    142px 967px #fff,
    387px 896px #fff,
    703px 562px #fff,
    968px 1136px #fff,
    1682px 332px #fff,
    1287px 846px #fff,
    256px 1427px #fff,
    1885px 432px #fff,
    1739px 1458px #fff,
    345px 1769px #fff,
    1140px 1612px #fff,
    192px 1921px #fff,
    920px 471px #fff,
    834px 881px #fff,
    917px 1803px #fff,
    466px 1266px #fff,
    483px 1108px #fff,
    689px 986px #fff,
    1279px 786px #fff,
    458px 910px #fff,
    1250px 870px #fff,
    785px 1654px #fff,
    1543px 1757px #fff,
    287px 1272px #fff;
  animation: animStar 150s linear infinite;
}
#stars3:after {
  content: " ";
  position: absolute;
  top: 2000px;
  width: 3px;
  height: 3px;
  background: transparent;
  box-shadow:
    200px 981px #fff,
    1731px 521px #fff,
    132px 1039px #fff,
    1888px 1547px #fff,
    899px 1226px #fff,
    1887px 580px #fff,
    1548px 1092px #fff,
    1626px 689px #fff,
    254px 1072px #fff,
    1684px 1211px #fff,
    672px 1267px #fff,
    939px 668px #fff,
    1969px 645px #fff,
    1126px 983px #fff,
    457px 568px #fff,
    476px 876px #fff,
    829px 1896px #fff,
    1364px 1846px #fff,
    1507px 1120px #fff,
    936px 1948px #fff,
    1833px 832px #fff,
    1424px 285px #fff,
    1377px 1596px #fff,
    432px 153px #fff,
    1348px 1410px #fff,
    1529px 954px #fff,
    1102px 387px #fff,
    264px 297px #fff,
    811px 977px #fff,
    1931px 673px #fff,
    1734px 978px #fff,
    1772px 1567px #fff,
    1197px 1400px #fff,
    764px 282px #fff,
    1103px 822px #fff,
    872px 1803px #fff,
    1057px 1763px #fff,
    52px 1299px #fff,
    1312px 1236px #fff,
    235px 1082px #fff,
    299px 1086px #fff,
    1017px 1602px #fff,
    1950px 626px #fff,
    1306px 132px #fff,
    1358px 1618px #fff,
    1873px 1718px #fff,
    1447px 940px #fff,
    1888px 1195px #fff,
    1704px 1765px #fff,
    872px 1357px #fff,
    1555px 1120px #fff,
    250px 1415px #fff,
    450px 415px #fff,
    492px 901px #fff,
    170px 1641px #fff,
    56px 1129px #fff,
    627px 1514px #fff,
    1221px 500px #fff,
    324px 1895px #fff,
    1397px 1775px #fff,
    1966px 598px #fff,
    1550px 763px #fff,
    326px 1605px #fff,
    261px 969px #fff,
    890px 281px #fff,
    736px 544px #fff,
    589px 1262px #fff,
    1581px 368px #fff,
    1900px 1132px #fff,
    1914px 585px #fff,
    1864px 1517px #fff,
    241px 217px #fff,
    859px 787px #fff,
    996px 1729px #fff,
    741px 121px #fff,
    418px 414px #fff,
    142px 967px #fff,
    387px 896px #fff,
    703px 562px #fff,
    968px 1136px #fff,
    1682px 332px #fff,
    1287px 846px #fff,
    256px 1427px #fff,
    1885px 432px #fff,
    1739px 1458px #fff,
    345px 1769px #fff,
    1140px 1612px #fff,
    192px 1921px #fff,
    920px 471px #fff,
    834px 881px #fff,
    917px 1803px #fff,
    466px 1266px #fff,
    483px 1108px #fff,
    689px 986px #fff,
    1279px 786px #fff,
    458px 910px #fff,
    1250px 870px #fff,
    785px 1654px #fff,
    1543px 1757px #fff,
    287px 1272px #fff;
  animation: animStar 150s linear infinite;
}

@keyframes animStar {
  from {
    transform: translateY(0px);
  }
  to {
    transform: translateY(-2000px);
  }
}

/* ─── CARGA DE EVENTOS (Loader de nave, Uiverse.io by anand_4957, adaptado a tema oscuro) ─── */
.events-loading {
  position: relative;
  min-height: 55vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 28px;
  overflow: hidden;
}
.events-loading.done {
  animation: eventsLoaderOut 0.4s ease forwards;
}
@keyframes eventsLoaderOut {
  to { opacity: 0; visibility: hidden; min-height: 0; }
}

.events-loading .loader {
  position: relative;
  top: auto;
  left: auto;
  margin-left: 0;
  animation: speeder 0.4s linear infinite;
}
.events-loading .loader > span {
  height: 5px;
  width: 35px;
  background: #fff;
  position: absolute;
  top: -19px;
  left: 60px;
  border-radius: 2px 10px 1px 0;
}
.events-loading .base span {
  position: absolute;
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-right: 100px solid #fff;
  border-bottom: 6px solid transparent;
}
.events-loading .base span:before {
  content: "";
  height: 22px;
  width: 22px;
  border-radius: 50%;
  background: #fff;
  position: absolute;
  right: -110px;
  top: -16px;
}
.events-loading .base span:after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-top: 0 solid transparent;
  border-right: 55px solid #fff;
  border-bottom: 16px solid transparent;
  top: -16px;
  right: -98px;
}
.events-loading .face {
  position: absolute;
  height: 12px;
  width: 20px;
  background: #fff;
  border-radius: 20px 20px 0 0;
  transform: rotate(-40deg);
  right: -125px;
  top: -15px;
}
.events-loading .face:after {
  content: "";
  height: 12px;
  width: 12px;
  background: #fff;
  right: 4px;
  top: 7px;
  position: absolute;
  transform: rotate(40deg);
  transform-origin: 50% 50%;
  border-radius: 0 0 0 2px;
}
.events-loading .loader > span > span:nth-child(1),
.events-loading .loader > span > span:nth-child(2),
.events-loading .loader > span > span:nth-child(3),
.events-loading .loader > span > span:nth-child(4) {
  width: 30px;
  height: 1px;
  background: #fff;
  position: absolute;
  animation: fazer1 0.2s linear infinite;
}
.events-loading .loader > span > span:nth-child(2) {
  top: 3px;
  animation: fazer2 0.4s linear infinite;
}
.events-loading .loader > span > span:nth-child(3) {
  top: 1px;
  animation: fazer3 0.4s linear infinite;
  animation-delay: -1s;
}
.events-loading .loader > span > span:nth-child(4) {
  top: 4px;
  animation: fazer4 1s linear infinite;
  animation-delay: -1s;
}
@keyframes fazer1 {
  0% { left: 0; }
  100% { left: -80px; opacity: 0; }
}
@keyframes fazer2 {
  0% { left: 0; }
  100% { left: -100px; opacity: 0; }
}
@keyframes fazer3 {
  0% { left: 0; }
  100% { left: -50px; opacity: 0; }
}
@keyframes fazer4 {
  0% { left: 0; }
  100% { left: -150px; opacity: 0; }
}
@keyframes speeder {
  0% { transform: translate(2px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -3px) rotate(-1deg); }
  20% { transform: translate(-2px, 0px) rotate(1deg); }
  30% { transform: translate(1px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 3px) rotate(-1deg); }
  60% { transform: translate(-1px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-2px, -1px) rotate(1deg); }
  90% { transform: translate(2px, 1px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
.events-loading .longfazers {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.events-loading .longfazers span {
  position: absolute;
  height: 2px;
  width: 20%;
  background: rgba(255, 255, 255, 0.7);
}
.events-loading .longfazers span:nth-child(1) {
  top: 20%;
  animation: lf 0.6s linear infinite;
  animation-delay: -5s;
}
.events-loading .longfazers span:nth-child(2) {
  top: 40%;
  animation: lf2 0.8s linear infinite;
  animation-delay: -1s;
}
.events-loading .longfazers span:nth-child(3) {
  top: 60%;
  animation: lf3 0.6s linear infinite;
}
.events-loading .longfazers span:nth-child(4) {
  top: 80%;
  animation: lf4 0.5s linear infinite;
  animation-delay: -3s;
}
@keyframes lf {
  0% { left: 200%; }
  100% { left: -200%; opacity: 0; }
}
@keyframes lf2 {
  0% { left: 200%; }
  100% { left: -200%; opacity: 0; }
}
@keyframes lf3 {
  0% { left: 200%; }
  100% { left: -100%; opacity: 0; }
}
@keyframes lf4 {
  0% { left: 200%; }
  100% { left: -100%; opacity: 0; }
}

.events-loading-label {
  font-family: var(--font-ui);
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--gray-light);
  animation: eventsLabelPulse 1.4s ease-in-out infinite;
}
@keyframes eventsLabelPulse {
  0%, 100% { opacity: 0.45; }
  50% { opacity: 1; }
}

[data-events-section] {
  transition: opacity 0.35s ease;
}
[data-events-section].events-hidden {
  display: none !important;
}
[data-events-section].events-shown {
  animation: eventsFadeUp 0.45s ease both;
}
@keyframes eventsFadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
