/* ===== header-shared.css — единый хедер как на главной (подключать ПОСЛЕДНИМ) ===== */

/* 0) Базовые токены, если на странице их нет */
:root {
    --line: #1c3d8c;
    --text: #ffffff;
    --accent: #58c7ff;
    --accent-2: #8be1ff;
}

/* 1) Единые стили хедера - ОБЯЗАТЕЛЬНЫЕ РАЗМЕРЫ */
header[data-header='main'] {
    position: sticky !important;
    top: 0 !important;
    z-index: 50 !important;
    background: rgba(8, 19, 39, 0.72) !important;
    backdrop-filter: saturate(135%) blur(10px) !important;
    border-bottom: 1px solid var(--line) !important;
    /* ФИКСИРОВАННАЯ ВЫСОТА ХЕДЕРА */
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
}

/* разметка.topbar должна быть одинаковой во всех хедерах */
.topbar {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    /* ФИКСИРОВАННАЯ ВЫСОТА ТОПБАРА */
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
    padding: 16px 24px !important;
    max-width: var(--maxw, 1200px) !important;
    margin-inline: auto !important;
}

.brand {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    color: var(--text) !important;
    text-decoration: none !important;
    /* ФИКСИРОВАННАЯ ВЫСОТА БРЕНДА */
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
}

.brand .brand-title,
.brand h1 {
    font-size: 20px !important;
    margin: 0 !important;
    line-height: 1 !important;
    /* ФИКСИРОВАННАЯ ВЫСОТА ТЕКСТА */
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
}

/* 2) Логотип — как на главной (градиент 44×44).
      Это ПЕРЕБИВАЕТ любые .logo{background:url(...)} на дочерних страницах. */
.logo {
    width: 44px !important;
    height: 44px !important;
    border-radius: 12px !important;
    flex: 0 0 44px !important;
    background: conic-gradient(
        from 180deg at 50% 50%,
        #58c7ff 0deg,
        #1d86ff 140deg,
        #8be1ff 240deg,
        #58c7ff 360deg
    ) !important;
    box-shadow: 0 0 0 3px #081327, 0 10px 30px rgba(88, 199, 255, 0.45) !important;
}

/* 3) Меню — единые отступы/высота */
nav ul {
    display: flex !important;
    gap: 14px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    /* ФИКСИРОВАННАЯ ВЫСОТА МЕНЮ */
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    align-items: center !important;
}

/* Стабилизация элементов списка */
nav ul li {
    display: flex !important;
    align-items: center !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
}

nav a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    padding: 0 14px !important;
    border-radius: 12px !important;
    color: var(--text) !important;
    text-decoration: none !important;
    /* УБИРАЕМ line-height для inline-flex */
    /* ФИКСИРОВАННАЯ ВЫСОТА ССЫЛОК */
    min-height: 40px !important;
    max-height: 40px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    /* Предотвращаем любые трансформации */
    transform: none !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

nav a:hover,
nav a[aria-current='page'] {
    background: rgba(34, 122, 255, 0.18) !important;
    color: #eaf4ff !important;
    /* Обеспечиваем стабильность при активном состоянии */
    transform: none !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* 4) Моб-меню через чекбокс-«бургер».
   ВАЖНО: порядок в HTML:  input#menuToggle + label.menu-btn + nav */
.menu-btn {
    display: none !important;
    /* ФИКСИРОВАННАЯ ВЫСОТА КНОПКИ МЕНЮ */
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
}

@media (max-width: 900px) {
    nav ul {
        display: none !important;
    }
    .menu-btn {
        display: inline-flex !important;
        align-items: center !important;
        gap: 8px !important;
        background: #0b1e46 !important;
        border: 1px solid var(--line) !important;
        color: #eaf4ff !important;
        padding: 10px 14px !important;
        border-radius: 12px !important;
        cursor: pointer !important;
        /* ФИКСИРОВАННАЯ ВЫСОТА КНОПКИ МЕНЮ НА МОБИЛЬНЫХ */
        height: 40px !important;
        min-height: 40px !important;
        max-height: 40px !important;
    }
    #menuToggle:checked + .menu-btn + nav ul {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        position: absolute !important;
        left: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        transform: translateY(100%) !important;
        background: #0a1b3f !important;
        padding: 16px !important;
        border: 1px solid var(--line) !important;
        border-radius: 12px !important;
        margin-top: 10px !important;
        /* УБИРАЕМ ФИКСИРОВАННУЮ ВЫСОТУ ДЛЯ ВЫПАДАЮЩЕГО МЕНЮ */
        height: auto !important;
        min-height: auto !important;
        max-height: none !important;
    }
}

/* 5) Нормализация хедера — выравниваем типографику и убираем «плавающие» маргины */
header :where(h1, h2, p) {
    margin: 0 !important;
}
header .container a,
header .container p,
header .container h1 {
    color: var(--text) !important;
}

/* 6) Убираем «синий блок» там, где не нужен:
   на функциональных страницах (terms/login/policy) скрываем .hero-fw, если он присутствует */
body.terms .hero-fw,
body.login .hero-fw,
body.policy .hero-fw {
    display: none !important;
}

/* 7) Отступ контента под шапку на узких страницах с фикс-хедером */
body.terms main,
body.login main,
body.policy main {
    padding-top: 72px !important;
}

/* 8) Страховка против дубликатов: если где-то объявлена .logo с url — перебиваем */
.logo[style*='background'],
.brand .logo {
    background: conic-gradient(
        from 180deg at 50% 50%,
        #58c7ff 0deg,
        #1d86ff 140deg,
        #8be1ff 240deg,
        #58c7ff 360deg
    ) !important;
}

/* 9) Скрываем breadcrumbs на всех страницах */
.breadcrumbs {
    display: none !important;
}

/* 10) ДОПОЛНИТЕЛЬНЫЕ ПРАВИЛА ДЛЯ ОБЕСПЕЧЕНИЯ ИДЕНТИЧНЫХ РАЗМЕРОВ */

/* Перебиваем любые другие стили хедера */
header,
.site-header,
[data-header='main'] {
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Перебиваем любые другие стили контейнера */
.container.topbar,
.topbar,
[data-header='main'] .topbar {
    height: 72px !important;
    min-height: 72px !important;
    max-height: 72px !important;
    padding: 16px 24px !important;
    margin: 0 !important;
}

/* Перебиваем любые другие стили навигации */
nav,
[data-header='main'] nav {
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Стабилизация элементов списка */
nav ul li,
[data-header='main'] nav ul li {
    display: flex !important;
    align-items: center !important;
    height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Перебиваем любые другие стили ссылок */
nav a,
[data-header='main'] nav a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    /* Предотвращаем любые трансформации */
    transform: none !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* Перебиваем любые другие стили бренда */
.brand,
[data-header='main'] .brand {
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Перебиваем любые другие стили заголовка бренда */
.brand-title,
.brand h1,
[data-header='main'] .brand-title,
[data-header='main'] .brand h1 {
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    line-height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 20px !important;
    font-weight: normal !important;
}