/* --- Адаптация для больших экранов (1601px и более) --- */
@media (min-width: 1601px) {
  .container,
  .navbar,
  .training-section,
  .cta-section,
  .swiper-container,
  .case-studies-grid,
  .feature-grid {
    max-width: 1500px; /* Увеличиваем ширину контента */
  }

  .contact-container {
    max-width: 1600px;
  }

  .hero-text-content h1 {
    font-size: 3.6rem; /* Делаем главный заголовок более выразительным */
  }

  /* Меняем цветовую гамму для больших экранов */
  .hero-section,
  .industries-section,
  .expert-section,
  .approach-section,
  .partners-section,
  .reviews-section,
  .contact-section,
  .case-studies-section,
  .feature-card {
    background-color: #e9ebef;
  }
}

/* --- Адаптация для ноутбуков и планшетов --- */

/* Экраны до 1200px (маленькие ноутбуки) */
@media (max-width: 1200px) {
  .container {
    max-width: 960px;
  }
  .expert-container {
    gap: 20px;
  }
  .expert-image-wrapper {
    width: 300px;
    height: 420px;
  }
  .expert-name {
    font-size: 2.2rem;
  }
  .training-container {
    gap: 20px;
  }
  .second-image {
    width: 240px;
    height: 240px;
    left: -40px;
  }
  .experience-badge {
    right: -10%;
  }
  .case-studies-grid {
    grid-template-columns: 1fr;
  }
}

/* Планшеты (до 1023px) */
@media (max-width: 1023px) {
  .navbar {
    padding: 10px 15px;
    width: 95%;
  }
  .navbar-toggler {
    display: block; /* Показываем бургер на планшетах и мобильных */
  }
  .navbar-nav {
    /* Стили для выпадающего меню */
    display: flex; /* Оставляем flex для управления содержимым */
    flex-direction: column;
    position: absolute;
    top: 100%; /* Располагаем под навбаром */
    left: 0;
    width: 100vw; /* Занимает 100% ширины экрана */
    background-color: #fff;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    box-shadow: 0 8px 16px rgba(0,0,0,0.1);
    padding: 10px 0;
    /* Стили для анимации */
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
  }
  .navbar-nav.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
  }
  .navbar-nav .nav-link {
    padding: 10px 20px;
    text-align: center;
  }
  .navbar-nav .nav-item {
    padding: 5px 20px;
  }
  .hero-section {
    padding: 150px 20px 80px 20px;
  }
  .hero-text-content h1 {
    font-size: 2.5rem;
  }
  .expert-container {
    flex-direction: column;
    text-align: center;
  }
  .expert-content-wrapper {
    text-align: center;
  }
  .highlight-item {
    justify-content: center;
  }
  .training-container {
    flex-direction: column;
    align-items: center;
  }
  .info-section {
    text-align: center;
    max-width: 100%;
  }
  .list-row {
    justify-content: center;
  }
  .training-image-container {
    max-width: 500px;
  }
  .second-image {
    left: -20px;
  }
  .approach-wrapper {
    flex-direction: column;
  }
  .approach-image-container {
    position: static;
    margin-top: 30px;
  }
  .ai-training-wrapper {
    flex-direction: column;
  }
  .ai-training-content {
    text-align: center;
    order: 2;
  }
  .ai-training-image {
    order: 1;
    margin-bottom: 30px;
  }
  .ai-benefits-list {
    align-items: center;
  }
  .pricing-preview-shell {
    grid-template-columns: 1fr;
    gap: 28px;
    text-align: center;
  }
  .pricing-preview-copy {
    margin: 0 auto;
  }
  .pricing-preview-grid {
    grid-template-columns: 1fr;
    max-width: 520px;
    margin: 0 auto;
  }
  .pricing-preview-card {
    text-align: center;
  }
  .hr-product-container {
    grid-template-columns: 1fr;
    gap: 30px;
    text-align: center;
  }
  .hr-product-copy {
    margin: 0 auto;
  }
  .hr-product-actions {
    justify-content: center;
  }
  .hr-product-grid {
    max-width: 720px;
    margin: 0 auto;
  }
  .contact-container {
    flex-direction: column;
    margin: 40px auto;
  }
  .contact-info-card {
    width: 100%;
    max-width: 100%;
  }
  .footer-grid {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .footer-cta {
    text-align: center;
  }
}

/* --- Адаптация для мобильных телефонов (до 767px) --- */
@media (max-width: 767px) {
  /* --- Хедер и Hero-секция --- */
  .header-content {
    flex-direction: column;
    align-items: center;
  }
  .header-image img {
    max-width: 100%;
    height: auto;
  }
  .header-text {
    max-width: 100%;
    margin-bottom: 20px;
    text-align: center;
  }
  .hero-text-content h1 {
    font-size: 2rem;
  }
  .hero-partners-logos {
    gap: 20px;
  }
  .pricing-preview-section {
    padding: 56px 20px;
  }
  .pricing-preview-copy h2 {
    font-size: 2rem;
  }
  .pricing-preview-copy p {
    font-size: 1rem;
  }
  .pricing-preview-card {
    min-height: 0;
    padding: 22px 20px;
  }
  .pricing-preview-card strong {
    font-size: 1.62rem;
  }
  .hr-product-section {
    padding: 56px 20px;
  }
  .hr-product-copy h2 {
    font-size: 2rem;
  }
  .hr-product-copy p {
    font-size: 1rem;
  }
  .hr-product-grid {
    grid-template-columns: 1fr;
  }
  .hr-product-tile {
    min-height: 0;
    padding: 22px 20px;
  }
  .overlay-image-1, .overlay-image-2 {
    display: none;
  }
  .buttons {
    flex-direction: column;
    align-items: center;
  }
  .buttons .btn, .buttons a {
    margin-bottom: 10px;
    width: 100%;
    box-sizing: border-box;
  }

  /* --- Модальное окно --- */
  .modal {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.5);
    overflow: auto;
  }
  .modal-content {
    width: 80%;
    max-width: 360px;
    margin: 30% auto;
    padding: 20px;
  }
  .modal-content .form-title {
    font-size: 1.5rem;
  }
  .modal-content .form-description {
    font-size: 1rem;
  }
  .modal-content input,
  .modal-content select,
  .modal-content textarea,
  .modal-content button {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 15px;
  }
  .close {
    position: absolute;
    top: 10px;
    right: 30px;
    font-size: 2rem;
    color: #000000;
  }
  .form-group {
    margin-bottom: 15px;
  }
  #phone {
    width: 100%;
    box-sizing: border-box;
    padding-left: 70px;
    font-size: 16px;
  }
  .iti, .intl-tel-input {
    width: 100% !important;
  }

  /* --- Основные секции --- */
  .about-section {
    padding: 30px 15px;
  }
  .about-section h1 {
    font-size: 24px;
    text-align: center;
  }
  .check-box i {
    margin-right: 10px;
    font-size: 20px;
  }
  .financial-model-section {
    padding: 30px 20px;
  }
  .financial-model-section h2 {
    font-size: 24px;
  }
  .financial-model-section .content {
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }
  .financial-model-section p, .financial-model-section .benefits-list li {
    font-size: 16px;
    text-align: left;
  }
  .financial-model-section .benefits-list {
    margin-top: 20px;
  }
  .financial-model-section .check-icon {
    font-size: 20px;
  }
  .financial-model-section img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
  }
  .training-section {
    padding: 20px;
  }
  .info-section h2 {
    font-size: 20px;
    margin-bottom: 15px;
  }
  .info-section p {
    font-size: 16px;
  }
  .experience-badge {
    position: static;
    margin-top: 50px;
    width: auto;
    text-align: center;
  }
  .experience-badge h3,
  .experience-badge p {
    text-align: center;
  }
  .training-image-container {
    margin-top: 20px;
  }
  .first-image {
    width: 100%;
    height: auto;
  }
  .second-image {
    width: 50%;
    height: auto;
    top: 30px;
    left: 0;
  }
  .our-advantage .advantage-block {
    flex-direction: column;
    align-items: flex-start;
  }
  .our-advantage .text-block {
    padding-right: 0;
    text-align: left;
  }
  .our-advantage .image-block img {
    max-width: 100%;
  }

  .questions-grid {
    grid-template-columns: 1fr;
  }
  .case-studies-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .steps-grid {
    grid-template-columns: 1fr;
  }

  .certificates-grid {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
  }

  .certificates-title {
    width: 100%; /* Занимаем всю доступную ширину для центрирования */
  }

  /* Изменение цвета кнопок в модальных окнах на мобильных */
  .modal-certificate button,
  .modal-review-image button {
    color: #000; /* Черный цвет для кнопок */
  }


  /* --- Футер --- */
  footer {
    padding: 15px 0;
    font-size: 14px;
  }
  footer p {
    margin: 0;
  }
  .umbrella-link {
    display: block;
    margin-top: 10px;
  }
}