@keyframes hero-fade-up {
    from {
        opacity: 0;
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes hero-fade-in {
    from {
        opacity: 0;
        transform: translateX(20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes video-spin {
    to {
        transform: rotate(360deg);
    }
}

/* hero */

#hero .hero__content > * {
    animation: hero-fade-up 0.7s ease both;
}

#hero .hero__content > *:nth-child(1) { animation-delay: 0.08s; }
#hero .hero__content > *:nth-child(2) { animation-delay: 0.16s; }
#hero .hero__content > *:nth-child(3) { animation-delay: 0.24s; }
#hero .hero__content > *:nth-child(4) { animation-delay: 0.32s; }
#hero .hero__content > *:nth-child(5) { animation-delay: 0.4s; }
#hero .hero__content > *:nth-child(6) { animation-delay: 0.48s; }

#hero .hero__figure {
    animation: hero-fade-in 0.9s ease 0.2s both;
}

/* header */

header {
    opacity: 0;
    transform: translateY(-12px);
}

header.is-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

/* buttons */

.button {
    transition: transform 0.35s ease, box-shadow 0.35s ease, background-color 0.5s ease, border-color 0.5s ease, color 0.5s ease;
}

.button:hover {
    transform: translateY(-2px);
}

.button:active {
    transform: translateY(0) scale(0.98);
}

/* video play */

.situacoes__play-icon {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.situacoes__play:hover .situacoes__play-icon {
    transform: scale(1.08);
    box-shadow: 0 8px 20px rgba(248, 241, 232, 0.28);
}

.situacoes__player.is-loading .situacoes__play-icon {
    background: transparent;
    box-shadow: none;
}

.situacoes__player.is-loading .situacoes__play-icon::after {
    top: 0;
    left: 0;
    transform: none;
    width: 100%;
    height: 100%;
    border: 3px solid rgba(248, 241, 232, 0.28);
    border-top-color: var(--color-auxiliar-white);
    border-radius: 50%;
    box-sizing: border-box;
    animation: video-spin 0.7s linear infinite;
}

/* scroll reveal */

.situacoes__header,
.situacoes__card,
.situacoes__list li,
.depois__header,
.depois__card,
.caminho__content > *:not(ol),
.caminho__pilares li,
.ambiente__content,
.ambiente__facts li,
.ambiente__media,
.oferta__wrap > *,
.conteudos__wrap > *,
.footer__top,
.footer__bottom {
    opacity: 0;
    transform: translateY(20px);
}

.situacoes__header.is-visible,
.situacoes__card.is-visible,
.situacoes__list li.is-visible,
.depois__header.is-visible,
.depois__card.is-visible,
.caminho__content > *.is-visible,
.caminho__pilares li.is-visible,
.ambiente__content.is-visible,
.ambiente__facts li.is-visible,
.ambiente__media.is-visible,
.oferta__wrap > *.is-visible,
.conteudos__wrap > *.is-visible,
.footer__top.is-visible,
.footer__bottom.is-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

.situacoes__list li.is-visible:nth-child(1) { transition-delay: 0.08s; }
.situacoes__list li.is-visible:nth-child(2) { transition-delay: 0.16s; }
.situacoes__list li.is-visible:nth-child(3) { transition-delay: 0.24s; }
.situacoes__list li.is-visible:nth-child(4) { transition-delay: 0.32s; }

.depois__card.is-visible:nth-child(1) { transition-delay: 0.08s; }
.depois__card.is-visible:nth-child(2) { transition-delay: 0.16s; }
.depois__card.is-visible:nth-child(3) { transition-delay: 0.24s; }
.depois__card.is-visible:nth-child(4) { transition-delay: 0.32s; }

.depois__card img {
    transition: transform 0.6s ease;
}

.depois__card:hover img {
    transform: scale(1.04);
}

.caminho__pilares li.is-visible:nth-child(1) { transition-delay: 0.04s; }
.caminho__pilares li.is-visible:nth-child(2) { transition-delay: 0.08s; }
.caminho__pilares li.is-visible:nth-child(3) { transition-delay: 0.12s; }
.caminho__pilares li.is-visible:nth-child(4) { transition-delay: 0.16s; }
.caminho__pilares li.is-visible:nth-child(5) { transition-delay: 0.2s; }
.caminho__pilares li.is-visible:nth-child(6) { transition-delay: 0.24s; }
.caminho__pilares li.is-visible:nth-child(7) { transition-delay: 0.28s; }

.ambiente__facts li.is-visible:nth-child(1) { transition-delay: 0.08s; }
.ambiente__facts li.is-visible:nth-child(2) { transition-delay: 0.16s; }
.ambiente__facts li.is-visible:nth-child(3) { transition-delay: 0.24s; }

@media (prefers-reduced-motion: reduce) {
    header,
    header.is-visible,
    #hero .hero__content > *,
    #hero .hero__figure,
    .situacoes__header,
    .situacoes__card,
    .situacoes__list li,
    .depois__header,
    .depois__card,
    .caminho__content > *:not(ol),
    .caminho__pilares li,
    .ambiente__content,
    .ambiente__facts li,
    .ambiente__media,
    .oferta__wrap > *,
    .conteudos__wrap > *,
    .footer__top,
    .footer__bottom {
        opacity: 1;
        transform: none;
        animation: none;
        transition: none;
    }

    .button,
    .button:hover,
    .button:active,
    .situacoes__play-icon,
    .situacoes__play:hover .situacoes__play-icon,
    .depois__card img,
    .depois__card:hover img {
        transition: none;
        transform: none;
        box-shadow: none;
    }

    .situacoes__player.is-loading .situacoes__play-icon::after {
        animation: none;
    }
}
