@keyframes giro-lento {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes pulso-suave {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.035); }
}

@keyframes pulso-aura {
  0%, 100% { opacity: 0.55; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.06); }
}

@keyframes varredura {
  from { background-position: 130% 0; }
  to { background-position: -60% 0; }
}

@keyframes girar {
  to { transform: rotate(360deg); }
}

@keyframes pulsar-texto {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.62; }
}

@keyframes deriva-estrelas {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(0, -50%, 0); }
}

@keyframes surgir {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes correr-brilho {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}

@keyframes pulso-presenca {
  0% { transform: scale(1); opacity: 0.8; }
  100% { transform: scale(2.1); opacity: 0; }
}

.revelar {
  opacity: 0;
  transform: translateY(22px);
}

.revelar[data-visivel='true'] {
  opacity: 1;
  transform: none;
}

.etapa {
  display: none;
}

.etapa[data-liberada='true'] {
  display: block;
  animation: surgir 620ms var(--curva-entrada) both;
}


.heroi__orbe {
  will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }

  .revelar {
    opacity: 1;
    transform: none;
  }

  .etapa[data-liberada='true'] {
    animation: none;
  }

  body::after {
    animation: none;
  }
}

@keyframes respiro-medalhao {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 0.72; }
}

@keyframes bounce-continuar {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(6px); }
}

@keyframes cintilar {
  0%, 100% { opacity: 0.08; }
  50% { opacity: 0.85; }
}

/* A cauda desvanece devagar de proposito: 78 a 100 por cento da animacao e
   so o apagamento. Antes ela sumia de uma vez e a passagem lia como um
   piscar, sem peso. */
@keyframes riscar {
  0% { opacity: 0; transform: translate3d(0, 0, 0) rotate(var(--angulo, 32deg)) scale(0.5); }
  8% { opacity: 1; }
  78% { opacity: 1; }
  92% { opacity: 0.45; }
  100% { opacity: 0; transform: translate3d(var(--dx, 760px), var(--dy, 520px), 0) rotate(var(--angulo, 32deg)) scale(1); }
}

@keyframes pulso-revelacao {
  0%, 100% { opacity: 0.32; }
  50% { opacity: 1; }
}

@keyframes convergir {
  0% { opacity: 0; transform: translate(var(--px, 0), var(--py, 0)) scale(1); }
  18% { opacity: 0.9; }
  82% { opacity: 0.55; }
  100% { opacity: 0; transform: translate(0, 0) scale(0.35); }
}