/* ==========================================================================
   AFFARINOLO NOLEGGIO — Animations
   ========================================================================== */

/* ---------- Scroll Reveal Animations ---------- */
[data-animate] {
    opacity: 0;
    transition: opacity 0.7s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.7s cubic-bezier(0.4, 0, 0.2, 1);
}

[data-animate="fade-up"] {
    transform: translateY(30px);
}

[data-animate="fade-in"] {
    transform: none;
}

[data-animate="scale-in"] {
    transform: scale(0.92);
}

[data-animate="fade-left"] {
    transform: translateX(-30px);
}

[data-animate="fade-right"] {
    transform: translateX(30px);
}

/* Visible state */
[data-animate].afn-visible {
    opacity: 1;
    transform: translateY(0) translateX(0) scale(1);
}

/* Stagger children */
[data-stagger] > * {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

[data-stagger].afn-visible > * {
    opacity: 1;
    transform: translateY(0);
}

[data-stagger].afn-visible > *:nth-child(1) { transition-delay: 0.05s; }
[data-stagger].afn-visible > *:nth-child(2) { transition-delay: 0.12s; }
[data-stagger].afn-visible > *:nth-child(3) { transition-delay: 0.19s; }
[data-stagger].afn-visible > *:nth-child(4) { transition-delay: 0.26s; }
[data-stagger].afn-visible > *:nth-child(5) { transition-delay: 0.33s; }
[data-stagger].afn-visible > *:nth-child(6) { transition-delay: 0.40s; }
[data-stagger].afn-visible > *:nth-child(7) { transition-delay: 0.47s; }
[data-stagger].afn-visible > *:nth-child(8) { transition-delay: 0.54s; }

/* ---------- Hero Scroll Indicator ---------- */
@keyframes afn-scroll-bounce {
    0%, 100% {
        transform: translateX(-50%) translateY(0);
        opacity: 0.5;
    }
    50% {
        transform: translateX(-50%) translateY(10px);
        opacity: 1;
    }
}

/* ---------- Vehicle Card Filter Animation ---------- */
.afn-vehicle-card {
    transition: opacity 0.35s ease,
                transform 0.35s ease,
                box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                border-color 0.3s ease;
}

.afn-vehicle-card.afn-filtering-out {
    opacity: 0;
    transform: scale(0.95);
    pointer-events: none;
}

.afn-vehicle-card.afn-filtering-in {
    opacity: 1;
    transform: scale(1);
}

/* ---------- Pulse for CTA ---------- */
@keyframes afn-pulse-glow {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.4);
    }
    50% {
        box-shadow: 0 0 0 12px rgba(212, 175, 55, 0);
    }
}

.afn-btn--accent {
    animation: afn-pulse-glow 3s ease-in-out infinite;
}
.afn-btn--accent:hover {
    animation: none;
}

/* ---------- Counter Animation (handled by JS, but base styles) ---------- */
.afn-counter-animated {
    display: inline-block;
}

/* ---------- Hero content entrance ---------- */
.afn-hero__content {
    opacity: 0;
    transform: translateY(20px);
    animation: afn-hero-entrance 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.2s forwards;
}

@keyframes afn-hero-entrance {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.afn-hero__stats {
    opacity: 0;
    transform: translateY(15px);
    animation: afn-hero-entrance 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.5s forwards;
}

/* ---------- Modal entrance / exit ---------- */
.afn-modal__container {
    transform: scale(0.95) translateY(10px);
    transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.afn-modal.active .afn-modal__container {
    transform: scale(1) translateY(0);
}

/* ---------- Loading shimmer for images ---------- */
@keyframes afn-shimmer {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

.afn-shimmer {
    background: linear-gradient(
        90deg,
        #e8edf2 25%,
        #f0f3f6 50%,
        #e8edf2 75%
    );
    background-size: 200% 100%;
    animation: afn-shimmer 1.5s ease-in-out infinite;
}

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

    [data-animate] {
        opacity: 1;
        transform: none;
    }

    [data-stagger] > * {
        opacity: 1;
        transform: none;
    }
}