/* ══════════════════════════════════════════
   tokens.css — Variables de diseño BRAV[O]
   Editar aquí para cambiar colores y fuentes
══════════════════════════════════════════ */

:root{
  /* Fondos */
  --bg:#F8F9FB;    /* Fondo principal — claro */
  --white:#fff;
  /* Texto */
  --text:#111827;
  --muted:#6B7280;
  --subtle:#9CA3AF;
  /* Bordes */
  --border:#E5E7EB;
  --border2:#D1D5DB;
  /* Acento — DEFAULT lila neon */
  --accent:#E600FA;
  --accent-l:#F2E0FF;
  --accent-m:#9B5ECC;
  --accent-hi:#C77DF0;
  --accent-l2:#E6D5FF;
  --accent-hl:#F5D9FF;
  --deep:#230066;
  --ac-rgb:230,0,250;
  --ac2-rgb:155,94,204;
  --dim:rgba(17,24,39,.25);
  --green:#059669;
  /* Oscuros (nav, footer, secciones dark) */
  --dark:#0A090C;
  --dark2:#121013;
  --dark3:#1C181F;
  /* App (carousel) */
  --app-accent:var(--accent-m);
  --app-text:#F1F0F5;
  --app-muted:#8B8A9B;
  /* Tipografía */
  --body:'Manrope',system-ui,sans-serif;
  --display:'Archivo Black',system-ui,sans-serif;
  --mono:'JetBrains Mono',monospace;
  /* Motion */
  --ease:cubic-bezier(.16,1,.3,1);
  --glow:1.2;
  /* Layout */
  --nav-h:clamp(64px,11vh,96px);
  --hero-h:calc(100vh - var(--nav-h));
  --r:12px;
  --r-lg:16px;
  --r-xl:20px;
  /* Sombras */
  --sh:0 1px 3px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.07);
  --sh-lg:0 4px 24px rgba(0,0,0,.09),0 20px 48px rgba(0,0,0,.11);
}

/* ── MODO MAGENTA (toggle) — fondo igual de claro ── */
html.magenta,
body.magenta{
  --accent:#FF0A6C;
  --accent-l:#FFE3EE;
  --accent-m:#FF4D94;
  --accent-hi:#FF7DB0;
  --accent-l2:#FFD6E7;
  --accent-hl:#ffd0e4;
  --deep:#5C0029;
  --ac-rgb:255,10,108;
  --ac2-rgb:255,77,148;
}
html.magenta .nav-logo .hat,
body.magenta .nav-logo .hat{
  animation:hatPulseMag 3s ease-in-out infinite;
}
@keyframes hatPulseMag{
  0%,100%{filter:hue-rotate(41deg) saturate(1.1) drop-shadow(0 0 14px rgba(255,10,108,.65)) drop-shadow(0 0 28px rgba(255,77,148,.4));transform:translateY(0) scale(1);}
  50%{filter:hue-rotate(41deg) saturate(1.2) drop-shadow(0 0 26px rgba(255,10,108,.95)) drop-shadow(0 0 52px rgba(255,77,148,.65));transform:translateY(-3px) scale(1.04);}
}
html.magenta .ft-lockup .hat,
body.magenta .ft-lockup .hat{
  filter:hue-rotate(41deg) saturate(1.1)
    drop-shadow(0 0 calc(28px*var(--glow)) rgba(255,10,108,.75))
    drop-shadow(0 0 calc(56px*var(--glow)) rgba(255,77,148,.5));
}