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

@layer base {
    * {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
    }

    html {
        scroll-behavior: smooth;
    }

    body {
        font-family: 'Inter', system-ui, sans-serif;
        @apply bg-white text-gray-900;
    }
}

@layer components {
    .btn-primary {
        @apply inline-flex items-center gap-2 px-6 py-3 bg-indigo-600 text-white font-medium rounded-lg hover:bg-indigo-700 transition-colors;
    }

    .btn-outline {
        @apply inline-flex items-center gap-2 px-6 py-3 border border-indigo-600 text-indigo-600 font-medium rounded-lg hover:bg-indigo-600 hover:text-white transition-colors;
    }

    .section-title {
        @apply text-3xl md:text-4xl font-bold text-gray-900 mb-4;
    }

    .section-subtitle {
        @apply text-lg text-gray-600 max-w-2xl mx-auto;
    }
}