/* Reset básico */
body, html {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: 'Arial', sans-serif;
  color: white
}



/* Animação do gradiente */
@keyframes gradientBG {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}


body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #ffffff, #f0f0f0, #e0e0e0, #ffffff);
  background-size: 400% 400%;
  animation: gradientBG 15s ease infinite;
  z-index: -2; /* atrás do tsParticles */
}


/* Particles ocupam toda a tela e ficam atrás do conteúdo */
#particles-js {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: -1; /* atrás do conteúdo */
  background: #0a0a23; /* azul bem escuro */
}

/* Conteúdo acima das partículas */
body > * {
  position: relative;
  z-index: 0;
}