/* Paleta personalizada: roxo, azul neon, turquesa, rosa */
:root {
  --cor-primaria: #7f5af0;
  --cor-secundaria: #2cb67d;
  --cor-acento: #ff5470;
  --cor-fundo: #16161a;
  --cor-card: rgba(255,255,255,0.12);
  --cor-borda: rgba(127,90,240,0.3);
  --cor-texto: #fffffe;
  --cor-texto-sec: #a7a9be;
}

body {
  background: linear-gradient(135deg, #16161a 0%, #232946 100%);
  color: var(--cor-texto);
}

/* Efeito glassmorphism para cartões e pop-ups */
.glass {
  background: var(--cor-card);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  border-radius: 1.5rem;
  border: 1.5px solid var(--cor-borda);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.18);
}

/* Botão neon */
.btn-neon {
  background: linear-gradient(90deg, var(--cor-primaria), var(--cor-secundaria), var(--cor-acento));
  color: #fff;
  border: none;
  border-radius: 9999px;
  box-shadow: 0 0 16px 2px var(--cor-primaria), 0 0 32px 4px var(--cor-acento);
  transition: transform 0.2s, box-shadow 0.2s;
  font-weight: 700;
  letter-spacing: 0.03em;
}
.btn-neon:hover {
  transform: scale(1.05) translateY(-2px);
  box-shadow: 0 0 32px 8px var(--cor-acento), 0 0 48px 12px var(--cor-primaria);
}

/* Animação de fade-in para elementos */
@keyframes fade-in-up {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in-up {
  animation: fade-in-up 1s cubic-bezier(.4,0,.2,1);
}

/* Animação de brilho neon */
@keyframes neon-glow {
  0%, 100% { box-shadow: 0 0 8px 2px var(--cor-primaria); }
  50% { box-shadow: 0 0 24px 8px var(--cor-acento); }
}
.neon-glow {
  animation: neon-glow 2s infinite alternate;
}

/* Card casino assimétrico */
.card-casino {
  border-radius: 2.5rem 0.5rem 2.5rem 0.5rem;
  border: 2px solid var(--cor-borda);
  background: linear-gradient(120deg, rgba(127,90,240,0.12) 0%, rgba(44,182,125,0.10) 100%);
  box-shadow: 0 4px 32px 0 rgba(127,90,240,0.10);
  transition: transform 0.2s, box-shadow 0.2s;
}
.card-casino:hover {
  transform: scale(1.03) rotate(-1deg);
  box-shadow: 0 8px 48px 0 var(--cor-acento);
}

/* FAQ accordion personalizado */
.faq-btn {
  background: none;
  color: var(--cor-primaria);
  font-weight: 600;
  border: none;
  width: 100%;
  text-align: left;
  padding: 1rem 1.5rem;
  border-radius: 1rem;
  transition: background 0.2s;
}
.faq-btn[aria-expanded="true"] {
  background: rgba(127,90,240,0.08);
}

/* Pop-up 18+ estilizado */
.popup-idade {
  border-radius: 2rem;
  border: 2px solid var(--cor-acento);
  background: rgba(22,22,26,0.95);
  box-shadow: 0 0 32px 8px var(--cor-acento);
  color: #fff;
  padding: 2.5rem 2rem;
  max-width: 420px;
  margin: auto;
  animation: fade-in-up 0.8s cubic-bezier(.4,0,.2,1);
}

/* Footer futurista */
.footer-glass {
  background: linear-gradient(90deg, rgba(127,90,240,0.18) 0%, rgba(44,182,125,0.18) 100%);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-top: 2px solid var(--cor-borda);
}

/* Scrollbar customizada */
::-webkit-scrollbar {
  width: 10px;
  background: #232946;
}
::-webkit-scrollbar-thumb {
  background: var(--cor-primaria);
  border-radius: 8px;
}

/* Placeholder para inputs */
input::placeholder, textarea::placeholder {
  color: #a7a9be;
  opacity: 1;
}

/* Títulos com gradiente */
.titulo-gradiente {
  background: linear-gradient(90deg, var(--cor-primaria), var(--cor-acento));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-fill-color: transparent;
}