/* FILE: css/utilities/animations.css */

/* Entry animation for cards */
@keyframes card-enter {
    from {
        opacity: 0;
        transform: scale(0.98);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Nebula rotation (background) */
@keyframes rotate-nebula {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

/* Fade-in for tab content transitions */
@keyframes fade-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Blinking cursor for 404 page */
.blinking-cursor {
    animation: blink 1s step-end infinite;
}

@keyframes blink {

    from,
    to {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }
}

/* Fade-in-up for sequential element reveal */
@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Utility class for JS-controlled fade-in */
.loaded .fade-in {
    animation: fade-in-up 0.8s ease forwards;
}

/* Intersection observer: initial hidden state and reveal transition */
.service-card,
.project-row,
.spec-item,
.bio-text {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.service-card.in-view,
.project-row.in-view,
.spec-item.in-view,
.bio-text.in-view {
    opacity: 1;
    transform: translateY(0);
}