/* legal.ua — conversion lane, 20.09.2026.
   Additive overrides only. Loaded from chunk 51 FOOTER as its own URL, so a change
   here never needs the main.css ?v bump that chunk 50 owns.
   Palette is the site's own: navy #1c3143, deep navy #143443, green #2e7d32. */

/* ------------------------------------------------------------------ */
/* 1. Mobile sticky contact bar (conv-03)                              */
/* ------------------------------------------------------------------ */
.lead-cta-bar { display: none; }

@media (max-width: 768px) {
    .lead-cta-bar {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        height: 56px;
        z-index: 1200;
        background: #1c3143;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, .28);
        box-sizing: border-box;
    }
    .lead-cta-bar a {
        flex: 1 1 33.333%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        min-height: 56px;
        padding: 6px 4px;
        color: #fff;
        font-size: 12px;
        line-height: 1.15;
        letter-spacing: .02em;
        text-align: center;
        text-decoration: none;
        box-sizing: border-box;
        border-left: 1px solid rgba(255, 255, 255, .16);
        -webkit-tap-highlight-color: rgba(255, 255, 255, .12);
        transition: background-color .15s linear;
    }
    .lead-cta-bar a:first-child { border-left: 0; }
    .lead-cta-bar a:active { background: #143443; }
    .lead-cta-bar a:focus-visible { outline: 2px solid #fff; outline-offset: -3px; }
    .lead-cta-bar svg {
        width: 20px;
        height: 20px;
        display: block;
        fill: none;
        stroke: #fff;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round;
    }
    .lead-cta-bar .lead-cta-label {
        display: block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }
    body { padding-bottom: 56px; }
    .scrollToTop { bottom: 68px !important; }
}

/* ------------------------------------------------------------------ */
/* 2. Cookie banner on small screens (conv-04)                         */
/*    Was 420x151 on a 390px viewport, covering «Замовити консультацію».*/
/*    The banner's own script writes display:block inline, so display   */
/*    here has to carry !important to win over it.                      */
/* ------------------------------------------------------------------ */
@media (max-width: 768px) {
    /* 21.09.2026 verifier fix: the banner script hides the banner with an
       inline style after the visitor accepts, and an unscoped
       display:flex !important here beat that inline style, so on a phone the
       banner stayed on screen for ever and ate 80px of the first view. The
       flex layout now applies only while the script asks for it to show. */
    #cookie-banner[style*="display: block"],
    #cookie-banner[style*="display:block"] {
        display: flex !important;
    }
    #cookie-banner {
        align-items: center;
        gap: 10px;
        box-sizing: border-box;
        left: 0;
        right: 0;
        width: 100% !important;
        max-width: 100%;
        max-height: 80px;
        padding: 8px 12px !important;
        text-align: left !important;
        background-color: #1c3143 !important;
        z-index: 1300;
    }
    #cookie-banner.show { bottom: 56px !important; }
    /* the wording scrolls if it is long; the accept button never moves out of reach */
    #cookie-banner p {
        flex: 1 1 auto;
        margin: 0;
        max-height: 64px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        font-size: 12px;
        line-height: 1.35;
        text-align: left;
    }
    #cookie-banner button {
        flex: 0 0 auto;
        display: block !important;
        margin: 0 !important;
        min-height: 36px;
        padding: 0 16px;
        font-size: 13px;
        border: 0;
        border-radius: 3px;
        background: #2e7d32;
        color: #fff;
        cursor: pointer;
        white-space: nowrap;
    }
}

/* ------------------------------------------------------------------ */
/* 3. Tap targets and field sizing on mobile (conv-16, conv-08)        */
/*    16px on inputs also stops iOS zooming into the field on focus.   */
/* ------------------------------------------------------------------ */
@media (max-width: 768px) {
    .fe-label .i_input,
    .fe-label .i_input_m1,
    .fe-label .i_input2,
    .fe-label input[type="text"],
    .fe-label input[type="email"],
    .fe-label input[type="tel"],
    .fe-label textarea {
        min-height: 44px;
        font-size: 16px;
        box-sizing: border-box;
    }
    .fe-label textarea,
    .fe-label .input_area,
    .fe-label .input_area_m1 { min-height: 88px; }

    input[type="submit"].but,
    input[type="submit"].submit,
    button.but,
    .but {
        min-height: 44px;
        padding-left: 24px;
        padding-right: 24px;
        box-sizing: border-box;
    }

    .hdr-ct-icon a {
        min-width: 44px;
        min-height: 44px;
        background-position: center;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

/* ------------------------------------------------------------------ */
/* 4. Breadcrumb current item contrast (conv-18)                        */
/*    #a0a0a0 on #fff = 2.61:1. #666 = 5.74:1.                          */
/* ------------------------------------------------------------------ */
.B_currentCrumb { color: #666 !important; }

@media (max-width: 768px) {
    .bread-crumbs { display: block; }
    .bread-crumbs ul { display: flex; flex-wrap: wrap; overflow: visible; }
    .bread-crumbs li { display: inline-block; word-break: normal; }
}

/* ------------------------------------------------------------------ */
/* 5. Header weight on small screens (conv-03 second half)              */
/*    li.dsdd repeats the Facebook / LinkedIn / YouTube sprite icons    */
/*    that .messengers already shows, and the repeat is clipped.        */
/* ------------------------------------------------------------------ */
@media (max-width: 768px) {
    .header_s_p_text.messengers li.dsdd { display: none; }
    .header-wrap .header_first { padding-bottom: 0; }
    .header_second .header_s_p_text.messengers { margin: 6px 0; }
    .header_second .header_s_p_text.messengers li.hdr-ct-icon { margin: 0 4px; }
    .header_second .header_s_p_text.messengers li.hdr-ct-icon a {
        background-size: 34px 34px;
        width: 44px;
        height: 44px;
    }
    .header_f_t, .header_f_m { margin-bottom: 0; }
}

/* ------------------------------------------------------------------ */
/* 6. Form result feedback (LEADS-03)                                   */
/* ------------------------------------------------------------------ */
.lead-formerror {
    display: none;
    margin: 0 0 12px;
    padding: 10px 12px;
    border-left: 3px solid #c00000;
    background: #fdf1f1;
    color: #8a1010;
    font-size: 14px;
    line-height: 1.4;
    box-sizing: border-box;
}
.lead-formerror.is-visible { display: block; }

.lead-ok {
    display: none;
    padding: 20px 0 30px;
    text-align: center;
}
.lead-ok.is-visible { display: block; }
.lead-ok p {
    margin: 8px 0 0;
    color: #2e7d32;
    font-weight: bold;
    text-align: center;
}

/* Privacy note under the submit (conv-09) */
.lead-privacy {
    margin: 10px 0 0;
    font-size: 12px;
    line-height: 1.4;
    color: #5c717a;
}
.lead-privacy a { color: #1c3143; text-decoration: underline; }

/* ------------------------------------------------------------------ */
/* 7. Price hexagon on service pages (D-18)                             */
/*    The hexagon is sized for "700"; a worded price has to shrink to   */
/*    fit rather than run past the edge.                                */
/* ------------------------------------------------------------------ */
.kartka_cena .kartka_cena_txt,
.kartka_cena_txt {
    display: block;
    font-size: 21px;
    line-height: 1.1;
    padding: 0 6px;
    overflow-wrap: break-word;
    hyphens: auto;
}
@media (max-width: 768px) {
    .kartka_cena_txt { font-size: 18px; }
}

/* ------------------------------------------------------------------ */
/* 8. Mobile lane, 21.09.2026 (mobile-leads)                           */
/* ------------------------------------------------------------------ */

/* 8.1 Breadcrumbs used to run over the H1 on service pages.
   .header_menu_line is a fixed 33px strip; on a 390px screen the trail
   wrapped to 132px and the overflow landed on top of the heading
   (bottom 453px vs H1 top 355px on /ru/registraciya-ooo.html).
   The trail stays one line and scrolls sideways, so the strip keeps its
   height and the decorative gradient under it stays where it belongs.
   Desktop keeps the table layout from main.css. */
@media (max-width: 768px) {
    .bread-crumbs {
        display: block;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .bread-crumbs::-webkit-scrollbar { display: none; }
    .bread-crumbs ul {
        display: flex;
        flex-wrap: nowrap;
        width: max-content;
        min-width: 100%;
        overflow: visible;
    }
    .bread-crumbs li {
        display: inline-block;
        float: none;
        word-break: normal;
        white-space: nowrap;
    }
    .bread-crumbs li .B_crumb,
    .bread-crumbs li .B_currentCrumb {
        white-space: nowrap;
    }
}

/* 8.2 Tap targets below 44px.
   Header search submit was 26x20 inside the mobile search modal, and the
   magnifier that opens it was 36px wide. Both live under the modal's own
   992px breakpoint, so the fix uses the same one. */
@media (max-width: 992px) {
    .search-modal-overlay .header-search .header_f_sss.submit-btn {
        position: static;
        align-self: center;
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
        min-width: 44px;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background-position: center center;
        background-size: 22px auto;
        border-radius: 4px;
        -webkit-tap-highlight-color: rgba(255, 255, 255, .12);
    }
    .search-modal-overlay .header-search .search-input.header_f_ss {
        min-height: 44px;
        box-sizing: border-box;
        /* width:100% from main.css pushed the 44px button out of the panel */
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
    }
    .mobile-search-trigger {
        width: 44px;
        height: 44px;
        box-sizing: border-box;
        padding: 12px 5px 5px;
        background-position: center center;
        background-size: 22px auto;
    }
}

/* 8.3 Comment button (Tickets) was 27px tall. */
@media (max-width: 768px) {
    .com_button,
    .leave-comment .com_button {
        min-height: 44px;
        padding: 10px 18px;
        box-sizing: border-box;
    }
}

/* 8.4 The trail scrolls sideways, so the right edge gets a soft fade —
   otherwise the last crumb looks cut off rather than scrollable. */
@media (max-width: 768px) {
    .bread-crumbs {
        -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 28px), rgba(0, 0, 0, 0) 100%);
        mask-image: linear-gradient(to right, #000 calc(100% - 28px), rgba(0, 0, 0, 0) 100%);
    }
}

/* ------------------------------------------------------------------ */
/* 9. Finishing pass, 21.09.2026 (ux-tail)                             */
/*    Everything below sits inside a mobile media query; the desktop   */
/*    cascade is untouched. Reuses the sizes and colours already in    */
/*    section 8 — no new tokens.                                       */
/* ------------------------------------------------------------------ */

/* 9.1 Search modal, 360-992px.
   The field still carried margin-right:-25px and float:left from
   .header_f_ss in main.css. Inside the flex row of the modal the float
   is ignored, the negative margin is not: it swallowed the 10px gap and
   pulled the field 15px under the 44x44 submit (field right edge 346
   against button left edge 331 at 390px). The panel itself measured
   width:90% + 40px padding in content-box, i.e. 391px inside a 390px
   viewport, and it inherited the desktop margin 5px 4% 0 1%. */
@media (max-width: 992px) {
    .search-modal-overlay .header-search {
        box-sizing: border-box;
        margin: 40px auto 0 !important;
    }
    .search-modal-overlay .header-search .search-input.header_f_ss {
        margin: 0;
        float: none;
    }
}

/* 9.2 Tap targets on mobile: standalone controls reach 44px.
   Links that sit inside a sentence keep their line box — growing them
   would tear the paragraph apart. */
@media (max-width: 768px) {

    /* 9.2.1 Section links in the top strip (Пресс-центр, Цены, …).
       The row gap drops 20px -> 6px, so the taller targets cost nothing:
       the H1 on /ru/registraciya-ooo.html sits at 345px instead of 355. */
    .header_first .header_f_m ul { line-height: 0; }
    .header_first .header_f_m li { line-height: 0; padding: 0 4px; margin-bottom: 6px; }
    .header_first .header_f_m li > a {
        display: inline-block;
        vertical-align: top;
        padding: 12px 4px;
        line-height: 18px;
        min-height: 44px;
        box-sizing: border-box;
    }

    /* 9.2.2 Language switcher */
    .header_first .header_f_t li.dropdown-bs > a.dropdown-toggle {
        display: inline-block;
        min-height: 44px;
        line-height: 44px;
        padding: 0 8px;
        box-sizing: border-box;
    }

    /* 9.2.3 Buttons on service pages and in the footer */
    .right_block .kartka_knopki > a.kartka_knop,
    .right_block .kartka_knopki > a.modal,
    .service-wrap .kartka_knopki > a.kartka_knop,
    .service-wrap .ls-cta > a.modal,
    .footer .buttons > a.modal,
    .footer .buttons > a.but {
        min-height: 44px;
        line-height: 1.25;
        padding-top: 10px;
        padding-bottom: 10px;
        box-sizing: border-box;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* 9.2.4 Phone in the price card, phone and mail in the footer */
    .kartka_knopki1 .kartka_knop1 > a,
    .f_c_b .working-time ul.messengers li > a.footer-phone,
    .f_c_b .contacts-wrap > a[href^="mailto"] {
        display: inline-block;
        min-height: 44px;
        line-height: 44px;
        box-sizing: border-box;
    }

    /* 9.2.5 Social icons: the footer sprite row and the share row */
    .f_c_b .social-icons > a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        box-sizing: border-box;
    }
    .ya-share2 .ya-share2__list .ya-share2__item > a.ya-share2__link {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        box-sizing: border-box;
    }

    /* 9.2.6 Comment form fields and the reply link */
    .comment_all .add-comment input.input_comment_m,
    .comment_all .add-comment input.input_comment_l,
    .comment_all .add-comment input.input_comment {
        min-height: 44px;
        box-sizing: border-box;
    }
    .comment-block .com_otvet > a.reply {
        display: inline-block;
        min-height: 44px;
        line-height: 44px;
        padding: 0 6px;
        box-sizing: border-box;
    }

    /* 9.2.7 Legal row at the very bottom */
    .footer .f_b_menu1 .container > a,
    .footer .f_b_menu1 .container p > a {
        display: inline-block;
        min-height: 44px;
        line-height: 44px;
        box-sizing: border-box;
    }

    /* 9.2.8 Link lists: «Похожие услуги» and the reference list.
       These are navigation rows, not words inside a sentence. */
    .right_block section.related-services ul li > a,
    .right_block .chemo ul.tbmbi li > a {
        display: inline-block;
        padding: 11px 0;
        line-height: 22px;
        box-sizing: border-box;
    }
}

/* ------------------------------------------------------------------ */
/* 10. Finishing tail, 21.09.2026 (tail2)                              */
/* ------------------------------------------------------------------ */

/* 10.1 Search modal close button.
   `.search-modal-close` is a bare <span>&times;</span>: main.css gives it
   font-size:40px/line-height:1 and top:-40px, so the hit box measured
   22.6 x 40 at 390px — below the 44px minimum, and it sat flush against
   the top of the viewport. The panel keeps 40px of clearance above it,
   which a 44px box cannot fit into, so the panel drops to 56px and the
   button is centred in a real 44x44 box above it. Everything is inside
   the modals own 992px breakpoint

/* ------------------------------------------------------------------ */
/* 10. Finishing tail, 21.09.2026 (tail2)                              */
/* ------------------------------------------------------------------ */

/* 10.1 Search modal close button.
   .search-modal-close is a bare <span>&times;</span>: main.css gives it
   font-size:40px / line-height:1 and top:-40px, so the hit box measured
   22.6 x 40 at 390px - below the 44px minimum - and it sat flush against
   the top of the viewport. The panel keeps 40px of clearance above it,
   which a 44px box cannot fit into, so the panel drops to 56px and the
   button is centred in a real 44x44 box above it. Everything here is
   inside the modal own 992px breakpoint; on desktop the base rule
   .search-modal-close{display:none} in main.css still wins. */
@media (max-width: 992px) {
    .search-modal-overlay .header-search {
        margin-top: 56px !important;
    }
    .search-modal-overlay .search-modal-close {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 44px;
        height: 44px;
        min-width: 44px;
        min-height: 44px;
        box-sizing: border-box;
        top: -50px;
        right: 4px;
        font-size: 34px;
        line-height: 1;
        border-radius: 4px;
        -webkit-tap-highlight-color: rgba(255, 255, 255, .12);
    }
}
