@media (max-width: 1200px) {
    .container{
        max-width: 960px;
    }

    .nav__burger{
        display: block;
        order: 1;
    }


    
    .menu{
        position: absolute;
        right: 20px;
        top: 100%;
        background: white;
        border: 1px solid #e5e5e5;
        flex-direction: column;
        min-width: 200px;
        gap: 0;
        visibility: hidden;
    }

    .footer__title{
        font-size: 21px;
    }

    .nav__burger:focus ~ .menu{
        visibility: visible;
    }

    .menu > li{
        padding: 12px;
        width: 100%;
        border-bottom: 1px solid #e5e5e5;
    }
}

@media (max-width: 992px) {
    .container{
        max-width: 720px;
    }

    .ecom__content , .custom__content , .footer__content{
        flex-wrap: wrap;
        gap: 40px;
        justify-content: space-around;
    }

    .footer__title{
        margin-bottom: 15px;
    }

    .custom__title{
        margin-top: 20px;
    }

}

@media (max-width: 768px) {
    .container{
        max-width: 540px;
    }

    .ecom__card , .custom__card , .footer__card{
        max-width: 235px;
        width: 100%;
    }
}

@media (max-width: 576px) {
    .nav__logo{
        width: 100%;
        margin-bottom: 20px;
        text-align: center;
    }

    .header__content{
        padding-top:20px;
        padding-bottom: 20px;
    }

    .header__title, .info__title, .coll__title{
        text-align: center;
        font-size: 40px;
    }

        .ecom__card , .custom__card , .footer__card{
        max-width: 255px;
        width: 100%;
    }

    .coll{
        text-align: center;
    }

    .search__input{
        max-width: 150px;
        width: 100%;
    }

}