:root {
  --color-primary: #2980B9;
  --color-secondary: #C0392B;
  --color-dark: #2C3D4F;
  --color-light: #ECF0F1;
}

body {
  background-color: var(--color-light);
  color: var(--color-dark);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.text-primary { color: var(--color-primary); }
.text-secondary { color: var(--color-secondary); }
.text-dark { color: var(--color-dark); }
.text-light { color: var(--color-light); }

.bg-primary { background-color: var(--color-primary); }
.bg-secondary { background-color: var(--color-secondary); }
.bg-dark { background-color: var(--color-dark); }
.bg-light { background-color: var(--color-light); }

.border-primary { border-color: var(--color-primary); }

.pulse-effect {
  animation: pulse-animation 2.5s infinite;
}

@keyframes pulse-animation {
  0% { transform: scale(0.98); box-shadow: 0 0 0 0 rgba(41, 128, 185, 0.4); }
  50% { transform: scale(1.02); box-shadow: 0 0 0 15px rgba(41, 128, 185, 0); }
  100% { transform: scale(0.98); box-shadow: 0 0 0 0 rgba(41, 128, 185, 0); }
}

.min-h-100vh {
  min-height: 100vh;
}

/* Mobile menu transition */
#mobile-menu {
  transition: all 0.3s ease-in-out;
}