/* ========================================
   Index 首頁動態效果
======================================== */

@keyframes indexFadeUp {
    0% {
        opacity: 0;
        transform: translate3d(0, 24px, 0);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes indexSlideInLeft {
    0% {
        opacity: 0;
        transform: translate3d(-70px, 0, 0);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes indexSlideInRight {
    0% {
        opacity: 0;
        transform: translate3d(70px, 0, 0);
    }
    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

@keyframes indexFloatY {
    0%, 100% {
        transform: translate3d(0, 0, 0);
    }
    50% {
        transform: translate3d(0, -9px, 0);
    }
}

@keyframes indexSoftPop {
    0% {
        opacity: 0;
        transform: scale(.96);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}


/* ========================================
   主標待機呼吸
======================================== */

@keyframes titleBreathing {
    0%,
    100% {
        transform: translateY(0) scale(1);
        filter: brightness(1);
    }

    50% {
        transform: translateY(-3px) scale(1.02);
        filter: brightness(1.1);
    }
}

/* ========================================
   主標柔光
======================================== */

@keyframes titleGlow {
    0%,
    60%,
    100% {
        filter:
            brightness(1)
            drop-shadow(0 0 0 rgba(255, 255, 255, 0))
            drop-shadow(0 4px 8px rgba(166, 72, 105, .12));
    }

    75% {
        filter:
            brightness(1.08)
            drop-shadow(0 0 8px rgba(255, 255, 255, .85))
            drop-shadow(0 0 18px rgba(255, 190, 220, .75))
            drop-shadow(0 6px 18px rgba(180, 90, 130, .28));
    }

    85% {
        filter:
            brightness(1.04)
            drop-shadow(0 0 5px rgba(255, 255, 255, .55))
            drop-shadow(0 0 12px rgba(255, 190, 220, .45))
            drop-shadow(0 5px 12px rgba(180, 90, 130, .2));
    }
}