/**
 * PW Motion — sceny w tle sekcji hero na podstronach ofertowych (klasa pw-scene).
 *
 * Sam rysunek powstaje w JavaScripcie; druga klasa na sekcji wybiera scenę.
 * Tutaj jest miejsce dla płótna, pewność, że treść leży nad nim, i siła
 * każdej sceny z osobna.
 */

/* Kontenery Elementora czytają położenie i przycinanie ze zmiennych, więc same
   właściwości bywają przebite przez arkusz układu — stąd oba zapisy. */
.pw-scene {
	overflow: hidden;
	--overflow: hidden;
}

.pw-scene-canvas {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 0;
	opacity: var(--pw-scene-alpha, 1);
}

/* Treść sekcji zawsze nad sceną. */
.pw-scene > .e-con,
.pw-scene > .elementor-element {
	position: relative;
	z-index: 1;
}

/* Siła poszczególnych scen. Każda ma własny wiersz, żeby dało się wyciszyć
   albo podbić jedną z nich, nie ruszając pozostałych. */
.pw-scene-build {
	--pw-scene-alpha: 1;
}

.pw-scene-map {
	--pw-scene-alpha: 1;
}

.pw-scene-funnel {
	--pw-scene-alpha: 1;
}

.pw-scene-swap {
	--pw-scene-alpha: 1;
}

.pw-scene-pulse {
	--pw-scene-alpha: 1;
}

.pw-scene-rank {
	--pw-scene-alpha: 1;
}

.pw-scene-read {
	--pw-scene-alpha: 1;
}

/* Na wąskim ekranie tekst zajmuje całą szerokość, więc scena schodzi z jasnością
   — ma zostać detalem w rogu, a nie konkurencją dla nagłówka. Reguła stoi po
   wierszach poszczególnych scen, więc obowiązuje je wszystkie. */
@media (max-width: 900px) {
	.pw-scene {
		--pw-scene-alpha: 0.45;
	}
}
