/* ============================================================
   NOCTURNA · tokens de la web
   Los mismos colores que la app (constants/Theme.ts, sistema «Sólido»)
   y que la landing anterior: fondo de noche casi negro, superficies
   planas que suben de tono, morado de marca y los colores de cada
   categoría (discotecas, bares, eventos, sitios). El morado de las
   redes (#7b3aec) se usa para los bloques grandes de marca.
   ============================================================ */

@font-face {
  font-family: "Outfit";
  src: url("../fonts/outfit.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: dark;

  /* Superficies (de más hundida a más elevada), como en la app */
  --fondo: #050507;
  --s1: #0e0e13;
  --s2: #16161d;
  --s3: #1f1f28;
  --s4: #2a2a35;
  --linea: #1c1c24;
  --linea-2: #2a2a35;

  /* Texto */
  --texto: #f6f6f8;
  --texto-2: #b4b4bf;
  --texto-3: #83838f;
  --texto-4: #55555f;

  /* Marca */
  --morado: #9d60ff;          /* botones y acentos (app) */
  --morado-press: #8a4ff0;
  --morado-osc: #5a2fc0;      /* sombra sólida de los botones morados */
  --morado-texto: #c4a3ff;    /* texto morado sobre fondo oscuro */
  --morado-tinte: #1d1430;
  --morado-tinte-2: #2a1d45;
  --morado-redes: #7b3aec;    /* fondos de marca, como en Instagram */
  --morado-redes-osc: #4a1fa0;

  /* Categorías */
  --disco: #6366f1;
  --disco-tinte: #16173a;
  --bar: #eab308;
  --bar-tinta: #1a1400;
  --bar-tinte: #2a2208;
  --evento: #ec4899;
  --evento-tinte: #341427;
  --sitio: #06b6d4;
  --sitio-tinta: #04262c;
  --sitio-tinte: #0a2a31;

  /* Estados */
  --ok: #22c55e;
  --ok-texto: #4ade80;
  --ok-tinte: #0f2a1a;
  --peligro: #ef4444;
  --peligro-texto: #f87171;
  --peligro-tinte: #2d1212;
  --oro: #eab308;

  /* Neón de la landing anterior (solo para brillos de fondo, muy suaves) */
  --neon-morado: 157, 96, 255;
  --neon-cian: 0, 242, 254;

  /* Tipografía */
  --f-titular: "Outfit", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-texto: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Formas */
  --radio-seccion: clamp(28px, 6vw, 56px);
  --radio-tarjeta: clamp(20px, 3.4vw, 28px);

  /* Medidas */
  --ancho: 1180px;
  --margen: clamp(16px, 4.5vw, 40px);
}