:root{
  --header-h: 74px;
}

/* ===== VISIBILITY HELPERS (desktop / mobile) ===== */
.only-desktop{ display:none; }
.only-mobile{ display:flex; }

@media (min-width: 992px){
  .only-desktop{ display:flex; }
  .only-mobile{ display:none !important; }
  .topbar .lang-dd{ display:flex; }
}

@media (max-width: 991.98px){
  .topbar .lang-dd{ display:none !important; }
}

/* ===== HEADER LAYOUT (общий каркас, без позиционирования) ===== */

.header__bar{
  display:grid;
  grid-template-columns: auto 1fr auto;
  align-items:center;
  gap:12px;
  min-height: var(--header-h);
}

.logo img{
  height: 36px;
  width:auto;
}

/* ===== МОБИЛЬНАЯ ШАПКА: лого — языки — бургер ===== */
@media (max-width: 991.98px) {

  /* всё в одну линию, ничего не переносится */
  .header__bar{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;          /* запрещаем перенос строк */
  }

  /* лого слева, не растягиваем */
  .header__bar .logo{
    flex: 0 0 auto;
  }

  /* языки сдвигаем вправо и даём им сжиматься */
  .header__bar .lang-dd.only-mobile{
    margin-left: auto;
    flex: 0 1 auto;
  }

  /* бургер — фиксированной ширины, всегда виден */
  .header__bar .burger{
    flex: 0 0 40px;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
  }
}

/* сами полоски бургера — три линии с нормальными отступами */
.burger{
  width: 42px;
  height: 42px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
}

.burger__bar{
  display: block;
  width: 20px;
  height: 2px;
  background: #111;
  margin: 3px 0;
}

/* ===== LANGUAGE DROPDOWN (desktop + mobile) ===== */
.lang-dd{
  position: relative;
  z-index:13040;
}

.lang-dd__toggle{
  display:flex;
  align-items:center;
  gap:8px;
  background:rgba(255,255,255,.7);
  backdrop-filter:saturate(1.2) blur(6px);
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
  padding:8px 12px;
  cursor:pointer;
  line-height:1;
}

.lang-dd__toggle:hover{
  border-color:rgba(0,0,0,.15);
}

.lang-dd__flag{
  width:18px;
  height:18px;
  border-radius:50%;
  object-fit:cover;
}

.lang-dd__label{
  font-size:14px;
  white-space:nowrap;
}

.lang-dd__chev{
  stroke:#333;
  fill:none;
  stroke-width:2;
  transition:transform .2s ease;
}

.lang-dd[aria-expanded="true"] .lang-dd__chev,
.lang-dd__toggle[aria-expanded="true"] .lang-dd__chev{
  transform:rotate(180deg);
}

.lang-dd__menu{
  position:absolute;
  right:0;
  top:calc(100% + 6px);
  min-width:200px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
  box-shadow:0 12px 30px rgba(0,0,0,.12);
  padding:6px;
  margin:0;
  list-style:none;
  display:none;
  z-index:13050;
}

.lang-dd__menu.is-open{
  display:block;
}

.lang-dd__item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border-radius:10px;
  cursor:pointer;
  user-select:none;
}

.lang-dd__item:hover{
  background:rgba(0,0,0,.04);
}

.lang-dd__item.is-active{
  background:rgba(28,93,71,.08);
}

.lang-dd__name{
  font-size:14px;
}

@media (max-width: 991px){
  .lang-dd__toggle{
    padding:8px 10px;
  }
  .lang-dd__menu{
    min-width:180px;
  }
}

/* ===== MAIN NAV + MEGA (новая версия, fixed full-width) ===== */

.mainnav{
  display:flex;
  align-items:center;
  gap:18px;
  font-family:'Inter',sans-serif;
  min-width:0;
}

.mainnav .nav-link{
  position:relative;
  z-index:12010;
  pointer-events:auto;
  text-decoration:none;
  color:#111;
  font-weight:600;
  font-size: clamp(14.5px, 1.25vw, 17px);
  padding:8px 4px;
}

/* контейнер мегаменю */
.dropdown.mega{
  position: static;
  z-index: 11000;
}

.dropdown.mega > .nav-link{
  position:relative;
  z-index: 12010;
}

.dropdown.mega .mega-menu{
  position: fixed;
  left:0;
  right:0;
  top: var(--mega-top, 100px);
  width:100%; /* было 100vw — давало горизонтальный скролл */
  z-index: 11900;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition: opacity .18s ease, visibility .18s ease;
  background: linear-gradient(180deg, rgba(255,255,255,.76), rgba(255,255,255,.68));
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  border-top: 1px solid rgba(0,0,0,.04);
  border-bottom: 1px solid rgba(0,0,0,.06);
  box-shadow: 0 18px 42px rgba(0,0,0,.14);
}

.dropdown.mega:hover .mega-menu,
.dropdown.mega .mega-menu:hover,
.dropdown.mega .mega-menu.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

/* layout wrapper inside mega */
.dropdown.mega .mega-menu{
  display:grid;
  grid-template-columns: minmax(0,1fr);
}

.dropdown.mega .mega-menu::before{
  content:"";
  display:block;
  height:0;
}

.dropdown.mega .mega-menu > .mega-left,
.dropdown.mega .mega-menu > .mega-center,
.dropdown.mega .mega-menu > .mega-right{
  all: unset;
}

.dropdown.mega .mega-menu > .mega-content{
  width: min(1280px, calc(100% - 32px)); /* раньше было 100vw - 32px */
  margin: 0 auto 14px;
  display: grid;
  grid-template-columns: 1.1fr 1fr 1fr;
  gap: 24px;
}

.mega-title{ display:none; }

.mega-left{
  padding: 10px 0;
}

.mega-list{
  list-style:none;
  margin:0;
  padding:0;
}

.mega-list .mega-parent{
  display:block;
  padding:8px 0;
  font-family:'Bodoni Moda',serif;
  font-weight:600;
  font-size: clamp(24px, 3.0vw, 36px);
  line-height:1.05;
  color:#111;
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition: color .15s ease, border-color .15s ease;
}

.mega-list .mega-parent.is-active,
.mega-list .mega-parent:hover{
  color:#1c5d47;
  border-bottom-color: rgba(28,93,71,.2);
}

.mega-center{
  padding: 16px 0;
}

.mega-sublist{
  list-style:none;
  margin:0;
  padding:0;
  columns:2;
  column-gap:24px;
}

.mega-sublist .mega-child{
  display:block;
  break-inside:avoid;
  padding:6px 0;
  color:#2b2b2b;
  text-decoration:none;
  font-family:'Inter',sans-serif;
  font-weight:500;
  font-size: clamp(14px, 1.25vw, 16.5px);
}

.mega-sublist .mega-child:hover{
  color:#1c5d47;
  text-decoration:underline;
}

.mega-right{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
}

.mega-preview{
  width: min(420px, 32vw);
  border-radius: 18px;
  overflow:hidden;
  background:#fff;
  box-shadow: 0 14px 40px rgba(0,0,0,.16);
}

.mega-preview img{
  width:100%;
  height:auto;
  display:block;
}

@media (max-width: 1024px){
  .dropdown.mega .mega-menu > .mega-content{
    grid-template-columns: 1fr 1fr;
  }
  .mega-right{
    grid-column: 1 / -1;
  }
  .mega-preview{
    width:100%;
  }
}

@media (max-width: 680px){
  .dropdown.mega .mega-menu > .mega-content{
    grid-template-columns: 1fr;
  }
  .mega-sublist{
    columns: 1;
  }
}

.nav-dot{
  display:inline-block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#e33;
  margin-left:6px;
  vertical-align:middle;
}

/* ===== MOBILE DRAWER NAV ===== */
.mnav{
  position:fixed;
  inset:0;
  z-index:1100;
  display:flex;
  pointer-events:none;
}

.mnav.is-open{
  pointer-events:auto;
}

.mnav__backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.4);
  opacity:0;
  transition:opacity .18s ease;
}

.mnav.is-open .mnav__backdrop{
  opacity:1;
}

.mnav__panel{
  position:relative;
  margin-left:auto;
  width:min(86vw, 360px);
  max-width:100%;
  height:100%;
  background:#fff;
  transform:translateX(100%);
  transition:transform .22s ease;
  display:flex;
  flex-direction:column;
  padding:12px;
  box-shadow: -12px 0 28px rgba(0,0,0,.18);
}

.mnav.is-open .mnav__panel{
  transform:translateX(0);
}

.mnav__close{
  align-self:flex-end;
  border:0;
  background:none;
  font-size:22px;
  line-height:1;
  padding:6px;
}

.mnav__list{
  list-style:none;
  margin:8px 0 0;
  padding:0;
  display:grid;
  gap:2px;
}

.mnav__item{ }

.mnav__link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:12px 10px;
  text-decoration:none;
  color:#0f1d18;
  font:600 16px/1.2 'Inter',sans-serif;
  border-radius:10px;
  background:#fff;
  border:1px solid #eef1f0;
}

.mnav__item--catalog .mnav__link{
  background:#f9faf9;
}

.mnav__plus{
  width:18px;
  height:18px;
  display:inline-block;
  background:#1c5d47;
  border-radius:4px;
  position:relative;
}

.mnav__plus::before,
.mnav__plus::after{
  content:"";
  position:absolute;
  background:#fff;
}

.mnav__plus::before{
  width:10px;
  height:2px;
  left:4px;
  top:8px;
}

.mnav__plus::after{
  width:2px;
  height:10px;
  left:8px;
  top:4px;
}

.mnav__item.is-open .mnav__plus::after{
  display:none;
}

.mnav__submenu{
  padding-left:10px;
  display:none;
}

.mnav__item.is-open .mnav__submenu{
  display:block;
}

.mnav__sublist{
  list-style:none;
  padding:8px 0 4px;
  margin:0;
  display:grid;
  gap:4px;
}

.mnav__sublink{
  display:block;
  padding:8px 10px;
  text-decoration:none;
  color:#183229;
  font:600 15px/1.25 'Inter',sans-serif;
  border-radius:8px;
}

.mnav__subsublist{
  list-style:none;
  padding:4px 0 8px 10px;
  margin:0;
  display:grid;
  gap:2px;
}

.mnav__subsublink{
  display:block;
  padding:6px 10px;
  text-decoration:none;
  color:#334d43;
  font:500 14px/1.25 'Inter',sans-serif;
  border-radius:8px;
}

/* ===== RIGHT CLUSTER (город + кнопка) ===== */
.header__right{
  justify-self: end;
  display:flex;
  align-items:center;
  gap:12px;
}

/* ===== ВЫКЛЮЧАЕМ старый языковой блок темы в топбаре ===== */
.topbar .lang-mini,
.topbar .language{
  display:none !important;
}

/* ===== ИКОНКИ СОЦСЕТЕЙ В МОБИЛЬНОМ ТОПБАРЕ ===== */
.m-social .sicon{
  margin-right: 10px;
}

.m-social .sicon:last-child{
  margin-right: 0;
}

/* ===== FINAL FIX: топбар всегда в одну строку ===== */

.topbar__wrap{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 0 !important;
}

.topbar__left{
  display: flex !important;
  gap: 18px !important;
}

.topbar__right{
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex-wrap: nowrap !important;
}

.topbar__phone{
  white-space: nowrap !important;
}

/* === Единые отступы шапки на всех страницах === */
.topbar > .container-xl,
.header > .container-xl {
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 24px;
  padding-right: 24px;
}

@media (max-width: 991.98px) {
  .topbar > .container-xl,
  .header > .container-xl {
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* === Кнопка "Заказать проект" в шапке === */
.btn-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 18px;
  border-radius: 12px;
  font-weight: 700;
  text-decoration: none;
  border: 0;
}

.btn-cta--red {
  background: #e63946;
  color: #fff;
  box-shadow: 0 10px 24px rgba(230,57,70,.25);
}

.btn-cta--red:hover {
  color: #fff;
  text-decoration: none;
  filter: brightness(.96);
}