/* styles.css */
:root {
    --dark-bg: radial-gradient(circle at top left, #1e003f, #0d0221 60%, #220044);
    --light-bg: linear-gradient(to right, #f3e8ff, #ede9fe, #faf5ff);
    --purple-gradient: linear-gradient(to right, #c084fc, #a855f7, #7e22ce);
  }
  
  body {
    background: var(--dark-bg);
    background-attachment: fixed;
    transition: background 0.6s ease, color 0.4s ease;
    margin: 0;
    font-family: 'Inter', sans-serif;
  }
  
  .glass {
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 1rem;
    transition: all 0.4s ease;
  }
  
  .glass-light {
    background: rgba(255, 255, 255, 0.7);
    border: 1px solid rgba(0, 0, 0, 0.05);
  }
  
  .gradient-text {
    background: var(--purple-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
  }
  
  .card-hover:hover {
    transform: translateY(-8px) scale(1.03);
    box-shadow: 0 8px 25px rgba(168, 85, 247, 0.3);
  }
  
  .transition-all {
    transition: all 0.4s ease;
  }
  
  nav {
    backdrop-filter: blur(12px);
  }