@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --purple-400: #6366f1;
  --purple-500: #5b34f6;
  --purple-600: #5b21b6;
  --blue-400: #38bdf8;
  --indigo-600: #5850ec;
  --black: #212121;
  --gray-500: #757575;
  --pink-500: #ec4899;
  --yellow-400: #facc15;
  --orange-500: #f97316;
}

@keyframes rotateShovel {
  0% { transform: rotate(-12deg); }
  50% { transform: rotate(-15deg); }
  100% { transform: rotate(-12deg); }
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

* {
  scroll-behavior: smooth;
}

/* Hero Section */
.animate-fadeIn {
  animation: fadeIn 1s ease-out forwards;
}

.animate-rotateShovel {
  animation: rotateShovel 10s linear infinite;
}

/* Card Effects */
.card-hover:hover {
  transform: translateY(-8px) scale(1.05);
  box-shadow: 0 25px 40px rgba(63, 45, 112, 0.2);
}

/* SVG Gradients */
#shovelGradient {
  stroke: url(#shovelGradient);
}

/* CTA Section */
.blur-gradient::after {
  content: "";
  position: absolute;
  width: 200%;
  height: 200%;
  top: -20%;
  left: -20%;
  background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0) 70%);
  backdrop-filter: blur(120px);
  border-radius: 50%;
  z-index: -1;
}

/* Button Gradients */
.btn-start {
  background: linear-gradient(to right, #7e22ce, #4f46e5);
}

.btn-explore {
  background: linear-gradient(to right, #111827, #1f2937);
  backdrop-filter: blur(10px);
}

/* Transition & Animation Speeds */
.transition-all {
  transition: all 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
}

/* Text Effects */
.text-shadow-3d {
  text-shadow: 2px 2px 0 rgba(0,0,0,0.3);
}

/* Hover Transitions */
.hover-scale {
  transition: transform 0.3s ease;
  transition: all 0.2s ease;
  will-change: transform;
}

/* Card Shadows */
.card-shadow {
  box-shadow: 0 10px 25px rgba(30, 30, 60, 0.15);
}

/* Footer */
.footer-shadow {
  box-shadow: 0 -20px 40px rgba(0,0,0,0.2);
}

/* SVG Filters */
.svg-fill {
  filter: drop-shadow(2px 2px 4px hsl(270 10% 20%));
}

/* Dark Mode Base */
body {
  background: radial-gradient(circle at center, #0f0f0f 0%, #1e1e2f 100%);
}