/* ---------- FONDO ANIMADO ---------- */
.ico-defs{display:none}

#bg-canvas{position:fixed;inset:0;z-index:0;pointer-events:none}
.bg-glow{position:fixed;z-index:0;pointer-events:none;border-radius:50%;filter:blur(90px);opacity:.4}
.bg-glow.g1{top:-10%;left:-8%;width:46vw;height:46vw;background:radial-gradient(circle,rgba(224,31,43,.16),transparent 70%);animation:drift1 22s ease-in-out infinite}
.bg-glow.g2{bottom:-15%;right:-10%;width:52vw;height:52vw;background:radial-gradient(circle,rgba(56,225,208,.12),transparent 70%);animation:drift2 26s ease-in-out infinite}
.bg-grid{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 40%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 40%,transparent 100%)}
@keyframes drift1{0%,100%{transform:translate(0,0)}50%{transform:translate(6vw,4vh)}}
@keyframes drift2{0%,100%{transform:translate(0,0)}50%{transform:translate(-5vw,-3vh)}}

/* Iconos flotantes (patinetes, móviles, baterías...) */
.bg-icons{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.float-ico{position:absolute;color:var(--volt);opacity:.06;will-change:transform}
.float-ico svg{width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
@keyframes floatUp{
  0%{transform:translateY(110vh) rotate(0deg);opacity:0}
  8%{opacity:.09}
  92%{opacity:.09}
  100%{transform:translateY(-25vh) rotate(var(--spin));opacity:0}
}
@media(max-width:640px){.float-ico{opacity:.045!important}}