Ok – remove the CSS i provided above.
Edit your Header Element and after the text add this:
<div class="shape-divider-bottom">
<svg width="100%" height="100%" viewBox="0 0 10584 834" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
<g transform="matrix(4.16667,0,0,4.16667,0,0)">
<g transform="matrix(1,0,0,0.83,0,34)">
<path d="M2540,0L1270,138.554L0,0L0,200L2540,200L2540,0Z" style="fill:white;"/>
</g>
</g>
</svg>
</div>
Then add this CSS to the site:
.page-hero {
position: relative;
}
.page-hero .shape-divider-bottom svg {
vertical-align: bottom;
}
.page-hero .shape-divider-bottom {
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
}