
@media screen and (max-width: 768px) {
    .container {
        padding: 0 20px; /* Уменьшаем отступы */
    }

    .sec-1__title, .sec-3__title {
        font-size: 32px; /* Уменьшаем размер шрифта для заголовков */
        line-height: 28px;
    }

    .form__input, .form__btn {
        width: 100%; /* Занимает всю ширину */
    }

    .nav__link, .sec-12__list, .reviews__item, .comment-form {
        flex-direction: column; /* Элементы становятся вертикальными */
    }

    .header__text {
        font-size: 18px; /* Уменьшение шрифта текста в шапке */
    }
    .section-4 {
        background: url("section-4.jpg") #E9E9E9;
        background-repeat: no-repeat;
        background-position: center top;
        max-height: 905px;
    }
}

body {
    font-size: 16px; /* Базовый размер шрифта */
    line-height: 1.5; /* Межстрочный интервал */
}

img {
    max-width: 100%; /* Изображения не выходят за пределы контейнера */
    height: auto; /* Сохранение пропорций изображений */
}

button {
    padding: 10px 20px; /* Больше пространства внутри кнопок */
    font-size: 18px; /* Больший шрифт для лучшей видимости */
}

.section {
    margin-bottom: 20px; /* Добавить отступы между секциями */
}

.nav__link {
    margin: 10px 0; /* Отступы для ссылок навигации */
}
