/**
 * PW Motion — scena holograficznego globusa (klasa pw-globe3d).
 *
 * Kontener jest kwadratowy i sam w sobie nic nie rysuje: płótno dokłada
 * skrypt pw-globe3d.js. Gdy JavaScript nie zadziała, zostaje sama poświata
 * z tła, więc sekcja nie robi się pusta.
 *
 * Rysunek ma leżeć w tle, a nie stanąć na pierwszym planie — stąd obniżone
 * krycie całej sceny i miękka poświata wygaszana daleko przed krawędzią.
 */
.pw-globe3d {
	position: relative;
	width: 100%;
	max-width: 560px;
	margin-inline: auto;
	aspect-ratio: 1 / 1;
	isolation: isolate;
	opacity: 0.85;
}

.pw-globe3d::before {
	content: "";
	position: absolute;
	inset: 4%;
	z-index: -1;
	border-radius: 50%;
	background: radial-gradient(
		circle at 50% 50%,
		rgba( 94, 200, 255, 0.10 ) 0%,
		rgba( 94, 200, 255, 0.03 ) 46%,
		rgba( 94, 200, 255, 0 ) 70%
	);
	pointer-events: none;
}

.pw-globe3d-canvas {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
	pointer-events: none;
}

@media ( max-width: 767px ) {
	.pw-globe3d {
		max-width: 340px;
	}
}
