/* Main stylesheet for Reach West */
/* Core variables */
:root {
  --dark-bg: #0e1a2b;
  --dark-bg-lighter: #101b2f;
  --dark-border: #1f2b3d;
  --dark-card-border: #2a3a52;
  --text-light: #ffffff;
  --text-muted: #94a3b8;
}

/* Base styles */
body {
  scroll-behavior: smooth;
}

/* Animation utilities */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Enhanced hover states */
.hover-lift {
  transition: transform 0.2s ease-out;
}

.hover-lift:hover {
  transform: translateY(-3px);
}

/* Micro interactions */
.pulse {
  animation: pulse 2s infinite;
}

@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}

/* Enhanced mobile experience */
@media (max-width: 640px) {
  .mobile-touch-target {
    min-height: 44px;
    min-width: 44px;
  }
}

/* Custom scrollbar for desktop */
@media (min-width: 768px) {
  ::-webkit-scrollbar {
    width: 8px;
  }
  
  ::-webkit-scrollbar-track {
    background: var(--dark-bg);
  }
  
  ::-webkit-scrollbar-thumb {
    background: var(--dark-border);
    border-radius: 4px;
  }
  
  ::-webkit-scrollbar-thumb:hover {
    background: var(--dark-card-border);
  }
}