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

@layer base {
    html {
        @apply scroll-smooth;
    }
    body {
        @apply font-sans leading-relaxed text-forest-dark bg-cream overflow-x-hidden;
    }
}

@layer components {
  .btn {
    @apply py-4 px-10 text-base font-semibold no-underline rounded-full transition-all duration-300 inline-flex items-center justify-center gap-2 relative overflow-hidden;
  }
  .btn-primary {
    @apply bg-gold text-forest-dark hover:translate-y-[-2px] hover:shadow-[0_10px_30px_rgba(212,175,55,0.4)];
  }
  .btn-secondary {
    @apply bg-transparent text-white border-2 border-white hover:bg-white hover:text-forest-dark;
  }
}