How to Auto Change "Purchase" button on Product Block for Sold Out Product

I use product blocks throughout my art website. I don't like the individual product pages as each product typically has other products that specifically pertain to it and so it was just easier to use blocks.

I need a css code for the "add to cart" button of the product block to just automatically be replaced with "SOLD OUT" if the item quantity falls to zero as by default, even if an item is sold, it's "purchase" button still says "purchase" until you click the button and then a pop out informs you that it's sold out.

The test webpage that I'm referring to is: https://www.pashapashanewyork.com/new-page-2

Right now it does this:

And I want it to look like this:

Can anyone help please!? ❤️

bump!