/* ===========================================
   OCTOPUS HEADER
=========================================== */

#octopusHeader{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:9999;
    background:#0a0a0a99;
    transition:
        background-color .35s ease,
        box-shadow .35s ease,
        padding .35s ease;
}

/* Inner boxed container */
#octopusHeader .header-inner{
    width:100%;
    max-width:1280px;
    margin:0 auto;

    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:18px 20px;

    transition:padding .35s ease;
}

/* Sticky state */
#octopusHeader.scrolled{
    background:#111111;
    box-shadow:0 8px 25px rgba(0,0,0,.30);
}
#octopusHeader.scrolled .header-inner{
    padding:10px 20px;
}

.header-logo img{
    width:220px;
    transition:width .35s ease;
}

#octopusHeader.scrolled .header-logo img{
    width:190px;
}
#octopusHeader .hfe-menu-item{
    transition:color .3s ease;
}

/* Prevent content hiding under fixed header */
/*
body{
    padding-top:95px;
}
*/

/* ===========================================
   MOBILE MENU
=========================================== */
@media (max-width:1025px){

    .hfe-dropdown{
        position:fixed !important;
        top:0 !important;
        left:0 !important;
        width:100vw !important;
        height:100vh !important;
        background:#111111 !important;
        display:flex !important;
        justify-content:center !important;
        align-items:center !important;
        z-index:999999;
    }

    .hfe-dropdown > ul{
        width:auto !important;
        display:flex !important;
        flex-direction:column !important;
        justify-content:center !important;
        align-items:center !important;
        gap:32px;
        margin:0 auto !important;
        padding:0 !important;
    }

    .hfe-dropdown li{
        width:auto !important;
        border:none !important;
        text-align:center !important;
    }

    .hfe-dropdown a{
        display:block;
        font-size:32px !important;
        font-weight:600;
        background-color: #111111 !important;
        color:#fff !important;
        padding:0 !important;
        text-align:center !important;
    }

    .hfe-dropdown a:hover{
        color:#D42025 !important;
    }
}

@media (max-width:1025px){

    /* Keep the toggle button above the overlay */
    .hfe-nav-menu__toggle{
        position:fixed !important;
        top:20px;
        right:20px;
        z-index:1000001 !important;
        color:#fff !important;
    }

    .hfe-nav-menu-icon svg{
        width:28px;
        height:28px;
        fill:#fff;
    }
}