.hero-art {
  position: absolute;
  inset: 0;
  background-color: #121316;
  background-image: radial-gradient(ellipse 55% 45% at 10% 5%, #ffffff 0%, rgba(255, 255, 255, 0) 100%), radial-gradient(circle at 34% 18%, #52cd86 0%, rgba(82, 205, 134, 0) 48%), radial-gradient(circle at 68% 55%, #3e98ff 0%, rgba(62, 152, 255, 0) 68%), radial-gradient(circle at 92% 94%, #52cd86 0%, rgba(82, 205, 134, 0) 42%);
}
.hero-art::before, .hero-art::after {
  content: "";
  position: absolute;
  inset: 0;
}
.hero-art::before {
  background-image: repeating-linear-gradient(115deg, rgba(255, 255, 255, 0.12) 0px, rgba(255, 255, 255, 0.12) 1px, transparent 1px, transparent 11px);
}
.hero-art::after {
  opacity: 0.35;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}