/* Header: геометрия лого + зафиксированный контракт верхнего десктоп-меню. */

/* Горизонтальный ритм шапки/футера/бургера/плавающей CTA — единый токен для
   любой страницы с новым контуром шапки (был определён только в parity-sync.css
   на главной, кейсы дублировали его вручную под себя). */
:root {
  --page-gutter-x: 78px;
}
@media screen and (max-width: 1025px) {
  :root {
    --page-gutter-x: 55px;
  }
}
@media screen and (max-width: 768px) {
  :root {
    --page-gutter-x: 36px;
  }
}

/* Одна вертикаль с лого / услугами / кейсами: боковые поля = --page-gutter-x */
.header__top-line[data-v-e5e2adce] {
  padding-left: var(--page-gutter-x) !important;
  padding-right: var(--page-gutter-x) !important;
  padding-top: 0 !important;
  border-top: 0 !important;
  box-sizing: border-box;
}

/* Верх страницы должен начинаться сразу с фона первого экрана на любой ширине. */
.header,
.header[data-v-e5e2adce] {
  top: 0 !important;
  margin-top: 0 !important;
  border-top: 0 !important;
}

@media screen and (max-width: 1250px) {
  /*
    Бургер в бандле: position:absolute; right:0 — в WebKit часто визуально «в край» экрана.
    Отступ задаём на самой иконке (как у .menu-icon_case) + safe-area; padding обёртки убран,
    чтобы не дублировать inset.
  */
  .menu-icon__wrapper[data-v-e5e2adce],
  .menu-icon__wrapper_main[data-v-e5e2adce] {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
    display: flex !important;
    justify-content: flex-end !important;
  }

  .header .menu-icon[data-v-e5e2adce],
  .header .menu-icon {
    right: calc(var(--page-gutter-x) + env(safe-area-inset-right, 0px)) !important;
    left: auto !important;
  }
}

/*
 * === Зафиксированный контракт: верхнее меню (Кейсы, Услуги, …), viewport ≥ 1251px ===
 * font-family: MuseoSansCyrl (+ системный стек) | font-weight: 300 | font-size: 16px
 * + -webkit-font-smoothing: subpixel-antialiased (Safari не «тонит» начертание).
 * Источник правды по меню — только этот файл; не дублировать размер/жирность в parity / Nuxt-бандлах страниц.
 * Подключение: sections/header.css после страничных CSS, где снова задаётся .navigation-list a (иначе «плывёт» 14/15px).
 * Не использовать селектор .header.page-top для меню: js/app.js (initHeaderBurgerOnScroll) снимает page-top при скролле.
 * Селекторы с #__layout и ul.navigation-list > li > a — запас по каскаду и scoped-атрибутам.
 */

@media screen and (min-width: 1251px) {
  #__layout .header .header__top-line .navigation-menu .navigation-list a[data-v-e5e2adce],
  #__layout .header .header__top-line .navigation-menu .navigation-list a[data-v-6bd2b9b2],
  .header .header__top-line .navigation-menu .navigation-list a[data-v-e5e2adce],
  .header .header__top-line .navigation-menu .navigation-list a[data-v-6bd2b9b2],
  #__layout .header .header__top-line .navigation-menu ul.navigation-list > li > a,
  .header .header__top-line .navigation-menu ul.navigation-list > li > a {
    font-family:
      MuseoSansCyrl,
      system-ui,
      -apple-system,
      "Segoe UI",
      Roboto,
      Ubuntu,
      Cantarell,
      "Noto Sans",
      sans-serif !important;
    font-weight: 300 !important;
    font-size: 16px !important;
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: auto;
  }

  #__layout .header .header__top-line .navigation-menu .navigation-list a.nuxt-link-active[data-v-e5e2adce],
  #__layout .header .header__top-line .navigation-menu .navigation-list a.nuxt-link-active[data-v-6bd2b9b2],
  .header .header__top-line .navigation-menu .navigation-list a.nuxt-link-active[data-v-e5e2adce],
  .header .header__top-line .navigation-menu .navigation-list a.nuxt-link-active[data-v-6bd2b9b2],
  #__layout .header .header__top-line .navigation-menu ul.navigation-list > li > a.nuxt-link-active,
  .header .header__top-line .navigation-menu ul.navigation-list > li > a.nuxt-link-active {
    font-family:
      MuseoSansCyrl,
      system-ui,
      -apple-system,
      "Segoe UI",
      Roboto,
      Ubuntu,
      Cantarell,
      "Noto Sans",
      sans-serif !important;
    font-weight: 300 !important;
    font-size: 16px !important;
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: auto;
  }

  /* Крестик/бургер вне .header__top-line: без искусственного верхнего зазора. */
  .header .menu-icon,
  .header .menu-icon[data-v-e5e2adce] {
    top: 40px !important;
  }

  /*
   * Горизонтальное меню: .header__logo-img с top: 33px ниже flex-центра .header__container;
   * у .navigation-list в бандле margin-bottom: 7px — вместе меню уезжает вверх относительно лого.
   * translateY(3px): на 1px выше прежних 4px — выравнивание с лого на static/prod.
   */
  .header .header__top-line .navigation-menu .navigation-list,
  .header .header__top-line .navigation-menu .navigation-list[data-v-e5e2adce] {
    margin-bottom: 0 !important;
    transform: translateY(3px);
  }
}

/* ≤1250: бургер/крестик — те же +5px к топам snapshot.bundle (лого опущено на 5px). */
@media screen and (min-width: 1025px) and (max-width: 1250px) {
  .header .menu-icon,
  .header .menu-icon[data-v-e5e2adce] {
    top: 40px !important; /* bundle 35px + 5px в ритм с лого */
  }
}

@media screen and (max-width: 1024px) {
  .header .menu-icon,
  .header .menu-icon[data-v-e5e2adce],
  .compressed.header .menu-icon,
  .compressed.header .menu-icon[data-v-e5e2adce] {
    top: 47px !important; /* по центру логотипа (было 55) */
  }
}

/* Планшет: бургер по вертикали с логотипом. */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .header .menu-icon,
  .header .menu-icon[data-v-e5e2adce],
  .compressed.header .menu-icon,
  .compressed.header .menu-icon[data-v-e5e2adce] {
    top: 48px !important; /* было 53 */
  }
}

@media screen and (max-width: 426px) {
  .header .menu-icon,
  .header .menu-icon[data-v-e5e2adce],
  .compressed.header .menu-icon,
  .compressed.header .menu-icon[data-v-e5e2adce] {
    top: 31px !important; /* по центру логотипа (было 37) */
  }
}

@media screen and (max-width: 360px) {
  .header.page-top .menu-icon,
  .header.page-top .menu-icon[data-v-e5e2adce] {
    top: 30px !important; /* page-top: в ритм с лого (было 36) */
  }
}

@media screen and (min-width: 769px) {
  .header__logo .header__logo-img {
    position: relative;
    top: 33px !important;
    width: 132px !important;
    height: auto;
  }
}

@media screen and (max-width: 1100px) {
  .header__logo .header__logo-img {
    position: relative;
    top: 0 !important;
    width: 132px !important;
    height: auto;
  }
}

@media screen and (min-width: 1025px) and (max-width: 1100px) {
  .header__logo .header__logo-img {
    top: 33px !important;
  }
}

/* После max-width:1100 (top:0): одна линия с серединой бургера на планшете. */
@media screen and (min-width: 768px) and (max-width: 1024px) {
  .header__logo .header__logo-img {
    top: -1px !important;
  }
}

@media screen and (max-width: 500px) {
  .header__logo .header__logo-img {
    width: 97px !important;
  }
}

/* Любая ширина: компактный список «Кейсы / Услуги / …» в сжатой шапке скрыт,
   пока collapsed (в т.ч. при открытом бургере) — иначе он остаётся видимым
   над оверлеем бургера и дублирует тот же список. Перенесено из parity-sync.css
   (было только на главной; правило с :not(.active) ниже ограничено ≤1250px
   и не покрывает открытый бургер на широком десктопе). */
.header.header--collapsed .navigation-menu,
.header.header--collapsed .navigation-menu[data-v-e5e2adce] {
  opacity: 0 !important;
  pointer-events: none !important;
}

.header.active .header__top-line .navigation-menu,
.header.active .header__top-line .navigation-menu[data-v-e5e2adce] {
  opacity: 0 !important;
  pointer-events: none !important;
}
/*
 * ≤1250: после скролла — как на десктопе: .header__top-line.hide уезжает вместе с логотипом
 * (см. snapshot.bundle .header__top-line.hide). Бургер вне top-line — остаётся кликабельным.
 * Десктопное горизонтальное меню в строке шапки не показываем.
 */
@media screen and (max-width: 1250px) {
  .compressed.header.header--collapsed:not(.active) .header__top-line.hide .navigation-menu,
  .compressed.header.header--collapsed:not(.active) .header__top-line.hide .navigation-menu[data-v-e5e2adce] {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* Все ширины: при collapsed скрываем лого вместе со строкой (перебиваем точечные top/visibility в адаптиве). */
.compressed.header.header--collapsed:not(.active) .header__top-line.hide .header__logo,
.compressed.header.header--collapsed:not(.active) .header__top-line.hide .header__logo a,
.compressed.header.header--collapsed:not(.active) .header__top-line.hide .header__logo-img,
.compressed.header.header--collapsed:not(.active) .header__top-line.hide .header__logo[data-v-e5e2adce],
.compressed.header.header--collapsed:not(.active) .header__top-line.hide .header__logo a[data-v-e5e2adce],
.compressed.header.header--collapsed:not(.active) .header__top-line.hide .header__logo-img[data-v-e5e2adce] {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* «Главная» в оверлее бургера — только ≤1250; на широком десктопе главная = лого в шапке */
@media screen and (min-width: 1251px) {
  .header .new-static-menu .navigation-new__list > li.navigation-new__item--mobile-only,
  .header .new-static-menu .navigation-new__list > li.navigation-new__item--mobile-only[data-v-7050ddb2] {
    display: none !important;
  }
}

/* На главной пункт «Главная» в бургере не показываем (404 с sa-home-page — исключение) */
body.sa-home-page:not(.sa-not-found-page) .header .new-static-menu .navigation-new__list > li.navigation-new__item--mobile-only,
body.sa-home-page:not(.sa-not-found-page) .header .new-static-menu .navigation-new__list > li.navigation-new__item--mobile-only[data-v-7050ddb2] {
  display: none !important;
}

/* Логотип является частью самой плашки меню, а не просвечивающей строкой под ней. */
.header.active .header__top-line .header__logo {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.new-static-menu .menu-overlay-logo {
  position: fixed !important;
  top: 0 !important;
  left: calc(var(--page-gutter-x) + env(safe-area-inset-left, 0px)) !important;
  z-index: 4 !important;
  display: flex !important;
  align-items: center !important;
  height: 95px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.new-static-menu .menu-overlay-logo .header__logo-img {
  position: relative !important;
  top: 0 !important;
  display: block !important;
  width: 132px !important;
  height: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
}

@media screen and (max-width: 500px) {
  .new-static-menu .menu-overlay-logo .header__logo-img {
    width: 97px !important;
  }
}

/*
 * Мобильный/планшетный бургер после скролла: логотип в оверлее не показываем.
 * На десктопе (≥1251) в том же оверлее логотип слева остаётся.
 */
@media screen and (max-width: 1250px) {
  .header.active.header--collapsed .new-static-menu .menu-overlay-logo,
  .header.active.header--collapsed .new-static-menu .menu-overlay-logo .header__logo-img {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}