style.css

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  body {
    /* Brutalist typography settings */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  
  h1, h2, h3, h4, h5, h6 {
    letter-spacing: -0.05em;
  }
}

@layer utilities {
  /* Custom animation for marquee */
  .animate-marquee {
    animation: marquee 25s linear infinite;
  }
  
  @keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }

  /* Brutalist Focus States */
  .brutalist-focus:focus {
    outline: none;
    box-shadow: 4px 4px 0px 0px #000000;
  }
}

/* Custom scrollbar for Webkit */
::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: #ffffff;
  border-left: 2px solid #000000;
}

::-webkit-scrollbar-thumb {
  background: #000000;
  border: 2px solid #ffffff;
}

::-webkit-scrollbar-thumb:hover {
  background: #333;
}