@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@600;700&display=swap');
/* ============================================================================
   design-v2.css — VX4 «DESIGN-V2» · слой визуального превосходства v2
   для new-sst.ru (волна VX, 19.09.2026)

   ПОЗИЦИЯ В КАСКАДЕ: ПОСЛЕДНИМ <link>, после theme-light.css / header-pt.css /
   anim.css / adaptive.css (см. INTEGRATION_V2.md). НИЧЕГО не удаляет:
   все правила additive/overriding поверх VD-слоёв. Хуки cro.js
   ([data-cro-*], .cro-rotator, [data-lead-form]), Метрика 110351174,
   anim.js (.v-reveal/.mp-reveal), header-pt.js — НЕ трогаются.

   Дизайн-токены v2 (согласованы волной VX; VX3 DESIGN_TOKENS_V2.md не сдал —
   значения совместимы):
     navy-900 #071729 (тёмные секции) · navy #0B1F3A · slate-600 #475569
     red #E30613 · red-soft #FDECEC · success #16A34A · info #1D4ED8
     поверхности #FFF / #F8FAFC / #EEF2F7 · рамки #E2E8F0
     тени sm 0 1px 2px rgba(7,23,41,.06) · md 0 8px 24px rgba(7,23,41,.10)
          lg 0 20px 48px rgba(7,23,41,.14) · радиусы 10 / 14 / 20
   Шрифты: 'Inter Tight' 600/700 (дисплей, H1–H3, кириллица) + PT Sans (тело).

   Прогрессивность: страница полностью живёт БЕЗ d2.js (js-зависимые эффекты
   только под html.d2-js). prefers-reduced-motion выключает движение.
   ========================================================================== */

/* ===== §0. ТОКЕНЫ V2 ===== */
:root {
  --d2-navy-900: #071729;
  --d2-navy: #0B1F3A;
  --d2-slate-600: #475569;
  --d2-red: #E30613;
  --d2-red-dark: #C00511;
  --d2-red-soft: #FDECEC;
  --d2-success: #16A34A;
  --d2-info: #1D4ED8;
  --d2-bg-0: #FFFFFF;
  --d2-bg-1: #F8FAFC;
  --d2-bg-2: #EEF2F7;
  --d2-border: #E2E8F0;
  --d2-sh-sm: 0 1px 2px rgba(7, 23, 41, .06);
  --d2-sh-md: 0 8px 24px rgba(7, 23, 41, .10);
  --d2-sh-lg: 0 20px 48px rgba(7, 23, 41, .14);
  --d2-glow-red: 0 8px 24px rgba(227, 6, 19, .25);
  --d2-r-sm: 10px;
  --d2-r-md: 14px;
  --d2-r-lg: 20px;
  --d2-font-display: "Inter Tight", "PT Sans", -apple-system, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
  --d2-ease: cubic-bezier(.2, .7, .3, 1);
}

/* ===== §1. ДИСПЛЕЙ-ТИПОГРАФИКА (Inter Tight для H1–H3) ===== */
h1, h2, h3,
.v-h1, .v-h2, .v-h3,
.mp-title, .mp-hero__title, .mp-service-card__name,
.v-hub-card__title, .svc-card__title, .mp-card__title {
  font-family: var(--d2-font-display);
  letter-spacing: -0.02em;
  text-wrap: balance;
}

/* H1 v2: крупнее, жёстче трекинг */
body.home-positive .mp .mp-hero__title,
.mp .mp-hero__title, .v-h1 {
  font-family: var(--d2-font-display);
  font-size: clamp(40px, 6vw, 68px);
  line-height: 1.04;
  font-weight: 700;
  letter-spacing: -0.022em;
}
.v-h2, .mp .mp-title {
  font-size: clamp(28px, 3.6vw, 44px);
  line-height: 1.12;
  font-weight: 700;
}
h3, .v-h3, .mp .mp-service-card__name {
  letter-spacing: -0.012em;
}

/* kicker-чип v2: аккуратная плашка */
.mp .mp-kicker, .v-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  line-height: 1;
  letter-spacing: .09em;
  text-transform: uppercase;
  padding: 7px 12px;
  border-radius: 999px;
  background: var(--d2-bg-2);
  color: var(--d2-navy);
  border: 1px solid var(--d2-border);
}
.mp .mp-kicker::before, .v-kicker::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--d2-red);
  flex: none;
}

/* ===== §2. HERO v2: свет, сетка, типографика ===== */
body.home-positive .mp .mp-hero {
  background:
    radial-gradient(58% 64% at 78% -8%, rgba(29, 78, 216, .07), transparent 62%),
    radial-gradient(120% 90% at 50% -10%, #F8FAFC 0%, #FFFFFF 46%, #F8FAFC 100%);
  border-bottom: 1px solid var(--d2-border);
}
/* тонкая инженерная сетка v2: мельче + маска-затухание вниз */
body.home-positive .mp .mp-hero::before {
  background-image:
    linear-gradient(rgba(11, 31, 58, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11, 31, 58, .045) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .5) 46%, transparent 86%);
  mask-image: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .5) 46%, transparent 86%);
  opacity: 1;
}
/* radial-подсветка слева-сверху (акцент под заголовком) */
.mp .mp-hero::after {
  content: "";
  position: absolute;
  left: -12%;
  top: -18%;
  width: 56%;
  height: 72%;
  pointer-events: none;
  background: radial-gradient(closest-side, rgba(227, 6, 19, .05), transparent 72%);
}
.mp .mp-hero__lead, body.home-positive .mp .mp-hero__lead {
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.6;
  color: var(--d2-slate-600);
  max-width: 62ch;
}
.mp .mp-hero__note, body.home-positive .mp .mp-hero__note {
  color: var(--d2-slate-600);
  font-size: 13.5px;
}

/* --- Лого-стена .d2-logos: два варианта разметки (см. INTEGRATION_V2.md §3):
       а) полоса в hero (.mp-hero .d2-logos + .d2-logos__item svg);
       б) отдельная секция VX5 home-v2 (.d2-logos.mp-section + ul.d2-logos__row > li > a) --- */
.mp-hero .d2-logos {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 34px;
  margin-top: 34px;
  padding-top: 22px;
  border-top: 1px solid var(--d2-border);
}
.d2-logos__cap {
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--d2-slate-600);
  flex: none;
}
.mp-hero .d2-logos__cap { margin: 0; }
.d2-logos__item {
  display: inline-flex;
  align-items: center;
  opacity: .55;
  filter: grayscale(1);
  transition: opacity .25s var(--d2-ease), filter .25s var(--d2-ease);
}
.d2-logos__item:hover, .d2-logos__item:focus-visible {
  opacity: 1;
  filter: none;
}
.d2-logos__item svg {
  height: 22px;
  width: auto;
  display: block;
}
/* вариант-секция (VX5 home-v2): центр, монохромные текстовые ссылки */
.d2-logos.mp-section {
  padding: clamp(40px, 5vw, 64px) 0;
  background: var(--d2-bg-1);
  border-top: 1px solid var(--d2-border);
  border-bottom: 1px solid var(--d2-border);
}
.d2-logos.mp-section .d2-logos__cap {
  text-align: center;
  margin: 0 0 20px;
}
.d2-logos__row {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  gap: 18px 44px;
  margin: 0;
  padding: 0;
}
.d2-logos__row a {
  font-family: var(--d2-font-display);
  font-weight: 600;
  font-size: 21px;
  letter-spacing: -0.01em;
  color: var(--d2-navy);
  text-decoration: none;
  opacity: .72;
  transition: opacity .2s var(--d2-ease), color .2s var(--d2-ease);
}
.d2-logos__row a:hover, .d2-logos__row a:focus-visible {
  opacity: 1;
  color: var(--d2-red);
}

/* ===== §3. СЕКЦИОННЫЙ РИТМ: 96px, спокойные поверхности ===== */
.mp .mp-section { padding: 96px 0; }
.mp .mp-section--tight { padding: 48px 0; }
.mp .hp-alt { background: var(--d2-bg-1); }
.v-section { padding: clamp(56px, 7vw, 96px) 0; }
.v-section--tight { padding: clamp(32px, 4vw, 48px) 0; }
.v-section, .mp-section { scroll-margin-top: 88px; }
.v-crumbs { scroll-margin-top: 88px; }

/* ===== §4. ТЁМНАЯ СЕКЦИЯ-ЦИФРЫ .d2-band (разметка — INTEGRATION_V2.md §4) ===== */
.d2-band {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(70% 90% at 82% -20%, rgba(29, 78, 216, .18), transparent 60%),
    var(--d2-navy-900);
  color: #FFFFFF;
  padding: clamp(56px, 7vw, 88px) 0;
  border-top: 1px solid rgba(255, 255, 255, .08);
  border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.d2-band__head { max-width: 780px; margin: 0 auto 44px; text-align: center; }
.d2-band__kicker {
  display: inline-block;
  font-size: 12.5px;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, .6);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 999px;
  padding: 7px 12px;
}
.d2-band__title {
  font-family: var(--d2-font-display);
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.12;
  letter-spacing: -0.02em;
  margin: 16px 0 10px;
  color: #FFFFFF;
}
.d2-band__lead { color: rgba(255, 255, 255, .66); font-size: 16.5px; margin: 0; }
.d2-band__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid rgba(255, 255, 255, .08);
}
/* ячейки: .d2-stat (вариант VX4) и .d2-band__item (вариант VX5 home-v2) */
.d2-stat, .d2-band__item {
  padding: 30px 26px 6px;
  border-left: 1px solid rgba(255, 255, 255, .08);
}
.d2-stat:first-child, .d2-band__item:first-child { border-left: 0; }
.d2-stat__value, .d2-band__num {
  font-family: var(--d2-font-display);
  font-weight: 700;
  font-size: clamp(34px, 4.4vw, 56px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  font-variant-numeric: tabular-nums;
}
.d2-stat__value .d2-plus { color: var(--d2-red); }
.d2-stat__label, .d2-band__label {
  margin-top: 10px;
  color: rgba(255, 255, 255, .62);
  font-size: 14px;
  line-height: 1.45;
}

/* ===== §5. КАРТОЧКИ v2: рамка + sm-тень → hover md + lift =====
   (main.mp … / body.home-positive … — зеркала специфичности mainpage.css
   и home.css; наш файл позже каскадом — побеждаем) ===== */
.mp .mp-service-card, .mp .mp-card, .mp .mp-case,
main.mp .mp-service-card, main.mp .mp-card, main.mp .mp-case,
body.home-positive .mp .mp-service-card, body.home-positive .mp .mp-card, body.home-positive .mp .mp-case,
.v-card, .v-hub-card, .svc-card, .price-card {
  border: 1px solid var(--d2-border);
  border-radius: var(--d2-r-md);
  box-shadow: var(--d2-sh-sm);
  transition: transform .28s var(--d2-ease), box-shadow .28s var(--d2-ease),
    border-color .28s var(--d2-ease), background .28s var(--d2-ease);
}
.mp .mp-service-card:hover, .mp .mp-service-card:focus-within,
.mp .mp-card:hover, .mp .mp-case:hover,
main.mp .mp-service-card:hover, main.mp .mp-service-card:focus-within,
body.home-positive .mp .mp-service-card:hover, body.home-positive .mp .mp-service-card:focus-within,
.v-card:hover, .v-card:focus-within,
.v-hub-card:hover, .svc-card:hover, .price-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--d2-sh-md);
  border-color: rgba(227, 6, 19, .30);
  background-image: linear-gradient(160deg,
    rgba(29, 78, 216, .05) 0%, rgba(227, 6, 19, .04) 26%, transparent 52%);
}

/* «Подробнее →»: красная ссылка-стрелка, выезжает на hover */
.mp .mp-service-card__go, main.mp .mp-service-card__go,
body.home-positive .mp .mp-service-card__go,
.mp .mp-card__link, .v-card .d2-more,
.v-hub-card .d2-more, .svc-card .d2-more {
  color: var(--d2-red);
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
}
.mp .mp-service-card__go::after, .mp .mp-card__link::after, .d2-more::after {
  content: "→";
  display: inline-block;
  transform: translateX(0);
  opacity: .9;
  transition: transform .25s var(--d2-ease), opacity .25s var(--d2-ease);
}
.mp .mp-service-card:hover .mp-service-card__go::after,
.mp .mp-service-card:focus-within .mp-service-card__go::after,
.mp .mp-card:hover .mp-card__link::after,
.v-card:hover .d2-more::after, .v-hub-card:hover .d2-more::after,
.svc-card:hover .d2-more::after {
  transform: translateX(5px);
  opacity: 1;
}
.d2-more { opacity: 0; transform: translateY(4px); transition: opacity .25s var(--d2-ease), transform .25s var(--d2-ease); }
.v-card:hover .d2-more, .v-card:focus-within .d2-more,
.v-hub-card:hover .d2-more, .svc-card:hover .d2-more { opacity: 1; transform: none; }

/* price-таблицы/карточки: выделенная рекомендация */
.price-card--rec, .price-card.rec {
  border-color: rgba(227, 6, 19, .38);
  box-shadow: 0 8px 24px rgba(227, 6, 19, .10);
  position: relative;
}
.price-card--rec::before, .price-card.rec::before {
  content: attr(data-d2-badge);
  position: absolute;
  top: -12px;
  left: 18px;
  background: var(--d2-red);
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  padding: 6px 10px;
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(227, 6, 19, .3);
}
.v-table col.rec, .v-table .col-rec { background: var(--d2-red-soft); }
.v-table th.rec { color: var(--d2-red); }
.v-table td.rec { font-weight: 700; }

/* ===== §6. КНОПКИ v2: красный primary + ghost navy + focus-ring ===== */
.mp .mp-btn--primary, .mp .mp-btn.mp-btn--primary,
body.home-positive .mp .mp-btn--primary, main.mp .mp-btn--primary,
body .v-btn--cta, .v-btn.v-btn--cta {
  background: var(--d2-red);
  color: #FFFFFF;
  border: 1px solid var(--d2-red);
  border-radius: var(--d2-r-md);
  font-weight: 700;
  box-shadow: var(--d2-sh-sm);
  transition: background .2s var(--d2-ease), box-shadow .2s var(--d2-ease),
    transform .2s var(--d2-ease), border-color .2s var(--d2-ease);
}
.mp .mp-btn--primary:hover, .mp .mp-btn.mp-btn--primary:hover,
body.home-positive .mp .mp-btn--primary:hover, body.home-positive .mp .mp-btn--primary:focus-visible,
main.mp .mp-btn--primary:hover,
body .v-btn--cta:hover, .v-btn.v-btn--cta:hover {
  background: var(--d2-red-dark);
  border-color: var(--d2-red-dark);
  transform: translateY(-2px);
  box-shadow: var(--d2-glow-red);
}
.mp .mp-btn--primary:active, .mp .mp-btn.mp-btn--primary:active,
body.home-positive .mp .mp-btn--primary:active, main.mp .mp-btn--primary:active,
body .v-btn--cta:active, .v-btn.v-btn--cta:active {
  transform: translateY(0);
  box-shadow: var(--d2-sh-sm);
}
/* ghost: navy-обводка, hover — красная подложка + lift */
.mp .mp-btn--ghost, main.mp .mp-btn--ghost, body.home-positive .mp .mp-btn--ghost,
.v-btn.v-btn--ghost {
  background: transparent;
  color: var(--d2-navy);
  border: 1px solid var(--d2-border);
  border-radius: var(--d2-r-md);
  font-weight: 700;
  transition: background .2s var(--d2-ease), border-color .2s var(--d2-ease),
    transform .2s var(--d2-ease), box-shadow .2s var(--d2-ease);
}
.mp .mp-btn--ghost:hover, main.mp .mp-btn--ghost:hover,
body.home-positive .mp .mp-btn--ghost:hover, body.home-positive .mp .mp-btn--ghost:focus-visible,
.v-btn.v-btn--ghost:hover {
  background: var(--d2-red-soft);
  border-color: rgba(227, 6, 19, .35);
  color: var(--d2-red);
  transform: translateY(-2px);
  box-shadow: var(--d2-sh-sm);
}
.mp .mp-btn--primary:focus-visible, .mp .mp-btn--ghost:focus-visible,
.v-btn:focus-visible, .pt-mcell:focus-visible, .v-footer a:focus-visible {
  outline: 2px solid var(--d2-red);
  outline-offset: 2px;
  border-radius: var(--d2-r-sm);
}

/* ===== §7. МЕГА-МЕНЮ v2-полиш: чипы navy-50, hover-сдвиг + красный лайк ===== */
.pt-mega { border-radius: var(--d2-r-lg); box-shadow: var(--d2-sh-lg); }
.pt-mcell { border-radius: var(--d2-r-sm); }
.pt-mcell__chip {
  background: var(--d2-bg-2);
  border-color: var(--d2-border);
  border-radius: var(--d2-r-sm);
  color: var(--d2-navy);
}
.pt-mcell:hover, .pt-mcell:focus-visible {
  background: var(--d2-bg-1);
  transform: translateX(4px);
}
.pt-mcell:hover .pt-mcell__chip, .pt-mcell:focus-visible .pt-mcell__chip {
  background: var(--d2-red-soft);
  border-color: rgba(227, 6, 19, .3);
  color: var(--d2-red);
}
.pt-mcell:hover .pt-mcell__title, .pt-mcell:focus-visible .pt-mcell__title {
  color: var(--d2-red);
}
.pt-mcell--hub .pt-mcell__chip {
  background: var(--d2-navy);
  border-color: var(--d2-navy);
  color: #FFFFFF;
}
.pt-mcell--hub:hover .pt-mcell__chip {
  background: var(--d2-red);
  border-color: var(--d2-red);
  color: #FFFFFF;
}

/* ===== §8. ТАБЛИЦЫ v2: sticky-шапка, зебра, hover-строка ===== */
.v-table-wrap {
  border: 1px solid var(--d2-border);
  border-radius: var(--d2-r-md);
  box-shadow: var(--d2-sh-sm);
  overflow: auto;
  max-height: none;
  background: #FFFFFF;
}
.v-table { border: 0; }
.v-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--d2-bg-1);
  border-bottom: 1px solid var(--d2-border);
  font-family: var(--d2-font-display);
  font-weight: 600;
  letter-spacing: .01em;
  white-space: nowrap;
}
.v-table tbody tr:nth-child(even) { background: rgba(248, 250, 252, .8); }
.v-table tbody tr { transition: background .15s ease; }
.v-table tbody tr:hover { background: var(--d2-red-soft); }
.v-table td, .v-table th { border-color: var(--d2-border); }

/* ===== §9. КРОШКИ v2: слэши, hover красный ===== */
.v-crumbs ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.v-crumbs li { display: inline-flex; align-items: center; color: var(--d2-slate-600); font-size: 13px; }
.v-crumbs li + li::before {
  content: "/";
  margin-right: 10px;
  color: #94A3B8;
  font-weight: 400;
}
.v-crumbs a { color: var(--d2-slate-600); text-decoration: none; transition: color .15s ease; }
.v-crumbs a:hover, .v-crumbs a:focus-visible { color: var(--d2-red); }
.v-crumbs [aria-current="page"] { color: var(--d2-navy); font-weight: 700; }

/* ===== §10. ФУТЕР v2: navy-900, колонки, градиент-линия сверху =====
   (специфичность body .v-footer.v-footer ≥ home.css body.home-positive
   .hp-footer и ≥ theme-light .v-footer — побеждаем порядком каскада) ===== */
.v-footer, body .v-footer.v-footer {
  position: relative;
  background: var(--d2-navy-900);
  color: rgba(255, 255, 255, .72);
  border-top: 0;
  padding-top: 26px;
}
.v-footer::before, body .v-footer.v-footer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg,
    transparent 0%, var(--d2-red) 18%, var(--d2-info) 52%, var(--d2-red) 86%, transparent 100%);
  opacity: .85;
}
.v-footer h4, .v-footer h2, body .v-footer.v-footer h4, body .v-footer.v-footer h2 {
  color: #FFFFFF;
  font-family: var(--d2-font-display);
  letter-spacing: -0.01em;
}
.v-footer ul a, .v-footer__about, .v-footer .hp-footer__note, .v-footer p,
body .v-footer.v-footer ul a, body .v-footer.v-footer .hp-footer__note {
  color: rgba(255, 255, 255, .66);
}
.v-footer ul a {
  text-decoration: none;
  transition: color .18s ease, padding-left .18s ease;
}
.v-footer ul a:hover, .v-footer ul a:focus-visible { color: #FFFFFF; padding-left: 4px; }
.v-footer__bottom, body .v-footer.v-footer .v-footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, .08);
  color: rgba(255, 255, 255, .5);
}
.v-footer .v-logo, .v-footer .v-logo span { color: #FFFFFF; }
.v-footer .v-logo__mark {
  background: var(--d2-red);
  color: #FFFFFF;
}
.v-footer a { text-decoration-color: rgba(255, 255, 255, .35); }
.v-footer .hp-footer__kp a, .v-footer__kp a { color: rgba(255, 255, 255, .78); }
.v-footer .hp-footer__kp a:hover { color: #FFFFFF; }

/* ===== §11. СКРОЛЛ-ПРОГРЕСС: тонкая красная полоса (CSS scroll-timeline;
       фолбэк — d2.js, который сам создаёт #d2-progress при отсутствии) ===== */
.d2-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  z-index: 1100;
  pointer-events: none;
  background: linear-gradient(90deg, var(--d2-red), #FF3B47);
  transform-origin: 0 50%;
  transform: scaleX(0);
}
@supports (animation-timeline: scroll()) {
  html.d2-css .d2-progress, #d2-progress.d2-progress {
    animation: d2-progress-x linear both;
    animation-timeline: scroll(root block);
  }
  @keyframes d2-progress-x {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
  }
}

/* ===== §12. REVEAL v2: blur(4px)→0 + stagger (только при html.d2-js;
       без JS контент видим сразу; элементы — класс .d2-reveal от VX5/VX8) ===== */
html.d2-js .d2-reveal {
  opacity: 0;
  transform: translateY(16px);
  filter: blur(4px);
  transition: opacity .6s var(--d2-ease), transform .6s var(--d2-ease),
    filter .6s var(--d2-ease);
  transition-delay: calc(var(--d2-i, 0) * 70ms);
  will-change: opacity, transform, filter;
}
html.d2-js .d2-reveal.d2-in {
  opacity: 1;
  transform: none;
  filter: blur(0);
}

/* ===== §13. МЕЛОЧИ v2 ===== */
::selection { background: var(--d2-red-soft); color: var(--d2-red-dark); }
.d2-num, .mp .mp-stat__value, .d2-stat__value { font-variant-numeric: tabular-nums; }
.v-section-head .v-lead, .mp-lead { max-width: 68ch; }
details.mp-faq__item {
  border: 1px solid var(--d2-border);
  border-radius: var(--d2-r-md);
  box-shadow: var(--d2-sh-sm);
  transition: box-shadow .25s var(--d2-ease), border-color .25s var(--d2-ease);
}
details.mp-faq__item[open] {
  border-color: rgba(227, 6, 19, .25);
  box-shadow: var(--d2-sh-md);
}
.mp-faq__q { font-family: var(--d2-font-display); }

/* ===== §14. АДАПТИВ v2 ===== */
@media (max-width: 980px) {
  .d2-band__grid { grid-template-columns: repeat(2, 1fr); }
  .d2-stat:nth-child(odd), .d2-band__item:nth-child(odd) { border-left: 0; }
  .d2-stat:nth-child(n + 3), .d2-band__item:nth-child(n + 3) { border-top: 1px solid rgba(255, 255, 255, .08); }
}
@media (max-width: 640px) {
  .mp .mp-section { padding: 64px 0; }
  .mp .mp-section--tight { padding: 40px 0; }
  body.home-positive .mp .mp-hero__title, .mp .mp-hero__title, .v-h1 {
    font-size: clamp(34px, 9vw, 44px);
    letter-spacing: -0.015em;
  }
  .d2-band__grid { grid-template-columns: 1fr; }
  .d2-stat, .d2-band__item { border-left: 0; border-top: 1px solid rgba(255, 255, 255, .08); padding: 22px 6px 4px; }
  .d2-stat:first-child, .d2-band__item:first-child { border-top: 0; }
  .mp-hero .d2-logos { gap: 12px 22px; }
  .d2-logos__row { gap: 12px 26px; }
  .d2-logos__row a { font-size: 18px; }
  .v-table thead th { position: static; }
}

/* ===== §15. ДОСТУПНОСТЬ: без движения ===== */
@media (prefers-reduced-motion: reduce) {
  .mp .mp-service-card, .mp .mp-card, .mp .mp-case, .v-card, .v-hub-card,
  .svc-card, .price-card, .mp-btn, .v-btn, .pt-mcell, .v-table tbody tr,
  .v-footer ul a, .d2-logos__item {
    transition: none !important;
  }
  .mp .mp-service-card:hover, .mp .mp-card:hover, .mp .mp-case:hover,
  .v-card:hover, .v-hub-card:hover, .svc-card:hover, .price-card:hover,
  .mp .mp-btn--primary:hover, body .v-btn--cta:hover,
  .mp .mp-btn--ghost:hover, .v-btn.v-btn--ghost:hover {
    transform: none;
  }
  html.d2-js .d2-reveal {
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
  }
  .d2-progress { display: none; }
}

/* ===== VX-HOTFIX (оркестратор): тёмные футеры + тач-таргеты ===== */
/* 1) вторичная подпись в тёмном футере (перекрывает VD10-оверайд из theme-light) */
.v-footer p.v-footer__about,
body p.v-footer__about{color:#B9C6DB !important}
/* 2) логотип-линк стабильной высоты */
.pt-logo{display:inline-flex;align-items:center;min-height:44px}
/* 3) тач-таргеты чипов/линков-хвостов на тач-устройствах */
@media (pointer:coarse){
  .d2-chips a, .d2-chip{display:inline-flex;align-items:center;min-height:44px}
  .v-hub-more a, a.v-hub-more, .hub-more a, main a[href*="/tehnologii/"], main a[href*="/uslugi/"][class*="more"]{display:inline-flex;align-items:center;min-height:44px}
}

/* VX-HOTFIX-2: инлайн-линки списков и мелкие пункты — тач-зона 44px */
@media (pointer:coarse){
  main a{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
  main a:not([class]){padding:2px 0}
}

/* VX-HOTFIX-3: тач-таргеты в зоне хедера (дроп-листы, мега-линки) */
@media (pointer:coarse){
  .pt-header a, .pt-drop__list a, .pt-mega__all, .pt-nav a{display:inline-flex;align-items:center;min-height:44px}
}

/* VX-HOTFIX-4: ширина тап-зон коротких пунктов меню + крестик */
@media (pointer:coarse){
  .pt-header a, .pt-header button{min-width:44px}
  .pt-header button[aria-label*="акрыть"], .pt-header button[aria-label="Close"], .pt-header .pt-close{min-width:44px;min-height:44px}
}
/* ===== VX-HOTFIX-5 (VX16 CLS-FIX, 2026-09-19): /uslugi/ mobile CLS 0.13 -> <0.1 ===== */
/* Причина по замерам PerformanceObserver 390x844: поздний свап веб-шрифтов (PT Sans/Inter,
   gstatic) реформирует кириллицу: .v-lead 132->106px, .quick-answer 351->324px — весь контент
   ниже прыгает вверх одним кадром (entry 0.1336). Плюс «щель» .sticky-cta 4-9px у нижней
   границы вьюпорта до первого скролла. Reveal-анимация (transform) CLS не создаёт — проверено. */
/* 5a: резерв высоты до свапа шрифта — только /uslugi/ (body.pg-uslugi), только мобильный */
@media (max-width: 860px) {
  body.pg-uslugi .v-lead { min-height: 132px; }      /* fallback-шрифт: 4 строки */
  body.pg-uslugi .quick-answer { min-height: 351px; } /* fallback-шрифт: taller box */
}
/* 5b: sticky-cta — не показывать (и не сдвигать) плашку до порога скролла 480px */
.sticky-cta:not(.is-on) { visibility: hidden; }
/* 5c: квиз/d2-chips/svc-grid — сдвигов во вьюпорте не зафиксировано (ниже-fold), резерв не требуется */