Grid Fade

<div class="nuda-grid-fade" aria-hidden="true"></div>

/* Grid Fade
   Fading grid lines pattern with light sweep.
   Customize: --grid-line, --grid-gap, --grid-glow */

.nuda-grid-fade {
  --grid-line: rgba(255, 255, 255, 0.04);
  --grid-gap: 40px;
  --grid-glow: rgba(99, 102, 241, 0.13);
  position: relative;
  background-color: #0a0a0a;
  background-image:
    linear-gradient(var(--grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
  background-size: var(--grid-gap) var(--grid-gap);
  overflow: hidden;
  width: 100%;
  min-height: 300px;
}

.nuda-grid-fade::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 60% 50% at 50% 50%, transparent 0%, #0a0a0a 100%);
}

.nuda-grid-fade::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent, var(--grid-glow), transparent);
  background-size: 100% 200%;
  animation: nuda-grid-sweep 4s ease-in-out infinite;
}

@keyframes nuda-grid-sweep {
  0%, 100% { background-position: 50% 0%; }
  50% { background-position: 50% 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .nuda-grid-fade::before { animation: none; }
}