/* =========================================================
   OSVALDO DESKTOP MENU
   ========================================================= */


/* =========================================================
   DEFAULT
   ========================================================= */

#osv-desktop-nav {
    display: none;
}


/* =========================================================
   DESKTOP ONLY
   ========================================================= */

@media screen and (min-width: 1025px) {


    /* =====================================================
       HERO
       ===================================================== */

    .osvaldo-hero {
        position: relative;
    }


    /* =====================================================
       PRIMA BANDA BIANCA HERO
       ===================================================== */

    .osvaldo-hero::before {

        content: "";

        position: absolute;

        top: 0;
        left: 0;

        width: 100%;
        height: 200px;

        background: #ffffff;

        opacity: 0;

        visibility: hidden;

        pointer-events: none;

        transition:
            opacity 0.2s ease,
            visibility 0s linear 0.2s;

        z-index: 2;
    }


    /* =====================================================
       TITOLO + TAGLINE ORIGINALI
       ===================================================== */

    #osv-title,
    #osv-tagline {

        position: relative !important;

        z-index: 1000005 !important;
    }


    #osv-title .elementor-heading-title,
    #osv-tagline .elementor-heading-title {

        position: relative;

        z-index: 1000006;

        transition:
            color 0.2s ease,
            -webkit-text-fill-color 0.2s ease !important;
    }


    /* =====================================================
       HEADER DESKTOP
       ===================================================== */

    #osv-desktop-nav {

        display: block;

        position: fixed;

        top: 0;
        left: 0;

        width: 100vw;
        height: 200px;

        z-index: 999999;

        font-family:
            Arial,
            Helvetica,
            sans-serif;

        pointer-events: none;

        transform:
            translateY(0);

        transition:
            transform 1s
            cubic-bezier(
                0.16,
                1,
                0.3,
                1
            );
    }


    /* =====================================================
       BANDA BIANCA FIXED
       ===================================================== */

    #osv-desktop-nav::before {

        content: "";

        position: fixed;

        top: 0;
        left: 0;

        width: 100vw;
        height: 200px;

        background: #ffffff;

        opacity: 0;

        visibility: hidden;

        pointer-events: none;

        transition:
            opacity 0.2s ease,
            visibility 0s linear 0.2s;

        z-index: 1;
    }


    /* =====================================================
       TRIGGER VECCHIO
       ===================================================== */

    #osv-desktop-nav
    .osv-menu-trigger {

        display: none !important;
    }


    /* =====================================================
       WRAPPER MENU
       ===================================================== */

    #osv-desktop-nav
    .osv-desktop-main {

        position: fixed;

        top: 0;
        left: 0;

        width: 100vw;
        height: 200px;

        pointer-events: none;

        z-index: 2;
    }


    /* =====================================================
       MENU PRINCIPALE
       ===================================================== */

    #osv-desktop-nav
    .osv-desktop-links {

        position: fixed;

        top: 0;
        left: 0;

        width: 100vw;
        height: 200px;

        box-sizing: border-box;

        background: transparent;

        display: flex;

        align-items: flex-end;
        justify-content: center;

        gap: 0;

        padding:
            0
            40px
            25px
            40px;

        opacity: 1;

        visibility: visible;

        pointer-events: auto;

        transform:
            translateY(0);

        transition:
            transform 1s
            cubic-bezier(
                0.16,
                1,
                0.3,
                1
            ),
            opacity 0.35s ease;

        z-index: 3;
    }


    /* =====================================================
       SECONDA BANDA
       ===================================================== */

    #osv-desktop-nav
    .osv-desktop-links::before {

        content: "";

        position: absolute;

        top: 175px;
        left: 0;

        width: 100vw;
        height: 135px;

        background: #ffffff;

        opacity: 0;

        visibility: hidden;

        pointer-events: none;

        box-shadow:
            0
            14px
            25px
            rgba(
                0,
                0,
                0,
                0.05
            );

        transition:
            opacity 0.2s ease,
            visibility 0s linear 0.2s;

        z-index: 5;
    }


    /* =====================================================
       MOSTRA SECONDA BANDA

       Funziona sia con :hover
       sia con la classe JS osv-submenu-open
       ===================================================== */

    #osv-desktop-nav
    .osv-desktop-links:has(
        .osv-nav-item:hover
    )::before,

    #osv-desktop-nav
    .osv-desktop-links:has(
        .osv-nav-item.osv-submenu-open
    )::before {

        opacity: 1;

        visibility: visible;

        transition:
            opacity 0.2s ease,
            visibility 0s linear 0s;
    }


    /* =====================================================
       TOP NORMALE
       ===================================================== */

    html.osv-at-top
    .osvaldo-hero::before {

        opacity: 0;

        visibility: hidden;
    }


    html.osv-at-top
    #osv-desktop-nav::before {

        opacity: 0;

        visibility: hidden;
    }


    html.osv-at-top
    #osv-desktop-nav
    .osv-nav-main,

    html.osv-at-top
    #osv-desktop-nav
    .osv-nav-main:link,

    html.osv-at-top
    #osv-desktop-nav
    .osv-nav-main:visited {

        color: #ffffff !important;

        -webkit-text-fill-color:
            #ffffff !important;
    }


    /* =====================================================
       TOP + HOVER
       ===================================================== */

    html.osv-at-top.osv-hover-open
    .osvaldo-hero::before {

        opacity: 1;

        visibility: visible;

        transition:
            opacity 0.2s ease,
            visibility 0s linear 0s;
    }


    html.osv-at-top.osv-hover-open
    #osv-desktop-nav
    .osv-nav-main,

    html.osv-at-top.osv-hover-open
    #osv-desktop-nav
    .osv-nav-main:link,

    html.osv-at-top.osv-hover-open
    #osv-desktop-nav
    .osv-nav-main:visited {

        color: #555555 !important;

        -webkit-text-fill-color:
            #555555 !important;
    }


    /* =====================================================
       FLOATING BRAND
       ===================================================== */

    #osv-title.osv-brand-floating,
    #osv-tagline.osv-brand-floating {

        position: fixed !important;

        top:
            var(--osv-floating-top) !important;

        left:
            var(--osv-floating-left) !important;

        width:
            var(--osv-floating-width) !important;

        margin: 0 !important;

        z-index: 1000005 !important;

        opacity: 1;

        visibility: visible;

        pointer-events: none;

        transform:
            translateY(0);

        transition:
            transform 1s
            cubic-bezier(
                0.16,
                1,
                0.3,
                1
            ),
            opacity 0.35s ease !important;
    }


    #osv-title.osv-brand-floating,
    #osv-title.osv-brand-floating *,
    #osv-tagline.osv-brand-floating,
    #osv-tagline.osv-brand-floating * {

        color: #555555 !important;

        -webkit-text-fill-color:
            #555555 !important;
    }


    /* =====================================================
       SCROLL DOWN
       ===================================================== */

    html.osv-scroll-down
    #osv-desktop-nav {

        transform:
            translateY(-220px);
    }


    html.osv-scroll-down
    #osv-desktop-nav
    .osv-desktop-links {

        opacity: 0;

        pointer-events: none;
    }


    html.osv-scroll-down
    #osv-desktop-nav::before {

        opacity: 0;

        visibility: hidden;
    }


    html.osv-scroll-down
    #osv-title.osv-brand-floating,

    html.osv-scroll-down
    #osv-tagline.osv-brand-floating {

        opacity: 0;

        transform:
            translateY(-220px);

        pointer-events: none;
    }


    /* =====================================================
       SCROLL UP
       ===================================================== */

    html.osv-scroll-up
    #osv-desktop-nav {

        transform:
            translateY(0);
    }


    html.osv-scroll-up
    #osv-desktop-nav::before {

        opacity: 1;

        visibility: visible;

        transition:
            opacity 0.2s ease,
            visibility 0s linear 0s;
    }


    html.osv-scroll-up
    #osv-desktop-nav
    .osv-desktop-links {

        opacity: 1;

        visibility: visible;

        pointer-events: auto;
    }


    html.osv-scroll-up
    #osv-desktop-nav
    .osv-nav-main,

    html.osv-scroll-up
    #osv-desktop-nav
    .osv-nav-main:link,

    html.osv-scroll-up
    #osv-desktop-nav
    .osv-nav-main:visited {

        color: #555555 !important;

        -webkit-text-fill-color:
            #555555 !important;
    }


    /* =====================================================
       EDGE OPEN
       ===================================================== */

    html.osv-edge-open
    #osv-desktop-nav {

        transform:
            translateY(0);
    }


    html.osv-edge-open
    #osv-desktop-nav::before {

        opacity: 1;

        visibility: visible;

        transition:
            opacity 0.2s ease,
            visibility 0s linear 0s;
    }


    html.osv-edge-open
    #osv-desktop-nav
    .osv-desktop-links {

        opacity: 1;

        visibility: visible;

        pointer-events: auto;

        transform:
            translateY(0);
    }


    html.osv-edge-open
    #osv-desktop-nav
    .osv-nav-main,

    html.osv-edge-open
    #osv-desktop-nav
    .osv-nav-main:link,

    html.osv-edge-open
    #osv-desktop-nav
    .osv-nav-main:visited {

        color: #555555 !important;

        -webkit-text-fill-color:
            #555555 !important;
    }


    /* =====================================================
       VOCI PRINCIPALI
       ===================================================== */

    #osv-desktop-nav
    .osv-nav-item {

        position: static;

        display: flex;

        align-items: center;

        padding-left: 25px;
        padding-right: 25px;

        box-sizing: border-box;
    }


    #osv-desktop-nav
    .osv-nav-main {

        position: relative;

        display: block;

        padding:
            12px
            0
            22px
            0;

        margin-bottom: -10px;

        color: #ffffff !important;

        text-decoration: none !important;

        font-size: 12px;

        font-weight: 400;

        letter-spacing: 0.16em;

        line-height: 1;

        white-space: nowrap;

        transition:
            color 0.2s ease,
            -webkit-text-fill-color 0.2s ease;
    }


    #osv-desktop-nav
    .osv-nav-main:hover {

        color: #000000 !important;

        -webkit-text-fill-color:
            #000000 !important;
    }


    /* =====================================================
       LINEA HOVER
       ===================================================== */

    #osv-desktop-nav
    .osv-nav-main::after {

        content: "";

        position: absolute;

        left: 0;
        bottom: 15px;

        width: 0;
        height: 1px;

        background: currentColor;

        transition:
            width 0.3s ease;
    }


    #osv-desktop-nav
    .osv-nav-item:hover
    .osv-nav-main::after,

    #osv-desktop-nav
    .osv-nav-item.osv-submenu-open
    .osv-nav-main::after {

        width: 100%;
    }


    /* =====================================================
       DROPDOWN
       ===================================================== */

    #osv-desktop-nav
    .osv-dropdown {

        position: absolute;

        top: 175px;
        left: 0;

        width: 100vw;

        background: transparent;

        box-sizing: border-box;

        opacity: 0;

        visibility: hidden;

        pointer-events: none;

        transition:
            opacity 0.2s ease,
            visibility 0s linear 0.2s;

        z-index: 6;
    }


    /* =====================================================
       APERTURA DROPDOWN

       :hover classico
       +
       classe gestita dal JS
       ===================================================== */

    #osv-desktop-nav
    .osv-nav-item:hover
    .osv-dropdown,

    #osv-desktop-nav
    .osv-nav-item.osv-submenu-open
    .osv-dropdown {

        opacity: 1;

        visibility: visible;

        pointer-events: auto;

        transition:
            opacity 0.2s ease,
            visibility 0s linear 0s;
    }


    /* =====================================================
       CONTENUTO DROPDOWN
       ===================================================== */

    #osv-desktop-nav
    .osv-dropdown-inner {

        position: relative;

        z-index: 7;

        min-height: 135px;

        display: flex;

        align-items: center;
        justify-content: center;

        gap: 65px;

        padding:
            35px
            40px
            20px
            40px;

        box-sizing: border-box;
    }


    /* =====================================================
       LINK SOTTOMENU
       ===================================================== */

    #osv-desktop-nav
    .osv-dropdown-inner a,

    #osv-desktop-nav
    .osv-dropdown-inner a:link,

    #osv-desktop-nav
    .osv-dropdown-inner a:visited {

        position: relative;

        color: #555555 !important;

        -webkit-text-fill-color:
            #555555 !important;

        text-decoration: none !important;

        font-size: 11px;

        font-weight: 400;

        letter-spacing: 0.14em;

        line-height: 1;

        white-space: nowrap;

        transition:
            color 0.25s ease;
    }


    #osv-desktop-nav
    .osv-dropdown-inner a:hover {

        color: #000000 !important;

        -webkit-text-fill-color:
            #000000 !important;
    }


    /* =====================================================
       LINEA HOVER SOTTOMENU
       ===================================================== */

    #osv-desktop-nav
    .osv-dropdown-inner a::after {

        content: "";

        position: absolute;

        left: 0;
        bottom: -7px;

        width: 0;
        height: 1px;

        background: #111111;

        transition:
            width 0.3s ease;
    }


    #osv-desktop-nav
    .osv-dropdown-inner a:hover::after {

        width: 100%;
    }

}


/* =========================================================
   TABLET + MOBILE
   NON TOCCATO
   ========================================================= */

@media screen and (max-width: 1024px) {

    #osv-desktop-nav {

        display: none !important;
    }

}