.portfolio {
    margin-bottom: 130px;
    margin-top: 30px;
}

.portfolio-controls__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    margin-top: 30px;
}

.portfolio-items {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 20px;
}

.product-item__btn button {height: 80px;}

.product-item__btn img {max-width: 12px;}

@media (max-width: 768px) {
    .portfolio {
        margin: 15px 0 80px 0;
    }
    
    .portfolio-items {
        grid-template-columns: 1fr
    }

    .product-item img {
        height: 220px;
    }

    .portfolio-controls__grid {        
        display: flex;
    }

    .portfolio__slider button {
        margin-top: 40px;
    }

    .product-item__btn {
        gap: 30px;
        padding: 0 30px 30px 30px;
    }
}

@media (max-width: 576px) {
    .product-item img {
        height: 160px;
    }


    .portfolio__slider button {
        margin-top: 30px;
        height: 70px;
    }

    .portfolio {
        margin: 15px 0 60px 0;
    }

    .product-item__btn {
        gap: 30px;
        padding: 0 25px 30px 25px;
    }
}