/* custom.css — точечные правки локализации, дизайн шаблона не меняем */

/* 1. Top bar: на узких десктопах (1200-1450) правый "Звоните сейчас" блок налезает
      на адрес/часы. Уменьшаем шрифт top bar links + ужимаем gap, чтобы зазор остался. */
@media (min-width: 992px) and (max-width: 1450px) {
    .header-top .header-links ul li {
        font-size: 13px;
        margin-right: 12px;
    }
    .header-top .header-links ul li:last-child {
        margin-right: 0;
    }
}

/* 2. Совсем узкие десктопы (< 1300): прячем телефон-блок справа,
      адрес и часы остаются — звонок повторяется в hero и контактах. */
@media (min-width: 992px) and (max-width: 1299px) {
    .navbar-right-desc {
        display: none !important;
    }
}

/* 3. Анимированный circular "Получить расчёт" не должен ехать на текст hero */
@media (max-width: 991px) {
    .hero-title {
        word-break: break-word;
    }
}

/* 4. Testimonials: фон-картинка имеет z-index:-2 и проваливается под body.
      Даём секции tёмный fallback-цвет + поднимаем z-index фон-блоков. */
.testimonial-area-2 {
    background-color: #1a1a1a;
    color: #fff;
}
.testimonial_bg_thumb2-1,
.testimonial_thumb2-1 {
    z-index: 0 !important;
}
.testimonial-area-2 .container {
    position: relative;
    z-index: 2;
}

/* 5. "ПОПУЛЯРНО" badge на средней pricing-card длиннее "POPULAR" — уменьшаем шрифт чтобы влезло */
.pricing-card .pricing-card-icon .tag {
    font-size: 11px;
    letter-spacing: 0.5px;
    padding: 4px 8px;
    white-space: nowrap;
}

/* 6.5. Убрать UPPERCASE + уменьшить H1 hero (Бро попросил поменьше) */
.hero-title,
.hero-style2 .hero-title {
    text-transform: none !important;
    font-size: clamp(36px, 5.5vw, 88px) !important;
    line-height: 1.05 !important;
}
/* Year badge: убираем absolute, делаем inline-baseline маленьким маркером после текста */
.hero-title .year {
    position: static !important;
    display: inline !important;
    font-size: 0.35em !important;
    vertical-align: super !important;
    margin-left: 8px !important;
    color: #ff6b1a !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

/* 6.6. Круговая анимированная надпись CTA - русский длиннее английского,
   уменьшаем шрифт чтобы не залазил сам на себя. */
.hero-title-anime {
    font-size: 11px !important;
    letter-spacing: 0.5px !important;
}

/* 6. Регионы в чёрной полосе - тема ставит opacity 0.6 на .client-logo через
      hover-логику slick. Принудительно повышаем специфичность селектора. */
body .client-area-1 .container .row .client-logo,
body .client-area-1 .container .row .client-logo:hover,
.client-area-1 .slick-slide .client-logo {
    opacity: 1 !important;
}
.client-area-1 .client-logo img {
    opacity: 1 !important;
    filter: none !important;
}

/* 7. About section: SVG-bullet'ы и иконки темы заливают viewport без явных width.
   Жёстко ограничиваем размер всех SVG-иконок секции. */
.about-area-2 .checklist ul li img,
.about-area-2 .checklist img {
    width: 20px !important;
    height: 20px !important;
    max-width: 20px !important;
    margin-right: 10px !important;
    display: inline-block !important;
    vertical-align: middle !important;
}
.about-area-2 .title-area .sub-title img {
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    margin-right: 6px !important;
    display: inline-block !important;
    vertical-align: middle !important;
}
.about-area-2 .about-grid-wrap .icon img {
    width: 44px !important;
    height: 44px !important;
    max-width: 44px !important;
}
.about-area-2 .about-grid-wrap {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 24px;
}
.about-area-2 .about-grid-details .title {
    margin-bottom: 6px;
}
.about-area-2 .checklist ul {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
}
.about-area-2 .checklist li {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    line-height: 1.45;
}

/* 8. Любая sub-title строка темы имеет SVG-precursor — лимит размера */
.title-area .sub-title img,
.sub-title img {
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    vertical-align: middle !important;
    margin-right: 6px !important;
    display: inline-block !important;
}

/* 9. line-shape ruler: тема имеет z-index:-1 на .shape-mockup общий + z-index:3 на 1-1.
   Я даю явные размеры (без них элемент 0×0), но НЕ перебиваю background-position —
   пусть .animation-infinite крутит фон-image как в оригинале. */
.section-animation-shape1-1,
.section-animation-shape1-2 {
    width: 100% !important;
    height: 40px !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 3 !important;
}

/* CLS fix: резервируем место под hero-slider2 + main-menu + .col-auto чтобы slick init
   не сдвигал layout. Размеры подобраны под реальный финальный рендер каждого breakpoint. */
.hero-wrapper.hero-2 {
    min-height: 720px;
    contain: layout style;
}
@media (max-width: 991px) {
    .hero-wrapper.hero-2 {
        min-height: 600px;
    }
}
@media (max-width: 575px) {
    .hero-wrapper.hero-2 {
        min-height: 540px;
    }
}
.hero-slider2 {
    min-height: 600px;
}
@media (max-width: 991px) {
    .hero-slider2 {
        min-height: 480px;
    }
}
.hero-slide {
    min-height: inherit;
}
/* Меню резервируем высоту чтобы при загрузке шрифта не плавало */
.main-menu, .main-menu ul {
    min-height: 40px;
}
.main-menu ul li {
    min-height: 28px;
}

/* 10. Pricing card — у средней карточки .pricing-card-icon содержит icon-box (чёрный квадрат)
   + tag "ПОПУЛЯРНО". Скрываем icon-box, оставляем только тег в правом верхнем углу карточки.
   .pricing-card-details был position:relative от темы — переопределяем чтобы absolute уходил на card. */
.pricing-card {
    position: relative !important;
}
.pricing-card-details {
    position: static !important;
}
.pricing-card-icon {
    position: absolute !important;
    top: 16px !important;
    right: 16px !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 5;
    display: block !important;
    background: transparent !important;
    width: auto !important;
    height: auto !important;
}
.pricing-card-icon .icon {
    display: none !important;
}
.pricing-card-icon .tag {
    background: #ff6b1a !important;
    color: #fff !important;
    border-radius: 4px !important;
    font-size: 10px !important;
    letter-spacing: 0.5px !important;
    padding: 4px 10px !important;
    white-space: nowrap !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    display: inline-block !important;
    position: static !important;
}
/* Молния-bolt иконка в .icon — на всякий случай */
.pricing-card-icon i {
    display: none !important;
}

/* 11. Header в normal flow — иначе он absolute и hero-wrapper лезет под него,
   ruler оказывается за header. С relative ruler сидит ровно под низом nav. */
header.nav-header {
    position: relative !important;
}
/* Тема использует top:-40px на logo-block и navbar-right-desc чтобы они
   "поднимались" в зону top-bar (40px высоты). Top-bar мы убрали — поэтому
   эти элементы вылезают НАД header (negative y). Прибиваем их к top:0. */
.header-navbar-logo,
.navbar-right-desc,
.logo-bg {
    top: 0 !important;
}
.logo-bg {
    height: 75px !important;
}
.navbar-right-desc {
    height: 75px !important;
}
.header-navbar-logo {
    height: 75px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
/* На xl и меньше (< 1400px) скрываем dark-frame logo block - вместо него
   inline-logo .header-logo внутри container показывается (d-xxl-none) */
@media (max-width: 1399px) {
    .header-navbar-logo,
    .logo-bg {
        display: none !important;
    }
}


/* 13. Color-contrast фиксы — Lighthouse a11y. Темнее серые для текста на белом фоне */
.pricing-card .checklist li.unavailable,
.pricing-card .checklist ul li.unavailable {
    color: #6b6b6b !important;
}
.faq-text,
.faq-form .faq-text {
    color: #444 !important;
}
.cta-text {
    color: #d9d9d9 !important;
}
.slider-number {
    color: #888 !important;
    font-weight: 600;
}
.pricing-tabs .nav-link.active {
    color: #fff !important;
}
.form-control::placeholder {
    color: #777 !important;
    opacity: 1;
}
/* Year badge contrast — на белом фоне светло-оранжевый плохо читается, делаем жирнее */
.hero-title .year {
    color: #d85800 !important;
}

/* 14. Хедер: убираем только top-bar (соц/время/адрес) — как просил Бро.
   Остальная оригинальная структура темы сохранена (header-navbar-logo, .header-button СВЯЗАТЬСЯ,
   sidebar-btn grid, navbar-right-desc orange-decoration с phone). */
.header-top {
    display: none !important;
}
/* Скрываем "Звоните сейчас" subtitle в .navbar-right-desc — Бро попросил оставить только телефон */
.navbar-right-desc .title {
    display: none !important;
}