/* ----------------------------- */

/* TOP INFO BAR */

/* ----------------------------- */



.top-info-bar {

    width: 100%;

    background: var(--lux-perla);

    color: var(--lux-grigio);

    font-size: 0.85rem;

    border-bottom: 1px solid rgba(0,0,0,0.05);

}



.top-info-inner {

    max-width: 1400px;

    margin: 0 auto;

    padding: 6px 20px;

    display: flex;

    justify-content: space-around;

    align-items: center;

}



    .top-info-inner div a {

        text-decoration: none!important;

    }



.top-info-bar i {

    font-size: 1rem;

    margin-right: 6px;

    color: var(--lux-grigio);

}



/*.ti-left,

.ti-center,

.ti-right {

    display: flex;

    align-items: center;

    gap: 12px;

}*/



.ti-lang {

    font-weight: 600;

    cursor: pointer;

}



/* ----------------------------- */

/* HEADER PRINCIPALE */

/* ----------------------------- */



.main-header {

    width: 100%;

    background: var(--lux-white);

    border-bottom: 1px solid var(--lux-border);

    position: sticky;

    top: 0;

    z-index: 50;

}



/*.header-inner {

    width: 100vh;

    margin: 0 auto;

    padding: 14px 20px;

    display: flex;

    justify-content: space-between;

    align-items: center;

}*/



.header-logo img {

    height: 48px;

    width: auto;

}



/* Desktop */

#siteMenu {

    display: flex;

    justify-content: center;

    z-index: 99;

}





.menu-toggle {

    background: none;

    border: none;

    cursor: pointer;

    display: none; /* nascosto di default */

    flex-direction: column;

    gap: 5px;

    padding: 8px;

}



    .menu-toggle span {

        width: 26px;

        height: 3px;

        background: var(--lux-nero);

        display: block;

        border-radius: 2px;

    }



/* ----------------------------- */

/* MENU */

/* ----------------------------- */



.site-menu ul {

    display: flex;

    align-items: center;

    gap: 28px;

    list-style: none;

    margin: 0;

    padding: 0;

}



.site-menu a {

    text-decoration: none;

    color: var(--lux-nero);

    font-weight: 500;

    font-size: 0.95rem;

    transition: color 0.2s ease;

    padding: 30px;

}



    .site-menu a:hover {

        color: var(--lux-grigio);

    }



.site-menu img {

    height: 100px;

    width: auto;

    display: block;

}



.has-dropdown {

    position: relative;

}



    .has-dropdown .dropdown {

        position: absolute;

        top: 200%;

        left: 10%;

        background: white;

        padding: 12px 0;

        border-radius: 6px;

        box-shadow: 0 8px 24px rgba(0,0,0,0.12);

        display: none;

        min-width: 180px;

        z-index: 20;

    }



    .has-dropdown:hover .dropdown {

        display: block;

    }



.dropdown li {

    list-style: none;

}



.dropdown a {

    display: block;

    padding: 8px 16px;

    color: var(--lux-nero);

    text-decoration: none;

    font-size: 0.9rem;

}



    .dropdown a:hover {

        background: var(--lux-perla);

    }



/* ----------------------------- */

/* RESPONSIVE */

/* ----------------------------- */



@media (max-width: 700px) {



    .top-info-inner {

        flex-direction: column;

        gap: 4px;

        text-align: center;

    }



    .header-inner {

        flex-direction: column;

        gap: 10px;

    }



    .site-menu ul {

        flex-wrap: wrap;

        justify-content: center;

        gap: 16px;

    }



    .menu-toggle {

        display: flex;

    }



    .header-logo img {

        height: 42px;

    }



    #siteMenu {

        display: none;

        flex-direction: column;

        gap: 12px;

        padding: 20px;

        background: white;

    }



        #siteMenu.open {

            display: flex;

        }



            #siteMenu.open ul {

                display: flex;

                gap: 12px;

            }



                #siteMenu.open ul li {

                    width: calc(100% - 24px);

                    gap: 12px;

                }



    ul li.menu-logo {

        order: -1;

    }



    /* Disattiva hover */

    .site-menu li:hover > ul {

        display: none !important;

    }



    /* I dropdown devono essere nascosti di default */

    .site-menu ul ul {

        display: none !important;

        position: static; /* niente absolute */

        background: transparent;

        padding-left: 12px;

    }



    /* Quando il menu è aperto, i li sono verticali */

    #siteMenu.open ul {

        flex-direction: column;

        gap: 12px;

    }



        #siteMenu.open ul li {

            width: 100%;

        }



        #siteMenu.open ul li a {

            padding: 10px;

        }



    .site-menu li.has-dropdown.open > ul {

        display: block !important;

    }



    .site-menu li.has-dropdown.open .dropdown {

        top: 150%;

        left: 5%;

    }



}