/**
 * Header: compressed navigation for 1025–1124px.
 *
 * The header stays one row: logo on the left, contacts on the right. Only the
 * navigation container shrinks and its items wrap into two rows inside it.
 */

@media only screen and (min-width: 1025px) and (max-width: 1124px) {
  html #page #header .header_mid,
  html #page #header .header_mid .header_mid_inner {
    height: auto !important;
    min-height: 100px;
  }
  html #page #header .header_mid .header_mid_inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  html #page #header .header_mid .header_mid_inner > .cl {
    display: none;
  }
  html #page #header .header_mid .header_mid_inner .logo_wrap {
    float: none;
    flex: 0 0 auto;
    height: 100px;
  }

  /* right block: nav takes the remaining width, contacts stay on the right */
  html #page #header .header_mid .header_mid_inner .header_right_wrap {
    float: none;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 1 1 auto;
    min-width: 0;
    height: auto !important;
    padding: 0;
  }

  /* the nav container shrinks and the items wrap inside it */
  html #page #header .header_mid .header_mid_inner .header_right_wrap nav {
    float: none;
    flex: 1 1 auto;
    min-width: 0;
    max-width: none;
    height: auto !important;
    margin: 0 10px 0 0;
    overflow: visible;
    display: block;
  }
  html #page #header .header_mid .header_mid_inner .header_right_wrap nav > div {
    width: 100%;
  }
  html #page #header .header_mid nav ul#navigation {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: auto !important;
    padding: 0;
  }
  html #page #header .header_mid nav #navigation > li {
    display: block;
    height: auto !important;
  }
  html #page #header .header_mid nav #navigation > li > a {
    display: block;
    padding: 0 6px;
    height: auto !important;
    line-height: 34px;
  }
  html #page #header .header_mid nav #navigation > li > a > span {
    padding: 0;
  }

  /* contacts are vertically centered instead of using the 100px-row margins */
  html #page #header .header_mid .header_mid_inner .header_right_wrap .contact-number {
    float: none;
    flex: 0 0 auto;
    margin: 0 10px 0 0 !important;
    white-space: nowrap;
  }
  html #page #header .header_mid .header_mid_inner .header_right_wrap #get-call {
    float: none;
    flex: 0 0 auto;
    margin: 0 10px 0 0 !important;
    white-space: nowrap;
  }
  html #page #header .header_mid .header_mid_inner .header_right_wrap .language-nav {
    float: none;
    flex: 0 0 auto;
    margin: 0 !important;
    position: relative;
    z-index: 300;
  }
  html #page #header .header_mid .header_phones-container span {
    white-space: nowrap;
  }

  /* language dropdown above the compressed menu, without gap/slide */
  html #page #header .header_mid ul.language-nav .sub-menu {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    width: 100% !important;
    margin-top: 0 !important;
    transform: none !important;
    transition: opacity .18s ease !important;
    z-index: 301;
  }
  html #page #header .header_mid ul.language-nav .lang-drop:hover .sub-menu {
    transform: none !important;
  }
}

/*
 * At 1125px the desktop menu fits with only a few px to spare. The theme's
 * nav transition (margin / max-width / link padding-left) makes the block
 * temporarily wider and drops the menu to a second row for ~0.5s when the
 * viewport crosses 1124 <-> 1125. Disable those transitions on desktop.
 */
@media only screen and (min-width: 1025px) {
  html.csstransitions #header .header_mid nav {
    transition: none !important;
  }
  html.csstransitions #header .header_mid nav #navigation > li > a {
    transition: none !important;
  }
}

/* 1125–1279px: tighter links so the longest (ru) menu fits in one row. */
@media only screen and (min-width: 1125px) and (max-width: 1279px) {
  html #page #header .header_mid .header_right_wrap nav ul#navigation > li > a {
    padding: 0 1px !important;
    font-size: 11.5px !important;
  }
}
