/* Шапка сайта, вариант B (тёмная), октябрь 2026. Своя разметка, старые шапки скрыты. */
html.sh26 {
  --sh26-bg: #13202b;
  --sh26-bg2: #22313d;
  --sh26-line: #2e3f4c;
  --sh26-text: #dde3e9;
  --sh26-muted: #a9b4bf;
  --sh26-gold: #c9a050;
  --sh26-acc: #b4692a;
}
html.sh26.sh26-biz { --sh26-acc: #0f3b5c; }

/* Старые шапки и их переключатели */
html.sh26 #root header.fixed.top-0,
html.sh26 #root nav.business-site-nav,
html.sh26 .audience-switcher-wrap:not(.sh26-seg),
html.sh26 #audience-switcher-wrap { display: none !important; }

.sh26-header, .sh26-header * { box-sizing: border-box; }
/* Декоративные круги на страницах вылезают за правый край и расширяют страницу на телефоне */
html.sh26 #root { overflow-x: clip; }
.sh26-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  background: var(--sh26-bg); color: #fff;
  font-family: "Open Sans", "Segoe UI", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  box-shadow: 0 1px 0 #ffffff10;
  transition: box-shadow .2s ease;
}
.sh26-header.sh26-scrolled { box-shadow: 0 6px 24px #0b141c40; }
.sh26-bar {
  max-width: 1320px; margin: 0 auto; height: 76px; padding: 0 28px;
  display: flex; align-items: center; gap: 22px;
}
.sh26-header a { text-decoration: none; color: inherit; }

/* Логотип */
.sh26-logo { display: flex; align-items: center; gap: 12px; flex-shrink: 0; color: #fff !important; }
.sh26-logo img { height: 46px; width: auto; display: block; }
.sh26-wm { display: flex; flex-direction: column; line-height: 1.1; }
.sh26-wm b { font: 700 19px/1.15 Montserrat, Arial, sans-serif; letter-spacing: -.01em; white-space: nowrap; color: #fff; }
.sh26-wm small { font-size: 12px; color: var(--sh26-muted); margin-top: 3px; white-space: nowrap; }

/* Переключатель */
.sh26-seg {
  position: relative; display: inline-grid; grid-template-columns: 1fr 1fr;
  padding: 4px; border-radius: 999px; background: var(--sh26-bg2); flex-shrink: 0;
}
.sh26-seg i {
  position: absolute; top: 4px; bottom: 4px; left: 4px; width: calc(50% - 4px);
  border-radius: 999px; background: #fff; box-shadow: 0 1px 4px #0006;
  transition: transform .25s ease;
}
html.sh26-biz .sh26-seg i { transform: translateX(100%); }
.sh26-seg a {
  position: relative; z-index: 1; text-align: center;
  font: 600 14px/1.2 "Open Sans", Arial, sans-serif; padding: 8px 16px; border-radius: 999px;
  color: #b8c3cd !important; white-space: nowrap;
}
.sh26-seg a[aria-current] { color: var(--sh26-acc) !important; }

/* Меню */
.sh26-nav { display: flex; gap: 22px; margin-left: auto; white-space: nowrap; }
.sh26-nav a {
  font: 500 15px/1.2 "Open Sans", Arial, sans-serif; color: var(--sh26-text) !important;
  padding: 6px 0; border-bottom: 2px solid transparent; transition: color .15s;
}
.sh26-nav a:hover { color: #fff !important; }
.sh26-nav a.sh26-on { color: var(--sh26-gold) !important; border-color: var(--sh26-gold); }

.sh26-right { display: flex; align-items: center; gap: 16px; flex-shrink: 0; }
.sh26-tel { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.15; color: #fff !important; white-space: nowrap; }
.sh26-tel b { font: 700 16px/1.2 Montserrat, Arial, sans-serif; }
.sh26-tel small { font-size: 12px; color: var(--sh26-muted); }
.sh26-cta {
  display: inline-block; background: var(--sh26-gold); color: #13202b !important;
  font: 600 15px/1.2 "Open Sans", Arial, sans-serif; padding: 12px 20px; border-radius: 10px;
  white-space: nowrap; transition: filter .15s;
}
.sh26-cta:hover { filter: brightness(1.08); }

.sh26-burger {
  display: none; width: 42px; height: 42px; margin-left: auto; flex-shrink: 0;
  border: 1px solid var(--sh26-line); border-radius: 10px; background: var(--sh26-bg2);
  place-items: center; cursor: pointer; padding: 0;
}
.sh26-burger span { display: block; width: 18px; height: 2px; background: #fff; box-shadow: 0 6px 0 #fff, 0 -6px 0 #fff; }
.sh26-header.sh26-open .sh26-burger span { box-shadow: none; transform: rotate(45deg); }
.sh26-header.sh26-open .sh26-burger span::after { content: ""; display: block; width: 18px; height: 2px; background: #fff; transform: rotate(-90deg); }

/* Выпадающее меню (планшет и телефон) */
.sh26-panel { display: none; border-top: 1px solid var(--sh26-line); padding: 8px 16px 18px; }
.sh26-header.sh26-open .sh26-panel { display: block; }
.sh26-panel nav { display: flex; flex-direction: column; }
.sh26-panel nav a { padding: 13px 4px; font: 500 17px/1.2 "Open Sans", Arial, sans-serif; color: var(--sh26-text) !important; border-bottom: 1px solid #ffffff12; }
.sh26-panel nav a.sh26-on { color: var(--sh26-gold) !important; }
.sh26-panel .sh26-pfoot { display: flex; flex-direction: column; gap: 12px; margin-top: 16px; }
.sh26-panel .sh26-tel { align-items: flex-start; }
.sh26-panel .sh26-cta { text-align: center; padding: 14px 20px; }
.sh26-row2 { display: none; }

@media (max-width: 1279px) {
  .sh26-bar { gap: 18px; padding: 0 20px; }
  .sh26-nav { gap: 18px; }
  .sh26-nav a { font-size: 14px; }
  .sh26-tel small { display: none; }
}
@media (min-width: 1024px) and (max-width: 1199px) {
  .sh26-bar { gap: 14px; padding: 0 16px; }
  .sh26-nav { gap: 14px; }
  .sh26-seg a { padding: 7px 12px; font-size: 13px; }
  .sh26-logo { gap: 10px; }
  .sh26-logo img { height: 40px; }
  .sh26-wm b { font-size: 17px; }
  .sh26-cta { padding: 11px 16px; font-size: 14px; }
}
@media (max-width: 1159px) {
  .sh26-bar > .sh26-right .sh26-tel { display: none; }
}
@media (max-width: 1023px) {
  .sh26-bar > .sh26-nav, .sh26-bar > .sh26-right { display: none; }
  .sh26-burger { display: grid; }
}
@media (max-width: 767px) {
  .sh26-bar { height: 62px; padding: 0 16px; gap: 10px; }
  .sh26-bar > .sh26-seg { display: none; }
  .sh26-logo img { height: 40px; }
  .sh26-wm b { font-size: 17px; }
  .sh26-row2 { display: block; padding: 0 16px 12px; }
  .sh26-row2 .sh26-seg { display: grid; width: 100%; }
  .sh26-row2 .sh26-seg a { padding: 9px 6px; }
}
@media (max-width: 359px) {
  .sh26-wm small { display: none; }
  .sh26-wm b { font-size: 16px; }
}

/* Заголовки не рвать посреди слова («Профессиональн/ая»): переносы по слогам */
html.sh26 body #root h1 { word-break: normal !important; overflow-wrap: normal !important; hyphens: auto !important; -webkit-hyphens: auto !important; }

/* ——— Телефон: аккуратность страниц (14.10.2026) ——— */
@media (max-width: 640px) {
  /* Длинные кнопки в тексте страниц переносятся, а не уходят за край */
  html.sh26 #root main :is(button, a)[class*="inline-flex"] { white-space: normal !important; max-width: 100%; height: auto !important; min-height: 44px; text-align: center; }
  /* Нижняя панель на страницах ДТП: одна строка из двух кнопок вместо блока на треть экрана */
  html.sh26 .dtp-contact-bar > div { padding-top: 10px !important; padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)) !important; }
  html.sh26 .dtp-contact-bar .justify-between { flex-wrap: nowrap !important; }
  html.sh26 .dtp-contact-bar .justify-between > :not(:last-child) { display: none !important; }
  html.sh26 .dtp-contact-bar .justify-between > :last-child { flex: 1 1 auto; flex-wrap: nowrap !important; gap: 8px !important; min-width: 0; }
  html.sh26 .dtp-contact-bar .justify-between > :last-child > * { flex: 1 1 0; min-width: 0; padding-left: 8px !important; padding-right: 8px !important; font-size: 14px !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  html.sh26 .dtp-contact-bar a[href*="t.me"] { display: none !important; }
}

/* Компьютер: кнопки действий не переносятся и не сжимаются, даже при увеличенном масштабе или другом шрифте */
@media (min-width: 641px) {
  html.sh26 #root :is(a, button):is([class*="btn-primary"], [class*="btn-outline"], [class*="btn-secondary"]) { white-space: nowrap !important; flex-shrink: 0 !important; }
}

/* Подвал: поле телефона в форме «Жду звонка» сужается, кнопка не вылезает за край колонки */
html.sh26 #root form.flex > input { min-width: 0; flex: 1 1 0; }

/* MAX: значок в шапке (широкие экраны) и кнопка в меню */
.sh26-max {
  display: inline-grid; place-items: center; height: 36px; padding: 0 12px; border-radius: 999px;
  background: linear-gradient(135deg, #3b5bfd, #8a3ffc); color: #fff !important;
  font: 700 13px/1 Montserrat, Arial, sans-serif; letter-spacing: .04em; flex-shrink: 0;
}
.sh26-max:hover { filter: brightness(1.1); }
.sh26-maxbtn {
  display: block; text-align: center; padding: 13px 20px; border-radius: 10px;
  background: linear-gradient(135deg, #3b5bfd, #8a3ffc); color: #fff !important; font: 600 15px/1.2 "Open Sans", Arial, sans-serif;
}
@media (max-width: 1439px) { .sh26-bar > .sh26-right .sh26-max { display: none; } }
@media (min-width: 1200px) { .sh26-bar { gap: 14px; } .sh26-nav { gap: 18px; } .sh26-right { gap: 12px; } }
