html { color-scheme: light; }
/* ============================================================
   ExCards — LIGHT THEME (2026)
   Единый стиль с новым лендингом: изумруд #0B6E4F на тёплом #FAFAF7,
   заголовки Gerhaus, цифры Consola Mono, тело Inter.
   Подключается ПОСЛЕДНИМ — переопределяет тёмную тему styles.css.
   ============================================================ */

@font-face { font-family:'Gerhaus'; src:url('../assets/fonts/Gerhaus-Regular.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face { font-family:'ConsolaMono'; src:url('../assets/fonts/ConsolaMono-Book.ttf') format('truetype'); font-weight:400; font-display:swap; }
@font-face { font-family:'ConsolaMono'; src:url('../assets/fonts/ConsolaMono-Bold.ttf') format('truetype'); font-weight:700; font-display:swap; }

/* ---------- База ---------- */
body,
body.main-page,
body.product-page {
  background: #FAFAF7 !important;
  color: #3A3A36 !important;
}

/* ---------- Заголовки — Gerhaus, как на лендинге ---------- */
h1, .h1, h2, .h2 {
  font-family: 'Gerhaus', system-ui, sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: 0.012em !important;
  color: #0A0A0A !important;
}
h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  color: #0A0A0A !important;
  letter-spacing: -0.01em;
}
/* градиент-текст (фиолетовый) → сплошной чёрный */
.text-gradient {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #0A0A0A !important;
  color: #0A0A0A !important;
}

/* ---------- Текст ---------- */
p, li, td, th, dd, dt { color: #3A3A36; }
.text-muted, .muted, small { color: #767670 !important; }
a { color: #0B6E4F; }
a:hover { color: #0A6144; }

/* цифры/суммы моно */
.num, [class*="num-"], .tabular { font-family: 'ConsolaMono', monospace; }

/* ---------- Шапка — светлая липкая ---------- */
.top {
  background: rgba(255,255,255,.85) !important;
  border: 1px solid rgba(205,205,200,.6) !important;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}
.top__logo img { filter: brightness(0); }
.top__nav a { color: #0A0A0A; }
.top__nav a:hover { color: #0B6E4F; }
.top__nav-item__trigger { color: #0A0A0A; }
.top__nav-item__menu {
  background: #FFFFFF;
  border: 1px solid #E4E4DF;
  box-shadow: 0 12px 28px rgba(10,10,10,.10);
}
.top__nav-item__menu a { color: #5E5E58; }
.top__nav-item__menu a:hover { background: rgba(11,110,79,.08); color: #0B6E4F; }
.top .btn-primary {
  background: #0B6E4F !important;
  border: 1px solid #0B6E4F !important;
  color: #FFFFFF !important;
}
.top .btn-primary:hover,
.top .btn-primary:active,
.top .btn-primary:focus {
  background: #0A6144 !important;
  border-color: #0A6144 !important;
}

/* ---------- Кнопки общие ---------- */
.btn-primary {
  background: #0B6E4F;
  border-color: #0B6E4F;
  color: #FFFFFF;
}
.btn-primary:hover { background: #0A6144; border-color: #0A6144; }
.btn-secondary {
  background: #FFFFFF;
  border: 1px solid #E4E4DF;
  color: #0A0A0A;
}
.btn-secondary:hover { border-color: #CFCFC9; }

/* ---------- Поверхности ---------- */
.wide-back { background: #FFFFFF; border: 1px solid #E4E4DF; }

/* ---------- Футер — светлый как на лендинге ---------- */
.footer {
  background: #F1F1EC !important;
  border-top: 1px solid rgba(205,205,200,.5);
  padding: 88px 0;
}
.footer,
.footer__bottom,
.footer__nav-title,
.footer__docs a,
.footer__nav a { color: #767670; }
.footer a:hover { color: #0B6E4F; }
.footer__logo { color: #0A0A0A !important; }
.footer__logo img { filter: brightness(0); }
.footer__middle { border-bottom: 1px solid #E4E4DF; }

/* ---------- Мобильный drawer ---------- */
.mobile-drawer, .mobile-drawer__nav { background: #FFFFFF; }
.mobile-drawer a { color: #0A0A0A; }

/* ---------- Аккордеон (FAQ) — светлый ---------- */
.accordion__item { background: #FFFFFF; border: 1px solid #E4E4DF !important; }
.accordion__item:hover { border-color: #CFCFC9 !important; }
.accordion__item.opened { background: #FFFFFF !important; border-color: #0B6E4F !important; }
.accordion__title { color: #0A0A0A; }
.accordion__title::after { color: #0B6E4F; }
.accordion__text, .accordion__text * { color: #3A3A36 !important; }

/* ---------- ico-round → изумруд ---------- */
.control { --ico-round-color: #0B6E4F !important; --ico-round-bg: #EAF2EE !important; }
.ico-round { background: #EAF2EE !important; color: #0B6E4F !important; }

/* ---------- Тёмный CTA-блок (единый с тёмными CTA лендинга) ---------- */
.cta__inner { background: #0A0A0A !important; border: 1px solid rgba(255,255,255,.08) !important; }
.cta__inner h1, .cta__inner h2, .cta__inner .h1, .cta__inner .h2,
.cta__inner h3, .cta__inner .h3 { color: #FFFFFF !important; }
.cta__inner p, .cta__inner .text-muted, .cta__inner li { color: #B7B7B0 !important; }
.cta .btn-secondary { background: transparent; border: 1px solid rgba(255,255,255,.24); color: #FFFFFF; }
.cta .btn-secondary:hover { border-color: rgba(255,255,255,.5); }

/* ---------- v-tabs активный (side-stripe фиолет) → изумруд ---------- */
.v-tabs>*.active { border-left-color: #0B6E4F !important; }

/* ---------- Исключение: градиент-заголовок на тёмном CTA → белый ---------- */
.cta__inner .text-gradient,
.cta__inner .h3.text-gradient {
  -webkit-text-fill-color: #FFFFFF !important;
  color: #FFFFFF !important;
}

/* ---------- AI-виджет → изумруд ---------- */
.xc-assistant__toggle { background: linear-gradient(135deg, #0B6E4F 0%, #0A6144 100%) !important; box-shadow: 0 12px 35px rgba(11,110,79,.35) !important; }
.xc-assistant__header { background: radial-gradient(120% 120% at 0% 0%, rgba(11,110,79,.35), rgba(10,10,10,.95)) !important; }
.xc-assistant__msg--user, .xc-assistant__send { background: #0B6E4F !important; }

/* ---------- lang-toggle на светлой шапке ---------- */
.lang-toggle { background: rgba(10,10,10,.05) !important; }
.lang-toggle__option { color: #5E5E58 !important; }
.lang-toggle__option:hover { color: #0A0A0A !important; }
.lang-toggle__option--active { background: #0B6E4F !important; color: #FFFFFF !important; box-shadow: 0 2px 8px rgba(11,110,79,.3) !important; }

/* ---------- text-neutral утилиты (тёмная тема) → читаемые на светлом ---------- */
.text-neutral-100, .text-neutral-200 { color: #0A0A0A !important; }
.text-neutral-300 { color: #3A3A36 !important; }
.text-neutral-400 { color: #5E5E58 !important; }
.text-neutral-500 { color: #767670 !important; }
.text-neutral-600, .text-neutral-700 { color: #767670 !important; }

/* ---------- Футер-строка (инлайн-boilerplate тёмной темы на всех страницах) ---------- */
.footer__bottom { color: #767670 !important; border-top-color: #E4E4DF !important; }
.footer__bottom a { color: #767670 !important; }
.footer__bottom a:hover { color: #0B6E4F !important; }

/* ============================================================
   ЕДИНЫЙ ВИД КНОПОК (весь сайт)
   primary = изумруд · secondary = neutral = белая с обводкой
   на тёмных блоках вторичные — прозрачные с белой обводкой
   ============================================================ */
.btn { border-radius: 12px !important; font-weight: 600 !important; transition: background .18s, border-color .18s, box-shadow .18s, transform .15s !important; }
.btn-primary {
  background: #0B6E4F !important; color: #FFFFFF !important; border: 1px solid #0B6E4F !important;
  box-shadow: 0 8px 20px -6px rgba(11,110,79,.40) !important;
}
.btn-primary:hover { background: #0A6144 !important; border-color: #0A6144 !important; box-shadow: 0 10px 26px -6px rgba(11,110,79,.52) !important; transform: translateY(-1px); }
.btn-primary:active { background: #074431 !important; transform: none; }
.btn-secondary, .btn-neutral {
  background: #FFFFFF !important; color: #0A0A0A !important; border: 1px solid #E4E4DF !important; box-shadow: none !important;
}
.btn-secondary:hover, .btn-neutral:hover { background: #FFFFFF !important; border-color: #CFCFC9 !important; color: #0A0A0A !important; }
/* вторичные на ТЁМНЫХ блоках → прозрачная + белая обводка */
.cta__inner .btn-secondary, .cta__inner .btn-neutral,
.lp-cta .btn-secondary, .lp-cta .btn-neutral {
  background: transparent !important; color: #FFFFFF !important; border: 1px solid rgba(255,255,255,.28) !important;
}
.cta__inner .btn-secondary:hover, .cta__inner .btn-neutral:hover,
.lp-cta .btn-secondary:hover, .lp-cta .btn-neutral:hover { border-color: rgba(255,255,255,.55) !important; color: #FFFFFF !important; }
/* шапка: secondary (Telegram) — белая обводка, primary (Получить карту) — изумруд */
.top .btn-secondary { background: #FFFFFF !important; color: #0A0A0A !important; border: 1px solid #E4E4DF !important; box-shadow: none !important; }
.top .btn-secondary:hover { background: #FFFFFF !important; border-color: #CFCFC9 !important; }

/* ---------- Подзаголовки секций (тёмная тема #CACFD8) → читаемые ---------- */
.header-3__sub-title, .header-product__sub-title,
[class*="__sub-title"], [class*="__subtitle"], .section-subtitle, .subtitle {
  color: #5E5E58 !important;
}

/* ---------- lp-faq (карточные/маркетинг) заголовки — тёмные на всех страницах ---------- */
.lp-faq summary { color: #0A0A0A !important; }
.lp-faq summary::after { color: #0B6E4F !important; }
.lp-faq summary + p, .lp-faq details p { color: #3A3A36 !important; }
.lp-hero p, .lp-section p, .lp-section li { color: #3A3A36 !important; }

/* ---------- .lp-cta — единый тёмный финальный CTA (все страницы, RU=EN) ---------- */
.lp-cta { background: #0A0A0A !important; border: 1px solid rgba(255,255,255,.08) !important; }
.lp-cta h1, .lp-cta h2, .lp-cta h3, .lp-cta .text-gradient,
.lp-cta .h1, .lp-cta .h2, .lp-cta .h3 { -webkit-text-fill-color: #FFFFFF !important; color: #FFFFFF !important; }
.lp-cta p, .lp-cta li { color: #B7B7B0 !important; }
.lp-cta .btn-secondary, .lp-cta .btn-neutral { background: transparent !important; color: #FFFFFF !important; border-color: rgba(255,255,255,.28) !important; }
.lp-cta .btn-secondary:hover, .lp-cta .btn-neutral:hover { border-color: rgba(255,255,255,.55) !important; }

/* ============================================================
   ФИКСЫ БЛОКОВ (блог/рассылка/бейджи)
   ============================================================ */
/* Блок рассылки — тёмный, но текст читаемый */
.subscribe-wrapper { background: #0A0A0A !important; border: 1px solid rgba(255,255,255,.08) !important; color: #B7B7B0 !important; }
.subscribe-wrapper .h6, .subscribe .h6 { color: #FFFFFF !important; }
.subscribe-wrapper > div, .subscribe .mb-32 { color: #B7B7B0 !important; }
.subscribe-wrapper .ico-round { background: rgba(11,110,79,.18) !important; color: #0B6E4F !important; }

/* Фильтр блога — светлый сегмент-контрол */
.blog-filter { background: #EFEFEA !important; border: 1px solid #E4E4DF !important; }
.blog-filter > * { color: #5E5E58 !important; }
.blog-filter > *.active { background: #0B6E4F !important; color: #FFFFFF !important; }
.blog-filter a:hover { color: #0A0A0A !important; }

/* Бейджи-таблетки btn-neutral-flat («Рекомендованное» и т.п.) — светлый изумруд-тинт */
.btn-neutral-flat { background: rgba(11,110,79,.10) !important; color: #0B6E4F !important; border: 1px solid rgba(11,110,79,.18) !important; }

/* ---------- Герой product: визуал карты справа (заполняет пустоту) ---------- */
.header-product .container { position: relative; }
.header-product__card { position: absolute; right: 0; top: 50%; transform: translateY(-46%) rotate(-9deg); width: 46%; max-width: 560px; height: auto; filter: drop-shadow(0 34px 70px rgba(11,110,79,.30)); pointer-events: none; z-index: 0; }
.header-product__inner { position: relative; z-index: 1; }
@media (max-width: 980px) { .header-product__card { display: none; } }

/* ============================================================
   БЛОГ-СТАТЬЯ (blog-detail): TOC-сайдбар, бейдж, автор, share
   ============================================================ */
.content-table__inner { background: #FFFFFF !important; border: 1px solid #E4E4DF !important; }
.content-table__header { color: #0A0A0A !important; border-bottom-color: #E4E4DF !important; }
.content-table__nav, .content-table__nav a { color: #5E5E58 !important; }
.content-table__nav a:hover, .content-table__nav a.active, .content-table__nav .active { color: #0B6E4F !important; background: rgba(11,110,79,.08) !important; }
.content-table__socials, .blog-data__socials { background: #FFFFFF !important; border: 1px solid #E4E4DF !important; }
.header-3__badge-item { background: rgba(11,110,79,.10) !important; color: #0B6E4F !important; }
.blog-data__author, .blog-data__author * { color: #3A3A36 !important; }
.content__h { color: #0A0A0A !important; }

/* share-иконки в статье — тёмные на белом */
.socials a, .socials i, .socials svg { color: #5E5E58 !important; }
.socials a:hover { color: #0B6E4F !important; }
.socials svg { fill: currentColor; stroke: currentColor; }
.content-table__socials .h6, .content-table__socials > div:first-child { color: #0A0A0A !important; }

/* share-иконки: fill=white на path → тёмный */
.content-table__socials svg path, .socials svg path { fill: #5E5E58 !important; }
.content-table__socials a:hover svg path, .socials a:hover svg path { fill: #0B6E4F !important; }

/* ============================================================
   МОБИЛКА — доводка под светлую тему (≤767px).
   theme-light грузится последним → эти правила перебивают mobile.css,
   который писался ещё под старую ТЁМНУЮ тему.
   ============================================================ */
@media (max-width: 767px) {
  /* Бургер: был белыми полосками на почти прозрачном фоне → невидим на
     светлой шапке. Делаем видимую кнопку с тёмными полосками. */
  .top__burger {
    background: #F2F2ED !important;
    border: 1px solid #E4E4DF !important;
  }
  .top__burger span { background: #0A0A0A !important; }

  /* Дровер: mobile.css красит контейнер тёмным (#181B25) по !important, а nav
     остаётся белым → «заплатка». Приводим весь дровер к светлому виду. */
  .mobile-drawer {
    background: #FFFFFF !important;
    box-shadow: -8px 0 32px rgba(10,10,10,.18) !important;
  }
  .mobile-drawer__head {
    border-bottom: 1px solid #EFEFEA !important;
    padding-bottom: 14px !important;
  }
  /* logo.png — светлый; на белом дровере делаем тёмным (как в шапке/футере). */
  .mobile-drawer__logo img { filter: brightness(0) !important; }
  .mobile-drawer__close { background: #F2F2ED !important; color: #0A0A0A !important; }
  .mobile-drawer__nav a { color: #0A0A0A !important; }
  .mobile-drawer__nav a:hover,
  .mobile-drawer__nav a:active { background: #F2F2ED !important; }
  .mobile-drawer__cta .btn { width: 100% !important; }
  .mobile-drawer__footer { border-top-color: #EFEFEA !important; }
  .mobile-drawer__footer a { color: #767670 !important; }

  /* Широкие таблицы в статьях → горизонтальный скролл вместо переполнения. */
  .article table, .content table, .post table, article table {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    white-space: nowrap !important;
  }
}

/* ============================================================
   СТАТЬИ БЛОГА — инлайн-стиль писался под ТЁМНУЮ тему (color:#fff).
   theme-light перекрывал только h2/h3, а summary/strong/th/a:hover
   оставались БЕЛЫМИ на светлом фоне = невидимы. Чиним централизованно.
   (.article-cta — тёмный блок, там белый текст ПРАВИЛЬНЫЙ, не трогаем.)
   ============================================================ */
.article-body h2, .article-body h3, .article-body h4 { color: #0A0A0A !important; }
.article-body strong, .article-body b { color: #0A0A0A !important; }
.article-body th { color: #0A0A0A !important; background: #F2F2ED !important; }
.article-body a { color: #0B6E4F !important; }
.article-body a:hover { color: #0A6144 !important; }
.article-faq summary { color: #0A0A0A !important; }
.article-faq summary::after { color: #0B6E4F !important; }

/* ============================================================
   КОНТРАСТ-ФИКСЫ (скан всего сайта)
   ============================================================ */
/* «Read More» / «Читать далее» / «Назад» — светло-изумрудный #4FA98A → бренд */
a.primary, .primary.stretched, .blog-item .primary { color: #0B6E4F !important; }
a.primary:hover { color: #0A6144 !important; }
/* Тёмный CTA-блок «Остались вопросы?»: дефолтный текст (div mb-40) был #3A3A36
   на #0A0A0A = невидим → светлый */
.cta__inner { color: #B7B7B0 !important; }
/* code в статьях — инлайн был белым на прозрачном (тёмная тема) → тёмный на светлом */
.article-body code, .article-faq code, .article-body pre { color: #0A0A0A !important; background: #F2F2ED !important; }
