/* Base Styles & Animations */

/* Fade In Animation */
.fade-in-element {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.fade-in-element.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Delays for staggered animations */
.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }
.delay-400 { transition-delay: 400ms; }
.delay-500 { transition-delay: 500ms; }

/* Marquee Animation */
.marquee-container {
    animation: marquee 30s linear infinite;
}

@keyframes marquee {
    0% {
        transform: translateX(0%);
    }
    100% {
        /* Move left by exactly half the width (since we duplicated the items) */
        transform: translateX(-50%);
    }
}

/* FAQ Accordion Transitions */
.faq-answer {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease-out;
}

.faq-answer > div {
    overflow: hidden;
}

.faq-answer.open {
    grid-template-rows: 1fr;
}

.faq-icon {
    transition: transform 0.3s ease-out;
}

.faq-icon.open {
    transform: rotate(180deg);
}

/* Button Pulse Animation */
@keyframes button-pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.7);
    }
    50% {
        transform: scale(1.03);
        box-shadow: 0 0 0 15px rgba(220, 38, 38, 0);
    }
    100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0);
    }
}

.animate-button-pulse {
    animation: button-pulse 2s infinite ease-in-out;
}
