/* Мобильное меню, вариант A «Воздушный список».
   Подключать ПОСЛЕ style.min.css. Действует только на мобильных (брейкпоинт сайта).
   Разметка и логика открытия не меняются. Цвета — в блоке переменных. */

@media (max-width: 61.99875em) {

  nav.burger-menu {
    --bm-text: #666666;
    --bm-hover: #8a5c52;
    --bm-accent: #B6847A;
    --bm-line: #ececec;
    --bm-line-strong: #e3e3e3;
    --bm-arrow: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='14' viewBox='0 0 8 14' fill='none' stroke='%238a5c52' stroke-width='1.2'><path d='M1 1l6 6-6 6'/></svg>");
    padding: 32px 0 28px;
    background: #fff;
    color: var(--bm-text);
    font-weight: 300;
  }

  /* ---------- Кнопка закрытия ---------- */
  nav.burger-menu .burger-menu__btn {
    margin: 0 12px 32px auto;
  }

  /* ---------- Логотип и название компании в шапке меню ---------- */
  nav.burger-menu::before {
    content: "";
    position: absolute;
    top: 25px;
    left: 24px;
    z-index: 1;
    width: 48px;
    height: 44px;
    background: url(../img/logo_new.png) left center / contain no-repeat;
    pointer-events: none;
  }
  .webp nav.burger-menu::before {
	background-image: url(../img/logo_new.png);
  /*  background-image: url(../img/logo-menu.webp);*/
  }
  nav.burger-menu::after {
    content: "Северная\A Бриллиантовая компания";
    white-space: pre;
    position: absolute;
    top: 26px;
    left: 84px;
    z-index: 1;
    color: #6b6b6b;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.3;
    letter-spacing: .02em;
    pointer-events: none;
  }

  /* ---------- Общий вид строк: список, «Каталог», подкатегории ---------- */
  nav.burger-menu .burger-menu__list,
  nav.burger-menu .burger-menu__go-catalog,
  nav.burger-menu .catalog-burger,
  nav.burger-menu .catalog-burger__back,
  nav.burger-menu .catalog-burger__item > * {
    font-size: 23px;
    font-weight: 300;
    line-height: 1.2;
    color: var(--bm-text);
  }

  nav.burger-menu .burger-menu__list {
    margin: 0 0 8px;
    padding: 0;
    list-style: none;
  }

  /* Строка пункта (работает и если __item это <li>, и если <a>) */
  nav.burger-menu .burger-menu__item {
    display: block;
    box-sizing: border-box;
    min-height: 62px;
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--bm-line);
    list-style: none;
  }
  nav.burger-menu .burger-menu__item > a,
  nav.burger-menu a.burger-menu__item {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    min-height: 62px;
    padding: 0 24px;
    color: var(--bm-text);
    text-decoration: none;
    transition: color .2s ease-in-out;
  }
  /* если __item — сам <a>, отступ нужен ему самому */
  nav.burger-menu a.burger-menu__item { border-bottom: 1px solid var(--bm-line); }

  nav.burger-menu .burger-menu__item:hover,
  nav.burger-menu .burger-menu__item > a:hover {
    color: var(--bm-hover);
    text-decoration: none;
  }

  /* Тонкая линия над первым пунктом */
  nav.burger-menu .burger-menu__list > .burger-menu__item:first-child,
  nav.burger-menu .burger-menu__list > li:first-child {
    border-top: 1px solid var(--bm-line-strong);
  }

  /* ---------- «Каталог» ---------- */
  nav.burger-menu .burger-menu__go-catalog {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    min-height: 62px;
    margin: 0;
    padding: 0 24px 0 40px;
    border: 0;
    border-top: 1px solid var(--bm-line-strong);
    border-bottom: 1px solid var(--bm-line);
    background:
      linear-gradient(var(--bm-accent), var(--bm-accent)) no-repeat 24px 50% / 2px 26px,
      var(--bm-arrow) no-repeat right 24px top 50% / 8px 14px;
    color: var(--bm-hover);
    text-align: left;
    cursor: pointer;
    transition: color .2s ease-in-out;
  }
  nav.burger-menu .burger-menu__go-catalog:hover {
    text-decoration: none;
    color: var(--bm-text);
  }

  /* ---------- Подкатегории (выезжающая панель) ---------- */
  nav.burger-menu .catalog-burger {
    background: #fff;
    padding-top: 84px;
  }
  nav.burger-menu .catalog-burger__back {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    min-height: 62px;
    padding: 0 24px;
    border: 0;
    border-top: 1px solid var(--bm-line-strong);
    border-bottom: 1px solid var(--bm-line);
    color: var(--bm-hover);
  }
  nav.burger-menu .catalog-burger__back::before {
    flex: 0 0 8px;
    width: 8px;
    height: 14px;
    margin-right: 14px;
    background: var(--bm-arrow) center / 8px 14px no-repeat;
  }
  nav.burger-menu .catalog-burger__item > * {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    min-height: 62px;
    padding: 0 24px;
    border: 0;
    border-bottom: 1px solid var(--bm-line);
    background-color: transparent;
    text-align: left;
    text-decoration: none;
    transition: color .2s ease-in-out;
  }
  nav.burger-menu .catalog-burger__item:first-child > * { border-top: 0; }
  nav.burger-menu .catalog-burger__item > a:hover,
  nav.burger-menu .catalog-burger__item > button:hover {
    color: var(--bm-hover);
    text-decoration: none;
  }
  nav.burger-menu .catalog-burger__item button {
    background: var(--bm-arrow) right 24px top 50% / 8px 14px no-repeat;
  }

  /* ---------- Контакты внизу ---------- */
  nav.burger-menu .burger-menu__link {
    margin: 0 0 10px;
    padding: 0 24px;
    color: var(--bm-text);
    font-size: 22px;
    font-weight: 300;
    line-height: 1.3;
    text-decoration: none;
    transition: color .2s ease-in-out;
  }
  nav.burger-menu .burger-menu__link:hover {
    color: var(--bm-hover);
    text-decoration: none;
  }
  nav.burger-menu .burger-menu__link_map {
    font-size: 17px;
    color: #6b6b6b;
  }
  /* блок контактов прижат к низу экрана */
  nav.burger-menu .burger-menu__link_phone {
    margin-top: auto;
    padding-top: 24px;
  }

  /* ---------- Соцсети ---------- */
  nav.burger-menu .burger-menu__sicial {
    padding: 8px 24px 0;
    column-gap: 20px;
  }
  nav.burger-menu .burger-menu__sicial a {
    transition: opacity .2s ease-in-out;
  }
  nav.burger-menu .burger-menu__sicial a:hover {
    opacity: .6;
  }

  /* ---------- Иконка Max (PNG) — того же размера, что и остальные ---------- */
  nav.burger-menu .burger-menu__sicial a.max img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
--------
nav.burger-menu .burger-menu__sicial { column-gap: 22px; padding: 8px 24px 0; }
nav.burger-menu .burger-menu__sicial a,
nav.burger-menu .burger-menu__sicial a.long { flex: 0 0 26px; width: 26px; height: 26px; }
}