/* Capa visual v3 del hero: elimina el marco y potencia el símbolo WebGL. */
#hero .rocket-card.fw-hero-webgl-shell {
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

#hero .rocket-card.fw-hero-webgl-shell::before,
#hero .rocket-card.fw-hero-webgl-shell::after {
  content: none !important;
}

.fw-hero-webgl {
  overflow: visible;
  contain: layout;
  filter: drop-shadow(0 34px 42px rgba(0, 0, 0, .34));
}

.fw-hero-webgl::before {
  position: absolute;
  inset: -9%;
  z-index: 0;
  content: "";
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 48%, rgba(77, 255, 232, .19), transparent 27%),
    radial-gradient(circle at 50% 51%, rgba(39, 145, 213, .12), transparent 46%),
    radial-gradient(circle at 50% 50%, transparent 42%, rgba(41, 231, 205, .08) 43%, transparent 44%);
  filter: blur(3px);
  animation: fw-hero-aura 5.8s ease-in-out infinite;
}

.fw-hero-webgl::after {
  right: 10%;
  bottom: 3%;
  left: 10%;
  z-index: 0;
  height: 25%;
  background: radial-gradient(ellipse at center, rgba(79, 255, 232, .28), rgba(41, 231, 205, .075) 42%, transparent 72%);
  filter: blur(24px);
  opacity: .95;
}

.fw-hero-webgl__canvas {
  z-index: 3;
  filter:
    drop-shadow(0 0 12px rgba(116, 255, 238, .24))
    drop-shadow(0 0 42px rgba(41, 231, 205, .18));
}

.fw-hero-particles {
  position: absolute;
  inset: -10%;
  z-index: 1;
  overflow: visible;
  pointer-events: none;
  transform-style: preserve-3d;
}

.fw-hero-particle {
  --size: 4px;
  --x: 50%;
  --y: 50%;
  --dx: 0px;
  --dy: -40px;
  --delay: 0s;
  position: absolute;
  top: var(--y);
  left: var(--x);
  width: var(--size);
  height: var(--size);
  border-radius: 999px;
  background: radial-gradient(circle, #eafffb 0 16%, #65ffe9 34%, rgba(41, 231, 205, .12) 68%, transparent 72%);
  box-shadow: 0 0 10px rgba(105, 255, 235, .9), 0 0 24px rgba(41, 231, 205, .42);
  opacity: 0;
  animation: fw-particle-out 3.8s var(--delay) cubic-bezier(.22,.64,.24,1) infinite;
}

.fw-hero-particle:nth-child(4n) {
  background: radial-gradient(circle, #fff 0 14%, #8bc8ff 34%, rgba(39,145,213,.14) 68%, transparent 72%);
  box-shadow: 0 0 10px rgba(130, 203, 255, .9), 0 0 24px rgba(39,145,213,.38);
}

.fw-hero-particle:nth-child(7n) {
  --size: 3px;
  background: radial-gradient(circle, #fff 0 16%, #ff9292 34%, rgba(247,102,102,.12) 68%, transparent 72%);
  box-shadow: 0 0 9px rgba(255, 133, 133, .78), 0 0 20px rgba(247,102,102,.28);
}

@keyframes fw-particle-out {
  0% { opacity: 0; transform: translate3d(0,0,0) scale(.25); }
  14% { opacity: .92; }
  72% { opacity: .42; }
  100% { opacity: 0; transform: translate3d(var(--dx),var(--dy),0) scale(1.35); }
}

@keyframes fw-hero-aura {
  0%,100% { opacity: .76; transform: scale(.96) rotate(-2deg); }
  50% { opacity: 1; transform: scale(1.035) rotate(2deg); }
}

@media (max-width: 700px) {
  .fw-hero-webgl::before { inset: -2%; }
  .fw-hero-particles { inset: -2%; }
}

@media (prefers-reduced-motion: reduce) {
  .fw-hero-webgl::before,
  .fw-hero-particle { animation: none !important; }
  .fw-hero-particle { display: none; }
}
