To use the curved mask, you will need both the CSS in this component and the HTML component below it. The HTML component holds the SVGs that will be used as a clipping mask for the hero section, while the CSS pulls the ID of the SVGs to use its path as a clipping mask using"-webkit-clip-path: url(#hero-mask-svg);". This section is hidden so it is only visible in the editor mode, but the HTML component needs to be visible or the SVG will not display. You will need to add the class "hero-mask-container" to your hero section.
(This is a temporary workaround until an option is available in AEM)