.page-overlay {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100%;
	background: var(--global-colors-black);
	z-index: var(--global-z-index-overlay);
	opacity: 0;
	pointer-events: none;

	transition: 0.3s opacity ease-out;
}

body.page-overlay-shown {
	.page-overlay {
		opacity: 0.6;
		pointer-events: auto;

		@supports (mix-blend-mode: multiply) {
			mix-blend-mode: multiply;
		}
	}
}