Using CSS, how can I remove a Woocommerce grid from a specific page that has ::before & ::after inserted in it

Everything between the before and after needs to go

The specific page ID is 6329

I have tried different variations of the CSS below, but still can’t get it to work!

CSS used:

.page-id-6329 .products.columns-3 {
display: none !important;
}

and other variations on the same lines with no success. I think it has to do with the ::before and ::after, but have no idea how to write the CSS.

I am setting up a website that caters for retail and wholesale. The retail will show the normal category grid to the user, while the wholesale will have a special page where a list of products shown in a table.
The wholesale page, as it is now, shows the category grid AND the table underneath. I just need to get the grid to disappear for that particular page.

Any help will be appreciated.
Thanks