Как сделать такую css маску

<svg version="1.1" xmlns="http://www.w3.org/2000/svg"  
    xmlns:xlink="http://www.w3.org/1999/xlink" 
       width="100%" height="100%" viewBox="0 0 961 208" preserveAspectRatio="xMinYMin meet" >   
  <defs> 
  <mask id="svgMask"> 
  <rect width="100%" height="100%" fill="white"  />   
  <path d="M0 103.1 0 1.4l959.9 0z" fill="black" /> 
  </mask> 
  </defs> 
   <rect width="100%" height="100%" fill="black" stroke="white" stroke-width="4" mask="url(#svgMask)" />   
    <text x="350" y="150" font-size="24px" font-family="sans-serif" fill="white" >We provide you everything</text> 
</svg>	 

* { 
  margin: 0; 
  padding: 0; 
  max-width: 100%; 
} 
 
header { 
  display: flex; 
  align-items: flex-end; 
  justify-content: center; 
  width: 100vw; 
  height: 40vw; 
  background: linear-gradient(-10deg, #000 0, #000 50%, transparent 50%, transparent 100%); 
} 
 
p { 
  padding-bottom: 5vw; 
  color: #fff; 
  font-size: 2vw; 
}

<header> 
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Possimus, aliquid.</p> 
</header>