/* ============================================================
   REDESIGN OVERRIDE — подключается ПОСЛЕ style_v2.css.
   Палитра, ширина, типографика, общая ритмика блоков.
   ============================================================ */

:root {
    --accent: #B85940;
    --accent-hover: #9E4733;
    --accent-active: #7E3624;
    --accent-soft: #fdf2ec;
    --accent-border: #f0d7c7;
    --accent-shadow: rgba(184, 89, 64, 0.18);
    --text: #1d1d1d;
    --text-soft: #4a4a4a;
    --bg: #ffffff;
    --bg-soft: #f6f4f1;
    --line: #ececea;
    --side-gutter: 28px;        /* минимальный отступ от краёв экрана */
}

/* ------------------------------------------------------------ */
/* 1. Полная ширина — убираем wmain/plr ограничения              */
/* ------------------------------------------------------------ */
.wmain,
.container_main .wmain,
.footer .wmain,
.hl_top_info .wmain {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding-left: var(--side-gutter) !important;
    padding-right: var(--side-gutter) !important;
    box-sizing: border-box !important;
}
.container_main.plr,
.footer.plr,
.plr {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.container_main { padding: 0 !important; }

/* hero — полноэкранная галерея уже на 100%, оставляем как есть */
.hero_gallery { width: 100% !important; }

/* Шапка во всю ширину, выровнена с контентом */
.header_float {
    max-width: none !important;
    width: calc(100% - var(--side-gutter) * 2) !important;
    left: var(--side-gutter) !important;
    right: var(--side-gutter) !important;
    transform: none !important;
    gap: 0 !important;
}
.header_float__inner {
    max-width: 100% !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
}

/* ----------- STORIES: вертикальный sticky-сайдбар справа -------- */
/* Выводим из плавающей шапки и приклеиваем к правому краю экрана */
.header_stories {
    position: fixed !important;
    top: 50% !important;
    right: 14px !important;
    left: auto !important;
    transform: translateY(-50%) !important;
    width: auto !important;
    z-index: 999 !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: auto !important;
}
.header_stories__inner {
    background: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: blur(18px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.4) !important;
    border-radius: 40px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08), inset 0 0 0 1px rgba(255, 255, 255, 0.5) !important;
    padding: 12px 9px !important;
    max-width: none !important;
    overflow: visible !important;
}
.header_stories__track {
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 0 !important;
    overflow: visible !important;
    width: auto !important;
}
.header_story {
    flex-direction: column !important;
    width: 56px !important;
    padding: 0 !important;
    gap: 0 !important;
    position: relative;
}
.header_story__ring {
    width: 48px !important;
    height: 48px !important;
}
.header_story__face {
    width: 42px !important;
    height: 42px !important;
}
/* Подпись скрываем, показываем как tooltip */
.header_story__label {
    position: absolute !important;
    right: 100% !important;
    top: 50% !important;
    transform: translateY(-50%) translateX(-10px) !important;
    margin: 0 !important;
    padding: 6px 10px !important;
    background: rgba(24, 24, 24, 0.9) !important;
    color: #fff !important;
    font-size: 12px !important;
    border-radius: 6px !important;
    white-space: nowrap !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.18s, transform 0.18s !important;
}
.header_story:hover .header_story__label {
    opacity: 1 !important;
    transform: translateY(-50%) translateX(-4px) !important;
}
/* Скрываем chevron у скролла — он не нужен в вертикали */
.header_stories__chev { display: none !important; }

@media (max-width: 900px) {
    /* На мобильных скрываем — оставляем место под контент */
    .header_stories { display: none !important; }
}

@media (max-width: 720px) {
    :root { --side-gutter: 16px; }
}

/* ------------------------------------------------------------ */
/* 2. Типографика — убираем жирность кроме заголовков            */
/* ------------------------------------------------------------ */
body, p, li, span, div, a, input, textarea, select, label,
.hero_gallery__feature, .hero_gallery__price,
.header_float__cta, .header_float__phone, .header_story__label,
.header_nav a, .footer__cont_title, .footer__quest, .f_cont,
.calc_check__name, .calc_content__title, .calc_content__nav li span,
.etap__nav > li span, .etap__slide_title,
.sostav__accordion_title, .sostav__accordion_num,
.price__list_name, .price__list_time, .price__list_price,
.about_team__label, .uners_team__label,
.design__slide_name, .design__slide_cat, .design__slide_price,
.design_styles__btn, .design_styles__card_name, .design_styles__card_style, .design_styles__card_count,
.remont__col_head, .remont_steps__num, .remont_steps__title, .remont_steps__finish_text,
.in_placeholder, .in_err_text,
.tm_dop, .btn_main, .order_from_btn,
.form_personal, .nav_mobile__list li a {
    font-weight: 400 !important;
}

/* Заголовки оставляем чуть жирнее, но более «редакторски» */
.tm, h1, h2, h3, h4, h5, h6,
.hero_gallery__title {
    font-weight: 500 !important;
    letter-spacing: -0.01em;
}

/* Подзаголовки/мета — light */
.hero_gallery__price, .footer__quest, .in_placeholder,
.calc_check__name, .design_styles__card_meta {
    font-weight: 300 !important;
}

/* ------------------------------------------------------------ */
/* 3. Цвет акцента: терракот вместо фиолетового                  */
/* ------------------------------------------------------------ */

/* Кнопки */
.btn_main, .order_from_btn,
.header_slide .btn_main,
.header_slide .order_from_btn,
.calc_content_form .btn_main,
.calc_content_form .order_from_btn,
button.btn_main, button.order_from_btn,
a.btn_main {
    background: var(--accent) !important;
    color: #fff !important;
    border-radius: 4px !important;
    height: auto !important;
    padding: 16px 32px !important;
    letter-spacing: 0.02em !important;
}
.btn_main:hover, .order_from_btn:hover { background: var(--accent-hover) !important; }
.btn_main:active, .order_from_btn:active { background: var(--accent-active) !important; }

.btn_border {
    color: var(--text-soft) !important;
    border-color: var(--line) !important;
    background: transparent !important;
}
.btn_border:hover { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important; }

/* Лейблы/акцентные тексты */
.about_team__label,
.uners_team__label,
.design_styles__label,
.remont__label,
.remont_steps__label {
    color: var(--accent) !important;
}

/* Шапка плавающая */
.header_float__cta {
    background: var(--accent) !important;
    color: #fff !important;
}
.header_float__cta:hover { background: var(--accent-hover) !important; }

/* Stories */
.header_story__ring { background: linear-gradient(135deg, var(--accent), var(--accent-hover)) !important; }

/* Этапы — навигация */
.etap__nav > li span:before { background: var(--accent) !important; }
.etap__nav > li.swiper-pagination-bullet-active span { color: var(--accent) !important; }

/* Sostav accordion */
.sostav__accordion--showcase li.act .sostav__accordion_num {
    background: var(--accent) !important;
    color: #fff !important;
}

/* Calc steps */
.calc_content__nav li.act span { color: var(--accent) !important; }
.calc_content__nav li.act span:before { background: var(--accent) !important; }

/* doc_href icon */
.doc_href .st_red { fill: var(--accent) !important; }

/* Portfolio filter */
.design_styles__btn:hover { border-color: var(--accent) !important; color: var(--accent) !important; }
.design_styles__btn.act { background: var(--accent) !important; border-color: var(--accent) !important; color: #fff !important; }
.design_styles__card_style { color: var(--accent) !important; }
.design_styles__card:hover { box-shadow: 0 14px 32px var(--accent-shadow) !important; }

/* Remont compare */
.remont {
    background: linear-gradient(180deg, var(--accent-soft) 0%, #fff 100%) !important;
}
.remont__compare_title_em { color: var(--accent) !important; }

/* Remont steps */
.remont_steps__num { background: var(--accent-soft) !important; color: var(--accent) !important; }
.remont_steps__item:hover {
    box-shadow: 0 10px 24px var(--accent-shadow) !important;
    border-color: var(--accent-border) !important;
}
.remont_steps__finish { background: var(--accent) !important; }
.remont_steps__finish .btn_main {
    background: #fff !important;
    color: var(--accent) !important;
}
.remont_steps__finish .btn_main:hover {
    background: var(--accent-soft) !important;
    color: var(--accent-active) !important;
}

/* Hero gallery accent (price/CTA) — старая версия hero, на случай отката */
.hero_gallery__price {
    background: none !important;
    background-image: none !important;
    -webkit-background-clip: initial !important;
            background-clip: initial !important;
    -webkit-text-fill-color: var(--accent) !important;
    color: var(--accent) !important;
    animation: none !important;
}
.hero_gallery__title { color: var(--text) !important; }
.hero_gallery__feature {
    border-color: var(--accent-border) !important;
}
/* Скрыть фиолетовые PNG-иконки УТП и заменить на маленькую галочку перед текстом */
.hero_gallery__feature_ico {
    display: none !important;
}
.hero_gallery__feature::before {
    content: "";
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: var(--accent-soft) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23B85940' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>") center/14px no-repeat;
}
/* Старая фиолетовая кнопка hero — перекрашиваем в терракот */
.nh_btn {
    background: var(--accent) !important;
    color: #fff !important;
    box-shadow: 0 10px 25px var(--accent-shadow) !important;
}
.nh_btn:hover {
    background: var(--accent-hover) !important;
    color: #fff !important;
    box-shadow: 0 15px 30px var(--accent-shadow) !important;
}
.nh_btn::before,
.nh_btn::after {
    background: var(--accent-hover) !important;
}

/* FAQ accent */
.sostav__accordion_title i::before,
.sostav__accordion_title i::after {
    background: var(--accent) !important;
}

/* Inputs focus */
.in_style input:focus,
.in_style textarea:focus {
    border-color: var(--accent) !important;
}
.in_style input:focus + .in_placeholder { color: var(--accent) !important; }

/* Полностью скрываем все вхождения старого фиолетового
   через атрибутные селекторы — на случай если что-то осталось */
[style*="#592EE8" i] { background-color: var(--accent) !important; }

/* ------------------------------------------------------------ */
/* 4. Скрытие label-подзаголовков перед основными               */
/*    (типа "Наша команда" перед "Команда профессионалов...")    */
/* ------------------------------------------------------------ */
.about_team__label,
.uners_team__label,
.design_styles__label,
.remont__label,
.remont_steps__label {
    display: none !important;
}

/* Подзаголовки/субтайтлы оставляем — они несут смысл */

/* ------------------------------------------------------------ */
/* 5. Единая ритмика блоков — равные отступы                    */
/* ------------------------------------------------------------ */
.container_main .wmain > div,
.container_main .wmain > section {
    margin-top: 96px !important;
}
.container_main .wmain > div:first-child,
.container_main .wmain > section:first-child {
    margin-top: 0 !important;
}

/* Явно перекрываем margin-top на конкретных блоках */
.uners_team, .design, .design_styles, .inspiration,
.etap, .sostav_new, .about_team, .remont, .remont_steps,
.infortmation, .zahvat, .faq, .price, .calc {
    margin-top: 96px !important;
    margin-bottom: 0 !important;
}

@media (max-width: 720px) {
    .uners_team, .design, .design_styles, .inspiration,
    .etap, .sostav_new, .about_team, .remont, .remont_steps,
    .infortmation, .zahvat, .faq, .price, .calc {
        margin-top: 64px !important;
    }
}

/* ------------------------------------------------------------ */
/* 6. Заголовки .tm — единый стиль                              */
/* ------------------------------------------------------------ */
.tm {
    font-size: clamp(28px, 4vw, 44px) !important;
    line-height: 1.15 !important;
    color: var(--text) !important;
    margin: 0 0 28px !important;
}

/* Внутри блока с подзаголовком — заголовок чуть прижат */
.about_team__header h2.tm,
.design_styles__head h2.tm,
.remont__head h2.tm,
.remont_steps__head h2.tm {
    margin-bottom: 12px !important;
}

/* ------------------------------------------------------------ */
/* 7. Шрифт кнопок/линков — без жирной                          */
/* ------------------------------------------------------------ */
.header_float__phone,
.header_float__cta {
    font-weight: 400 !important;
    letter-spacing: 0.01em !important;
}

/* ------------------------------------------------------------ */
/* 8. PARALLAX — базовая разметка                               */
/* JS вешает transform: translate3d(0, var(--parallax-y), 0)    */
/* ------------------------------------------------------------ */
.parallax-img,
.parallax-block {
    will-change: transform;
    transition: transform 0.05s linear;
}

/* Reveal на скролле — лёгкая анимация подплытия + fade */
.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.8s cubic-bezier(0.2, 0.7, 0.2, 1),
                transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1 !important; transform: none !important; }
    .parallax-img, .parallax-block { transform: none !important; }
}

/* ============================================================
   HERO — новая секция
   ============================================================ */

/* Прячем старую (если вдруг где-то осталась в DOM) */
.hero_gallery,
.hero_gallery__columns,
.hero_gallery__overlay,
.hero_gallery__card,
.hero_gallery__contacts,
.hero_gallery__price,
.hero_gallery__features,
.hero_gallery__feature {
    display: none !important;
}

.nh_hero {
    position: relative;
    display: block;
    min-height: 100vh;
    width: 100%;
    overflow: hidden;
}

/* LEFT side — overlay поверх фото */
.nh_hero__left {
    position: relative;
    z-index: 3;
    padding: 140px var(--side-gutter) 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 100vh;
    box-sizing: border-box;
    /* Градиент-подложка для читаемости текста на фото */
    background: linear-gradient(90deg,
        rgba(255, 255, 255, 0.96) 0%,
        rgba(255, 255, 255, 0.92) 45%,
        rgba(255, 255, 255, 0.55) 70%,
        rgba(255, 255, 255, 0) 100%);
    max-width: 62%;
}
.nh_hero__left > * { max-width: 640px; }
.nh_hero__label {
    display: inline-block;
    align-self: flex-start;
    padding: 8px 16px;
    background: var(--accent-soft);
    color: var(--accent);
    border-radius: 999px;
    font-size: 13px;
    letter-spacing: 0.04em;
    margin-bottom: 28px;
    font-weight: 500;
}
.nh_hero__title {
    margin: 0 0 24px;
    font-size: clamp(32px, 3.4vw, 52px);
    line-height: 1.1;
    letter-spacing: -0.015em;
    color: var(--text);
    font-weight: 500;
}
.nh_hero__label { display: none !important; }
.nh_hero__sub {
    margin: 0 0 36px;
    font-size: 17px;
    line-height: 1.55;
    color: var(--text-soft);
    max-width: 560px;
}
.nh_hero__features {
    list-style: none;
    margin: 0 0 40px;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 28px;
}
.nh_hero__features li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 15px;
    line-height: 1.4;
    color: var(--text);
    font-weight: 400;
}
.nh_hero__check {
    flex-shrink: 0;
    margin-top: 2px;
    color: var(--accent);
}
.nh_hero__cta {
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
    margin-bottom: 56px;
}
.nh_hero__btn {
    /* наследует .btn_main */
    padding: 18px 36px !important;
    font-size: 15px !important;
    letter-spacing: 0.04em !important;
    text-transform: none !important;
}
.nh_hero__tg {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--text);
    text-decoration: none;
    font-size: 14px;
    border-bottom: 1px solid var(--text);
    padding-bottom: 2px;
    transition: color 0.2s, border-color 0.2s;
}
.nh_hero__tg:hover {
    color: var(--accent);
    border-color: var(--accent);
}
.nh_hero__bottom {
    border-top: 1px solid var(--line);
    padding-top: 28px;
}
.nh_hero__price {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.nh_hero__price_label {
    font-size: 13px;
    color: var(--text-soft);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.nh_hero__price_value {
    font-size: 32px;
    line-height: 1;
    color: var(--text);
    font-weight: 500;
}
.nh_hero__price_unit {
    font-size: 18px;
    color: var(--text-soft);
    margin-left: 4px;
}

/* RIGHT side — фото на всю секцию (фоном) */
.nh_hero__right {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: #efe9e3;
    overflow: hidden;
}
.nh_hero__slider {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border-radius: 0;
    overflow: hidden;
    box-shadow: none;
}
.nh_hero__slider_dots {
    position: absolute;
    right: 100px !important;       /* отодвигаем от sticky-stories */
    left: auto !important;
    bottom: 32px !important;
    z-index: 4;
}
.nh_hero__slide {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    opacity: 0;
    transform: scale(1.05);
    transition: opacity 1.2s cubic-bezier(0.2, 0.7, 0.2, 1),
                transform 6s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.nh_hero__slide.is-active {
    opacity: 1;
    transform: scale(1);
}
.nh_hero__slider_dots {
    position: absolute;
    left: 28px;
    bottom: 28px;
    display: flex;
    gap: 8px;
    z-index: 4;
}
.nh_hero__dot {
    appearance: none;
    width: 32px;
    height: 4px;
    border: none;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.45);
    cursor: pointer;
    padding: 0;
    transition: background 0.3s, width 0.3s;
}
.nh_hero__dot.is-active {
    background: #fff;
    width: 48px;
}
.nh_hero__dot:hover { background: rgba(255, 255, 255, 0.85); }

/* Mobile */
@media (max-width: 980px) {
    .nh_hero { min-height: auto; }
    .nh_hero__left {
        padding: 110px 22px 50px;
        max-width: 100%;
        min-height: 100vh;
        background: linear-gradient(180deg,
            rgba(255, 255, 255, 0.96) 0%,
            rgba(255, 255, 255, 0.85) 70%,
            rgba(255, 255, 255, 0.55) 100%);
    }
    .nh_hero__features {
        grid-template-columns: 1fr;
        gap: 12px;
        margin-bottom: 32px;
    }
    .nh_hero__cta {
        gap: 16px;
        margin-bottom: 40px;
    }
    .nh_hero__btn {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
    .nh_hero__price_value { font-size: 26px; }
}

@media (max-width: 480px) {
    .nh_hero__left {
        padding: 110px 18px 40px;
    }
    .nh_hero__title { font-size: 36px; }
    .nh_hero__sub { font-size: 15px; }
}
