/* ===== Scrollbar oculto, mas rolagem normal ===== */
html, body {
  height: 100%;
  overflow-y: auto;          /* mantém rolagem */
  -ms-overflow-style: none;  /* IE/Edge legado */
  scrollbar-width: none;     /* Firefox */
}
html::-webkit-scrollbar,
body::-webkit-scrollbar { display: none; }


/* Fundo preto com glows ROXOS */
    .bg-cosmos{
      background:
        radial-gradient(900px 520px at 12% -8%, rgba(139,92,246,.14), transparent 60%),
        radial-gradient(1000px 560px at 88% 8%, rgba(147,51,234,.12), transparent 60%),
        radial-gradient(900px 700px at 50% 100%, rgba(168,85,247,.08), transparent 65%),
        #060508;
    }
    /* Superfície do player com halo roxo */
    .player-surface{
      box-shadow:
        0 0 0 2px rgba(168,85,247,.42),
        0 20px 48px rgba(0,0,0,.55) inset,
        0 12px 34px rgba(88,28,135,.35);
      background: radial-gradient(120% 120% at 50% 10%, #0b0813, #07060b);
    }


.title-exato {
  background: linear-gradient(
    90deg,
    #a46af7 0%,   /* roxo vivo à esquerda */
    #b97cff 28%,  /* roxo/lilás */
    #cfafff 55%,  /* lavanda */
    #a9bbff 78%,  /* pervinca */
    #86b6ff 100%  /* azul claro à direita */
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;

  filter:
    drop-shadow(0 0 6px rgba(168, 85, 247, .18))
    drop-shadow(0 0 14px rgba(134, 182, 255, .12));
}

@keyframes blinkSoft {
  0%, 100% { opacity: 1; }
  50%      { opacity: .25; }  /* quão “forte” pisca (ajuste aqui) */
}

.blink-soft {
  animation: blinkSoft 1.1s ease-in-out infinite;
}

/* acessibilidade: desliga se o usuário pedir menos animação */
@media (prefers-reduced-motion: reduce) {
  .blink-soft { animation: none; }
}

.refresh-animate {
    opacity: 0; /* Inicialmente invisível */
    transform: translateY(20px); /* Move o elemento para baixo */
    transition: opacity 0.9s ease, transform 0.9s ease; /* Transições suaves para opacidade e transformação */
}

/* Classe que será adicionada durante a animação */
.refresh-animate.animar {
    opacity: 1; /* Torna o elemento visível */
    transform: translateY(0); /* Move o elemento para sua posição original */
}

/* Efeito de delay para cada elemento */
.refresh-animate:nth-child(1) {
    transition-delay: 0.3s; /* Atraso de 200ms */
}
.refresh-animate:nth-child(2) {
    transition-delay: 0.6s; /* Atraso de 400ms */
}
.refresh-animate:nth-child(3) {
    transition-delay: 0.9s; /* Atraso de 600ms */
}

/* ===== Evita scroll lateral por efeitos ===== */
html, body { overflow-x: hidden; }

html { scroll-behavior: smooth; }

/* ===== Scroll reveal seguro (não esconde nada por padrão) ===== */
.sr-init { opacity: 0; transform: translateY(16px); }
.sr-in   { opacity: 1; transform: none; transition: opacity .45s ease, transform .45s ease; }
@media (prefers-reduced-motion: reduce){
  .sr-init, .sr-in { opacity: 1 !important; transform: none !important; transition: none !important; }
}