/* Custom CSS for animations and font */
html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Inter', sans-serif;
    margin: 0;
    padding: 0;
    overflow-x: hidden; /* Prevent horizontal scroll */
}

/* Custom Fade In Up Animation */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fadeInUp {
    animation: fadeInUp 0.6s ease-out forwards;
    opacity: 0; /* Ensure it starts hidden */
}

.animate-fadeInUp.delay-200 { animation-delay: 0.2s; }
.animate-fadeInUp.delay-400 { animation-delay: 0.4s; }

/* Custom Fade In Animation */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.animate-fadeIn {
    animation: fadeIn 0.8s ease-out forwards;
    opacity: 0;
}

/* Custom Slide Down for Mobile Menu */
@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-slideDown {
    animation: slideDown 0.3s ease-out forwards;
}

/* Custom Fade In Left Animation */
@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.animate-fadeInLeft {
    animation: fadeInLeft 0.6s ease-out forwards;
    opacity: 0;
}

/* Custom Fade In Right Animation */
@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.animate-fadeInRight {
    animation: fadeInRight 0.6s ease-out forwards;
    opacity: 0;
}

/* Subtle Pulse for background shapes */
@keyframes pulse-slow {
    0%, 100% { transform: scale(1); opacity: 0.2; }
    50% { transform: scale(1.1); opacity: 0.3; }
}

.animate-pulse-slow {
    animation: pulse-slow 8s infinite ease-in-out;
}

/* Subtle Bounce for Go To Top button */
@keyframes bounce-subtle {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

.animate-bounce-subtle {
    animation: bounce-subtle 1.5s infinite ease-in-out;
}

/* Container for consistent padding */
.container {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Page specific display control */
.page-section {
    display: none; /* Hidden by default */
}
.page-section.active {
    display: block; /* Shown when active */
}

/* Hero background image styling */
.hero-background {
    background-image: url('images/auave-landing4.png'); /* auave-landing4.png */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

}
