/* ============================================
   ANIMATIONS STYLESHEET
   ============================================ */

/* Reveal Animations */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: opacity, transform;
}

    .reveal.visible {
        opacity: 1;
        transform: translateY(0);
    }

.reveal-fade {
    opacity: 0;
    transition: opacity 1s ease;
}

    .reveal-fade.visible {
        opacity: 1;
    }

.reveal-scale {
    opacity: 0;
    transform: scale(0.92);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

    .reveal-scale.visible {
        opacity: 1;
        transform: scale(1);
    }

.reveal-left {
    opacity: 0;
    transform: translateX(-40px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

    .reveal-left.visible {
        opacity: 1;
        transform: translateX(0);
    }

.reveal-right {
    opacity: 0;
    transform: translateX(40px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

    .reveal-right.visible {
        opacity: 1;
        transform: translateX(0);
    }

/* Staggered children */
.reveal-stagger > * {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal-stagger.visible > * {
    opacity: 1;
    transform: translateY(0);
}

    .reveal-stagger.visible > *:nth-child(1) {
        transition-delay: 0.05s;
    }

    .reveal-stagger.visible > *:nth-child(2) {
        transition-delay: 0.15s;
    }

    .reveal-stagger.visible > *:nth-child(3) {
        transition-delay: 0.25s;
    }

    .reveal-stagger.visible > *:nth-child(4) {
        transition-delay: 0.35s;
    }

    .reveal-stagger.visible > *:nth-child(5) {
        transition-delay: 0.45s;
    }

    .reveal-stagger.visible > *:nth-child(6) {
        transition-delay: 0.55s;
    }

    .reveal-stagger.visible > *:nth-child(7) {
        transition-delay: 0.65s;
    }

    .reveal-stagger.visible > *:nth-child(8) {
        transition-delay: 0.75s;
    }

/* Text Reveal */
.text-reveal {
    overflow: hidden;
    display: inline-block;
}

    .text-reveal span {
        display: inline-block;
        transform: translateY(100%);
        transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }

    .text-reveal.visible span {
        transform: translateY(0);
    }

/* Hero Text Animation */
.hero-content .label {
    opacity: 0;
    transform: translateY(20px);
    animation: heroFadeUp 0.8s ease forwards 0.3s;
}

.hero-content h1 {
    opacity: 0;
    transform: translateY(30px);
    animation: heroFadeUp 1s ease forwards 0.5s;
}

.hero-content p {
    opacity: 0;
    transform: translateY(20px);
    animation: heroFadeUp 0.8s ease forwards 0.8s;
}

.hero-actions {
    opacity: 0;
    transform: translateY(20px);
    animation: heroFadeUp 0.8s ease forwards 1s;
}

.scroll-indicator {
    opacity: 0;
    animation: heroFadeUp 0.8s ease forwards 1.3s;
}

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

/* Page Hero Animation */
.page-hero-content .breadcrumbs {
    opacity: 0;
    transform: translateY(15px);
    animation: heroFadeUp 0.6s ease forwards 0.2s;
}

.page-hero-content h1 {
    opacity: 0;
    transform: translateY(25px);
    animation: heroFadeUp 0.8s ease forwards 0.4s;
}

.page-hero-content p {
    opacity: 0;
    transform: translateY(20px);
    animation: heroFadeUp 0.8s ease forwards 0.6s;
}

/* Image Zoom on Hover (utility) */
.zoom-hover {
    overflow: hidden;
}

    .zoom-hover img {
        transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }

    .zoom-hover:hover img {
        transform: scale(1.08);
    }

/* Ken Burns Effect */
.ken-burns img {
    animation: kenBurns 20s ease-in-out infinite alternate;
}

@keyframes kenBurns {
    0% {
        transform: scale(1) translate(0, 0);
    }

    100% {
        transform: scale(1.12) translate(-2%, -1%);
    }
}

/* Shimmer / Loading */
.shimmer {
    background: linear-gradient( 90deg, var(--bg-card) 0%, var(--bg-elevated) 50%, var(--bg-card) 100% );
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
}

@keyframes shimmer {
    0% {
        background-position: -200% 0;
    }

    100% {
        background-position: 200% 0;
    }
}

/* Fade Transition for Filtered Items */
.filter-item {
    transition: opacity 0.3s ease, transform 0.3s ease;
}

    .filter-item.hidden {
        display: none !important;
    }

/* Underline Draw */
.underline-draw {
    position: relative;
}

    .underline-draw::after {
        content: '';
        position: absolute;
        bottom: -4px;
        left: 0;
        width: 0;
        height: 1px;
        background: var(--accent);
        transition: width 0.6s ease;
    }

    .underline-draw:hover::after {
        width: 100%;
    }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }

    .reveal,
    .reveal-fade,
    .reveal-scale,
    .reveal-left,
    .reveal-right,
    .reveal-stagger > * {
        opacity: 1 !important;
        transform: none !important;
    }
}