.research-panel {
  --research-opacity: 1;
}
.research-panel .orbit-a {
  --research-angle: -13deg;
  --research-start-angle: -28deg;
  --research-x: -70px;
  --research-delay: 0ms;
}
.research-panel .orbit-b {
  --research-angle: 15deg;
  --research-start-angle: 30deg;
  --research-x: 70px;
  --research-delay: 180ms;
}
.research-panel .orbit-c {
  --research-angle: 9deg;
  --research-start-angle: 24deg;
  --research-x: -55px;
  --research-delay: 360ms;
}
.research-panel .orbit-d {
  --research-angle: -9deg;
  --research-start-angle: -24deg;
  --research-x: 55px;
  --research-delay: 540ms;
}
.research-motion-ready .orbit-image {
  opacity: 0;
  transform: translate3d(var(--research-x), 100px, 0) rotate(var(--research-start-angle)) scale(.82);
  transition: opacity .8s ease, transform 1.2s cubic-bezier(.22, 1, .36, 1);
  transition-delay: 0ms;
}
.research-motion-ready .research-image-shown {
  opacity: var(--research-opacity);
  transform: translate3d(0, 0, 0) rotate(var(--research-angle)) scale(1);
  transition-delay: var(--research-delay);
}
@media (max-width: 800px) {
  .research-panel { --research-opacity: .65; }
}
@media (prefers-reduced-motion: reduce) {
  .research-motion-ready .orbit-image {
    opacity: var(--research-opacity);
    transform: rotate(var(--research-angle));
    transition: none;
  }
}