body[data-page="products"] .products-visual { position: relative; }
.products-art {
  position: relative;
  width: 100%;
  aspect-ratio: 1051 / 768;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 4%, #000 96%, transparent),
    linear-gradient(to bottom, transparent, #000 5%, #000 95%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent, #000 4%, #000 96%, transparent),
    linear-gradient(to bottom, transparent, #000 5%, #000 95%, transparent);
  mask-composite: intersect;
}
body[data-page="products"] .products-art [data-products-poster],
.products-art [data-products-canvas] {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  -webkit-mask-image: none;
  mask-image: none;
  transition: opacity 180ms ease;
}
.products-art [data-products-canvas] { opacity: 0; }
.products-art [data-products-poster] { opacity: 1; }
.products-scene-ready .products-art [data-products-canvas] { opacity: 1; }
.products-scene-ready .products-art [data-products-poster] { opacity: 0; }
.products-scene-fallback .products-art [data-products-canvas] { opacity: 0; }
.products-scene-fallback .products-art [data-products-poster] { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .products-art [data-products-canvas],
  .products-art [data-products-poster] { transition: none; }
}
