/* arisexr.lol (aprobado por Arise 2026-10-17): fuera el fondo rojo, fondo de espacio con nebulosas + hiperespacio */
body { background: #02030a !important; }
/* capas rojas de la web original: degradado rojo fijo, brasas, runas */
body .fixed.inset-0.z-0.pointer-events-none, body .fixed.inset-0.pointer-events-none.overflow-hidden { display: none !important; }

.espacio { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; background: #02030a; }
/* el color (saturación/brillo) ya va dentro de los JPG: un filter aquí repintaba toda la pantalla en cada cuadro del zoom */
.espacio .neb { position: absolute; inset: -4%; background-size: cover; background-position: center; opacity: 0; transition: opacity .45s ease;
                will-change: transform, opacity; }
.espacio .neb:first-child { background-image: url(img/espacio/neb0.jpg); }
.espacio .neb.entra { animation: neb-zoom 14s ease-out forwards; }
@keyframes neb-zoom { from { transform: scale(1.18); } to { transform: scale(1); } }
.espacio::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% 40%, transparent 30%, rgba(2, 3, 10, .55) 85%); }
.espacio .estrellas { position: absolute; inset: 0; width: 100%; height: 100%; }

/* tarjetas que tenían tinte rojo -> cristal oscuro azulado para que se vea el espacio detrás */
figure[class*="bg-red-950"] { background: rgba(8, 12, 34, .45) !important; border-color: rgba(140, 160, 255, .18) !important; }
/* sin desenfoque de fondo: con el espacio animado detrás, cada tarjeta con blur se recalculaba en cada cuadro (la web se sentía pesada).
   Se compensa con fondos un poco más opacos */
body * { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
[class*="bg-red-950/30"]:not(figure) { background-color: rgba(8, 12, 34, .72) !important; }
.test, .tema { background-color: rgba(6, 8, 24, .72) !important; }
section[class*="bg-[#080102]"], div[class*="bg-[#080102]"] { background-color: rgba(2, 3, 10, .55) !important; }
[class*="from-[#080102]"] { --tw-gradient-from: #02030a !important; }
.cursor-luz { background: radial-gradient(circle, rgba(167, 139, 250, .10), transparent 60%); }

/* intro: espacio en vez de rojo, más larga para que se vea el salto */
.intro { background: #02030a; animation-delay: 2.55s; }
.intro > *:not(.hiper-intro):not(.hiper-flash) { position: relative; z-index: 2; }
.hiper-intro { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; }
.intro-txt span { animation-delay: calc(.9s + var(--i) * .08s); text-shadow: 0 0 24px rgba(167, 139, 250, .9), 0 0 60px rgba(99, 102, 241, .7); }
.intro-tajo { animation-delay: 1.3s; background: linear-gradient(90deg, transparent, #a78bfa, #fff, #a78bfa, transparent); box-shadow: 0 0 20px #a78bfa; }
.intro-sub { animation-delay: 1.5s; color: rgba(220, 215, 255, .75); }
.hiper-flash { position: absolute; inset: 0; z-index: 1; pointer-events: none; opacity: 0;
               background: radial-gradient(circle at 50% 50%, #fff 0%, rgba(190, 170, 255, .85) 25%, rgba(99, 102, 241, .35) 55%, transparent 80%);
               animation: hiper-flash .6s ease-out .82s forwards; }
@keyframes hiper-flash { 0% { opacity: 0; } 18% { opacity: 1; } 100% { opacity: 0; } }