/* Test mobile header (?mobile-ut7asj0f4xcpl5ppi3yrpt9q=1), 2026-10-22.
   Div version of the table header from themes/default/theme.html.
   Positions are 1:1 with the old table header (186px tall); /mh.js shifts the
   right column over the central logo.gif's white area and scales the whole
   header down when the screen is narrower than that. Without JS the right
   column just stays right-aligned. */
#mh { position: relative; width: 95%; margin: 0 2%; height: 186px; }
#mh-in { position: relative; height: 186px; width: 100%; transform-origin: 0 0; }
/* the band in CSS (was logo_bkg.gif rows 118..158): red 6px, yellow, white line, yellow rim;
   both bottom corners rounded. Tabs (.mh-tab:before) lie on it like sheets: same rows, a white
   edge right/bottom, rounded lower-right corner, darker toward it and a shadow on the band. */
#mh-in:before, #mh-fix-in:before, .mh-dr-head:before {
  content: ""; position: absolute; left: 0; right: 5px; top: 118px; height: 33px;
  border-top: 6px solid #FF0000; border-bottom: 1px solid #fff; background: #FED654;
  border-radius: 0 0 5px 5px; box-shadow: 0 1px 0 #FED654; }
.mh-tab { position: relative; isolation: isolate; }
.mh-tab:before { content: ""; position: absolute; z-index: -1; left: 0; right: 6px; top: 6px; height: 33px;
  background: radial-gradient(70px 34px at 100% 100%, rgba(175,125,0,.2), rgba(175,125,0,0)) #FED654;
  border: solid #fffff6; border-width: 0 1px 1px 0; border-radius: 0 0 5px 0;
  box-shadow: 0 1px 0 #EFCB55; }
/* its shadow: a blurred copy shifted right/down, strongest at the right and fading out to the
   left along the bottom edge (like the old curl images) */
.mh-tab:after { content: ""; position: absolute; z-index: -2; left: 0; right: 2px; top: 9px; height: 33px;
  border-radius: 0 0 7px 0; filter: blur(2px);
  background: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,.08) 45%, rgba(0,0,0,.34)); }
.mh-cart:before, .mh-cart:after { left: -40px; }   /* starts under the cart circle */
.mh-cart:before { right: 5px; }
.mh-cart:after { right: 1px; }
/* the leftmost tab starts the band: its lower-left corner is rounded with the band's */
#mh-burger:before, #mh-fix-burger:before, #mh-dr-tab:before { border-bottom-left-radius: 5px; }
#mh-in a, #mh-in a:visited, #mh-in a:hover { color: black; }
#mh-in img { border: 0; display: block; }

.mh-title { position: absolute; left: 10px; top: 9px; z-index: 2; }
.mh-slogan { position: absolute; left: 10px; top: 49px; z-index: 2; white-space: nowrap;
             font: 900 17px/24px Tahoma, Helvetica, Arial; letter-spacing: -1px; color: black; }
#mh-logo { position: absolute; top: 0; left: 50%; margin-left: -118px; z-index: 1; }

.mh-r { position: absolute; right: 10px; z-index: 2; white-space: nowrap; }
#mh-icons { top: 80px; display: flex; gap: 9px; }
#mh-icons a { display: block; width: 32px; height: 32px; border-radius: 8px; }
#mh-icons a svg { display: block; width: 20px; height: 20px; margin: 6px; }
#mh-icons .tg { background: #28A8E9; }
#mh-icons .wa { background: #25D366; }
#mh-icons .ml { background: #FFA500; }
/* working hours + 5/2 week above the phones; JS makes it as wide as the phones */
#mh-hours { top: 5px; height: 20px;
            display: flex; align-items: center; gap: 8px; }
#mh-hours b { font: 900 17px/20px Tahoma, Helvetica, Arial; letter-spacing: -.5px; color: #000; white-space: nowrap; }
#mh-hours span { flex: 1; display: flex; gap: 5px; min-width: 61px; align-self: stretch; align-items: center; }
/* height = digit height of "10-19"; curl-like shadow as in logo_curl.jpg:
   darker toward the bottom-right corner + soft shadow past right/bottom edge */
#mh-hours i { flex: 1; height: 12px; background-color: #25D366;
              background-image: linear-gradient(135deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.18));
              box-shadow: 2px 2px 3px rgba(0,0,0,.3); }
#mh-hours i.off { background-color: #FF2700; }
#mh-tel { top: 28px; text-align: right;
          font: 900 20px/22px Tahoma, Helvetica, Arial; letter-spacing: -1px; color: black; }
#mh-tel span { display: inline-block; }
#mh-tel a { text-decoration: none; -webkit-tap-highlight-color: rgba(255,214,84,.5); }
.mh-slogan span { display: inline-block; }
#mh-cb { position: absolute; left: 10px; top: 102px; z-index: 2; white-space: nowrap; font: bold 12px/14px Tahoma, Helvetica, Arial; }
#mh-cb a, #mh-cb a:visited { color: #1560bd; text-decoration: none; border-bottom: 1px dotted #0000dd; }
#mh-band { top: 118px; right: 0; height: 68px; display: flex; }

.mh-tab { height: 68px; box-sizing: border-box; font: 11px/14px Tahoma, Helvetica, Arial; color: black;
          padding: 12px 34px 0 15px; }
.mh-cart { text-align: center; padding: 10px 30px 0 12px; }
#mh-burger { position: absolute; left: 0; top: 118px; z-index: 2; }
/* Menu tab: same font, line and top padding as the info tabs, so all texts share one baseline */
#mh-burger, #mh-fix-burger, #mh-dr-tab { display: flex; align-items: flex-start; gap: 7px; text-decoration: none;
             font: bold 18px/22px Tahoma, Helvetica, Arial; padding-top: 11px; cursor: pointer; }
/* bars 22x19 and the text centred on the tab's yellow (rows 6..39): equal space above and below */
#mh-burger b, #mh-fix-burger b, #mh-dr-tab b { display: block; width: 22px; padding-top: 2px; }
#mh-burger b i, #mh-fix-burger b i, #mh-dr-tab b i { display: block; height: 3px; background: black; margin-bottom: 5px; border-radius: 1px; }

/* ---- drawer menu (all widths) ---- */
/* opening: the band stays in place (the head repeats it), the yellow info tabs slide down from
   under the red line and the rest of the menu from under the band's yellow part */
#mh-overlay { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 999;
              background: rgba(0,0,0,.45); opacity: 0; visibility: hidden;
              transition: opacity .25s ease, visibility 0s linear .3s; }
#mh-drawer { position: fixed; left: 0; top: 0; bottom: 0; width: 96%; z-index: 1000;
             display: flex; flex-direction: column; background: transparent;
             visibility: hidden; transition: visibility 0s linear .3s;
             overflow: hidden; font-family: Tahoma, Helvetica, Arial, sans-serif; }
body.mh-open { overflow: hidden; }
body.mh-open #mh-overlay { opacity: 1; visibility: visible; transition: opacity .25s ease; }
body.mh-open #mh-drawer { visibility: visible; transition: none; }
/* head: the band stripe (red line + yellow) with the end curl, height = band height (set by mh.js) */
.mh-dr-head { flex: none; height: 68px; position: relative; z-index: 1;
              background: none; }
.mh-dr-head:before { top: 0; right: auto; width: calc((100% - 5px * var(--mh-s, 1)) / var(--mh-s, 1));
                     transform: scale(var(--mh-s, 1)); transform-origin: 0 0; }
.mh-dr-body { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; background: #fff; margin-top: -26px;
              box-shadow: 4px 6px 18px rgba(0,0,0,.25);
              transform: translateY(-100%); transition: transform .22s ease-in; }
body.mh-open .mh-dr-body { transform: none; transition: transform .32s cubic-bezier(.2,.8,.3,1) .06s; }
/* red line over the tabs, so they come out from under it */
.mh-dr-head:after { content: ""; position: absolute; z-index: 2; left: 0; top: 0;
                    right: calc(5px * var(--mh-s, 1)); height: calc(6px * var(--mh-s, 1)); background: #FF0000; }
/* info links as tabs on the stripe, like the old header's Доставка/Гарантия/... */
#mh-dr-info { position: absolute; left: 111px; top: 0; height: 68px; display: flex; overflow-x: auto; overflow-y: hidden;
              -webkit-overflow-scrolling: touch; scrollbar-width: none; overscroll-behavior-x: contain;
              transform-origin: -111px 0; }
#mh-dr-info a.mh-tab { flex: none; display: block; height: 68px; box-sizing: border-box; padding: 16px 15px 0 5px;
                       font: bold 12px/14px Tahoma, Helvetica, Arial; color: #000 !important; text-decoration: none; white-space: nowrap; }
#mh-dr-info::-webkit-scrollbar { display: none; }
#mh-dr-info a.mh-tab { transform: translateY(-42px); transition: transform .2s ease-in; }
body.mh-open #mh-dr-info a.mh-tab { transform: none; transition: transform .28s cubic-bezier(.2,.8,.3,1) var(--mh-d, 0s); }
#mh-dr-info a.mh-tab:nth-child(2) { --mh-d: .03s; }
#mh-dr-info a.mh-tab:nth-child(3) { --mh-d: .06s; }
#mh-dr-info a.mh-tab:nth-child(4) { --mh-d: .09s; }
#mh-dr-info a.mh-tab:nth-child(5) { --mh-d: .12s; }
#mh-dr-info a.mh-tab:nth-child(n+6) { --mh-d: .15s; }
/* copy of the Menu tab above the overlay; bars -> cross */
#mh-dr-tab { display: none; position: fixed; z-index: 1002; transform-origin: 0 0; margin: 0; }
body.mh-open #mh-dr-tab { display: flex; }
#mh-dr-tab, #mh-dr-tab:visited { color: black; text-decoration: none; }
#mh-dr-tab b i { transition: transform .25s ease, opacity .2s ease; }
#mh-dr-tab.mh-x b i:nth-child(1) { transform: translateY(8px) rotate(45deg); }
#mh-dr-tab.mh-x b i:nth-child(2) { opacity: 0; }
#mh-dr-tab.mh-x b i:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
#mh-dr-search { padding: 12px 14px 4px; }
#mh-dr-search form { display: flex; gap: 6px; margin: 0; }
#mh-dr-search input[type=text] { flex: 1; min-width: 0; width: auto !important; height: auto; font-size: 16px;
                                 padding: 8px 10px; border: 1px solid #ccc; border-radius: 6px; background: #fff; }
#mh-dr-search input[type=submit] { font: bold 15px Tahoma, Arial; padding: 8px 14px; height: auto; border: 0;
                                   border-radius: 6px; background: #FF0600; color: #fff; }
.mh-dr-sec h4 { margin: 14px 0 0; padding: 6px 16px; font: bold 12px Tahoma, Arial; text-transform: uppercase;
                letter-spacing: .5px; color: #8a8a8a; border-bottom: 2px solid #FED654; }
.mh-dr-sec a, #mh-dr-extra a { display: flex; align-items: center; gap: 10px; min-height: 24px; padding: 9px 16px;
                               border-bottom: 1px solid #eee; font: 15px/18px Tahoma, Helvetica, Arial;
                               color: #3D3D3D !important; text-decoration: none; }
.mh-dr-sec a:active, .mh-dr-sec a:hover { background: #fff6cf; }
.mh-dr-sec a img { width: 32px; height: 32px; flex: 0 0 32px; }
#mh-dr-tel a { font-weight: bold; }
#mh-dr-extra .mh-dr-sec > div { padding: 6px 16px 10px; font-size: 14px; }

.mh-cat { display: none; }
.mh-vk { text-align: center; margin: 14px 0 4px; }
.mh-vk > table { width: auto !important; display: inline-table; }
.mh-exit, .mh-exit:visited { color: #1560bd !important; text-decoration: underline; font-size: 11px; }
.mh-dot { color: #FF0000; font-weight: 900; font-size: 1.3em; line-height: 0; }
/* wide screen in test mode = old site: footer without the phone-only bits */


/* floating copy of the yellow band (mh.js) */
#mh-fix { display: none; position: fixed; top: 0; z-index: 900; overflow: hidden; pointer-events: none; }
#mh-fix-in { position: relative; height: 68px; transform-origin: 0 0; }
/* the band (see #mh-in:before) at the top of the floating copy */
#mh-fix-in:before { top: 0; }
#mh-fix-in > * { pointer-events: auto; }
#mh-fix-in a, #mh-fix-in a:visited { color: black; }
#mh-fix-logo { position: absolute; top: 0; z-index: 1; border: 0; pointer-events: none; }
#mh-fix-title { position: absolute; z-index: 1; display: block; opacity: 0; transition: opacity .25s ease;
                pointer-events: none !important; -webkit-tap-highlight-color: transparent; }
#mh-fix-title.mh-on { opacity: 1; pointer-events: auto !important; }
#mh-fix-title img { display: block; height: auto; }
#mh-cartc { display: block; position: absolute; z-index: 901; width: 89px; height: 89px; transform-origin: 0 0;
            border-radius: 50%; -webkit-tap-highlight-color: transparent; }
#mh-cartc img { display: block; border: 0; }
#mh-fix-burger { position: absolute; left: 0; z-index: 2; }
/* wide screens: Доставка/Гарантия/Контакты/Прайс on the band (like the old header) instead of the Menu tab */
#mh-dtabs, #mh-fix-dtabs { position: absolute; left: 0; z-index: 2; display: flex; }
#mh-dtabs { top: 118px; }
#mh-fix-dtabs { top: 0; }
#mh-dtabs .mh-tab, #mh-fix-dtabs .mh-tab { display: block; padding: 16px 21px 0 15px; font: 11px/14px Tahoma, Helvetica, Arial;
                                          color: #000; text-decoration: none; white-space: nowrap; }
#mh-dtabs .mh-tab:first-child:before, #mh-fix-dtabs .mh-tab:first-child:before { border-bottom-left-radius: 5px; }
@media (min-width: 761px) { #mh-burger, #mh-fix-burger { display: none !important; } }
@media (max-width: 760px) { #mh-dtabs, #mh-fix-dtabs { display: none; } }
#mh-fix-band { position: absolute; right: 0; height: 68px; display: flex; z-index: 2; }
.mh-dr-main a { font-weight: bold; }

/* ---- page grid (test mode, all widths): divs instead of the old tables ---- */
.mh-main { display: flex; align-items: flex-start; }
#mh-left { flex: 0 0 300px; width: 300px; }
.mh-main > #mh-left, .mh-main > .mainright { font-size: 11px; }   /* = styler.css td */
.mh-main > .mainright { flex: 1 1 auto; padding: 6px 0 10px 10px; }   /* = styler.css .mainright */
/* videos (560px iframes in the specs) must not keep the contents wide: they shrink with the column */
.mh-main .mainright iframe { max-width: 100%; }
/* #mh-page (header + grid + footer): one width for all three on wide screens = 95% of the window,
   or the contents' minimum width when that is more (shrink-to-fit), so the header never gets narrower
   than the contents. Phones: no box at all (display: contents), the parts stay flex items of body */
@media (min-width: 761px) {
  #mh-page { display: inline-block; vertical-align: top; min-width: 95%; margin: 0 3% 0 2%; }
  #mh-page > #mh, #mh-page > .grandtable { width: auto; margin-left: 0; margin-right: 0; }
}
@media (max-width: 760px) { #mh-page { display: contents; } }
/* footer: the yellow band as one CSS sheet (red line, rounded lower corners, shadow to the right) */
.mh-foot { margin-bottom: 10px; }
.mh-foot .end { position: relative; isolation: isolate; box-sizing: border-box; min-height: 48px; padding: 16px 30px 18px 15px;
                font: 10px/14px Tahoma, Helvetica, Arial; color: #000; text-align: center; }
.mh-foot .end:before { content: ""; position: absolute; z-index: -1; left: 0; right: 5px; top: 0; bottom: 8px;
  border-top: 6px solid #FF0000; border-right: 1px solid #fffff6; border-bottom: 1px solid #fffff6; border-radius: 0 0 5px 5px;
  background: radial-gradient(70px 34px at 100% 100%, rgba(175,125,0,.2), rgba(175,125,0,0)) #FED654; box-shadow: 0 1px 0 #EFCB55; }
.mh-foot .end:after { content: ""; position: absolute; z-index: -2; left: 0; right: 1px; top: 9px; bottom: 5px;
  border-radius: 0 0 7px 7px; filter: blur(2px);
  background: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,.08) 45%, rgba(0,0,0,.34)); }
body:not(.mhm) .mh-fnew, .mhm .mh-fold, #mh #mh-mail3 { display: none; }   /* phone footer text + exit link / old one; old icons image */

/* ---- wide screens (> 760px): the old table header and footer look, in divs (positions measured on
   the old table at 1280 and 900px: they don't depend on the width except the 33% logo column) ---- */
@media (min-width: 761px) {
  #mh { min-width: 802.25px; }   /* the old table never got narrower (wider = page scrolls sideways, as before) */
  #mh-in { background: url(/images/logo_bkg.gif) repeat-x left bottom; }
  #mh-in:before, #mh .mh-tab:before, #mh .mh-tab:after { display: none; }
  #mh .mh-title { left: 15px; top: 38px; }
  #mh .mh-title img { width: 235px; height: 55px; }
  #mh .mh-slogan { left: 0; top: 93px; font: 900 18px/20px Tahoma, Helvetica, Arial; letter-spacing: -1px; }
  #mh .mh-slogan br { display: none; }
  #mh #mh-logo { left: max(calc(33% + 1px), 305px); margin-left: 0; z-index: 3; }   /* 33% column; narrow window: over the end of the last tab, never over the slogan */
  #mh-hours, #mh-icons { display: none; }
  #mh #mh-mail3 { display: block; position: absolute; right: 17px; top: 6px; padding-top: 10px; z-index: 2; border: 0; }
  #mh #mh-tel { right: 17px; top: 53.55px; width: 220px; padding: 3px 0; font: 900 19px/20px Tahoma, Helvetica, Arial; letter-spacing: -1px; }
  #mh #mh-cb { left: auto; right: 10px; top: 102px; font: 900 11px Tahoma, Helvetica, Arial; }
  #mh #mh-cb a { padding: 0 10px; }
  #mh #mh-dtabs .mh-tab { height: 68px; padding: 16px 21px 0 15px; font: 10px Tahoma;
                          background: url(/images/logo_curl.jpg) no-repeat right top; }
  #mh #mh-band { height: 61px; }
  #mh #mh-band .mh-cart { height: 61px; padding: 10px 30px 0 0; font: 10px Tahoma;
                          background: url(/images/logo_end_curl.jpg) no-repeat right top; }
  .mh-foot { height: 68px; margin-bottom: 0; background: url(/images/logo_bkg.gif) repeat-x left bottom; }
  .mh-foot .end { min-height: 0; height: 68px; padding: 16px; font: 10px Tahoma;
                  background: url(/images/logo_end_curl.jpg) no-repeat right top; }
  .mh-foot .end:before, .mh-foot .end:after { display: none; }
}

/* ---- mobile page layout (test mode only: body.mhm) ---- */
@media (max-width: 760px) {
  body.mhm { -webkit-text-size-adjust: 100%; }
  /* short pages: footer at the bottom of the screen (body = column, main table takes the rest) */
  body.mhm { display: flex; flex-direction: column; min-height: 100vh; min-height: 100svh; overflow-anchor: none; }
  body.mhm > *, body.mhm > #mh-page > * { flex: none; }
  body.mhm > .mh-main, body.mhm > #mh-page > .mh-main { flex: 1 0 auto; }
  body.mhm > .mh-foot, body.mhm > #mh-page > .mh-foot { margin-top: auto; margin-bottom: 0; }
  .mhm #mh { width: auto; margin: 0 6px; }
  .mhm .grandtable { width: auto; margin: 0 6px; }
  .mhm .mh-main, .mhm .mh-ct, .mhm .mh-ct > tbody, .mhm .mh-ct > tbody > tr, .mhm .mh-ct > tbody > tr > td { display: block; width: auto; }
  .mhm #mh-left { display: none; }
  .mhm .mh-main > .mainright { padding: 0 0 10px; font-size: 13px; }   /* = .mhm td below */
  .mhm .mainright .mh-flush { border-spacing: 0; padding-top: 0 !important; margin-top: 0; }
  .mhm .mainright .mh-brands table { border-spacing: 0 2px; margin-top: -2px; }
  .mhm .mainright .mh-brands td { vertical-align: top; }

  /* footer: line break goes between the two halves first */
  .mhm .mh-foot .mh-nb { display: inline-block; white-space: nowrap; margin: 0 4px; }
  .mhm .mh-foot .mh-sep { display: none; }
  .mhm .mh-foot .end { padding: 6px 30px 10px 12px; font: 12px/16px Tahoma, Arial; }
  .mhm td, .mhm p { font-size: 13px; }
  .mhm .mainright img { max-width: 100%; height: auto; }
  .mhm .mainright iframe, .mhm .mainright video, .mhm .mainright embed, .mhm .mainright object { max-width: 100%; }
  .mhm .mainright iframe[src*="youtube"] { width: 100% !important; height: auto !important; aspect-ratio: 16 / 9; }
  .mhm .mainright h1 { font-size: 18px; line-height: 22px; }

  /* main page showcase: one card per row */
  .mhm .mainright td[width="50%"] { display: block; width: auto; padding: 8px 0 0 !important; }
  .mhm .mainright td[width="50%"] td[height="170"] { height: auto; }

  /* catalog tiles inserted on the main page by mh-site.js */
  .mh-cat { display: block; margin: 10px 0; }
  /* yellow band like the header's cart tab (CSS, see #mh-in:before): one sheet with both
     bottom corners rounded, darker toward the right one, shadow below */
  .mh-cat h3 { position: relative; isolation: isolate; background: none !important; }
  .mh-cat h3:before { content: ""; position: absolute; z-index: -1; left: 0; right: 5px; top: 0; bottom: 8px;
    border-top: 6px solid #FF0000; border-right: 1px solid #fffff6; border-bottom: 1px solid #fffff6; border-radius: 0 0 5px 5px;
    background: radial-gradient(70px 34px at 100% 100%, rgba(175,125,0,.2), rgba(175,125,0,0)) #FED654;
    box-shadow: 0 1px 0 #EFCB55; }
  .mh-cat h3:after { content: ""; position: absolute; z-index: -2; left: 0; right: 1px; top: 9px; bottom: 5px;
    border-radius: 0 0 7px 7px; filter: blur(2px);
    background: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,.08) 45%, rgba(0,0,0,.34)); }
  .mh-cat h3 { display: flex; align-items: center; justify-content: space-between; cursor: pointer; box-sizing: border-box;
               height: 48px; margin: 0 0 2px; padding: 4px 22px 6px 12px;
               font: bold 16px Tahoma, Arial; color: #000; -webkit-tap-highlight-color: transparent; }
  /* chevron: down when collapsed, up when open */
  .mh-cat h3 b { width: 10px; height: 10px; margin: -2px 6px 0 0; border: solid #000; border-width: 0 3px 3px 0;
                 transform: rotate(-135deg); margin-top: 6px; transition: transform .2s; }
  .mh-cat.mh-collapsed h3 b { transform: rotate(45deg); margin-top: -6px; }
  .mh-cat-wrap { position: relative; }
  .mh-cat.mh-collapsed .mh-cat-wrap { max-height: 130px; overflow: hidden; }
  .mh-cat.mh-collapsed .mh-cat-wrap:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 60px;
                                            background: linear-gradient(rgba(255,255,255,0), #fff 85%); pointer-events: none; }
  .mh-cat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
  .mh-cat-grid a { display: flex; align-items: center; gap: 8px; padding: 7px 8px; min-height: 36px;
                   border: 1px solid #e3e3e3; border-radius: 8px; background: #fff;
                   font: 12px/15px Tahoma, Arial; color: #3D3D3D; text-decoration: none; }
  .mh-cat-grid img { width: 32px; height: 32px; flex: 0 0 32px; }

  /* ---- list pages: breadcrumbs, filter panel, product cards (built by mh-site.js) ---- */
  .mhm .mh-hide { display: none !important; }
  /* old square image shadows of the table "cards" (right column + bottom row): not on phones */
  .mhm .mainright td.right-shadow, .mhm .mainright td.bottom-shadow { display: none; }
  .mhm .mainright table.shadow { background-image: none; }
  .mhm .mainright div.achtung { box-sizing: border-box; width: auto; max-width: 100%; margin-left: 0; margin-right: 0; border-radius: 10px; }
  .mhm .mainright td.top[width] { display: none; }
  .mh-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin: -18px 0 6px; padding: 10px 12px;
               background: #eef5fe; border-radius: 12px; font: 13px/18px Tahoma, Arial, sans-serif; }
  .mh-crumbs a, .mh-crumbs a:visited { color: #2b62c7; text-decoration: none; }
  .mh-crumb-home { display: inline-flex; align-items: center; gap: 6px; }
  .mh-crumb-home svg { color: #1b2a5a; flex: none; }
  .mh-crumb-sep { display: inline-flex; color: #8aa0c8; }
  .mh-crumb-it { display: inline-flex; align-items: center; gap: 6px; }
  .mh-crumb-cur { color: #1b2a5a; font-weight: bold; }
  .mh-filter { margin: 4px 0 6px; padding: 8px 12px; background: #fff; border: 1px solid #d5e3f6; border-radius: 14px; }
  .mh-filter.mh-sortp { margin-top: 4px; margin-bottom: 2px; }
  .mh-sortp .mh-chips { margin-top: 0; }
  .mh-chips.mh-pager { margin: 4px 0 6px; padding: 6px 10px; gap: 6px; background: #fff; border: 1px solid #d5e3f6; border-radius: 14px; }
  .mh-chips.mh-pager-top { margin: 2px 0 4px; }
  /* as in the original: page numbers are red buttons, the current one white with a red border */
  .mh-pager .mh-chip, .mh-pager .mh-chip:visited { padding-top: 6px; padding-bottom: 6px; background: #FF0600; border-color: #FF0600; color: #fff; }
  .mh-pager .mh-chip svg { color: #fff; }
  .mh-pager .mh-chip.on, .mh-pager .mh-chip.on:visited { background: #fff; border-color: #FF0600; color: #FF0600; font-weight: 900; }
  .mh-filter-head, .mh-filter-head:visited { position: relative; display: flex; align-items: center; gap: 10px; color: #1b2a5a; text-decoration: none;
                                             -webkit-tap-highlight-color: transparent;
                                             font: bold 15px/20px Tahoma, Arial, sans-serif; }
  .mh-filter-head span { flex: 1; }
  .mh-filter-head svg:first-child { color: #2b62c7; flex: none; }
  /* right edge of the whole filter panel: full-height strip with the chevron, links to the characteristics search */
  .mh-filter { position: relative; }
  .mh-filter.mh-has-go { padding-right: 40px; }
  .mh-filter-go { position: absolute; top: 0; right: 0; bottom: 0; width: 32px; display: flex; align-items: center; justify-content: center;
                  border-radius: 0 14px 14px 0; color: #2b62c7; -webkit-tap-highlight-color: transparent;
                  background: linear-gradient(90deg, rgba(238,245,254,0) 0%, #dfeafb 35%, #b9d0f4 100%); }
  /* chevron level with the panel title, not in the middle */
  .mh-filter-go { align-items: flex-start; padding-top: 15px; box-sizing: border-box; }
  .mh-filter-go svg { width: 20px; height: 20px; }
  .mh-filter-go:active { color: #fff; background: linear-gradient(90deg, rgba(43,98,199,0) 0%, #7fa5e6 35%, #2b62c7 100%); }
  /* "characteristics search" link: red like the original a.loop */
  .mh-filter-head, .mh-filter-head:visited { color: #FF0600; }
  .mh-filter-head svg:first-child { color: #FF0600; }
  .mh-filter-go { color: #FF0600; background: linear-gradient(90deg, rgba(255,6,0,0) 0%, #ffd9d6 35%, #ffa9a3 100%); }
  .mh-filter-go:active { color: #fff; background: linear-gradient(90deg, rgba(255,6,0,0) 0%, #ff8a82 35%, #FF0600 100%); }
  /* brand / type links: red buttons as in the original a.brand, the chosen one white with a red border */
  .mh-chip.mh-brandchip, .mh-chip.mh-brandchip:visited { background: #FF0600; border-color: #FF0600; color: #fff; }
  .mh-chip.mh-brandchip svg { color: #fff; }
  .mh-chip.mh-brandchip.on, .mh-chip.mh-brandchip.on:visited { background: #fff; border-color: #FF0600; color: #FF0600; font-weight: 900; }
  .mh-chip.mh-brandchip.on svg { color: #FF0600; }
  .mh-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
  .mh-chip, .mh-chip:visited { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 20px;
                               background: #fff; border: 1px solid #d5e3f6; color: #1b2a5a; text-decoration: none;
                               font: 13px/16px Tahoma, Arial, sans-serif; box-shadow: 0 1px 2px rgba(27,42,90,.06); }
  .mh-chip svg { color: #4a6fb5; flex: none; }
  /* the two sort chips move to a new line together; if even a whole line is too narrow they stack instead of overflowing */
  .mh-chipgrp { display: inline-flex; flex-wrap: wrap; gap: 8px; max-width: 100%; }
  .mh-chip { max-width: 100%; box-sizing: border-box; }
  .mh-chip span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .mh-chip { white-space: nowrap; }
  .mh-chip.on { background: #FED654; border-color: #f0c23a; font-weight: bold; }
  .mh-ltitle { display: flex; align-items: baseline; justify-content: space-between; margin: 2px 2px 6px; }
  .mh-ltitle h2 { margin: 0; font: bold 22px/26px Tahoma, Arial, sans-serif; color: #1b2a5a; }
  .mh-ltitle span { font-size: 13px; color: #7d8db0; }
  .mh-card { position: relative; display: flex; gap: 10px; margin: 0 0 10px; padding: 10px 32px 10px 10px; background: #fff;
             border: 1px solid #e3ecf8; border-radius: 14px; box-shadow: 0 2px 8px rgba(27,42,90,.07); }
  .mh-card-img { position: relative; flex: 1 1 auto; width: 96px; border-radius: 12px; background: #f1f5fb;
                 display: flex; flex-direction: column; overflow: hidden; container-type: inline-size; }
  .mh-card-img img { display: block; max-width: 88%; max-height: 84px; margin: auto; padding: 8px 0; object-fit: contain; }
  /* stock badge = bottom part of the photo block, text always fits its width */
  .mh-badge { display: flex; align-items: center; justify-content: center; gap: 3px; margin-top: auto; padding: 5px 3px;
              font: bold 11px/13px Tahoma, Arial, sans-serif; font-size: clamp(8px, 11.5cqw, 12px); color: #fff; white-space: nowrap; }
  .mh-badge svg { flex: none; width: 1.25em; height: 1.25em; }
  .mh-badge.ok { background: #3fae49; }
  .mh-badge.wait { background: #f29a1f; }
  .mh-card-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
  .mh-card-brand { font: 12px/15px Tahoma, Arial, sans-serif; color: #2b62c7; }
  .mh-card-title, .mh-card-title:visited { display: block; margin: 1px 0 2px; font: bold 15px/19px Tahoma, Arial, sans-serif;
                                           color: #1b2a5a; text-decoration: none; }
  /* left column spans the card height: article (level with the brand), photo grows, stock strip at the bottom */
  .mh-card-left { flex: none; display: flex; flex-direction: column; align-items: stretch; align-self: stretch; }
  .mh-card-art { margin: 0 0 4px; text-align: center; font: 12px/15px Tahoma, Arial, sans-serif; color: #7d8db0; }
  .mh-card-desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
                  margin-top: 4px; font-size: 12px; line-height: 16px; color: #666; }
  .mh-card-price { margin: 6px 0 8px; font: bold 21px/24px Tahoma, Arial, sans-serif; color: #1b2a5a; }
  .mh-card-btns { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
  .mh-btn-buy, .mh-btn-buy:visited { display: inline-flex; align-items: center; gap: 5px; padding: 8px 11px; border-radius: 10px;
                                     background: #FF0600; color: #fff !important; text-decoration: none; font: bold 14px Tahoma, Arial, sans-serif; }
  .mh-btn-cmp, .mh-btn-cmp:visited { display: inline-flex; align-items: center; gap: 4px; padding: 7px 7px; border-radius: 10px;
                                     background: #fff; border: 1px solid #d5e3f6; color: #4a6fb5 !important; text-decoration: none; font: 13px Tahoma, Arial, sans-serif; }
  /* list pages: no old spacers between the new blocks */
  .mhm.mh-list .mh-ct-td > br, .mhm.mh-list .mh-ct-td > table.shadow > tbody > tr > td.main > br { display: none; }
  .mhm.mh-list .mainright td.bottom-shadow { height: 4px; font-size: 0; line-height: 0; padding: 0; }
  .mhm.mh-list .mainright td.main { padding-top: 0; padding-bottom: 0; }
  /* characteristics form (search.php), rebuilt by mh-site.js */
  .mhm #oCatalogMainFilter { display: block; max-width: 100%; }
  .mhm #oCatalogMainFilter > br, .mhm #oCatalogMainFilter + br { display: none; }
  .mh-fform { margin: 6px 0 4px; padding: 14px 12px; background: #fff; border: 1px solid #d5e3f6; border-radius: 14px; }
  .mh-fform-head { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; font: bold 16px/20px Tahoma, Arial, sans-serif; color: #1b2a5a; }
  .mh-fform-head svg { color: #FF0600; flex: none; }
  .mh-fgroup { padding: 10px 0 2px; border-top: 1px solid #d9e6f7; margin-top: 8px; }
  .mh-fgroup:first-of-type { border-top: 0; }
  .mh-flabel { margin: 0 0 8px; font: bold 13px/16px Tahoma, Arial, sans-serif; color: #1b2a5a; }
  .mh-fopts { display: flex; flex-wrap: wrap; gap: 8px; }
  .mh-opt { position: relative; cursor: pointer; -webkit-tap-highlight-color: transparent; }
  .mh-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
  .mh-opt span { display: inline-block; padding: 8px 13px; border-radius: 20px; background: #FF0600; border: 1px solid #FF0600;
                 color: #fff; font: 13px/16px Tahoma, Arial, sans-serif; white-space: nowrap; }
  .mh-opt input:checked + span { background: #fff; border-color: #FF0600; color: #FF0600; font-weight: 900; }
  .mh-opt input:checked + span:before { content: "\2713  "; }
  .mh-opt input:focus-visible + span { outline: 2px solid #2b62c7; }
  .mh-fopts select { width: 100%; padding: 8px; font-size: 15px; border: 1px solid #d5e3f6; border-radius: 10px; background: #fff; }
  .mh-fprice { display: flex; align-items: center; gap: 8px; color: #7d8db0; }
  .mh-fprice input.inputtext { flex: 1; min-width: 0; width: auto !important; height: auto; padding: 9px 12px; font-size: 16px;
                               border: 1px solid #d5e3f6; border-radius: 10px; background: #fff; }
  .mh-fform input.button { display: block; width: 100% !important; margin: 14px 0 0; padding: 12px; border: 0; border-radius: 12px;
                           background: #FF0600; color: #fff; font: bold 16px Tahoma, Arial, sans-serif; }

  /* right end of the card: full-height strip with the chevron, links to the product */
  .mh-card-go { position: absolute; top: 0; right: 0; bottom: 0; width: 32px; display: flex; align-items: center; justify-content: center;
                border-radius: 0 13px 13px 0; color: #2b62c7; -webkit-tap-highlight-color: transparent;
                background: linear-gradient(90deg, rgba(238,245,254,0) 0%, #dfeafb 35%, #b9d0f4 100%); }
  .mh-card-go:active { color: #fff; background: linear-gradient(90deg, rgba(43,98,199,0) 0%, #7fa5e6 35%, #2b62c7 100%); }
  /* category browsing (sub-category cards): brand yellow -> red */
  .mh-subcat .mh-card-go { color: #fff; background: linear-gradient(90deg, rgba(254,214,84,0) 0%, #FED654 30%, #FF0600 100%); }
  .mh-subcat .mh-card-go:active { background: linear-gradient(90deg, rgba(255,6,0,0) 0%, #ff6a3d 30%, #c80400 100%); }
  .mh-card-go svg { width: 20px; height: 20px; }

  /* ---- page title: the old blue bar becomes a big navy heading ---- */
  .mhm .mainright td.top { background: none !important; padding: 4px 2px 2px; border: 0; color: #1b2a5a; }
  .mhm .mainright td.top h1, .mhm .mainright td.top H1 { margin: 0; font: bold 21px/26px Tahoma, Arial, sans-serif; color: #1b2a5a;
                                                        letter-spacing: 0; text-shadow: none; }
  .mhm .mainright .shadow .main { border-top: 0; }
  .mhm .mainright h2 { margin: 18px 0 8px; font: bold 17px/22px Tahoma, Arial, sans-serif; color: #1b2a5a; text-align: left; }

  /* sub-category cards: no price/buttons, chips instead */
  .mh-subcat .mh-card-img { width: 84px; min-height: 84px; }
  .mh-subcat .mh-card-title { margin-bottom: 8px; }
  .mh-subcat .mh-chip { padding: 6px 10px; font-size: 12px; }
  .mh-showcase .mh-card-img { min-height: 96px; }
  .mh-showcase { margin-top: 4px; }

  /* ---- text pages (Доставка, Гарантия, Контакты, О компании...): white card ---- */
  .mhm .mainright .div14 { padding: 14px; background: #fff; border: 1px solid #e3ecf8; border-radius: 14px; box-shadow: 0 2px 8px rgba(27,42,90,.06);
                           font-family: Tahoma, Arial, sans-serif; line-height: 19px; color: #333; }
  .mhm .mainright .div14 strong, .mhm .mainright .div14 b { color: #1b2a5a; }
  .mhm .mainright .div14 a { color: #2b62c7; }
  .mhm .mainright div.achtung { border-width: 1px !important; background: #fff7e6; }
  /* ---- main page: brand block and catalog in the blue palette ---- */
  .mhm .mainright .mh-brands b.textgrey { color: #1b2a5a; }
  .mh-cat h3 { border-radius: 0; }
  .mh-cat-grid a { border-color: #e3ecf8; border-radius: 12px; }
  /* ---- cart ---- */
  .mhm #oOrderContent > tbody > tr { margin: 0 0 8px; padding: 12px; background: #fff; border: 1px solid #e3ecf8; border-radius: 14px; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(5) { color: #1b2a5a; font-size: 15px; }
  .mhm #oOrderContent a[href*="deleteItemFromOrder"] { color: #c0392b; }
  .mhm #oOrderInfo table.pricetable > tbody > tr { border-bottom: 0; }
  .mhm #oOrderInfo input[type=text], .mhm #oOrderInfo input[type=tel], .mhm #oOrderInfo input[type=email], .mhm #oOrderInfo textarea, .mhm #oOrderInfo select {
    border: 1px solid #d5e3f6; border-radius: 10px; background: #fff; }
  .mhm .mainright input.button { padding: 9px 16px; border: 1px solid #d5e3f6; border-radius: 10px; background: #fff; color: #2b62c7;
                                 font: bold 14px Tahoma, Arial, sans-serif; }
  /* cart: the same components as everywhere: secondary buttons = "Сравнить", links = chips, main action = red */
  .mhm input[name=btsavecnt], .mhm .mainright input.button:not([type=submit]) {
    -webkit-appearance: none; appearance: none; margin-top: 6px; padding: 7px 12px; border: 1px solid #d5e3f6; border-radius: 10px;
    background: #fff; color: #4a6fb5; font: 13px Tahoma, Arial, sans-serif; box-shadow: none; }
  .mhm #oOrderContent a[href*="deleteItemFromOrder"] { display: inline-flex; padding: 5px 10px; border: 1px solid #d5e3f6; border-radius: 10px;
    background: #fff; color: #4a6fb5 !important; font-size: 12px; text-decoration: none; }
  .mhm #oOrderContent input[type=number] { border: 1px solid #d5e3f6; border-radius: 10px; background: #fff; text-align: center; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(2) a:first-child { color: #1b2a5a; text-decoration: none; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(2) a:not(:first-child) { color: #666; font-size: 12px; text-decoration: none; }
  .mhm .mainright input[type=radio] { accent-color: #2b62c7; }
  .mhm .mainright input.button[type=submit], .mhm #oOrderInfo input.button, .mhm #oOrderInfo input[type=submit] {
    -webkit-appearance: none; appearance: none; padding: 12px 18px; border: 0; border-radius: 12px; background: #FF0600; color: #fff; font: bold 15px Tahoma, Arial, sans-serif; }
  .mhm .mainright a[style*="color: red; font-weight: bold"] { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 20px;
      background: #fff; border: 1px solid #d5e3f6; color: #1b2a5a !important; font: 13px/16px Tahoma, Arial, sans-serif !important; text-decoration: none; }
  .mhm .mainright td.yellow { background: #eef5fe !important; border-radius: 14px; padding: 12px; }
  .mhm .mainright td.yellow h3 { margin: 0 0 8px; font: bold 17px Tahoma, Arial, sans-serif; color: #1b2a5a; }

  /* ---- product page ---- */
  .mhm.mh-product .mainright a.loop[href*="search.php"] { display: inline-flex; align-items: center; margin: 4px 0 8px; padding: 7px 12px;
      border-radius: 18px; background: #fff; border: 1px solid #d5e3f6; color: #FF0600; font: bold 12px Tahoma, Arial, sans-serif; text-transform: none; line-height: 16px;
      background-image: none; white-space: normal; max-width: 100%; box-sizing: border-box; }
  .mhm.mh-product .mainright font[style*="background-color:black"] { display: inline-block; padding: 2px 8px; border-radius: 10px; background: #1b2a5a !important; color: #FED654 !important; font-size: 12px; }
  .mhm.mh-product .skidka { display: inline-block; margin: 8px 0 0; padding: 6px 14px; border-radius: 18px; font-size: 14px; }
  .mhm.mh-product .mh-photo { margin: 10px 0 0 !important; }
  .mhm.mh-product .mh-photo > tbody > tr > td { display: block; width: auto !important; }
  .mhm.mh-product .mh-photo table[style*="height:500px"] { height: auto !important; background: #f1f5fb; border-radius: 16px; }
  .mhm.mh-product .mh-photo .mynoitmframe { width: auto !important; height: auto !important; padding: 12px; }
  .mhm.mh-product .mh-photo img#itembigimg { max-height: 300px; width: auto; }
  .mhm.mh-product .mainright center, .mhm.mh-product .mainright div[align=center] { text-align: left; }
  .mhm.mh-product .mainright center small { display: block; margin: 6px 0; color: #9aa6c0; font-size: 11px; line-height: 14px; }
  .mhm.mh-product .mainright a.highslade img:not(#itembigimg) { width: 72px; height: auto; margin: 6px 6px 0 0; padding: 4px; border-radius: 10px; background: #f1f5fb; }
  .mhm.mh-product .mainright br + br + br { display: none; }
  .mhm.mh-product a.skidka_l { display: inline-block; text-decoration: none; }
  .mhm.mh-product .skidka { white-space: nowrap; width: auto !important; }
  .mhm .mainright table.mh-specs a.div_dont { color: #2b62c7 !important; }
  .mhm.mh-product .mainright td.main { font: 13px/19px Tahoma, Arial, sans-serif; color: #333; }
  .mh-pcard { margin: 12px 0 14px; padding: 14px; background: #fff; border: 1px solid #e3ecf8; border-radius: 16px; box-shadow: 0 2px 8px rgba(27,42,90,.07); }
  .mh-pc-row { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; }
  .mh-pc-price { font: bold 28px/32px Tahoma, Arial, sans-serif; color: #1b2a5a; }
  .mh-pc-old { font-size: 15px; color: #9aa6c0; }
  .mh-pc-sub { margin-top: 4px; font-size: 12px; color: #7d8db0; }
  .mh-pc-sub b { color: #1b2a5a; }
  .mh-pc-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 12px; }
  .mh-tag { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 14px; font: bold 12px/16px Tahoma, Arial, sans-serif; }
  .mh-tag.ok { background: #3fae49; color: #fff; padding-left: 5px; }
  .mh-tag.wait { background: #f29a1f; color: #fff; }
  .mh-tag.art { background: #eef5fe; color: #4a6fb5; font-weight: normal; }
  .mh-pbuy, .mh-pbuy:visited { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 13px; border-radius: 12px;
                               background: #FF0600; color: #fff !important; text-decoration: none; font: bold 17px Tahoma, Arial, sans-serif; }
  .mh-psecs { display: flex; gap: 8px; margin-top: 8px; }
  .mh-psec, .mh-psec:visited { flex: 1; display: flex; align-items: center; justify-content: center; gap: 5px; padding: 8px 6px; border-radius: 10px; text-align: center;
                               background: #fff; border: 1px solid #d5e3f6; color: #4a6fb5 !important; text-decoration: none; font: 13px/16px Tahoma, Arial, sans-serif; }
  .mh-psec svg { flex: none; }
  .mh-share { margin-top: 12px; text-align: center; opacity: .8; }
  /* specs: card with zebra rows */
  .mhm .mainright table.mh-specs { width: 100% !important; border-collapse: separate; border-spacing: 0; border: 1px solid #e3ecf8; border-radius: 14px; overflow: hidden; }
  .mhm .mainright table.mh-specs td { padding: 8px 10px; border: 0; font: 13px/17px Tahoma, Arial, sans-serif; background: #fff; vertical-align: top; }
  .mhm .mainright table.mh-specs tr.div td { background: #f4f8fe; }
  .mhm .mainright table.mh-specs td:first-child { color: #7d8db0; white-space: normal; width: 45% !important; }
  .mhm .mainright table.mh-specs td.descr { color: #1b2a5a; }
  .mhm .mainright table.mh-specs td.mh-video { background: #fff; }
  /* ask button + reviews */
  .mh-askbtn, .mh-askbtn:visited { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 12px 0; padding: 11px; border-radius: 12px;
                                   background: #eef5fe; border: 1px solid #d5e3f6; color: #2b62c7 !important; text-decoration: none; font: bold 14px Tahoma, Arial, sans-serif; }
  .mhm .mainright table.mh-reviews, .mhm .mainright table.mh-reviews > tbody, .mhm .mainright table.mh-reviews tr, .mhm .mainright table.mh-reviews td { display: block; width: auto !important; border: 0; background: none; }
  .mhm .mainright table.mh-reviews td { padding: 0; font: 13px/18px Tahoma, Arial, sans-serif; color: #333; }
  .mhm .mainright table.mh-reviews b { color: #1b2a5a; }
  .mhm .mainright table.mh-reviews td[align=right] { text-align: left; }
  .mhm .mainright table.mh-reviews small { color: #9aa6c0; font-size: 11px; }
  .mhm .mainright table.mh-reviews tr:has(> td > b):has(small) { margin-top: 14px; padding-top: 12px; border-top: 1px solid #e3ecf8; }
  .mhm .mainright table.mh-reviews div[style*="padding-left:50px"] { padding: 10px 12px !important; margin-top: 8px; background: #eef5fe; border-radius: 12px; }
  .mhm .mainright table.mh-reviews a[onclick*="commentItemAnswer"] { color: #2b62c7 !important; border: 0 !important; font-size: 12px; }

  /* cart (#oOrderContent): one block per item */
  .mhm #oOrderContent, .mhm #oOrderContent > tbody { display: block; }
  .mhm #oOrderContent > tbody > tr:first-child { display: none; }
  .mhm #oOrderContent > tbody > tr { display: grid; grid-template-columns: 1fr auto auto; gap: 6px 12px; align-items: center;
                                     padding: 10px 4px; border-bottom: 1px solid #e3e3e3; }
  .mhm #oOrderContent > tbody > tr > td { display: block; padding: 0; text-align: left; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(2) { grid-column: 1 / -1; font-size: 14px; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(2) a:first-child { font-weight: bold; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(3) { grid-column: 1; grid-row: 2; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(3):after { content: " \20BD"; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(4) { grid-column: 2; grid-row: 2; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(4) input { width: 64px !important; font-size: 16px; padding: 4px; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(5) { grid-column: 3; grid-row: 2; font-weight: bold; text-align: right; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(5):after { content: " \20BD"; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(1) { grid-column: 1; grid-row: 3; color: #8a8a8a; font-size: 11px; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(6) { grid-column: 2 / -1; grid-row: 3; text-align: right; }

  /* order form: label above the field, fields full width */
  .mhm #oOrderInfo table.pricetable, .mhm #oOrderInfo table.pricetable > tbody,
  .mhm #oOrderInfo table.pricetable > tbody > tr, .mhm #oOrderInfo table.pricetable > tbody > tr > td { display: block; width: auto !important; }
  .mhm #oOrderInfo table.pricetable > tbody > tr > td { padding: 2px 0; }
  .mhm #oOrderInfo table.pricetable > tbody > tr { padding: 6px 0; }
  .mhm #oOrderInfo input[type=text], .mhm #oOrderInfo input[type=tel], .mhm #oOrderInfo input[type=email],
  .mhm #oOrderInfo input[type=number], .mhm #oOrderInfo textarea, .mhm #oOrderInfo select {
    box-sizing: border-box; width: 100% !important; max-width: 100%; font-size: 16px; padding: 6px 8px; height: auto; }
  .mhm #oOrderInfo select { display: block; margin: 0 0 6px; }
  .mhm #oOrderInfo select[style*="display: none"] { display: none; }

  /* page texts: no 30px left indent */
  .mhm .div14 { width: auto; margin-left: 4px; margin-right: 4px; }
  .mhm a.mh-telnum { color: #1560bd; white-space: nowrap; }
  /* "подобрать по характеристикам" links: one line, small */
  .mhm a.loop { font: 900 10px/16px Tahoma, Arial, sans-serif; white-space: nowrap; display: inline-block;
                margin: 4px 0 6px; padding: 3px 26px 3px 0; }
  .mhm .mainright table[cellspacing="10"] td { padding: 4px 0; }

  /* product page */
  .mhm .mainright table[style*="width: 100%"] > tbody > tr > td { display: block; width: auto !important; }
  .mhm .mainright table[style*="height:500px"] { height: auto !important; }
  .mhm .mynoitmframe { width: auto !important; height: auto !important; }
  .mhm div[style*="margin-bottom: -500px"] { float: none !important; position: static !important;
                                             margin: 14px auto 0 !important; width: 232px; }
  .mhm .mainright table[style*="width: 450px"] { width: 100% !important; }
  .mhm .mainright div[style*="margin:30px 0 30px 0"] { margin: 10px 0 !important; }
  /* video row in the characteristics table: full width below its label */
  .mhm .mainright td.mh-video { padding: 0 0 8px; }
  .mhm .mainright td.mh-video iframe { display: block; width: 100% !important; height: auto !important; aspect-ratio: 16 / 9; margin: 0 0 6px; }
  .mhm .mainright td[style*="width: 225px"] { width: auto !important; }
}

@media (max-width: 360px) {
  .mh-chip, .mh-chip:visited { padding: 7px 9px; gap: 4px; font-size: 12px; }
  .mh-chips, .mh-chipgrp { gap: 6px; }
  .mh-btn-buy, .mh-btn-buy:visited { padding: 8px 9px; font-size: 13px; gap: 4px; }
  .mh-btn-cmp, .mh-btn-cmp:visited { padding: 7px 6px; font-size: 12px; }
  .mh-card-img { width: 84px; }
}

/* cart entry in the menu: last tab on the stripe + item at the end of the drawer */
#mh-dr-info a.mh-tab.mh-tab-cart { display: flex; align-items: flex-start; padding-left: 8px; padding-right: 20px; }
#mh-dr-info a.mh-tab-cart svg { margin-top: -3px; flex: none; width: 20px; height: 20px; }
.mh-dr-cartrow a { font-weight: bold; }
.mh-dr-cartrow a svg { flex: none; color: #FF0600; }
.mh-dr-cartrow a span.mh-dr-cnt { margin-left: auto; font-weight: normal; color: #7d8db0; font-size: 13px; }
/* the band's tabs repeated as drawer items under the cart; icons centred in the 32px icon column */
.mh-dr-cartrow a svg, .mh-dr-links a svg { margin: 0 5px; }
.mh-dr-links a svg { flex: none; color: #4a6fb5; }

/* ---- cart: trash + stepper, payment options, recalc button with icon, total block ---- */
@media (max-width: 760px) {
  .mhm #oOrderContent > tbody > tr > td:nth-child(6) { display: none; }
  .mhm #oOrderContent > tbody > tr > td:nth-child(4) { grid-column: 2; }
  .mh-qty { display: inline-flex; align-items: center; gap: 4px; }
  .mhm #oOrderContent a.mh-trash, .mhm #oOrderContent a.mh-trash:visited { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px;
      margin-right: 4px; padding: 0; box-sizing: border-box; border: 1px solid #d5e3f6; border-radius: 10px; background: #fff; color: #4a6fb5 !important; }
  .mh-step { -webkit-appearance: none; appearance: none; width: 34px; height: 34px; margin: 0; padding: 0; border: 1px solid #d5e3f6; border-radius: 10px;
             background: #fff; color: #2b62c7; font: bold 20px/1 Tahoma, Arial, sans-serif; cursor: pointer; touch-action: manipulation; }
  .mhm #oOrderContent .mh-qty input[type=number] { width: 44px !important; height: 34px; box-sizing: border-box; padding: 0 2px; font: bold 16px Tahoma, Arial, sans-serif;
      color: #1b2a5a; -moz-appearance: textfield; }
  .mhm #oOrderContent .mh-qty input[type=number]::-webkit-inner-spin-button, .mhm #oOrderContent .mh-qty input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
  .mhm #oOrderContent ~ br, .mh-pay ~ br { display: none; }
  .mh-pay ~ div[align=center] { margin: 12px 0 14px; font-size: 12px; line-height: 16px; color: #7d8db0; }
  .mh-pay { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 12px 0 0; font: 13px Tahoma, Arial, sans-serif; color: #1b2a5a; }
  .mh-pay-h { font-weight: bold; }
  .mh-pay-opt { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 8px; border: 1px solid #d5e3f6; border-radius: 18px;
                background: #fff; color: #4a6fb5; cursor: pointer; line-height: 16px; }
  .mh-pay-opt input { margin: 0; width: 16px; height: 16px; flex: none; }
  .mh-pay-opt:has(input:checked) { border-color: #2b62c7; background: #eef5fe; color: #1b2a5a; }
  .mh-recalc { -webkit-appearance: none; appearance: none; display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; padding: 7px 12px;
               border: 1px solid #d5e3f6; border-radius: 10px; background: #fff; color: #4a6fb5; font: 13px Tahoma, Arial, sans-serif; cursor: pointer; }
  .mhm .mainright table.mh-total { display: block; margin: 4px 0 16px; padding: 12px 14px; background: #eef5fe; border-radius: 14px; border: 0; }
  .mhm .mainright table.mh-total > tbody, .mhm .mainright table.mh-total tr, .mhm .mainright table.mh-total td { display: block; padding: 0; border: 0; background: none; }
  .mhm .mainright table.mh-total tr.div td { font: bold 14px Tahoma, Arial, sans-serif; color: #1b2a5a; }
  .mhm .mainright table.mh-total td { font-size: 12px; line-height: 16px; color: #5b6b8f; }
  .mhm .mainright table.mh-total td > br:first-child { display: none; }
  .mhm .mainright table.mh-total #oOrderTotal, .mh-total-cur { font: bold 24px/30px Tahoma, Arial, sans-serif; color: #1b2a5a; }
  .mhm #OrderLink input[type=submit], .mhm #OrderLink input[type=button] { width: auto !important; min-width: 220px; }
}

/* ---- shop popups (kd_dont): centred card with a header and a cross ---- */
html > .mh-splash { position: fixed !important; left: 0 !important; top: 0 !important; right: 0; bottom: 0; width: auto !important; height: auto !important;
                  z-index: 1100 !important; background: #0b1530 !important; opacity: .55 !important; }
html > .mh-pop { position: fixed !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%); z-index: 1101 !important;
               width: 420px !important; max-width: calc(100vw - 24px); height: auto !important; overflow: hidden;
               border-radius: 16px; background: #fff; box-shadow: 0 10px 40px rgba(11,21,48,.35); }
.mh-pop-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 10px 10px 16px;
               background: #FED654; border-bottom: 3px solid #FF0600; font: bold 16px/20px Tahoma, Arial, sans-serif; color: #1b2a5a; }
.mh-pop-x, .mh-pop-x:visited { display: flex; align-items: center; justify-content: center; flex: none; width: 32px; height: 32px; border-radius: 16px;
                               background: #fff; color: #1b2a5a; }
.mh-pop iframe { display: block; width: 100% !important; }