/* Все секции одной ширины ~1250px (унификация hero / тарифов / новостей) */
@media (min-width: 1200px) {
  .container { max-width: 1250px !important; }
  .col-xl-10 { flex: 0 0 100% !important; max-width: 100% !important; }
}

/* Локальные правки шапки: лого+меню вместе слева, ЛК+телефон вместе справа */
.header__group_left { display: flex; align-items: center; gap: 28px; }
.header__group_right { display: flex; align-items: center; gap: 18px; }
.header__group_right .btn-solid { padding: 9px 22px; font-size: 14px; line-height: 1.3; height: auto; min-height: 0; }

/* === Мобильная адаптация шапки (<992px) === */
@media (max-width: 991px) {
  /* Оставляем fixed как в app.min.css — page-wrap padding-top это компенсирует */
  /* Перебиваем bootstrap row на flex-no-wrap, лого слева, group_right справа */
  .header > .container > .row,
  .header > .container > .row > .col-xl-10 > .row {
    flex-wrap: nowrap !important;
    align-items: center !important;
  }
  .header .col-auto { padding-left: 8px !important; padding-right: 8px !important; }
  .header__group_left { flex: 0 0 auto !important; max-width: none !important; gap: 12px; }
  .header__group_right { flex: 0 0 auto !important; max-width: none !important; gap: 12px; }
  /* Полноэкранный overlay через класс .is-open (а не jQuery slideToggle, чтобы не было inline-стилей) */
  .header__nav_col {
    display: none;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: #2c4060;
    padding: 80px 20px 24px !important;
    z-index: 9999;
    box-sizing: border-box;
    overflow-y: auto;
  }
  .header__nav_col.is-open { display: block !important; }
  body.mobile-menu-open { overflow: hidden; }
  .header__nav ul {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    margin: 0 !important;
  }
  .header__nav li {
    width: 100% !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,0.08);
  }
  .header__nav li:last-child { border-bottom: none; }
  .header__nav li > a, .header__nav li .btn-solid {
    display: block !important;
    padding: 14px 20px !important;
    color: #fff !important;
    text-decoration: none !important;
    text-align: left !important;
    border-radius: 0 !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    transition: background .2s ease;
    width: 100%;
    box-sizing: border-box;
  }
  .header__nav li > a:hover, .header__nav li > a:focus {
    background: rgba(255,255,255,0.08);
    color: #fff !important;
  }
  /* Кнопка ЛК внутри меню — выделим как акцент */
  .header__nav li .btn-solid {
    margin: 8px 16px;
    padding: 12px 20px !important;
    width: auto !important;
    display: inline-block !important;
    text-align: center !important;
    border-radius: 8px !important;
    border: 2px solid #FF8A00 !important;
    color: #FF8A00 !important;
    font-weight: 600 !important;
  }
  .header__bars {
    display: inline-flex;
    position: relative;
    z-index: 10000;  /* выше overlay чтобы оставаться кликабельным */
  }
  .header__bars.active span { background: #FF8A00; }
  /* Шапка тоже над overlay — чтобы лого/телефон были видны */
  .header { z-index: 10000; }
}
@media (max-width: 560px) {
  /* На очень узких экранах email прячем (он уже d-none d-md-inline), оставляем только телефон */
  .header__contacts a:not([href^="tel:"]) { display: none; }
  /* На мобиле колонки футера «Навигация» и «Документы» скрываем — дублируют шапку */
  .footer__grid .footer__col:nth-child(3),
  .footer__grid .footer__col:nth-child(4) { display: none; }
}
@media (min-width: 992px) {
  /* На десктопе меню всегда видно, JS slideToggle не должен накладывать display:none */
  .header__nav_col { display: block !important; }
  .header__bars { display: none; }
}

/* === Секция «Новости»: компактнее, шрифты сайта === */
.news-section, .news-section * { font-family: inherit !important; }
/* Секция-обёртка прозрачна, карточка-«новости» по центру в ширину контента */
.news-section { padding: 32px 0 !important; background: transparent !important; }
.news-container {
  background: #f0f4fa !important;
  border: 1px solid #d8e1ec;
  border-radius: 16px;
  padding: 24px 28px !important;
  max-width: none !important;
  margin: 0 !important;
  box-shadow: 0 6px 20px rgba(20,40,80,0.04);
}
@media (max-width: 560px) {
  .news-container { padding: 16px 14px !important; border-radius: 12px; margin: 0 12px !important; }
}
.news-container { max-width: 980px; margin: 0 auto; padding: 0 16px; }
.news-header { text-align: center; margin-bottom: 14px; }
.news-title { font-size: 22px !important; font-weight: 700 !important; line-height: 1.2; margin: 0 0 6px; color: #1a1a1a; letter-spacing: -0.01em; }
.news-divider { width: 56px; height: 3px; background: #FFB366; margin: 0 auto; border-radius: 2px; }
.news-list { display: flex; flex-direction: column; gap: 8px; }
.news-item {
  background: #fff;
  border: 1px solid #e6eaf0;
  border-radius: 10px;
  padding: 10px 14px;
  display: flex;
  gap: 12px;
  align-items: center;
  box-shadow: none;
}
.news-date {
  flex: 0 0 auto;
  text-align: center;
  background: #f5f5f7;
  border-radius: 6px;
  padding: 4px 8px;
  min-width: 52px;
  line-height: 1.15;
}
.news-date-day { font-size: 16px !important; font-weight: 700; color: #1a1a1a; display: block; }
.news-date-month { font-size: 10px !important; color: #6b6b6b; text-transform: lowercase; display: block; }
.news-date-year { font-size: 10px !important; color: #aaa; display: block; }
.news-content { flex: 1; min-width: 0; }
.news-badge { font-size: 10px !important; font-weight: 600; padding: 1px 8px; border-radius: 8px; background: #ffebee; color: #c62828; display: inline-block; margin: 0 8px 0 0; text-transform: uppercase; letter-spacing: 0.04em; vertical-align: middle; }
.news-badge.new, .news-badge--info { background: #e3f2fd; color: #1565c0; }
.news-item-title { font-size: 14px !important; font-weight: 600 !important; margin: 0; color: #1a1a1a; line-height: 1.35; display: inline; }
.news-text { font-size: 13px !important; line-height: 1.4 !important; color: #4a4a4a; margin: 4px 0 4px; }
.news-link { font-size: 12px !important; color: #343CD2; text-decoration: none; font-weight: 500; white-space: nowrap; }
.news-link:hover { text-decoration: underline; }

/* Поп-ап «Подробнее» — плотный фон, чёткая обводка, читаемые шрифты */
.fancybox-bg { background: rgba(15, 25, 45, 0.6) !important; backdrop-filter: none !important; }
.fancybox-content {
  border: 1px solid #d8dde6 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 60px rgba(0,0,0,0.28) !important;
  background: #fff !important;
}
.news-popup, .s_services__popup, .popup, .popup_consent {
  padding: 28px 32px !important;
  max-width: 640px;
  background: #fff !important;
  border-radius: 14px;
}
.news-popup *, .s_services__popup *, .popup *, .popup_consent * { font-family: inherit !important; }
.news-popup h2, .news-popup h3 { font-size: 20px !important; font-weight: 700 !important; margin: 0 0 12px; color: #1a1a1a; }
.news-popup h4 { font-size: 15px !important; font-weight: 600 !important; margin: 16px 0 6px; color: #1a1a1a; }
.news-popup p, .news-popup li, .popup p, .popup_consent p, .popup_consent li { font-size: 14px !important; line-height: 1.55 !important; color: #2a2a2a; }
.news-popup ul, .popup_consent ul { padding-left: 20px; margin: 8px 0; }
.news-popup a, .popup a { color: #343CD2; text-decoration: underline; }
.news-popup a:hover, .popup a:hover { color: #1a1f9c; }

/* === Секция «Контакты» === */
.s_contacts { padding: 56px 0; background: #f5f7fa; }
.s_contacts__title { text-align: center; font-size: 28px; font-weight: 700; margin: 0 0 32px; color: #1a1a1a; }
.s_contacts__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.s_contacts__card {
  background: #fff;
  border-radius: 14px;
  padding: 28px 24px;
  text-align: center;
  border: 1px solid #e6eaf0;
  transition: transform .25s ease, box-shadow .25s ease;
}
.s_contacts__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 30px rgba(20,40,80,0.08);
}
.s_contacts__icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,138,0,0.1);
  color: #FF8A00;
  border-radius: 50%;
}
.s_contacts__icon svg { width: 28px; height: 28px; }
.s_contacts__card h3 { font-size: 15px; font-weight: 600; margin: 0 0 10px; color: #1a1a1a; }
.s_contacts__card p { font-size: 14px; line-height: 1.5; color: #4a4a4a; margin: 0; }
.s_contacts__card a { color: #343CD2; text-decoration: none; }
.s_contacts__card a:hover { text-decoration: underline; }
@media (max-width: 992px) {
  .s_contacts__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .s_contacts__grid { grid-template-columns: 1fr; }
  .s_contacts__title { font-size: 22px; }
}

/* Звёздочки-сноски в тарифах */
.s_services__itm__params .itm .val { white-space: nowrap !important; }
.val .stars, .itm .val .stars, .s_services__itm__params .itm .val .stars {
  color: #FF8A00 !important;
  font-weight: 700 !important;
  font-size: 0.65em !important;
  margin-left: 4px;
  letter-spacing: 1px;
  vertical-align: top;
  line-height: 1;
  position: relative;
  top: 2px;
}
/* На планшете значения тарифов чуть мельче, чтобы влезали со звёздочками */
@media (max-width: 1100px) {
  .s_services__itm__params .itm .val { font-size: 14px; }
}

/* Цветные карточки тарифов — каждая в цвете своей шапки (::before), включая «Экстра» */
.s_services__list > .s_services__itm { transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease; }
.s_services__list > .s_services__itm:nth-child(1) { border-color: #fcbd14; }
.s_services__list > .s_services__itm:nth-child(2) { border-color: #2389ca; }
.s_services__list > .s_services__itm:nth-child(3) { border-color: #ed6e44; }
.s_services__list > .s_services__itm:nth-child(4) { border-color: #343cd2; }
.s_services__list > .s_services__itm:hover { transform: translateY(-3px); }
.s_services__list > .s_services__itm:nth-child(1):hover { box-shadow: 0 12px 26px rgba(252,189,20,0.28); }
.s_services__list > .s_services__itm:nth-child(2):hover { box-shadow: 0 12px 26px rgba(35,137,202,0.28); }
.s_services__list > .s_services__itm:nth-child(3):hover { box-shadow: 0 12px 26px rgba(237,110,68,0.28); }
.s_services__list > .s_services__itm:nth-child(4):hover { box-shadow: 0 12px 26px rgba(52,60,210,0.28); }
/* Цвет цены ("от 430") в тон карточке */
.s_services__list > .s_services__itm:nth-child(1) .s_services__itm__price b { color: #b88a00; }
.s_services__list > .s_services__itm:nth-child(2) .s_services__itm__price b { color: #1f6fa3; }
.s_services__list > .s_services__itm:nth-child(3) .s_services__itm__price b { color: #c75330; }
.s_services__list > .s_services__itm:nth-child(4) .s_services__itm__price b { color: #2229a3; }

/* Перебиваем app.min.css media (<768px) — не делаем column, держим компакт */
@media (max-width: 991px) {
  .news-section { padding: 24px 0 28px; }
  .news-item {
    flex-direction: row !important;
    text-align: left !important;
    padding: 10px 12px !important;
    gap: 10px !important;
    align-items: center !important;
  }
  .news-date { min-width: 56px !important; padding: 4px 6px !important; }
  .news-date-day, .news-date-month, .news-date-year { display: block !important; }
  .news-date-day { font-size: 15px !important; }
  .news-item-title { font-size: 13px !important; }
  .news-text { font-size: 12px !important; }
  .news-link { font-size: 11px !important; }
}
/* На совсем узких — дата в одну строку сверху, контент снизу */
@media (max-width: 560px) {
  .news-title { font-size: 18px !important; }
  .news-item {
    flex-direction: column !important;
    align-items: flex-start !important;
    padding: 10px 12px !important;
    gap: 6px !important;
  }
  .news-date {
    background: transparent !important;
    padding: 0 !important;
    min-width: 0 !important;
    display: inline-flex !important;
    gap: 4px;
  }
  .news-date-day, .news-date-month, .news-date-year {
    display: inline !important;
    font-size: 11px !important;
    color: #888 !important;
  }
  .news-date-day { font-weight: 700; color: #1a1a1a !important; font-size: 12px !important; }
  .news-content { width: 100%; }
  .news-item-title { font-size: 14px !important; }
}