/*
 * Academy pages — motion shared by every Academy template (see js/academy-motion.js).
 */

/* Hero photos fade up on load (same as the Home hero photo); photos after the first one follow a little later */
@keyframes ac-hero-fade-up {
    from { opacity: 0; translate: 0 10%; }
    to   { opacity: 1; translate: 0 0; }
}

.ac-hero__figure--main,
.ab-hero__figure,
.adv-hero__figure,
.afac-hero__figure,
.fs-intro__figure,
.fac-banner__figure { animation: ac-hero-fade-up 2.6s cubic-bezier(.22, 1, .36, 1) both; }

.ac-hero__figure--small,
.ab-hero__figure--2,
.adv-hero__figure--2,
.afac-hero__figure--1 { animation-delay: .3s; }
.ab-hero__figure--3,
.afac-hero__figure--2 { animation-delay: .6s; }

/* Photo groups fade in slowly on scroll, each at its own point, without moving (js/academy-motion.js adds .ac-fade, then .is-in) */
.ac-fade { opacity: 0; transition: opacity 2.2s ease; }
.ac-fade.is-in { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
    .ac-hero__figure--main, .ac-hero__figure--small,
    .ab-hero__figure, .adv-hero__figure, .afac-hero__figure,
    .fs-intro__figure, .fac-banner__figure { animation: none; }
}