@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=Inter:wght@400;500;700&display=swap');

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

@layer base {
  html {
    /* Добавляем 'Mutgeist Green' для легкой кастомизации */
    --color-mutgeist-primary: #15803d; /* deep green-700 */
    --color-mutgeist-secondary: #dcfce7; /* light green-50 */
    scroll-behavior: smooth;
  }

  /* Основной текст: Inter (современный, читаемый) */
  body {
    font-family: 'Inter', sans-serif;
  }

  /* Заголовки: Poppins (смелый, выразительный) */
  h1, h2, h3, h4, h5, h6 {
    font-family: 'Poppins', sans-serif;
  }
}

@layer components {
  .container {
    @apply mx-auto px-4 sm:px-6 lg:px-8 max-w-7xl;
  }

  .btn {
    @apply font-bold py-3 px-8 rounded-full text-center transition-all duration-300 ease-in-out shadow-lg;
  }

  /* Основная кнопка: Зеленый фон, белый текст */
  .btn-primary {
    @apply bg-green-700 text-white hover:bg-green-800 focus:ring-4 focus:ring-green-500/50;
  }

  /* Второстепенная кнопка: Белый фон, зеленый текст, зеленая рамка */
  .btn-secondary {
    @apply bg-white text-green-700 border-2 border-green-700 hover:bg-green-50 focus:ring-4 focus:ring-green-500/50;
  }

  .form-input {
    @apply bg-gray-50 focus:bg-white;
  }

  .form-label {
    @apply cursor-text pointer-events-none;
  }

  /* Фокус-цвет для полей ввода - теперь зеленый */
  .form-input:not(:placeholder-shown) + .form-label,
  .form-input:focus + .form-label {
    @apply -translate-y-8 text-sm text-green-700;
  }

  .spinner-overlay {
    @apply fixed inset-0 z-[999] bg-white flex items-center justify-center transition-opacity duration-500;
  }

  /* Цвет спиннера - теперь зеленый */
  .spinner-border {
    @apply h-16 w-16 border-4 border-green-700 border-t-transparent rounded-full animate-spin;
  }

  .spinner-overlay.hidden {
    @apply opacity-0 pointer-events-none;
  }
  
  /* Дополнительные стили для карточек (для примера, если они есть) */
  .approach-card, .offering-card, .unique-value-card, .testimonial-card {
    @apply bg-white p-8 rounded-xl shadow-lg border border-gray-100 hover:shadow-xl transition-shadow duration-300;
  }
  
  /* Стиль для нумерации в программах */
  .offering-number {
    @apply text-6xl font-extrabold mb-4 font-poppins; /* Используем Poppins для чисел */
  }
}

@layer utilities {
  .animate-fade-in-down {
    animation: fade-in-down 0.8s ease-out both;
  }

  .animate-scale-in {
    animation: scale-in 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
  }

  .animate-fade-in-right {
    animation: fade-in-right 0.8s cubic-bezier(0.39, 0.575, 0.565, 1) both;
  }

  .delay-200 {
    animation-delay: 0.2s;
  }

  .delay-400 {
    animation-delay: 0.4s;
  }

  .delay-600 {
    animation-delay: 0.6s;
  }

  .back-to-top.show {
    @apply opacity-100 scale-100;
  }
}

@keyframes fade-in-down {
  0% {
    transform: translateY(-20px);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes scale-in {
  0% {
    transform: scale(0.9);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes fade-in-right {
  0% {
    transform: translateX(50px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}