@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

body {
    font-family: 'Inter', sans-serif;
}

.group:hover .group-hover\:block {
    display: block;
}

.nav-shadow {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.hero-pattern {
    background-image: url('assets/leaf-pattern.png');
    background-repeat: repeat;
    opacity: 0.1;
}
/* Add these styles to your existing CSS */
body {
    font-family: 'Inter', sans-serif;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.group:hover .group-hover\:block {
    display: block;
}

.nav-shadow {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.hero-pattern {
    background-image: url('assets/leaf-pattern.png');
    background-repeat: repeat;
    opacity: 0.1;
}

main {
    flex: 1;
}

footer {
    margin-top: auto;
}

/* Add these styles */
.mobile-dropdown-trigger {
    position: relative;
    transition: all 0.3s ease;
}

.mobile-dropdown {
    transition: all 0.3s ease;
}

/* Animation for menu items */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

#mobile-menu {
    animation: slideIn 0.3s ease;
}