[data-parallax] {
  will-change: transform;
  transition: transform .08s linear;
}

.hero-background[data-parallax] {
  transform: translate3d(0, var(--parallax-y, 0px), 0) scale(var(--parallax-scale, 1.1));
}

.hero-video,
.hero-video[data-parallax] {
  filter: grayscale(1) contrast(.86) brightness(.72);
}

.hero-photo,
.hero-photo[data-parallax] {
  filter: contrast(.92) brightness(.9) saturate(.9);
}

.about-portrait[data-parallax] {
  transform: translate3d(-23%, var(--parallax-y, 0px), 0) scale(var(--parallax-scale, 1.02));
}

.artist-video[data-parallax] {
  width: 104%;
  left: -2%;
  position: relative;
  transform: translate3d(0, var(--parallax-y, 0px), 0) scale(var(--parallax-scale, 1.08));
}

.artist-photo[data-parallax] {
  width: 104%;
  left: -2%;
  position: relative;
  transform: translate3d(0, var(--parallax-y, 0px), 0) scale(var(--parallax-scale, 1.08));
}

@media (max-width: 760px) {
  .about-portrait[data-parallax] {
    transform: translate3d(-20%, var(--parallax-y, 0px), 0) scale(var(--parallax-scale, 1.02));
  }
  .artist-video[data-parallax] {
    width: 106%;
    left: -3%;
    transform: translate3d(0, var(--parallax-y, 0px), 0) scale(var(--parallax-scale, 1.08));
  }
  .artist-photo[data-parallax] {
    width: 106%;
    left: -3%;
    transform: translate3d(0, var(--parallax-y, 0px), 0) scale(var(--parallax-scale, 1.08));
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-parallax] { transition: transform .14s linear; }
}
