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

@media(min-width:901px){

    .header .nav-links{
        display:flex !important;
        position:static !important;
        opacity:1 !important;
        visibility:visible !important;
        transform:none !important;
    }

    .header .menu-btn{
        display:none !important;
    }

}


/* ==========================
   MOBILE
   ========================== */

@media(max-width:900px){

    .header{
        position:sticky !important;
        top:0 !important;
        z-index:9999 !important;

        background:#050505 !important;
    }

    .header .nav{
        position:relative !important;

        min-height:58px !important;

        display:flex !important;
        align-items:center !important;

        flex-wrap:nowrap !important;

        gap:8px !important;
    }

    /* logo plus compact */
    .header .brand{
        flex:1 1 auto !important;
        min-width:0 !important;
    }

    .header .brand-logo{
        height:40px !important;
        width:auto !important;
    }

    .header .brand-copy{
        display:none !important;
    }

    /* on enlève les éléments qui provoquent le débordement */
    .header .lang-switch,
    .header .nav-cta{
        display:none !important;
    }

    .header .nav-actions{
        margin-left:auto !important;

        display:flex !important;
        align-items:center !important;

        flex:0 0 auto !important;
    }

    /* hamburger */
    .header .menu-btn{
        display:flex !important;

        width:40px !important;
        height:40px !important;

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

        padding:0 !important;
        margin:0 !important;

        border:1px solid rgba(255,255,255,.14) !important;
        border-radius:8px !important;

        background:#0c1015 !important;

        color:#fff !important;

        font-size:22px !important;
        line-height:1 !important;

        cursor:pointer !important;
    }

    /* menu fermé */
    .header .nav-links{
        display:none !important;

        position:absolute !important;

        top:calc(100% + 1px) !important;
        left:0 !important;
        right:0 !important;

        width:100% !important;

        margin:0 !important;
        padding:14px !important;

        flex-direction:column !important;
        align-items:stretch !important;

        gap:3px !important;

        background:rgba(5,5,5,.985) !important;

        border-top:1px solid rgba(255,255,255,.07) !important;
        border-bottom:1px solid rgba(255,255,255,.10) !important;

        box-shadow:
            0 20px 40px rgba(0,0,0,.45) !important;

        z-index:10000 !important;
    }

    /* menu ouvert */
    .header .nav-links.mps-mobile-open{
        display:flex !important;
    }

    .header .nav-links > a{
        display:flex !important;

        width:100% !important;

        align-items:center !important;

        padding:12px 13px !important;

        margin:0 !important;

        border-radius:7px !important;

        color:#d5dce4 !important;

        font-size:14px !important;
        font-weight:500 !important;

        white-space:normal !important;

        background:transparent !important;
    }

    .header .nav-links > a:hover,
    .header .nav-links > a[aria-current="page"]{
        background:#101720 !important;
        color:#fff !important;
    }

    /* devis ajouté dans le menu mobile */
    .header .nav-links .mps-mobile-devis{
        margin-top:9px !important;

        justify-content:center !important;

        background:#2563eb !important;

        color:#fff !important;

        border:1px solid #3b82f6 !important;

        font-weight:650 !important;
    }

}