/*
 * Front-end corrections from the September 2026 technical/usability audit.
 * Loaded after style.min.css so these rules can safely override legacy fixed sizes.
 */

html {
    scroll-behavior: smooth;
}

html,
body,
.wrapper,
.page {
    max-width: 100%;
}

body {
    overflow-x: hidden;
}

@supports (overflow: clip) {
    body {
        overflow-x: clip;
    }
}

section[id],
div[id] {
    scroll-margin-top: 92px;
}

/* Long hero titles must fit 320–430 px screens without clipping. */
.offer__block,
.offer__content,
.offer__title,
.offer__descr {
    min-width: 0;
    max-width: 100%;
}

.offer__title {
    overflow-wrap: anywhere;
    word-break: normal;
    hyphens: auto;
}

/* Reviews slider: never let a slide, text or navigation escape the viewport. */
.recomend,
.recomend__content,
.recomend__wrapper,
.recomend__slider,
.recomend__slider .swiper-wrapper,
.recomend__item,
.doctor-recomend__box {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.recomend__item,
.recomend__title,
.recomend__text,
.doctor-recomend__name,
.doctor-recomend__city {
    overflow-wrap: anywhere;
    word-break: normal;
}

.recomend__navigation {
    box-sizing: border-box;
}

/* FAQ: fluid width, wrapping questions and safe accordion content. */
.faq-section,
.faq-section ._container,
.faq-wrapper,
.faq-item,
.faq-question,
.faq-answer,
.faq-answer-inner,
.faq-answer-content {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.faq-wrapper {
    width: 100%;
}

.faq-item {
    overflow: hidden;
}

.faq-question {
    width: 100%;
    height: auto;
    min-height: 54px;
    white-space: normal;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    text-align: left;
}

.faq-question .box-materials__title {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
}

.faq-question svg {
    flex: 0 0 auto;
}

.faq-answer-content,
.faq-answer-content * {
    max-width: 100%;
    overflow-wrap: anywhere;
}

.faq-answer-content img,
.faq-answer-content video,
.faq-answer-content iframe {
    max-width: 100%;
    height: auto;
}


/* Accessible back-to-top control; positioned above common floating chat controls. */
.audit-back-to-top {
    position: fixed;
    right: 20px;
    bottom: 92px;
    z-index: 80;
    width: 46px;
    height: 46px;
    border: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    color: #093a4a;
    box-shadow: 0 8px 28px rgba(9, 58, 74, 0.18);
    font: inherit;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
}

.audit-back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.audit-back-to-top:focus-visible {
    outline: 3px solid currentColor;
    outline-offset: 3px;
}

@media (max-width: 991.98px) {
    html {
        /* Native smooth fragment restoration can keep running after the first
           touch on mobile. Click navigation is animated by JavaScript. */
        scroll-behavior: auto;
    }
}

@media (max-width: 1440px) {
    body._lock .header {
        /* The menu lives inside the header stacking context. Keep that whole
           context above page cards and third-party floating widgets. */
        z-index: 2147483647;
    }

    body._lock {
        /* The legacy overflow lock resets the root scroll position on mobile.
           Background gestures are blocked in app.js instead. */
        overflow: visible !important;
    }

    .menu__body {
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 767px) {
    section[id],
    div[id] {
        scroll-margin-top: 76px;
    }

    .offer__content {
        width: 100%;
        padding-left: 16px;
        padding-right: 16px;
        box-sizing: border-box;
    }

    .offer__title,
    .offer.offer-ru .offer__title {
        width: auto;
        max-width: 100%;
        font-size: clamp(30px, 9vw, 44px);
        line-height: 1.12;
        letter-spacing: normal;
    }

    .offer__descr {
        font-size: clamp(18px, 5.5vw, 26px);
        line-height: 1.32;
    }

    .recomend {
        border-radius: 48px;
        overflow: hidden;
    }

    .recomend__content {
        width: 100%;
        padding-left: 16px;
        padding-right: 16px;
        box-sizing: border-box;
    }

    .recomend__wrapper {
        width: 100%;
        padding-left: 48px;
        padding-right: 48px;
    }

    .recomend__slider,
    .recomend__slider .swiper-wrapper,
    .recomend__item {
        width: 100%;
    }

    .recomend__item {
        padding-left: 0;
        padding-right: 0;
    }

    .recomend__navigation {
        left: 0;
        right: 0;
        width: 100%;
        padding: 0 2px;
        pointer-events: none;
    }

    .recomend__arrow {
        width: 40px;
        height: 40px;
        border-radius: 10px;
        pointer-events: auto;
    }

    .recomend__arrow svg {
        width: 20px;
        height: 20px;
    }

    .faq-section ._container {
        width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }

    .faq-question {
        padding-left: 14px;
        padding-right: 14px;
    }

    .faq-answer-content {
        padding-left: 14px;
        padding-right: 14px;
    }

    .audit-back-to-top {
        right: 16px;
        bottom: 84px;
        width: 42px;
        height: 42px;
        font-size: 22px;
    }
}

@media (max-width: 430px) {
    .recomend__wrapper {
        padding-left: 44px;
        padding-right: 44px;
    }

    .recomend__title.title {
        font-size: clamp(22px, 7vw, 30px);
        line-height: 1.2;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .audit-back-to-top {
        transition: none;
    }
}