/* Fundo do login (módulo LoginHero). A camada fica atrás de todo o conteúdo e nunca recebe clique. */
.ative-login-hero {
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	/* Fallback estático (movimento reduzido / sem WebGL): brilho roxo e azul suave. */
	background:
		radial-gradient(ellipse 60% 50% at 20% 30%, rgba(0, 123, 255, .14) 0%, rgba(3, 12, 37, 0) 70%),
		radial-gradient(ellipse 55% 45% at 80% 70%, rgba(184, 4, 255, .12) 0%, rgba(3, 12, 37, 0) 70%);
}

.ative-login-hero canvas {
	display: block;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity 1.4s cubic-bezier(.22, 1, .36, 1); /* ease-out: o ambiente entra devagar */
}

.ative-login-hero canvas.is-visible {
	opacity: 1;
}

/* Com o fundo ativo, as faixas de página ficam transparentes para as partículas aparecerem atrás do cartão. */
body.ative-login-hero-ativo .elementor-location-header .e-con,
body.ative-login-hero-ativo [data-elementor-type="wp-page"] > .e-con:not(.ative-card) {
	background-color: transparent !important;
}

@media (prefers-reduced-motion: reduce) {
	.ative-login-hero canvas {
		display: none;
	}
}