/* Keep the colour wash above the image and below its label. It has no hit
   area, so the complete image remains the original project link. */
#aw-home .nx-spread-art::after,
#b2p .b2p-card-image::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: #30ffce;
  opacity: 0;
  pointer-events: none;
  transition: opacity .5s cubic-bezier(.165, .85, .45, 1);
}
#b2p .b2p-card-image > span {
  z-index: 2;
}
#aw-home .nx-spread-art:focus-visible::after,
#b2p .b2p-work-card:focus-visible .b2p-card-image::after {
  opacity: .28;
}

/* Animate the parallax wrapper, leaving the image's inline scroll transform
   under simpleParallax's control. Also support the direct-image fallback. */
#aw-home .nx-spread-art > .simpleParallax,
#aw-home .nx-spread-art > img {
  transform: scale(1);
  transition: transform .5s cubic-bezier(.165, .85, .45, 1);
}
#aw-home .nx-spread-art:focus-visible > .simpleParallax,
#aw-home .nx-spread-art:focus-visible > img {
  transform: scale(1.035);
}
@media (hover: hover) and (pointer: fine) {
  #aw-home .nx-spread-art:hover::after,
  #b2p .b2p-work-card:hover .b2p-card-image::after {
    opacity: .28;
  }
  #aw-home .nx-spread-art:hover > .simpleParallax,
  #aw-home .nx-spread-art:hover > img {
    transform: scale(1.035);
  }
}
@media (prefers-reduced-motion: reduce) {
  #aw-home .nx-spread-art::after,
  #b2p .b2p-card-image::after {
    transition: none;
  }
  #aw-home .nx-spread-art > .simpleParallax,
  #aw-home .nx-spread-art > img {
    transform: none !important;
    transition: none;
  }
}