如何扩展剪切路径以包含可变内容？

Question

我被要求创建一个网站页面，每个垂直块都有一个像顶部和底部形状的正弦波。

然而，在这种情况下，块有背景图像或视频，内容会有所不同。因此，该块将需要是具有形状顶部和底部边缘的单个元素。我对多元素解决方案持开放态度。

想法将不胜感激。

看下面的设计

之前我已经实现了类似的使用伪元素将剪辑块添加到元素的顶部和底部（“之前”和“之后”），这与纯色背景一起使用。