/* ================================
   MENU.CSS — CLEAN FINAL (VODOOTVOD)
   ПК: как сейчас
   МОБИЛКА:
   строка 1: лого слева / бургер справа
   строка 2: кнопка КП слева / телефоны справа (столбиком)
   меню: компактная карточка справа
================================ */

/* ===== HEADER BAR (ALL) ===== */
.header.top-bar{
  background:#e6ebf1 !important;
  border-bottom:1px solid rgba(0,0,0,.10) !important;
  box-shadow:0 2px 12px rgba(0,0,0,.08) !important;
  position:sticky;
  top:0;
  z-index:2000;
}

.header.top-bar .container{
  padding-top:10px;
  padding-bottom:2px;
}

body{ scroll-padding-top: 90px; }

/* ===== LOGO ===== */
.logo-text{
  font-weight:900;
  font-size:28px;
  line-height:1;
  text-decoration:none;
}

.header.top-bar .logo img{
  display:block !important;
  max-height:48px !important;
  width:auto !important;
  height:auto !important;
}

/* ===== NAV (DESKTOP) ===== */
.header.top-bar .navbar-nav{
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:20px;
  margin:0;
  padding:0;
}
.header.top-bar .navbar-nav .nav-item{ list-style:none; margin:0; padding:0; }

.header.top-bar .navbar-nav .nav-link{
  display:block;
  font-size:16px;
  padding:10px 14px;
  color:#333 !important;
  font-weight:500;
  text-decoration:none;
}
.header.top-bar .navbar-nav .nav-link:hover{ color:#f26f31 !important; }

/* ===== PHONES (ALL) ===== */
.header-phone__link{
  color:#333 !important;
  font-weight:700;
  white-space:nowrap;
  text-decoration:none;
  display:inline-block;
}
.header-phone__link:hover{ color:#000 !important; }

/* ===== CTA КП (RED) ===== */
a.header-kp-btn{
  background:#d63a2f !important;
  color:#fff !important;
  border:0 !important;
  padding:12px 18px !important;
  font-weight:900 !important;
  border-radius:10px !important;
  text-decoration:none !important;
  display:inline-block !important;
  box-shadow:0 10px 22px rgba(214,58,47,.30) !important;
}
a.header-kp-btn:hover{ filter:brightness(.95); }

/* ================================
   MOBILE (<=991px)
================================ */
  @media (max-width:991px){
  .header.top-bar .container{
    padding-top:6px !important;
    padding-bottom: 0px !important;
  }
  body{ scroll-padding-top: 72px; }

  /* перестраиваем ROW в grid: 2 колонки, 2 строки */
  .header.top-bar .row{
    display:grid !important;
    grid-template-columns: 1fr auto;   /* слева / справа */
    grid-template-rows: auto auto;     /* строка1 / строка2 */
    column-gap:12px;
    row-gap:4px;                       /* меньше — чтобы КП поднялась выше */
    align-items:start;
  }

  /* строка 1: LOGO слева */
  .header.top-bar .col-6.col-lg-3{
    grid-column:1;
    grid-row:1;
    width:auto !important;
  }

  /* строка 1: BURGER справа */
  .header.top-bar .col-6.col-lg-6{
    grid-column:2;
    grid-row:1;
    width:auto !important;
    text-align:right;
  }

  /* строка 2: PHONES+BUTTON (делим внутри) */
  .header.top-bar .col-12.col-lg-3{
    grid-column:1 / 3;
    grid-row:2;
    width:auto !important;
    margin-top:0 !important;

    display:grid !important;
    grid-template-columns: auto 1fr;   /* КНОПКА слева / НОМЕРА справа */
    column-gap:12px;
    align-items:start;
  }

  /* лого компактнее */
  .logo-text{
    font-size:22px !important;
    line-height:1 !important;
  }

  /* бургер компактнее */
  .navbar{
    padding:0 !important;
    position:relative; /* якорь для #mainNav */
  }
  .navbar-toggler{
    padding:6px 10px;
    border-radius:10px;
  }

  /* КНОПКА слева — поднять выше */
  a.header-kp-btn{
    grid-column:1;
    justify-self:start;
    margin-top:0 !important;          /* ключевое */
    padding:8px 12px !important;
    font-size:13px !important;
    border-radius:10px !important;
    white-space:nowrap;
    box-shadow:0 8px 16px rgba(214,58,47,.22) !important;
  }

  /* НОМЕРА справа */
  .header-phone{
    grid-column:2;
    text-align:right;
    margin-top:0 !important;
  }
  .header-phone__link{
    display:block !important;
    font-size:14px;
    line-height:1.15;
    margin:0;
  }

  /* ===== DROPDOWN MENU (COMPACT) ===== */
  #mainNav{
    position:absolute;
    top:44px;            /* ниже бургера */
    right:0;
    left:auto;

    width:220px;
    max-width:80vw;
    max-height:60vh;
    overflow:auto;

    background:#fff;
    border:1px solid rgba(0,0,0,.10);
    border-radius:12px;
    padding:6px 0;
    box-shadow:0 10px 24px rgba(0,0,0,.10);
    z-index:3000;
  }

  #mainNav .navbar-nav{
    margin:0 !important;
    padding:0 !important;
    display:block !important;
  }
  #mainNav .nav-link{
    font-size:15px;
    padding:10px 14px !important;
    line-height:1.2;
  }
  #mainNav .nav-item + .nav-item{
    border-top:1px solid rgba(0,0,0,.06);
  }
}
   @media (max-width:991px){

   /* выравниваем кнопку и телефоны по нижнему краю */
   .header.top-bar .col-12.col-lg-3{
   align-items:end !important;
  }

   /* кнопка поднимается до уровня нижнего номера */
   .header-kp-btn{
   align-self:end;
   margin-top:0 !important;
 }

}
   @media (max-width:991px){
  .header.top-bar a.btn-global.btn-two.header-kp-btn{
    transform: translateY(-35px) !important;
    background:#d63a2f !important;
  }
}
@media (max-width: 991px){
  .header.top-bar .header-phone{
    margin-bottom: 0 !important;
  }
  .header.top-bar a.header-kp-btn{
    margin: 0 !important;
  }
}
/* === HARD TRIM MOBILE HEADER (FINAL OVERRIDE) === */
@media (max-width: 991px){

  /* 1) Убить bootstrap-отступы у row (gutter) */
  .header.top-bar .row{
    margin-left: 0 !important;
    margin-right: 0 !important;
    row-gap: 0 !important;
  }
  .header.top-bar .row > [class*="col-"]{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* 2) Контейнер — в ноль снизу */
  .header.top-bar .container{
    padding-bottom: 0 !important;
    padding-top: 6px !important;
  }

  /* 3) Убрать mt-3 у правого блока (если он остался) */
  .header.top-bar .col-12.col-lg-3{
    margin-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* 4) Телефоны и кнопка — без внешних отступов, плотный line-height */
  .header.top-bar .header-phone{
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.1 !important;
  }
  .header.top-bar .header-phone__link{
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.1 !important;
    display: block !important;
  }

  .header.top-bar a.header-kp-btn{
    margin: 0 !important;
    padding: 8px 12px !important;
    line-height: 1.1 !important;
  }

  /* 5) Сам header без минимальной высоты */
  .header.top-bar{
    min-height: 0 !important;
    height: auto !important;
  }
}
/* ===== BREADCRUMBS COMPACT ===== */

   .breadcrumb,
   .breadcrumbs,
   .page-breadcrumb,
   .bread-crumbs{
    margin:4px 0 !important;
    padding:4px 0 !important;
    font-size:14px !important;
    line-height:1.2 !important;
}

/* мобильная версия ещё компактнее */
/* =========================================
   BREADCRUMBS — КОМПАКТНО, НО С ВОЗДУХОМ
   ========================================= */

/* контейнер под крошками — именно он даёт воздух */
.page-header,
.page-breadcrumb,
.breadcrumb-wrap,
.breadcrumbs-wrap,
.bread-crumbs-wrap{
  margin: 0 !important;
  padding: 10px 0 8px !important; /* воздух сверху и снизу */
}

/* сами крошки — компактно */
.page-header .breadcrumb,
.page-header .breadcrumbs,
.page-header .page-breadcrumb,
.page-header .bread-crumbs,
.breadcrumb,
.breadcrumbs,
.page-breadcrumb,
.bread-crumbs{
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
}

/* списки внутри крошек */
.breadcrumb ol,
.breadcrumb ul,
.breadcrumb li,
.breadcrumbs ol,
.breadcrumbs ul,
.breadcrumbs li{
  margin: 0 !important;
  padding: 0 !important;
}

/* мобильная версия */
@media (max-width:991px){

  .page-header,
  .page-breadcrumb,
  .breadcrumb-wrap,
  .breadcrumbs-wrap,
  .bread-crumbs-wrap{
    padding: 8px 0 6px !important;
  }

  .breadcrumb,
  .breadcrumbs,
  .page-breadcrumb,
  .bread-crumbs{
    font-size:12px !important;
    line-height:1.15 !important;
  }

  /* первый блок после крошек без лишнего зазора */
  .service-content{
    margin-top:0 !important;
  }

}
