/* Layered photo presentation: scroll moves the product plane through depth,
   while an independent small float keeps visible products from sitting still. */
.product-depth{position:relative;isolation:isolate}
.product-image.product-depth{background-image:radial-gradient(ellipse at 35% 20%,#ffffff70,transparent 68%),linear-gradient(150deg,transparent 60%,#21313b16)}
.product-depth>.product-depth-surface{position:relative;display:block;inset:auto;width:100%;height:100%;margin:0;z-index:1;mix-blend-mode:multiply;transform-origin:50% 55%;transition:transform 210ms cubic-bezier(.23,1,.32,1);pointer-events:none}
.product-depth .product-depth-surface>img{position:relative;display:block;backface-visibility:hidden;transform-origin:50% 55%;animation:product-float 6.8s ease-in-out infinite;animation-delay:var(--depth-delay,0s);animation-play-state:paused;transition:none!important}
.product-depth[data-moving="true"] .product-depth-surface>img{animation-play-state:running}
.product-depth>.product-depth-shadow{position:absolute;display:block;left:20%;right:auto;top:auto;bottom:7%;width:60%;height:7%;margin:0;border-radius:50%;background:#192b38;filter:blur(11px);opacity:0;pointer-events:none;z-index:0;transition:transform 210ms ease-out,opacity 210ms ease-out}
.product-depth>.product-depth-light{position:absolute;display:block;inset:-35% -55%;width:auto;height:auto;margin:0;background:linear-gradient(110deg,transparent 30%,#ffffff00 39%,#ffffff70 48%,#ffffff08 58%,transparent 68%);mix-blend-mode:soft-light;opacity:0;pointer-events:none;z-index:2;transition:transform 240ms ease-out,opacity 200ms ease-out}
.runway-product-image.product-depth{overflow:hidden}
.product-depth>span:not(.product-depth-surface):not(.product-depth-shadow):not(.product-depth-light){z-index:3}
.product:hover .product-depth .product-depth-surface>img,.runway-product-image.product-depth:hover .product-depth-surface>img{transform:none}
.product-motion-tools{display:flex;justify-content:flex-end;margin:0 0 12px;min-height:32px}
.product-motion-toggle{background:none;border:0;border-bottom:1px solid currentColor;padding:8px 0;color:inherit;font:inherit;font-size:11px;min-height:36px;cursor:pointer}
.product-motion-tools[hidden]{display:none}
.product-depth[data-static="true"] .product-depth-surface{transform:none!important;transition:none}
.product-depth[data-static="true"] .product-depth-surface>img{animation:none;transform:none!important}
.product-depth[data-static="true"]>.product-depth-light,.product-depth[data-static="true"]>.product-depth-shadow{opacity:0!important}
@keyframes product-float{0%,100%{transform:translate3d(-2px,4px,0) rotateZ(-.6deg)}50%{transform:translate3d(2px,-4px,0) rotateZ(.6deg)}}
@media(prefers-reduced-motion:reduce){.product-depth .product-depth-surface{transform:none!important;transition:none!important}.product-depth .product-depth-surface>img{animation:none!important;transform:none!important}.product-depth>.product-depth-shadow,.product-depth>.product-depth-light,.product-motion-tools{display:none}}

.runway-look>.product-motion-tools{grid-column:1/-1;margin-bottom:8px}

/* Fixed-view product renders: preserve studio highlights; vertical motion only. */
.product-front-render.product-depth>.product-depth-surface{mix-blend-mode:normal}
.product-front-render.product-depth .product-depth-surface>img{mix-blend-mode:normal;animation-name:product-front-float}
.product-front-render.product-depth>.product-depth-light{display:none}
@keyframes product-front-float{0%,100%{transform:translateY(3px)}50%{transform:translateY(-3px)}}

.product-image img[src*="product-renders/"],.runway-product-image img[src*="product-renders/"]{mix-blend-mode:normal}
