SVG Clip-path inverter

Question

I'm currently trying the invert the selection of a clip-path.

Basically, i have a body with a background image, a black div on top of that, and I'd like to 'cut holes' inside the div to see the body's background through it. I can't interact with the background since, it's for another purpose than being displayed on webpage.

I've tried some stuff with mask but was unable to get close to something I want. I also tried some stuff with div being able to 'cut hole' through another div as a tunnel. (this would be the easiest way of doing it for the final project)

So ii switch to using clip-path, but i can see the whole background and just a small part is hidden by the black div:

body {
  width: 100vw;
  height: 100vh;
  border: none;
  margin: 0px;
  overflow: hidden;
  background: url("https://images.unsplash.com/photo-1553949345-eb786bb3f7ba?auto=format&fit=crop&q=80&w=2070&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D");
}

.container {
  background-color: #000000;
  width: auto;
  height: auto;
  min-width: 100vw;
  min-height: 100vh;
  clip-path: url(#hole1);
}

#hole1 {
  position: absolute;
  /* transform: translate(50px,50px) rotate(45deg); */
}

<div class="container"></div>

<svg width="0" height="0">
  <defs>
    <clipPath id="hole1" clipPathUnits='objectBoundingBox'>
      <circle cx="0.1" cy="0.1" r="0.05" />
    </clipPath>
  </defs>
</svg>

Is there a way to invert a clip-path ?