/* Fade repeated home-portfolio thumbnails into the section ending. */
[data-portfolio-tail-grid="ready"] {
  -webkit-mask-image: linear-gradient(
    to bottom,
    #000 0%,
    #000 76%,
    rgba(0, 0, 0, 0.94) 81%,
    rgba(0, 0, 0, 0.72) 87%,
    rgba(0, 0, 0, 0.36) 93%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to bottom,
    #000 0%,
    #000 76%,
    rgba(0, 0, 0, 0.94) 81%,
    rgba(0, 0, 0, 0.72) 87%,
    rgba(0, 0, 0, 0.36) 93%,
    transparent 100%
  );
}

[data-portfolio-tail-clone="true"] {
  pointer-events: none !important;
  user-select: none !important;
  transform: none !important;
}

[data-portfolio-tail-clone="true"] img {
  transform: none !important;
}

[data-portfolio-tail-section="ready"] {
  padding-bottom: clamp(7rem, 11vw, 12rem) !important;
}

@media (max-width: 767px) {
  [data-portfolio-tail-grid="ready"] {
    -webkit-mask-image: linear-gradient(
      to bottom,
      #000 0%,
      #000 72%,
      rgba(0, 0, 0, 0.9) 80%,
      rgba(0, 0, 0, 0.55) 89%,
      transparent 100%
    );
    mask-image: linear-gradient(
      to bottom,
      #000 0%,
      #000 72%,
      rgba(0, 0, 0, 0.9) 80%,
      rgba(0, 0, 0, 0.55) 89%,
      transparent 100%
    );
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-portfolio-tail-grid="ready"] {
    scroll-behavior: auto;
  }
}