/* Custom fonts from Euphoria 5 */
@font-face {
  font-family: 'TomatoGrotesk';
  src: url('https://ext.same-assets.com/3278459369/3234869855.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'TomatoGrotesk';
  src: url('https://ext.same-assets.com/3278459369/1180689669.otf') format('opentype');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'WorkSans';
  src: url('https://ext.same-assets.com/3278459369/1367888085.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'DMSans';
  src: url('https://ext.same-assets.com/3278459369/3431507481.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

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

@layer base {
  :root {
    --background: 0 0% 100%;
    --foreground: 30 30% 15%;
    --card: 0 0% 100%;
    --card-foreground: 30 30% 15%;
    --popover: 0 0% 100%;
    --popover-foreground: 30 30% 15%;

    --primary: 30 40% 40%; /* Aesthetic Brown */
    --primary-foreground: 30 30% 95%;
    
    --secondary: 30 20% 85%;
    --secondary-foreground: 30 20% 40%;
    
    --muted: 30 20% 85%;
    --muted-foreground: 30 20% 40%;
    
    --accent: 30 50% 60%;
    --accent-foreground: 30 30% 15%;
    
    --destructive: 0 84.2% 60.2%;
    --destructive-foreground: 210 40% 98%;
    
    --border: 30 15% 85%;
    --input: 30 15% 85%;
    --ring: 30 40% 40%;
    
    --radius: 0.5rem;

    --chart-1: 30 60% 55%;
    --chart-2: 30 30% 40%;
    --chart-3: 28 40% 70%;
    --chart-4: 32 35% 65%;
    --chart-5: 26 25% 50%;

    --rise-teal: 30 40% 40%;
    --rise-peach: 30 60% 70%;
    --rise-dark: 30 30% 10%;
    --rise-light-gray: 30 20% 95%;

  }

  .dark {
    --background: 30 30% 10%;
    --foreground: 30 30% 90%;
    --card: 30 30% 12%;
    --card-foreground: 30 30% 90%;
    --popover: 30 30% 12%;
    --popover-foreground: 30 30% 90%;

    --primary: 30 50% 60%;
    --primary-foreground: 30 30% 10%;
    
    --secondary: 30 20% 25%;
    --secondary-foreground: 30 30% 85%;
    
    --muted: 30 20% 25%;
    --muted-foreground: 30 20% 70%;
    
    --accent: 30 40% 50%;
    --accent-foreground: 30 30% 10%;
    
    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 30 30% 95%;
    
    --border: 30 20% 25%;
    --input: 30 20% 25%;
    --ring: 30 40% 60%;

    --chart-1: 30 70% 60%;
    --chart-2: 30 30% 40%;
    --chart-3: 28 40% 70%;
    --chart-4: 32 35% 65%;
    --chart-5: 26 25% 50%;
  }
}


@layer base {
  * {
    @apply border-border;
  }
  body {
    @apply bg-background text-foreground;
  }
}

/* shimmer-effect */
.shimmer-effect {
  background-image: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0.2) 0%,
    rgba(255, 255, 255, 0.4) 20%,
    rgba(255, 255, 255, 0.2) 40%,
    rgba(255, 255, 255, 0.2) 100%
  );
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite linear;
}

@keyframes shimmer {
  0% {
    background-position: -150% 0;
  }
  100% {
    background-position: 150% 0;
  }
}

/* animate-fade-in-slow */
@keyframes fadeInSlow {
  0% {
    opacity: 0;
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

.animate-fade-in-slow {
  animation: fadeInSlow 1.5s ease-out;
}

/* animate-glow */
@keyframes glowPulse {
  0%, 100% {
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.5);
  }
  50% {
    box-shadow: 0 0 20px rgba(255, 215, 0, 0.9);
  }
}

.animate-glow {
  animation: glowPulse 2s infinite ease-in-out;
}

@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.partners-marquee {
  animation: marquee 15s linear infinite;
  width: max-content;
}

.partners-marquee img {
  filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
}