/* ═════════════════════════════════════════════════════════════════════
   Новая шапка сайта (макет главной 5.10): views/layouts/_header_v2.php
   Figma: десктоп 1:216 / 1:238 / 1:269, мобильная 1:40.

   Размеры по макету (ширина 1380, контент 1140):
     верхняя строка 40 px · средняя 95 px · меню 69 px = 204 px.
   Это ровно высота прежней шапки, на которую рассчитаны отступы всех
   страниц (site.css: .wrap > .container 205 px, хабы, Экспресс, Экспо…),
   поэтому другие страницы под новой шапкой не съезжают.
   Ниже 992 px — компактная шапка 71 px (как прежняя мобильная).

   Меню — та же разметка .bottom-header .menu-wrap, что у прежней шапки:
   подменю и «лесенка» их высоты из site.css работают как раньше, здесь
   переопределён только вид пунктов первого уровня.
   ═════════════════════════════════════════════════════════════════════ */

/* ── Шрифты (самохост). Файлы скачиваются, только если шрифт реально
      используется на странице. Roboto — те же файлы, что у Грузчики-хаба. ── */
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/fonts/roboto/roboto-cyrillic-400-normal.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/fonts/roboto/roboto-latin-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('/fonts/roboto/roboto-cyrillic-700-normal.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('/fonts/roboto/roboto-latin-700-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Roboto Var'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('/fonts/roboto/roboto-cyrillic-wght-normal.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Roboto Var'; font-style: normal; font-weight: 100 900; font-display: swap;
  src: url('/fonts/roboto/roboto-latin-wght-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/fonts/inter/inter-400.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('/fonts/inter/inter-700.woff2') format('woff2'); }

/* ── Каркас ── */
.header.header--v2 {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1030;
  background: #fff;
  font-family: 'Roboto', Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: box-shadow .25s ease;
}
/* Прежняя шапка при слайдере опускала z-index (site.css: .header.slider-on). */
.header.header--v2.slider-on { z-index: 100; }
.header.header--v2.is-scrolled { box-shadow: 0 6px 18px rgba(0, 0, 0, .06); }

.hv2 .hv2-wrap {
  width: 100%;
  max-width: 1170px;
  margin: 0 auto;
  padding: 0 15px;
  box-sizing: border-box;
}
.hv2 a,
.hv2 a:hover,
.hv2 a:focus { text-decoration: none; }
.hv2 img { display: block; max-width: none; }
.hv2 button { font: inherit; cursor: pointer; }

/* ── Верхняя строка: город · адрес · режим работы · соцсети ── */
.hv2 .hv2-top {
  height: 40px;
  overflow: hidden;
  transition: margin-top .3s ease;
}
/* Прокрутка вниз — строка уезжает, шапка становится 164 px (как прежняя). */
.hv2.is-top-hidden .hv2-top { margin-top: -40px; }
.hv2 .hv2-top__row {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.hv2 .hv2-top__left {
  display: flex;
  align-items: center;
  min-width: 0;
}
.hv2 .hv2-city {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 28px 10px 0;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 14px;
  line-height: 17px;
  color: #235c33;
  white-space: nowrap;
}
.hv2 .hv2-city__name { text-decoration: underline; text-underline-offset: 2px; }
.hv2 .hv2-city:hover .hv2-city__name { color: #94c121; }
.hv2 .hv2-top__item {
  position: relative;
  padding: 10px 28px;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 14px;
  line-height: 17px;
  color: #000;
  white-space: nowrap;
}
.hv2 .hv2-top__item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 1px;
  height: 22px;
  margin-top: -11px;
  background: #ededed;
}
.hv2 .hv2-top__addr { font-weight: 300; }
.hv2 .hv2-top__hours { font-weight: 700; }
.hv2 .hv2-top__soc {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
}
.hv2 .hv2-soc { display: block; border-radius: 4px; transition: opacity .2s; }
.hv2 .hv2-soc:hover { opacity: .8; }

/* ── Средняя строка: логотип · телефоны · кнопки ── */
.hv2 .hv2-mid {
  position: relative;
  z-index: 2;
  height: 95px;
  background: #fff;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .04);
}
.hv2 .hv2-mid__row {
  height: 95px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.hv2 .hv2-brand {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 0 0 auto;
  color: #333;
}
.hv2 .hv2-brand__logo { width: 80px; height: 50px; object-fit: contain; }
.hv2 .hv2-brand__text {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.hv2 .hv2-brand__name {
  font-family: Montserrat, Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 20px;
  letter-spacing: 1.4px;
  color: #333;
}
.hv2 .hv2-brand__tagline {
  font-size: 14px;
  line-height: 18px;
  color: #545454;
  white-space: nowrap;
}
.hv2 .hv2-phones {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0;
  min-height: 60px;
  padding: 0 24px;
  border-left: 1px solid #ededed;
  flex: 0 0 auto;
}
.hv2 .hv2-phone,
.hv2 .hv2-phone p {
  margin: 0;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 20px;
  line-height: 30px;
  color: #333;
  white-space: nowrap;
}
.hv2 .hv2-phone a { color: #333; }
.hv2 .hv2-phone a:hover { color: #235c33; }
.hv2 .hv2-phone--main,
.hv2 .hv2-phone--main * { font-weight: 700; }
.hv2 .hv2-phone--second,
.hv2 .hv2-phone--second * { font-weight: 400; }
.hv2 .hv2-phone:empty { display: none; }

.hv2 .hv2-actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 0 0 auto;
}
.hv2 .hv2-call {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 43px;
  padding: 0 32px;
  border: 1px solid #94c121;
  border-radius: 24px;
  background: transparent;
  font-family: 'Inter', 'Roboto', Arial, sans-serif;
  font-size: 14px;
  line-height: 17px;
  text-transform: uppercase;
  color: #94c121;
  white-space: nowrap;
  transition: background-color .2s, color .2s;
}
.hv2 .hv2-call:hover,
.hv2 .hv2-call:focus-visible { background: rgba(148, 193, 33, .1); }
.hv2 .hv2-msg { display: flex; align-items: center; gap: 8px; }
.hv2 .hv2-msg__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 41px;
  height: 41px;
  border-radius: 50%;
  transition: transform .2s, opacity .2s;
}
.hv2 .hv2-msg__btn:hover { transform: translateY(-1px); opacity: .9; }
.hv2 .hv2-msg__btn--tg { background: linear-gradient(180deg, #00afea 0%, #00bfff 100%); }

/* Почта: по щелчку на значок — окошко с адресами и кнопкой «Скопировать» (header-v2.js). */
.hv2 .hv2-mail { position: relative; }
.hv2 .hv2-mail__btn { padding: 0; border: 0; background: none; }
.hv2 .hv2-mail__pop {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  z-index: 40;
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: max-content;
  min-width: 280px;
  max-width: 360px;
  padding: 16px 18px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .16);
  text-align: left;
  white-space: normal;
}
.hv2 .hv2-mail__pop[hidden] { display: none; }
.hv2 .hv2-mail__pop::before {                 /* уголок к значку */
  content: '';
  position: absolute;
  top: -6px;
  right: 15px;
  width: 12px;
  height: 12px;
  background: #fff;
  transform: rotate(45deg);
}
.hv2 .hv2-mail__row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2px 12px;
}
.hv2 .hv2-mail__label { grid-column: 1 / -1; font-size: 12px; line-height: 16px; color: #777; }
.hv2 .hv2-mail__addr {
  font-size: 15px;
  font-weight: 700;
  line-height: 20px;
  color: #235c33;
  overflow-wrap: anywhere;
}
.hv2 .hv2-mail__addr:hover { color: #94c121; }
.hv2 .hv2-mail__copy {
  padding: 4px 12px;
  border: 1px solid #94c121;
  border-radius: 14px;
  background: #fff;
  font-size: 12px;
  line-height: 18px;
  color: #235c33;
  white-space: nowrap;
  transition: background-color .2s, color .2s;
}
.hv2 .hv2-mail__copy:hover,
.hv2 .hv2-mail__copy:focus-visible { background: rgba(148, 193, 33, .12); }
.hv2 .hv2-mail__copy.is-done { background: #94c121; color: #fff; }
.hv2-copy-buf { position: fixed; top: 0; left: 0; width: 1px; height: 1px; opacity: 0; }
.hv2 .hv2-calc {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-width: 186px;
  height: 41px;
  padding: 0 16px;
  border-radius: 24px;
  background: #94c121;
  font-family: 'Inter', 'Roboto', Arial, sans-serif;
  font-size: 14px;
  line-height: 17px;
  color: #fff;
  white-space: nowrap;
  transition: background-color .2s;
}
.hv2 .hv2-calc:hover,
.hv2 .hv2-calc:focus { background: #84ad18; color: #fff; }
.hv2 .hv2-compact { display: none; }

/* ── Меню (разметка и подменю — из прежней шапки, см. site.css) ── */
.header.header--v2 .bottom-header {
  height: 69px;
  background: #fff;
  box-shadow: none;
}
.header.header--v2 .bottom-header .menu-wrap {
  display: flex;
  align-items: center;
  height: 69px;
}
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: space-between;
  width: 100%;
  margin: 0;
  padding: 0;
  float: none;
}
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li {
  position: relative;
  float: none;
  flex: 1 1 auto;
  text-align: center;
}
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li + li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  z-index: 1;
  width: 1px;
  height: 22px;
  margin-top: -11px;
  background: #ededed;
  pointer-events: none;
}
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li > a {
  display: block;
  margin: 0;
  padding: 24px 12px 25px;
  font-family: Montserrat, Arial, sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  color: #000;
  white-space: nowrap;
  border-radius: 10px 10px 0 0;
}
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li > a::after { content: none; }
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li > a:hover,
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li > a:focus {
  color: #94c121;
  background: none;
}
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li.active > a {
  color: #01592f;
  font-weight: 600;
  background: none;
}
/* Открытое подменю: пункт превращается в «вкладку», как в прежней шапке. */
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li.open > a,
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li.open > a:hover {
  background: #235c33;
  color: #fff;
}
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li.open::before,
.header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li.open + li::before { opacity: 0; }
.header.header--v2 .bottom-header .menu-wrap .navbar-nav li .dropdown-menu {
  --menu-top: 204px;
  top: 100%;
  left: 0;
  text-align: left;
}
.header.header--v2 .bottom-header .menu-wrap .navbar-nav li .dropdown-menu li a { white-space: nowrap; }

/* ── 1200+ : как в макете ── */

/* ── 992–1199: та же композиция, но плотнее, чтобы влезло в 940 px
      и шапка осталась 204 px (прежняя здесь росла до 234 px). ── */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .hv2 .hv2-city { padding-right: 16px; }
  .hv2 .hv2-top__item { padding: 10px 16px; }
  .hv2 .hv2-brand { gap: 12px; }
  .hv2 .hv2-brand__logo { width: 64px; height: 40px; }
  .hv2 .hv2-brand__name { font-size: 18px; letter-spacing: 1px; }
  .hv2 .hv2-brand__tagline { display: none; }
  .hv2 .hv2-phones { padding: 0 16px; }
  .hv2 .hv2-phone,
  .hv2 .hv2-phone p { font-size: 18px; line-height: 26px; }
  .hv2 .hv2-actions { gap: 10px; }
  .hv2 .hv2-call { padding: 0 16px; }
  .hv2 .hv2-calc { min-width: 0; padding: 0 16px; }
  .header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li > a {
    padding-left: 8px;
    padding-right: 8px;
    font-size: 15px;
  }
  .header.header--v2 .bottom-header .menu-wrap .navbar-nav li .dropdown-menu { --menu-top: 204px; }
}
/* Совсем тесно (992–1100): почту убираем — она есть в подвале и в меню. */
@media (min-width: 992px) and (max-width: 1099.98px) {
  .hv2 .hv2-mail { display: none; }
  .hv2 .hv2-top__addr { display: none; }
}

/* ── Ниже 992: компактная шапка 71 px (логотип + три круглые кнопки) ── */
@media (max-width: 991.98px) {
  .hv2 .hv2-top,
  .hv2 .hv2-phones,
  .hv2 .hv2-actions { display: none; }
  .hv2 .hv2-mid,
  .hv2 .hv2-mid__row { height: 71px; }
  .hv2 .hv2-mid { box-shadow: 0 3px 10px rgba(0, 0, 0, .04); }
  /* Название сжимается первым: подпись переносится на вторую строку, а не
     выталкивает кнопки за край экрана. */
  .hv2 .hv2-brand { flex: 1 1 auto; gap: 10px; min-width: 0; }
  .hv2 .hv2-brand__logo { width: 64px; height: 40px; flex: 0 0 auto; }
  .hv2 .hv2-brand__text { gap: 6px; min-width: 0; }
  .hv2 .hv2-brand__tagline { white-space: normal; }
  .hv2 .hv2-brand__name { font-size: 18px; line-height: 18px; letter-spacing: 1.2px; }
  .hv2 .hv2-brand__tagline { font-size: 11px; line-height: 14px; }
  .hv2 .hv2-compact {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
  }
  .hv2 .hv2-round {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid #94c121;
    border-radius: 50%;
    background: #fff;
    color: #94c121;
  }
  .hv2 .hv2-round:hover,
  .hv2 .hv2-round:focus-visible { background: rgba(148, 193, 33, .1); }
  .hv2 .hv2-burger span,
  .hv2 .hv2-burger span::before,
  .hv2 .hv2-burger span::after {
    display: block;
    width: 16px;
    height: 2px;
    border-radius: 2px;
    background: #94c121;
    transition: transform .2s, opacity .2s;
  }
  .hv2 .hv2-burger span { position: relative; }
  .hv2 .hv2-burger span::before,
  .hv2 .hv2-burger span::after {
    content: '';
    position: absolute;
    left: 0;
  }
  .hv2 .hv2-burger span::before { top: -5px; }
  .hv2 .hv2-burger span::after { top: 5px; }
  .hv2.is-nav-open .hv2-burger span { background: transparent; }
  .hv2.is-nav-open .hv2-burger span::before { transform: translateY(5px) rotate(45deg); }
  .hv2.is-nav-open .hv2-burger span::after { transform: translateY(-5px) rotate(-45deg); }

  /* Меню шапки на узком экране — только по кнопке (компьютер или iPad,
     где мобильного mmenu нет): вертикальный список под шапкой. */
  .header.header--v2 .bottom-header { display: none; height: auto; }
  .header.header--v2.is-nav-open .bottom-header {
    display: block;
    position: absolute;
    top: 71px;
    left: 0;
    right: 0;
    max-height: calc(100vh - 71px);
    overflow-y: auto;
    background: #fff;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .12);
  }
  .header.header--v2 .bottom-header .menu-wrap { display: block; height: auto; padding-top: 8px; padding-bottom: 16px; }
  .header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu { display: block; }
  .header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li { text-align: left; border-bottom: 1px solid #ededed; }
  .header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li + li::before { content: none; }
  .header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li > a { padding: 14px 4px; border-radius: 0; }
  .header.header--v2 .bottom-header .menu-wrap .navbar-nav.hv2-menu > li.open > a { background: none; color: #235c33; }
  .header.header--v2 .bottom-header .menu-wrap .navbar-nav li .dropdown-menu {
    position: static;
    float: none;
    max-height: none;
    margin: 0 0 12px;
    padding: 14px 18px !important;
    border-radius: 10px;
  }
  .header.header--v2 .bottom-header .menu-wrap .navbar-nav li .dropdown-menu li + li { margin-top: 14px !important; }
}

/* ── Телефон: отступы как в мобильном макете (10 px по краям) ── */
@media (max-width: 599.98px) {
  .hv2 .hv2-wrap { padding: 0 10px; }
}
/* 360–429: логотип, название и три кнопки должны влезть в строку (на 375 px
   при макетных размерах не хватало ~35 px) — всё чуть меньше. */
@media (max-width: 429.98px) {
  .hv2 .hv2-brand { gap: 8px; }
  .hv2 .hv2-brand__logo { width: 48px; height: 30px; }
  .hv2 .hv2-brand__text { gap: 4px; }
  .hv2 .hv2-brand__name { font-size: 16px; line-height: 16px; letter-spacing: .6px; }
  .hv2 .hv2-brand__tagline { font-size: 10px; line-height: 12px; }
  .hv2 .hv2-compact { gap: 6px; }
  .hv2 .hv2-round { width: 38px; height: 38px; }
}
@media (max-width: 359.98px) {
  .hv2 .hv2-brand__tagline { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .hv2 .hv2-top,
  .header.header--v2,
  .hv2 .hv2-msg__btn { transition: none; }
}
