/* ====================================
   Horizonte Cosón Residences - Styles
   ==================================== */

/* Base Transitions */
body {
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Animations */
.fade-in-up {
    animation: fadeInUp 0.8s ease-out forwards;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Navigation Styles */
#main-nav {
    background-color: transparent;
    border-bottom: 1px solid transparent;
    transition: background-color 0.3s ease, border-color 0.3s ease, backdrop-filter 0.3s ease;
}

/* Estado inicial (sin scroll) - Logo y texto blanco */
#main-nav .nav-item {
    color: #FFFFFF;
    transition: color 0.3s ease;
}

#main-nav .nav-logo {
    filter: brightness(0) invert(1);
    transition: filter 0.3s ease;
}

/* Estado con scroll - Fondo blanco y texto marrón */
#main-nav.scrolled-nav {
    background-color: rgba(255, 255, 255, 0.95);
    border-bottom: 1px solid #e7e5e4;
    backdrop-filter: blur(12px);
}

#main-nav.scrolled-nav .nav-item {
    color: #3F5222 !important;
}

#main-nav.scrolled-nav .nav-logo {
    filter: none;
}

/* Hover en estado inicial */
#main-nav:not(.scrolled-nav) .nav-item:hover {
    color: rgba(255, 255, 255, 0.7) !important;
}

/* Hover en estado con scroll */
#main-nav.scrolled-nav .nav-item:hover {
    color: #2C3A16 !important;
}

/* Dark Mode Navigation */
.dark #main-nav.scrolled-nav {
    background-color: rgba(28, 25, 23, 0.95);
    border-bottom: 1px solid #292524;
}

.dark #main-nav.scrolled-nav .nav-item {
    color: #d6d3d1 !important;
}

.dark #main-nav.scrolled-nav .nav-logo {
    filter: brightness(0) invert(1);
}

/* Hero Logo Styles */
.hero-logo {
    filter: brightness(0) invert(1);
}

/* Footer Logo Styles */
.footer-logo {
    filter: brightness(0) invert(1);
}