/* =====================================================================
   KX THEME v1 — светлая/тёмная тема (2026-07-10)
   Механика: html[data-theme="dark"] + токены. Дефолт — светлая (без атрибута).
   Палитра тёмной — «Архитектура спокойствия» (slate + красный акцент ярче).
   ===================================================================== */

:root {
  --kx-bg:        #ffffff;
  --kx-surface:   #f7f8fa;
  --kx-surface-2: #ffffff;
  --kx-text:      #2d2d2d;
  --kx-text-soft: #6b7280;
  --kx-line:      #e5e7eb;
  --kx-accent:    #C8102E;
}
html[data-theme="dark"] {
  --kx-bg:        #10151C;
  --kx-surface:   #1A212B;
  --kx-surface-2: #232C38;
  --kx-text:      #F2F5F8;
  --kx-text-soft: #AEB9C6;
  --kx-line:      rgba(255,255,255,.09);
  --kx-accent:    #E5314F;
  color-scheme: dark;
}

/* ---------- кнопка-переключатель ---------- */
.kx-theme-toggle{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border:1px solid var(--kx-line);border-radius:50%;
  background:transparent;cursor:pointer;padding:0;flex:none;
  transition:border-color .15s ease, background .15s ease;
}
.kx-theme-toggle:hover{border-color:var(--kx-text-soft);}
.kx-theme-toggle svg{width:21px;height:21px;display:block;}
.kx-theme-toggle .kx-ico-sun{display:none;}
.kx-theme-toggle .kx-ico-moon{display:block;fill:none;stroke:#0F1B2D;stroke-width:1.8;}
html[data-theme="dark"] .kx-theme-toggle .kx-ico-moon{display:none;}
html[data-theme="dark"] .kx-theme-toggle .kx-ico-sun{display:block;fill:none;stroke:#F2F5F8;stroke-width:1.8;}
.mobile-contact-bar .kx-theme-toggle{width:34px;height:34px;margin-left:12px;}
.mobile-contact-bar .kx-theme-toggle svg{width:17px;height:17px;}

/* =====================================================================
   ТЁМНАЯ ТЕМА — оверрайды (этап 1: шапка, hero, главная, формы, футер)
   ===================================================================== */

/* ---------- база ---------- */
html[data-theme="dark"], html[data-theme="dark"] body{
  background:var(--kx-bg) !important; color:var(--kx-text);
}
html[data-theme="dark"] .intec-template,
html[data-theme="dark"] .intec-template-page,
html[data-theme="dark"] .intec-template-content,
html[data-theme="dark"] .intec-template-content-wrapper,
html[data-theme="dark"] .intec-content,
html[data-theme="dark"] .intec-content-wrapper,
html[data-theme="dark"] .intec-template-layout,
html[data-theme="dark"] .intec-template-layout-page{
  background-color:transparent !important; color:var(--kx-text);
}
html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3,
html[data-theme="dark"] h4, html[data-theme="dark"] h5, html[data-theme="dark"] h6,
html[data-theme="dark"] .key-claim, html[data-theme="dark"] .photo-title,
html[data-theme="dark"] .header-castom-s, html[data-theme="dark"] .md-main-title{
  color:var(--kx-text) !important;
}
html[data-theme="dark"] p, html[data-theme="dark"] li{ color:inherit; }

/* ---------- шапка ---------- */
html[data-theme="dark"] .intec-template-header > div:first-child,
html[data-theme="dark"] .intec-template-header .widget-view-desktop,
html[data-theme="dark"] .intec-template-header .widget-view-desktop-2{
  background-color:rgba(16,21,28,.94) !important;
  box-shadow:0 1px 0 var(--kx-line) !important;
}
html[data-theme="dark"] body:has(.widget-banner) .widget-view-desktop-2::before{
  background:linear-gradient(to bottom, rgba(10,14,19,.55), rgba(10,14,19,0)) !important;
}
/* фикс-шапка при скролле и мобильное меню */
html[data-theme="dark"] .intec-template-header .widget-view-fixed,
html[data-theme="dark"] .intec-template-header .widget-view-fixed-1,
html[data-theme="dark"] .intec-template-header .widget-view-mobile,
html[data-theme="dark"] .intec-template-header .widget-view-mobile-2,
html[data-theme="dark"] .header-fixed, html[data-theme="dark"] .widget-header-fixed{
  background-color:#131922 !important;
}
/* безклассовые обёртки внутри шапки со светлым фоном */
html[data-theme="dark"] .intec-template-header > div{ background-color:transparent !important; }
html[data-theme="dark"] .intec-template-header > div:first-child{ background-color:rgba(16,21,28,.94) !important; }
html[data-theme="dark"] .intec-template-header .menu-item > a,
html[data-theme="dark"] .intec-template-header .menu-item-text{ color:var(--kx-text) !important; }
/* intec-cl-text — «цвет текста темы» intec (тёмный): в тёмной теме перекрашиваем глобально.
   Селекторы с запасом специфичности — у intec правила вида (0,4-5,0)+!important */
html[data-theme="dark"] .intec-cl-text,
html[data-theme="dark"] .intec-template .intec-cl-text,
html[data-theme="dark"] .intec-template-header .c-menu .menu-item .menu-item-text-wrapper,
html[data-theme="dark"] .intec-template-header .c-menu .menu-item .menu-item-text-wrapper.intec-cl-text,
html[data-theme="dark"] .widget-icons .widget-icons-content .widget-icons-header,
html[data-theme="dark"] .widget-icons-header *{ color:var(--kx-text) !important; }
html[data-theme="dark"] a.intec-cl-text-hover:hover,
html[data-theme="dark"] .intec-cl-text-hover:hover{ color:var(--kx-accent) !important; }
/* фикс-меню: у intec селектор-монстр (0,8,0)+important — перебиваем его же селектором с префиксом темы */
html[data-theme="dark"] .c-header.c-header-template-1 .widget-view.widget-view-fixed .widget-menu .ns-bitrix.c-menu.c-menu-horizontal-1 .menu-wrapper-4 .menu-item .menu-item-text-wrapper{
  color:var(--kx-text) !important;
}

/* ---------- hero: статичная картинка вместо видео ---------- */
html[data-theme="dark"] .widget-banner{
  background-image:url('/upload/kx/hero-dark.webp?v=20260710') !important;
  background-size:cover !important; background-position:center !important;
  background-color:#0b0f14 !important;
}
html[data-theme="dark"] .widget-item-video video,
html[data-theme="dark"] .c-system-video-tag video{ display:none !important; }
html[data-theme="dark"] .widget-item-video, html[data-theme="dark"] .c-system-video-tag,
html[data-theme="dark"] .system-video-tag-content{ background:transparent !important; }

/* ---------- липучка «Персональный расчёт» ---------- */
html[data-theme="dark"] .kx-hero-form{
  background:rgba(26,33,43,.92) !important; border-color:var(--kx-line) !important;
}
html[data-theme="dark"] .kx-hero-form__title{ color:var(--kx-text) !important; }
html[data-theme="dark"] .kx-hero-form__sub{ color:var(--kx-text-soft) !important; }
html[data-theme="dark"] .kx-hero-form__input{
  background:var(--kx-bg) !important; border-color:var(--kx-line) !important; color:var(--kx-text) !important;
}
html[data-theme="dark"] .kx-hero-form__input::placeholder{ color:var(--kx-text-soft); }
html[data-theme="dark"] .kx-hero-form__legal, html[data-theme="dark"] .kx-hero-form__legal a{ color:var(--kx-text-soft) !important; }
html[data-theme="dark"] .kx-hero-form.kx-onlight{ box-shadow:0 12px 40px rgba(0,0,0,.55) !important; }

/* ---------- секции главной ---------- */
/* «Построен без переплат» и текстовые блоки шапки-каскада */
html[data-theme="dark"] .header-castom-ss{ color:var(--kx-text-soft); background:transparent; }
html[data-theme="dark"] .red-text-castom-s{ color:var(--kx-accent); }
/* белые карточки (В стоимость входит, преимущества, проекты) */
html[data-theme="dark"] .proects-item,
html[data-theme="dark"] .widget-item.intec-cl-background-white,
html[data-theme="dark"] [class*="castom-block"],
html[data-theme="dark"] .catalog-section-item{
  background-color:var(--kx-surface) !important; color:var(--kx-text) !important;
  border-color:var(--kx-line) !important;
}
html[data-theme="dark"] .proects-item_name{ color:var(--kx-text) !important; }
/* растровые инфографики с белым фоном — паспарту + мягче яркость */
html[data-theme="dark"] .kx-zalivka-wrap img,
html[data-theme="dark"] #page-section .kx-media img{
  filter:brightness(.92); border-radius:10px;
  box-shadow:0 0 0 1px var(--kx-line);
}
/* блоки-виджеты intec с белым фоном */
html[data-theme="dark"] .widget.c-content-text,
html[data-theme="dark"] .widget-view[class*="template"],
html[data-theme="dark"] .intec-cl-background-white{ background-color:transparent !important; }
/* заголовки intec-виджетов */
html[data-theme="dark"] .widget-icons-header,
html[data-theme="dark"] .widget-header, html[data-theme="dark"] .widget-title,
html[data-theme="dark"] .widget-description{ color:var(--kx-text) !important; }
/* карточки «В стоимость работ входит»: тёмная карточка + белое паспарту под line-art медиа */
html[data-theme="dark"] .widget-icons .widget-icons-content .icons-left-float .icons-left-float-wrapper{
  background:var(--kx-surface) !important; color:var(--kx-text) !important;
  box-shadow:0 0 0 1px var(--kx-line);
}
html[data-theme="dark"] .widget-icons .widget-icons-content .icons-left-float .icons-picture{
  background:#fff !important; border-radius:8px; overflow:hidden;
}
html[data-theme="dark"] .icons-text, html[data-theme="dark"] .icons-header,
html[data-theme="dark"] .icons-name-text{ color:var(--kx-text) !important; }
/* отзывы */
html[data-theme="dark"] .reviews-item, html[data-theme="dark"] .c-reviews .widget-item{
  background:var(--kx-surface) !important; color:var(--kx-text) !important;
}

/* ---------- контентные страницы (#page-section) ---------- */
html[data-theme="dark"] #page-section{ color:var(--kx-text); }
html[data-theme="dark"] #page-section .proekti p,
html[data-theme="dark"] #page-section .proekti li{ color:var(--kx-text-soft) !important; }
html[data-theme="dark"] #page-section h2, html[data-theme="dark"] #page-section h5{ color:var(--kx-text) !important; }

/* ---------- мобильная контакт-полоса ---------- */
html[data-theme="dark"] .mobile-contact-bar{
  background:#131922 !important; border-bottom-color:var(--kx-line) !important;
}
html[data-theme="dark"] .mobile-contact-bar a{ color:var(--kx-text) !important; }

/* ---------- формы/инпуты глобально ---------- */
html[data-theme="dark"] input[type="text"], html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] input[type="email"], html[data-theme="dark"] textarea,
html[data-theme="dark"] select{
  background-color:var(--kx-surface) !important; color:var(--kx-text) !important;
  border-color:var(--kx-line) !important;
}

/* ---------- хлебные крошки, разделители ---------- */
html[data-theme="dark"] .breadcrumb, html[data-theme="dark"] .breadcrumb a{ color:var(--kx-text-soft) !important; background:transparent !important; }
html[data-theme="dark"] hr{ border-color:var(--kx-line); }

/* футер уже тёмный — не трогаем */
