/* Motion study for the local preview. Original media and layout stay intact. */
html.studio-theme-fading::view-transition-old(root),
html.studio-theme-fading::view-transition-new(root) { animation-duration: .5s; animation-timing-function: ease-in-out; }
html.studio-theme-fallback body, html.studio-theme-fallback .nav,
html.studio-theme-fallback .page, html.studio-theme-fallback .card,
html.studio-theme-fallback .tab, html.studio-theme-fallback .about-text-card {
  transition: background-color .45s ease, color .45s ease, border-color .45s ease;
}
@media (prefers-reduced-motion: no-preference) {
  .page.active.studio-page-motion { animation: none !important; }
  .studio-heading {
    clip-path: inset(-12% -4% 105% -4%);
    translate: 0 18px;
    transition: clip-path .78s cubic-bezier(.16,1,.3,1), translate .78s cubic-bezier(.16,1,.3,1);
  }
  .studio-heading.studio-heading-visible {
    clip-path: inset(-12% -4% -12% -4%);
    translate: 0 0;
  }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .about-photo-card img {
    translate: var(--photo-x, 0px) var(--photo-y, 0px);
    transition: translate .45s cubic-bezier(.22,1,.36,1);
  }
  .about-photo-card::before {
    translate: calc(var(--photo-x, 0px) * -1.6) calc(var(--photo-y, 0px) * -1.6);
    transition: translate .65s cubic-bezier(.22,1,.36,1);
  }
  .class-media-card .class-media-play {
    translate: var(--play-x, 0px) var(--play-y, 0px);
    transition: translate .25s cubic-bezier(.22,1,.36,1), transform .35s cubic-bezier(.22,1,.36,1), filter .3s, opacity .3s, box-shadow .3s;
  }
  .class-media-card .class-media-play:focus-visible { translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  .studio-heading { clip-path: none !important; translate: none !important; transition: none !important; }
  .about-photo-card img, .about-photo-card::before, .class-media-card .class-media-play {
    translate: none !important;
  }
}
