/* Правки по юзабилити-аудиту (октябрь 2026). Подключается после style.css. */

/* п.7 — карточки преимуществ на первом экране */
.promo .promo-links { margin-top: 48px; }
.promo-advantages {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    max-width: 860px;
    margin: 36px auto 0;
}
.promo-adv {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 12px 14px;
    background: rgba(255, 255, 255, .9);
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(13, 71, 161, .12);
    text-align: center;
    text-decoration: none;
    color: #394d59;
}
a.promo-adv:hover { box-shadow: 0 4px 20px rgba(13, 71, 161, .25); color: #394d59; }
.promo-adv b { font: 700 18px/1.2 "Manrope", sans-serif; color: #0d47a1; }
.promo-adv span { font: 500 13px/1.3 "Manrope", sans-serif; }
@media (max-width: 767px) {
    .promo .promo-links { margin-top: 28px; }
    .promo-advantages { grid-template-columns: repeat(2, 1fr); gap: 8px; margin-top: 24px; }
    .promo-adv { padding: 10px 8px; }
    .promo-adv b { font-size: 16px; }
    .promo-adv span { font-size: 12px; }
}

/* п.8 — явное действие в карточках услуг */
.services__item-more {
    margin-top: -4px;
    font: 600 15px/1.2 "Manrope", sans-serif;
    color: #0d47a1;
}
.services__item:hover .services__item-more { text-decoration: underline; }

/* п.5 — подзаголовок попапа консультации */
.popup-feedback .popup-subtitle {
    margin: -6px 0 18px;
    font: 500 14px/1.4 "Manrope", sans-serif;
    color: #394d59;
    text-align: center;
}

/* п.2 — телефон и мессенджеры в мобильной шапке */
.header-quick { display: none; }
@media (max-width: 1023px) {
    .header-quick {
        position: absolute;
        top: 50%;
        right: 140px;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        gap: 6px;
        z-index: 3;
    }
    .header-quick a { display: block; width: 32px; height: 32px; }
    .header-quick img { width: 100%; height: 100%; display: block; }
    .header-quick__phone {
        border-radius: 50%;
        background: #0d47a1;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }
    .header-quick__phone svg { width: 16px; height: 16px; fill: #fff; }
}
@media (max-width: 499px) {
    .header-quick { right: 108px; gap: 5px; }
    .header-quick a { width: 30px; height: 30px; }
}
@media (max-width: 389px) {
    .header .header-logo { width: 118px; }
}

/* п.4 — плавающая кнопка чата меньше на телефоне */
@media (max-width: 767px) {
    .popup_expert { right: 12px; bottom: 12px; }
    .pe_photo { width: 52px; height: 52px; }
    .pe_photo svg { width: 22px; height: 16px; }
}

/* п.6 — три поля в форме «Есть вопрос?» */
@media (min-width: 768px) {
    .question .input-block:not(:last-child) { margin-right: 12px; }
    .question .input-block:last-child { flex: 0 0 170px; }
    .question .input-block input { padding: 0 12px; }
}

/* п.11 — единый вид цен в прайсе */
.table-scroll td:last-of-type span { text-decoration: none !important; }
.table-scroll td:last-of-type p { white-space: nowrap; }
.table-scroll td[colspan] span { text-decoration: none !important; }
@media (max-width: 1023px) {
    .table-scroll td:last-of-type p { white-space: normal; }
}

/* п.9 — быстрые ссылки и сворачиваемые группы прайса (включаются JS на главной) */
.price-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin: 0 0 24px;
}
.price-chip {
    padding: 8px 16px;
    border: 1px solid #c5d6e8;
    border-radius: 20px;
    background: #fff;
    font: 600 14px/1.2 "Manrope", sans-serif;
    color: #0d47a1;
    cursor: pointer;
}
.price-chip:hover, .price-chip.active { background: #0d47a1; border-color: #0d47a1; color: #fff; }
.price-group-head td { cursor: pointer; user-select: none; text-align: center !important; }
.price-list .table-scroll:has(+ .table-scroll) table { margin-bottom: 0; }
.price-list .table-scroll + .table-scroll table { margin-top: 0; }
.price-group-head td p { margin: 0; padding: 0 !important; }
.price-group-head td strong, .price-group-head td span { font-size: 17px !important; color: #283740 !important; }
.price-group-head td::after {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-left: 12px;
    border-right: 2px solid #0d47a1;
    border-bottom: 2px solid #0d47a1;
    transform: translateY(-3px) rotate(45deg);
    transition: transform .2s ease;
}
.price-group-head.open td::after { transform: translateY(1px) rotate(-135deg); }
.price-group-head td p, .price-group-head td::after { display: inline-block; vertical-align: middle; }
.price-group-head .price-group-count { display: inline-block; vertical-align: middle; margin-left: 8px; font: 500 14px/1 "Manrope", sans-serif; color: #6b7a86; }
.price-row-hidden { display: none !important; }

/* п.10 — компактные строки прайса на телефоне */
@media (max-width: 767px) {
    .table-scroll table tr {
        display: grid;
        grid-template-columns: 1fr auto;
        gap: 6px 12px;
        align-items: start;
        padding: 12px 4px;
        text-align: left;
    }
    .table-scroll table tr:nth-child(2n+1) { background: none; }
    .table-scroll table td {
        padding: 0 !important;
        width: auto !important;
        border: 0 !important;
        text-align: left !important;
    }
    .table-scroll table td:first-child { grid-column: 1 / -1; }
    .table-scroll table td:nth-child(2) { font-weight: 500; color: #6b7a86; }
    .table-scroll table td:last-child:not(:first-child) { text-align: right !important; }
    .table-scroll table td[colspan] { grid-column: 1 / -1; text-align: center !important; }
    .table-scroll table p { padding-bottom: 2px; }
}

/* п.13 — отзывы карточками */
.rv { padding: 64px 0; }
.rv-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 32px;
}
.rv-title { margin: 0; }
.rv-rating {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .08);
    text-decoration: none;
    color: #394d59;
}
.rv-rating b { font: 700 36px/1 "Manrope", sans-serif; color: #283740; }
.rv-rating .rv-stars { color: #fc0; font-size: 20px; letter-spacing: 1px; }
.rv-rating .rv-count { font: 500 13px/1.3 "Manrope", sans-serif; }
.rv-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.rv-card {
    display: flex;
    flex-direction: column;
    padding: 24px;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 20px rgba(0, 0, 0, .08);
}
.rv-card__top { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.rv-avatar {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #e3edf8;
    color: #0d47a1;
    font: 700 18px/44px "Manrope", sans-serif;
    text-align: center;
}
.rv-name { font: 700 16px/1.2 "Manrope", sans-serif; color: #283740; }
.rv-date { font: 500 13px/1.3 "Manrope", sans-serif; color: #8a97a3; }
.rv-card__stars { margin-left: auto; color: #fc0; font-size: 16px; letter-spacing: 1px; white-space: nowrap; }
.rv-text {
    display: -webkit-box;
    -webkit-line-clamp: 7;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0 0 14px;
    font: 400 15px/1.55 "Manrope", sans-serif;
    color: #394d59;
}
.rv-src { margin-top: auto; font: 500 13px/1.2 "Manrope", sans-serif; color: #8a97a3; text-decoration: none; }
a.rv-src:hover { color: #0d47a1; }
.rv-card--cta { justify-content: center; align-items: flex-start; gap: 12px; background: #f2f8fd; box-shadow: none; }
.rv-card--cta b { font: 700 20px/1.3 "Manrope", sans-serif; color: #283740; }
.rv-card--cta p { margin: 0; font: 400 15px/1.5 "Manrope", sans-serif; color: #394d59; }
.rv-card--cta .btn { margin-top: 8px; }
.rv-all { font: 600 15px/1.2 "Manrope", sans-serif; color: #0d47a1; }
@media (max-width: 1023px) {
    .rv-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
    .rv { padding: 40px 0; }
    .rv-head { flex-direction: column; align-items: flex-start; gap: 16px; margin-bottom: 20px; }
    .rv-grid {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        gap: 12px;
        margin: 0 -15px;
        padding: 4px 15px 16px;
    }
    .rv-card { flex: 0 0 85%; scroll-snap-align: start; padding: 20px; }
}

/* Плашка рейтинга в футере вместо виджета-iframe Яндекса (ломался и показывал полосы прокрутки) */
.footer-rating {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
    padding: 8px 14px;
    border: 1px solid #e3e8ee;
    border-radius: 8px;
    background: #fff;
    text-decoration: none;
    color: #394d59;
}
.footer-rating:hover { border-color: #0d47a1; color: #394d59; }
.footer-rating b { font: 700 24px/1 "Manrope", sans-serif; color: #283740; }
.footer-rating > span { display: flex; flex-direction: column; gap: 2px; }
.footer-rating__stars { color: #fc0; font-size: 14px; letter-spacing: 1px; line-height: 1; }
.footer-rating__src { font: 500 12px/1.2 "Manrope", sans-serif; }

/* ===== Внутренние страницы ===== */

/* п.22, п.23, п.30 — единые шапки: одно фото без водяных знаков и ровное затемнение под текстом */
.leading:before,
.service-page .leading:before,
.services-page .leading:before,
.about-page .leading:before {
    background: rgba(16, 30, 52, .55);
    opacity: 1;
}
.leading-title, .serive-hero-price { text-shadow: 0 2px 12px rgba(0, 0, 0, .35); }

/* п.16 — быстрый выбор по ситуации на первом экране каталога */
.leading:has(.situation) { height: auto; min-height: 465px; }
.situation { margin-top: 22px; }
.situation__label { margin-bottom: 10px; font: 600 15px/1.3 "Manrope", sans-serif; }
.situation__list { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.situation__list a,
.situation__list button {
    padding: 8px 16px;
    border: 0;
    border-radius: 20px;
    background: rgba(255, 255, 255, .92);
    font: 600 14px/1.2 "Manrope", sans-serif;
    color: #0d47a1;
    text-decoration: none;
    cursor: pointer;
}
.situation__list a:hover,
.situation__list button:hover { background: #fff; color: #0d47a1; box-shadow: 0 2px 12px rgba(0, 0, 0, .3); }

/* п.18 — быстрые ссылки на услуги из таблицы */
.price-also {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    gap: 6px 18px;
    margin: 0 0 18px;
    font: 500 15px/1.4 "Manrope", sans-serif;
    color: #394d59;
}
.price-also a,
.price-also button {
    padding: 0;
    border: 0;
    background: none;
    font: 600 15px/1.4 "Manrope", sans-serif;
    color: #0d47a1;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}
.price-row-flash td { background: #fff3c4 !important; }
.service-detail h2:has(+ .price-also) { text-align: center; }

/* п.20 — строка «когда нужна услуга» в карточке */
.services__item-text { margin: -6px 0 14px; padding: 0 !important; font: 400 14px/1.45 "Manrope", sans-serif; color: #394d59; }

/* п.19 — карточки услуг по две в ряд на телефоне */
@media (max-width: 575px) {
    .services .row,
    .service-detail .row.g-3 { --bs-gutter-x: 10px; --bs-gutter-y: 10px; }
    .services .row > .col-sm-6,
    .service-detail .row > .col-sm-6 { width: 50%; }
    .services__item { padding: 8px; }
    .services__item-image { margin-bottom: 10px; }
    .services__item-image img { aspect-ratio: 317 / 200; object-fit: cover; }
    .services__item-name { margin-bottom: 8px; font-size: 13px !important; letter-spacing: 0 !important; line-height: 1.3; hyphens: auto; overflow-wrap: anywhere; }
    .services__item-name::after { margin-top: 6px; width: 40px; }
    .services__item-text { margin: 0 0 8px; font-size: 12px; line-height: 1.4; }
    .services__item-price { margin-bottom: 6px; font-size: 14px; }
    .services__item-more { font-size: 13px; }
}

/* п.21 — второй одинаковый блок «Есть вопрос?», если он уже есть в тексте страницы */
.service-container:has(.question) ~ .question { display: none; }

/* п.26 — межевой план: выбор варианта по задаче */
.price-tasks { margin: 0 0 24px; padding: 18px 20px; border-radius: 12px; background: #f2f8fd; }
.price-tasks__hint { margin-bottom: 12px; padding: 0 !important; font: 400 15px/1.5 "Manrope", sans-serif; color: #394d59; }
.price-tasks__hint b { color: #283740; }
.price-tasks__list { display: flex; flex-wrap: wrap; gap: 8px; }

/* п.27 — что входит, сроки, что нужно от клиента */
.mp-info { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 0 0 40px; }
.mp-info__col { padding: 20px 22px 4px; border-radius: 12px; background: #fff; box-shadow: 0 4px 20px rgba(0, 0, 0, .08); }
.mp-info__title { margin-bottom: 12px; font: 700 18px/1.3 "Manrope", sans-serif; color: #283740; }
.service-page .service-detail .mp-info ul { margin: 0; padding: 0 0 8px; }
.service-page .service-detail .mp-info ul li { padding: 0 0 10px 18px; font-size: 15px; line-height: 1.45; }
@media (max-width: 767px) {
    .mp-info { grid-template-columns: 1fr; gap: 12px; }
}

/* п.37 — «История компании» блоками по направлениям */
.history-cards { clear: both; display: grid; gap: 12px; margin-top: 24px; }
.history-card { padding: 20px; border-radius: 12px; background: #f2f8fd; }
.history-card__title { margin-bottom: 8px; font: 700 17px/1.3 "Manrope", sans-serif; color: #0d47a1; }
.history-card p { margin: 0; padding: 0; font-size: 15px; line-height: 1.55; }

/* п.33 — телефон и мессенджеры в блоке «Бесплатная консультация» */
.consult-contacts { display: flex; justify-content: center; align-items: center; gap: 10px; margin: 18px 0 6px; }
.consult-contacts a { text-decoration: none; }
.consult-contacts__phone { margin-right: 6px; font: 700 20px/1.2 "Manrope", sans-serif; color: #283740; }
.consult-contacts img { display: block; width: 32px; height: 32px; }
.about-page .consult { margin-top: 48px; padding-top: 64px; }
.about-page .consult-hide-form, .about-page .consult-show-form { display: none; }

/* п.39–41 — контакты */
.contacts-page .page-title {
    width: fit-content;
    padding: 6px 24px;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
}
.contacts-page .card { height: auto; padding-bottom: 36px; }
.contacts-page .card .row.schedule,
.contacts-page .card .row.messengers { margin-bottom: 17px; }
.contacts-page .card .messengers-links { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.contacts-page .card .messengers-links a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: auto;
    font: 600 16px/24px "Manrope", sans-serif;
    color: #171717;
    text-decoration: none;
}
.contacts-page .card .messengers-links img { width: 28px; height: 28px; }
.contacts-page .card .btn { width: auto; }
.contacts-page .map iframe { height: 100%; }
@media (min-width: 1024px) {
    .contacts-page .card { margin-bottom: 40px; }
}
@media (max-width: 1023px) {
    .contacts-page .page-title { margin: 20px auto 24px; }
    .contacts-page .map { position: relative; height: 380px; margin: 24px -15px 0; width: auto; }
    .contacts-page .map iframe { height: 380px; }
}