/* Animations for page elements */
.animate-in {
    animation: fadeIn 1s var(--transition-timing) forwards;
}

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

/* Header scroll animations */
.header {
    transition: transform 0.3s var(--transition-timing);
}

.header.scroll-down {
    transform: translateY(-100%);
}

.header.scroll-up {
    transform: translateY(0);
}

/* Hero title animation */
.hero-title .line {
    overflow: hidden;
    opacity: 0;
    animation: revealLine 0.8s var(--transition-timing) forwards;
}

.hero-title .line:nth-child(2) {
    animation-delay: 0.2s;
}

@keyframes revealLine {
    from {
        opacity: 0;
        transform: translateY(100%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Hero subtitle animation */
.hero-subtitle {
    opacity: 0;
    animation: fadeInUp 0.8s var(--transition-timing) 0.4s forwards;
}

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

/* Work item hover effect */
.work-item {
    transition: transform 0.3s var(--transition-timing);
}

.work-item:hover {
    transform: translateY(-10px);
}

/* Contact link hover effect */
.contact-link {
    transition: color 0.3s var(--transition-timing);
}

.contact-link:hover {
    color: var(--accent-color);
}
