.factory-grid {
    display         : grid;
    gap             : 20px;
    list-style      : none;
    padding         : 0;
    margin          : 0 auto;
    grid-auto-rows  : auto;   
    width           : 100%;
}

.factory-grid li {
    display: block;
}

@media (max-width: 767px) {
    .factory-grid {
        grid-template-columns: repeat(1, 1fr);
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .factory-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .factory-grid {
        grid-template-columns: repeat(4, 1fr);
        max-width: 1400px;
    }
}

.factory-card {
    background      : #fff;
    border-radius   : 10px;
    box-shadow      : 0 4px 12px rgba(0,0,0,0.08);
    padding         : 12px;
    transition      : transform .2s, box-shadow .2s;
    text-align      : center;
    height          : 100%; 
}

.factory-card:hover {
    transform   : translateY(-5px);
    box-shadow  : 0 6px 16px rgba(0,0,0,0.12);
}

.factory-card img.thumbnail {
    width           : 100%;
    height          : auto;
    border-radius   : 8px;
    object-fit      : cover;
}

.factory-card h6 {
    margin-top  : 10px;
    font-weight : 600;
    color       : #333;
    font-size   : 16px;
}