/* ==========================================================
   KEYFRAME ANIMATIONS
========================================================== */

@keyframes heroTitle {
    from {
        opacity: 0;
        transform: translateY(60px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes heroGlow {
    from { transform: scale(1); }
    to   { transform: scale(1.08); }
}

@keyframes shine {
    0%   { left: -70%; }
    100% { left: 160%; }
}

@keyframes floatCard {
    0%   { transform: translateY(0); }
    50%  { transform: translateY(-6px); }
    100% { transform: translateY(0); }
}

@keyframes floatIcon {
    0%   { transform: translateY(0); }
    50%  { transform: translateY(-8px); }
    100% { transform: translateY(0); }
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(40px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes floatGlow {
    0%, 100% { transform: translate(0, 0); }
    50%      { transform: translate(50px, 40px); }
}

@keyframes floatGlow2 {
    0%, 100% { transform: translate(0, 0); }
    50%      { transform: translate(-40px, -30px); }
}

@keyframes rotateUnion {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

@keyframes floatUnion {
    0%   { margin-top: 0;  margin-right: 0; }
    25%  { margin-top: -20px; margin-right: 20px; }
    50%  { margin-top: 15px; margin-right: -15px; }
    75%  { margin-top: -10px; margin-right: 15px; }
    100% { margin-top: 0;  margin-right: 0; }
}

@keyframes shineBtn {
    0%   { left: -40%; }
    100% { left: 150%; }
}