/* ──────────────────────────────────────────────────────────────────────────
   Волна 1 — правки восприятия. Только CSS, без переверстки.
   Подключается последним, поэтому переопределяет style.css и media.css.
   В волне 3 всё отсюда переедет в токены темы и этот файл уйдёт.

   01  Заголовки       — теги правятся в home-page.php, здесь только
                         нейтрализация браузерных размеров h2/h3.
   02  Межстрочный и ширина колонки
   03  Кнопки — три роли, чистка цветов вне палитры
   04  Цитата о TCO — сноской (порядок блоков правится в home-page.php)
   05  Фильтр портфолио — один ряд
   06  Плавающие виджеты не налезают друг на друга
   ────────────────────────────────────────────────────────────────────────── */


/* 01 ─ h2/h3 получили классы .title/.name. Нулевая специфичность :where()
   гасит браузерный кегль, но не мешает ни одному правилу темы. */
:where(h2.title, h3.title, h2.name, h3.name) {
    font-size: inherit;
    font-weight: inherit;
    font-family: inherit;
    line-height: inherit;
}


/* 02 ─ Межстрочный и длина строки.
   В теме у этих абзацев line-height: normal (≈1,2) при колонке до 1248 px —
   выходило 150–200 знаков в строке при комфортных 75. */
#section-about_us-content .text p,
#section-cms-content .texts_blocks .text_left p,
#section-cms-content .texts_blocks .text_right p,
#section-faq-content .faq_list .faq_ittem .reqest p,
.portfolio_ittem .to_table .text p,
#section-lifecycle-content .lifecycle_text,
#section-lifecycle-content .lifecycle_text p {
    line-height: 1.55;
}

/* Блок «о нас»: текст и ссылки остаются целиком, меняется только подача —
   колонка вместо растяжки на всю ширину и выключка влево. */
/* Селекторы повторяют тему один в один: специфичность та же, а файл
   подключается позже — поэтому побеждает без !important. */
#section-about_us-content .text {
    max-width: 720px;
    margin: auto;
}
#section-about_us-content .text,
#section-about_us-content .text p,
#section-about_us-content .text li {
    text-align: left;
}
/* Ссылки внутри предложений перестают читаться сплошным синим шумом:
   цвет текста + подчёркивание, синий — только при наведении. */
#section-about_us-content .text a {
    color: inherit;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    text-decoration-color: rgba(80, 109, 212, .45);
}
#section-about_us-content .text a:hover,
#section-about_us-content .text a:focus-visible {
    color: var(--g1-blue);
    text-decoration-color: var(--g1-blue);
}

#section-lifecycle-content .lifecycle_text {
    max-width: 720px;
}


/* 03 ─ Кнопки: три роли на весь сайт.
   Главная — градиент бренда var(--g1-purple) → var(--g1-blue).
   Вне палитры и убираются: #C05252/#C84B4B (кирпичный),
   #FFCC70/#C850C0/#4158D0 (трёхцветный), #9D49EA/#317DA3 (бирюзовый). */

/* главная */
header .bottom_line .button a,
#section-hero-content .hero_slider .slide_i .left_block .buttoms .first_button,
.tasks-cta .btn-gradient,
.to-top {
    background: var(--g1-grad);
}
header .bottom_line .button a:hover,
#section-hero-content .hero_slider .slide_i .left_block .buttoms .first_button:hover,
.tasks-cta .btn-gradient:hover,
.to-top:hover {
    background: var(--g1-grad-hover);
}

/* второстепенная — контур; на первом экране главная кнопка одна */
#section-hero-content .hero_slider .slide_i .left_block .buttoms .two_button {
    background: transparent;
    border: 1.5px solid var(--g1-blue);
    color: var(--g1-blue);
    padding: 17.5px 38.5px; /* компенсирует рамку, высота не прыгает */
}
#section-hero-content .hero_slider .slide_i .left_block .buttoms .two_button:hover {
    background: var(--g1-surface);
    border-color: var(--g1-ink);
    color: var(--g1-ink);
}

/* сигнальный — единственный красный, из палитры макета */
.is-invalid {
    border-color: var(--g1-signal) !important;
    box-shadow: 0 0 0 2px rgba(212, 80, 80, .15) !important;
}


/* 04 ─ Цитата о TCO остаётся, но перестаёт спорить с заголовком:
   уходит из голубой рамки в сноску под вашим текстом.
   Порядок блоков переставлен в home-page.php. */
#section-lifecycle-content .quote_box {
    background: none;
    border-radius: 0;
    border-left: 3px solid var(--g1-line);
    padding: 2px 0 2px 16px;
    margin: 28px 0 0;
    max-width: 720px;
}
#section-lifecycle-content .quote_box:before,
#section-lifecycle-content .quote_box:after {
    display: none;
}
#section-lifecycle-content .quote_text {
    font-size: 14px;
    line-height: 1.55;
    color: var(--g1-muted);
}
#section-lifecycle-content .quote_src {
    margin-top: 6px;
    font-size: 13px;
    color: var(--g1-muted);
}


/* 05 ─ Фильтр портфолио: 16–20 «таблеток» занимали три ряда и весили
   больше самих работ. Один ряд с горизонтальной прокруткой,
   вид — вторичный. Область нажатия остаётся 44 px. */
#section-portfolio-content .naw_to,
#section-portfolio-content .naw_three,
#section-portfolio-content .naw_four {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    gap: 8px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px;
    margin-bottom: 26px;
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 36px), transparent 100%);
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 36px), transparent 100%);
}
#section-portfolio-content .naw_to a,
#section-portfolio-content .naw_three a,
#section-portfolio-content .naw_four a {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 44px;
    padding: 0 16px;
    font-size: 13px;
    text-transform: none;
    white-space: nowrap;
    border: 1px solid var(--g1-line);
    border-radius: 22px;
    color: var(--g1-muted);
}
#section-portfolio-content .naw_to a:hover,
#section-portfolio-content .naw_three a:hover,
#section-portfolio-content .naw_four a:hover {
    background: var(--g1-surface);
    border-color: var(--g1-purple);
    color: var(--g1-ink);
}


/* 06 ─ Проверено, правка не нужна.
   Плагин виджета контактов сам ставит .to-top{bottom:82px !important}
   и держит кнопку «наверх» над собой. Замеры на 1440 и 390 px:
   пересечения прямоугольников нет, просвет 14 px на мобильном.
   Единственное, что было не так, — трёхцветный градиент кнопки;
   он заменён на фирменный выше, в пункте 03. */
