/*
 * Единая шапка/подвал ITSTM для tech.itstm.ru.
 * Переменные, стили меню и мобильной панели скопированы 1-в-1 из
 * Additional CSS основного сайта (itstm.ru), чтобы шапка/подвал совпадали
 * визуально. Структурная база темы (.site-header, .main-navigation,
 * .site-info и т.п.) берётся напрямую с основного сайта через ссылку на
 * его main.min.css в <head> - не дублируется тут.
 */

/* Размер логотипа в шапке - тоже из динамического блока темы
   (generate-style-inline-css), не из Additional CSS. Без этого правила
   картинка логотипа рендерится в родном размере файла (2105x607px). */
.site-header .header-image {
    width: 350px;
}
.inside-header.grid-container {
    max-width: 1280px;
}
/* На основном сайте это даёт body-класс "header-aligned-center"
   (настройка темы "Выравнивание заголовка" = По центру). Тут просто
   применяем то же правило напрямую, без завязки на класс тела. */
.inside-header {
    justify-content: center;
    flex-direction: column;
    text-align: center;
}
.inside-header > :not(:first-child) {
    margin-top: 1em;
}

:root {
    --it-color-primary: #3498DB;
    --it-color-secondary: #2C3E50;
    --it-color-dark-blue: #1B365D;
    --it-color-banner-dark: #0b1f3f;
    --it-color-text: #4B667F;
    --it-color-background-light: #F8FAFC;
    --it-color-background-card: #FFFFFF;
    --it-color-border: #EAECEF;
    --it-color-hover: #2980B9;
    --it-color-shadow: rgba(44, 62, 80, 0.08);
    --it-font-main: 'Exo 2', 'Manrope', sans-serif;
    --whatsapp-color: #25D366;
    --telegram-color: #0088CC;
    --phone-color: #3498DB;
    --mail-color: #FFFFFF;
    --it-color-promo: #ff5100;
    --it-color-promo-gradient: linear-gradient(90deg, #ff7a00 0%, #ff5100 50%, #e64100 100%);
}

/* ========================================================
   МЕНЮ: ОРИГИНАЛЬНАЯ ВЫСОТА И РАЗМЕРЫ + ЦВЕТА БАННЕРОВ
   (скопировано из Additional CSS основного сайта)
   ======================================================== */
.main-navigation {
    background: var(--it-color-promo-gradient) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.35);
    border-bottom: 2px solid #b83200;
    box-shadow: 0 4px 18px rgba(255, 81, 0, 0.38), 0 8px 25px rgba(0, 0, 0, 0.1) !important;
}

.main-navigation .inside-navigation {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background: transparent !important;
}

.main-navigation .main-nav ul li a {
    position: relative;
    z-index: 1;
    color: #FFFFFF !important;
    font-weight: 700;
    font-size: 1rem;
    padding: 0px 22px !important;
    transition: color 0.3s ease;
    border-radius: 8px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.main-navigation .main-nav ul li a::after { display: none; }

.main-navigation .main-nav ul li a::before {
    content: '';
    position: absolute;
    z-index: -1;
    top: 50%;
    left: 4px;
    right: 4px;
    height: 70%;
    background: linear-gradient(135deg, var(--it-color-banner-dark) 0%, #163665 100%);
    border-radius: 999px;
    transform: scaleX(0) translateY(-50%);
    transform-origin: center;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 12px rgba(11, 31, 63, 0.4);
}

.main-navigation .main-nav ul li:hover > a::before,
.main-navigation .main-nav ul li[class*="current-menu-"] > a::before {
    transform: scaleX(1) translateY(-50%);
}

.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
    color: #FFFFFF !important;
}

.main-navigation .main-nav ul ul.sub-menu {
    background: linear-gradient(160deg, #10264b 0%, #09172e 100%) !important;
    border: 2px solid #ff6a00 !important;
    border-radius: 12px !important;
    padding: 6px 0 !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.4), 0 0 18px rgba(255, 106, 0, 0.3) !important;
    top: 100% !important;
    overflow: hidden;
}
.main-navigation .main-nav ul ul li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
.main-navigation .main-nav ul ul li:last-child {
    border-bottom: none !important;
}
.main-navigation .main-nav ul ul li a {
    background-color: transparent !important;
    color: #E2E8F0 !important;
    padding: 12px 20px !important;
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    text-shadow: none !important;
    display: block !important;
}
.main-navigation .main-nav ul ul li a::before { display: none !important; }
.main-navigation .main-nav ul ul li a:hover {
    background: linear-gradient(90deg, rgba(255, 106, 0, 0.25) 0%, transparent 100%) !important;
    color: #FFFFFF !important;
    padding-left: 26px !important;
}
.main-navigation .main-nav ul ul::before { display: none !important; }

.main-navigation .menu-toggle {
    color: #FFFFFF !important;
    font-weight: 800;
}
.main-navigation .menu-toggle:hover { color: #ffffff !important; }
.main-navigation .menu-toggle .gp-icon.icon-menu-bars { fill: #FFFFFF; }

/* Брейкпоинт сворачивания меню в гамбургер - это НЕ часть Additional CSS,
   а отдельный динамический блок темы (generate-style-inline-css),
   скопирован 1-в-1 с основного сайта. */
@media (max-width:768px){
    .main-navigation .menu-toggle,.sidebar-nav-mobile:not(#sticky-placeholder){display:block;}
    .main-navigation ul,.gen-sidebar-nav,.main-navigation:not(.slideout-navigation):not(.toggled) .main-nav > ul,.has-inline-mobile-toggle #site-navigation .inside-navigation > *:not(.navigation-search):not(.main-nav){display:none;}
    .nav-align-right .inside-navigation,.nav-align-center .inside-navigation{justify-content:space-between;}
}

/* ========================================================
   МОБИЛЬНАЯ ПАНЕЛЬ КОНТАКТОВ (скопировано из Additional CSS)
   ======================================================== */
.it-mobile-action-bar {
    display: none !important;
}

@media (max-width: 768px) {
    .it-mobile-action-bar {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-around !important;
        align-items: center !important;
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 60px !important;
        background-color: #ffffff !important;
        box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1) !important;
        z-index: 99999 !important;
        border-top: 1px solid var(--it-color-border) !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .it-mobile-action-bar a {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-decoration: none !important;
        flex: 1 !important;
        font-size: 10px !important;
        color: var(--it-color-text) !important;
    }
    .it-mobile-action-bar a img,
    .it-mobile-action-bar a svg {
        width: 22px !important;
        height: 22px !important;
        margin-bottom: 2px !important;
    }
    /* На мобильных прижимаем контент, чтобы не перекрывался нижней панелью */
    body { padding-bottom: 60px; }
}

/* Копирайт-бар подвала (структура берётся из main.min.css основного сайта) */
.copyright-bar {
    text-align: center;
    padding: 20px 0;
    font-size: 0.85rem;
    color: var(--it-color-text);
}
.copyright-bar a { color: var(--it-color-primary); }