/* Custom Colors for Green Palette */
.bg-sage-50 {
    background-color: #F8F9F7;
}
.bg-sage-100 {
    background-color: #EBF1EA;
}
.text-sage-800 {
    color: #4A554A;
}
.bg-sage-900 {
    background-color: #1A341A;
}
.bg-sage-700 {
    background-color: #2F592F;
}

/* Custom classes for the new color theme */
.text-accent-green {
    color: #4CAF50; /* Primary green accent */
}
.bg-accent-green {
    background-color: #4CAF50;
}
.border-accent-green {
    border-color: #4CAF50;
}
.btn-main {
    @apply px-8 py-4 rounded-full text-white font-bold transition-transform duration-300 transform hover:scale-105;
    background-color: #4CAF50;
}
.btn-main:hover {
    background-color: #43A047; /* Darker green on hover */
}

/* Base Body and Fonts */
body {
    font-family: 'Lato', sans-serif;
    color: #4A554A;
}
.font-heading {
    font-family: 'Merriweather', serif;
}
.font-body {
    font-family: 'Lato', sans-serif;
}

/* Badge Styles */
.badge-primary {
    @apply inline-block bg-sage-900 text-white text-sm font-semibold px-3 py-1 rounded-full;
}
.badge-secondary {
    @apply inline-block bg-sage-700 text-white text-sm font-semibold px-3 py-1 rounded-full mt-2;
}

/* Card Hover Effect */
.card-hover-effect .card-overlay-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    transform: translateY(100%);
    transition: transform 0.3s ease-in-out;
}
.card-hover-effect:hover .card-overlay-content {
    transform: translateY(0);
}

/* Animations */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.animate-hero-text {
    animation: fadeIn 1.5s ease-out forwards;
}
.animate-hero-button {
    animation: fadeIn 1.5s ease-out 0.4s forwards;
}

/* Mobile Menu specific styles - unchanged */
.mobile-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
.mobile-menu-overlay.open {
    opacity: 1;
    visibility: visible;
}
.mobile-menu-overlay ul {
    list-style: none;
    padding: 0;
    text-align: center;
}
.mobile-menu-overlay ul li {
    margin-bottom: 1.5rem;
}
.mobile-menu-overlay ul li a {
    color: white;
    font-size: 2.25rem;
    font-weight: bold;
    transition: color 0.2s ease-in-out;
}
.mobile-menu-overlay ul li a:hover {
    color: #4CAF50;
}
.mobile-menu-close {
    position: absolute;
    top: 2rem;
    right: 2rem;
    font-size: 3rem;
    color: white;
    cursor: pointer;
    transition: color 0.2s ease-in-out;
}
.mobile-menu-close:hover {
    color: #4CAF50;
}
@media (max-width: 767px) {
    .navbar-desktop {
        display: none;
    }
    .hamburger-menu {
        display: block;
    }
}
@media (min-width: 768px) {
    .navbar-desktop {
        display: flex !important;
    }
    .hamburger-menu {
        display: none;
    }
}