Add SVG image after page-hero.

I am trying to add the divider for the hero image on the homepage of Vinyasa by Mike Oliver.

After looking into it I realized it is a SVG file which I have never worked with.

I tried following the directions at https://generatepress.com/forums/topic/how-can-i-add-a-header-image-with-a-diagonally-cut-off-bottom/ but I am trying to make something round.

I also tried the following but nothing is showing.

.page-hero {
position: relative;
overflow: hidden;
}

page-hero:after {
content: "";
position: absolute;
bottom: 0;
width: 100%;
height: 100px;
background: url(curved-bottom.svg);
}

Any suggestions or other threads I'm not seeing?