body {
  font-family: 'Poppins', sans-serif;
  background-color: #1e1f22;
  color: #f8f8f8;
}

.hero-section {
  background: linear-gradient(to bottom, #5865F2, #2b2d31);
  height: 100vh;
  padding: 4rem 1rem;
}

.header-animated-gradient {
  background: linear-gradient(120deg, #000000 0%, #434db8 50%, #000000 100%);
  background-size: 300% 300%;
  animation: gradientSlide 20s ease-in-out infinite;
}

/* Version mobile */
@media (max-width: 576px) {
  .header-animated-gradient {
    animation-duration: 10s;
  }
}

@keyframes gradientSlide {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}




.btn-primary {
  background-color: #5865F2;
  border: none;
}

.btn-outline-light:hover {
  background-color: #ffffff22;
}

.bg-discord-alt {
  background-color: #2b2d31;
}

.card.glass {
  background: rgba(255, 255, 255, 0.534);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 1rem;
  color: #ffffff;
}

.card.glass h4 {
  font-weight: 600;
  color: #ffffff;
}

.card.glass p {
  color: #dddddd;
  font-size: 1rem;
  line-height: 1.6;
}

.btn-discord-light {
  background-color: #ffffff11;
  color: #ffffff;
  border: 1px solid #ffffff55;
  backdrop-filter: blur(4px);
  padding: 0.5rem 1rem;
  font-weight: 500;
  transition: 0.2s ease;
}

.btn-discord-light:hover {
  background-color: #5865F2;
  color: white;
  border-color: transparent;
}

.text-muted {
  color: #ffffff;
}

.bg-dark-glass {
  background: rgba(255,255,255,0.05);
  color : white;
  backdrop-filter: blur(8px);
  border-radius: 1rem;
  border: 1px solid rgba(255,255,255,0.1);
}

.dashboard-avatar {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #5865F2;
  box-shadow: 0 0 8px rgba(88,101,242,0.3);
}