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

/* Import our fonts */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,700;0,900;1,400&family=DM+Sans:wght@300;400;500;600&display=swap');

/* Custom base styles */
@layer base {
  body {
    font-family: 'DM Sans', sans-serif;
    background-color: #F5F0E8;
    color: #0D0D0D;
  }
  h1, h2, h3 {
    font-family: 'Playfair Display', serif;
  }
}

/* Reusable component classes */
@layer components {
  .btn-primary {
    @apply bg-yellow-600 text-black font-bold py-3 px-6 rounded-lg hover:bg-yellow-500 transition-all duration-200 inline-block;
  }
  .btn-dark {
    @apply bg-gray-900 text-white font-bold py-3 px-6 rounded-lg hover:bg-gray-700 transition-all duration-200 inline-block;
  }
  .btn-outline {
    @apply border-2 border-gray-900 text-gray-900 font-bold py-3 px-6 rounded-lg hover:bg-gray-900 hover:text-white transition-all duration-200 inline-block;
  }
  .card {
    @apply bg-white rounded-2xl border border-gray-100 shadow-sm hover:shadow-lg transition-all duration-300;
  }
  .badge-diploma {
    @apply text-xs font-bold uppercase tracking-widest px-3 py-1 rounded-full bg-green-100 text-green-700;
  }
  .badge-artisan {
    @apply text-xs font-bold uppercase tracking-widest px-3 py-1 rounded-full bg-yellow-100 text-yellow-700;
  }
  .section-label {
    @apply text-xs font-bold uppercase tracking-widest text-yellow-600 flex items-center gap-2 mb-3;
  }
}

@layer utilities {
  @keyframes ticker {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
  }
  .animate-ticker {
    animation: ticker 28s linear infinite;
  }
}