Material UI Card – skewed background

I’ve been trying to make a Material UI Card component that would get, among others, color props and have the background skewed as in the picture.

Now, I know that I can give the main Card component a style with gradient background and then rotate that gradient, but I feel that I have little control over the actual shape of the slice. To be specific, I want to be able to control the left upper point of the lower slice so that it always stays above the button (ie the button stays in the gray area), even when the component gets wider (it should be responsive). How can I achieve that?

enter image description here