/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&family=Montserrat:wght@700;800;900&display=swap');

/* Base Styles */
html {
  scroll-behavior: smooth;
}

body {
  background-color: #070707;
  color: #efefef;
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
  overflow-x: clip;
}

/* Custom Utilities for High Contrast & Smoothness */
.text-outline {
  color: transparent;
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.18);
}

.text-outline-thick {
  color: transparent;
  -webkit-text-stroke: 2px rgba(255, 255, 255, 0.35);
}

/* Hide scrollbars but keep functionality */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Custom Scrollbar for Desktop */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: #070707;
}
::-webkit-scrollbar-thumb {
  background: #222222;
  border-radius: 999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #333333;
}

/* Running Marquee Animation */
@keyframes marquee {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-50%); }
}

.animate-marquee {
  display: flex;
  width: max-content;
  animation: marquee 25s linear infinite;
}

.animate-marquee:hover {
  animation-play-state: paused;
}

/* Sticky Card Stack Enhancements */
.sticky-card {
  transition: transform 0.4s ease, border-color 0.4s ease, box-shadow 0.4s ease;
}

/* Scroll Animation classes for pure JS fade-in effects */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

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