/* Native scroll: content never depends on animation to become visible. */
:root{--motion-curve:cubic-bezier(.22,.8,.2,1)}
.solid,.outline,.category{transition:background-color .3s,color .3s,transform .3s}.solid:active,.outline:active{transform:scale(.98)}.product-image img{transition:transform .8s var(--motion-curve)}
@supports(animation-timeline:view()){
  .has-scroll-motion .home-carousel{view-timeline-name:--studio-entrance;view-timeline-axis:block}
  .has-scroll-motion .home-slides{animation:studio-exit 1s linear both;animation-timeline:--studio-entrance;animation-range:exit 0% exit 100%;transform-origin:center top}
  .has-scroll-motion .studio-project{view-timeline-name:--project-entry;view-timeline-axis:block}
  .has-scroll-motion .studio-project-image{animation:project-open 1s linear both;animation-timeline:--project-entry;animation-range:entry 0% entry 100%}
}
@keyframes studio-exit{from{transform:translateY(0) scale(1);opacity:1}to{transform:translateY(65px) scale(.96);opacity:.75}}
@keyframes project-open{from{clip-path:inset(6% 6% 0);transform:translateY(35px)}to{clip-path:inset(0);transform:translateY(0)}}
.motion-paused .home-slide-image{transition:none;transform:none}.motion-paused .home-slides,.motion-paused .studio-project-image,.motion-paused .home-process figure,.motion-paused .home-process-figure{animation:none!important;transform:none!important;clip-path:none!important}
@media(prefers-reduced-motion:reduce){.home-slides,.studio-project-image{animation:none!important;transform:none!important;clip-path:none!important}}
