How to remove filter svg inheritance for child elements?

Question

css

I'm trying to make "torn" edges of a block using filter svg. But it applies the same to all child elements.
Example: https://codepen.io/aleksandr2/pen/bGoGEbG

How to make text without this filter?

Answer 1

.combined {
  position: relative;
  padding: 50px;
  width: 400px;
  z-index: 0;
}

.combined::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ccc;
  border-radius: 7px;
  filter: url(#combined);
  z-index: -1;
}