@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;600;700&display=swap');

/* custom.css - кириллический фолбэк + конверсия + доступность.
   Дизайн шаблона не меняем: только то, что требует ниша и RU-контент.
   Шаблонный style.css НЕ трогаем: дисплейный Teko кириллицу не поддерживает,
   поэтому Oswald подключаем здесь и переопределяем переменную, не меняя размеры. */

/* 1. Кириллический дисплейный шрифт (близкое к Teko узкое начертание). */
:root {
    --secondary-font: "Oswald", "Saira", sans-serif;
}

/* 2. Sticky-кнопки мессенджеров справа снизу (Telegram над WhatsApp). */
.float-contacts {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: bottom .25s ease;
}
.float-btn-fab {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .28);
    transition: transform .25s ease;
}
.float-btn-fab:hover { transform: scale(1.08); color: #fff; }
.float-btn-fab i { line-height: 1; }
.wa-fab { background: #25d366; }
.tg-fab { background: #229ed9; }
@media (max-width: 768px) {
    .float-contacts { right: 16px; bottom: 16px; gap: 10px; }
    .float-btn-fab { width: 52px; height: 52px; font-size: 27px; }
}
/* Пока виден cookie-бар, поднимаем кнопки над ним. */
body.cookie-open .float-contacts { bottom: 92px; }
@media (max-width: 600px) { body.cookie-open .float-contacts { bottom: 120px; } }

/* Текстовый логотип в шрифте шаблона (апперкейс, как в референсе).
   Десктоп: логотип в .top-header-logo; узкие экраны: в .logo-holder. */
.brand-logo {
    font-family: "Teko", "Oswald", sans-serif;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    display: inline-block;
    position: relative;
    z-index: 2;
    white-space: nowrap;
}
.brand-dot { color: var(--main-color); }
.top-header-logo .brand-logo { font-size: 23px; line-height: 80px; }
.logo-holder .brand-logo { font-size: 30px; line-height: 90px; margin-left: 20px; }

/* Контакты в шапке: телефон + мессенджеры одним блоком,
   ячейки в стиле иконки поиска (высота 80px, золотые иконки, тонкие разделители). */
.header-contacts-top {
    float: right;
    height: 80px;
    display: flex;
    align-items: stretch;
}
.header-contacts-top .hct-phone {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 80px;
    padding: 0 18px;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
}
.header-contacts-top .hct-phone i { color: var(--main-color); font-size: 17px; }
.header-contacts-top .hct-phone:hover { color: var(--main-color); }
.header-contacts-top .hct-icon {
    width: 52px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    color: var(--main-color);
    font-size: 1.2em;
    transition: background .25s ease;
}
.header-contacts-top .hct-icon:hover { background: #111; }
@media (max-width: 1024px) {
    .header-contacts-top .hct-phone span { display: none; }
    .header-contacts-top .hct-phone { padding: 0 16px; }
    .header-contacts-top .hct-icon { width: 50px; }
}
/* Кнопка Консультация - жёлтая, без иконки */
.share-button.consult-btn {
    background: var(--main-color);
    border-color: var(--main-color);
    color: #181818;
}
.share-button.consult-btn span { color: #181818; }
.share-button.consult-btn:hover { background: #ffc92b; border-color: #ffc92b; color: #181818; }
/* На мобиле в шапке не показываем WhatsApp, Telegram и телефон */
@media (max-width: 767px) {
    .header-contacts-top .hct-icon,
    .header-contacts-top .hct-phone { display: none; }
}
/* Контакты внизу меню выглядят 1в1 как пункты меню (единый список) */
.header-contact { margin: 0; padding: 0; }
.header-contact ul { margin: 0; padding: 0; list-style: none; }
.header-contact li { margin: 0; padding: 0; height: auto; }
.header-contact li a {
    display: block;
    height: 50px;
    line-height: 50px;
    padding: 0 0 0 30px;
    font-family: 'Saira', sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(255, 255, 255, .07);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: color .2s ease;
}
.header-contact li a i {
    width: 15px;
    margin-right: 15px;
    font-size: 12px;
    color: var(--main-color);
    text-align: center;
}
.header-contact li a:hover { color: var(--main-color); }

/* 3. Honeypot - скрытое поле против ботов. */
.hp-wrap { position: absolute !important; left: -9999px !important; top: -9999px !important; height: 0; overflow: hidden; }

/* 4. Чекбокс согласия в формах. */
.lead-consent {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 14px 0 4px;
    font-size: 12px;
    line-height: 1.45;
    opacity: .85;
}
.lead-consent input { margin-top: 3px; min-width: 16px; min-height: 16px; }
.lead-consent a { text-decoration: underline; }

/* 5. Сообщение формы (успех/ошибка). */
.lead-msg { margin-top: 14px; font-size: 14px; min-height: 1px; }
.lead-msg.ok  { color: #34c759; }
.lead-msg.err { color: #ff6b6b; }

/* 6. Доступность: видимые focus-стейты + тач-таргеты. */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
    outline: 2px solid #f5a623;
    outline-offset: 2px;
}
.commentssubmit, .header_btn, .hero-btn, .cf_btn { min-height: 44px; }

/* 6b. SEO-таблицы: на узких экранах даём горизонтальный скролл самой таблице,
   чтобы страница не разъезжалась (блоки не плывут). */
.seo-rich-text table { width: 100%; }
@media (max-width: 600px) {
    .seo-rich-text table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
    }
}

/* 7. H1 в герое: шаблон стилизует заголовок героя через h2.
   Мы сделали заголовок семантическим h1, поэтому повторяем стиль 1 в 1,
   включая адаптивные брейкпоинты шаблона (1068px, 564px). Вид не меняется. */
.hero_align_title h1 {
    font-family: var(--secondary-font);
    font-weight: 500;
    font-size: 8.0em;
    line-height: 90px;
    color: #fff;
    text-align: left;
    text-transform: uppercase;
    margin-bottom: 20px;
}
.hero_align_title h1 a { color: #fff; }
.hero_align_title h1 a span { color: var(--main-color); }
.hero_align_title_center h1 { text-align: center; }
@media only screen and (max-width: 1068px) {
    .hero_align_title h1 { font-size: 5.4em; line-height: 60px; }
}
@media only screen and (max-width: 564px) {
    .hero_align_title h1 { font-size: 3.8em; line-height: 50px; margin-bottom: 10px; }
}
/* Подзаголовок hero - крупнее (по запросу) */
.hero_align_title-container p { font-size: 17px; line-height: 28px; }
@media only screen and (max-width: 1068px) {
    .hero_align_title-container p { font-size: 16px; line-height: 26px; }
}
@media only screen and (max-width: 564px) {
    .hero_align_title-container p { font-size: 14px; line-height: 23px; }
}

/* Крупнее основной текст по всему сайту (база была 12px - мелко) */
p { font-size: 15px; line-height: 26px; }
.pdcw_list li { font-size: 15px; }
@media only screen and (max-width: 564px) {
    p { font-size: 14px; line-height: 24px; }
}

/* H2 заголовки секций - немного меньше */
.section-title h2 { font-size: 4.4em; }
.main-section_text-block h2 { font-size: 2.3em; }
.half-carousel-title-item h2 { font-size: 2.5em; }
@media only screen and (max-width: 1068px) {
    .section-title h2 { font-size: 3.2em; }
}

/* 8. Карта-iframe в блоке map-wrapper (вместо JS-карты). */
.map-wrapper .map-container { position: relative; min-height: 340px; background: #e8e8e8; }
.map-wrapper iframe { width: 100%; height: 100%; min-height: 340px; border: 0; display: block; }
