/* OCEANSING / Aurora: GPU WebGL2 en escritorio y movimiento CSS ligero en móvil.
   Paleta de identidad: #5227ff, #e650c1 y #84cc16. */
.hero-warp, .tools-hero {background:#000;}
.aurora-background {
  position:absolute;
  inset:0;
  z-index:0;
  isolation:isolate;
  overflow:hidden;
  pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 37%,rgba(0,0,0,.78) 63%,transparent 97%);
  mask-image:linear-gradient(180deg,#000 0%,#000 37%,rgba(0,0,0,.78) 63%,transparent 97%);
}
.aurora-background__fallback {
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse 51% 65% at 18% 4%,rgba(82,39,255,.98),transparent 90%),
    radial-gradient(ellipse 46% 63% at 52% 5%,rgba(230,80,193,.82),transparent 88%),
    radial-gradient(ellipse 50% 67% at 87% 1%,rgba(132,204,22,.81),transparent 88%);
  opacity:.95;
}
.aurora-background__canvas {position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0;}
.aurora-background--active .aurora-background__canvas {opacity:1;}
.aurora-background--active .aurora-background__fallback {opacity:0;}
.hero-warp .hero-content {position:relative;z-index:1;}
@media(max-width:850px), (pointer:coarse) {
  .aurora-background {
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 43%,rgba(0,0,0,.7) 75%,transparent 100%);
    mask-image:linear-gradient(180deg,#000 0%,#000 43%,rgba(0,0,0,.7) 75%,transparent 100%);
  }
  .aurora-background__canvas {display:none!important;}
  .aurora-background__fallback {
    inset:-12% -14% 8%;
    background:
      radial-gradient(ellipse 58% 62% at 12% 5%,rgba(82,39,255,.97),transparent 94%),
      radial-gradient(ellipse 54% 59% at 52% 9%,rgba(230,80,193,.76),transparent 93%),
      radial-gradient(ellipse 59% 65% at 91% 4%,rgba(132,204,22,.83),transparent 94%);
    opacity:1!important;
    animation:aurora-mobile-drift 7.5s ease-in-out infinite alternate;
  }
  .aurora-background--active .aurora-background__fallback {opacity:1;}
}
@keyframes aurora-mobile-drift {
  0% { transform:translate3d(-4%,0,0) scale(1); }
  50% { transform:translate3d(2%,5%,0) scale(1.08); }
  100% { transform:translate3d(4%,-3%,0) scale(1.035); }
}
@media(prefers-reduced-motion:reduce) {
  .aurora-background__canvas {display:none!important;}
  .aurora-background__fallback {animation:none!important;opacity:.9!important;}
}


/* Aurora móvil: cortinas con movimiento perceptible. Solo animan transform y opacidad. */
@media (max-width:850px), (pointer:coarse) {
  .aurora-background__fallback::before,
  .aurora-background__fallback::after {
    content: "";
    position:absolute;
    inset:-12% -8% 8%;
    pointer-events:none;
    will-change:transform,opacity;
  }
  .aurora-background__fallback::before {
    background:radial-gradient(ellipse 47% 75% at 34% 17%,rgba(230,80,193,.82),transparent 93%),radial-gradient(ellipse 42% 63% at 72% 12%,rgba(82,39,255,.88),transparent 95%);
    opacity:.85;
    animation:aurora-curtain-one 6s ease-in-out infinite alternate;
  }
  .aurora-background__fallback::after {
    background:radial-gradient(ellipse 42% 74% at 68% 5%,rgba(132,204,22,.68),transparent 93%),radial-gradient(ellipse 37% 60% at 19% 7%,rgba(82,39,255,.65),transparent 96%);
    opacity:.64;
    animation:aurora-curtain-two 8s ease-in-out infinite alternate-reverse;
  }
}
@keyframes aurora-curtain-one {
  from {transform:translate3d(-17%,5%,0) scale(1.04);opacity:.65}
  50% {transform:translate3d(8%,-9%,0) scale(1.16);opacity:.96}
  to {transform:translate3d(17%,4%,0) scale(1.06);opacity:.74}
}
@keyframes aurora-curtain-two {
  from {transform:translate3d(20%,-4%,0) scale(1.1);opacity:.57}
  to {transform:translate3d(-20%,9%,0) scale(1.02);opacity:1}
}
@media (prefers-reduced-motion:reduce) {
  .aurora-background__fallback::before,
  .aurora-background__fallback::after {animation:none!important;will-change:auto!important}
}