@keyframes sunriseGlow{

    0%{

        opacity:.45;

        transform:scale(1);

    }

    50%{

        opacity:.60;

        transform:scale(1.03);

    }

    100%{

        opacity:.45;

        transform:scale(1);

    }

}

.hero::before{

    animation:sunriseGlow 18s ease-in-out infinite;

}

/* ===========================
   LOGO FLOTANTE
=========================== */

@keyframes floatLogo{

    0%{
        transform:translateY(0px);
    }

    50%{
        transform:translateY(-8px);
    }

    100%{
        transform:translateY(0px);
    }

}


/* ===========================
   ZOOM LENTO DEL FONDO
=========================== */

@keyframes heroZoom{

    0%{
        transform:scale(1.08);
    }

    50%{
        transform:scale(1.12);
    }

    100%{
        transform:scale(1.08);
    }

}

@keyframes heroContentIn{

    from{

        opacity:0;
        transform:translateY(40px);

    }

    to{

        opacity:1;
        transform:translateY(0);

    }

}