.material-paper,
.material-paint,
.material-ink,
.material-wash,
.photo-halftone {
  position: relative;
  isolation: isolate;
}

.material-paper::after,
.material-paint::after,
.material-ink::after,
.material-wash::after,
.photo-halftone::after {
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: inherit;
  pointer-events: none;
  content: "";
}

.material-paper::after {
  background-image: var(--material-texture, url("/vi/services/website-development/styles/item/fashion-direction-paper-lookbook/preview/assets/paper-grain.webp"));
  background-size: var(--material-size, 250px);
  mix-blend-mode: multiply;
  opacity: var(--material-opacity, 0.04);
}

.material-paint::after {
  background-image:
    linear-gradient(102deg, transparent 4%, rgb(255 255 255 / 0.18) 22%, transparent 41%, rgb(255 255 255 / 0.09) 68%, transparent 88%),
    var(--material-texture, url("/vi/services/website-development/styles/item/fashion-direction-paper-lookbook/preview/assets/paint-dropout.webp"));
  background-size: 170% 100%, var(--material-size, 220px);
  mix-blend-mode: var(--material-blend, screen);
  opacity: var(--material-opacity, 0.19);
}

.material-ink::after {
  background-image: var(--material-texture, url("/vi/services/website-development/styles/item/fashion-direction-paper-lookbook/preview/assets/paint-dropout.webp"));
  background-size: var(--material-size, 190px);
  mix-blend-mode: screen;
  opacity: var(--material-opacity, 0.12);
}

.material-wash::after {
  background:
    radial-gradient(circle at 28% 35%, rgb(255 255 255 / 0.3), transparent 35%),
    radial-gradient(circle at 78% 60%, rgb(0 0 0 / 0.13), transparent 43%),
    url("/vi/services/website-development/styles/item/fashion-direction-paper-lookbook/preview/assets/paper-grain.webp");
  background-size: auto, auto, var(--material-size, 300px);
  mix-blend-mode: multiply;
  opacity: var(--material-opacity, 0.19);
}

.photo-halftone::after {
  z-index: 3;
  background-image:
    radial-gradient(circle, rgb(255 255 255 / 0.22) 0 0.7px, transparent 0.9px),
    url("/vi/services/website-development/styles/item/fashion-direction-paper-lookbook/preview/assets/photo-grain.webp");
  background-size: 4px 4px, var(--material-size, 192px);
  mix-blend-mode: screen;
  opacity: var(--material-opacity, 0.2);
}

.xerox-rule {
  height: 2px;
  background: currentColor;
  box-shadow: 0 2px 0 rgb(0 0 0 / 0.08);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}