/* =========================
   Animations
   ========================= */

/* Fade in up (hero elements) */

.fade-in-up {
    animation: fadeInUp 0.8s ease-out forwards;
    opacity: 0;
    transform: translateY(20px);
}

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

/* Logo marquee scrolling */

.logo-marquee-track {
    animation: logoScroll 25s linear infinite;
}

@keyframes logoScroll {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

/* Smooth transitions for tech steps and arrows */

.tech-step,
.tech-step-active {
    transition:
        opacity 0.4s ease,
        transform 0.4s ease,
        box-shadow 0.4s ease,
        border-color 0.4s ease;
}

.tech-step-icon {
    transition: color 0.3s ease, transform 0.3s ease;
}

.tech-arrow,
.tech-arrow-active {
    transition: color 0.3s ease, transform 0.3s ease;
}