@import "tailwindcss";

:root {
  /* Foundation Colors */
  --foundation-primary: #6B0FD4;
  --foundation-primary-dark: #1E0B3A;
  --foundation-primary-light: #3B1E55;
  --foundation-secondary: #6f00cc;

  --foundation-white: #ffffff;
  --foundation-black: #111111;

  --foundation-gray-100: #f6f7fb;
  --foundation-gray-200: #eeeef5;
  --foundation-gray-300: #d9d9e3;
  --foundation-gray-400: #b8b8c5;
  --foundation-gray-500: #9b9ba8;
  --foundation-gray-600: #6f6f7a;

  --foundation-text: #2d2d34;
  --foundation-text-muted: #6f6f7a;

  /* Foundation Layout */
  --foundation-container: 1100px;

  /* Foundation Radius */
  --foundation-radius-sm: 8px;
  --foundation-radius-md: 12px;
  --foundation-radius-lg: 20px;
  --foundation-radius-xl: 24px;
  --foundation-radius-full: 9999px;
}

@theme {
  --font-outfit: var(--font-outfit);
}

p {
    @apply text-base md:text-xl
}

@keyframes gradient-shift {
  0%,
  100% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .animate-\[gradient-shift_12s_ease-in-out_infinite\] {
    animation: none;
  }
}