/* ==========================================================================
   Общая оболочка сайта dm-tmn.ru: навигация в шапке, «Продукты ▾», мобильное меню.
   Подключается на всех страницах ПОСЛЕ стилей страницы. Базовые стили .topbar
   (высота, фон при прокрутке, кнопка) остаются в стилях страниц.
   ========================================================================== */

.sitenav { display: flex; align-items: center; gap: clamp(4px, 1vw, 14px); margin-left: clamp(18px, 3vw, 44px); }
.sitenav__item { position: relative; }
.sitenav__link {
  display: inline-flex; align-items: center; gap: 7px; padding: 8px 10px; border: 0; border-radius: 999px;
  background: none; color: inherit; font: 600 14.5px/1 'Golos Text', -apple-system, 'Segoe UI', Arial, sans-serif;
  text-decoration: none; cursor: pointer; white-space: nowrap; opacity: .86; transition: opacity .2s ease, background .2s ease;
}
.sitenav__link:hover, .sitenav__link[aria-expanded="true"], .sitenav__link.is-here { opacity: 1; background: rgba(127,150,175,.14); color: inherit; }
.sitenav__caret { width: 7px; height: 7px; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .2s ease; }
.sitenav__link[aria-expanded="true"] .sitenav__caret { transform: translateY(1px) rotate(225deg); }

/* выпадающий список «Продукты» — всегда светлая карточка */
.dd {
  position: absolute; top: calc(100% + 12px); left: 0; z-index: 120; width: 340px; padding: 10px;
  border: 1px solid rgba(6,23,42,.08); border-radius: 16px; background: #fff; color: #0c1724;
  box-shadow: 0 24px 60px rgba(6,23,42,.18);
}
.dd[hidden] { display: none; }
.dd__main { display: block; padding: 14px 16px; border-radius: 12px; color: #0c1724; text-decoration: none; }
.dd__main:hover { background: #EEF6FC; color: #0c1724; }
.dd__main b { display: block; font: 700 16px/1.3 Montserrat, 'Golos Text', Arial, sans-serif; letter-spacing: -.015em; }
.dd__main b::after { content: " →"; color: #2587bd; }
.dd__main span { display: block; margin-top: 4px; color: #5e6e7c; font-size: 14px; line-height: 1.4; }
.dd__label { margin: 10px 16px 6px; padding-top: 12px; border-top: 1px solid rgba(6,23,42,.08);
  color: #2587bd; font: 700 11px/1.3 'Golos Text', Arial, sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.dd__list { list-style: none; margin: 0; padding: 0 16px 10px; display: grid; gap: 6px; color: #304353; font-size: 14.5px; }

/* кнопка-«бургер» и мобильное меню */
.burger { display: none; width: 42px; height: 42px; flex: 0 0 auto; border: 1px solid rgba(127,150,175,.4); border-radius: 12px;
  background: transparent; color: inherit; cursor: pointer; align-items: center; justify-content: center; }
.burger span, .burger span::before, .burger span::after { display: block; width: 18px; height: 2px; border-radius: 2px; background: currentColor; position: relative; transition: transform .2s ease, background .2s ease; }
.burger span::before, .burger span::after { content: ""; position: absolute; left: 0; }
.burger span::before { top: -6px; } .burger span::after { top: 6px; }
.topbar.is-menu .burger span { background: transparent; }
.topbar.is-menu .burger span::before { transform: translateY(6px) rotate(45deg); }
.topbar.is-menu .burger span::after { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 900px) {
  .burger { display: inline-flex; order: 3; }
  .topbar .topbar__right { margin-left: auto; }
  .sitenav {
    position: fixed; top: var(--header-h, 74px); left: 0; right: 0; bottom: 0; z-index: 110; margin: 0;
    display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 18px 22px 32px;
    background: #f5f7fa; color: #0c1724; overflow-y: auto;
  }
  .topbar.is-menu .sitenav { display: flex; }
  .sitenav__link { width: 100%; justify-content: space-between; padding: 16px 4px; border-radius: 0; font-size: 19px; opacity: 1; border-bottom: 1px solid rgba(6,23,42,.1); }
  .sitenav__link:hover, .sitenav__link[aria-expanded="true"] { background: none; }
  .sitenav__item .sitenav__caret { display: none; }
  .sitenav__item .dd, .sitenav__item .dd[hidden] { display: block; position: static; width: auto; padding: 4px 0 8px; border: 0; box-shadow: none; background: none; }
  .dd__main { padding: 12px 4px; }
  .dd__label, .dd__list { margin-left: 4px; margin-right: 4px; padding-left: 0; padding-right: 0; }
  .sitenav__tel { display: block; margin-top: 22px; color: #0c1724; font: 700 20px/1.3 Montserrat, Arial, sans-serif; text-decoration: none; }
  .topbar.is-menu { background: #f5f7fa !important; color: #0c1724 !important; border-color: rgba(6,23,42,.08) !important; }
  body.menu-open { overflow: hidden; }
}
@media (min-width: 901px) { .sitenav__tel { display: none; } }

/* шапка страниц — слева логотип и навигация, справа телефон и кнопка */
.topbar { justify-content: flex-start; }
.topbar .topbar__right { margin-left: auto; }
/* на «Финансах» разделы лендинга уступают место навигации сайта на средних экранах */
@media (max-width: 1360px) { .prodnav a:not(.prodnav__name) { display: none; } }

/* ---- исправления: шапка «Финансов» на 1440 и шапка на телефоне ---- */
@media (max-width: 1680px) { .prodnav a:not(.prodnav__name) { display: none; } }
@media (max-width: 900px) {
  .topbar { gap: 10px; }
  .topbar .topbar__right { gap: 10px; min-width: 0; }
  .topbar .topbar__phone { display: none; }
  .topbar .brand { width: 118px; }
  .topbar .topbar__cta { padding: 9px 12px; font-size: 12.5px; }
  .prodnav { margin-left: 4px; padding-left: 10px; }
}
@media (max-width: 420px) { .topbar .topbar__cta { display: none; } }
.cta-short { display: none; }
@media (max-width: 900px) { .cta-long { display: none; } .cta-short { display: inline; } }

/* невидимый мостик над списком: мышь проходит зазор от кнопки к списку, не закрывая его */
.dd::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }

/* ссылки на приложения в Маркете */
.dd__list a { color: #304353; text-decoration: none; }
.dd__list a::after { content: " ↗"; color: #9fb4c7; font-size: .85em; }
.dd__list a:hover { color: #0f5f8f; }
.dd__list a:hover::after { color: #2587bd; }
.dd__all { display: block; margin: 4px 16px 8px; color: #1f6f9f; font-size: 13.5px; font-weight: 600; text-decoration: none; }
.dd__all:hover { color: #0f5f8f; text-decoration: underline; }
@media (max-width: 900px) { .dd__all { margin-left: 4px; } .dd__list a { font-size: 16px; } }
/* на главной — приложения кликабельны, но выглядят как текст */
.tech-list--apps a, .tech-apps__label a { color: inherit; text-decoration: none; }
.tech-list--apps a:hover { color: #1f6f9f; text-decoration: underline; text-underline-offset: 4px; }
.tech-apps__label a:hover { text-decoration: underline; }
