/* AURORA · FUNDO DEGRADÊ ANIMADO (compartilhado) — v0.62.0
   Substitui as imagens bg1/bg2/bg3.webp por gradientes CSS que se movem devagar e mudam levemente de formato.
   Sem imagem: zero requisição, nada a trocar no WordPress.

   COMO FUNCIONA
   - Cada mancha é um radial-gradient cujo centro e raios são propriedades registradas (@property, <percentage>) animadas
     por @keyframes. Três animações de durações diferentes (34 s, 46 s e 40 s) evitam um ciclo visível.
   - Variantes (definidas em todo .uos-x): --uos-aurora-tr (laranja no canto superior direito, como o antigo bg1),
     --uos-aurora-bl (canto inferior esquerdo, como o antigo bg3) e --uos-aurora-both (os dois, como o antigo bg2).
   - Grão fino (--uos-aurora-grain) em mistura "soft-light": só aparece sobre a cor, como no arquivo original.
   - Movimento: --uos-aurora-motion. É "none" com prefers-reduced-motion. O JS do tema pausa a animação fora da tela
     (classe .is-aurora-idle).

   COMO USAR EM UM CONTAINER (no CSS da página; o véu é opcional, para dar contraste ao texto, p.ex. rgba(255,255,255,.55)):
     .minha-secao {
       --minha-veil: rgba(255, 255, 255, 0);
       background: linear-gradient(var(--minha-veil), var(--minha-veil)), var(--uos-aurora-grain), var(--uos-aurora-bl), var(--uos-sec-bg);
       background-blend-mode: normal, soft-light, normal;
       animation: var(--uos-aurora-motion);
     }
   Lista de mistura por variante: bl = normal, soft-light, normal; tr = normal, soft-light, normal, normal; both = mais um normal.
   AJUSTES RÁPIDOS: cores nas variáveis --uos-aur-c1/c2/c3; intensidade em --uos-aur-k (0 a 1); grão desligado com
   --uos-aurora-grain: none. */

@property --aur-x1  { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --aur-y1  { syntax: "<percentage>"; inherits: false; initial-value: -8%; }
@property --aur-rx1 { syntax: "<percentage>"; inherits: false; initial-value: 70%; }
@property --aur-ry1 { syntax: "<percentage>"; inherits: false; initial-value: 72%; }
@property --aur-x2  { syntax: "<percentage>"; inherits: false; initial-value: 100%; }
@property --aur-y2  { syntax: "<percentage>"; inherits: false; initial-value: 34%; }
@property --aur-rx2 { syntax: "<percentage>"; inherits: false; initial-value: 24%; }
@property --aur-ry2 { syntax: "<percentage>"; inherits: false; initial-value: 34%; }
@property --aur-x3  { syntax: "<percentage>"; inherits: false; initial-value: -4%; }
@property --aur-y3  { syntax: "<percentage>"; inherits: false; initial-value: 106%; }
@property --aur-rx3 { syntax: "<percentage>"; inherits: false; initial-value: 40%; }
@property --aur-ry3 { syntax: "<percentage>"; inherits: false; initial-value: 95%; }

.uos-x {
  /* Cores medidas nos arquivos bg1/bg3 originais: laranja #EC7D4C, coral #F47D59, laranja escuro (canto inferior) #D97137. */
  --uos-aur-c1: 236 125 76;
  --uos-aur-c2: 244 118 82;
  --uos-aur-c3: 217 113 55;
  --uos-aur-k: 1;

  --uos-aurora-motion:
    uos-aur-a 34s ease-in-out infinite alternate,
    uos-aur-b 46s ease-in-out infinite alternate,
    uos-aur-c 40s ease-in-out infinite alternate;

  --uos-aurora-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='.85 .85 .85 0 -.775 .85 .85 .85 0 -.775 .85 .85 .85 0 -.775 0 0 0 0 1'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");

  /* Mancha superior direita (antigo bg1): massa laranja + faixa coral que ondula por baixo. */
  --uos-aurora-tr:
    radial-gradient(ellipse var(--aur-rx2) var(--aur-ry2) at var(--aur-x2) var(--aur-y2),
      rgb(var(--uos-aur-c2) / calc(.62 * var(--uos-aur-k))) 0%,
      rgb(var(--uos-aur-c2) / calc(.34 * var(--uos-aur-k))) 50%,
      rgb(var(--uos-aur-c2) / 0) 100%),
    radial-gradient(ellipse var(--aur-rx1) var(--aur-ry1) at var(--aur-x1) var(--aur-y1),
      rgb(var(--uos-aur-c1) / calc(.97 * var(--uos-aur-k))) 0%,
      rgb(var(--uos-aur-c1) / calc(.95 * var(--uos-aur-k))) 48%,
      rgb(245 140 100 / calc(.74 * var(--uos-aur-k))) 64%,
      rgb(249 170 140 / calc(.40 * var(--uos-aur-k))) 78%,
      rgb(252 200 180 / calc(.14 * var(--uos-aur-k))) 90%,
      rgb(252 200 180 / 0) 100%);

  /* Mancha inferior esquerda (antigo bg3). */
  --uos-aurora-bl:
    radial-gradient(ellipse var(--aur-rx3) var(--aur-ry3) at var(--aur-x3) var(--aur-y3),
      rgb(var(--uos-aur-c3) / calc(.97 * var(--uos-aur-k))) 0%,
      rgb(var(--uos-aur-c3) / calc(.95 * var(--uos-aur-k))) 48%,
      rgb(232 135 90 / calc(.74 * var(--uos-aur-k))) 64%,
      rgb(240 165 125 / calc(.40 * var(--uos-aur-k))) 78%,
      rgb(246 195 165 / calc(.14 * var(--uos-aur-k))) 90%,
      rgb(246 195 165 / 0) 100%);

  /* As duas (antigo bg2). */
  --uos-aurora-both: var(--uos-aurora-tr), var(--uos-aurora-bl);
}

/* Movimento: pequenas derivas de posição e de raio (o "formato" muda um pouco, sem sair do canto). */
@keyframes uos-aur-a {
  0%   { --aur-x1: 100%; --aur-y1: -8%;  --aur-rx1: 70%; --aur-ry1: 72%; }
  50%  { --aur-x1: 94%;  --aur-y1: 0%;   --aur-rx1: 76%; --aur-ry1: 64%; }
  100% { --aur-x1: 103%; --aur-y1: -13%; --aur-rx1: 63%; --aur-ry1: 79%; }
}
@keyframes uos-aur-b {
  0%   { --aur-x2: 100%; --aur-y2: 34%; --aur-rx2: 24%; --aur-ry2: 34%; }
  50%  { --aur-x2: 93%;  --aur-y2: 44%; --aur-rx2: 30%; --aur-ry2: 28%; }
  100% { --aur-x2: 104%; --aur-y2: 26%; --aur-rx2: 19%; --aur-ry2: 40%; }
}
@keyframes uos-aur-c {
  0%   { --aur-x3: -4%; --aur-y3: 106%; --aur-rx3: 40%; --aur-ry3: 95%; }
  50%  { --aur-x3: 4%;  --aur-y3: 99%;  --aur-rx3: 46%; --aur-ry3: 84%; }
  100% { --aur-x3: -8%; --aur-y3: 111%; --aur-rx3: 35%; --aur-ry3: 103%; }
}

/* Fora da tela o JS pausa a animação (economiza GPU e bateria). */
.uos-x.is-aurora-idle { animation-play-state: paused; }

@media (prefers-reduced-motion: reduce) {
  .uos-x { --uos-aurora-motion: none; }
}