/* Web — soft glassy beams + dots */
.hero { position: relative; overflow: hidden; }
.hero::before,
.hero::after{
  content:""; position:absolute; inset:-10%;
  background:
    radial-gradient(60% 40% at 15% 20%, rgba(255,255,255,.65), transparent 60%),
    radial-gradient(40% 35% at 85% 10%, rgba(146,196,253,.35), transparent 70%),
    radial-gradient(45% 35% at 70% 80%, rgba(64,224,208,.25), transparent 70%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.06) 0 2px, transparent 2px 8px);
  filter: blur(6px);
  pointer-events:none;
}
.hero::after{ animation: webSweep 16s linear infinite; opacity:.55; mix-blend-mode: soft-light; }
@keyframes webSweep { 0% {transform: translateX(-2%) rotate(0deg)} 100% {transform: translateX(2%) rotate(360deg)} }