/* Custom Styles Decorlexus */
html {
    scroll-behavior: smooth;
}

/* Header: menú móvil y estados scroll */
@keyframes fade-in-down {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-down {
    animation: fade-in-down 0.3s ease-out;
}

#mobile-menu {
    max-height: calc(100vh - 80px);
    overflow-y: auto;
}

/* Estado scrolleado: tono oscuro */
#main-header.header-scrolled {
    background: #0f0f0f !important;
    border-bottom-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.05);
}

#main-header.header-scrolled .nav-link {
    color: #fff;
}

#main-header.header-scrolled .nav-link:hover,
#main-header.header-scrolled .nav-link.text-slate-600 {
    color: #94a3b8;
}

#main-header.header-scrolled .nav-dot {
    background-color: rgba(255, 255, 255, 0.9);
}


#main-header.header-scrolled .mobile-menu-btn {
    color: #fff;
}

#main-header.header-scrolled .mobile-dropdown {
    background: #0f0f0f;
    border-top-color: rgba(255, 255, 255, 0.08);
}

#main-header.header-scrolled .mobile-dropdown > div {
    border-color: rgba(255, 255, 255, 0.08);
}

#main-header.header-scrolled .mobile-dropdown .mobile-nav-link {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.08);
}

#main-header.header-scrolled .mobile-dropdown .mobile-submenu {
    background: rgba(0, 0, 0, 0.3);
}

#main-header.header-scrolled .mobile-dropdown .mobile-submenu a {
    color: rgba(156, 163, 175, 1);
}

#main-header.header-scrolled .mobile-dropdown .mobile-submenu a:hover {
    color: #fff;
}

/* Submenú desktop: visible al hover, no recortado por overflow */
#main-header .container {
    overflow: visible;
}
#main-header .submenu-dropdown {
    background: #fff;
    border-color: rgb(226 232 240);
    z-index: 9999;
}
#main-header .submenu-dropdown-link {
    color: rgb(51 65 85);
}
#main-header .submenu-dropdown-link:hover {
    color: #475569;
    background: rgb(248 250 252);
}

/* Mobile: evitar desbordamiento horizontal en textos largos */
.overflow-wrap-anywhere {
    overflow-wrap: anywhere;
    word-break: break-word;
}