body {
  transition: background-color 0.3s ease, color 0.3s ease;
}

.fade-in-up {
  animation: fadeInUp 1s ease-out forwards;
  opacity: 0;
  transform: translateY(20px);
}

@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.bg-pattern {
  background-color: #efefdc;
  background-image: radial-gradient(#52054d 0.5px, transparent 0.5px), radial-gradient(#52054d 0.5px, #efefdc 0.5px);
  background-size: 20px 20px;
  background-position: 0 0, 10px 10px;
  opacity: 1;
}

.dark .bg-pattern {
  background-color: #111827;
  background-image: radial-gradient(#ffffff 0.5px, transparent 0.5px), radial-gradient(#ffffff 0.5px, #111827 0.5px);
  opacity: 1;
}