/* --- ULTIMATE 4-COLUMN GRID FIX --- */
@media (min-width: 992px) {
    /* Target the container that holds the products */
    #order-premium_comparison .price-table-container .row {
        display: grid !important;
        grid-template-columns: repeat(4, 1fr) !important; /* Forces 4 equal columns */
        grid-gap: 15px !important;
        width: 100% !important;
    }

    /* Neutralize the old Bootstrap column behavior */
    #order-premium_comparison .price-table-container [class*="col-sm-"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        padding: 0 !important;
        margin: 0 !important;
        float: none !important;
    }

    /* Remove Bootstrap's 'clear' fix that forces a new row after the 3rd item */
    #order-premium_comparison .price-table-container .row::before,
    #order-premium_comparison .price-table-container .row::after {
        display: none !important;
    }
}

/* Make sure all boxes look even height-wise */
#order-premium_comparison .price-table .top-section {
    min-height: 260px !important;
}

