/* Custom CSS extracted from globals.css */

:root {
  --background: #ffffff;
  --foreground: #171717;
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
}

body {
  background: var(--background);
  color: var(--foreground);
  font-family: Arial, Helvetica, sans-serif;
}

/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Responsive marquee animation - slower on mobile */
@keyframes marquee {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-50%); }
}

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

/* Faster marquee on larger screens */
@media (min-width: 768px) {
  .animate-marquee {
    animation: marquee 20s linear infinite;
  }
}

/* Fade in animation */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-fadeIn {
  animation: fadeIn 0.5s ease-in-out;
}

/* Responsive text selection */
::selection {
  background-color: rgba(59, 130, 246, 0.3);
  color: inherit;
}

/* Improve touch targets on mobile */
@media (max-width: 767px) {
  button, a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

/* Prevent horizontal scroll on mobile */
body {
  overflow-x: hidden;
}