/* Для очень маленьких экранов (смартфоны в портретной ориентации) */
@media (max-width: 480px) {
    .about-center-section {
        padding: 20px 0;
    }
    .section-title {
        font-size: 1.6em;
    }
    .about-center-description {
        font-size: 0.85em;
    }
    .about-center-image-block {
        padding-bottom: 25px;
    }
    .overlay-images {
        padding: 0 0; /* Убираем горизонтальные отступы */
        gap: 5px;
        transform: translateY(30%); /* Еще меньше выступают */
    }
    .overlay-image {
        width: 80px;
        height: 50px;
        border-width: 1px;
    }
    .hero-title {
        font-size: 1.8em;
    }
    .button-secondary {
        padding: 12px 20px;
        font-size: 1em;
    }
    .doctor-name {
        font-size: 1.1em;
    }
    .doctor-title {
        font-size: 0.85em;
    }
    .rehab-count {
        font-size: 0.8em;
        padding: 8px 12px;
    }

    .section-title {
        font-size: 1.6em;
    }
    .methodology-description {
        font-size: 0.85em;
    }
    .feature-item p {
        font-size: 0.9em;
    }
    .feature-icon {
        width: 25px;
        height: 25px;
        min-width: 25px;
    }
    .feature-icon svg {
        width: 16px;
        height: 16px;
    }

    /* Steps block small screens */
    .steps-title {
        font-size: 1.8em;
    }
    .step-card {
        padding: 15px;
    }
    .step-number {
        font-size: 1.8em;
    }
    .step-image-wrapper {
        width: 60px;
        height: 60px;
    }
    .step-title {
        font-size: 1em;
    }
    .step-description {
        font-size: 0.85em;
    }

    /* Why Us Block small screens */
    .why-us-left, .why-us-right {
        padding: 15px;
    }
    .why-us-title {
        font-size: 1.6em;
    }
    .why-us-doctor-image {
        max-width: 90%;
    }
    .percentage-highlight {
        font-size: 1.8em;
    }
    .item-title {
        font-size: 1em;
    }
    .item-description {
        font-size: 0.8em;
    }

    /* Addictions Block small screens */
    .addictions-title {
        font-size: 1.6em;
    }
    .addiction-card {
        padding: 8px 10px;
    }
    
    .addiction-name {
        font-size: 0.85em;
    }

    /* Team Block small screens */
    .team-main-title {
        font-size: 1.6em;
    }
    .team-member-card {
        padding: 12px;
    }
   
    .member-role {
        font-size: 0.85em;
    }
    .team-promo-text-overlay {
        font-size: 0.9em;
    }
}


/* Для мобильных устройств (смартфоны) */
@media (max-width: 768px) {
	img.logo-icon {
    width: 210px;
}
.contact-content {
		padding: 0 20px;
    }
	.navbar {
                padding: 10px 0;
                display: flex; /* Используем flexbox для мобильной версии */
                justify-content: space-between;
                align-items: center;
            }

            .navbar-brand {
                float: none; /* Отменяем float */
                padding: 0 15px;
            }

            .menu-toggle {
                display: block; /* Показать кнопку бургера */
                float: none; /* Отменяем float */
                order: 2; /* Располагаем справа от бренда */
                padding: 0 15px;
            }

            .nav-list {
                display: none;
        width: 100%;
        float: none;
        flex-direction: column;
        background-color: #1a335e;
        position: absolute;
        top: 90px;
        left: 0;
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
        z-index: 999;
            }

            .nav-list.active {
                display: flex; /* Показать меню при активации */
            }

            .nav-list > li {
                display: block; /* Элементы списка занимают всю ширину */
                border-bottom: 1px solid #444; /* Разделитель */
            }

            .nav-list > li:last-child {
                border-bottom: none;
            }

            .nav-list > li > a {
                padding: 12px 15px;
				color: white;
            }

            /* Стили для выпадающего меню на мобильных */
            .submenu {
                position: static; /* Отменяем абсолютное позиционирование */
                background-color: #555; /* Более темный фон для подменю */
                box-shadow: none;
                width: 100%;
                /* Отменяем fade-эффект для мобильных, контролируем display через JS */
                opacity: 1;
                visibility: visible;
                transform: translateY(0);
                display: none; /* Скрыть по умолчанию, показывать через JS */
            }

            .nav-list > li.has-submenu.active .submenu {
                display: block; /* Показать подменю, когда родитель активен (JS добавит active) */
            }

            .submenu li a {
                padding: 10px 30px; /* Отступ для подпунктов */
                font-size: 0.9em;
            }

            /* Стрелка для индикации наличия подменю */
            .nav-list > li.has-submenu > a {
                position: relative;
            }

            .nav-list > li.has-submenu > a::after {
                content: '\f0d7'; /* Иконка стрелки вниз из Font Awesome */
                font-family: "Font Awesome 5 Free";
                font-weight: 900;
                position: absolute;
                right: 15px;
                top: 50%;
                transform: translateY(-50%) rotate(0deg);
                transition: transform 0.3s ease;
            }

            .nav-list > li.has-submenu.active > a::after {
                transform: translateY(-50%) rotate(180deg); /* Повернуть стрелку вверх */
            }
	.nav-list > li.has-submenu.active > a {
                 background-color: #007bff; /* Пример: синий фон */
                 color: #fff; /* Белый текст */
            }
            .nav-list > li > a:hover {
                /* Можно оставить обычный hover или сделать его более приглушенным */
                background-color: #555;
            }
	.about-center-section {
        padding: 30px 0;
    }
    .about-center-content {
        gap: 20px;
    }
    .about-center-text-block {
        text-align: left; /* Можно вернуть налево, если текст длинный */
    }
    .section-title {
        font-size: 1.8em;
    }
    .about-center-description {
        font-size: 0.9em;
    }
    .about-center-image-block {
        padding-bottom: 30px;
    }
    .overlay-images {
        padding: 0 2%;
        gap: 8px;
        transform: translateY(40%); /* Меньше выступают */
    }
    .overlay-image {
        width: 100px;
        height: 65px;
        border-width: 2px;
    }
    .header-content {
        padding: 0 15px;
    }

    .logo-text {
        font-size: 1.1em;
    }

    .logo-tagline {
        display: none; /* Скрыть на очень маленьких экранах */
    }

    .nav-menu {
        display: none; /* Скрыть обычное меню */
        flex-direction: column;
        position: fixed;
        top: 0;
        left: -100%; /* Изначально за экраном */
        width: 100%;
        height: 100%;
        background-color: rgba(255, 255, 255, 0.95);
        z-index: 1000;
        padding-top: 80px; /* Отступ, чтобы не перекрывать хедер */
        transition: left 0.3s ease;
        align-items: center; /* Центрировать элементы по горизонтали */
        justify-content: flex-start; /* Начать с верха */
    }

    .nav-menu.active {
        left: 0; /* Выдвинуть меню */
        display: flex; /* Показать меню при активации */
    }

    .nav-menu ul {
        flex-direction: column;
        width: 100%;
        text-align: center;
        gap: 20px; /* Отступ между пунктами */
    }

    .nav-menu li {
        width: 100%;
        padding: 10px 0;
    }

    .nav-menu a {
        font-size: 1.2em;
        padding: 10px 0;
        display: block; /* Чтобы ссылка занимала всю ширину li */
    }

    .nav-menu .header-button {
        margin-left: 0;
        margin-top: 20px; /* Отступ кнопки от других пунктов */
        width: 80%; /* Кнопка занимает большую часть ширины */
    }


    .hamburger {
        display: flex; /* Показать гамбургер */
    }

    /* Hero Section на мобильных */
    .hero-content {
        flex-direction: column; /* Элементы в колонку */
        text-align: center;
        gap: 30px;
		padding: 0;
    }
	.about-center-inner {
    flex-direction: column;
}

    .hero-text-block,
    .hero-image-block {
        max-width: 100%; /* Занимают всю ширину */
        padding: 0 20px;
    }

    .hero-title {
        font-size: 2em; /* Меньше на мобильных */
    }

    .hero-description {
        font-size: 0.95em;
    }

    .hero-doctor-image {
        max-width: 80%; /* Уменьшить изображение */
        margin: 0 auto;
    }

    .doctor-info-card {
        position: static; /* Статичное позиционирование на мобильных */
        margin-top: 20px; /* Отступ от изображения */
        left: auto;
        right: auto;
        width: 100%; /* Занимает всю доступную ширину */
        box-sizing: border-box; /* Учитывать padding в ширине */
    }

    .hero-section {
        padding: 30px 0;
    }

    /* Methodology block on mobile */
    .methodology-content {
        flex-direction: column; /* Элементы в колонку */
        text-align: center;
    }
    .methodology-text-block,
    .methodology-image-block {
        max-width: 100%; /* Занимают всю ширину */
    }
    .section-title {
        font-size: 1.8em;
    }
    .methodology-description {
        font-size: 0.9em;
    }
    .feature-item {
        flex-direction: row; /* Элементы внутри карточек остаются в ряд */
        align-items: center;
        text-align: left; /* Текст в карточках слева */
        width: 100%; /* Занять всю ширину */
    }
    .feature-icon {
        margin-right: 10px; /* Отступ иконки от текста */
        flex-shrink: 0; /* Не сжимать иконку */
    }
    .methodology-image {
        max-width: 90%; /* Немного уменьшить изображение */
        margin: 0 auto;
    }

    /* Steps block on mobile */
    .steps-section {
        padding: 30px 0;
    }
    .steps-grid {
        display: flex;
		flex-direction: column;
    }
    .steps-title-col {
        grid-column: 1 / span 1; /* Занимает всю ширину */
        grid-row: auto; /* Автоматический ряд */
        padding-right: 0;
        text-align: center; /* Центрируем заголовок */
    }
    .steps-title {
        font-size: 2em;
    }
    /* Все карточки идут по порядку в одной колонке */
    .step-card-1, .step-card-2, .step-card-3, .step-card-4, .step-card-5 {
        grid-column: 1 / span 1;
        grid-row: auto;
    }
    .step-card {
        padding: 20px;
        text-align: left; /* Текст в карточках по левому краю */
    }
    .step-number {
        font-size: 2em; /* Меньше на мобильных */
    }
    .step-image-wrapper {
        width: 70px;
        height: 70px;
        margin-bottom: 10px;
    }
    .step-title {
        font-size: 1.1em;
    }
    .step-description {
        font-size: 0.9em;
    }

    /* Why Us Block on mobile */
    .why-us-section {
        padding: 30px 0;
    }
    .why-us-content {
        flex-direction: column; /* Всегда в колонку на мобильных */
        margin: 0 15px; /* Отступы по бокам */
		padding:0;
    }
    .why-us-left, .why-us-right {
        padding: 20px;
        text-align: center; /* Центрировать содержимое */
        align-items: center; /* Центрировать элементы в колонке */
    }
    .why-us-title {
        font-size: 1.8em;
        text-align: center;
    }
    .why-us-doctor-image {
        max-width: 80%;
        margin-top: 15px;
		display: none;
    }
    .why-us-item {
        text-align: center; /* Центрировать текст внутри элементов */
    }
    .percentage-highlight {
        font-size: 2em;
    }
    .item-title {
        font-size: 1.2em;
    }
    .item-description {
        font-size: 0.85em;
    }

    /* Addictions Block on mobile */
    .addictions-section {
        padding: 30px 0;
    }
    .addictions-content {
        flex-direction: column; /* Заголовок сверху, карточки снизу */
        gap: 20px;
    }
    .addictions-title-col {
        width: 100%; /* Заголовок занимает всю ширину */
        text-align: center;
    }
    .addictions-title {
        font-size: 1.8em;
    }
    .addictions-grid {
        grid-template-columns: 1fr; /* Одна колонка для карточек */
        gap: 15px;
        width: 100%;
    }
    .addiction-card {
        flex-direction: row; /* Карточка остается в ряд */
        align-items: center;
        text-align: left; /* Текст в карточках по левому краю */
        padding: 10px 15px;
    }
   
    .addiction-name {
        font-size: 0.9em;
    }

    /* Team Block on mobile */
    .team-section {
        padding: 30px 0;
    }
    .team-main-title {
        font-size: 1.8em;
    }
    .team-grid {
        grid-template-columns: 1fr; /* Одна колонка для карточек специалистов */
        gap: 15px;
    }
    .team-member-card {
        padding: 15px;
    }
    
    
    .member-role {
        font-size: 0.9em;
    }
    .team-promo-card {
        min-height: 200px; /* Уменьшить мин. высоту на мобильных */
    }
    .team-promo-text-overlay {
        font-size: 1em;
        padding: 10px;
    }
}



/* Для планшетов и небольших десктопов */
@media (max-width: 1024px) {
	/* Адаптивность для подвала (footer) */
/* АДАПТИВНОСТЬ */
    .about-center-content {
        flex-direction: column; /* Элементы в колонку */
        gap: 30px;
    }
    .about-center-text-block,
    .about-center-image-block {
        max-width: 100%; /* Занимают всю ширину */
        text-align: center; /* Центрируем текст */
    }
    .about-center-description {
        margin-top: 15px;
    }
    .about-center-image-block {
        padding-bottom: 40px; /* Увеличиваем отступ, чтобы наложенные изображения не налезали на следующий блок */
    }
    .overlay-images {
        padding: 0 5%;
        gap: 10px;
        transform: translateY(50%); /* Все еще выступают */
    }
    .overlay-image {
        width: 120px;
        height: 80px;
        border-width: 2px;
    }
    .contact-content {
        flex-direction: column; /* Элементы в колонку */
        gap: 20px;
        box-shadow: none; /* Убираем тень для всего блока, чтобы каждый подблок имел свою */
        background-color: transparent; /* Убираем общий фон */
		padding: 0 20px;
    }
    .contact-form-block,
    .contact-map-block {
        flex: none; /* Отключаем flex-grow */
        max-width: 100%;
        width: 100%;
        border-radius: 15px; /* Скругление для каждого подблока */
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05); /* Тень для каждого подблока */
        background-color: white; /* Фон для каждого подблока */
    }
    .contact-form-block {
        padding: 30px;
    }
    .contact-form-title {
        font-size: 1.8em;
        margin-bottom: 20px;
        text-align: center; /* Центрируем заголовок */
    }
    .form-submit-button {
        align-self: center; /* Центрируем кнопку формы */
    }
    .checkbox-container {
        text-align: left; /* Текст чекбокса по левому краю */
        padding-left: 30px;
    }
    .checkmark {
        top: 2px;
        height: 20px;
        width: 20px;
    }
    .checkmark:after {
        left: 6px;
        top: 2px;
        width: 4px;
        height: 8px;
    }
    .contact-map-block {
        min-height: 300px;
        border-radius: 15px; /* Полное скругление на всех углах */
        justify-content: flex-start; /* Кнопка сверху */
    }
    .map-button {
        align-self: center; /* Центрируем кнопку карты */
        margin: 20px auto; /* Отступы и центрирование */
    }
    .header-content {
        padding: 0 15px;
    }

    .nav-menu ul {
        gap: 15px;
    }

    .nav-menu a {
        font-size: 0.9em;
    }

    .button-primary {
        padding: 10px 20px;
    }

    .hero-title {
        font-size: 2.5em;
    }

    .hero-description {
        font-size: 1em;
    }

    .hero-doctor-image {
        max-width: 90%; /* Немного уменьшить */
        margin: 0 auto;
    }

    /* Methodology block */
    .methodology-section {
        padding: 40px 0;
    }
    .methodology-content {
        gap: 30px;
    }
    .section-title {
        font-size: 2em;
    }
    .methodology-description {
        font-size: 0.95em;
    }
    .feature-item {
        padding: 12px 15px;
        font-size: 0.95em;
    }

    /* Steps block */
    .steps-section {
        padding: 40px 0;
    }
    .steps-grid {
		display: flex;
		flex-direction: column;
    }
    .steps-title-col {
        grid-column: 1 / span 1; /* Заголовок на своей колонке */
        grid-row: 1 / span 3; /* Распространить на несколько рядов */
    }
    /* Переставляем карточки для лучшего потока на 2 колонках */
    .step-card-1 { grid-column: 2 / 3; grid-row: 1 / 2; }
    .step-card-2 { grid-column: 3 / 4; grid-row: 1 / 2; }
    .step-card-3 { grid-column: 2 / 3; grid-row: 2 / 3; }
    .step-card-4 { grid-column: 3 / 4; grid-row: 2 / 3; }
    .step-card-5 { grid-column: 2 / 3; grid-row: 3 / 4; } /* последняя карточка на новом ряду */

    .steps-title {
        font-size: 2em;
    }
    .step-card {
        padding: 20px;
        width: 100%;
    }
    .step-title {
        font-size: 1.1em;
    }
    .step-description {
        font-size: 0.9em;
    }

    /* Why Us Block */
    .why-us-content {
        flex-direction: column; /* На планшетах - в колонку */
        margin: 0 20px; /* Отступы по бокам */
		padding:0;
    }
    .why-us-left, .why-us-right {
        padding: 30px;
        max-width: 100%;
        flex: none; /* Убираем flex-grow */
    }
    .why-us-doctor-image {
        max-width: 70%; /* Уменьшить на планшетах */
        margin: 20px auto 0 auto; /* Центрировать и отступ сверху */
    }
    .why-us-title {
        font-size: 2.2em;
        text-align: center; /* Центрируем заголовок */
        width: 100%;
    }
    .percentage-highlight {
        font-size: 2.5em;
    }
    .item-title {
        font-size: 1.3em;
    }
    .item-description {
        font-size: 0.9em;
    }

    /* Addictions Block */
    .addictions-section {
        padding: 40px 0;
    }
    .addictions-content {
        flex-direction: column; /* В колонку на планшетах */
        gap: 30px;
        text-align: center; /* Центрируем заголовок */
    }
    .addictions-title-col {
        width: auto; /* Автоматическая ширина */
        text-align: center;
    }
    .addictions-title {
        font-size: 2em;
    }
    .addictions-grid {
        grid-template-columns: repeat(1, 1fr); /* 2 колонки остаются */
        width: 100%; /* Занимает всю ширину */
    }
    .addiction-card {
        padding: 12px;
    }
    .addiction-name {
        font-size: 0.95em;
    }
   

    /* Team Block */
    .team-section {
        padding: 40px 0;
    }
    .team-content {
        grid-template-columns: 1fr; /* Одна колонка на планшетах */
        gap: 30px;
    }
    .team-main-title {
        text-align: center;
    }
    .team-grid {
        grid-template-columns: repeat(1, 1fr); /* Остаются 2 колонки для карточек */
        gap: 15px;
    }
    .team-member-card {
        padding: 15px;
    }
    
    .member-role {
        font-size: 0.95em;
    }
    .team-promo-card {
        min-height: 250px;
    }
    .team-promo-text-overlay {
        font-size: 1.2em;
        padding: 15px;
    }
	.footer {
        padding: 30px 0;
    }
    .footer-content {
        justify-content: center; /* Центрируем элементы */
        gap: 25px;
        text-align: center;
    }
    .footer-logo {
        width: 100%; /* Занимает всю ширину */
        justify-content: center; /* Центрируем логотип */
    }
    .footer-logo-tagline {
        display: inline-block; /* Теперь в строку с названием */
        margin-left: 5px;
    }
    .footer-contact-item {
        justify-content: center; /* Центрируем контактные данные */
        width: auto; /* Автоматическая ширина */
    }
}

@media (max-width: 480px) {
    .footer {
        padding: 20px 0;
    }
    .footer-content {
        gap: 15px;
    }
    .footer-logo-text {
        font-size: 1.1em;
    }
    .footer-contact-item .contact-value {
        font-size: 0.85em;
    }
    .contact-section {
        padding: 20px 0;
    }
    .contact-form-block {
        padding: 20px;
    }
    .contact-form-title {
        font-size: 1.4em;
        margin-bottom: 10px;
    }
    .form-input,
    .form-textarea {
        padding: 10px;
        font-size: 0.9em;
    }
    .checkbox-container {
        font-size: 0.8em;
        padding-left: 25px;
    }
    .checkmark {
        height: 16px;
        width: 16px;
    }
    .checkmark:after {
        left: 4px;
        top: 1px;
        width: 3px;
        height: 6px;
    }
    .form-submit-button {
        padding: 10px 25px;
        font-size: 0.85em;
    }
    .contact-map-block {
        min-height: 200px;
    }
    .map-button {
        padding: 8px 15px;
        font-size: 0.8em;
        margin: 10px auto;
    }
    .map-button svg {
        width: 12px;
        height: 12px;
    }
}

@media (max-width: 768px) {
	.team-section-wrapper {
    flex-direction: column-reverse;
}
* {
    .footer {
        padding: 25px 0;
    }
    .footer-content {
        flex-direction: column; /* Элементы в колонку */
        gap: 20px;
    }
    .footer-logo {
        flex-direction: column; /* Логотип в колонку */
        gap: 5px;
    }
    .footer-logo-tagline {
        margin-left: 0;
    }
    .footer-contact-item {
        flex-direction: column; /* Контакты в колонку */
        gap: 5px;
    }
    .footer-contact-item svg {
        margin-bottom: 5px;
    }
    .footer-contact-item .contact-label {
        font-size: 0.8em;
    }
    .footer-contact-item .contact-value {
        font-size: 0.9em;
    }
    .contact-section {
        padding: 30px 0;
    }
    .contact-form-block {
        padding: 25px;
    }
    .contact-form-title {
        font-size: 1.6em;
        margin-bottom: 15px;
    }
    .form-input,
    .form-textarea {
        padding: 12px;
        font-size: 0.95em;
    }
    .checkbox-container {
        font-size: 0.85em;
        padding-left: 28px;
    }
    .checkmark {
        height: 18px;
        width: 18px;
    }
    .checkmark:after {
        left: 5px;
        top: 1px;
        width: 3px;
        height: 7px;
    }
    .form-submit-button {
        padding: 12px 30px;
        font-size: 0.9em;
    }
    .contact-map-block {
        min-height: 250px;
    }
    .map-button {
        padding: 10px 20px;
        font-size: 0.85em;
        margin: 15px auto;
    }
    .map-button svg {
        width: 14px;
        height: 14px;
    }
}