@media screen and (min-width:768px) and (max-width:1219px) {
    header p {
        display: none;
    }

    header img {
        width: 50px;
    }

    .cabecalho {
        display: flex;
        flex-wrap: wrap;
        padding: 25px;
    }
}

@media screen and (min-width:360px) and (max-width:767px) {

    #btn-mobile {
        display: block;
        font-size: 25px;
        background-color: var(--laranja-claro);
        border: none;
        gap: 10px;
        color: #fff;
    }

    #menu {
        display: none;
    }

    #nav.active #menu {
        display: block;

    }

    header p,
    header img {
        display: none;
    }

    .cabecalho {
        justify-content: flex-start;
        padding: 15px;
        position: relative;
        z-index: 0;
    }

    .menu-item {
        display: block;
        font-size: 18px;
        padding: 5px 0 5px 15px;
    }


    footer {
        display: flex;
        flex-direction: column;
    }

    footer .sociais,
    footer .ajuda {
        text-align: center;
        padding-top: 50px;
    }
}