body {
  background: linear-gradient(135deg, #1a2333 0%, #2a374a 100%);
  color: #f1f5f9;
  font-family: 'Inter', sans-serif;
  padding: 20px;
  font-weight: 400;
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Outfit', sans-serif;
  font-weight: 700;
  letter-spacing: -0.025em;
}

h1 {
  color: #90cdf4;
  text-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Color variables with refined theme */
:root {
  --blue-light: #90cdf4;
  --blue-medium: #4299e1;
  --blue-dark: #2c5282;
  --accent-light: #f1f5f9;
  --accent-dark: #475569;
}

/* Interactive elements */
a {
  transition: all 0.2s ease-in-out;
}

a:hover {
  color: var(--blue-light);
  transform: translateY(-1px);
}

/* Card-like elements */
.container {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 16px;
  backdrop-filter: blur(10px);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  padding: 1.5rem;  /* reduced from 2rem */
}

/* Better spacing */
.mb-4 {
  margin-bottom: 1rem; /* reduced from 1.5rem */
}

.mb-8 {
  margin-bottom: 2rem; /* reduced from 2.5rem */
}

/* Improved contrast for gray text */
.text-gray-400 {
  color: #9ca3af;
}

/* Menu adjustments for better spacing */
@media (max-width: 640px) {
  .menu-item {
    padding: 0.75rem 0;  /* More vertical padding on small screens */
  }
  
  .menu-item + .menu-item {
    margin-top: 0.5rem;  /* Add space between menu items */
  }
}
