@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;900&family=Almarai:wght@400;700;800&family=Inter:wght@400;500;600;700;800&display=swap');

:root {
  --primary-glow: rgba(56, 229, 255, 0.25);
  --gold-glow: rgba(255, 215, 0, 0.25);
  --purple-glow: rgba(147, 51, 234, 0.25);
}

body {
  font-family: 'Cairo', 'Inter', sans-serif;
  background-color: #060913;
  color: #f1f5f9;
  overflow-x: hidden;
}

/* Glassmorphism Cards */
.glass-panel {
  background: rgba(15, 23, 42, 0.75);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
}

.glass-panel-hover {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-panel-hover:hover {
  border-color: rgba(56, 229, 255, 0.3);
  box-shadow: 0 12px 40px -10px var(--primary-glow);
  transform: translateY(-2px);
}

/* Neon accents */
.neon-cyan-text {
  color: #38e5ff;
  text-shadow: 0 0 15px rgba(56, 229, 255, 0.5);
}

.neon-gold-text {
  color: #ffd700;
  text-shadow: 0 0 15px rgba(255, 215, 0, 0.5);
}

.neon-button {
  background: linear-gradient(135deg, #0ea5e9 0%, #3b82f6 50%, #6366f1 100%);
  box-shadow: 0 0 20px rgba(56, 229, 255, 0.35);
  transition: all 0.3s ease;
}

.neon-button:hover {
  box-shadow: 0 0 30px rgba(56, 229, 255, 0.6);
  transform: scale(1.02);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #090d16;
}
::-webkit-scrollbar-thumb {
  background: #1e293b;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #38e5ff;
}

/* Subtitle Mockup Preview Screen */
.subtitle-card-preview {
  font-family: 'Cairo', sans-serif;
  font-weight: 900;
  color: #ffffff;
  text-shadow: 0px 4px 10px rgba(0, 0, 0, 0.8), -2px -2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, 2px 2px 0 #000;
  animation: popIn 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes popIn {
  0% { transform: scale(0.9); opacity: 0.8; }
  60% { transform: scale(1.1); }
  100% { transform: scale(1.0); opacity: 1; }
}

/* Terminal logs box */
.terminal-box {
  background: #030712;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.82rem;
  line-height: 1.5;
  border: 1px solid #1f2937;
}

/* Animated Gradient Background */
.gradient-blob {
  position: absolute;
  filter: blur(90px);
  opacity: 0.25;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}