/* Scroll animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInLeft {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(0);
    }
}

@keyframes slideInRight {
    from {
        transform: translateX(100%);
    }
    to {
        transform: translateX(0);
    }
}

@keyframes progressFill {
    from {
        width: 0;
    }
}

@keyframes pulse {
    0%, 100% {
        transform: scale(1);
        opacity: 0.5;
    }
    50% {
        transform: scale(1.1);
        opacity: 0.8;
    }
}

@keyframes glowPulse {
    0%, 100% {
        opacity: 0.3;
        transform: scale(1);
    }
    50% {
        opacity: 0.5;
        transform: scale(1.05);
    }
}

/* Hero image entrance animation */
.hero-image-frame {
    animation: heroImageEntrance 1s ease-out;
}

@keyframes heroImageEntrance {
    from {
        opacity: 0;
        transform: perspective(1000px) rotateY(-15deg) rotateX(10deg) translateY(50px);
    }
    to {
        opacity: 1;
        transform: perspective(1000px) rotateY(-5deg) rotateX(5deg) translateY(0);
    }
}

/* Animation classes */
.fade-in-up {
    opacity: 0;
    animation: fadeInUp 0.8s ease forwards;
}

.fade-in-up-delay-1 {
    opacity: 0;
    animation: fadeInUp 0.8s ease 0.1s forwards;
}

.fade-in-up-delay-2 {
    opacity: 0;
    animation: fadeInUp 0.8s ease 0.2s forwards;
}

.fade-in-up-delay-3 {
    opacity: 0;
    animation: fadeInUp 0.8s ease 0.3s forwards;
}

/* Scale Ticker: одинаковая медленная скорость для всех трёх ползунков */
.scale-ticker-row--1 .scale-ticker-track,
.scale-ticker-row--3 .scale-ticker-track {
    animation: tickerScrollLeft 110s linear infinite;
}

.scale-ticker-row--2 .scale-ticker-track {
    animation: tickerScrollLeft 110s linear infinite reverse;
}

@keyframes tickerScrollLeft {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

@keyframes tickerScrollRight {
    from {
        transform: translateX(-50%);
    }
    to {
        transform: translateX(0);
    }
}

/* Skill bar animation */
.skill-bar.animate {
    animation: progressFill 1.5s ease forwards;
}
