/* ===============================
   RESPONSIVO - MENU CORRIGIDO
================================= */

/* hi-res laptops and desktops */
@media screen and (max-width:1280px) {}

/* tablets */
@media screen and (max-width:1024px) {}


/* ===============================
   MENU MOBILE
================================= */
@media screen and (max-width:960px) {

    /* Botão hamburguer visível */
    #btn-menu{
        display:block !important;
    }

    .header-fixed #btn-up{
        display:block !important;
    }

    /* Centraliza logo */
    #main-logo{
        margin:0 auto;
    }

    /* Menu fechado por padrão */
    #main-menu{
        width:200px !important;
        height:auto !important;
        padding:5px !important;
        left:0 !important;
        top:55px !important;
        background-color:#FFF;
        box-shadow:0 2px 3px rgba(0,0,0,0.5);
        display:none;
    }

    /* 🔥 Estado aberto do menu */
    #main-menu.mm-clicked{
        display:block !important;
    }

    #main-menu li{
        width:auto !important;
        height:35px !important;
        float:none !important;
    }

    #main-menu li a{
        width:auto !important;
        height:35px !important;
        line-height:35px !important;
        display:block !important;
        color:#1661CE;
        text-shadow:none !important;
    }

    #header{
    position: relative;
    z-index: 99999 !important;
    }

}


/* ===============================
   TABLETS MENORES
================================= */
@media screen and (max-width:800px) {


    .rightmenu .colleft{
        right:0 !important;
    }

    .rightmenu .col1{
        left:0 !important;
        width:100% !important;
        float:none !important;
    }

    .rightmenu .col2{
        left:0 !important;
        width:100% !important;
        float:none !important;
        margin:30px 0 0 0 !important; /* remove o -55px */
        box-shadow:none !important;
    }
	
    .colmask,
    .colleft,
    .colright,
    .colmid{
        float:none !important;
        position:static !important;
        right:auto !important;
        left:auto !important;
        width:100% !important;
    }

    .col1,
    .col2,
    .col3{
        float:none !important;
        position:static !important;
        right:auto !important;
        left:auto !important;
        width:100% !important;
        margin:0 0 25px 0 !important;
    }

    .rightmenu .col2{
        margin-top:25px !important;
        box-shadow:none !important;
    }


}


/* ===============================
   SMARTPHONES
================================= */
@media screen and (max-width:640px) {

    #header #main-logo #ml-top{
        display:none !important;
    }

    #header #main-logo img{
        margin-top:0 !important;
    }

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

    #footer-warp{
        flex-direction:column;
        gap:10px;
    }

}

}


/* ===============================
   MUITO PEQUENOS
================================= */
@media screen and (max-width:320px) {

    .hw-btn{
        width:30px !important;
        height:30px !important;
        top:20px !important;
        line-height:28px !important;
        font-size:22px !important;
    }

    #main-menu{
        top:65px !important;
    }

}
