/* Scroll-linked parallax on the large images. It moves whole pictures, never
   their crop, so no product is cut by it. Browsers without scroll timelines and
   visitors who asked for less motion simply see a still page. */
@media (prefers-reduced-motion: no-preference) {
	@supports (animation-timeline: scroll()) {
		.w-dial, .s-pebble, .f-cover, .j-case, .k-stack, .p-plan, .c-right, .r-cup, .a-screen, .b-stage, .g-pot, .fx-transition .fx-stage, .fx-layout .fx-stage {
			animation: px-down linear both;
			animation-range: 0 100vh;
			animation-timeline: scroll(root);
		}
		.f-mast, .h-big {
			animation: px-up linear both;
			animation-range: 0 100vh;
			animation-timeline: scroll(root);
		}
		.w-bench .row-demo, .s-still .row-demo, .f-rail .row-demo, .j-tray .row-demo, .k-fling .row-demo, .p-rooms .row-demo, .c-behind .row-demo, .r-marble > .gs, .g-dome .row-demo, .b-grid .panes-demo {
			animation: px-rise linear both;
			animation-timeline: view();
		}
		@keyframes px-down { to { translate: 0 14vh; } }
		@keyframes px-up { to { translate: 0 -9vh; } }
		@keyframes px-rise { from { translate: 0 4vh; } to { translate: 0 -4vh; } }
	}
}