/* 🌈 Общий фон */
body {
  background-color: #ffffff;
  margin: 0;
  padding: 0;
}

/* 📦 Контейнер */
.fade-container {
  padding: 16px;
}

/* 🌟 Анимация плавного появления */
.fade-in {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeInUp 0.8s ease-out forwards;
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ⏱ Задержки появления */
.delay-1 { animation-delay: 0.2s; }
.delay-2 { animation-delay: 0.5s; }
.delay-3 { animation-delay: 0.8s; }
.delay-4 { animation-delay: 1.1s; }
.delay-5 { animation-delay: 1.4s; }
.delay-6 { animation-delay: 1.7s; }
.delay-7 { animation-delay: 2s; }

/* ⚪ Индикаторы прогресса (точки) */
.dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #c0dbe5;
}

.dot.active {
  background-color: #007bff;
}

/* 📢 Заголовок H4 — только он увеличен */
.fade-container h4 {
  font-size: 1.75rem;
  font-weight: 800;
}

/* 📱 Мобильная адаптация */
@media (max-width: 576px) {
  h4 {
    font-size: 1.4rem;
  }

  .btn-lg {
    font-size: 1rem;
    padding: 0.75rem 1.25rem;
  }

  img {
    max-width: 100%;
    height: auto;
  }
}

/* 💠 Вспомогательные блоки */
.icon-circle {
  background-color: #fff;
  border-radius: 50%;
  padding: 15px;
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.row h6 {
  font-size: 1rem;
}

.row p {
  font-size: 0.875rem;
}

/* Карточка каждого блока */
.benefit-block {
  background-color: #DBF4FB;
  border-radius: 20px;
  padding: 16px;
  margin-bottom: 20px;
}

/* Размер картинок (ты контролируешь сам!) */
.icon-img {
  width: 180px;
}

@media (max-width: 576px) {
  .icon-img {
    width: 64px;
    margin-bottom: 12px;
  }
}

/* 🌈 Шаг формы — стилизованный контейнер */
.step {
  background-color: #DBF4FB;
  border-radius: 20px;
  padding: 20px;
  margin-bottom: 20px;
  box-shadow: 0 4px 12px rgba(0, 123, 255, 0.05);
  transition: all 0.3s ease;
}

/* 🖋️ Стиль для input/label */
.form-label {
  font-weight: 500;
  color: #333;
}

.form-control,
.form-select {
  border-radius: 12px;
  padding: 0.75rem;
  border: 1px solid #ccc;
  font-size: 1rem;
  background-color: #fff;
  box-shadow: none;
}

.form-control:focus,
.form-select:focus {
  border-color: #007bff;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.15);
}

/* ✅ Кнопки: стили одинаковые по всему приложению */
.btn {
  font-weight: 600;
}

.btn-primary {
  background-color: #007bff;
  border: none;
}

.btn-success {
  background-color: #28a745;
  border: none;
}

/* 🔄 Адаптация под мобилку */
@media (max-width: 576px) {
  .form-control,
  .form-select {
    font-size: 1rem;
  }

  .btn-lg {
    font-size: 1rem;
    padding: 0.75rem 1.25rem;
  }
}
.fade-container,
.step,
body,
html {
  filter: none !important;
  backdrop-filter: none !important;
}