.story-motion-ready .company-story-grid > div:first-child,
.story-motion-ready .story-lead,
.story-motion-ready .story-body,
.story-motion-ready .company-stats > div,
.story-motion-ready .company-note {
  opacity: 0;
  will-change: transform, opacity;
}

.story-motion-ready .company-story-grid > div:first-child {
  transform: translateX(-72px);
}

.story-motion-ready .story-lead,
.story-motion-ready .story-body,
.story-motion-ready .company-note {
  transform: translateX(72px);
}

.story-motion-ready .company-stats > div {
  transform: translateY(30px);
}

.story-in-view .company-story-grid > div:first-child {
  animation: story-from-left 1s cubic-bezier(.16, 1, .3, 1) forwards;
}

.story-in-view .story-lead {
  animation: story-from-right 1s .12s cubic-bezier(.16, 1, .3, 1) forwards;
}

.story-in-view .story-body {
  animation: story-from-right 1s .24s cubic-bezier(.16, 1, .3, 1) forwards;
}

.story-in-view .company-stats > div {
  animation: proof-rise .75s cubic-bezier(.16, 1, .3, 1) forwards;
}

.story-in-view .company-stats > div:nth-child(1) { animation-delay: .42s; }
.story-in-view .company-stats > div:nth-child(2) { animation-delay: .53s; }
.story-in-view .company-stats > div:nth-child(3) { animation-delay: .64s; }

.story-in-view .company-note {
  animation: story-from-right .9s .76s cubic-bezier(.16, 1, .3, 1) forwards;
}

@keyframes story-from-left {
  to { opacity: 1; transform: none; }
}

@keyframes story-from-right {
  to { opacity: 1; transform: none; }
}

@keyframes proof-rise {
  to { opacity: 1; transform: none; }
}

@media (max-width: 800px) {
  .story-motion-ready .company-story-grid > div:first-child { transform: translateX(-35px); }
  .story-motion-ready .story-lead,
  .story-motion-ready .story-body,
  .story-motion-ready .company-note { transform: translateX(35px); }
}

@media (prefers-reduced-motion: reduce) {
  .story-motion-ready .company-story-grid > div:first-child,
  .story-motion-ready .story-lead,
  .story-motion-ready .story-body,
  .story-motion-ready .company-stats > div,
  .story-motion-ready .company-note {
    opacity: 1;
    transform: none;
    animation: none !important;
  }
}
