/* ===============================================
   ████████  EFEITO ELITE - CINEMATIC PRESTIGE  ████████
   Surgimento com overshoot, brilho gradiente e escala joia
   Uso: adicione a classe .cinematic_prestige a qualquer elemento
=============================================== */

/* Estado inicial (oculto, com preparação para o efeito de luxo) */
.cinematic_prestige {
  opacity: 0;
  filter: blur(6px) brightness(0.7);
  transform: scale(0.92) rotateX(3deg) translateY(12px);
  transition: transform 1.1s cubic-bezier(0.34, 1.45, 0.55, 1.02),
              opacity 0.9s cubic-bezier(0.2, 0.96, 0.4, 1.05),
              filter 0.9s ease-out,
              box-shadow 0.6s linear;
  will-change: transform, opacity, filter;
  position: relative;
  max-width: 100%;
}

/* Estado ativo: surge com overshoot, brilho e correção de escala */
.cinematic_prestige.active {
  opacity: 1;
  filter: blur(0) brightness(1);
  transform: scale(1) rotateX(0deg) translateY(0);
  transition: transform 0.9s cubic-bezier(0.34, 1.45, 0.55, 1.02),
              opacity 0.8s ease-out,
              filter 0.7s ease-out;
  /* Animação de brilho passageiro (luxo) */
  animation: cinematic_glow 1.2s ease-out forwards;
}

/* Animação de brilho estilo "luxo líquido" */
@keyframes cinematic_glow {
  0% {
    text-shadow: 0 0 0 rgba(255, 217, 0, 0.651);
    box-shadow: 0 0 0 rgba(255, 215, 0, 0), inset 0 0 0 rgba(255, 230, 100, 0);
  }
  30% {
    text-shadow: 0 0 15px rgba(255, 217, 0, 0.952);
    box-shadow: 0 0 20px 5px rgba(255, 215, 0, 0.3), inset 0 0 15px rgba(255, 230, 120, 0.2);
  }
  100% {
    text-shadow: 0 0 0 rgb(255, 217, 0);
    box-shadow: 0 0 0 rgba(255, 215, 0, 0), inset 0 0 0 rgba(255, 230, 100, 0);
  }
}

/* Ajuste responsivo para mobile (menos deslocamento e escala) */
@media (max-width: 768px) {
  .cinematic_prestige {
    transform: scale(0.96) translateY(8px);
    filter: blur(4px) brightness(0.8);
  }
  .cinematic_prestige.active {
    transform: scale(1) translateY(0);
  }
  @keyframes cinematic_glow {
    30% {
      text-shadow: 0 0 8px rgba(255, 215, 0, 0.5);
      box-shadow: 0 0 12px 3px rgba(255, 215, 0, 0.25);
    }
  }
}

/* Acessibilidade: respeita "reduced motion" */
@media (prefers-reduced-motion: reduce) {
  .cinematic_prestige,
  .cinematic_prestige.active {
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
    filter: blur(0) brightness(1) !important;
    animation: none !important;
  }
}