.footer-mask {
    --page-bg: #ffffff;          
    position: relative; 
    background:#f8fafc;
  }
  .footer-mask::before{
    content:"";
    position:absolute; 
    left:0; 
    right:0; 
    top:-48px; 
    height:64px;
    background: var(--page-bg);
    -webkit-mask: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 200' preserveAspectRatio='none'>\
    <path d='M0,120 C150,60 300,0 600,60 C900,120 1050,60 1200,0 L1200,200 L0,200 Z' fill='black'/>\
  </svg>") center/100% 100% no-repeat;
    mask: url("data:image/svg+xml;utf8,\
  <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 200' preserveAspectRatio='none'>\
    <path d='M0,120 C150,60 300,0 600,60 C900,120 1050,60 1200,0 L1200,200 L0,200 Z' fill='black'/>\
  </svg>") center/100% 100% no-repeat;
  }