/* Preserva o visual; efeitos fora da tela não precisam renderizar. */
.t3a-motion-paused,
.t3a-motion-paused *,
.t3a-motion-paused::before,
.t3a-motion-paused::after,
.t3a-motion-paused *::before,
.t3a-motion-paused *::after,
html.t3a-page-hidden *,
html.t3a-page-hidden *::before,
html.t3a-page-hidden *::after {
  animation-play-state: paused !important;
}
@media (prefers-reduced-motion: reduce) {
  .t3a-hero-spot { display: none !important; }
  .t3a-hero-blob, .t3a-city-layer, .t3a-avenue-skyline { transform: none !important; }
  .t3a-avenue-street { --ax: 0px !important; }
}

/* ── Rolagem sem repintura (29/09/2026) ──────────────────────────────────
   Medido com Playwright + trace: o travamento do scroll no desktop vinha de
   três efeitos que forçavam repintura a cada frame (RasterTask dominante):
   1. borda giratória do card de número animando uma custom property o tempo
      todo, mesmo invisível (só aparece no hover);
   2. brilho pulsante animando text-shadow;
   3. manchas de luz com filter: blur(80px) em áreas de até 500px.
   O visual é o mesmo; muda só como é desenhado. */

/* 1. a borda só gira quando aparece: pausada fora do hover (animação pausada
      não repinta e não reinicia o ângulo no fade de saída) */
.t3a-stat-card::before { animation-play-state: paused; }
.t3a-stat-card:hover::before { animation-play-state: running; }

/* 2. brilho fixo no meio do ciclo antigo; o pulso vira opacidade (GPU) */
.t3a-glow,
#feature-sec .feature-card .box-icon {
  text-shadow: 0 0 12px rgba(75,196,242,0.55), 0 0 30px rgba(75,196,242,0.22);
  animation: t3a-glow-soft 3s ease-in-out infinite;
}
@keyframes t3a-glow-soft { 0%, 100% { opacity: .92; } 50% { opacity: 1; } }

/* 3. mancha desfocada desenhada com gradiente radial (sem filter).
      O blur(80px) espalhava ~80px além da borda: o elemento cresce 160px e a
      margem negativa mantém o centro no mesmo lugar. */
.t3a-hero-blob,
.t3a-stat-card__orb { filter: none; }
.t3a-hero-blob--1 { width: 660px; height: 660px; margin: -80px; background: radial-gradient(circle closest-side, rgba(75,196,242,1) 0%, rgba(75,196,242,0.97) 18%, rgba(75,196,242,0.85) 32%, rgba(75,196,242,0.62) 46%, rgba(75,196,242,0.36) 60%, rgba(75,196,242,0.16) 74%, rgba(75,196,242,0.05) 87%, rgba(75,196,242,0) 100%); }
.t3a-hero-blob--2 { width: 560px; height: 560px; margin: -80px; background: radial-gradient(circle closest-side, rgba(30,75,143,1) 0%, rgba(30,75,143,0.97) 18%, rgba(30,75,143,0.85) 32%, rgba(30,75,143,0.62) 46%, rgba(30,75,143,0.36) 60%, rgba(30,75,143,0.16) 74%, rgba(30,75,143,0.05) 87%, rgba(30,75,143,0) 100%); }
.t3a-hero-blob--3 { width: 460px; height: 460px; margin: -80px; background: radial-gradient(circle closest-side, rgba(75,196,242,1) 0%, rgba(75,196,242,0.97) 18%, rgba(75,196,242,0.85) 32%, rgba(75,196,242,0.62) 46%, rgba(75,196,242,0.36) 60%, rgba(75,196,242,0.16) 74%, rgba(75,196,242,0.05) 87%, rgba(75,196,242,0) 100%); }
.t3a-stat-card__orb--1 { width: 440px; height: 440px; margin: -80px; background: radial-gradient(circle closest-side, rgba(75,196,242,1) 0%, rgba(75,196,242,0.97) 18%, rgba(75,196,242,0.85) 32%, rgba(75,196,242,0.62) 46%, rgba(75,196,242,0.36) 60%, rgba(75,196,242,0.16) 74%, rgba(75,196,242,0.05) 87%, rgba(75,196,242,0) 100%); }
.t3a-stat-card__orb--2 { width: 340px; height: 340px; margin: -80px; background: radial-gradient(circle closest-side, rgba(30,75,143,1) 0%, rgba(30,75,143,0.97) 18%, rgba(30,75,143,0.85) 32%, rgba(30,75,143,0.62) 46%, rgba(30,75,143,0.36) 60%, rgba(30,75,143,0.16) 74%, rgba(30,75,143,0.05) 87%, rgba(30,75,143,0) 100%); }

/* 4. entrada dos cards do Impacto: opacidade + posição em camada própria da
      GPU; sem isso a seção inteira repintava a cada frame da cascata. */
#feature-sec.fx-prep .feature-card,
#feature-sec.fx-prep .t3a-counter-grid { will-change: transform, opacity; }
