/* ================================================================
   РолГрупп — Theme Dark (Architect Noir, Palette D)
   Подключается ПОСЛЕ style.css. Переопределяет светлую палитру
   на тёмную с золотым акцентом #C9A96E и serif-заголовками.
   ================================================================ */


/* ================================================================
   0. DESIGN TOKENS — единый источник правды
   ================================================================ */
:root {
    /* --- Palette D: Нуар и латунь --- */
    --bg:             #0D0D0D;
    --surface:        #161616;
    --elevated:       #1E1E1E;

    --gold:           #C9A96E;
    --gold-hover:     #B8975A;
    --gold-glow:      rgba(201,169,110,0.15);
    --gold-glow-md:   rgba(201,169,110,0.25);
    --gold-glow-lg:   rgba(201,169,110,0.35);
    --bronze:         #8C7A5C;

    --text:           #E8E4DD;
    --text-muted-d:   #8A8580;
    --text-dim:       #5A5550;

    /* Borders / Glass */
    --border-d:             rgba(201,169,110,0.08);
    --border-light-d:       rgba(255,255,255,0.04);
    --glass:                rgba(255,255,255,0.03);
    --glass-md:             rgba(255,255,255,0.05);
    --glass-border:         rgba(255,255,255,0.06);
    --glass-border-hover:   rgba(201,169,110,0.15);

    /* System */
    --error-d:    #E05C4D;
    --success-d:  #4DAE7B;
    --warning-d:  #D4A03E;

    /* Typography */
    --heading: 'Cormorant Garamond', serif;
    --body:    'General Sans', 'Plus Jakarta Sans', sans-serif;

    /* Spacing scale (4px grid) */
    --sp-xs:  4px;
    --sp-sm:  8px;
    --sp-md:  16px;
    --sp-lg:  24px;
    --sp-xl:  32px;
    --sp-2xl: 48px;
    --sp-3xl: 64px;

    /* Border radius */
    --r-sm:     6px;
    --r-md:     10px;
    --r-lg:     14px;
    --r-xl:     20px;
    --r-pill:   50px;
    --r-circle: 50%;

    /* Shadows (multi-layer) */
    --shadow-sm-d:    0 2px 8px rgba(0,0,0,0.2);
    --shadow-md-d:    0 8px 24px rgba(0,0,0,0.3);
    --shadow-lg-d:    0 16px 48px rgba(0,0,0,0.4);
    --shadow-gold:    0 4px 24px rgba(201,169,110,0.25);
    --shadow-gold-lg: 0 8px 40px rgba(201,169,110,0.35);

    /* Transitions */
    --ease-smooth:  cubic-bezier(0.16, 1, 0.3, 1);
    --t-fast:       150ms ease;
    --t-base:       300ms var(--ease-smooth);
    --t-slow:       500ms var(--ease-smooth);

    /* --- Override легаси-переменных из style.css --- */
    --accent:           var(--gold);
    --accent-hover:     var(--gold-hover);

    --text-primary:     var(--text);
    --text-secondary:   var(--text-muted-d);
    --text-muted:       var(--text-dim);
    --text-light:       var(--text-dim);

    --bg-primary:       var(--bg);
    --bg-secondary:     var(--surface);
    --bg-tertiary:      var(--elevated);
    --bg-dark:          #080808;
    --bg-dark-card:     var(--surface);
    --bg-hero:          var(--bg);
    --bg-callback:      var(--surface);

    --border:           var(--glass-border);
    --border-light:     var(--border-light-d);

    --white:            var(--text);

    --shadow-soft:      var(--shadow-sm-d);
    --shadow-medium:    var(--shadow-md-d);
    --shadow-stats:     var(--shadow-sm-d);
}


/* ================================================================
   1. ISOLATION LAYER — убиваем легаси типографики
   ================================================================ */

/* Убиваем uppercase везде */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
button, a, span, p, label, li, div {
    text-transform: none !important;
}

/* Заголовки — Cormorant Garamond 500, tracking tight */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    letter-spacing: -0.02em !important;
    color: var(--text);
}

/* Span внутри заголовков наследует serif */
h1 span, h2 span, h3 span, h4 span, h5 span, h6 span {
    font-family: inherit !important;
    font-weight: inherit !important;
    letter-spacing: inherit !important;
}

/* Body / UI: General Sans */
body, p, li, a, label, button, input, textarea, select {
    font-family: var(--body) !important;
}

/* Сброс капса у легаси .btn */
.btn {
    text-transform: none !important;
    font-family: var(--body) !important;
}


/* ================================================================
   2. BODY & BASE
   ================================================================ */
html {
    /* Резервируем место под вертикальный скроллбар, чтобы fixed-header
       не «сужался», когда скроллбар появляется при появлении длинного контента */
    scrollbar-gutter: stable;
}
body {
    background: var(--bg);
    color: var(--text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img { opacity: 0.95; }

/* Lucide-иконки — тонкий штрих (Architect Noir = quiet luxury, тонкие линии) */
.lucide,
svg.lucide,
[data-lucide] {
    stroke-width: 1.25;
}


/* ================================================================
   3. EYEBROW (тег над H2 секции)
   ================================================================ */
.eyebrow,
.section-tag {
    display: inline-block;
    color: var(--gold) !important;
    font-family: var(--body) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.25em !important;
    text-transform: uppercase !important;
    margin-bottom: 12px;
}


/* ================================================================
   4. HEADER — Premium Glass Pill (always fixed, always glass)
   ================================================================ */
.header,
.header.scrolled {
    position: fixed !important;
    top: 0; left: 0; right: 0;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: none !important;
    padding: 12px var(--sp-lg) !important;
    box-shadow: none !important;
    z-index: 100;
}

/* Удалить белый фон в .scrolled-состоянии (унаследовано из легаси) */
.header.scrolled .header__nav-link,
.header.scrolled .header__phone,
.header.scrolled .header__logo-name,
.header.scrolled .header__logo-text {
    color: var(--text) !important;
}
.header.scrolled .header__nav-link:hover,
.header.scrolled .header__phone:hover {
    color: var(--gold) !important;
}
.header.scrolled .header__burger span {
    background: var(--text) !important;
}
.header__nav-link + .header__nav-link::before {
    background: transparent !important;
}

.header__container,
.header__inner {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
    padding: 14px 40px !important;
    background: linear-gradient(135deg, rgba(22,22,22,0.55), rgba(13,13,13,0.65)) !important;
    backdrop-filter: blur(40px) saturate(1.6) !important;
    -webkit-backdrop-filter: blur(40px) saturate(1.6) !important;
    border: 1px solid var(--border-d) !important;
    border-bottom: 1px solid var(--border-light-d) !important;
    border-radius: var(--r-lg) !important;
    box-shadow:
        0 8px 32px rgba(0,0,0,0.3),
        inset 0 1px 0 rgba(255,255,255,0.04) !important;
    position: relative;
    overflow: visible !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 20px !important;
}

.header__container::before {
    content: '';
    position: absolute; inset: 0;
    border-radius: var(--r-lg);
    background: radial-gradient(ellipse 60% 100% at 20% 0%,
        rgba(201,169,110,0.05), transparent 50%);
    pointer-events: none;
    z-index: 0;
}
.header__container > * { position: relative; z-index: 1; }

.header__logo {
    display: flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}
.header__logo-text {
    font-family: var(--heading) !important;
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    color: var(--text) !important;
    letter-spacing: 0.01em !important;
    white-space: nowrap;
}
.header__logo-accent { color: var(--gold) !important; }

.header__nav {
    display: flex;
    align-items: center;
    gap: var(--sp-xs);
}
.header__nav a,
.header__nav-link {
    padding: 6px 14px !important;
    color: rgba(232,228,221,0.72) !important;
    font-size: 0.88rem !important;
    font-weight: 500 !important;
    border-radius: var(--r-sm) !important;
    transition: color 0.2s, background 0.2s;
    white-space: nowrap;
}
.header__nav a:hover,
.header__nav-link:hover {
    color: var(--gold) !important;
    background: rgba(201,169,110,0.07) !important;
}

.header__phone {
    color: var(--text) !important;
    font-family: var(--body) !important;
    font-weight: 600 !important;
}
.header__phone:hover { color: var(--gold) !important; }

.header__cta {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--bg) !important;
    font-family: var(--body) !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    border-radius: var(--r-pill) !important;
    box-shadow: var(--shadow-gold) !important;
    transition: all var(--t-base) !important;
    padding: 12px 24px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}
.header__cta:hover {
    background: var(--gold-hover) !important;
    border-color: var(--gold-hover) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold-lg) !important;
    transform: translateY(-1px);
}
.header__cta svg { stroke: var(--bg) !important; }

/* Бургер */
.header__burger span,
.burger span {
    background: var(--text) !important;
    transition: all var(--t-base) !important;
}
.header__burger:hover span,
.burger:hover span { background: var(--gold) !important; }


/* ================================================================
   5. HERO — Dark with eyebrow + serif H1 + gold accent
   ================================================================ */
.hero,
.lp-hero {
    background-color: var(--bg) !important;
    background-image: url('/assets/img/projects/2024/P536/prozrachnye_rolstavni_na_verandu_5.webp') !important;
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    color: var(--text) !important;
    position: relative;
    padding-top: 210px !important;
    padding-bottom: 48px !important;
}

/* Тёмный градиент-overlay поверх hero-картинки */
.lp-hero__overlay {
    background:
        linear-gradient(180deg,
            rgba(13,13,13,0.72) 0%,
            rgba(13,13,13,0.45) 25%,
            rgba(13,13,13,0.35) 50%,
            rgba(13,13,13,0.55) 75%,
            rgba(13,13,13,0.92) 100%
        ),
        linear-gradient(90deg,
            rgba(13,13,13,0.55) 0%,
            rgba(13,13,13,0.25) 45%,
            transparent 70%
        ) !important;
}

/* Eyebrow */
.hero__eyebrow,
.lp-hero__eyebrow {
    display: inline-block;
    color: var(--gold) !important;
    font-family: var(--body) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.25em !important;
    text-transform: uppercase !important;
    margin-bottom: 18px;
    text-shadow: 0 2px 12px rgba(201,169,110,0.3);
}

/* H1 */
.hero__title,
.hero h1,
.lp-hero__title,
.lp-hero h1 {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    color: var(--text) !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
    font-size: clamp(2.2rem, 4vw, 3.8rem) !important;
    line-height: 1.1 !important;
    text-shadow: 0 2px 20px rgba(0,0,0,0.6), 0 4px 40px rgba(0,0,0,0.4);
}

/* Gold accent in H1 */
.hero__title-accent,
.lp-hero__title-accent,
.lp-hero h1 .accent {
    color: var(--gold) !important;
    text-shadow: 0 2px 20px rgba(201,169,110,0.3);
}

/* Subtitle */
.hero__subtitle,
.hero p,
.lp-hero__subtitle,
.lp-hero p {
    color: rgba(232,228,221,0.85) !important;
    font-family: var(--body) !important;
    font-weight: 400;
    line-height: 1.6;
    text-shadow: 0 1px 10px rgba(0,0,0,0.6);
}

/* Hero anchor cards (3 преимущества снизу) */
.lp-hero__anchor {
    background: rgba(255,255,255,0.04) !important;
    backdrop-filter: blur(20px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(20px) saturate(1.4) !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: var(--r-lg) !important;
    transition: all var(--t-base);
}
.lp-hero__anchor:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-3px);
    box-shadow: var(--shadow-md-d), 0 0 30px rgba(201,169,110,0.06);
}
.lp-hero__anchor-value {
    color: var(--gold) !important;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    text-shadow: 0 2px 12px rgba(201,169,110,0.2);
}
.lp-hero__anchor-label {
    color: rgba(232,228,221,0.7) !important;
}

.lp-hero__facts {
    color: rgba(232,228,221,0.88) !important;
    text-shadow: 0 1px 8px rgba(0,0,0,0.6);
    font-size: 14px !important;
    font-weight: 500 !important;
}
.lp-hero__facts span { color: inherit !important; }

/* Hero CTA — gold + golden glow */
.lp-hero .btn-primary,
.lp-hero__cta,
.hero .btn-primary {
    background: var(--gold) !important;
    border: 1px solid var(--gold) !important;
    color: var(--bg) !important;
    font-family: var(--body) !important;
    font-weight: 600 !important;
    border-radius: var(--r-pill) !important;
    box-shadow: var(--shadow-gold) !important;
    transition: all var(--t-base) !important;
}
.lp-hero .btn-primary:hover,
.lp-hero__cta:hover,
.hero .btn-primary:hover {
    background: var(--gold-hover) !important;
    border-color: var(--gold-hover) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold-lg) !important;
    transform: translateY(-2px);
}

/* Кружок-стрелка внутри pill-кнопки — тёмный */
.lp-hero .btn-arrow,
.lp-hero__cta .btn-arrow,
.btn-primary .btn-arrow {
    background: var(--bg) !important;
    color: var(--gold) !important;
}
.lp-hero .btn-arrow::after,
.lp-hero__cta .btn-arrow::after,
.btn-primary .btn-arrow::after {
    color: var(--gold) !important;
}


/* ================================================================
   6. BUTTONS — global overrides (gold + dark text + golden glow)
   Кружок-стрелка убран, текст по центру, паддинги симметричные
   ================================================================ */

/* Убрать кружок-стрелку из всех кнопок */
.btn-arrow {
    display: none !important;
}

/* Primary CTA: gold pill, dark text */
.btn-primary {
    background-color: var(--gold) !important;
    color: var(--bg) !important;
    border: 1px solid var(--gold) !important;
    box-shadow: var(--shadow-gold) !important;
    transition: all var(--t-base) !important;
    gap: 8px !important;
    justify-content: center !important;
    padding: 13px 28px !important;
}
.btn-primary:hover {
    background-color: var(--gold-hover) !important;
    border-color: var(--gold-hover) !important;
    box-shadow: var(--shadow-gold-lg) !important;
    opacity: 1 !important;
    transform: translateY(-2px);
}

/* Secondary CTA: glass pill, light text */
.btn-secondary {
    background-color: rgba(255,255,255,0.04) !important;
    color: var(--text) !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    transition: all var(--t-base) !important;
    gap: 8px !important;
    justify-content: center !important;
    padding: 13px 28px !important;
}
.btn-secondary:hover {
    background-color: rgba(255,255,255,0.08) !important;
    border-color: var(--gold) !important;
    color: var(--gold) !important;
    opacity: 1 !important;
    transform: translateY(-2px);
}

/* Submit (квиз, форма): gold pill, текст по центру */
.btn-submit {
    background-color: var(--gold) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold) !important;
    transition: all var(--t-base) !important;
    justify-content: center !important;
    gap: 0 !important;
    padding: 16px 28px !important;
}
.btn-submit:hover {
    background-color: var(--gold-hover) !important;
    box-shadow: var(--shadow-gold-lg) !important;
    opacity: 1 !important;
}

/* Hero CTA — крупнее */
.lp-hero__cta,
.benefits__cta-btn {
    padding: 15px 34px !important;
}

/* Компактные кнопки в карточках */
.cases__mini-cta,
.cases__project-btn,
.proj-hero__cta {
    padding: 12px 24px !important;
}

/* Кнопки в actions каталога — растянуты на равную ширину, текст по центру */
.proj-catalog__actions .btn-primary,
.proj-catalog__actions .btn-installment {
    justify-content: center !important;
}


/* ================================================================
   7. FOOTER — Dark with gold accents
   ================================================================ */
.footer {
    background: #080808 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin-top: 0 !important;
    color: var(--text);
    padding: 80px 0 40px !important;
    position: relative;
    z-index: 2;
}
.footer::before { content: none !important; }

.footer__tag {
    color: var(--gold) !important;
    font-family: var(--body) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.25em !important;
    text-transform: uppercase !important;
    margin-bottom: 30px;
}

/* Contact cards — glass dark */
.footer__contact-card {
    background: var(--glass) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    transition: all var(--t-base);
}
.footer__contact-card:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-3px);
    box-shadow: var(--shadow-md-d), 0 0 30px rgba(201,169,110,0.05);
}
.footer__card-label {
    color: var(--bronze) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-size: 10px !important;
    font-weight: 600 !important;
}
.footer__card-value {
    color: var(--text) !important;
    font-family: var(--body) !important;
    font-weight: 600 !important;
}
a.footer__card-value:hover { color: var(--gold) !important; }
.footer__card-sub { color: var(--text-dim) !important; }

/* Logo */
.footer__logo {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 4px !important;
    text-decoration: none;
}
.footer__logo-name {
    font-family: var(--heading) !important;
    font-size: 1.4rem !important;
    font-weight: 600 !important;
    color: var(--text) !important;
    letter-spacing: 0.01em !important;
    text-transform: none !important;
}
.footer__logo-accent { color: var(--gold) !important; }
.footer__logo-sub {
    color: var(--text-dim) !important;
    font-size: 11px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
}

/* Nav columns */
.footer__nav-heading {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    font-size: 1.25rem !important;
    color: var(--text) !important;
    letter-spacing: -0.01em !important;
    border-bottom: 1px solid var(--border-light-d) !important;
    padding-bottom: 16px !important;
    margin-bottom: 24px !important;
}

.footer__nav-link {
    color: var(--text-muted-d) !important;
    font-family: var(--body) !important;
    transition: color var(--t-fast), letter-spacing var(--t-fast);
}
.footer__nav-link:hover {
    color: var(--gold) !important;
    letter-spacing: 0.01em;
}

/* Socials — warm off-white circles, original brand SVG icons (natural colors) */
.footer__social-icon,
.footer__messenger-icon {
    background: #ECE8E0 !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    transition: all var(--t-base) !important;
}
.footer__social-icon:hover,
.footer__messenger-icon:hover {
    background: #F6F3EC !important;
    border-color: var(--gold) !important;
    transform: translateY(-3px);
    box-shadow: 0 4px 18px rgba(201,169,110,0.22);
}
.footer__social-icon img,
.footer__messenger-icon img {
    filter: none !important;
    opacity: 1 !important;
}

/* Yandex rating — glass */
.footer__yandex {
    background: var(--glass) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-md) !important;
}
.footer__ya-logo {
    background: #FF0000 !important;
    color: #fff !important;
}
.footer__ya-score { color: var(--text) !important; }
.footer__ya-text { color: var(--text-muted-d) !important; }

/* Bottom bar + legal */
.footer__bottom,
.footer__legal {
    border-top-color: var(--border-light-d) !important;
    color: var(--text-dim) !important;
}
.footer__bottom p { color: var(--text-dim) !important; }
.footer__legal a {
    color: var(--text-muted-d) !important;
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.footer__legal a:hover {
    color: var(--gold) !important;
    border-bottom-color: var(--gold);
}


/* ================================================================
   8. STICKY PANEL — glass dark with gold accent item
   ================================================================ */
.sticky-panel__toggle {
    background: var(--gold) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold) !important;
    transition: all var(--t-base) !important;
}
.sticky-panel__toggle:hover {
    background: var(--gold-hover) !important;
    box-shadow: var(--shadow-gold-lg) !important;
}
.sticky-panel__toggle i,
.sticky-panel__toggle svg {
    color: var(--bg) !important;
    stroke: var(--bg) !important;
}

.sticky-panel__items {
    background: linear-gradient(135deg, rgba(22,22,22,0.85), rgba(13,13,13,0.92)) !important;
    backdrop-filter: blur(28px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(28px) saturate(1.4) !important;
    border: 1px solid var(--glass-border) !important;
    box-shadow:
        0 8px 32px rgba(0,0,0,0.4),
        inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

.sticky-panel__item {
    color: var(--text) !important;
    transition: background-color var(--t-fast), color var(--t-fast) !important;
}
.sticky-panel__item:hover {
    background: var(--glass-md) !important;
    color: var(--gold) !important;
}
.sticky-panel__item:hover .sticky-panel__icon i {
    color: var(--gold) !important;
}

.sticky-panel__icon i {
    color: var(--text) !important;
    stroke: var(--text) !important;
}

.sticky-panel__item--accent {
    background: var(--gold) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold) !important;
}
.sticky-panel__item--accent:hover {
    background: var(--gold-hover) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold-lg) !important;
}
.sticky-panel__item--accent .sticky-panel__icon i {
    color: var(--bg) !important;
    stroke: var(--bg) !important;
}
.sticky-panel__item--accent:hover .sticky-panel__icon i {
    color: var(--bg) !important;
    stroke: var(--bg) !important;
}


/* ================================================================
   9. POPUP — base + lead form
   ================================================================ */
.popup-overlay {
    background: rgba(0,0,0,0.75) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.popup {
    background: linear-gradient(135deg, rgba(30,30,30,0.95), rgba(13,13,13,0.98)) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    backdrop-filter: blur(24px) saturate(1.4);
    -webkit-backdrop-filter: blur(24px) saturate(1.4);
    box-shadow:
        var(--shadow-lg-d),
        inset 0 1px 0 rgba(255,255,255,0.04) !important;
    color: var(--text);
}

.popup-close {
    background: var(--glass) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-circle) !important;
    width: 36px !important;
    height: 36px !important;
    color: var(--text-muted-d) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all var(--t-fast) !important;
}
.popup-close:hover {
    color: var(--gold) !important;
    border-color: var(--gold) !important;
}

/* Popup-lead specific */
.popup-lead__title {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    color: var(--text) !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
}

.popup-lead__subtitle {
    color: var(--text-muted-d) !important;
}

.popup-lead__input {
    background: rgba(0,0,0,0.4) !important;
    border: 1px solid var(--glass-border) !important;
    color: var(--text) !important;
    transition: border-color var(--t-fast), box-shadow var(--t-fast) !important;
}
.popup-lead__input::placeholder {
    color: var(--text-dim) !important;
}
.popup-lead__input:focus {
    border-color: var(--gold) !important;
    box-shadow:
        0 0 0 3px rgba(201,169,110,0.1),
        0 0 20px rgba(201,169,110,0.06) !important;
    outline: none;
}

.popup-lead__consent {
    color: var(--text-muted-d) !important;
}
.popup-lead__consent input[type="checkbox"] {
    accent-color: var(--gold) !important;
}
.popup-lead__consent a {
    color: var(--text) !important;
    text-decoration: none !important;
    border-bottom: 1px solid var(--text-dim);
    transition: color var(--t-fast), border-color var(--t-fast);
}
.popup-lead__consent a:hover {
    color: var(--gold) !important;
    border-bottom-color: var(--gold);
}

.popup-lead__photo {
    position: relative;
}
.popup-lead__photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 60%, rgba(13,13,13,0.6) 100%);
    pointer-events: none;
}


/* ================================================================
   10. SECTION COMMONS — eyebrow tag, subtitle, section headers
   ================================================================ */

/* .tag = eyebrow gold over H2 */
.tag {
    color: var(--gold) !important;
    font-family: var(--body) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.25em !important;
    text-transform: uppercase !important;
    margin-bottom: 14px !important;
}

/* Subtitle under H2 */
.subtitle {
    color: var(--text-muted-d) !important;
    font-family: var(--body) !important;
    font-weight: 400 !important;
    line-height: 1.6;
}

.section__header h2 {
    color: var(--text) !important;
}

/* Section bg variants */
.section--light,
.section--alt {
    background: var(--surface) !important;
    color: var(--text) !important;
}
.section--dark {
    background: #080808 !important;
    color: var(--text) !important;
}


/* ================================================================
   11. OBJECTS — glass cards grid (рольставни для…)
   ================================================================ */
.objects {
    background: var(--bg) !important;
    color: var(--text);
    padding: 80px 0;
}

.objects .cases__mini,
.cases__mini {
    background: var(--glass) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    box-shadow: var(--shadow-sm-d) !important;
    transition: all var(--t-base) !important;
    overflow: hidden;
}
.objects .cases__mini:hover,
.cases__mini:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg-d), 0 0 40px rgba(201,169,110,0.06) !important;
}

/* Затемняющий overlay на фото для читаемости бейджа */
.cases__mini-photo {
    position: relative;
}
.cases__mini-photo::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(13,13,13,0.15) 0%, rgba(13,13,13,0) 30%, rgba(13,13,13,0) 70%, rgba(13,13,13,0.4) 100%);
    pointer-events: none;
}

/* Price badge — glass, светлый текст, тонкая серая рамка */
.objects__price-badge {
    background: linear-gradient(135deg, rgba(22,22,22,0.85), rgba(13,13,13,0.92)) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    color: rgba(232,228,221,0.88) !important;
    font-family: var(--body) !important;
    font-weight: 500 !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.35);
    z-index: 2;
}

/* Две кнопки в карточке объекта — в один ряд, первая чуть шире */
.cases__mini-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: auto 20px 20px;
    padding-top: 8px;
}
.cases__mini-actions .cases__mini-cta {
    margin: 0 !important;
    align-self: auto !important;
    width: auto !important;
    text-align: center;
    white-space: nowrap;
    padding: 12px 22px !important;
}
.cases__mini-actions .cases__mini-cta:first-child  { flex: 1.3 1 0; }
.cases__mini-actions .cases__mini-cta:last-child   { flex: 1 1 0; }

.cases__mini-title {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    font-size: 1.15rem !important;
    color: var(--text) !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
}
.cases__mini-desc {
    color: var(--text-muted-d) !important;
}
.cases__mini-price {
    color: var(--gold) !important;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
}

/* «Хочу в рассрочку» вторичная кнопка — dark glass с золотой рамкой */
.btn-installment {
    background: var(--glass-md) !important;
    color: var(--gold) !important;
    border: 1px solid var(--gold) !important;
    border-radius: var(--r-pill) !important;
    font-family: var(--body) !important;
    font-weight: 600 !important;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 12px 24px;
    transition: all var(--t-base) !important;
}
.btn-installment:hover {
    background: var(--gold) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold) !important;
    transform: translateY(-2px);
}

/* Кнопка в проектной карточке (style.css ставит space-between под скрытую стрелку) */
.proj-info__actions .btn-installment {
    justify-content: center !important;
    padding: 13px 28px !important;
}


/* ================================================================
   12. QUIZ — calculator (5 шагов + финал)
   ================================================================ */
.quiz.section--alt {
    background: var(--surface) !important;
}

.quiz__card {
    background: linear-gradient(135deg, rgba(30,30,30,0.6), rgba(13,13,13,0.85)) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    box-shadow:
        var(--shadow-md-d),
        inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

.quiz__step h3 {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    color: var(--text) !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
}

/* Progress bar dots */
.quiz-progress__dot {
    background: rgba(255,255,255,0.06) !important;
}
.quiz-progress__dot.current {
    background: var(--gold) !important;
    box-shadow: 0 0 12px rgba(201,169,110,0.5);
}
.quiz-progress__dot.done {
    background: var(--gold-hover) !important;
}

/* Photo option cards (steps 1, 4) */
.quiz__photo-option {
    background: var(--glass) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-lg) !important;
    transition: all var(--t-base) !important;
    overflow: hidden;
}
.quiz__photo-option:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-3px);
    box-shadow: var(--shadow-md-d), 0 0 24px rgba(201,169,110,0.06);
}
.quiz__photo-option.selected {
    border-color: var(--gold) !important;
    background: rgba(201,169,110,0.05) !important;
    box-shadow:
        0 0 0 2px var(--gold),
        var(--shadow-md-d),
        0 0 32px rgba(201,169,110,0.15) !important;
}
.quiz__photo-option span {
    color: var(--text) !important;
    background: transparent;
}

/* List option buttons (steps 2, 3, 5) */
.quiz-option {
    background: var(--glass) !important;
    border: 1px solid var(--glass-border) !important;
    color: var(--text) !important;
    border-radius: var(--r-md) !important;
    font-family: var(--body) !important;
    font-weight: 400 !important;
    transition: all var(--t-fast) !important;
}
/* Photo-option labels — без жирного */
.quiz__photo-option span {
    font-weight: 400 !important;
}
.quiz-option:hover {
    border-color: var(--glass-border-hover) !important;
    color: var(--gold) !important;
    background: var(--glass-md) !important;
}
.quiz-option.selected {
    border-color: var(--gold) !important;
    background: var(--gold) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold) !important;
}

/* Split-photo (steps 2, 3, 5) */
.quiz__split-photo {
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-lg) !important;
}

/* Final step summary */
.quiz__final-summary h4 {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    color: var(--text) !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
}
.quiz__summary-list {
    color: var(--text-muted-d) !important;
}
.quiz__summary-list p::before {
    color: var(--gold) !important;
}
.quiz__micro {
    color: var(--text-dim) !important;
}

/* Quiz form inputs (final step) */
.quiz__final input[type="text"],
.quiz__final input[type="tel"] {
    background: rgba(0,0,0,0.4) !important;
    border: 1px solid var(--glass-border) !important;
    color: var(--text) !important;
}
.quiz__final input:focus {
    border-color: var(--gold) !important;
    box-shadow: 0 0 0 3px rgba(201,169,110,0.1), 0 0 20px rgba(201,169,110,0.06) !important;
    outline: none;
}
.quiz__final input::placeholder { color: var(--text-dim) !important; }

/* Nav back/next */
.quiz__nav .btn-secondary {
    background: var(--glass) !important;
    border: 1px solid var(--glass-border) !important;
    color: var(--text) !important;
}
.quiz__nav .btn-secondary:hover {
    border-color: var(--gold) !important;
    color: var(--gold) !important;
}


/* ================================================================
   13. SEASONS — 4 glass cards + side image
   ================================================================ */
.seasons.section--alt {
    background: var(--surface) !important;
}
.seasons__heading {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    font-size: clamp(1.8rem, 3.2vw, 2.6rem) !important;
    color: var(--text) !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
    text-align: left !important;
    margin: 0 0 40px !important;
    max-width: 900px;
}
.seasons__card {
    background: var(--glass) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    transition: all var(--t-base) !important;
}
.seasons__card:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg-d), 0 0 40px rgba(201,169,110,0.06);
}
.seasons__icon {
    color: var(--gold) !important;
}
.seasons__icon i,
.seasons__icon svg {
    color: var(--gold) !important;
    stroke: var(--gold) !important;
}
.seasons__title {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    color: var(--text) !important;
    letter-spacing: -0.01em !important;
}
.seasons__list li {
    color: var(--text-muted-d) !important;
}
.seasons__image {
    border: 1px solid var(--glass-border);
}


/* ================================================================
   13b. ACCORDION BLOCK — полоска, раскрывающая целый экран
   ================================================================ */
/* Единый тёмный фон у всех аккордеон-секций — как у блока «Рассрочка» и футера.
   Двух-классовые селекторы перебивают .seasons.section--alt / .reviews.section--alt и т.п. */
.accordion-block,
.accordion-block.section--alt,
.seasons.accordion-block,
.reviews.accordion-block,
.company.accordion-block,
.benefits.accordion-block,
.cases.accordion-block,
.video-block.accordion-block {
    padding: 10px 0 !important;   /* отступ внутри секции — не вылезает margin'ом наружу */
    background: #080808 !important;
}
.accordion-block > .container {
    padding-top: 0;
    padding-bottom: 0;
}

/* Полоска-бар — тёмный градиент + лёгкое золотое свечение справа,
   чтобы не выглядела «пустой» */
.accordion-block__bar {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 26px 32px;
    margin: 0;
    background:
        radial-gradient(ellipse 50% 120% at 100% 50%, rgba(201,169,110,0.07), transparent 60%),
        linear-gradient(135deg, rgba(30,30,30,0.55) 0%, rgba(18,18,18,0.85) 60%, rgba(13,13,13,0.95) 100%) !important;
    border: 1px solid rgba(255,255,255,0.06) !important;
    border-radius: var(--r-lg);
    cursor: pointer;
    text-align: left;
    font-family: var(--body);
    transition: border-color var(--t-base), box-shadow var(--t-base), background var(--t-base);
    position: relative;
    overflow: hidden;
}
/* Внутренний highlight сверху — добавляет глубину */
.accordion-block__bar::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.06) 50%, transparent 100%);
    pointer-events: none;
}
.accordion-block__bar > * { position: relative; z-index: 1; }

.accordion-block__bar:hover {
    border-color: var(--glass-border-hover) !important;
    background:
        radial-gradient(ellipse 60% 120% at 100% 50%, rgba(201,169,110,0.12), transparent 60%),
        linear-gradient(135deg, rgba(36,36,36,0.6) 0%, rgba(22,22,22,0.9) 60%, rgba(14,14,14,0.95) 100%) !important;
    box-shadow: 0 0 28px rgba(201,169,110,0.05);
}
.accordion-block.open .accordion-block__bar {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-color: var(--glass-border-hover) !important;
    background:
        radial-gradient(ellipse 55% 120% at 100% 50%, rgba(201,169,110,0.1), transparent 60%),
        linear-gradient(135deg, rgba(34,34,34,0.6) 0%, rgba(20,20,20,0.9) 60%, rgba(13,13,13,0.95) 100%) !important;
}
.accordion-block__bar-title {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    font-size: clamp(1.3rem, 2.2vw, 1.9rem) !important;
    color: var(--text) !important;
    letter-spacing: -0.01em !important;
}
.accordion-block__bar-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px 22px;
    min-width: 230px;   /* единая ширина по самой длинной надписи «скрыть подробности» */
    color: var(--gold) !important;
    font-family: var(--body) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    white-space: nowrap;
    flex-shrink: 0;
    border: 1px solid var(--gold);
    border-radius: var(--r-pill);
    background: transparent;
    transition: background var(--t-base), color var(--t-base), box-shadow var(--t-base);
}
.accordion-block__bar:hover .accordion-block__bar-toggle {
    background: var(--gold);
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold);
}
.accordion-block.open .accordion-block__bar-toggle {
    background: rgba(201,169,110,0.08);
}
.accordion-block.open .accordion-block__bar:hover .accordion-block__bar-toggle {
    background: var(--gold);
    color: var(--bg) !important;
}
.accordion-block__bar-arrow {
    transition: transform var(--t-base);
    flex-shrink: 0;
}
.accordion-block.open .accordion-block__bar-arrow {
    transform: rotate(90deg);
}

/* Раскрывающаяся панель — плавная высота через grid-template-rows */
.accordion-block__panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 550ms var(--ease-smooth);
}
.accordion-block.open .accordion-block__panel {
    grid-template-rows: 1fr;
}
.accordion-block__panel-inner {
    overflow: hidden;
    min-height: 0;
}
.accordion-block.open .accordion-block__panel-inner {
    padding: 48px 0 80px;
}
@media (max-width: 768px) {
    .accordion-block__bar { padding: 18px 20px; gap: 12px; }
    .accordion-block.open .accordion-block__panel-inner { padding: 28px 0 48px; }
    .accordion-block__bar-title {
        font-size: clamp(1.1rem, 4vw, 1.4rem) !important;
    }
}

/* Мобильная унификация: у всех аккордеонов в кнопке-тоггле одинаковый
   короткий текст «Подробнее» / «Скрыть» (через CSS-псевдоэлемент). */
@media (max-width: 900px) {
    .accordion-block__bar-toggle-text { display: none !important; }
    .accordion-block__bar-toggle {
        min-width: auto !important;
        padding: 8px 14px !important;
        font-size: 12px !important;
        gap: 6px !important;
    }
    .accordion-block__bar-toggle::before {
        content: 'Подробнее';
        line-height: 1;
    }
    .accordion-block.open .accordion-block__bar-toggle::before {
        content: 'Скрыть';
    }
    .accordion-block__bar-arrow {
        width: 16px !important;
        height: 16px !important;
    }
}

/* CTA-блок в конце аккордеона: заголовок + сабтекст + кнопка */
.accordion-cta {
    margin: 64px auto 0;
    max-width: 760px;
    padding: 48px 48px;
    text-align: center;
    background:
        radial-gradient(ellipse 80% 100% at 50% 0%, rgba(201,169,110,0.08), transparent 60%),
        linear-gradient(135deg, rgba(30,30,30,0.75), rgba(13,13,13,0.95)) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl);
    position: relative;
    overflow: hidden;
}
.accordion-cta::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent 0%, rgba(201,169,110,0.3) 50%, transparent 100%);
    pointer-events: none;
}
.accordion-cta__title {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    font-size: clamp(1.5rem, 2.8vw, 2.1rem) !important;
    color: var(--text) !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
    margin: 0 0 16px;
    line-height: 1.2;
}
.accordion-cta__title span {
    color: var(--gold) !important;
    text-shadow: 0 2px 16px rgba(201,169,110,0.25);
}
.accordion-cta__sub {
    color: var(--text-muted-d) !important;
    font-family: var(--body) !important;
    font-size: 15px;
    line-height: 1.6;
    margin: 0 auto 32px;
    max-width: 560px;
}
.accordion-cta__btn {
    padding: 16px 40px !important;
    font-size: 15px !important;
}
@media (max-width: 768px) {
    .accordion-cta { padding: 32px 24px; margin-top: 40px; }
    .accordion-cta__sub { margin-bottom: 24px; }
}

/* Модификатор: широкая CTA-плашка с встроенной формой (имя + телефон + кнопка + согласие) */
.accordion-cta--form {
    max-width: none;
    margin: 56px 0 0;
    padding: 48px 56px;
    text-align: left;
}
.accordion-cta--form .accordion-cta__title,
.accordion-cta--form .accordion-cta__sub {
    text-align: left;
    margin-left: 0;
    margin-right: 0;
}
.accordion-cta--form .accordion-cta__sub {
    max-width: 760px;
    margin-bottom: 28px;
}

.accordion-cta__form {
    display: grid;
    grid-template-columns: 260px 300px auto;
    gap: 12px;
    align-items: stretch;
    max-width: 920px;
}
.accordion-cta__field { display: flex; }
.accordion-cta__field input {
    width: 100%;
    padding: 16px 22px;
    background: rgba(0,0,0,0.4) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-md) !important;
    color: var(--text) !important;
    font-family: var(--body) !important;
    font-size: 15px;
    outline: none;
    transition: border-color var(--t-fast), box-shadow var(--t-fast);
}
.accordion-cta__field input::placeholder { color: var(--text-dim) !important; }
.accordion-cta__field input:focus {
    border-color: var(--gold) !important;
    box-shadow: 0 0 0 3px rgba(201,169,110,0.1), 0 0 20px rgba(201,169,110,0.06) !important;
}
.accordion-cta__field input.input--error { border-color: var(--error-d) !important; }

.accordion-cta__submit {
    font-size: 15px !important;
    white-space: nowrap;
}

.accordion-cta__consent {
    grid-column: 1 / -1;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 16px;
    cursor: pointer;
    font-family: var(--body) !important;
    font-size: 13px;
    color: var(--text-muted-d) !important;
    line-height: 1.5;
}
.accordion-cta__consent input[type="checkbox"] {
    margin-top: 2px;
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    accent-color: var(--gold);
    cursor: pointer;
}
.accordion-cta__consent.input--error span { color: var(--error-d) !important; }
.accordion-cta__consent a {
    color: var(--text) !important;
    text-decoration: none;
    border-bottom: 1px solid var(--text-dim);
    transition: color var(--t-fast), border-color var(--t-fast);
}
.accordion-cta__consent a:hover {
    color: var(--gold) !important;
    border-bottom-color: var(--gold);
}

@media (max-width: 900px) {
    .accordion-cta--form { padding: 36px 28px; }
    .accordion-cta__form { grid-template-columns: 1fr; }
    .accordion-cta__submit { width: 100%; justify-content: center; }
}

/* ================================================================
   13c. VIDEO BLOCK — 4 карточки «фото + play», открывают #videoPopup
   ================================================================ */
.video-block__intro {
    max-width: 900px;
    margin: 0 0 40px;
}
.video-block__heading {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    font-size: clamp(1.8rem, 3.2vw, 2.6rem) !important;
    color: var(--text) !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
    text-align: left;
    margin: 0 0 18px;
}
.video-block__lead {
    color: var(--text-muted-d) !important;
    font-family: var(--body) !important;
    font-size: 16px;
    line-height: 1.65;
    margin: 0;
}

.video-block__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
.video-card {
    position: relative;
    aspect-ratio: 4 / 5;
    border-radius: var(--r-xl);
    overflow: hidden;
    border: 1px solid var(--glass-border);
    cursor: pointer;
    transition: border-color var(--t-base), transform var(--t-base), box-shadow var(--t-base);
}
.video-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--t-slow);
}
.video-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(13,13,13,0) 0%, rgba(13,13,13,0) 55%, rgba(13,13,13,0.55) 100%);
    pointer-events: none;
}
.video-card:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg-d), 0 0 40px rgba(201,169,110,0.08);
}
.video-card:hover img {
    transform: scale(1.05);
}
.video-card .play-btn {
    width: 72px;
    height: 72px;
    z-index: 2;
    transition: all var(--t-base);
}
.video-card:hover .play-btn {
    transform: translate(-50%, -50%) scale(1.08);
}

@media (max-width: 1024px) {
    .video-block__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
    .video-block__grid { grid-template-columns: 1fr; gap: 16px; }
    .video-card { aspect-ratio: 16 / 10; }
    .video-card .play-btn { width: 60px; height: 60px; }
}


/* Плашка «500+ проектов» под кейсами — целиком кликабельная, ведёт на /projects/ */
.cases__all-link {
    display: flex;
    align-items: center;
    gap: 32px;
    margin-top: 40px;
    padding: 28px 36px;
    background: linear-gradient(135deg, rgba(30,30,30,0.7), rgba(13,13,13,0.92)) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl);
    text-decoration: none;
    color: var(--text);
    transition: all var(--t-base);
}
.cases__all-link:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-3px);
    box-shadow: var(--shadow-md-d), 0 0 40px rgba(201,169,110,0.08);
}
.cases__all-link:hover .cases__all-btn {
    background-color: rgba(255,255,255,0.08) !important;
    border-color: var(--gold) !important;
    color: var(--gold) !important;
}

.cases__all-num {
    flex-shrink: 0;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
    font-size: clamp(2.6rem, 4.5vw, 4rem);
    line-height: 1;
    color: var(--gold) !important;
    letter-spacing: -0.03em !important;
    text-shadow: 0 2px 24px rgba(201,169,110,0.25);
}

.cases__all-text {
    flex: 0 1 auto;
    max-width: 460px;
    color: var(--text-muted-d) !important;
    font-family: var(--body) !important;
    font-size: 15px;
    line-height: 1.55;
    margin: 0;
}

/* Кнопка плашки — золотая, чуть шире */
.cases__all-btn {
    flex-shrink: 0;
    white-space: nowrap;
    margin-left: auto;
    padding: 14px 36px !important;
    background-color: var(--gold) !important;
    color: var(--bg) !important;
    border: 1px solid var(--gold) !important;
    box-shadow: var(--shadow-gold) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transition: all var(--t-base) !important;
}
.cases__all-link:hover .cases__all-btn {
    background-color: var(--gold-hover) !important;
    border-color: var(--gold-hover) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold-lg) !important;
}

@media (max-width: 900px) {
    .cases__all-link {
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
        padding: 24px 24px;
        text-align: left;
    }
    .cases__all-num { font-size: clamp(2.4rem, 8vw, 3.4rem); }
    .cases__all-btn {
        align-self: stretch;
        justify-content: center;
    }
}


/* ================================================================
   14. COMPANY — tabs + videos + stats
   ================================================================ */
.company__tabs {
    border-bottom: 1px solid var(--border-light-d) !important;
}
.company__tab {
    color: var(--text-muted-d) !important;
    font-family: var(--body) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-size: 13px !important;
}
.company__tab:hover {
    color: var(--text) !important;
}
.company__tab.active {
    color: var(--gold) !important;
}
.company__tab.active::after {
    background: var(--gold) !important;
    box-shadow: 0 0 12px rgba(201,169,110,0.4);
}

.company__video-card {
    border: 1px solid var(--glass-border) !important;
    box-shadow: var(--shadow-md-d) !important;
}
.company__video-card.active {
    border-color: var(--glass-border-hover) !important;
    box-shadow: var(--shadow-lg-d), 0 0 40px rgba(201,169,110,0.08) !important;
}

.company__stat-number {
    color: var(--gold) !important;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
    text-shadow: 0 2px 16px rgba(201,169,110,0.2);
}
.company__stat-label {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    letter-spacing: -0.01em !important;
}
.company__stat-desc {
    color: var(--text-muted-d) !important;
}

/* Play button — золотой круг, тёмный треугольник внутри */
.play-btn {
    background: var(--gold) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold), 0 8px 28px rgba(0,0,0,0.4) !important;
}
.play-btn:hover {
    background: var(--gold-hover) !important;
    box-shadow: var(--shadow-gold-lg), 0 8px 28px rgba(0,0,0,0.4) !important;
}
.play-btn::after {
    border-color: transparent transparent transparent var(--bg) !important;
}
/* Если внутри Lucide-иконка play (proj-gallery) — тоже тёмная */
.play-btn i,
.play-btn svg {
    color: var(--bg) !important;
    stroke: var(--bg) !important;
}


/* ================================================================
   15. INSTALLMENT — dark callback card style
   ================================================================ */
.installment {
    background: #080808 !important;
    position: relative;
}
.installment__h2-accent {
    color: var(--gold) !important;
}
.installment::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 25% 50%, rgba(201,169,110,0.06) 0%, transparent 50%);
    pointer-events: none;
}
.installment > * { position: relative; z-index: 1; }

.installment__card {
    background: linear-gradient(135deg, rgba(30,30,30,0.7), rgba(13,13,13,0.92)) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    box-shadow:
        var(--shadow-lg-d),
        inset 0 1px 0 rgba(255,255,255,0.04) !important;
}

.installment__form-side h3 {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    color: var(--text) !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
}
.installment__form-sub {
    color: var(--text-muted-d) !important;
}
.installment__micro {
    color: var(--text-dim) !important;
}

.installment__example {
    background: var(--glass-md) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-lg) !important;
}
.installment__example-label {
    color: var(--gold) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
    font-size: 11px !important;
    font-weight: 600 !important;
}
.installment__example-calc {
    color: var(--text) !important;
    font-family: var(--body) !important;
}
.installment__example-calc strong {
    color: var(--gold) !important;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
}

.installment__text {
    color: var(--text-muted-d) !important;
}


/* ================================================================
   16. REVIEWS — slider + B2B logos
   ================================================================ */
.reviews__card {
    background: var(--glass) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    box-shadow: var(--shadow-sm-d) !important;
    transition: all var(--t-base);
}
.reviews__card:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-3px);
    box-shadow: var(--shadow-md-d), 0 0 30px rgba(201,169,110,0.05) !important;
}
.reviews__stars {
    color: var(--gold) !important;
}
.reviews__text {
    color: var(--text-muted-d) !important;
    font-style: italic;
}
.reviews__author {
    color: var(--text) !important;
    font-family: var(--body) !important;
    font-weight: 600 !important;
}

.reviews__b2b-title {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    text-transform: none !important;
}
/* B2B-логотипы — на светлых «чипах», бренды в натуральных цветах (узнаваемы) */
.reviews__logos {
    gap: 14px 16px !important;
}
.reviews__logo {
    width: 132px !important;
    height: 56px !important;
    background: #EDE9E1 !important;
    border: 1px solid rgba(255,255,255,0.08) !important;
    border-radius: var(--r-md) !important;
    padding: 10px 16px !important;
    object-fit: contain !important;
    filter: none !important;
    opacity: 0.88;
    transition: all var(--t-base);
}
.reviews__logo:hover {
    opacity: 1;
    border-color: var(--gold) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(201,169,110,0.18);
}

/* Reviews nav arrow circles */
.btn-arrow-circle {
    background: var(--glass) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-circle) !important;
    color: var(--text) !important;
    transition: all var(--t-fast) !important;
}
.btn-arrow-circle:hover {
    border-color: var(--gold) !important;
    color: var(--gold) !important;
    background: var(--glass-md) !important;
}
.btn-arrow-circle svg {
    stroke: currentColor !important;
}


/* ================================================================
   17. BENEFITS — 6 glass cards + side image
   ================================================================ */
.benefits {
    background:
        radial-gradient(ellipse at 80% 40%, rgba(201,169,110,0.04) 0%, transparent 55%),
        var(--bg) !important;
    color: var(--text) !important;
}
.benefits__card {
    background: var(--glass) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    transition: all var(--t-base);
}
.benefits__card:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-6px);
    box-shadow: var(--shadow-md-d), 0 0 40px rgba(201,169,110,0.06);
}
.benefits__icon {
    color: var(--gold) !important;
}
.benefits__icon i,
.benefits__icon svg {
    color: var(--gold) !important;
    stroke: var(--gold) !important;
}
.benefits__text {
    color: var(--text) !important;
    font-family: var(--body) !important;
    font-weight: 500 !important;
}
.benefits__image {
    border: 1px solid var(--glass-border);
}
.benefits__cta-text {
    color: var(--text-muted-d) !important;
}

/* Intro: H2 + lead перед буллитами */
.benefits__intro {
    max-width: 900px;
    margin: 0 0 40px;
}
.benefits__heading {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    font-size: clamp(1.8rem, 3.2vw, 2.6rem) !important;
    color: var(--text) !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
    text-align: left;
    margin: 0 0 18px;
}
.benefits__lead {
    color: var(--text-muted-d) !important;
    font-family: var(--body) !important;
    font-size: 16px;
    line-height: 1.65;
    margin: 0;
}


/* ================================================================
   18. MEASUREMENT — 4 numbered cards + photo (используется в landing)
   ================================================================ */
.measurement__card {
    background: var(--glass) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    box-shadow: var(--shadow-sm-d) !important;
    transition: all var(--t-base) !important;
}
.measurement__card:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-6px);
    box-shadow: var(--shadow-md-d), 0 0 40px rgba(201,169,110,0.06) !important;
}
.measurement__num {
    background: var(--gold) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold);
}


/* ================================================================
   19. POPUP COMPARISON — таблица «Мягкие окна vs Рольставни»
   ================================================================ */
.popup-comparison__title {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    color: var(--text) !important;
    letter-spacing: -0.02em !important;
}

.popup-comparison__table th,
.popup-comparison__table td {
    border-bottom-color: var(--border-light-d) !important;
    color: var(--text-muted-d) !important;
}
.popup-comparison__table th {
    background: var(--glass-md) !important;
    color: var(--text) !important;
    font-family: var(--body) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
}
.popup-comparison__col-bad {
    color: var(--text-dim) !important;
}
.popup-comparison__col-good {
    color: var(--gold) !important;
    font-weight: 600 !important;
}
.popup-comparison__table td:first-child {
    color: var(--text) !important;
    font-weight: 600 !important;
}

.popup-comparison__form {
    background: var(--glass-md) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-lg) !important;
}
.popup-comparison__form h4 {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    color: var(--text) !important;
}


/* ================================================================
   20. POPUP QUIZ — wrapper inherits popup styles
   ================================================================ */
.popup-quiz .quiz__card {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}


/* ================================================================
   21. MOBILE MENU (slide-in справа, для всех viewport'ов)
   ================================================================ */
.header__mobile-menu {
    top: 0 !important;
    left: auto !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 380px !important;
    max-width: 100vw !important;
    padding: 64px 28px 28px !important;
    background: rgba(13,13,13,0.97) !important;
    backdrop-filter: blur(28px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(28px) saturate(1.4) !important;
    border-left: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) 0 0 var(--r-xl) !important;
    box-shadow: -20px 0 60px rgba(0,0,0,0.6) !important;
    color: var(--text);
    z-index: 1100;
}

/* Backdrop затемнение */
.header__mobile-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: 1099;
}
.header__mobile-overlay.active {
    display: block;
}

/* Крестик закрытия */
.header__mobile-close {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 38px;
    height: 38px;
    border-radius: var(--r-circle);
    background: var(--glass);
    border: 1px solid var(--glass-border);
    color: var(--text-muted-d);
    font-size: 24px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    z-index: 1;
    transition: border-color var(--t-fast), color var(--t-fast), background var(--t-fast);
}
.header__mobile-close:hover {
    border-color: var(--gold);
    color: var(--gold);
    background: var(--glass-md);
}
.header__mobile-link {
    color: var(--text) !important;
    border-bottom: 1px solid var(--border-light-d) !important;
    padding: 16px 0 !important;
    transition: color var(--t-fast);
}
.header__mobile-link:hover {
    color: var(--gold) !important;
}
.header__mobile-phone {
    color: var(--text) !important;
    font-family: var(--body) !important;
    font-weight: 600 !important;
}
.header__mobile-phone:hover {
    color: var(--gold) !important;
}
.header__mobile-phone i {
    color: var(--gold) !important;
    stroke: var(--gold) !important;
}


/* ================================================================
   22. CONTROLS / CUSTOMIZATION (если используется в других страницах)
   ================================================================ */
.controls__card,
.customization__card,
.cases__big {
    background: var(--glass) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    transition: all var(--t-base);
}
.controls__card:hover,
.customization__card:hover,
.cases__big:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg-d), 0 0 40px rgba(201,169,110,0.06);
}


/* ================================================================
   23. PROJECTS CATALOG (/projects/)
   ================================================================ */
.proj-catalog-hero {
    background: var(--bg) !important;
    border-bottom: 1px solid var(--border-light-d) !important;
    padding-top: 120px !important;
}
.proj-catalog-hero__content h1 {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
}
.proj-catalog-stat__value {
    color: var(--gold) !important;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
    text-shadow: 0 2px 12px rgba(201,169,110,0.2);
}
.proj-catalog-stat__label {
    color: var(--text-muted-d) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-size: 11px !important;
}

.proj-catalog-grid-section {
    background: var(--surface) !important;
}

/* Filters — pill chips */
.proj-filter-btn {
    background: var(--glass) !important;
    border: 1.5px solid var(--glass-border) !important;
    color: var(--text-muted-d) !important;
    border-radius: var(--r-pill) !important;
    font-family: var(--body) !important;
    transition: all var(--t-fast) !important;
}
.proj-filter-btn:hover {
    border-color: var(--gold) !important;
    color: var(--gold) !important;
    background: var(--glass-md) !important;
}
.proj-filter-btn.active {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold) !important;
}

/* Catalog cards */
.proj-catalog__grid .cases__project,
.cases__project {
    background: var(--glass) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    box-shadow: var(--shadow-sm-d) !important;
    overflow: hidden;
    transition: all var(--t-base) !important;
}
.proj-catalog__grid .cases__project:hover,
.cases__project:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-6px) !important;
    box-shadow: var(--shadow-lg-d), 0 0 40px rgba(201,169,110,0.06) !important;
}

.cases__project-content h3 {
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    color: var(--text) !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
}
.cases__project-city {
    color: var(--text-muted-d) !important;
}
.cases__project-specs li {
    background: var(--glass-md) !important;
    color: var(--text-muted-d) !important;
    border: 1px solid var(--glass-border);
}

.proj-catalog__type-tag {
    color: var(--gold) !important;
    background: rgba(201,169,110,0.08) !important;
    border: 1px solid rgba(201,169,110,0.2);
}

.proj-catalog__price {
    color: var(--gold) !important;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
    text-shadow: 0 2px 12px rgba(201,169,110,0.15);
}

/* Gallery arrows on cards */
.cases__gallery-prev,
.cases__gallery-next {
    background: var(--gold) !important;
    box-shadow: var(--shadow-gold) !important;
}
.cases__gallery-prev:hover,
.cases__gallery-next:hover {
    background: var(--gold-hover) !important;
    opacity: 1 !important;
}
.cases__gallery-prev svg,
.cases__gallery-next svg {
    stroke: var(--bg) !important;
}

/* Bottom CTA */
.proj-catalog-cta {
    background: #080808 !important;
    position: relative;
}
.proj-catalog-cta::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 75% 40%, rgba(201,169,110,0.06) 0%, transparent 55%);
    pointer-events: none;
}
.proj-catalog-cta > * { position: relative; z-index: 1; }
.proj-catalog-cta__text h2 {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
}
.proj-catalog-cta__text p {
    color: var(--text-muted-d) !important;
}


/* ================================================================
   24. PROJECT DETAIL (single project page)
   ================================================================ */
.proj-hero {
    background: var(--bg) !important;
    padding-top: 120px !important;
}
.proj-hero__breadcrumb,
.proj-hero__breadcrumb a {
    color: var(--text-muted-d) !important;
}
.proj-hero__breadcrumb a:hover {
    color: var(--gold) !important;
}
.proj-hero__title {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
}
.proj-hero__location {
    color: var(--text-muted-d) !important;
}
.proj-hero__location svg {
    stroke: var(--gold) !important;
}

/* Spec chips */
.proj-hero__spec {
    background: var(--glass) !important;
    border: 1px solid var(--glass-border) !important;
    backdrop-filter: blur(12px);
    border-radius: var(--r-lg) !important;
    transition: all var(--t-base);
}
.proj-hero__spec:hover {
    border-color: var(--glass-border-hover) !important;
}
.proj-hero__spec--accent {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    box-shadow: var(--shadow-gold);
}
.proj-hero__spec--accent .proj-hero__spec-value,
.proj-hero__spec--accent .proj-hero__spec-label {
    color: var(--bg) !important;
}
.proj-hero__spec-value {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
}
.proj-hero__spec-label {
    color: var(--text-muted-d) !important;
}

.proj-hero__photo {
    border: 1px solid var(--glass-border);
    border-radius: var(--r-xl);
}
.proj-hero__photo-placeholder {
    background: var(--glass-md) !important;
    color: var(--text-dim) !important;
}

/* Gallery */
.proj-gallery {
    background: var(--bg) !important;
}
.proj-gallery__main {
    border: 1px solid var(--glass-border);
    border-radius: var(--r-xl);
}
.proj-gallery__play {
    background: rgba(13,13,13,0.4) !important;
    transition: background var(--t-base);
}
.proj-gallery__play:hover {
    background: rgba(13,13,13,0.6) !important;
}
.proj-gallery__play svg {
    color: var(--gold) !important;
    filter: drop-shadow(0 4px 16px rgba(201,169,110,0.4));
}

.proj-gallery__thumb {
    border: 2px solid var(--glass-border) !important;
    transition: border-color var(--t-fast), transform var(--t-fast);
}
.proj-gallery__thumb:hover {
    border-color: var(--glass-border-hover) !important;
    transform: translateY(-2px);
}
.proj-gallery__thumb.active {
    border-color: var(--gold) !important;
    box-shadow: 0 0 0 1px var(--gold), 0 4px 20px rgba(201,169,110,0.3);
}

/* Details section */
.proj-details {
    background: var(--surface) !important;
}
.proj-details__title {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
}

/* Specs table */
.proj-specs-table tr {
    border-bottom-color: var(--border-light-d) !important;
}
.proj-specs-table__label {
    color: var(--text-muted-d) !important;
}
.proj-specs-table__value {
    color: var(--text) !important;
    font-family: var(--body) !important;
}
.proj-specs-table__row--accent .proj-specs-table__label,
.proj-specs-table__row--accent .proj-specs-table__value {
    color: var(--gold) !important;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
}

/* Badges */
.proj-details__badge {
    color: var(--text-muted-d) !important;
}
.proj-details__badge svg {
    color: var(--gold) !important;
    stroke: var(--gold) !important;
}

/* Description */
.proj-details__desc {
    color: var(--text-muted-d) !important;
}

/* Quote */
.proj-quote {
    background: var(--glass) !important;
    backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border) !important;
    border-left: 3px solid var(--gold) !important;
    border-radius: 0 var(--r-lg) var(--r-lg) 0 !important;
}
.proj-quote__text {
    color: var(--text) !important;
}
.proj-quote__author {
    color: var(--text-muted-d) !important;
}

/* Inner CTA block */
.proj-details__cta {
    background: linear-gradient(135deg, rgba(30,30,30,0.7), rgba(13,13,13,0.92)) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    backdrop-filter: blur(20px);
    box-shadow: var(--shadow-md-d), 0 0 40px rgba(201,169,110,0.04);
}
.proj-details__cta p {
    color: var(--text) !important;
}


/* ================================================================
   24.5. PROJECT PAGE — readability fix
   Описание в style.css прибито к #4a4a4a — нечитаемо на тёмном фоне.
   CTA-блок ("Похожий объект?") НЕ трогаем — он на белой плашке.
   ================================================================ */
.proj-content__desc {
    color: var(--text-secondary) !important;
}

/* ================================================================
   25. RELATED PROJECTS (на странице проекта)
   ================================================================ */
.proj-related {
    background: var(--bg) !important;
}
.proj-related__card {
    background: var(--glass) !important;
    backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-xl) !important;
    box-shadow: var(--shadow-sm-d) !important;
    transition: all var(--t-base) !important;
}
.proj-related__card:hover {
    border-color: var(--glass-border-hover) !important;
    box-shadow: var(--shadow-lg-d), 0 0 40px rgba(201,169,110,0.06) !important;
}
.proj-related__photo {
    background: var(--glass-md) !important;
}
.proj-related__type {
    color: var(--gold) !important;
}
.proj-related__title {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    letter-spacing: -0.01em !important;
}
.proj-related__meta {
    border-bottom-color: var(--border-light-d) !important;
}
.proj-related__meta-value {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
}
.proj-related__meta-label {
    color: var(--text-muted-d) !important;
}
.proj-related__price {
    color: var(--gold) !important;
    font-family: var(--heading) !important;
    font-weight: 600 !important;
    letter-spacing: -0.01em !important;
}


/* ================================================================
   26. THANKS PAGE (/spasibo)
   ================================================================ */
.thanks-hero {
    color: var(--text) !important;
}
.thanks-hero__overlay {
    background:
        linear-gradient(180deg, rgba(13,13,13,0.6) 0%, rgba(13,13,13,0.85) 100%),
        linear-gradient(90deg, rgba(13,13,13,0.55) 0%, rgba(13,13,13,0.25) 60%, transparent) !important;
}
.thanks-hero__icon i,
.thanks-hero__icon svg {
    color: var(--gold) !important;
    stroke: var(--gold) !important;
    filter: drop-shadow(0 4px 16px rgba(201,169,110,0.3));
}
.thanks-hero__title {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
    text-shadow: 0 2px 20px rgba(0,0,0,0.6);
}
.thanks-hero__subtitle {
    color: rgba(232,228,221,0.85) !important;
}
.thanks-hero__step {
    color: rgba(232,228,221,0.9) !important;
}
.thanks-hero__step-num {
    background: var(--gold) !important;
    color: var(--bg) !important;
    box-shadow: var(--shadow-gold);
}
.thanks-hero__contacts {
    border-top-color: rgba(255,255,255,0.1) !important;
}
.thanks-hero__contacts p {
    color: var(--text-dim) !important;
}
.thanks-hero__link {
    color: var(--text) !important;
}
.thanks-hero__link:hover {
    color: var(--gold) !important;
}
.thanks-hero__link i {
    color: var(--gold) !important;
    stroke: var(--gold) !important;
}
.thanks-hero__link img {
    filter: none !important;
}


/* ================================================================
   26b. COOKIE BANNER — нижняя полоска информирования о cookies
   ================================================================ */
.cookie-banner {
    position: fixed;
    bottom: 16px;
    left: 16px;
    right: 16px;
    max-width: 920px;
    margin: 0 auto;
    z-index: 1200;
    background: linear-gradient(135deg, rgba(30,30,30,0.95), rgba(13,13,13,0.98)) !important;
    backdrop-filter: blur(24px) saturate(1.4);
    -webkit-backdrop-filter: blur(24px) saturate(1.4);
    border: 1px solid var(--glass-border) !important;
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-lg-d);
    padding: 16px 22px;
    transform: translateY(150%);
    transition: transform 400ms var(--ease-smooth);
    pointer-events: none;
}
.cookie-banner.visible {
    transform: translateY(0);
    pointer-events: auto;
}
.cookie-banner__inner {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}
.cookie-banner__text {
    flex: 1;
    min-width: 280px;
    margin: 0;
    color: var(--text-muted-d) !important;
    font-family: var(--body) !important;
    font-size: 13px;
    line-height: 1.5;
}
.cookie-banner__text a {
    color: var(--text) !important;
    text-decoration: none;
    border-bottom: 1px solid var(--text-dim);
    transition: color var(--t-fast), border-color var(--t-fast);
}
.cookie-banner__text a:hover {
    color: var(--gold) !important;
    border-bottom-color: var(--gold);
}
.cookie-banner__more {
    margin-left: 4px;
    white-space: nowrap;
}
.cookie-banner__accept {
    flex-shrink: 0;
    background: var(--gold) !important;
    color: var(--bg) !important;
    border: 1px solid var(--gold) !important;
    border-radius: var(--r-pill) !important;
    padding: 10px 28px !important;
    font-family: var(--body) !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    cursor: pointer;
    box-shadow: var(--shadow-gold) !important;
    transition: all var(--t-base) !important;
}
.cookie-banner__accept:hover {
    background: var(--gold-hover) !important;
    border-color: var(--gold-hover) !important;
    box-shadow: var(--shadow-gold-lg) !important;
    transform: translateY(-1px);
}

@media (max-width: 600px) {
    .cookie-banner { left: 8px; right: 8px; bottom: 8px; padding: 14px 16px; }
    .cookie-banner__text { font-size: 12.5px; min-width: 100%; }
    .cookie-banner__accept { width: 100%; padding: 12px !important; }
}


/* ================================================================
   27. POLITIC / LEGAL PAGE
   ================================================================ */
.politic {
    background: var(--bg);
    padding-top: 140px !important;
    color: var(--text);
    max-width: 880px;
    margin: 0 auto;
}
.politic h1 {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    letter-spacing: -0.02em !important;
    text-transform: none !important;
}
.politic h2 {
    color: var(--text) !important;
    font-family: var(--heading) !important;
    font-weight: 500 !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
    border-bottom: 1px solid var(--border-light-d);
    padding-bottom: 10px;
}
.politic p {
    color: var(--text-muted-d) !important;
}
.politic strong {
    color: var(--text) !important;
}
.politic a {
    color: var(--gold) !important;
    border-bottom: 1px solid transparent;
    transition: border-color var(--t-fast);
}
.politic a:hover {
    border-bottom-color: var(--gold);
}


/* ================================================================
   28. SCROLL PROGRESS BAR (тонкая золотая полоска сверху)
   ================================================================ */
.scroll-progress {
    position: fixed;
    top: 0; left: 0;
    width: 100%;
    height: 2px;
    z-index: 9999;
    pointer-events: none;
    background: rgba(201,169,110,0.05);
}
.scroll-progress__bar {
    height: 100%;
    width: 0%;
    background: linear-gradient(90deg, var(--gold), var(--gold-hover));
    box-shadow: 0 0 8px rgba(201,169,110,0.4);
    transition: width 0.1s linear;
}


/* ================================================================
   7. ADAPTIVE — header
   ================================================================ */
/* Inline-телефон + разделитель в pill: только на мобильном */
.header__phone-mobile,
.header__sep-mobile { display: none; }

@media (max-width: 1100px) {
    /* На мобильном/планшете прячем десктоп-навигацию и правый блок,
       показываем бургер + inline-телефон */
    .header__nav,
    .header__inner > .header__nav,
    .header__container > .header__nav,
    .header__right { display: none !important; }
    .header__burger { display: flex !important; }

    /* Pill во всю ширину контейнера — убираем дополнительный outer-padding header'a */
    .header { padding: 12px 0 !important; }

    /* Inline-телефон в pill */
    .header__phone-mobile {
        display: inline-flex !important;
        align-items: center;
        gap: 8px;
        color: var(--text) !important;
        font-family: var(--body) !important;
        font-weight: 400 !important;
        font-size: 0.95rem;
        text-decoration: none;
        white-space: nowrap;
    }
    .header__phone-mobile:hover { color: var(--gold) !important; }
    .header__phone-mobile-icon {
        width: 18px !important;
        height: 18px !important;
        color: var(--gold) !important;
        stroke: var(--gold) !important;
    }
    .header__sep-mobile { display: none !important; }
}
@media (max-width: 1024px) {
    .header__container,
    .header__inner { padding: 12px 20px !important; gap: 14px !important; }
}
@media (max-width: 600px) {
    .header { padding: 10px 0 !important; }
    .header__container,
    .header__inner { padding: 10px 14px !important; gap: 10px !important; border-radius: var(--r-md) !important; }
    .header__phone-mobile { font-size: 0.85rem !important; gap: 6px !important; }
    .header__sep-mobile { margin: 0 2px !important; }
}
@media (max-width: 340px) {
    /* Только iPhone SE 1-го поколения (320px) и совсем старые Android — оставляем иконку */
    .header__phone-mobile-text { display: none; }
}
