Создайте «дыру» в HTML-элементах без режима смешивания: облегчить? ⇐ Html

[Anonymous]

Ссылка на скрипт: https://jsfiddle.net/qz1frsp3/
Я использую mix-blend-mode: Lighten в контейнере, который оборачивает дочерний элемент сплошным черным фоном. Это создает эффект «дырокола», который выглядит так, как будто он прорезает контейнер, обнажая фон тела внизу.
Проблема в том, что режим смешивания-наложения: Lighten очевидно не ограничивается только цветом фона элемента. Он влияет на все внутри элемента и, следовательно, делает все темное прозрачным.
Есть ли способ обойти эту проблему, например, исключить элементы из режима смешивания-наложения или альтернативное решение для достижения эффекта «дырка» без использования режимов наложения?

Подробнее здесь: https://stackoverflow.com/questions/798 ... de-lighten