/* =========================================================
   DAMIOLINK GLOBAL HEADER
   MASTER: HOME
   ========================================================= */

.dl-global-header,
.dl-global-header *,
.dl-global-header *::before,
.dl-global-header *::after {
    box-sizing: border-box;
}

.dl-global-header {
    position: sticky;
    top: 0;
    z-index: 1000;

    width: 100%;

    background:
        rgba(4, 17, 31, .97);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);

    border-bottom:
        1px solid
        rgba(255, 255, 255, .08);
}


.dl-global-shell {
    width:
        min(
            1460px,
            calc(100% - 80px)
        );

    margin:
        0 auto;
}


.dl-global-nav-shell {
    min-height:
        92px;

    display:
        flex;

    align-items:
        center;

    gap:
        42px;
}


.dl-global-brand {
    min-width:
        300px;

    flex-shrink:
        0;

    color:
        inherit;

    text-decoration:
        none;
}


.dl-global-brand-main {
    font-size:
        40px;

    line-height:
        .9;

    font-weight:
        900;

    letter-spacing:
        -2.5px;
}


.dl-global-brand-white {
    color:
        #ffffff;
}


.dl-global-brand-blue {
    color:
        #009cff;
}


.dl-global-brand-sub {
    display:
        block;

    margin-top:
        9px;

    color:
        #9aafc1;

    font-size:
        10px;

    font-weight:
        400;

    text-transform:
        uppercase;

    letter-spacing:
        2px;

    line-height:
        normal;
}


.dl-global-nav {
    flex:
        1;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        35px;
}


.dl-global-nav a {
    position:
        relative;

    color:
        #eef5fa;

    font-size:
        15px;

    font-weight:
        600;

    line-height:
        normal;

    white-space:
        nowrap;

    text-decoration:
        none;
}


.dl-global-nav a::after {
    content:
        "";

    position:
        absolute;

    left:
        0;

    right:
        0;

    bottom:
        -20px;

    height:
        2px;

    background:
        #009cff;

    transform:
        scaleX(0);

    transition:
        transform .22s ease;
}


.dl-global-nav a:hover::after,
.dl-global-nav a.active::after {
    transform:
        scaleX(1);
}


.dl-global-nav a:hover,
.dl-global-nav a.active {
    color:
        #009cff;
}


.dl-global-remote-button {
    height:
        52px;

    flex-shrink:
        0;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        12px;

    padding:
        0 24px;

    border-radius:
        7px;

    color:
        #ffffff;

    background:
        linear-gradient(
            135deg,
            #008ff0,
            #00b4ff
        );

    font-size:
        16px;

    font-weight:
        800;

    line-height:
        normal;

    white-space:
        nowrap;

    text-decoration:
        none;

    box-shadow:
        0 15px 40px
        rgba(0, 156, 255, .22);

    transition:
        transform .2s ease,
        box-shadow .2s ease;
}


.dl-global-remote-button:hover {
    color:
        #ffffff;

    transform:
        translateY(-2px);

    box-shadow:
        0 20px 45px
        rgba(0, 156, 255, .30);
}


.dl-global-remote-button svg {
    width:
        24px;

    height:
        24px;

    flex:
        0 0 24px;

    fill:
        none;

    stroke:
        currentColor;

    stroke-width:
        1.8;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


/* =========================================================
   RESPONSIVE - IDENTICO ALLA HOME
   ========================================================= */

@media (max-width: 1250px) {

    .dl-global-shell {
        width:
            min(
                calc(100% - 44px),
                1460px
            );
    }

    .dl-global-nav {
        gap:
            20px;
    }

    .dl-global-nav a {
        font-size:
            13px;
    }

    .dl-global-brand {
        min-width:
            240px;
    }

    .dl-global-brand-main {
        font-size:
            34px;
    }

}


@media (max-width: 1050px) {

    .dl-global-nav {
        display:
            none;
    }

    .dl-global-nav-shell {
        justify-content:
            space-between;
    }

}


@media (max-width: 700px) {

    .dl-global-shell {
        width:
            calc(100% - 28px);
    }

    .dl-global-header {
        position:
            relative;
    }

    .dl-global-nav-shell {
        min-height:
            72px;
    }

    .dl-global-brand {
        min-width:
            0;
    }

    .dl-global-brand-main {
        font-size:
            27px;
    }

    .dl-global-brand-sub {
        display:
            none;
    }

    .dl-global-remote-button {
        height:
            43px;

        padding:
            0 13px;

        font-size:
            11px;
    }

    .dl-global-remote-button svg {
        width:
            19px;

        height:
            19px;

        flex-basis:
            19px;
    }

}