/* Мобильное полноэкранное меню — единые стили (в т.ч. после portal в body) */

@media (max-width: 1199px) {
  /* Бургер в fixed-шапке остаётся кликабельным поверх затемнения */
  body.bb-header-menu-open #bb-hero-root .bb-hero__header,
  body.bb-header-menu-open #bb-site-header.bb-header,
  body.bb-header-menu-open .bb-header {
    z-index: 450 !important;
  }

  .bb-hero__nav,
  .bb-header__nav,
  [data-mobile-nav] {
    display: block !important;
    position: fixed !important;
    inset: 0;
    z-index: 300 !important;
    padding: 0;
    background: #fbf8f6;
    background: var(--bb-bg, #fbf8f6);
    transform: translateX(100%);
    transition: transform 0.25s ease;
    overflow-x: hidden;
    overflow-y: auto;
    width: 100%;
    max-width: 100vw;
    min-height: 100dvh;
    min-height: 100vh;
    pointer-events: none;
    font-family: "IBM Plex Sans", Arial, sans-serif;
    color: #1a2e40;
    -webkit-overflow-scrolling: touch;
  }

  .bb-hero__nav.is-open,
  .bb-header__nav.is-open,
  [data-mobile-nav].is-open {
    transform: translateX(0) !important;
    pointer-events: auto;
  }

  .bb-hero__nav.bb-mobile-nav--portaled,
  .bb-header__nav.bb-mobile-nav--portaled,
  [data-mobile-nav].bb-mobile-nav--portaled {
    z-index: 400 !important;
  }

  .bb-hero__nav .bb-hero__nav-inner,
  .bb-header__nav .bb-header__nav-inner,
  [data-mobile-nav] .bb-header__nav-inner {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: none;
    min-height: auto;
    margin: 0;
    padding: 20px 20px 32px;
    padding: 20px var(--bb-gutter-narrow, 20px) 32px;
    box-sizing: border-box;
  }

  .bb-hero__nav .bb-hero__container,
  .bb-header__nav .bb-header__container {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Шапка панели: логотип + закрыть */
  .bb-hero__nav-top,
  .bb-header__nav-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 0 20px;
    flex-shrink: 0;
  }

  .bb-hero__nav .bb-hero__nav-logo,
  .bb-header__nav .bb-header__nav-logo {
    display: inline-flex !important;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
    height: 48px;
    margin: 0;
    text-decoration: none;
    line-height: 0;
  }

  .bb-hero__nav .bb-hero__nav-logo .bb-hero__logo-img,
  .bb-header__nav .bb-header__nav-logo .bb-header__logo-img {
    display: block;
    width: auto;
    height: 40px;
    max-width: min(200px, 55vw);
    object-fit: contain;
    object-position: left center;
  }

  .bb-hero__nav-close,
  .bb-header__nav-close {
    position: relative;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  .bb-hero__nav-close span,
  .bb-header__nav-close span {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    width: 22px;
    height: 2px;
    margin: 0;
    background: #1a2e40;
    border-radius: 1px;
    transition: none;
  }

  .bb-hero__nav-close span:first-child,
  .bb-header__nav-close span:first-child {
    transform: translate(-50%, -50%) rotate(45deg);
  }

  .bb-hero__nav-close span:last-child,
  .bb-header__nav-close span:last-child {
    transform: translate(-50%, -50%) rotate(-45deg);
  }

  .bb-hero__nav .bb-hero__nav-menu,
  .bb-header__nav .bb-header__nav-menu {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    width: 100%;
    flex: 0 0 auto;
  }

  .bb-hero__nav .bb-hero__nav-link,
  .bb-header__nav .bb-header__nav-link,
  .bb-hero__nav .bb-nav-services__trigger,
  .bb-header__nav .bb-nav-services__trigger {
    display: block;
    width: 100%;
    padding: 16px 0;
    color: #445566 !important;
    font-size: 18px;
    font-weight: 400 !important;
    line-height: 1.35;
    text-align: left;
    text-decoration: none;
    border-bottom: 1px solid rgba(26, 46, 64, 0.08);
    box-shadow: none !important;
    background: transparent;
  }

  .bb-hero__nav .bb-nav-services__trigger .bb-nav-link__visible,
  .bb-header__nav .bb-nav-services__trigger .bb-nav-link__visible {
    font-weight: 400 !important;
  }

  .bb-hero__nav .bb-hero__nav-link.is-active,
  .bb-header__nav .bb-header__nav-link.is-active,
  .bb-hero__nav .bb-nav-services__trigger.is-active,
  .bb-header__nav .bb-nav-services__trigger[aria-expanded="true"] {
    color: #1a2e40 !important;
    font-weight: 400 !important;
  }

  .bb-hero__nav .bb-hero__nav-group,
  .bb-header__nav .bb-header__nav-group {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  /* Телефон и мессенджеры сразу под «Контакты», без линии внизу */
  .bb-hero__nav .bb-hero__nav-group .bb-hero__nav-contacts,
  .bb-header__nav .bb-header__nav-group .bb-header__nav-contacts {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 16px;
    margin: 0;
    padding: 20px 0 0;
    border-bottom: none;
  }

  .bb-hero__nav .bb-hero__phone,
  .bb-header__nav .bb-header__phone {
    color: #1a2e40 !important;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none !important;
    white-space: nowrap;
  }

  .bb-hero__nav .bb-hero__phone:hover,
  .bb-header__nav .bb-header__phone:hover {
    color: #c87a4a !important;
  }

  .bb-hero__nav .bb-hero__messengers,
  .bb-header__nav .bb-header__messengers {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: flex-start;
  }

  .bb-hero__nav .bb-hero__icon-btn,
  .bb-header__nav .bb-header__icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    background: transparent;
    text-decoration: none;
  }

  .bb-hero__nav .bb-hero__icon-img,
  .bb-header__nav .bb-header__icon-img {
    display: block;
    width: 40px;
    height: 40px;
    object-fit: contain;
  }

  .bb-hero__nav .bb-nav-link__ghost,
  .bb-header__nav .bb-nav-link__ghost {
    display: none;
  }

  .bb-hero__nav .bb-nav-link__visible,
  .bb-header__nav .bb-nav-link__visible {
    opacity: 1;
    transform: none;
  }

  /* «Услуги» — без лишнего прямоугольника под пунктом (как на главной) */
  .bb-hero__nav .bb-nav-services,
  .bb-header__nav .bb-nav-services {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    margin: 0;
    padding: 0;
    border: none;
    border-bottom: 1px solid rgba(26, 46, 64, 0.08);
    background: transparent;
  }

  .bb-hero__nav .bb-nav-services__trigger,
  .bb-header__nav .bb-nav-services__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
    border: none;
    border-bottom: none !important;
    background: transparent;
  }

  .bb-hero__nav .bb-nav-services__menu,
  .bb-header__nav .bb-nav-services__menu {
    position: static !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  .bb-hero__nav .bb-nav-services__menu::before,
  .bb-header__nav .bb-nav-services__menu::before {
    display: none !important;
    content: none !important;
  }

  .bb-hero__nav .bb-nav-services.is-open .bb-nav-services__menu,
  .bb-header__nav .bb-nav-services.is-open .bb-nav-services__menu {
    padding-bottom: 8px !important;
  }

  .bb-hero__nav .bb-nav-services__rich,
  .bb-header__nav .bb-nav-services__rich {
    border-radius: 0;
    background: transparent;
  }

  .bb-hero__nav .bb-nav-services__rich:hover,
  .bb-header__nav .bb-nav-services__rich:hover,
  .bb-hero__nav .bb-nav-services__rich:focus-visible,
  .bb-header__nav .bb-nav-services__rich:focus-visible {
    background: transparent;
  }
}