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

@layer base {
  * {
    @apply border-border;
  }
  
  body {
    @apply bg-white text-gray-900 font-sans;
  }
  
  html {
    scroll-behavior: smooth;
  }
}

@layer components {
  .btn-primary {
    @apply bg-primary-600 hover:bg-primary-700 text-white px-6 py-3 rounded-lg font-medium transition-colors duration-200;
  }
  
  .btn-secondary {
    @apply bg-gray-800 hover:bg-gray-900 text-white px-6 py-3 rounded-lg font-medium transition-colors duration-200;
  }
  
  .section-padding {
    @apply py-16 lg:py-24;
  }
  
  .container-custom {
    @apply max-w-7xl mx-auto px-4 sm:px-6 lg:px-8;
  }
}

.cookie-banner {
  backdrop-filter: blur(10px);
  background: rgba(255, 255, 255, 0.95);
}

.mobile-menu {
  backdrop-filter: blur(10px);
  background: rgba(255, 255, 255, 0.98);
}

.tech-badge {
  @apply inline-flex items-center px-3 py-1 rounded-full text-sm font-medium;
}

.hero-gradient {
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
}

.stats-card {
  @apply bg-white rounded-xl p-6 shadow-sm border border-gray-100;
}

.service-card {
  @apply bg-white rounded-xl p-8 shadow-sm border border-gray-100 hover:shadow-md transition-shadow duration-300;
}

.case-study-card {
  @apply bg-gradient-to-br from-blue-500 to-blue-600 rounded-xl p-8 text-white;
}