:root {
  --ppt-fidelity-surface: #050505;
  --ppt-fidelity-duration: 880ms;
  --ppt-fidelity-ease: cubic-bezier(.22, 1, .36, 1);
  --ppt-fidelity-dormant-opacity: .42;
  --ppt-fidelity-dormant-scale: .975;
}

.ppt-fidelity {
  min-height: 100vh;
  min-height: 100svh;
  padding: 0 !important;
  display: grid;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  background: var(--ppt-fidelity-surface);
  color: #fff;
}

.ppt-fidelity__stage {
  position: relative;
  width: min(100vw, 177.7778svh);
  max-width: 100vw;
  aspect-ratio: 16 / 9;
  max-height: 100svh;
  margin: 0;
  opacity: var(--ppt-fidelity-dormant-opacity);
  transform: translate3d(var(--ppt-enter-x, 0), var(--ppt-enter-y, 3.5vh), 0)
    scale(var(--ppt-fidelity-dormant-scale));
  transform-origin: center;
  transition:
    opacity var(--ppt-fidelity-duration) ease-out,
    transform var(--ppt-fidelity-duration) var(--ppt-fidelity-ease);
  will-change: opacity, transform;
}

.ppt-fidelity__stage img {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  object-position: center !important;
  display: block;
  user-select: none;
}

.ppt-fidelity.is-active .ppt-fidelity__stage {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

#p21.ppt-fidelity { --ppt-enter-x: -2.4vw; --ppt-enter-y: 0; }
#p22.ppt-fidelity { --ppt-enter-x: 2.4vw; --ppt-enter-y: 0; }
#p23.ppt-fidelity { --ppt-enter-x: 0; --ppt-enter-y: 3.5vh; }
#p24.ppt-fidelity { --ppt-enter-x: 0; --ppt-enter-y: 2vh; }

.ppt-fidelity__sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 760px) {
  .ppt-fidelity__stage {
    width: 100vw;
    max-height: none;
    aspect-ratio: 16 / 9;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ppt-fidelity__stage,
  .ppt-fidelity.is-active .ppt-fidelity__stage {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
