/* =========================================
   1. SCROLLBARS
   ========================================= */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #020617; 
}
::-webkit-scrollbar-thumb {
  background: #1e293b; 
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #334155; 
}

/* =========================================
   2. BACKGROUND EFFECTS
   ========================================= */
/* Noise Texture - Premium Feel */
.bg-noise {
    position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: 0.03;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
}

/* Aurora Background */
.aurora-bg {
    position: fixed; top: -50%; left: -50%; right: -50%; bottom: -50%; z-index: -1;
    background: radial-gradient(circle at 50% 50%, rgba(14, 165, 233, 0.15), transparent 50%),
                radial-gradient(circle at 80% 20%, rgba(99, 102, 241, 0.15), transparent 40%),
                radial-gradient(circle at 20% 80%, rgba(168, 85, 247, 0.15), transparent 40%);
    filter: blur(60px); animation: blob 20s infinite alternate;
    -webkit-filter: blur(60px);
    pointer-events: none;
}

/* =========================================
   3. COMPONENTS
   ========================================= */
/* Floating Nav Pill */
.nav-pill {
    background: rgba(2, 6, 23, 0.6);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 10px 30px -5px rgba(0, 0, 0, 0.5);
}

/* Premium Card Styles */
.fade-card {
  background-color: rgba(15, 23, 42, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(12px);
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  transition: all 0.3s ease;
}

.fade-card-hover:hover {
  border-color: rgba(56, 189, 248, 0.25); /* Sky-400/25 */
  background-color: rgba(15, 23, 42, 0.6);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2), 0 10px 10px -5px rgba(0, 0, 0, 0.1);
  transform: translateY(-1px);
}

/* =========================================
   4. ANIMATIONS & INTERACTION
   ========================================= */
/* Typing Cursor */
.cursor-blink {
  animation: blink 1s step-end infinite;
}
@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

/* Glitch Hover Effect */
.glitch-hover:hover {
    color: #38bdf8; text-shadow: 2px 0 #f472b6, -2px 0 #00fff9;
}

/* =========================================
   5. UTILITIES & RESPONSIVENESS
   ========================================= */
/* Safe Area */
.safe-area-pb {
    padding-bottom: max(1rem, env(safe-area-inset-bottom));
}

/* Mobile Nav Adjustments */
@media (max-width: 640px) {
    .nav-pill {
        width: 92% !important;
        top: 1rem !important;
    }
}

/* =========================================
   6. PRINT OPTIMIZATION
   ========================================= */
@media print {
  body {
    background: white !important;
    color: black !important;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
  .no-print {
    display: none !important;
  }
  .fade-card {
    background: white !important;
    border: 1px solid #ddd !important;
    box-shadow: none !important;
    color: black !important;
    break-inside: avoid;
  }
  /* Hide background effects */
  .fixed.inset-0, .bg-noise, .aurora-bg { display: none !important; }
  
  /* Ensure text visibility */
  .text-slate-100, .text-slate-200, .text-slate-300, .text-slate-400, .text-white {
      color: #1a1a1a !important;
  }
  .bg-slate-900 {
      background: #f3f4f6 !important; /* light gray for print */
      border: 1px solid #ddd;
  }
  /* Hide CTA gradients */
  .bg-gradient-to-r {
      background: #eee !important;
      color: black !important;
      border: 1px solid #ccc;
  }
  /* Hide complex footer on print */
  footer {
      display: none !important;
  }
  /* Hide floating nav on print */
  nav.nav-pill {
      display: none !important;
  }
}