/* ==========================================================================
   PairCoder Animation Styles
   Fade-ins, Transitions, Keyframes
   ========================================================================== */

/* --------------------------------------------------------------------------
   Fade-in Animation
   -------------------------------------------------------------------------- */
.fade-in {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.4s ease, transform 0.4s ease;
    will-change: opacity, transform;
}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

/* --------------------------------------------------------------------------
   Keyframes
   -------------------------------------------------------------------------- */
@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

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