@layer base, reset, typography, grid, components, page_elements, utilities;

/*
 * Webasyst Default 5.0 theme family
 *
 * @link http://www.webasyst.com/
 * @author Webasyst LLC
 * @copyright 2015 Webasyst LLC
 * @package Webasyst
 */

@layer base {
    :root {
        color-scheme:                      light dark;
        /* Color palette */
        --white:                           #fff;
        --white-auto:                      light-dark(var(--white), var(--text-color-additional));
        --white_tr_8:                      rgba(255, 255, 255, 8%);
        --white_tr_10:                     rgba(255, 255, 255, 10%);
        --white_tr_25:                     rgba(255, 255, 255, 25%);
        --white_tr_50:                     rgba(255, 255, 255, 50%);
        --black:                           #000;
        --black-auto:                      light-dark(var(--black), var(--text-color-additional));
        --black_tr_8:                      rgba(0, 0, 0, 8%);
        --black_tr_10:                     rgba(0, 0, 0, 10%);
        --black_tr_25:                     rgba(0, 0, 0, 25%);
        --black_tr_50:                     rgba(0, 0, 0, 50%);
        --bg_tr_8:                         light-dark(var(--black_tr_8), var(--white_tr_8));
        --bg_tr_10:                        light-dark(var(--black_tr_10), var(--white_tr_10));
        --bg_tr_25:                        light-dark(var(--black_tr_25), var(--white_tr_25));
        --bg_tr_50:                        light-dark(var(--black_tr_50), var(--white_tr_50));
        --gray:                            #808080;
        --gray1:                           #333;
        --gray2:                           #4f4f4f;
        --gray3:                           #828282;
        --gray4:                           #bdbdbd;
        --gray5:                           #e0e0e0;
        --gray6:                           #f2f2f2;
        --gray7:                           #fafafa;
        --gray20:                          #cccccc;

        --gray-strong:                     #666666;
        --gray-main:                       #888888;
        --gray-muted:                      #999999;
        --gray-subtle:                     #bbbbbb;
        /* Brand colors */
        --accent-color:                    #A538DC;
        --accent-color-light:              color-mix(in srgb, var(--accent-color) 100%, white 30%);
        --accent-color-lighter:            color-mix(in srgb, var(--accent-color) 75%, white 50%);
        --accent-color-dark:               color-mix(in srgb, var(--accent-color) 75%, black 25%);
        --red:                             #f43434;
        --blue:                            #3080ed;
        --blue-light:                      color-mix(in srgb, var(--blue) 100%, white 30%);
        --blue-lighter:                    color-mix(in srgb, var(--blue) 75%, white 50%);
        --blue-dark:                       color-mix(in srgb, var(--blue) 75%, black 25%);
        --green:                           #14b00e;
        --orange:                          #f2994a;
        --yellow:                          #d8a900;
        --purple:                          #9b51e0;
        --purple-light:                    color-mix(in srgb, var(--purple) 100%, white 30%);
        --purple-lighter:                  color-mix(in srgb, var(--purple) 75%, white 50%);
        --purple-dark:                     color-mix(in srgb, var(--purple) 75%, black 25%);
        /* Layout */
        --gap:                             0;
        --element-border-radius:           .75rem;
        --divider-color:                   var(--bg_tr_10);
        /* Typography */
        --font-size:                       16px;
        --font-family:                     "Helvetica Neue", sans-serif;
        /* Headings */
        --h1-size:                         2.25em;
        --h2-size:                         2em;
        --h3-size:                         1.625em;
        --h4-size:                         1.375em;
        --h5-size:                         1.125em;
        --h6-size:                         1em;
        /* Semantic colors with light-dark support */
        --bg-color:                        light-dark(var(--bg-color-light), var(--bg-color-dark));
        --bg-color-accent:                 light-dark(color-mix(in srgb, var(--bg-color) 100%, white 30%), color-mix(in srgb, var(--bg-color) 100%, white 12%));
        --text-color:                      light-dark(var(--black), var(--gray5));
        --text-color-secondary:            light-dark(var(--gray-strong), var(--gray-subtle));
        --text-color-additional:           light-dark(var(--gray-muted), var(--gray-main));
        --hint-color:                      light-dark(var(--gray3), var(--gray3));
        --link-color:                      light-dark(var(--accent-color), var(--accent-color));
        --link-hover-color:                light-dark(var(--accent-color-light), var(--accent-color-light));
        --link-visited-color:              light-dark(var(--accent-color-dark), var(--accent-color-dark));
        /* Button system */
        --button-bg-color:                 light-dark(var(--accent-color), var(--accent-color));
        --button-text-color:               light-dark(var(--white), var(--white));
        --button-hover-bg-color:           light-dark(var(--accent-color-light), var(--accent-color-light));
        --button-hover-text-color:         light-dark(var(--white), var(--white));
        --button-active-bg-color:          light-dark(var(--accent-color-dark), var(--accent-color-dark));
        --button-active-text-color:        light-dark(var(--white), var(--white));
        --button-disabled-bg-color:        light-dark(var(--accent-color-lighter), var(--accent-color-lighter));
        --button-disabled-text-color:      light-dark(var(--white), var(--white));
        --button-gray-bg-color:            light-dark(var(--gray6), var(--gray6));
        --button-gray-text-color:          light-dark(var(--gray3), var(--gray3));
        --button-gray-hover-bg-color:      light-dark(var(--gray7), var(--gray7));
        --button-gray-hover-text-color:    light-dark(var(--white), var(--white));
        --button-gray-active-bg-color:     light-dark(var(--gray5), var(--gray5));
        --button-gray-active-text-color:   light-dark(var(--gray3), var(--gray3));
        --button-gray-disabled-bg-color:   light-dark(var(--gray3), var(--gray3));
        --button-gray-disabled-text-color: light-dark(var(--white), var(--white));
        --button-blue-bg-color:            light-dark(var(--blue), var(--blue));
        --button-blue-text-color:          light-dark(var(--white), var(--white));
        --button-blue-hover-bg-color:      light-dark(var(--blue-light), var(--blue-light));
        --button-blue-hover-text-color:    light-dark(var(--white), var(--white));
        --button-blue-active-bg-color:     light-dark(var(--blue-dark), var(--blue-dark));
        --button-blue-active-text-color:   light-dark(var(--white), var(--white));
        --button-blue-disabled-bg-color:   light-dark(var(--blue-lighter), var(--blue-lighter));
        --button-blue-disabled-text-color: light-dark(var(--white), var(--white));
        /* Header colors */
        --header-link-color:               light-dark(var(--gray3), var(--gray3));
        --header-link-hover-color:         light-dark(var(--gray2), var(--gray2));
        --header-apps-link-color:          light-dark(var(--gray3), var(--gray3));
        --header-apps-link-selected-color: light-dark(var(--gray2), var(--gray2));
        --header-cart-total-bg-color:      light-dark(var(--red), var(--red));
        --header-search-input-bg-color:    var(--bg_tr_8);
        --header-search-input-bg-color-hover:    light-dark(var(--black_tr_10), var(--white_tr_25));
        --header-search-input-color:       light-dark(var(--gray), var(--gray));
        --header-menu-pages-link-color:    light-dark(var(--gray1), var(--text-color-additional));
        --header-sitename-color:           light-dark(var(--black), var(--gray-subtle));
        /* Form colors */
        --input-color:                     light-dark(var(--gray1), var(--gray4));
        --input-placeholder-color:         light-dark(var(--gray), var(--gray));
        --input-bg-color:                  var(--bg_tr_10);
        --input-disabled-bg-color:         light-dark(var(--gray6), var(--gray6));
        --input-disabled-color:            light-dark(var(--gray4), var(--gray4));
        --input-border-color:              var(--bg_tr_25);
        /* Footer colors */
        --footer-link-color:               light-dark(var(--gray3), var(--gray3));
        --footer-link-hover-color:         light-dark(var(--link-hover-color), var(--link-hover-color));
        --footer-notice-color:             light-dark(var(--gray4), var(--gray4));
        --footer-divider-color:            var(--divider-color);
        --footer-app-color:                light-dark(var(--gray), var(--gray));
        --footer-subscribe-link-color:     light-dark(var(--link-color), var(--link-color));
        /* Shadows */
        --shadow:                          0 .3125rem 1.875rem rgba(0, 0, 0, 0.06);
        --shadow1:                         0 .625rem 3.75rem rgba(0, 0, 0, 0.1);

        --bg-gray-color:                   light-dark(var(--gray6), var(--white_tr_10));
    }

    @supports not (color: light-dark(white, black)) {
        :root {
            color-scheme:                      light;
            --white-auto:                      var(--white);
            --black-auto:                      var(--black);
            --divider-color:                   var(--black_tr_10);
            --bg-color:                        var(--bg-color-light);
            --bg-color-accent:                 color-mix(in srgb, var(--bg-color) 100%, white 30%);
            --bg_tr_8:                         var(--black_tr_8);
            --bg_tr_10:                        var(--black_tr_10);
            --bg_tr_25:                        var(--black_tr_25);
            --bg_tr_50:                        var(--black_tr_50);
            --text-color:                      var(--black);
            --text-color-secondary:            var(--gray-strong);
            --text-color-additional:           var(--gray-muted);
            --hint-color:                      var(--gray3);
            --link-color:                      var(--accent-color);
            --link-hover-color:                var(--accent-color-light);
            --link-visited-color:              var(--accent-color-dark);
            --button-bg-color:                 var(--accent-color);
            --button-text-color:               var(--white);
            --button-hover-bg-color:           var(--accent-color-light);
            --button-hover-text-color:         var(--white);
            --button-active-bg-color:          var(--accent-color-dark);
            --button-active-text-color:        var(--white);
            --button-disabled-bg-color:        var(--accent-color-lighter);
            --button-disabled-text-color:      var(--white);
            --button-gray-bg-color:            var(--gray6);
            --button-gray-text-color:          var(--gray3);
            --button-gray-hover-bg-color:      var(--gray7);
            --button-gray-hover-text-color:    var(--white);
            --button-gray-active-bg-color:     var(--gray5);
            --button-gray-active-text-color:   var(--gray3);
            --button-gray-disabled-bg-color:   var(--gray3);
            --button-gray-disabled-text-color: var(--white);
            --button-blue-bg-color:            var(--blue);
            --button-blue-text-color:          var(--white);
            --button-blue-hover-bg-color:      var(--blue-light);
            --button-blue-hover-text-color:    var(--white);
            --button-blue-active-bg-color:     var(--blue-dark);
            --button-blue-active-text-color:   var(--white);
            --button-blue-disabled-bg-color:   var(--blue-lighter);
            --button-blue-disabled-text-color: var(--white);
            --header-link-color:               var(--gray3);
            --header-link-hover-color:         var(--gray2);
            --header-apps-link-color:          var(--gray3);
            --header-apps-link-selected-color: var(--gray2);
            --header-cart-total-bg-color:      var(--red);
            --header-search-input-bg-color:    var(--black_tr_8);
            --header-search-input-bg-color-hover:    var(--black_tr_10);
            --header-search-input-color:       var(--gray);
            --header-menu-pages-link-color:    var(--gray1);
            --header-sitename-color:           var(--black);
            --input-color:                     var(--gray1);
            --input-placeholder-color:         var(--gray);
            --input-bg-color:                  var(--black_tr_10);
            --input-disabled-bg-color:         var(--gray6);
            --input-disabled-color:            var(--gray4);
            --input-border-color:              var(--black_tr_25);
            --footer-link-color:               var(--gray3);
            --footer-link-hover-color:         var(--link-hover-color);
            --footer-notice-color:             var(--gray4);
            --footer-app-color:                var(--gray);
            --footer-subscribe-link-color:     var(--link-color);
            --bg-gray-color:                   var(--gray6);
        }

        .sub-links li a { color: var(--gray1); }
        .bg-gray { background-color: var(--gray6); }
    }
}

@layer reset {
    /* CSS Reset with modern approach */
    html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, /* ol, ul, li, */ fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, credentials, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; }
    *, ::after, ::before { box-sizing: border-box; }
    /* Global focus management */
    :focus-visible { outline: .125rem solid var(--link-color); outline-offset: .125rem; }
}

@layer grid {
    .container { --container-min-width: 650px; --container-max-width: 970px; --container-padding: 1rem; min-width: var(--container-min-width); max-width: var(--container-max-width); margin: 0 auto; padding-left: var(--container-padding); padding-right: var(--container-padding); }
    /* Mobile */
    @media (max-width: 768px) {
        .container {
            --container-min-width: 0
        }
    }
    /* Tablet */
    @media (min-width: 769px) and (max-width: 1024px) {
        .container {
            --container-padding: .75rem
        }
    }
    /* Wide screen */
    @media (min-width: 1300px) {
        .container {
            --container-max-width: 1160px
        }
    }

    .row { display: flex; flex-wrap: wrap; }
    .row.gap4 { --gap: 4px; gap: var(--gap); }
    .row.gap6 { --gap: 6px; gap: var(--gap); }
    .row.gap8 { --gap: 8px; gap: var(--gap); }
    .row.gap16 { --gap: 16px; gap: var(--gap); }
    .row.gap20 { --gap: 20px; gap: var(--gap); }
    .row.gap32 { --gap: 32px; gap: var(--gap); }
    .row.cols1 > .col { --cols-count: 1; }
    .row.cols1 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 100%; }

    @media (max-width: 768px) {
        .row.cols1-mobile > .col { flex: 0 0 auto; --cols-count: 1; --col-width: 100% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols1-tablet > .col { flex: 0 0 auto; --cols-count: 1; --col-width: 100% }
    }

    .row.cols2 > .col { --cols-count: 2; }
    .row.cols2 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 50%; }

    @media (max-width: 768px) {
        .row.cols2-mobile > .col { flex: 0 0 auto; --cols-count: 2; --col-width: 50% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols2-tablet > .col { flex: 0 0 auto; --cols-count: 2; --col-width: 50% }
    }

    .row.cols3 > .col { --cols-count: 3; }
    .row.cols3 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 33.33333333%; }

    @media (max-width: 768px) {
        .row.cols3-mobile > .col { flex: 0 0 auto; --cols-count: 3; --col-width: 33.33333333% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols3-tablet > .col { flex: 0 0 auto; --cols-count: 3; --col-width: 33.33333333% }
    }

    .row.cols4 > .col { --cols-count: 4; }
    .row.cols4 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 25%; }

    @media (max-width: 768px) {
        .row.cols4-mobile > .col { flex: 0 0 auto; --cols-count: 4; --col-width: 25% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols4-tablet > .col { flex: 0 0 auto; --cols-count: 4; --col-width: 25% }
    }

    .row.cols5 > .col { --cols-count: 5; }
    .row.cols5 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 20%; }

    @media (max-width: 768px) {
        .row.cols5-mobile > .col { flex: 0 0 auto; --cols-count: 5; --col-width: 20% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols5-tablet > .col { flex: 0 0 auto; --cols-count: 5; --col-width: 20% }
    }

    .row.cols6 > .col { --cols-count: 6; }
    .row.cols6 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 16.66666667%; }

    @media (max-width: 768px) {
        .row.cols6-mobile > .col { flex: 0 0 auto; --cols-count: 6; --col-width: 16.66666667% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols6-tablet > .col { flex: 0 0 auto; --cols-count: 6; --col-width: 16.66666667% }
    }

    .row.cols7 > .col { --cols-count: 7; }
    .row.cols7 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 14.285714286%; }

    @media (max-width: 768px) {
        .row.cols7-mobile > .col { flex: 0 0 auto; --cols-count: 7; --col-width: 14.285714286% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols7-tablet > .col { flex: 0 0 auto; --cols-count: 7; --col-width: 14.285714286% }
    }

    .row.cols8 > .col { --cols-count: 8; }
    .row.cols8 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 12.5%; }

    @media (max-width: 768px) {
        .row.cols8-mobile > .col { flex: 0 0 auto; --cols-count: 8; --col-width: 12.5% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols8-tablet > .col { flex: 0 0 auto; --cols-count: 8; --col-width: 12.5% }
    }

    .row.cols9 > .col { --cols-count: 9; }
    .row.cols9 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 11.111111111%; }

    @media (max-width: 768px) {
        .row.cols9-mobile > .col { flex: 0 0 auto; --cols-count: 9; --col-width: 11.111111111% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols9-tablet > .col { flex: 0 0 auto; --cols-count: 9; --col-width: 11.111111111% }
    }

    .row.cols10 > .col { --cols-count: 10; }
    .row.cols10 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 10%; }

    @media (max-width: 768px) {
        .row.cols10-mobile > .col { flex: 0 0 auto; --cols-count: 10; --col-width: 10% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols10-tablet > .col { flex: 0 0 auto; --cols-count: 10; --col-width: 10% }
    }

    .row.cols11 > .col { --cols-count: 11; }
    .row.cols11 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 9.090909091%; }

    @media (max-width: 768px) {
        .row.cols11-mobile > .col { flex: 0 0 auto; --cols-count: 11; --col-width: 9.090909091% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols11-tablet > .col { flex: 0 0 auto; --cols-count: 11; --col-width: 9.090909091% }
    }

    .row.cols12 > .col { --cols-count: 12; }
    .row.cols12 > .col:not(.w1,.w2,.w3,.w4,.w5,.w6,.w7,.w8,.w9,.w10,.w11,.w12) { --col-width: 8.33333333%; }

    @media (max-width: 768px) {
        .row.cols12-mobile > .col { flex: 0 0 auto; --cols-count: 12; --col-width: 8.33333333% }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .row.cols12-tablet > .col { flex: 0 0 auto; --cols-count: 12; --col-width: 8.33333333% }
    }

    .col { flex: 1 0 0; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w1 { --cols-count: 12; --col-width: 8.33333333%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w2 { --cols-count: 6; --col-width: 16.66666667%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w3 { --cols-count: 4; --col-width: 25%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w4 { --cols-count: 3; --col-width: 33.33333333%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w5 { --cols-count: 2.4; --col-width: 41.66666667%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w6 { --cols-count: 2; --col-width: 50%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w7 { --cols-count: 1.7; --col-width: 58.33333333%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w8 { --cols-count: 1.5; --col-width: 66.66666667%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w9 { --cols-count: 1.33; --col-width: 75%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w10 { --cols-count: 1.2; --col-width: 83.33333333%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w11 { --cols-count: 1.09; --col-width: 91.66666667%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    .col.w12 { --cols-count: 1; --col-width: 100%; flex: 0 0 auto; width: calc(var(--col-width) - (var(--gap) / var(--cols-count)) * (var(--cols-count) - 1)); }
    :is(.row.cols1,.row.cols2,.row.cols3,.row.cols4,.row.cols5,.row.cols6,.row.cols7,.row.cols8,.row.cols9,.row.cols10,.row.cols11,.row.cols12) > .col { flex: 0 0 auto; }
}

@layer components {
    /* Form elements */
    input, textarea, select { margin: 0; padding: 0.938em 0.75em; border-radius: var(--element-border-radius); transition: background-color 300ms linear; font-family: var(--font-family); }
    input, textarea { font-size: 1em; color: var(--gray1); }
    select { max-width: 100%; }
    input[type="button"]:focus { outline: none; outline-offset: -2px; }
    fieldset { border: .0625rem solid var(--gray); border-radius: var(--element-border-radius); padding: .625rem; position: relative; background: var(--gray5); margin-bottom: .625rem; }
    fieldset p label { width: 98%; }
    fieldset p input[type="text"] { width: 98%; }
    fieldset p select { width: 99%; }
    input::-webkit-input-placeholder { color: var(--input-placeholder-color); }
    input:-moz-placeholder,
    input::-moz-placeholder { color: var(--input-placeholder-color); }
    label, button { cursor: pointer; }
    /* Enhanced form inputs */
    input, textarea { border: .0625em solid var(--input-border-color); padding: 0.938em 0.75em; font-weight: 400; color: var(--text-color-secondary); background-color: var(--input-bg-color); appearance: none; }
    input:focus, textarea:focus { border-color: var(--input-border-color); outline: 0; }
    input[type=checkbox],
    input[type=radio] {
        width:               1.125rem;
        height:        1.125rem;
        background-color:    transparent;
        background-repeat:   no-repeat;
        background-position: center;
        background-size:     .7em;
        border:              .0625rem solid var(--input-border-color);
        border-radius:       min(.25em, var(--element-border-radius));
        appearance:          none;
        vertical-align:      middle;
        padding:             0;
    }
    input[type=radio] { border-radius: 50%; }
    input:checked { border-color: var(--link-color); }
    input:checked[type=checkbox] { background-color: var(--accent-color); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none'%3E%3Cpath d='M5.81 11.333c-.276.44-.682.667-1.154.667-.486 0-.866-.2-1.22-.654L.341 7.488C.118 7.208 0 6.914 0 6.594c0-.654.498-1.188 1.141-1.188.393 0 .708.147 1.023.56l2.44 3.164L9.783.667c.275-.44.63-.667 1.023-.667C11.423 0 12 .44 12 1.108c0 .294-.157.614-.328.894l-5.862 9.33Z' fill='%23FFFFFF'/%3E%3C/svg%3E"); }
    input:checked[type=radio] { box-shadow: inset 0 0 0 .21875rem var(--bg-color-accent); background-color: var(--link-color); }
    select {
        background-color:    transparent;
        color:         var(--text-color-secondary);
        background-repeat:   no-repeat;
        border:              .0625rem solid var(--input-border-color);
        appearance:          none;
        vertical-align:      middle;
        font-weight:         400;
        line-height:         1.15;
        background-image:    var(--chevron-svg);
        background-position: right 0.525em center;
        background-size:     1em;
        padding-right:       1.75em;
    }
    select:focus { border-color: var(--link-color); outline: 0; }
    select:disabled { opacity: .5; cursor: default; }
    select option { background-color: var(--bg-color-accent); }
    select option:hover { background-color: var(--accent-color); }
    /* Buttons */
    .button, button,
    input[type=button],
    input[type=submit],
    input[type=reset] {
        display:          inline-flex;
        justify-content: center;
        outline:          0;
        padding:          0.938em 1.25em;
        font-size:        1em;
        font-weight:      600;
        border:           0 none;
        border-radius:    var(--element-border-radius);
        background-color: var(--button-bg-color);
        color:            var(--button-text-color);
        position:         relative;
        transition:       background-color 200ms linear;
        font-family:      var(--font-family);
        line-height: normal;
    }

    .button:hover, button:hover, input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover { cursor: pointer; background-color: var(--button-hover-bg-color); color: var(--button-hover-text-color); }

    .button.blink, button.blink, input[type=button].blink, input[type=submit].blink, input[type=reset].blink { transition: transform 200ms linear; }
    .button.blink:not(:disabled,.disabled):hover, button.blink:not(:disabled,.disabled):hover, input[type=button].blink:not(:disabled,.disabled):hover, input[type=submit].blink:not(:disabled,.disabled):hover, input[type=reset].blink:not(:disabled,.disabled):hover { background-color: var(--button-bg-color); overflow: hidden; transform: scale(1.05);}
    .button.blink:not(:disabled,.disabled):hover::after, button.blink:not(:disabled,.disabled):hover::after, input[type=button].blink:not(:disabled,.disabled):hover::after, input[type=submit].blink:not(:disabled,.disabled):hover::after, input[type=reset].blink:not(:disabled,.disabled):hover::after, .s-order-page .s-order-section > .s-section-body .wa-form-body .wa-submit-button:hover:not(:disabled,.disabled)::after { content: ''; position: absolute; top: 0; left: -50%; width: 50%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.4),rgba(255, 255, 255, 0.2), transparent ); transform: skewX(-20deg); animation: sweep 3s infinite; filter: blur(1px); }
    @keyframes sweep {
        0% { left: -50%; opacity: 0; transform: skewX(-20deg) scaleY(0.5); }
        20% { opacity: 1; transform: skewX(-20deg) scaleY(1); }
        80% { opacity: 1; transform: skewX(-20deg) scaleY(1); }
        100% { left: 150%; opacity: 0; transform: skewX(-20deg) scaleY(0.5); }
    }
    .button:active, button:active, input[type=button]:active, input[type=submit]:active, input[type=reset]:active { background-color: var(--button-active-bg-color); color: var(--button-active-text-color); }

    .button:disabled, button:disabled, input[type=button]:disabled, input[type=submit]:disabled, input[type=reset]:disabled { background-color: var(--button-disabled-bg-color); color: var(--button-disabled-text-color); cursor: not-allowed; }

    .button.small, button.small, input[type=button].small, input[type=submit].small, input[type=reset].small { font-size: 0.9em; }

    .button.large, button.large, input[type=button].large, input[type=submit].large, input[type=reset].large { font-size: 1.6em; font-weight: 500; }

    .button.gray, button.gray, input[type=button].gray, input[type=submit].gray, input[type=reset].gray {
        --button-bg-color:                 var(--button-gray-bg-color);
        --button-text-color:               var(--button-gray-text-color);
        --button-hover-bg-color:           var(--button-gray-hover-bg-color);
        --button-hover-text-color:         var(--button-gray-hover-text-color);
        --button-active-bg-color:          var(--button-gray-active-bg-color);
        --button-active-text-color:        var(--button-gray-active-text-color);
        --button-disabled-bg-color:        var(--button-gray-disabled-bg-color);
        --button-disabled-text-color:      var(--button-gray-disabled-text-color);
    }
    /* Form validation */
    input.error, textarea.error { border: .125em solid var(--red); }

    .errormsg { color: var(--red); margin-left: 10.625rem; display: block; }
    /* Captcha */
    .wa-field .wa-captcha-img { margin-top: -.125rem; }

    .wa-captcha { padding: .4375rem 0 .625rem; }
    .wa-captcha p { margin: 0 !important; }
    .wa-captcha strong { font-size: 1.2em; }
    .wa-captcha p img { float: left !important; }
    .wa-captcha .wa-captcha-refresh { font-size: 0.8em; text-decoration: underline; color: var(--gray3); }
    .wa-captcha .wa-captcha-input { display: inline !important; margin-left: .625rem; }
    .wa-captcha .errormsg { margin-left: .625rem; display: block; }
    /* Auth adapters */
    .wa-auth-adapters ul { padding: 0; display: flex; flex-wrap: wrap; gap: 1rem 2rem; }
    .wa-auth-adapters ul li { list-style: none; }
    .wa-auth-adapters ul li a, .wa-auth-adapters ul li span { display: flex; align-items: center; gap: .25rem }
    .wa-auth-adapters ul li a img, .wa-auth-adapters ul li span img { position: relative; }
    .wa-auth-adapters p { color: #888; font-size: 0.9em; width: 80%; }

    .wa-auth-adapters.wa-connect { padding-top: 20px; clear: left; }
    /* Form wrapper */
    .wa-form { margin: 1rem 0; overflow: visible; display: flex; flex-direction: column; gap: 1rem; }
    .wa-form .wa-field { display: grid; grid-template-columns: 10rem 1fr; gap: 1rem; padding: .25rem 0;}
    .wa-form .wa-field:not(:has(.wa-name)) { grid-template-columns: 1fr; padding-left: 11rem; }
    .wa-form .wa-field .wa-name { font-size: 0.95em; color: #888; }
    #wa-my-info-edit-wrapper .wa-form .wa-field .wa-name { margin-top: 14px; }
    .wa-form .wa-field .wa-value { position: relative; }
    .wa-form .wa-field .wa-value input[type="text"],
    .wa-form .wa-field .wa-value input[type="email"],
    .wa-form .wa-field .wa-value input[type="password"] { width: 30%; min-width: 260px; margin: 0; padding: 0.6rem 0.75rem; background-color: transparent; font-size: 0.875rem; line-height: 1.5; }
    .wa-form .wa-field .wa-value input.wa-error { border: 2px solid var(--red); }
    .wa-form .wa-field .wa-value .wa-error-msg { font-size: 0.9em; color: var(--red); display: block; }
    .wa-form .wa-field .wa-value textarea { min-width: 300px; height: 70px; }
    .wa-form .wa-field .wa-value .wa-captcha-input,
    .wa-form .wa-field .wa-value .wa-subscribe-form .wa-captcha .wa-captcha-input { min-width: 73px !important; }
    .wa-form .wa-field .wa-value .wa-captcha img { margin-left: 0; }
    .wa-form .wa-field .wa-value .errormsg { margin-left: 0; }
    .wa-form .wa-field .wa-value.wa-submit { margin-top: 10px; }
    .wa-form .wa-field .wa-value p label { display: block; margin: 0; }
    .wa-form .wa-field .wa-value p span { color: #777; font-size: 0.9em; display: block; }
    .wa-form .wa-field .wa-value p i.icon16 { float: left; left: -20px; margin-top: 2px; position: absolute; }
    .wa-form .wa-field .wa-value p label,
    .wa-form .wa-field .wa-value p input { display: block; margin-bottom: 5px; }
    .wa-form .wa-field .wa-value p input[type="radio"],
    .wa-form .wa-field .wa-value p input[type="checkbox"] { display: inline-block; }
    .wa-form .wa-field .wa-value p .field.wa-required span::after { content: " *"; color: #faa; }
    .wa-form .wa-field .wa-value p input[type="radio"],
    .wa-form .wa-field .wa-value p input[type="checkbox"] { display: inline-block; }
    .wa-form .wa-field .wa-value p .field.wa-required span::after { content: " *"; color: #faa; }
    .wa-form .wa-field .wa-value label,
    .wa-form .wa-field .wa-value p input { display: block; margin-bottom: 5px; }
    .wa-form .wa-field .wa-value p input[type="radio"],
    .wa-form .wa-field .wa-value p input[type="checkbox"] { display: inline-block; }
    .wa-form .wa-field .wa-value p .field.wa-required span::after { content: " *"; color: #faa; }
    .wa-form .wa-field .wa-value select { border-radius: var(--element-border-radius); padding: 0.85em 2.25em 0.85em 0.75em; line-height: 1; text-overflow: ellipsis; }
    .wa-form .wa-field .wa-value p label { display: block; margin: 0; }
    .wa-form .wa-field .wa-value p { line-height: 1.6em; margin-bottom: 23px; position: relative; }
    .wa-form .wa-field .wa-value p span { color: #777; font-size: 0.9em; display: block; }
    .wa-form .wa-field .wa-value p i.icon16 { float: left; left: -20px; margin-top: 2px; position: absolute; }
    .wa-form .wa-field .wa-value label,
    .wa-form .wa-field .wa-value p input { display: block; margin-bottom: 5px; }
    .wa-form .wa-field .wa-value p input[type="radio"],
    .wa-form .wa-field .wa-value p input[type="checkbox"] { display: inline-block; }
    .wa-form .wa-field .wa-value p .field.wa-required span::after { content: " *"; color: #faa; }
    .wa-form .wa-field .wa-value.wa-submit { margin-top: 10px; }
    .wa-form .wa-field .wa-value p label { display: block; margin: 0; }
    .wa-form .wa-field .wa-value p { line-height: 1.6em; margin-bottom: 23px; position: relative; }
    .wa-form .wa-field .wa-value p span { color: #777; font-size: 0.9em; display: block; }
    .wa-form .wa-field .wa-value p i.icon16 { float: left; left: -20px; margin-top: 2px; position: absolute; }
    .wa-form .wa-field .wa-value label,
    .wa-form .wa-field .wa-value p input { display: block; margin-bottom: 5px; }
    .wa-form .wa-field .wa-value p input[type="radio"],
    .wa-form .wa-field .wa-value p input[type="checkbox"] { display: inline-block; }
    .wa-form .wa-field .wa-value p .field.wa-required span::after { content: " *"; color: #faa; }
    .wa-form .wa-field .wa-value p:last-child { margin-bottom: 0; }
    .wa-form .wa-field .wa-value select { border-radius: var(--element-border-radius); padding: 0.6rem 2.25em 0.6rem 0.75em; font-size: 0.875rem; line-height: 1.5; text-overflow: ellipsis; }
    .wa-form .wa-field.wa-separator { height: 10px; }
    .wa-form .wa-field.wa-required .wa-name::after { content: " *"; color: var(--red); }
    .wa-form .wa-field.wa-field-email .wa-value input { min-width: 300px; }
    .wa-form .wa-field.wa-field-password .wa-value input,
    .wa-form .wa-field.wa-field-password_confirm .wa-value input { min-width: 200px; width: 200px; }
    form .wa-form .wa-field.fld_type_checkbox { display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-end; }
    form .wa-form .wa-field.fld_type_checkbox .wa-value { margin-top: 0; margin-right: 3px; }
    form .wa-form .wa-value .h-agreement-checkbox-wrapper input[type=checkbox] { position: static; }
    form .wa-form .wa-value .h-agreement-checkbox-wrapper .h-agreement-checkbox-html-label { display: inline; margin-left: 10px; }

    @media (max-width: 768px) {
        .wa-form .wa-field {
            grid-template-columns: 1fr;
            gap: 0.5rem;
            padding-left: 0!important;
        }
    }

    .wa-signup-form .wa-form .wa-field.wa-field-email .wa-value input { min-width: 300px; }
    .wa-signup-form .wa-form .wa-field.wa-field-password .wa-value input,
    .wa-signup-form .wa-form .wa-field.wa-field-password_confirm .wa-value input { min-width: 160px; width: 160px; }

    .wa-login-form-wrapper input[type="text"], .wa-login-form-wrapper input[type="email"], .wa-login-form-wrapper input[type="password"], .wa-signup-form input[type="text"], .wa-signup-form input[type="email"], .wa-signup-form input[type="password"], .wa-forgotpassword-form-fields input[type="text"] { padding: 0.6rem 0.75rem !important;
        background-color: transparent !important;
        font-size: 0.875rem !important;
        line-height: 1.5 !important;
        border: .0625em solid var(--input-border-color) !important;
        color: var(--text-color-secondary);
    }
    @media (max-width: 768px) {
        .wa-login-form-wrapper input[type="text"], .wa-login-form-wrapper input[type="email"], .wa-login-form-wrapper input[type="password"], .wa-signup-form input[type="text"], .wa-signup-form input[type="email"], .wa-signup-form input[type="password"], .wa-forgotpassword-form-fields input[type="text"] { width:100% !important; margin: 0 !important;}
        .wa-login-form-wrapper .wa-login-form-fields .wa-login-forgotpassword-url { margin-top: 1rem; }
    }
    /* Additional components */
    .breadcrumbs { color: var(--link-color); margin-bottom: 35px; display: flex; align-items: center; gap: 10px; }
    .breadcrumbs a { color: var(--gray4) !important; }
    .breadcrumbs span.chevron::after { left: 0; color: var(--gray4); }

    @media (max-width: 768px) {
        .breadcrumbs {
            display: none
        }
    }

    .tags { line-height: 1.6em; }
    .tags a { color: var(--green) !important; display: inline !important; padding: 0 4px !important; }
    .tags a:hover { color: red !important; }

    .welcome { text-align: center; background: url('img/webasyst.svg') no-repeat top center; padding-top: 300px; background-size: 256px 256px; margin-bottom: 30px; }
    .welcome h1 { font-weight: normal; font-size: 2em; }

    .schedule { position: relative; display: inline-block; }

    .schedule:hover .schedule-dropdown { display: block; }

    .schedule .schedule-dropdown {
        display:          none;
        position:         absolute;
        background-color: var(--bg-color-accent);
        min-width:        200px;
        box-shadow:       0 8px 16px rgba(0, 0, 0, 0.2);
        z-index:          1;
        border-radius:    var(--element-border-radius);
        top:              100%;
        left:             0;
        list-style:       none;
        font-size:        .875em;
        padding:          1rem;
        margin:           0;
    }

    .schedule .schedule-dropdown .s-day-wrapper { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
    .schedule .schedule-dropdown .s-day-wrapper:not(:last-child) { margin-bottom: .5rem; }

    .schedule .schedule-dropdown .s-day-wrapper .s-time { white-space: nowrap; }

    .staff { background: var(--gray4); padding: 2px 6px; color: var(--white); font-size: 0.9em; border-radius: min(.3125rem, var(--element-border-radius)); white-space: nowrap; line-height: normal; }

    .attach { display: flex; flex-direction: row; align-items: center; position: relative; width: fit-content; margin-bottom: 0.5rem; }

    .attach::before {
        content:           "";
        position:          absolute;
        top:               18px;
        left:              15px;
        background-image:  url("data:image/svg+xml,%3Csvg%20version%3D%221.1%22%20id%3D%22Capa_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%0A%09%20width%3D%22612.675px%22%20height%3D%22612.675px%22%20viewBox%3D%220%200%20612.675%20612.675%22%20style%3D%22enable-background%3Anew%200%200%20612.675%20612.675%3B%22%0A%09%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cg%3E%0A%0A%09%09%09%3Cpath%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20fill%3D%22%23777%22%20d%3D%22M581.209%2C223.007L269.839%2C530.92c-51.592%2C51.024-135.247%2C51.024-186.839%2C0c-51.592-51.023-51.592-133.737%2C0-184.761%20L363.248%2C69.04c34.402-34.009%2C90.15-34.009%2C124.553%2C0c34.402%2C34.008%2C34.402%2C89.166%2C0%2C123.174l-280.249%2C277.12%20c-17.19%2C17.016-45.075%2C17.016-62.287%2C0c-17.19-16.993-17.19-44.571%2C0-61.587L394.37%2C161.42l-31.144-30.793L114.144%2C376.975%20c-34.402%2C34.009-34.402%2C89.166%2C0%2C123.174c34.402%2C34.009%2C90.15%2C34.009%2C124.552%2C0l280.249-277.12%20c51.592-51.023%2C51.592-133.737%2C0-184.761c-51.593-51.023-135.247-51.023-186.839%2C0L36.285%2C330.784l1.072%2C1.071%20c-53.736%2C68.323-49.012%2C167.091%2C14.5%2C229.88c63.512%2C62.79%2C163.35%2C67.492%2C232.46%2C14.325l1.072%2C1.072l326.942-323.31%20L581.209%2C223.007z%22%2F%3E%0A%09%09%3C%2Fg%3E%0A%3C%2Fsvg%3E");
        background-repeat: no-repeat;
        width:             20px;
        height:            100%;
        background-size:   contain;
    }

    .attach .remove-attach { font-weight: 700; padding: 7px; margin-left: auto; }
    .attach [type=file] {
        cursor:           pointer;
        position:         relative;
        width:            290px;
        background-color: transparent;
        padding:          15px 10px 15px 20px;
        border:           2px dashed var(--gray5);
        transition:       200ms background linear;
        border-radius:    var(--element-border-radius);
        color:            var(--link-color);
        box-sizing:       border-box;
    }

    .attach [type=file].is-highlighted { background: #fafadf75; }
    .attach [type=file]::-webkit-file-upload-button,
    .attach [type=file]::file-selector-button { visibility: hidden; width: 0; }

    .s-subscribe-section.is-extended .s-hidden { display: block; }
    .s-subscribe-section .s-subscribe-section--title { font-size: 1.25em; font-weight: 400; }
    .s-subscribe-section form { position: relative; }
    .s-subscribe-section form .s-subscribe-section--title { font-size: 1.25em; color: var(--black); }
    .s-subscribe-section form .s-subscribe-section--title span { display: block; font-size: .875em; color: var(--gray); }
    .s-subscribe-section form input { font-size: .875rem; border: 1px solid transparent; outline: none; }

    @media (max-width: 768px) {
        .s-subscribe-section form input { margin-right: 0 !important; width: 100% }
    }
    .s-subscribe-section form input:focus,
    .s-subscribe-section form input:hover { background: var(--gray5); }

    @media (max-width: 768px) {
        .s-subscribe-section form [type="submit"] {
            width: 100%
        }
    }

    .s-subscribe-section form .s-hidden {
        display:       none;
        position:      absolute;
        top:           100%;
        left:          0;
        width:         340px;
        padding:       1em;
        background:    var(--white);
        z-index:       1;
        box-shadow:    0 0 16px rgba(0, 0, 0, .15);
        border-radius: 3px;
    }

    .s-subscribe-section form .s-hidden .wa-captcha { margin: 0; padding: 0; }
    .s-subscribe-section form .s-hidden .wa-captcha p { display: flex; align-items: center; }
    .s-subscribe-section form .s-hidden .wa-captcha p input { width: 1em; border: 1px solid var(--gray4); flex: 1 1 auto; padding: 10px 16px; }
    .s-subscribe-section form .s-hidden .wa-captcha p img { margin: 0; }
    .s-subscribe-section form .s-hidden .wa-captcha p strong { margin: 0 .5em; }
    .s-subscribe-section form .s-hidden .wa-captcha p a { display: inline; }

    .s-subscribe-personal-data { color: var(--gray4); }

    .search .search-wrapper { position: relative; }
    .search .search-wrapper input { width: 100%; background: transparent; -webkit-appearance: none; appearance: none; margin-right: 0; padding-left: 1em; padding-right: 32px; box-sizing: border-box; }
    .search .search-wrapper input:focus { outline: 0; }
    .search .search-wrapper input:focus + button { color: var(--gray3); }
    .search .search-wrapper input[type="search" i]::-webkit-search-cancel-button { appearance: none; }
    .search .search-wrapper input::placeholder { color: var(--gray4); }
    .search .search-wrapper button {
        position:   absolute;
        border:     none;
        outline:    none;
        box-shadow: none;
        padding:    0;
        color:      var(--gray4);
        background: transparent;
        top:        50%;
        transform:  translateY(-50%);
        right:      1em;
    }

    .search .search-wrapper button:hover::after { content: none; }
    .search .search-wrapper button::-moz-focus-inner { /* remove extra button spacing for Mozilla Firefox */ border: 0; padding: 0; }

    #cookie-agreement { position: fixed; bottom: 1rem; left: 1rem; z-index: 9999; max-width: 12rem; animation: slideIn 0.4s ease-out; }
    #cookie-agreement .cookie-agreement-content { background: var(--bg-color-accent); border-radius: var(--element-border-radius); filter: drop-shadow(0 6px 20px rgba(0, 0, 0, 0.07)) drop-shadow(0 8px 4px rgba(0, 0, 0, 0.04)); color: var(--text-color); }

    @keyframes slideIn {
        from { opacity: 0; transform: translateY(1rem); }
        to { opacity: 1; transform: translateY(0); }
    }
    /* Navigation menus
    ------------------- */
    ul.menu-v { margin: 0; padding: 0; }
    ul.menu-v li { list-style: none; padding: 0; line-height: 1.3em; }
    ul.menu-v li:not(:last-child) { border-bottom: .0625rem solid var(--divider-color); }
    ul.menu-v li a { padding: .8125rem 1.875rem .8125rem 1rem; display: block; text-decoration: none; }
    ul.menu-v li.collapsible { background: url('img/rarr.png') no-repeat; background-position: right center; background-size: 2rem 1rem; }

    @media (max-width: 768px) {
        ul.menu-v li.collapsible {
            background: none
        }
    }
    ul.menu-v li.bottom-padded { margin-bottom: 1.25rem; }
    ul.menu-v li .count { float: right; color: var(--gray3); }
    ul.menu-v li .count i.icon16 { margin: 0 -0.3125rem; }
    ul.menu-h { margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .625rem; }
    ul.menu-h li { list-style: none; line-height: 1.3em; }
    ul.menu-h li a { padding: .8125rem .625rem .8125rem .625rem; display: block; text-decoration: none; }
    ul.tree { list-style: none; padding-left: 0; }
    ul.tree li { border: none; }
    ul.tree li a { padding: .3125rem .625rem; display: block; text-decoration: none; }
    ul.tree li.selected a { background: transparent; }
    ul.tree li ul { padding-left: 1.25rem; list-style: none; }
    ul.tree li ul li a { padding: .1875rem .375rem; }

    .paging-nav { text-align: center; }
    .paging-nav ul { display: inline-flex; gap: .5rem; font-size: 1rem; list-style: none; }
    .paging-nav ul li { line-height: normal; padding: 0; color: var(--gray1); }
    .paging-nav ul li a {
        display:         inline-flex;
        list-style:      none;
        width:           2.5rem;
        height:          2.5rem;
        justify-content: center;
        align-items:     center;
        line-height:     normal;
        background:      var(--white);
        border:          1px solid var(--gray5);
        border-radius:   var(--element-border-radius);
        padding:         0;
        color:           var(--gray1);
    }

    .paging-nav ul li.selected a { border: 2px solid var(--link-color); color: var(--link-color); }

    .sub-links { margin-bottom: 32px; padding-left: 0; gap: 16px; }
    .sub-links li { list-style: none; line-height: 1.5em; }
    .sub-links li a { text-decoration: none; font-size: 90%; color: var(--header-menu-pages-link-color); }
    .sub-links li a:hover { color: var(--link-color); }
}

@layer typography {
    /* Base typography */
    html { scroll-behavior: smooth; height: 100vh; }
    /* Mobile */
    @media (max-width: 768px) {
        html { --h1-size: 2rem; --h2-size: 1.7142rem; --h3-size: 1.4285rem; --h4-size: 1.1428rem; --h5-size: 1rem; --h6-size: 1rem }
    }
    /* Tablet */
    @media (min-width: 769px) and (max-width: 1024px) {
        html { --h1-size: 2rem; --h2-size: 1.7142rem; --h3-size: 1.4285rem; --h4-size: 1.1428rem; --h5-size: 1rem; --h6-size: 1rem }
    }
    /* Wide screen */
    @media (min-width: 1300px) {
    }
    body { display: flex; flex-direction: column; min-height: 100vh; font-family: var(--font-family); font-size: var(--font-size); background: var(--bg-color); line-height: 100%; color: var(--text-color); }
    body.is-shadow-shown { position: relative; }
    body.is-shadow-shown::after,
    body:has(.mobile-nav.opened)::after,
    body:has(.search-active)::after {
        display:    block;
        content:    "";
        position:   fixed;
        inset:      0;
        background: rgba(0, 0, 0, .25);
        z-index:    99;
    }
    body.is-shadow-shown .globalheader { position: relative; z-index: 100; }
    /* Links */
    a { color: var(--link-color); outline: 0 none; text-decoration: none; transition: color 300ms linear; }
    a:focus { outline: none; outline-offset: -4px; }
    a:visited { color: var(--link-visited-color); }
    a.not-visited:visited { color: var(--link-color); }
    a:hover { color: var(--link-hover-color); }
    
    a img 
    { 
        border: 0; 
        width: auto;
        max-width: 365px;
    }
    
    /* Headings */
    h1, .h1 { font-size: var(--h1-size); }
    h2, .h2 { font-size: var(--h2-size); }
    h3, .h3 { font-size: var(--h3-size); }
    h4, .h4 { font-size: var(--h4-size); }
    h5, .h5 { font-size: var(--h5-size); }
    h6, .h6 { font-size: var(--h6-size); }
    h1, h2, h3, h4, .h1, .h2, .h3, .h4 { line-height: 120%; font-weight: 400; }
    /* Text elements */
    p, dl, hr, h1, h2, h3, h4, h5, h6, ol, ul, pre, table, address, fieldset, blockquote, figure { margin-bottom: 20px; }
    p { line-height: 1.4em; }
    p a { text-decoration: underline; }
    /* Lists */
    ul, ol { padding-top: 0; line-height: 1.4em; }
    ul.unstyled, ol.unstyled { list-style: none; padding: 0; margin: 0; }
    ol { list-style: decimal; }
    /* Code blocks */
    pre { margin-top: 16px; font-size: 90%; line-height: 24px; color: rgba(0, 0, 0, .75); background: rgba(0, 0, 0, .03); padding: 16px 20px; word-wrap: normal; }
    /* Blockquotes */
    blockquote { color: rgba(0, 0, 0, .6); font-size: 0.9em; font-style: italic; border-left: 1px solid rgba(0, 0, 0, .1); padding-left: 24px; background: var(--gray5); }
    blockquote cite { font-size: 0.9em; }
    /* Horizontal rules */
    hr { background-color: var(--divider-color); height: 1px; border: 0; }
    /* Hint text */
    .hint,
    .breadcrumbs,
    .breadcrumbs a,
    .breadcrumbs span.rarr,
    table.features tr.divider td,
    .bestsellers .bestsellers-header,
    ul.thumbs li span.summary,
    .review .summary,
    .review .summary .date,
    ul.albums li .count,
    .album-note,
    .credentials .username,
    .credentials .username a { color: var(--hint-color); }
    /* Tables
    --------- */
    table { border-collapse: collapse; border-spacing: 0; }
    table th { color: var(--gray3); padding: 0 10px 7px; }
    table td { padding: 10px; border: 1px solid rgba(0, 0, 0, 0.1); }
    table.not-bordered td { border: none; }
    table.lined { margin-top: 25px; width: 100%; border-spacing: 0; border-collapse: collapse; }
    table.lined th { padding-left: 7px; padding-right: 7px; }
    table.lined td { padding: 15px 7px; border-bottom: 1px solid var(--gray5); }
    table.lined td.min-width { width: 1%; }
    table.lined td p { margin: 0; }
    table.lined td input.numerical { width: 50px; margin-right: 5px; text-align: right; }
    table.lined tr.no-border td { border: none; }
    table.lined tr.thin td { padding-top: 13px; padding-bottom: 0; }
    table.lined tr.service td { padding-top: 5px; padding-bottom: 5px; padding-left: 25px; font-size: 0.8em; color: #555; }
}

@layer utilities {
    /* Layout utilities */
    .block { padding: 25px 30px; }

    .inline { display: inline !important; }

    .inline-link { text-decoration: none !important; display: inline-block; }
    .inline-link b { border-bottom: 1px dotted; font-weight: normal; position: relative; top: -0.13em; }
    .inline-link b i { font-style: normal; position: relative; top: 0.13em; }

    .small { font-size: 0.875em; }

    .smaller { font-size: 0.75em; }

    .smallest { font-size: 0.625em; }

    .large { font-size: 1.125em; }

    .larger { font-size: 1.25em; }

    .largest { font-size: 1.5em; }

    .bold, .fw-bold { font-weight: 700; }

    .semibold, .fw-semibold { font-weight: 600; }

    .fw-normal { font-weight: 400; }

    .strike { text-decoration: line-through; }

    .highlighted { background: #ffc; }

    .hint { color: var(--hint-color); font-size: 0.9em; }
    .hint a,
    .hint:visited,
    .hint a:visited { color: var(--gray3); }
    .gray,
    .gray .dropdown ul,
    .gray a,
    .gray:visited,
    .gray a:visited { color: var(--gray3); }

    .text-left { text-align: left; }

    .text-center { text-align: center; }

    .text-right { text-align: right; }

    .shadowed { box-shadow: 0 5px 15px var(--gray3); }

    .nowrap { white-space: nowrap; }

    .hr { border-top: 1px solid var(--gray20); margin-bottom: 15px; }

    .uppercase { text-transform: uppercase; }

    .blurred { -ms-filter: blur(5px); filter: blur(5px); }

    .userpic { border-radius: 50%; background-size: auto; }

    .strike { text-decoration: line-through; }

    .highlighted { background: #ffc; }

    .breadcrumbs { color: var(--link-color); margin-bottom: 35px; display: flex; align-items: center; gap: 10px; }
    .breadcrumbs a { color: var(--gray4) !important; }
    .breadcrumbs span.chevron::after { left: 0; color: var(--gray4); }

    .tags { line-height: 1.6em; }
    .tags a { color: var(--green) !important; display: inline !important; padding: 0 4px !important; }
    .tags a:hover { color: red !important; }

    .welcome { text-align: center; background: url('img/webasyst.svg') no-repeat; background-position: top center; padding-top: 300px; background-size: 256px 256px; margin-bottom: 30px; }
    .welcome h1 { font-weight: normal; font-size: 2em; }

    .staff { background: var(--bg_tr_25); padding: 2px 6px; color: var(--white); font-size: 0.9em; border-radius: min(.3125rem, var(--element-border-radius)); white-space: nowrap; line-height: normal; }
    /* Chevron utility */
    .chevron::after {
        content:        '';
        display:        inline-flex;
        border-style:   solid;
        border-width:   0 .1em 0.1em 0;
        width:          0.45em;
        height:         0.45em;
        vertical-align: middle;
        position:       relative;
        top:            0;
        left:           0.25em;
    }

    .chevron.down::after { transform: rotate(45deg); top: -0.2em; }

    .chevron.right::after { transform: rotate(-45deg); }
    /* Badge utility */
    .s-badge { display: inline-block; padding: 0.35em 0.45em; font-size: 90%; line-height: 1; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: 5px; }

    .s-badge.rounded { border-radius: 50rem; }

    .s-badge.red { background: var(--red); color: var(--white); }
    /* Visibility utilities */
    .overflow-hidden { overflow: clip; }

    .is-hidden { display: none; }
    /* Loading states */
    .s-loading-section {
        position:        fixed;
        top:             0;
        left:            0;
        display:         flex;
        width:           100%;
        height:          100%;
        justify-content: center;
        align-items:     center;
        background:      rgba(255, 255, 255, .5);
        z-index:         100;
    }

    .s-loading-section .s-loading-content { display: inline-block; }
    /* Icons */
    .icon10 {
        background-repeat: no-repeat;
        height:            10px;
        width:             10px;
        display:           inline-block;
        text-indent:       -9999px;
        text-decoration:   none !important;
        background-image:  url("img/icons.png");
        background-size:   260px 160px;
        vertical-align:    top;
        margin:            0.3em 0.1em 0 0;
    }
    .icon10.darr { background-image: url('img/darr.png'); background-size: 16px 16px; }
    .icon10.star,
    .icon10.star-full { background-position: 0 -100px; }
    .icon10.star-half { background-position: -10px -100px; }
    .icon10.star-empty { background-position: -20px -100px; }
    .icon16 {
        background-repeat: no-repeat;
        height:            16px;
        width:             16px;
        display:           inline-block;
        text-indent:       -9999px;
        text-decoration:   none !important;
        background-image:  url("img/icons.png");
        background-size:   260px 160px;
        vertical-align:    top;
        margin:            0.2em 0.25em 0 0;
    }
    .icon16.rss { background-position: -16px 0; }
    .icon16.facebook { background-position: -32px 0; }
    .icon16.twitter { background-position: -48px 0; }
    .icon16.vk { background-position: -64px 0; }
    .icon16.gplus { background-position: -80px 0; }
    .icon16.pinterest { background-position: -96px 0; }
    .icon16.youtube { background-position: -112px 0; }
    .icon16.instagram { background-position: -128px 0; }
    .icon16.userpic20 { border-radius: 50%; background-size: 20px 20px; }
    .icon16.color { border-radius: 50%; border: 1px solid rgba(0, 0, 0, 0.2); width: 12px; height: 12px; background-image: none; }
    .icon16.like { background-position: 0 -16px; margin-top: 0; }
    .icon16.star,
    .icon16.star-full { background-position: -16px -16px; }
    .icon16.star-half { background-position: -32px -16px; }
    .icon16.star-empty { background-position: -48px -16px; filter: contrast(0.85) }
    .icon16.star-hover { background-position: -64px -16px; }
    .icon16.remove { background-position: -96px -16px; }
    .icon16.saved { background-position: -112px -16px; }
    .icon16.stock-red { background-position: -128px -16px; }
    .icon16.stock-yellow { background-position: -144px -16px; }
    .icon16.stock-green { background-position: -160px -16px; }
    .icon16.stock-transparent { background-position: -176px -16px; }
    .icon16.checkmark { background-position: -192px -16px; }
    .icon16.compare { background-position: -208px -16px; }
    .icon16.compare.active { background-position: -224px -16px; }
    .icon16.uarr { background: url('img/uarr.png'); background-position: 0 0; background-size: 16px 16px; }
    .icon16.loading { background-image: url('img/loading16.gif'); background-position: 0 0; background-size: 16px 16px; }
    .icon24 {
        background-repeat: no-repeat;
        height:            24px;
        width:             24px;
        display:           inline-block;
        text-indent:       -9999px;
        text-decoration:   none !important;
        background-image:  url("img/icons.png");
        background-size:   260px 160px;
        vertical-align:    top;
        margin:            0.2em 0.25em 0 0;
    }
    .icon24.rss { background-position: 0 -50px; }
    .icon24.facebook { background-position: -24px -50px; }
    .icon24.twitter { background-position: -48px -50px; }
    .icon24.vk { background-position: -72px -50px; }
    .icon24.instagram { background-position: -96px -50px; }
    .icon24.youtube { background-position: -120px -50px; }
    .icon24.pinterest { background-position: -144px -50px; }
    .icon24.gplus { background-position: -168px -50px; }
    .icon24.loading { background-image: url('img/loading.gif'); background-size: 24px 24px; height: 24px; width: 24px; display: inline-block; }
    .icon32.loading { background-image: url('img/loading.gif'); background-size: 32px 32px; height: 32px; width: 32px; display: inline-block; }

    .wa-inline-block { display: inline-block; }
    /* Flexbox utilities */
    .wa-flex { display: flex; }
    .wa-flex.space-025 { gap: 0.25rem; }
    .wa-flex.space-05 { gap: 0.5rem; }
    .wa-flex.space-075 { gap: 0.75rem; }
    .wa-flex.space-1 { gap: 1rem; }
    .wa-flex.space-2 { gap: 2rem; }
    .wa-flex.space-3 { gap: 3rem; }
    .wa-flex.space-4 { gap: 4rem; }
    .wa-flex.space-5 { gap: 5rem; }
    .wa-flex-wrap { flex-wrap: wrap; }
    .wa-flex-nowrap { flex-wrap: nowrap; }
    .wa-flex-row { flex-direction: row; }
    .wa-flex-column { flex-direction: column; }
    .wa-flex-fill { flex: 1 1 auto; }
    .justify-content-start { justify-content: flex-start; }
    .justify-content-end { justify-content: flex-end; }
    .justify-content-center { justify-content: center; }
    .justify-content-between { justify-content: space-between; }
    .justify-content-around { justify-content: space-around; }
    .justify-content-evenly { justify-content: space-evenly; }
    .align-content-start { align-content: flex-start; }
    .align-content-end { align-content: flex-end; }
    .align-content-center { align-content: center; }
    .align-content-between { align-content: space-between; }
    .align-content-around { align-content: space-around; }
    .align-content-stretch { align-content: stretch; }
    .align-items-start { align-items: flex-start; }
    .align-items-end { align-items: flex-end; }
    .align-items-center { align-items: center; }
    .align-items-baseline { align-items: baseline; }
    .align-items-stretch { align-items: stretch; }
    /* Spacing utilities */
    .wa-pb-0 { padding-bottom: 0; }
    .wa-pb-4 { padding-bottom: .25rem; }
    .wa-pb-8 { padding-bottom: .5rem; }
    .wa-pb-12 { padding-bottom: .75rem; }
    .wa-pb-16 { padding-bottom: 1rem; }
    .wa-pb-18 { padding-bottom: 1.125rem; }
    .wa-pb-20 { padding-bottom: 1.25rem; }
    .wa-pb-22 { padding-bottom: 1.375rem; }
    .wa-pb-24 { padding-bottom: 1.5rem; }
    .wa-pb-28 { padding-bottom: 1.75rem; }
    .wa-pb-32 { padding-bottom: 2rem; }

    .wa-pt-0 { padding-top: 0; }
    .wa-pt-4 { padding-top: .25rem; }
    .wa-pt-8 { padding-top: .5rem; }
    .wa-pt-12 { padding-top: .75rem; }
    .wa-pt-16 { padding-top: 1rem; }
    .wa-pt-18 { padding-top: 1.125rem; }
    .wa-pt-20 { padding-top: 1.25rem; }
    .wa-pt-22 { padding-top: 1.375rem; }
    .wa-pt-24 { padding-top: 1.5rem; }
    .wa-pt-28 { padding-top: 1.75rem; }
    .wa-pt-32 { padding-top: 2rem; }

    .wa-pl-0 { padding-left: 0; }
    .wa-pl-4 { padding-left: .25rem; }
    .wa-pl-8 { padding-left: .5rem; }
    .wa-pl-12 { padding-left: .75rem; }
    .wa-pl-16 { padding-left: 1rem; }
    .wa-pl-18 { padding-left: 1.125rem; }
    .wa-pl-20 { padding-left: 1.25rem; }
    .wa-pl-22 { padding-left: 1.375rem; }
    .wa-pl-24 { padding-left: 1.5rem; }
    .wa-pl-28 { padding-left: 1.75rem; }
    .wa-pl-32 { padding-left: 2rem; }

    .wa-pr-0 { padding-right: 0; }
    .wa-pr-4 { padding-right: .25rem; }
    .wa-pr-8 { padding-right: .5rem; }
    .wa-pr-12 { padding-right: .75rem; }
    .wa-pr-16 { padding-right: 1rem; }
    .wa-pr-18 { padding-right: 1.125rem; }
    .wa-pr-20 { padding-right: 1.25rem; }
    .wa-pr-22 { padding-right: 1.375rem; }
    .wa-pr-24 { padding-right: 1.5rem; }
    .wa-pr-28 { padding-right: 1.75rem; }
    .wa-pr-32 { padding-right: 2rem; }

    .wa-mb-0 { margin-bottom: 0; }
    .wa-mb-4 { margin-bottom: .25rem; }
    .wa-mb-8 { margin-bottom: .5rem; }
    .wa-mb-12 { margin-bottom: .75rem; }
    .wa-mb-16 { margin-bottom: 1rem; }
    .wa-mb-18 { margin-bottom: 1.125rem; }
    .wa-mb-20 { margin-bottom: 1.25rem; }
    .wa-mb-22 { margin-bottom: 1.375rem; }
    .wa-mb-24 { margin-bottom: 1.5rem; }
    .wa-mb-28 { margin-bottom: 1.75rem; }
    .wa-mb-32 { margin-bottom: 2rem; }
    .wa-mb-auto { margin-bottom: auto; }

    .wa-mt-0 { margin-top: 0; }
    .wa-mt-4 { margin-top: .25rem; }
    .wa-mt-8 { margin-top: .5rem; }
    .wa-mt-12 { margin-top: .75rem; }
    .wa-mt-16 { margin-top: 1rem; }
    .wa-mt-18 { margin-top: 1.125rem; }
    .wa-mt-20 { margin-top: 1.25rem; }
    .wa-mt-22 { margin-top: 1.375rem; }
    .wa-mt-24 { margin-top: 1.5rem; }
    .wa-mt-28 { margin-top: 1.75rem; }
    .wa-mt-32 { margin-top: 2rem; }
    .wa-mt-auto { margin-top: auto; }

    .wa-mr-0 { margin-right: 0; }
    .wa-mr-4 { margin-right: .25rem; }
    .wa-mr-8 { margin-right: .5rem; }
    .wa-mr-12 { margin-right: .75rem; }
    .wa-mr-16 { margin-right: 1rem; }
    .wa-mr-18 { margin-right: 1.125rem; }
    .wa-mr-20 { margin-right: 1.25rem; }
    .wa-mr-22 { margin-right: 1.375rem; }
    .wa-mr-24 { margin-right: 1.5rem; }
    .wa-mr-28 { margin-right: 1.75rem; }
    .wa-mr-32 { margin-right: 2rem; }
    .wa-mr-auto { margin-right: auto; }

    .wa-ml-0 { margin-left: 0; }
    .wa-ml-4 { margin-left: .25rem; }
    .wa-ml-8 { margin-left: .5rem; }
    .wa-ml-12 { margin-left: .75rem; }
    .wa-ml-16 { margin-left: 1rem; }
    .wa-ml-18 { margin-left: 1.125rem; }
    .wa-ml-20 { margin-left: 1.25rem; }
    .wa-ml-22 { margin-left: 1.375rem; }
    .wa-ml-24 { margin-left: 1.5rem; }
    .wa-ml-28 { margin-left: 1.75rem; }
    .wa-ml-32 { margin-left: 2rem; }
    .wa-ml-auto { margin-left: auto; }
    /* Typography utilities */
    .font-size-big { font-size: var(--h5-size); }

    .bg-gray { background-color: var(--bg-gray-color); }
    .bg-tr-8 { background-color: var(--bg_tr_8); }
    .bg-tr-10 { background-color: var(--bg_tr_10); }
    .bg-tr-25 { background-color: var(--bg_tr_25); }
    .bg-tr-50 { background-color: var(--bg_tr_50); }

    .w-100 { width: 100%; }

    .h-100 { height: 100%; }

    .text-white { color: var(--white); }
    .text-white-auto { color: var(--white-auto); }

    .text-black { color: var(--black); }
    .text-black-auto { color: var(--black-auto); }

    .text-gray { color: var(--gray4); }
    /* Layout responsive */
    @media (max-width: 1024px) {
        .left-sidebar > .sidebar { order: 1; }
        .left-sidebar > .content { order: 0; }
    }
    /* Tablet responsive */
    @media (min-width: 768px) and (max-width: 1024px) {
        body { -webkit-text-size-adjust: 100%; }
        header h2 { margin-right: 10px; }
        header .apps li { margin: 2px 10px 2px 0; }
    }
    /* Mobile responsive */
    @media (max-width: 768px) {
        .flyout .container { padding: 0; }
        header .apps.unfolded { display: block; }
        /* FIX ORIGINAL:
        header .cart,
        header .cart.fixed { min-width: 0 !important; position: static; }
        header .cart.fixed a { background: transparent; padding: 16px 9px 15px 17px; border-radius: 0; box-shadow: none; }
        header .cart.fixed a:hover { background: transparent; }
        */
        /* FIX: на мобильном корзина может «прилипать» при скролле (см. стили .cart.fixed ниже) */
        header .cart { min-width: 0 !important; position: relative; }
        header .cart > .container { padding: 0; }
        header .cart a { height: auto; padding: 0; }
        header .cart a .h-cart-title { display: none; }
        header .cart #cart-content { display: none; }

        .content img { max-width: 100%; }

        .wa-form .wa-field .wa-name { float: none; padding-bottom: 0; margin-bottom: 5px; }
        .wa-form .wa-field .wa-value { margin-left: 0; margin-bottom: 13px; }
        .wa-form .wa-field .wa-value p span { display: block; }
        .wa-form .wa-field .wa-value input[type="text"],
        .wa-form .wa-field .wa-value input[type="email"],
        .wa-form .wa-field .wa-value input[type="password"] { min-width: 200px; width: 100%; }

        .wa-auth-adapters p { width: 80%; }

        .wa-captcha input.wa-captcha-input { width: 100px; }

        .errormsg { margin-left: 0; }
        table td { padding: 5px; }
        html.my ul.menu-h li a { padding: 10px; }

        .comment-form-fields label { float: left; }

        .sub-links li { font-size: 110%; margin-bottom: 5px; }

        .sidebar .likebox { display: none; }

        .connect.inline .likebox { display: block; width: auto; }

        .wa-signup-form .wa-form .wa-field.wa-field-email .wa-value input { min-width: 240px; }
        .wa-signup-form .wa-form .wa-field.wa-field-password .wa-value input,
        .wa-signup-form .wa-form .wa-field.wa-field-password_confirm .wa-value input { min-width: 160px; width: 160px; }
    }

    .wa-hide { display: none; }
    .wa-show { display: revert; }
    /* Mobile */
    @media (max-width: 768px) {
        .wa-hide-m { display: none; }
        .wa-show-m { display: revert; }
    }
    /* Tablet */
    @media (min-width: 769px) and (max-width: 1024px) {
        .wa-hide-t { display: none; }
        .wa-show-t { display: revert; }
    }
    /* Desktop */
    @media (min-width: 1025px) {
        .wa-hide-d { display: none; }
        .wa-show-d { display: revert; }
    }
}

@layer page_elements {
    header.globalheader { --globalheader-mb: 2rem; position: relative; box-shadow: var(--shadow1); margin-bottom: var(--globalheader-mb); padding: .875rem 0 1rem 0; background-color: var(--bg-color-accent); }
    header.globalheader:has(.mobile-nav.opened,.search-active) { z-index: 100; }

    @media (max-width: 768px) {
        header.globalheader {
            box-shadow: none
        }
        header.globalheader .auth { display: none; }
        header.globalheader .auth li a { font-size: 1em; }
        header.globalheader .auth li a i.icon16 { margin-top: 0; }
    }
    header.globalheader .appnav:empty { margin: 0; min-height: 0; }

    @media (max-width: 768px) {
        header.globalheader .appnav:has(.category-btn-item.submenu-is-shown) .is-inline-nav { display: none; }
        header.globalheader .appnav:has(.category-btn-item.submenu-is-shown) > .is-pages { display: none; }
    }
    header.globalheader .appnav.search-active .search input { width: 100%; padding-left: 24px; }
    header.globalheader .appnav.search-active .search button { left: auto; right: 1em; }
    header.globalheader .appnav.search-active > *:not(.search) { display: none !important; }
    header.globalheader .mobile-nav { position: absolute; left: 0px; right: 0px; z-index: 9; top: 100%; background-color: var(--bg-color); }
    header.globalheader .mobile-nav.opened { padding-bottom: 1rem; }
    header.globalheader .mobile-nav .nav-negative { padding-left: 0; margin: 0; line-height: 1; }
    header.globalheader .mobile-nav .nav-negative li { list-style: none; display: block; }
    header.globalheader .mobile-nav .nav-negative li.selected a { color: var(--text-color); background: transparent; font-weight: bold; }
    header.globalheader .mobile-nav .nav-negative li a { text-decoration: none; color: var(--header-link-color); display: block; padding: 1rem; }
    header.globalheader .mobile-nav .nav-negative.auth li { display: flex; align-items: center; }

    /* FIX: стили категорий каталога внутри бургер-меню */
    header.globalheader .mobile-nav .mobile-catalog-nav {
        border-bottom: 1px solid var(--gray6, #eee);
        padding-bottom: .5rem;
        margin-bottom: .5rem;
    }
    header.globalheader .mobile-nav .mobile-catalog-nav ul {
        list-style: none;
        margin: 0;
        padding: 0 0 0 1rem;
    }
    header.globalheader .mobile-nav .mobile-catalog-nav > li > a {
        font-weight: 600;
    }
    header.globalheader .mobile-nav .mobile-catalog-title {
        padding: .75rem 1rem .25rem;
        margin: 0;
        font-size: .75rem;
        text-transform: uppercase;
        letter-spacing: .04em;
        color: var(--gray3, #888);
        font-weight: 600;
    }

    @media (max-width: 768px) {
        header.globalheader .mobile-nav .nav-negative.auth { display: block; margin-top: 0 }
        header.globalheader .mobile-nav .nav-negative.auth.nav-negative { display: flex; }
        header.globalheader .mobile-nav .nav-negative.auth.nav-negative li a { display: inline-flex; padding: 0.625rem 0rem 0.625rem 1rem; color: var(--header-link-color); }
        header.globalheader .mobile-nav .nav-negative.auth.nav-negative li a svg { margin-top: -0.0625rem; }
    }
    header a { color: var(--header-link-color); }
    header a:hover { color: var(--header-link-hover-color); }
    header a:visited { color: var(--header-link-color); }
    header h2 { margin: 0; font-size: 1em; font-weight: 500; white-space: nowrap; color: var(--header-sitename-color); }

    header h2 a { color: var(--header-sitename-color); }
    header h2 a:hover { color: var(--header-sitename-color); }
    header h2 a:visited { color: var(--header-sitename-color); }

    /* FIX: размеры логотипа — правьте здесь (единая точка настройки)
       Desktop / Mobile задаются переменными; ниже нет других max-height/max-width на #logo */
    header.globalheader {
        --logo-max-height-desktop: 100px;
        --logo-max-width-desktop: 420px;
        --logo-max-height-mobile: 100px;
        --logo-max-width-mobile: 365px;
    }
    header h2 a img#logo,
    header h2 a #logo {
        display: block;
        width: auto;
        height: auto;
        max-height: var(--logo-max-height-desktop);
        max-width: var(--logo-max-width-desktop);
    }
    @media (max-width: 768px) {
        header h2 {
            /* FIX ORIGINAL: overflow: hidden — обрезал логотип */
            overflow: visible;
            margin-right: 0 !important;
            margin-left: 0;
            text-overflow: ellipsis;
        }
        header h2 a img#logo,
        header h2 a #logo {
            max-height: var(--logo-max-height-mobile);
            max-width: var(--logo-max-width-mobile);
        }
    }
    header h2 a span { display: none; }
    header .apps { padding: 6px 0; margin: 0; display: flex; align-items: center; gap: 20px; list-style: none; }
    header .apps li { flex: 1 0 auto; }
    header .apps li.apps-overflow { position: relative; }
    header .apps .apps-overflow-toggle { display: inline-flex; align-items: flex-start; position: relative; text-decoration: none; }
    header .apps .apps-overflow-toggle.chevron.down::after { top: 0.25em !important; left: 0.4em !important; }
    header .apps .apps-overflow-menu { display: none; position: absolute; right: 0; top: calc(100% + 8px); min-width: 180px; padding: 8px 0; margin: 0; list-style: none; background: var(--bg-color); box-shadow: var(--shadow1); z-index: 20; border-radius: var(--element-border-radius); }
    header .apps .apps-overflow-menu li { margin: 0; flex: 0 0 auto; }
    header .apps .apps-overflow-menu a { display: block; white-space: nowrap; padding: 0.5rem 1rem; color: var(--header-link-color); }
    header .apps .apps-overflow-menu a:hover { color: var(--header-link-hover-color); background: var(--bg-color-accent); }
    header .apps .apps-overflow.open .apps-overflow-menu { display: block; }
    header .auth { display: flex; vertical-align: top; margin: 1px 0 0 16px; padding: 0; }
    header .auth li { display: inline-block; vertical-align: top; list-style: none; }
    header .auth li a.auth-logout { color: var(--header-apps-link-color); margin-left: 12px; }
    header .auth li a.auth-logout:hover { color: var(--header-apps-link-selected-color); }
    header .auth li .userpic20 { margin: 0; width: 20px; height: 20px; }
    header .auth li a svg { vertical-align: bottom; }
    header .cart .container { min-width: min-content; width: 100%; }
    header .cart .cart-summary { white-space: nowrap; }
    header .cart a { display: inline-flex; align-items: center; }

    /* FIX: компактный блок телефон + часы справа у корзины (десктоп) */
    header .header-contacts-bar {
        display: none;
        align-items: center;
        gap: .65rem;
        margin-right: .85rem;
        padding-right: .85rem;
        border-right: 1px solid rgba(0, 0, 0, .08);
        line-height: 1.2;
    }
    @media (min-width: 769px) {
        header .header-contacts-bar {
            display: inline-flex;
        }
    }
    header .header-contacts-bar__phone {
        display: inline-flex;
        align-items: center;
        gap: .35rem;
        color: var(--header-link-color, var(--text-color)) !important;
        font-weight: 600;
        font-size: .9375rem;
        text-decoration: none !important;
        white-space: nowrap;
        opacity: 1 !important;
        transition: color .15s ease;
    }
    header .header-contacts-bar__phone:hover {
        color: var(--header-link-hover-color, #a5682a) !important;
        opacity: 1 !important;
    }
    header .header-contacts-bar__phone-icon {
        flex: 0 0 auto;
        width: 15px;
        height: 15px;
        opacity: .75;
    }
    header .header-contacts-bar__schedule .schedule-title {
        font-size: .8125rem;
        color: var(--gray3, #888);
        cursor: pointer;
        padding: .25rem 0;
        white-space: nowrap;
    }
    header .header-contacts-bar__schedule .schedule-title:hover {
        color: var(--header-link-hover-color, #a5682a);
    }
    header .header-contacts-bar__schedule .schedule-dropdown {
        left: auto;
        right: 0;
        min-width: 220px;
    }

    /* FIX: иконка телефона возле корзины — только мобильная версия */
    /* FIX ORIGINAL: телефон был в блоке .wa-hide-m и на мобильном не отображался */
    header .header-phone-icon {
        display: none;
        align-items: center;
        justify-content: center;
        color: var(--header-apps-link-color, var(--header-link-color));
        margin-right: .25rem;
        padding: .25rem;
        line-height: 0;
    }
    header .header-phone-icon:hover {
        color: var(--header-link-hover-color, var(--header-apps-link-selected-color));
        opacity: 1;
    }
    header .header-phone-icon svg {
        display: block;
        width: 26px;
        height: 26px;
    }
    @media (max-width: 768px) {
        header .header-phone-icon {
            display: inline-flex;
        }
    }
    header .cart a .cart-total {
        background-color: var(--header-cart-total-bg-color);
        border-radius:    50%;
        color:            var(--white);
        font-size:        12px;
        padding:          2px 6px;
        line-height:      14px;
        font-weight:      400;
        display:          inline-block;
        text-align:       center;
        white-space:      nowrap;
        vertical-align:   baseline;
    }
    header .cart a .cart-total:empty { padding: 0; }
    header .cart a .ruble { line-height: 1em; font-size: 10px; }
    header .cart a.cart-to-checkout { display: none; text-align: center; font-weight: bold; padding: 11px 18px; color: var(--link-color); font-size: 1.1em; }
    header .cart a.cart-to-checkout:hover { background-color: var(--white) !important; }
    header .cart .cart-just-added { position: absolute; top: 100%; left: 0; width: 100%; box-sizing: border-box; display: none; padding: 9px 18px; font-size: 0.9em; }
    header .cart.fixed {
        position:        fixed;
        top:             0;
        left:            0;
        right:           0;
        z-index:         999;
        padding-left:    var(--container-padding);
        padding-right:   var(--container-padding);
        text-align:      right;
        max-width:       var(--container-max-width);
        margin:          0 auto;
        justify-content: flex-end;
    }
    header .cart.fixed a { text-align: center; border-top: none; background-color: var(--red); color: var(--white); padding: 4px 10px 6px 10px; box-shadow: var(--shadow1); border-radius: 0 0 clamp(0px, var(--element-border-radius), 1rem) clamp(0px, var(--element-border-radius), 1rem); }
    header .cart.fixed a:hover { background-color: #d33 !important; }
    header .cart.fixed a.cart-to-checkout { display: block; border: none; background: var(--white); box-shadow: 0 5px 10px -6px rgba(0, 0, 0, 0.2); }
    header .cart.fixed a.cart-to-checkout:hover { color: var(--red) !important; }
    header .cart.fixed a .cart-total { background-color: var(--white); color: var(--red); }
    header .cart.fixed .cart-just-added { background: var(--gray5); display: inline-block; border-radius: 10px; margin-top: 4px; position: relative; width: auto; }
    header #mobile-nav-toggle {
        /* mobile only */
        display:       none;
        border:        none;
        padding:       .3125rem;
        margin:        0 0 0 .5rem;
        width:         2rem;
        min-width:     2rem;
        max-width:     2rem;
        height:        2rem;
        flex:          0 0 2rem;
        color:         var(--header-apps-link-color);
        background:    transparent;
        border-radius: 0;
        outline:       none;
        font-size:     1.2em;
        box-sizing:    border-box;
        align-items:   center;
        justify-content: center;
        line-height:   0;
        overflow:      hidden;
    }
    header #mobile-nav-toggle::after { content: none; }
    header #mobile-nav-toggle .hamburger-icon {
        display: block;
        width: 22px !important;
        height: 16px !important;
        max-width: 22px !important;
        max-height: 16px !important;
        flex-shrink: 0;
        transition: all 0.3s ease;
    }
    header #mobile-nav-toggle .hamburger-icon .hamburger-line { transition: all 0.3s ease; transform-origin: center; }
    header #mobile-nav-toggle.opened .hamburger-line-1 { transform: rotate(45deg) translate(.0625rem, .3125rem); }
    header #mobile-nav-toggle.opened .hamburger-line-2 { opacity: 0; }
    header #mobile-nav-toggle.opened .hamburger-line-3 { transform: rotate(-45deg) translate(.0625rem, -0.3125rem); }
    header #globalnav { margin-bottom: 1.125rem; }

    @media (max-width: 768px) {
    }
    header #globalnav .globalnav-bar { color: var(--gray3); }

    @media (max-width: 768px) {
        header #globalnav .globalnav-bar {
            gap: 0 !important
        }
    }

    /* FIX: мобильная шапка — лого; ниже ряд: бургер | поиск | телефон | красная корзина */
    /* FIX ORIGINAL: все кнопки были справа под логотипом; бургер вне/в конце actions-bar */
    @media (max-width: 768px) {
        header.globalheader {
            --header-action-size: clamp(2.75rem, 11vw, 3.25rem);
            --header-action-icon: clamp(1.3rem, 5.5vw, 1.6rem);
            --bakery-cream: #fbf6ef;
            --bakery-crust: #a5682a;
            display: grid;
            grid-template-columns: auto minmax(0, 1fr) auto auto;
            grid-template-areas:
                "logo logo logo logo"
                "burger search phone cart";
            align-items: center;
            column-gap: clamp(.4rem, 2vw, .65rem);
            row-gap: .55rem;
            padding-left: var(--container-padding, .75rem);
            padding-right: var(--container-padding, .75rem);
            box-sizing: border-box;
        }
        /* «прозрачные» обёртки — дети участвуют в grid шапки */
        header.globalheader > #globalnav,
        header.globalheader > #globalnav > .container,
        header.globalheader #globalnav .globalnav-bar,
        header.globalheader #globalnav .header-actions-bar,
        header.globalheader > .appnav {
            display: contents !important;
        }
        header.globalheader > .mobile-nav {
            grid-column: 1 / -1;
        }
        header.globalheader #globalnav .globalnav-bar > h2 {
            grid-area: logo;
            width: 100%;
            max-width: 100%;
            margin: 0 !important;
            overflow: visible;
        }
        header.globalheader #globalnav .globalnav-bar > h2 a {
            display: inline-flex;
            max-width: 100%;
        }
        /* размер #logo — только через --logo-max-*-mobile выше, здесь не переопределяем */
        header.globalheader #globalnav .globalnav-bar > nav,
        header.globalheader .header-contacts-bar,
        header.globalheader #globalnav .header-actions-bar > .auth {
            display: none !important;
        }
        header.globalheader #mobile-nav-toggle {
            grid-area: burger;
        }
        header.globalheader .header-phone-icon {
            grid-area: phone;
        }
        header.globalheader #cart {
            grid-area: cart;
        }
        header.globalheader .search {
            grid-area: search;
            flex: 1 1 auto;
            min-width: 0;
            width: 100%;
            margin: 0 !important;
        }
        /* единый стиль кнопок + выравнивание по высоте поиска */
        header.globalheader #mobile-nav-toggle,
        header.globalheader .header-phone-icon,
        header.globalheader #cart:not(.fixed) > a.cart-summary {
            display: inline-flex !important;
            align-items: center;
            justify-content: center;
            width: var(--header-action-size) !important;
            min-width: var(--header-action-size) !important;
            max-width: var(--header-action-size) !important;
            height: var(--header-action-size) !important;
            flex: 0 0 var(--header-action-size) !important;
            margin: 0 !important;
            padding: 0 !important;
            box-sizing: border-box;
            border-radius: clamp(12px, 3vw, 16px);
            -webkit-tap-highlight-color: transparent;
            transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease;
        }
        header.globalheader #mobile-nav-toggle,
        header.globalheader .header-phone-icon {
            background: var(--bakery-cream);
            border: 1px solid rgba(165, 104, 42, .2);
            color: var(--bakery-crust) !important;
            box-shadow:
                0 2px 10px rgba(61, 42, 26, .1),
                0 1px 0 rgba(255, 255, 255, .75) inset;
        }
        header.globalheader #mobile-nav-toggle:active,
        header.globalheader .header-phone-icon:active {
            transform: scale(.96);
            background: #f3ebe0;
        }
        header.globalheader .header-phone-icon {
            margin-right: 0 !important;
        }
        header.globalheader .header-phone-icon svg {
            width: var(--header-action-icon) !important;
            height: var(--header-action-icon) !important;
        }
        header.globalheader #mobile-nav-toggle {
            background: var(--bakery-cream) !important;
            border: 1px solid rgba(165, 104, 42, .2) !important;
            color: var(--bakery-crust) !important;
            overflow: visible;
        }
        header.globalheader #mobile-nav-toggle .hamburger-icon {
            width: calc(var(--header-action-icon) * 1.15) !important;
            height: calc(var(--header-action-icon) * .82) !important;
            max-width: none !important;
            max-height: none !important;
        }
        /* FIX: корзина — кремовая если пустая; красная только если есть товар (как .fixed на десктопе) */
        /* FIX ORIGINAL: всегда красная кнопка корзины на мобильном */
        header.globalheader #cart:not(.fixed) {
            position: relative;
        }
        header.globalheader #cart:not(.fixed) > a.cart-summary {
            position: relative;
            gap: 0;
            background: var(--bakery-cream);
            border: 1px solid rgba(165, 104, 42, .2);
            color: var(--bakery-crust) !important;
            box-shadow:
                0 2px 10px rgba(61, 42, 26, .1),
                0 1px 0 rgba(255, 255, 255, .75) inset;
        }
        header.globalheader #cart:not(.fixed) > a.cart-summary:active {
            transform: scale(.96);
            background: #f3ebe0;
        }
        header.globalheader #cart:not(.fixed):not(.empty) > a.cart-summary {
            background: var(--red, #f43434) !important;
            border: 1px solid var(--red, #f43434) !important;
            color: #fff !important;
            box-shadow: 0 3px 12px rgba(244, 52, 52, .28);
        }
        header.globalheader #cart:not(.fixed):not(.empty) > a.cart-summary:active {
            background: #d92d2d !important;
        }
        header.globalheader #cart:not(.fixed) > a.cart-summary svg {
            width: calc(var(--header-action-icon) * 1.1) !important;
            height: calc(var(--header-action-icon) * 1.1) !important;
            display: block;
            flex-shrink: 0;
            color: inherit;
        }
        header.globalheader #cart:not(.fixed):not(.empty) > a.cart-summary svg {
            color: #fff;
        }
        header.globalheader #cart:not(.fixed) > a.cart-summary .cart-total {
            position: absolute;
            top: .12rem;
            right: .12rem;
            min-width: 1.15rem;
            height: 1.15rem;
            padding: 0 .28rem;
            line-height: 1.15rem;
            font-size: .68rem;
            font-weight: 700;
            background: var(--bakery-crust) !important;
            color: #fff !important;
            border-radius: 999px;
            box-shadow: 0 1px 3px rgba(61, 42, 26, .2);
        }
        header.globalheader #cart:not(.fixed):not(.empty) > a.cart-summary .cart-total {
            background: #fff !important;
            color: var(--red, #f43434) !important;
            box-shadow: 0 1px 3px rgba(0, 0, 0, .15);
        }
        header.globalheader #cart:not(.fixed) > a.cart-summary .cart-total:empty {
            display: none;
        }

        /* FIX: плавающая корзина — квадрат как в меню, красная, верхний правый угол (как десктоп) */
        /* FIX ORIGINAL: круглая FAB справа снизу */
        header .cart.fixed {
            position: fixed !important;
            top: 0 !important;
            bottom: auto !important;
            left: 0 !important;
            right: 0 !important;
            z-index: 999;
            width: 100% !important;
            max-width: none !important;
            margin: 0 !important;
            padding: env(safe-area-inset-top, 0px) var(--container-padding, .75rem) 0 !important;
            justify-content: flex-end;
            align-items: flex-start;
            box-sizing: border-box;
            animation: bakery-float-in .32s cubic-bezier(.22, .61, .36, 1);
        }
        header .cart.fixed > a.cart-summary {
            display: inline-flex !important;
            align-items: center;
            justify-content: center;
            position: relative;
            width: var(--header-action-size, clamp(2.75rem, 11vw, 3.25rem)) !important;
            height: var(--header-action-size, clamp(2.75rem, 11vw, 3.25rem)) !important;
            min-width: var(--header-action-size, clamp(2.75rem, 11vw, 3.25rem)) !important;
            padding: 0 !important;
            border-radius: clamp(12px, 3vw, 16px) !important;
            background: var(--red, #f43434) !important;
            color: #fff !important;
            border: none !important;
            box-shadow: var(--shadow1, 0 .625rem 3.75rem rgba(0, 0, 0, .1)) !important;
            transition: transform .2s ease, background-color .2s ease;
        }
        header .cart.fixed > a.cart-summary:hover,
        header .cart.fixed > a.cart-summary:active {
            background: #d33 !important;
            color: #fff !important;
            transform: none;
        }
        header .cart.fixed > a.cart-summary svg {
            width: calc(var(--header-action-icon, 1.45rem) * 1.1) !important;
            height: calc(var(--header-action-icon, 1.45rem) * 1.1) !important;
            color: #fff;
        }
        header .cart.fixed > a.cart-summary .h-cart-title {
            display: none !important;
        }
        header .cart.fixed > a.cart-summary .cart-total {
            position: absolute;
            top: .12rem;
            right: .12rem;
            min-width: 1.15rem;
            height: 1.15rem;
            padding: 0 .28rem;
            line-height: 1.15rem;
            font-size: .68rem;
            font-weight: 700;
            background: #fff !important;
            color: var(--red, #f43434) !important;
            border-radius: 999px;
            box-shadow: 0 1px 3px rgba(0, 0, 0, .15);
        }
        header .cart.fixed a.cart-to-checkout {
            display: none !important;
        }
        header .cart.fixed #cart-content,
        header .cart.fixed .cart-just-added {
            display: none !important;
        }
    }

    @keyframes bakery-float-in {
        from {
            opacity: 0;
            transform: translateY(-10px);
        }
        to {
            opacity: 1;
            transform: none;
        }
    }

    /* FIX: кнопка «наверх» — мобильная, цвета пекарни */
    .scroll-to-top {
        display: none;
        position: fixed;
        z-index: 997;
        bottom: max(1.15rem, env(safe-area-inset-bottom, 0px));
        left: max(1rem, env(safe-area-inset-left, 0px));
        width: clamp(2.85rem, 12vw, 3.35rem);
        height: clamp(2.85rem, 12vw, 3.35rem);
        align-items: center;
        justify-content: center;
        padding: 0;
        margin: 0;
        border: 1px solid rgba(165, 104, 42, .22);
        border-radius: 50%;
        background: #fbf6ef;
        color: #a5682a;
        box-shadow:
            0 8px 22px rgba(61, 42, 26, .18),
            0 1px 0 rgba(255, 255, 255, .7) inset;
        cursor: pointer;
        opacity: 0;
        visibility: hidden;
        transform: translateY(10px) scale(.92);
        transition: opacity .28s ease, transform .28s ease, visibility .28s ease, background-color .2s ease, color .2s ease;
        -webkit-tap-highlight-color: transparent;
    }
    .scroll-to-top.is-visible {
        opacity: 1;
        visibility: visible;
        transform: none;
    }
    .scroll-to-top:active {
        background: #a5682a;
        color: #fbf6ef;
        transform: scale(.96);
    }
    .scroll-to-top svg {
        display: block;
        width: 1.25rem;
        height: 1.25rem;
    }
    @media (max-width: 768px) {
        .scroll-to-top {
            display: inline-flex;
        }
    }
    @media (min-width: 769px) {
        .scroll-to-top {
            display: none !important;
        }
    }
    header #globalnav .globalnav-bar nav { flex: 0 1 auto; min-width: 0; }
    header #globalnav .globalnav-bar.selected a { color: var(--header-link-hover-color); }

    @media (max-width: 768px) {
        /* FIX ORIGINAL:
        header #globalnav > .container {
            padding: 0 0.5rem
        }
        */
        /* FIX: отступы задаёт header.globalheader (grid), чтобы бургер совпадал с поиском */
        header #globalnav > .container {
            padding-left: 0;
            padding-right: 0;
        }
    }

    @media (max-width: 768px) {
        header #globalnav nav {
            display: none !important
        }
    }
    header .search { min-width: 12rem; }
    header .search [type="search"] { width: 100%; border: 0; background-color: var(--header-search-input-bg-color); color: var(--header-search-input-color); transition: background-color 300ms linear; }
    header .search [type="search"]:focus,
    header .search [type="search"]:hover { background-color: var(--header-search-input-bg-color-hover); }

    @media (max-width: 768px) {
        /* FIX ORIGINAL:
        header .search { min-width: auto; font-size: .875rem }
        header .search .search-wrapper input { width: 0; padding-left: 24px; }
        header .search .search-wrapper button { right: auto; left: 1em; }
        */
        /* FIX: поиск на всю ширину в ряду с бургером/телефоном/корзиной */
        header .search {
            flex: 1 1 auto;
            min-width: 0;
            width: 100%;
            font-size: .875rem;
        }
        header .search .search-wrapper {
            display: flex;
            align-items: center;
            height: var(--header-action-size, clamp(2.75rem, 11vw, 3.25rem));
        }
        header .search .search-wrapper input {
            width: 100%;
            height: 100%;
            padding-left: 1em;
            padding-right: 2.5rem;
            box-sizing: border-box;
            border-radius: clamp(12px, 3vw, 16px);
        }
        header .search .search-wrapper button {
            left: auto;
            right: 1em;
        }

        /* FIX: скрыть кнопку «Каталог товаров» на мобильном (ссылки уходят в бургер) */
        header .pages.is-dropdown-nav {
            display: none !important;
        }

        /* FIX: скрыть кнопку «Теги» на мобильном
           Файл: wa-data/public/site/themes/default/default.css */
        header .pages .tags-nav-item {
            display: none !important;
        }

        /* FIX: страницы магазина (Доставка и оплата и т.п.) убираем из appnav — они в бургере */
        /* FIX ORIGINAL: header .pages.is-pages оставались в строке и сжимали поиск */
        header .pages.is-pages {
            display: none !important;
        }

        /* FIX: appnav — только поиск (остальное через display:contents в grid шапки) */
        header.globalheader .appnav {
            gap: 0;
            padding-left: 0;
            padding-right: 0;
            min-width: 0;
        }
    }

    /* FIX: на десктопе страницы «Доставка и оплата» / «О компании» убраны из шапки —
       они перенесены в футер; в HTML остаются для клонирования в бургер на мобильном */
    /* FIX ORIGINAL: эти ссылки показывались в header ul.is-pages рядом с Тегами */
    @media (min-width: 769px) {
        header ul.pages.is-pages > li:not(.tags-nav-item):not(.collapsible) {
            display: none !important;
        }
    }
    header .pages { padding: 0; margin: 0; display: flex; align-items: center; gap: 1.25rem; }
    header .pages.is-inline-nav { padding-top: .8309rem; padding-bottom: .8309rem; }

    @media (max-width: 768px) {
        header .pages { display: flex; flex-wrap: wrap; gap: 18px; }
    }
    header .pages li { display: inline-block; list-style: none; }
    header .pages li.category-btn-item { display: inline-flex; }
    header .pages li.category-btn-item > a.button { display: inline; color: var(--button-text-color); font-weight: normal; padding: 0.907em 1.83em 0.907em 1.25em; }
    header .pages li.category-btn-item > a.button::after { top: -0.25em !important; left: 0.6em !important; transition: transform 0.3s ease; }

    @media (max-width: 768px) {
        header .pages li.category-btn-item > a {
            font-size: .875rem
        }
    }

    header .pages li.category-btn-item.submenu-is-shown > a::after { transform: rotate(226deg) !important; top: 0 !important; }
    header .pages li a { display: block; color: var(--header-menu-pages-link-color); transition: opacity 200ms linear; padding-right: 0.4rem; }
    header .pages li a:hover { opacity: .6; }
    header .pages li a.button { display: inline; color: var(--button-text-color); font-weight: 600; padding: 0.907em 1.35em 0.907em 1em; }
    header .pages li a.button::after { top: -0.25em !important; left: 0.4em !important; width: .5em !important; height: .5em !important; border-width: 0 .15em .15em 0 !important; }

    @media (max-width: 768px) {
        header .pages li a.button {
            font-size: .875rem
        }
    }
    header .pages li.selected a { font-weight: bold; border-radius: 3px; background: transparent; }
    header ul.flyout-nav li .flyout {
        visibility: hidden;
        opacity:    0;
        position:   absolute;
        top:        99%;
        left:       0;
        right:      0;
        min-height: 0;
        padding:    12px 20px;
        text-align: left;
        z-index:    101;
        background-color: var(--bg-color);
        max-height: 80px;
        overflow: hidden;
        box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
        transition: opacity .2s ease, visibility .2s ease;
    }
    header ul.flyout-nav li .flyout a { text-transform: none; }
    header ul.flyout-nav li .flyout ul.menu-v li { border: none; vertical-align: top; text-align: left; margin: 0 12px 10px 0; }
    header ul.flyout-nav li .flyout ul.menu-v li.collapsible { background: none; }
    header ul.flyout-nav li .flyout ul.menu-v li a { font-weight: 600; padding-left: 0; font-size: .95em; line-height: 1.25; }
    header ul.flyout-nav li .flyout ul.menu-v li ul.menu-v li { display: block; margin: 0; font-size: .85em; }
    header ul.flyout-nav li .flyout ul.menu-v li ul.menu-v li a { font-weight: normal; padding: .15em 0; }
    header ul.flyout-nav li .flyout ul.menu-v li ul.menu-v li ul { display: none; }
    header ul.flyout-nav li .flyout ul.menu-v.brands { text-align: center; }
    header ul.flyout-nav li .flyout ul.menu-v.brands a { font-size: 1.05em; font-weight: normal; }
    header ul.flyout-nav li .flyout .departments { padding-inline: var(--container-padding); }
    header ul.flyout-nav li .flyout .departments ul.menu-v li { width: 148px; }
    header ul.flyout-nav li .flyout .tags { font-size: 100%; }
    header ul.flyout-nav li.submenu-is-shown .flyout { visibility: visible; opacity: 1; max-height: min(70vh, 520px); overflow: auto; }

    /* Compact catalog panel */
    /* FIX ORIGINAL: плоская компактная сетка без иерархии подменю
    header ul.flyout-nav li.category-btn-item .flyout {
        padding: 10px 12px 14px;
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments ul.menu-v {
        display: flex;
        flex-wrap: wrap;
        gap: 4px 8px;
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments ul.menu-v > li {
        width: 140px;
        margin: 0;
        padding: 6px 8px;
        border-radius: 8px;
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments ul.menu-v > li > a {
        font-size: .9em;
        font-weight: 600;
    }
    */

    /* FIX: каталог товаров в стиле пекарни — стабильное открытие + удобные меню/подменю */
    /* FIX ORIGINAL: position:relative на li ломал ширину шторки (она становилась шириной кнопки) */
    header ul.flyout-nav li.category-btn-item {
        /* не задаём position:relative — иначе .flyout привязывается к кнопке, а не к шапке */
        z-index: 102;
    }
    header ul.flyout-nav li.category-btn-item > a.button {
        position: relative;
        z-index: 103;
        cursor: pointer;
    }
    header ul.flyout-nav.is-dropdown-nav {
        position: static;
    }
    header ul.flyout-nav li.category-btn-item .flyout {
        --bakery-cream: #fbf6ef;
        --bakery-cream-soft: #f3ebe0;
        --bakery-crust: #a5682a;
        --bakery-crust-soft: rgba(165, 104, 42, .12);
        --bakery-ink: #3d2a1a;
        /* FIX: полноширинная шторка относительно header.globalheader */
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        width: 100%;
        padding: 0;
        min-height: 0;
        max-height: 0;
        overflow: hidden;
        border-radius: 0 0 16px 16px;
        background: linear-gradient(180deg, var(--bakery-cream) 0%, #fff 55%);
        border: 1px solid var(--bakery-crust-soft);
        border-top: 3px solid var(--bakery-crust);
        box-shadow:
            0 18px 40px rgba(61, 42, 26, .14),
            0 2px 0 rgba(255, 255, 255, .7) inset;
        transition: opacity .2s ease, visibility .2s ease, max-height .25s ease;
        pointer-events: none;
        z-index: 101;
    }
    /* FIX: невидимый мост над панелью — курсор не «проваливается» в дыру */
    header ul.flyout-nav li.category-btn-item .flyout::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -24px;
        height: 24px;
        background: transparent;
    }
    header ul.flyout-nav li.category-btn-item.submenu-is-shown .flyout {
        visibility: visible;
        opacity: 1;
        max-height: min(72vh, 560px);
        overflow: visible;
        pointer-events: auto;
    }
    header ul.flyout-nav li.category-btn-item .flyout > .container {
        padding: 1.25rem 1.5rem 1.5rem;
        max-width: var(--container-max-width, 1140px);
        margin: 0 auto;
        max-height: min(68vh, 520px);
        overflow: auto;
        -webkit-overflow-scrolling: touch;
        border-radius: 0 0 14px 14px;
        box-sizing: border-box;
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments {
        padding-inline: 0;
    }
    /* сетка колонок: родитель + подменю под ним */
    header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v {
        display: grid !important;
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 1rem 1.25rem;
        margin: 0;
        padding: 0;
        list-style: none;
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li {
        width: auto !important;
        margin: 0 !important;
        padding: .85rem 1rem;
        border-radius: 12px;
        background: rgba(255, 255, 255, .85);
        border: 1px solid rgba(165, 104, 42, .12);
        box-sizing: border-box;
        transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li:hover {
        background: #fff;
        border-color: rgba(165, 104, 42, .28);
        box-shadow: 0 6px 16px rgba(61, 42, 26, .08);
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li > a {
        display: block;
        font-size: .95rem;
        font-weight: 700;
        line-height: 1.3;
        color: var(--bakery-ink) !important;
        padding: 0 0 .55rem !important;
        margin: 0 0 .45rem;
        border-bottom: 1px solid rgba(165, 104, 42, .18);
        opacity: 1 !important;
        text-decoration: none !important;
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li > a:hover {
        color: var(--bakery-crust) !important;
        opacity: 1 !important;
    }
    /* подменю — вертикальный список под родителем */
    header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li > ul.menu-v {
        display: flex !important;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: .15rem;
        margin: 0;
        padding: 0;
        list-style: none;
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li > ul.menu-v > li {
        width: auto !important;
        margin: 0 !important;
        padding: 0;
        border: none;
        background: transparent;
        box-shadow: none;
        border-radius: 0;
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li > ul.menu-v > li > a {
        display: block;
        font-size: .875rem;
        font-weight: 400;
        line-height: 1.35;
        color: rgba(61, 42, 26, .82) !important;
        padding: .35rem .4rem !important;
        margin: 0;
        border: none;
        border-radius: 8px;
        opacity: 1 !important;
        text-decoration: none !important;
    }
    header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v > li > ul.menu-v > li > a:hover {
        background: var(--bakery-crust-soft);
        color: var(--bakery-crust) !important;
        opacity: 1 !important;
    }
    /* третий уровень скрываем — слишком глубоко для шторки */
    header ul.flyout-nav li.category-btn-item .flyout .departments ul.menu-v ul.menu-v ul {
        display: none !important;
    }

    @media (min-width: 1100px) {
        header ul.flyout-nav li.category-btn-item .flyout .departments > ul.menu-v {
            grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
            gap: 1.1rem 1.5rem;
        }
    }

    /* FIX: на десктопе высота кнопки «Теги» как у поля поиска (ширину не растягиваем) */
    /* FIX ORIGINAL: ошибочно делали ширину Тегов = ширине поиска */
    @media (min-width: 769px) {
        header.globalheader .appnav > .is-dropdown-nav {
            flex: 0 0 auto;
        }
        header.globalheader .appnav > .search {
            flex: 1 1 auto;
            min-width: 12rem;
        }
        header.globalheader .appnav > .is-pages {
            flex: 0 0 auto;
            overflow: visible;
        }
        header.globalheader .appnav > .is-pages > .tags-nav-item > a.tags-nav-btn {
            box-sizing: border-box;
            /* высота как у input поиска (~2.75–3rem в теме) */
            min-height: 2.85rem;
            height: 2.85rem;
            padding: 0 1.15em;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: auto;
        }
    }

    /* Modern tags cloud */
    header ul.flyout-nav li.tags-nav-item .flyout,
    header ul.flyout-nav li .flyout.tags-flyout {
        min-height: 0;
        padding: 12px 16px 16px;
        top: 100%;
        pointer-events: none;
    }
    header ul.flyout-nav li.tags-nav-item.submenu-is-shown .flyout,
    header ul.flyout-nav li.submenu-is-shown .flyout.tags-flyout {
        pointer-events: auto;
    }
    header ul.flyout-nav li.tags-nav-item .flyout::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: -14px;
        height: 14px;
    }

    /* FIX: кнопка «Теги» — заметная кнопка на десктопе, а не просто текст */
    /* FIX ORIGINAL: header .tags-nav-item > a выглядела как обычная ссылка меню */
    header .pages li.tags-nav-item {
        display: inline-flex;
        align-items: center;
    }
    header .pages li.tags-nav-item > a.tags-nav-btn {
        display: inline-flex;
        align-items: center;
        gap: .4rem;
        padding: .65em 1.15em .65em .9em;
        margin: 0;
        border-radius: 999px;
        background: #fbf6ef;
        border: 1px solid rgba(165, 104, 42, .28);
        color: #3d2a1a !important;
        font-weight: 600;
        font-size: .9rem;
        line-height: 1.2;
        text-decoration: none !important;
        opacity: 1 !important;
        transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
        white-space: nowrap;
    }
    header .pages li.tags-nav-item > a.tags-nav-btn:hover {
        background: #fff;
        border-color: rgba(165, 104, 42, .55);
        color: #a5682a !important;
        opacity: 1 !important;
        box-shadow: 0 4px 12px rgba(61, 42, 26, .08);
    }
    header .pages li.tags-nav-item.submenu-is-shown > a.tags-nav-btn {
        background: #a5682a;
        border-color: #a5682a;
        color: #fff !important;
        box-shadow: 0 6px 16px rgba(165, 104, 42, .28);
    }
    header .pages li.tags-nav-item > a.tags-nav-btn.chevron::after {
        top: -0.15em !important;
        left: 0.35em !important;
        border-color: currentColor;
        opacity: .85;
    }
    header .pages li.tags-nav-item.submenu-is-shown > a.tags-nav-btn.chevron::after {
        transform: rotate(226deg) !important;
        top: 0.05em !important;
    }
    header .pages li.tags-nav-item .tags-nav-btn__icon {
        flex: 0 0 auto;
        width: 15px;
        height: 15px;
        opacity: .9;
    }
    header .pages li.tags-nav-item .tags-nav-btn__text {
        display: inline;
    }

    header ul.flyout-nav li .tags-cloud {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        justify-content: flex-start;
        align-items: center;
        padding: 0;
        margin: 0;
        line-height: 1.2;
    }
    header ul.flyout-nav li .tags-cloud__item {
        display: inline-flex !important;
        align-items: center;
        padding: .4em .75em !important;
        margin: 0 !important;
        border-radius: 999px;
        background: var(--bg-color-accent, var(--gray7, #f3f3f3));
        color: var(--text-color) !important;
        font-size: clamp(.75rem, calc(var(--tag-size, 100) * 0.12px + .7rem), 1rem) !important;
        opacity: max(.55, var(--tag-opacity, 1)) !important;
        font-weight: 500;
        line-height: 1.2;
        text-decoration: none !important;
        transition: background-color .15s ease, color .15s ease, transform .15s ease;
        white-space: nowrap;
    }
    header ul.flyout-nav li .tags-cloud__item:hover {
        background: var(--button-background-color, var(--link-color));
        color: var(--button-text-color, #fff) !important;
        opacity: 1 !important;
        transform: translateY(-1px);
    }

    @media (max-width: 768px) {
        /* FIX: на мобильном кнопка каталога скрыта — стили панели не нужны в appnav */
        header ul.flyout-nav li.tags-nav-item {
            position: relative;
            flex: 0 0 auto;
        }
        header ul.flyout-nav li.tags-nav-item .flyout,
        header ul.flyout-nav li .flyout.tags-flyout {
            padding: 12px;
            max-height: min(60vh, 360px);
        }
        header ul.flyout-nav li.tags-nav-item.submenu-is-shown .flyout,
        header ul.flyout-nav li.submenu-is-shown .flyout.tags-flyout {
            max-height: min(60vh, 360px);
            overflow: auto;
            -webkit-overflow-scrolling: touch;
        }
        header ul.flyout-nav li .tags-cloud {
            gap: 6px;
        }
        header ul.flyout-nav li .tags-cloud__item {
            padding: .35em .65em !important;
            font-size: .8125rem !important;
        }
    }
    /* Footer
    --------- */
    footer.globalfooter { box-shadow: var(--shadow1); z-index: 0; padding-top: 25px; min-height: 40px; background-color: var(--bg-color-accent); position: relative; overflow: hidden; }
    footer .footer-block { word-break: break-word; }
    footer .footer-block a { display: block; padding: 1px 0; margin-bottom: 16px; }
    footer .footer-block a.top { display: block; }
    footer .footer-block.contact-us .social { display: flex; gap: 10px; margin-bottom: 16px; }
    footer .footer-block.contact-us .social a {
        color:           var(--black) !important;
        width:           32px;
        height:          32px;
        background:      var(--gray6);
        border-radius:   min(.625rem, var(--element-border-radius));
        display:         flex;
        align-items:     center;
        justify-content: center;
        transition:      opacity 200ms linear;
    }
    footer .footer-block.contact-us .social a:hover { opacity: .6; }

    /* FIX: компактные ссылки страниц магазина в футере */
    footer .footer-shop-pages {
        margin-top: 8px;
    }
    footer .footer-shop-pages a {
        margin-bottom: 10px;
    }

    /* FIX: блок «Контакты» справа */
    footer .footer-contacts {
        max-width: 22rem;
        margin-left: auto;
        line-height: 1.45;
    }
    footer .footer-contacts__title {
        font-size: 1.05em;
        font-weight: 600;
        margin-bottom: 10px;
        color: var(--text-color);
    }
    footer .footer-contacts__line {
        margin: 0 0 4px;
        color: var(--footer-link-color, var(--text-color));
    }
    footer .footer-contacts__address {
        margin-top: 10px;
    }
    @media (max-width: 768px) {
        footer .footer-contacts {
            max-width: none;
            margin-left: 0;
            margin-top: 8px;
        }
    }

    /* FIX: пшеница справа в футере — только десктоп, с прозрачностью, без налезания на текст */
    footer.globalfooter .footer-wheat {
        display: none;
    }
    @media (min-width: 769px) {
        footer.globalfooter .footer-wheat {
            display: block;
            position: absolute;
            right: 0;
            bottom: 0;
            width: min(520px, 42vw);
            height: auto;
            max-width: 560px;
            opacity: .22;
            pointer-events: none;
            user-select: none;
            z-index: 0;
            object-fit: contain;
            object-position: right bottom;
        }
        footer.globalfooter > .container,
        footer.globalfooter > .mailer-subscribe,
        footer.globalfooter > .appfooter {
            position: relative;
            z-index: 1;
        }
        /* FIX: справа запас под пшеницу, чтобы текст не наезжал */
        footer.globalfooter > .container {
            padding-right: max(var(--container-padding), 14rem);
        }
        footer.globalfooter .footer-contacts {
            position: relative;
            z-index: 2;
        }
    }

    footer a { color: var(--footer-link-color); }
    footer a:hover { color: var(--footer-link-hover-color); }
    footer a:visited { color: var(--footer-link-color); }
    footer .appfooter { position: relative; text-align: center; padding: 20px 0; color: var(--footer-app-color); border-top: 2px solid var(--footer-divider-color); min-height: 1.5em; margin-top: 20px; }
    footer .appfooter .poweredby { flex: 0 0 auto; font-size: 0.875rem; }
    footer .appfooter .poweredby a { text-decoration: underline; }
    footer .appfooter .webasyst-magic-wand {
        display:         inline-block;
        width:           16px;
        height:          16px;
        background:      url("img/webasyst.svg") no-repeat;
        margin-right:    4px;
        position:        relative;
        top:             2px;
        z-index:         -1;
        background-size: 16px 16px;
    }
    footer .footer-note { color: var(--footer-notice-color); font-size: 0.9em; }
    footer .s-footer-notice { color: var(--footer-notice-color); margin-top: 16px; font-size: 0.9em; line-height: 1.3em; text-align: left; }
    footer .s-footer-notice a { color: inherit; text-decoration: underline; }
}

/* Main
------- */
main { flex: 1 }
main.maincontent { margin: 0; background: var(--bg-color); }
main.maincontent .container { padding-bottom: 40px; }


.right-sidebar > .sidebar { order: 1; }
.right-sidebar > .content { order: 0; }

.sidebar > *:not(:empty) { margin: 0 !important; background: var(--bg_tr_8); border-radius: var(--element-border-radius); padding: 20px; }
.sidebar > *:not(:last-child) { margin-bottom: 20px !important; }
.content { position: relative; }

.likebox { margin-bottom: 25px; overflow: hidden; }

.connect.inline .likebox { width: 260px; display: inline-block; vertical-align: top; margin-right: 50px; }

.leadbox { background: #fafadf; border: 1px solid rgba(0, 0, 0, 0.07); box-shadow: 0 3px 8px -4px rgba(0, 0, 0, 0.1); }
.leadbox h4 { font-size: 1.5em; line-height: 1.2em; }

.mailer-subscribe { padding: 7px 47px 32px; margin-bottom: 32px; border-bottom: 2px solid var(--footer-divider-color); }
@media (max-width: 768px) {
    .mailer-subscribe { padding: 0 0 2rem 0; margin-bottom: 2rem }
}

.mailer-subscribe a { color: var(--footer-subscribe-link-color); }

.s-loading-section { position: fixed; top: 0; left: 0; display: flex; width: 100%; height: 100%; justify-content: center; align-items: center; background: rgba(255, 255, 255, .5); z-index: 100; }
.s-loading-section .s-loading-content { display: inline-block; }

/* My account (hide core app nav elements)
------------------------------------------ */

html.my ul.menu-h li a { padding: 5px 7px; }
html.my ul.menu-h li.selected a { color: var(--white); }
html.my .sidebar { display: none; }

/* OTHER */
.wa-login-form-actions button,
.wa-signup-form-actions button,
.wa-forgotpassword-form-actions button,
.wa-set-password-form-wrapper button,
.wa-login-form-actions [type=button],
.wa-signup-form-actions [type=button],
.wa-forgotpassword-form-actions [type=button],
.wa-set-password-form-wrapper [type=button],
.wa-forgotpassword-form-actions [type=submit],
.wa-confirm-signup-button,
.wa-set-password-form-wrapper [type=submit] { font-size: 18px; font-weight: bold; padding-top: 8px; padding-right: 15px; padding-bottom: 8px; padding-left: 15px; }



.wa-login-submit { color: var(--white); }