/* Chapter arrivals complement the existing scene animations. */
@media (prefers-reduced-motion: no-preference) {
  .is-section-arriving .connection-scene {
    animation: connection-arrive 1.3s cubic-bezier(.22,.61,.36,1) both;
  }
  .is-section-arriving .creative-lab {
    animation: lab-arrive 1.3s cubic-bezier(.22,.61,.36,1) both;
  }
  .is-section-arriving .earning-scene {
    animation: route-arrive 1.3s cubic-bezier(.22,.61,.36,1) both;
  }
  .is-section-arriving .city-scene {
    animation: city-arrive 1.3s cubic-bezier(.22,.61,.36,1) both;
  }
  .is-section-arriving .contact-grid,
  .is-section-arriving .footer-wordmark {
    animation: contact-arrive 1.3s cubic-bezier(.22,.61,.36,1) both;
  }
}
@keyframes connection-arrive {
  from { translate: 0 calc(var(--section-direction, 1) * 28px); scale: .97; }
  to { translate: 0 0; scale: 1; }
}
@keyframes lab-arrive {
  from { translate: 0 calc(var(--section-direction, 1) * 32px); rotate: calc(var(--section-direction, 1) * .8deg); }
  to { translate: 0 0; rotate: 0deg; }
}
@keyframes route-arrive {
  from { translate: calc(var(--section-direction, 1) * -28px) 0; }
  to { translate: 0 0; }
}
@keyframes city-arrive {
  from { translate: 0 calc(var(--section-direction, 1) * 28px); rotate: calc(var(--section-direction, 1) * -1.5deg); }
  to { translate: 0 0; rotate: 0deg; }
}
@keyframes contact-arrive {
  from { translate: 0 calc(var(--section-direction, 1) * 24px); }
  to { translate: 0 0; }
}
@media print {
  .is-section-arriving * { animation: none !important; }
}