/* --- Медиа-запросы для адаптивного дизайна всех элементов фронтенда. --- */

/* Десктопные стили (могут быть более подробными) */
@media (max-width: 1200px) {
    .container {
        padding-left: 15px;
        padding-right: 15px;
    }
    .main-navigation ul {
        gap: 20px; /* Уменьшаем расстояние между пунктами меню */
    }
    .slider-content {
        padding-right: 100px;
    }
    .slider-title {
        font-size: 4em;
    }
    .slider-description {
        font-size: 2.2em;
    }
}

/* --- Мобильные и планшетные стили (основной брейкпоинт 992px) --- */
@media (max-width: 992px) {
    /* Header (шапка) */
    .header-top-bar .container {
        flex-direction: column; /* Элементы в столбец */
        align-items: center; /* Центрируем */
        gap: 8px; /* Небольшой отступ между элементами */
    }
    .top-bar-left, .top-bar-right {
        margin-bottom: 0; /* Убираем лишний отступ */
        justify-content: center;
        width: 100%; /* Занимают всю ширину */
    }
    .top-bar-left span, .top-bar-right span {
        margin-right: 15px;
        margin-bottom: 0;
    }

    /* Главная навигационная область */
    .header-main-nav-area .container {
        flex-direction: row; /* Логотип слева, виджеты справа */
        justify-content: space-between; /* Распределяем логотип слева, виджеты справа */
        align-items: center;
        padding: 10px 20px; /* Добавляем отступы */
        text-align: left; /* Сбрасываем центрирование, если было */
    }
    .site-branding {
        margin-bottom: 0; /* Убираем нижний отступ */
    }
    .main-navigation {
        display: none; /* Скрываем основное меню на мобильных */
    }
    .header-widgets {
        margin: 0; /* Убираем верхний/нижний отступ */
        width: auto; /* Ширина по содержимому */
        justify-content: flex-end; /* Выравниваем элементы виджетов справа */
        gap: 15px; /* Уменьшаем отступ между кнопками в шапке */
    }
    .mobile-menu-toggle {
        display: block; /* Показываем кнопку мобильного меню */
        /* Ее позиция уже внутри header-widgets, который align-items: center */
    }
    .client-login-btn {
        padding: 6px 12px; /* Уменьшаем паддинг кнопки */
        font-size: 0.9em;
    }
    .client-login-btn i {
        margin-right: 5px;
    }
    
    /* Мобильное навигационное меню (оверлей) */
    .mobile-nav-overlay {
        justify-content: flex-end; /* Слайд из права */
        align-items: flex-start; /* Выравнивание по верхнему краю */
    }
    .mobile-nav-content {
        width: 280px; /* Ширина мобильного меню на меньших экранах */
        padding: 20px; /* Уменьшаем паддинг */
    }
    .mobile-nav-close {
        font-size: 30px; /* Уменьшаем размер кнопки закрытия */
        top: 10px;
        right: 10px;
    }
    .mobile-navigation ul {
        margin-top: 40px; /* Отступ от верхней части, чтобы не перекрывать кнопку закрытия */
    }
    .mobile-navigation li a {
        padding: 10px 0; /* Уменьшаем паддинг пунктов меню */
        font-size: 1em;
    }


    /* Слайдер на главной */
    .home-slider {
        height: 400px; /* Уменьшаем высоту слайдера */
        justify-content: center;
        align-items: center; /* Центрируем контент по вертикали */
    }
    .slider-content {
        padding: 15px;
        max-width: 90%;
        text-align: center;
    }
    .slider-title {
        font-size: 2.5em; /* Уменьшаем шрифт заголовка */
    }
    .slider-description {
        font-size: 1.5em; /* Уменьшаем шрифт описания */
    }
    .slider-text {
        font-size: 0.9em;
    }
    .slider-nav-btn {
        font-size: 1.5em;
        width: 40px;
        height: 40px;
        line-height: 40px;
    }

    /* Иконки преимуществ */
    .features-icons-section {
        margin-top: -60px; /* Приподнимаем секцию выше */
        padding: 40px 0; /* Уменьшаем паддинг */
    }
    .features-icons-section .container {
        flex-direction: column; /* Элементы в столбец */
        align-items: center;
        gap: 20px;
    }
    .feature-icon-item {
        flex-basis: 90%; /* Занимают почти всю ширину */
        min-width: unset; /* Сброс минимальной ширины */
    }

    /* О нас на главной */
    .about-us-home-section {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 60px 0;
        gap: 30px; /* Уменьшаем отступ между блоками */
    }
    .about-us-image {
        max-width: 90%;
        margin-bottom: 0; /* Убираем нижний отступ, так как есть gap */
    }
    .about-us-content .section-title {
        text-align: center;
    }

    /* Преимущества на главной */
    .advantages-inner-wrapper {
        flex-direction: column;
        gap: 30px;
    }
    .advantages-image-col {
        min-height: 250px;
        width: 90%;
    }
    .advantages-content-col {
        grid-template-columns: 1fr; /* Один столбец */
        margin-top: 0; /* Убираем, так как есть gap */
        gap: 20px;
    }
    .advantage-item {
        flex-direction: column; /* Элементы преимущества в столбец */
        align-items: center;
        text-align: center;
        padding: 25px;
    }
    .advantage-item i {
        margin-bottom: 15px;
    }

    /* Основные услуги */
    .main-services-block {
        padding: 60px 0; /* Уменьшаем паддинг */
    }
    .main-services-block .services-grid {
        grid-template-columns: 1fr; /* Один столбец */
        gap: 25px;
    }
    .service-grid-item {
        padding: 25px;
    }

    /* Призыв к действию */
    .call-to-action-line {
        flex-direction: column;
        gap: 20px;
        padding: 20px;
    }
    .call-to-action-line p {
        font-size: 1.1em;
    }
    .primary-btn {
        width: 100%; /* Кнопка на всю ширину */
    }

    /* Футер */
    .footer-widgets-area {
        grid-template-columns: 1fr; /* Один столбец */
        text-align: center;
        gap: 30px;
    }
    .footer-about .footer-logo img {
        margin: 0 auto 20px;
    }
    .footer-nav-menu ul {
        padding-left: 0; /* Убираем отступ */
    }

    /* Внутренние страницы (общие настройки) */
    .page-title-section {
        padding: 30px 0;
    }
    .page-title {
        font-size: 2.5em;
    }
    .content-block {
        padding: 40px 15px; /* Уменьшаем горизонтальный паддинг */
    }

    /* Страница "О нас" */
    .about-intro, .about-mission, .about-advantages, .about-equipment {
        flex-direction: column;
        text-align: center;
        padding: 30px;
        margin-bottom: 40px;
        gap: 30px;
    }
    .about-intro-image, .equipment-image {
        max-width: 100%;
        flex: none;
        margin-bottom: 0;
    }
    .about-intro-text .section-title, .equipment-text .section-title {
        text-align: center;
    }
    .about-mission ul {
        padding-left: 0; /* Убираем отступ */
        text-align: left;
    }
    .about-mission ul li::before {
        left: 0;
    }
    .advantages-grid {
        grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        gap: 15px;
    }

    /* Страница "Цены" (Аккордеоны) */
    .price-list-intro, .price-notes {
        padding: 30px;
        margin-bottom: 30px;
    }
    .accordion-header {
        padding: 18px 25px;
    }
    .accordion-header .category-title {
        font-size: 1.6em;
    }
    .accordion-content {
        padding: 15px 25px;
    }
    .price-table-header, .price-table-row {
        flex-direction: column; /* Элементы таблицы в столбец */
        align-items: flex-start;
        padding: 10px 0;
    }
    .service-name-col {
        padding-right: 0;
        margin-bottom: 5px;
        flex: none;
        width: 100%;
    }
    .service-price-col {
        text-align: left;
        flex: none;
        width: 100%;
    }
    .service-name-col .service-code, .service-name-col .service-description-text {
        font-size: 0.85em;
    }


    /* Страница "Врачи" */
    .doctors-intro {
        padding: 30px;
        margin-bottom: 40px;
    }
    .doctors-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 20px;
    }
    .doctor-photo {
        height: 250px;
    }
    .doctor-name {
        font-size: 1.5em;
    }
    .doctor-specialization {
        font-size: 1em;
    }

    /* Страница "Документы" */
    .documents-intro, .documents-cta {
        padding: 30px;
        margin-bottom: 40px;
    }
    .documents-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 20px;
    }
    .document-item img {
        height: 300px;
    }
    .lightbox-close {
        top: -10px;
        right: -10px;
        font-size: 35px;
        width: 35px;
        height: 35px;
    }
    .lightbox-nav {
        font-size: 2em;
        padding: 10px;
        left: -40px;
        right: -40px;
    }
    .lightbox-caption {
        font-size: 1em;
        max-width: 95%;
    }

    /* Страница "Политика" */
    .politics-page-content {
        padding: 30px;
        margin-bottom: 40px;
    }
    .politics-intro .section-title {
        font-size: 2em;
    }
    .politics-intro p, .politics-section p, .politics-section ul li {
        font-size: 0.95em;
    }
    .politics-section h3 {
        font-size: 1.4em;
    }

    /* Страница "Отзывы" */
    .reviews-intro, .add-review-section {
        padding: 30px;
        margin-bottom: 40px;
    }
    .reviews-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 20px;
    }
    .review-card {
        padding: 25px;
    }
    .review-form, .appointment-form, .resume-form, .contact-form {
        max-width: 100%;
    }

    /* Страница "Записаться на прием" */
    .appointment-intro {
        padding: 30px;
        margin-bottom: 40px;
    }
    .appointment-form-wrapper {
        padding: 30px;
        margin-left: 15px;
        margin-right: 15px;
    }
    .appointment-form .form-title {
        font-size: 2em;
        margin-bottom: 30px;
    }
    .appointment-form .form-row {
        flex-direction: column;
        gap: 0;
    }
    .appointment-form .form-group {
        margin-bottom: 20px;
    }
    .appointment-form .primary-btn {
        padding: 15px;
        font-size: 1.1em;
    }

    /* Страница "Вакансии" */
    .vacancies-intro, .send-resume-section {
        padding: 30px;
        margin-bottom: 40px;
    }
    .open-vacancies .section-subtitle, .send-resume-section .section-title {
        font-size: 2em;
    }
    .vacancy-title {
        font-size: 1.5em;
    }
    .vacancy-details {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    /* Страница "Контакты" */
    .contacts-intro, .contact-form-section {
        padding: 30px;
        margin-bottom: 40px;
    }
    .contact-info-blocks {
        grid-template-columns: 1fr;
        max-width: 450px;
        margin-left: auto;
        margin-right: auto;
    }
    .contact-block-item {
        padding: 25px;
    }
    .contact-block-title {
        font-size: 1.4em;
    }
    .contact-block-item p {
        font-size: 0.95em;
    }
    .contact-map-section p {
        font-size: 1em;
    }
    .map-wrapper {
        padding: 15px;
    }
    .map-title {
        font-size: 1.2em;
    }
    .map-wrapper iframe {
        height: 300px;
    }

    /* Адаптивность для ЛК */
    .client-area-container,
    .client-login-container {
        margin: 20px;
        padding: 20px;
    }
    .client-area-container h1,
    .client-area-container h2,
    .client-login-container h1 {
        font-size: 1.8em;
        margin-bottom: 20px;
    }
    .client-area-container h3 {
        font-size: 1.4em;
        margin-top: 20px;
        margin-bottom: 15px;
    }
    .appointments-table th,
    .appointments-table td {
        padding: 10px;
        font-size: 0.8em;
    }
    /* Для мобильных устройств можно сделать таблицу прокручиваемой */
    .appointments-table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .client-actions {
        flex-direction: column;
        gap: 15px;
    }
    .client-actions .btn {
        width: 100%;
    }
}


/* --- Брейкпоинт 768px --- */
@media (max-width: 768px) {
    .header-top-bar {
        font-size: 12px;
    }
    .top-bar-left span, .top-bar-right span {
        margin-right: 15px;
    }

    /* Inner pages general adjustment */
    .page-title-section {
        padding: 25px 0;
    }
    .page-title {
        font-size: 2em;
    }
    .content-block {
        padding: 30px 15px;
        margin-bottom: 20px;
    }
    /* Общие отступы для секций на внутренних страницах */
    .about-intro, .about-mission, .about-advantages, .about-equipment,
    .price-list-intro, .price-notes,
    .doctors-intro, .reviews-intro, .add-review-section,
    .documents-intro, .documents-cta,
    .vacancies-intro, .send-resume-section,
    .contacts-intro, .contact-form-section {
        padding: 25px;
        margin-bottom: 30px;
    }
    /* Шрифты заголовков секций */
    .section-title {
        font-size: 2.2em;
    }
    .about-intro-text .section-title, .equipment-text .section-title,
    .doctors-intro .section-title, .reviews-intro .section-title,
    .vacancies-intro .section-title, .contacts-intro .section-title {
        font-size: 1.8em;
    }
    /* Шрифты основного текста */
    .about-intro p, .about-mission p, .about-mission ul li, .advantage-item .advantage-text p,
    .price-list-intro p, .price-notes p, .doctors-intro p, .review-card .review-text,
    .documents-intro p, .documents-cta p, .vacancies-intro p, .vacancy-description,
    .contact-info-blocks p, .contact-map-section p, .contact-form-section p {
        font-size: 0.95em;
    }

    /* Адаптивность для спойлеров цен */
    .accordion-header {
        padding: 15px 20px;
    }
    .accordion-header .category-title {
        font-size: 1.5em;
    }
    .accordion-content {
        padding: 15px 20px;
    }

    /* Адаптивность для таблиц цен */
    .service-name-col .service-code, .service-name-col .service-description-text {
        font-size: 0.8em;
    }

    /* Lightbox */
    .lightbox-close {
        top: -5px;
        right: -5px;
        font-size: 30px;
        width: 30px;
        height: 30px;
    }
    .lightbox-nav {
        font-size: 1.8em;
        padding: 8px;
        left: -30px;
        right: -30px;
    }
    .lightbox-caption {
        font-size: 0.95em;
        max-width: 100%;
        padding: 8px 15px;
    }
    .documents-grid {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 15px;
    }
    .document-item img {
        height: 250px;
    }


    /* Формы */
    .review-form, .appointment-form, .resume-form, .contact-form {
        padding: 25px; /* Уменьшаем паддинг формы */
        margin: 0 15px; /* Боковые отступы */
    }
    .appointment-form .form-row {
        flex-direction: column; /* Колонки формы в столбец */
        gap: 0;
    }
    .appointment-form .form-group {
        margin-bottom: 15px;
    }
    .appointment-form .form-title {
        font-size: 1.8em;
        margin-bottom: 25px;
    }
    .appointment-form .primary-btn {
        padding: 12px;
        font-size: 1em;
    }
    /* Таблицы в ЛК */
    .client-appointments-table th,
    .client-appointments-table td {
        padding: 10px;
        font-size: 0.85em;
    }
}


/* --- Брейкпоинт 576px (для очень маленьких мобильных) --- */
@media (max-width: 576px) {
    .header-top-bar {
        font-size: 10px;
    }
    .top-bar-left span, .top-bar-right span {
        margin-right: 8px;
        margin-bottom: 5px;
    }
    .site-branding img {
        max-height: 45px;
    }
    /* Шапка на очень маленьких экранах */
    .header-main-nav-area .container {
        padding: 5px 10px; /* Еще меньше паддинг */
    }
    .client-login-btn {
        padding: 4px 8px;
        font-size: 0.8em;
    }
    .mobile-menu-toggle {
        font-size: 20px;
        padding: 3px;
    }

    /* Слайдер */
    .home-slider {
        height: 250px;
    }
    .slider-title {
        font-size: 1.8em;
    }
    .slider-description {
        font-size: 1.1em;
    }
    .slider-text {
        font-size: 0.8em;
    }
    .slider-btn {
        padding: 10px 20px;
        font-size: 0.9em;
    }
    .slider-nav-btn {
        font-size: 1em;
        width: 30px;
        height: 30px;
        line-height: 30px;
        left: 10px;
        right: 10px;
    }

    /* Иконки преимуществ */
    .features-icons-section {
        padding: 20px 0;
        margin-top: -40px;
    }
    .feature-icon-item {
        padding: 10px;
    }
    .feature-icon-item i {
        font-size: 40px;
        margin-bottom: 8px;
    }
    .feature-icon-item h4 {
        font-size: 1em;
    }

    /* О нас / Преимущества на главной */
    .about-us-home-section, .advantages-block-section {
        padding: 40px 0;
    }
    .about-us-image {
        max-width: 95%;
    }
    .advantages-image-col {
        min-height: 180px;
        width: 95%;
    }
    .advantage-item {
        padding: 15px;
    }
    .advantage-item i {
        font-size: 35px;
    }
    .advantage-item .advantage-text h3 {
        font-size: 1.1em;
    }
    .advantage-item .advantage-text p {
        font-size: 0.85em;
    }
    .main-services-block {
        padding: 40px 0 20px;
    }
    .service-grid-item {
        padding: 20px;
    }
    .service-grid-item i {
        font-size: 50px;
        margin-bottom: 10px;
    }
    .service-grid-item h3 {
        font-size: 1.2em;
    }
    .service-grid-item p {
        font-size: 0.85em;
    }
    .call-to-action-line p {
        font-size: 1em;
    }
    .primary-btn {
        padding: 8px 15px;
        font-size: 0.9em;
    }
    .floating-btn {
        width: 50px;
        height: 50px;
        font-size: 1.5em;
        bottom: 15px;
        right: 15px;
    }

    /* Inner pages specific adjustments */
    .page-title {
        font-size: 1.8em;
    }
    .about-intro, .about-mission, .about-advantages, .about-equipment,
    .price-list-intro, .price-category-block, .price-notes,
    .doctors-intro, .review-card, .add-review-section, .documents-intro, .documents-cta,
    .vacancies-intro, .send-resume-section, .contacts-intro, .contact-block-item,
    .contact-map-section, .contact-form-section {
        padding: 15px;
        margin-bottom: 25px;
    }
    .about-intro-text .section-title, .equipment-text .section-title,
    .doctors-intro .section-title, .reviews-intro .section-title,
    .vacancies-intro .section-title, .contacts-intro .section-title {
        font-size: 1.6em;
    }
    .about-intro p, .about-mission p, .about-mission ul li, .advantage-item .advantage-text p,
    .price-list-intro p, .price-notes p, .doctors-intro p, .review-text,
    .documents-intro p, .documents-cta p, .vacancies-intro p, .vacancy-description,
    .contact-info-blocks p, .contact-map-section p, .contact-form-section p,
    .main-navigation li a, .header-search-icon, .top-bar-left span, .top-bar-right span {
        font-size: 0.9em;
    }
    .advantages-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .advantage-square-item {
        padding: 15px;
        min-height: unset;
    }
    .advantage-square-item i {
        width: 40px;
        height: 40px;
        margin-bottom: 10px;
        font-size: 40px;
    }
    .advantage-square-item h3 {
        font-size: 1.1em;
    }
    .price-table-header {
        font-size: 0.75em;
        padding: 8px 0;
    }
    .price-table-row {
        padding: 8px 0;
    }
    .service-name-col, .service-price-col {
        font-size: 0.9em;
    }
    /* Accordion on mobile */
    .accordion-header {
        padding: 10px 15px;
    }
    .accordion-header .category-title {
        font-size: 1.4em;
    }
    .accordion-content {
        padding: 10px 15px;
    }
    .doctors-grid, .reviews-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .doctor-card, .review-card {
        max-width: 320px;
        margin: 0 auto;
    }
    .doctor-photo {
        height: 180px;
    }
    .doctor-name {
        font-size: 1.4em;
    }
    .doctor-specialization {
        font-size: 0.9em;
    }
    .doctor-achievements li {
        font-size: 0.85em;
        padding-left: 15px;
    }
    .doctor-achievements li::before {
        font-size: 1em;
        left: 0;
    }
    .documents-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .document-item img {
        height: 150px;
    }
    .document-title {
        font-size: 0.9em;
        min-height: unset;
        padding: 10px;
    }
    .lightbox-close {
        top: 5px;
        right: 5px;
        font-size: 30px;
        width: 30px;
        height: 30px;
    }
    .lightbox-nav {
        font-size: 1.8em;
        left: -30px;
        right: -30px;
        padding: 8px;
    }
    .lightbox-caption {
        font-size: 0.9em;
        padding: 8px 15px;
    }
    .politics-section h3 {
        font-size: 1.2em;
    }
    .reviewer-avatar {
        width: 50px;
        height: 50px;
    }
    .reviewer-name {
        font-size: 1.1em;
    }
    .review-date {
        font-size: 0.8em;
    }
    .review-rating .fas {
        font-size: 1em;
    }
    .review-form label {
        font-size: 0.9em;
    }
    .review-form input, .review-form textarea, .review-form select {
        padding: 10px;
        font-size: 0.9em;
    }
    .rating-stars {
        font-size: 1.3em;
    }
    .checkbox-group label {
        font-size: 0.75em;
    }
    .appointment-form .form-title {
        font-size: 1.6em;
    }
    .appointment-form label {
        font-size: 0.9em;
    }
    .appointment-form input, .appointment-form select, .appointment-form textarea {
        padding: 10px;
        font-size: 0.9em;
    }
    .appointment-form .primary-btn {
        padding: 10px 20px;
        font-size: 1em;
    }
    .vacancy-title {
        font-size: 1.2em;
    }
    .vacancy-requirements li, .vacancy-details span {
        font-size: 0.8em;
    }
    .resume-form input, .resume-form textarea, .resume-form select {
        padding: 10px;
        font-size: 0.9em;
    }
    .contact-block-title {
        font-size: 1.2em;
    }
    .contact-block-item p {
        font-size: 0.9em;
    }
    .map-title {
        font-size: 1.1em;
    }
    .map-wrapper iframe {
        height: 200px;
    }