#about {
  --about-parallax-offset: 0px;
}

#about::before {
  inset: -6%;
  transform: translate3d(0, var(--about-parallax-offset), 0) scale(1.08);
  transform-origin: center;
  will-change: transform;
}

#about::after {
  inset: -14%;
  background:
    radial-gradient(circle at 18% 25%, rgba(0, 0, 0, 0.58) 0%, rgba(0, 0, 0, 0.1) 32%, rgba(0, 0, 0, 0) 52%),
    radial-gradient(circle at 82% 72%, rgba(0, 0, 0, 0.52) 0%, rgba(0, 0, 0, 0.08) 30%, rgba(0, 0, 0, 0) 50%),
    radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0) 46%),
    radial-gradient(circle at 50% 50%, rgba(3, 7, 12, 0) 40%, rgba(3, 7, 12, 0.42) 76%, rgba(3, 7, 12, 0.68) 100%),
    linear-gradient(180deg, rgba(8, 12, 18, 0.2), rgba(8, 12, 18, 0.44));
}

@media (prefers-reduced-motion: reduce) {
  #about::before {
    transform: none;
  }
}
