/* Original published geometry, isolated from historic concept selectors. */
body.brand-motion.modern-home #napravleniya.bm-triad{max-width:none;margin:0;padding:0!important;background:var(--bm-gold)!important;--np-skos:12vh!important;--kap-gold:var(--bm-gold)}
@media(min-width:1280px){body.brand-motion.modern-home #napravleniya.bm-triad{--np-skos:18vh!important}}
@media(min-width:1536px){body.brand-motion.modern-home #napravleniya.bm-triad{--np-skos:22vh!important}}
.bm-triad { --np-skos: 12vh; position: relative; }
.bm-triad-lenta {
  display: flex; position: relative; overflow: hidden;
  height: 100svh; min-height: 620px;
}
.bm-triad-seg {
  flex: 1 1 0; position: relative; overflow: hidden;
  margin-left: calc(var(--np-skos) * -1);
  background: var(--kap-gold);
  text-decoration: none;
  clip-path: polygon(var(--np-skos) 0, 100% 0,
                     calc(100% - var(--np-skos)) 100%, 0 100%);
  transition: flex-grow .45s cubic-bezier(.22,.61,.36,1);
}
.bm-triad-seg:first-child {
  margin-left: 0;
  clip-path: polygon(0 0, 100% 0, calc(100% - var(--np-skos)) 100%, 0 100%);
}
.bm-triad-seg:last-child {
  clip-path: polygon(var(--np-skos) 0, 100% 0, 100% 100%, 0 100%);
}
.bm-triad-holst {
  position: absolute; inset: 0; display: block;
  clip-path: polygon(calc(var(--np-skos) + 2px) 0, calc(100% - 2px) 0,
                     calc(100% - var(--np-skos) - 2px) 100%, 2px 100%);
}
.bm-triad-seg:first-child .bm-triad-holst {
  clip-path: polygon(0 0, calc(100% - 2px) 0,
                     calc(100% - var(--np-skos) - 2px) 100%, 0 100%);
}
.bm-triad-seg:last-child .bm-triad-holst {
  clip-path: polygon(calc(var(--np-skos) + 2px) 0, 100% 0, 100% 100%, 2px 100%);
}
.bm-triad-foto {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}
.bm-triad-tuman { position: absolute; inset: 0; display: block; }
.bm-triad-seg--nedvizhimost .bm-triad-tuman {
  background: linear-gradient(180deg, rgba(255,255,255,.82) 0%,
              rgba(255,255,255,.74) 55%, rgba(255,255,255,.10) 100%);
}
.bm-triad-seg--investicii .bm-triad-tuman,
.bm-triad-seg--aktivy .bm-triad-tuman {
  background: linear-gradient(180deg, rgba(11,18,32,.84) 0%,
              rgba(11,18,32,.74) 55%, rgba(11,18,32,.08) 100%);
}
.bm-triad-telo {
  position: relative; z-index: 2; display: flex; flex-direction: column;
  height: 100%;
  padding: clamp(80px, 12vh, 140px) 40px 0 calc(var(--np-skos) + 40px);
}
.bm-triad-seg:first-child .bm-triad-telo { padding-left: 40px; }
.bm-triad-nadzag {
  display: flex; align-items: center; gap: 12px;
  font-size: 12px; font-weight: 600; letter-spacing: .22em;
  text-transform: uppercase; margin-bottom: 14px;
}
.bm-triad-usik { display: block; width: 34px; height: 1px; background: var(--kap-gold); }
.bm-triad-imya {
  font-size: clamp(26px, 2.6vw, 46px); font-weight: 700; line-height: 1.05;
  letter-spacing: -.01em; margin: 0 0 18px;
  overflow-wrap: normal;
}
.bm-triad-slovo { text-transform: uppercase; }
.bm-triad-razdelitel { color: var(--kap-gold); opacity: .45; font-weight: 400; }
.bm-triad-marka { font-weight: 400; opacity: .78; }
.bm-triad-opisanie { font-size: clamp(14px, .95vw, 16px); line-height: 1.6; margin: 0; max-width: 34ch; }
.bm-triad-podrobno {
  display: grid; grid-template-rows: 0fr; opacity: 0;
  transition: grid-template-rows .4s ease, opacity .3s ease .1s;
}
.bm-triad-podrobno-telo { overflow: hidden; }
.bm-triad-podzag {
  display: block; font-size: clamp(15px, 1.15vw, 19px); font-weight: 700;
  line-height: 1.3; padding-top: 18px; max-width: 30ch;
}
.bm-triad-podrobno-tekst {
  display: block; font-size: 14px; line-height: 1.65; padding-top: 10px; max-width: 42ch;
}
.bm-triad-akcent {
  display: block; margin-top: 14px; padding: 10px 14px; border-radius: 12px;
  background: rgba(201,164,92,.14); border: 1px solid rgba(201,164,92,.42);
  font-size: 13px; font-weight: 600; line-height: 1.45; max-width: 34ch;
}
.bm-triad-dalshe {
  display: inline-flex; align-items: center; gap: 10px; margin-top: 24px;
  font-size: 14px; font-weight: 600; letter-spacing: .04em;
  border-bottom: 1px solid var(--kap-gold); padding-bottom: 6px; align-self: flex-start;
}
.bm-triad-dalshe svg { width: 18px; height: 18px; transition: transform .3s ease; }
.bm-triad-seg:hover .bm-triad-dalshe svg { transform: translateX(5px); }
.bm-triad-seg--nedvizhimost { color: #0B1220; }
.bm-triad-seg--nedvizhimost .bm-triad-nadzag,
.bm-triad-seg--nedvizhimost .bm-triad-opisanie,
.bm-triad-seg--nedvizhimost .bm-triad-podrobno-tekst { color: #334155; }
.bm-triad-seg--investicii, .bm-triad-seg--aktivy { color: #FFFFFF; }
.bm-triad-seg--investicii .bm-triad-nadzag, .bm-triad-seg--aktivy .bm-triad-nadzag,
.bm-triad-seg--investicii .bm-triad-opisanie, .bm-triad-seg--aktivy .bm-triad-opisanie,
.bm-triad-seg--investicii .bm-triad-podrobno-tekst, .bm-triad-seg--aktivy .bm-triad-podrobno-tekst { color: #E2E8F0; }
.bm-triad-seg--investicii .bm-triad-akcent, .bm-triad-seg--aktivy .bm-triad-akcent { color: #EED9A8; }
.bm-triad-seg:focus-visible { outline: 2px solid var(--kap-gold); outline-offset: -8px; }
@media (min-width: 1280px) { .bm-triad { --np-skos: 18vh; } }
@media (min-width: 1536px) { .bm-triad { --np-skos: 22vh; } }
.bm-triad-lenta:has(.bm-triad-seg:is(:hover, :focus-visible)) .bm-triad-seg { flex-grow: .75; }
.bm-triad-lenta:has(.bm-triad-seg:is(:hover, :focus-visible)) .bm-triad-seg:is(:hover, :focus-visible) { flex-grow: 1.5; }
.bm-triad-seg:is(:hover, :focus-visible) .bm-triad-podrobno {
  grid-template-rows: 1fr; opacity: 1;
}
.bm-triad-lenta:has(.bm-triad-seg:is(:hover, :focus-visible))
  .bm-triad-seg:not(:hover):not(:focus-visible) .bm-triad-imya {
  font-size: 15px;
}
.bm-triad-lenta:has(.bm-triad-seg:is(:hover, :focus-visible))
  .bm-triad-seg:not(:hover):not(:focus-visible) .bm-triad-nadzag {
  font-size: 9px;
}
@media (max-width: 1023.98px) {
  .bm-triad-lenta { display: block; height: auto; min-height: 0; }
  .bm-triad-seg {
    display: block; margin-left: 0; width: 100%;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4vh), 0 100%);
    margin-bottom: -2vh; padding-bottom: 4vh;
  }
  .bm-triad-seg:first-child {
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4vh), 0 100%);
  }
  .bm-triad-seg:last-child { clip-path: none; margin-bottom: 0; padding-bottom: 0; }
  .bm-triad-holst, .bm-triad-seg:first-child .bm-triad-holst, .bm-triad-seg:last-child .bm-triad-holst {
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4vh - 2px), 0 calc(100% - 2px));
  }
  .bm-triad-seg:last-child .bm-triad-holst { clip-path: none; }
  .bm-triad-telo { padding: 44px 20px 52px; height: auto; }
  .bm-triad-seg:first-child .bm-triad-telo { padding-left: 20px; }
  .bm-triad-podrobno { grid-template-rows: 1fr; opacity: 1; }
  .bm-triad-opisanie, .bm-triad-podrobno-tekst { max-width: none; }
  .bm-triad-seg--nedvizhimost .bm-triad-tuman {
    background: linear-gradient(180deg, rgba(255,255,255,.82) 0%,
                rgba(255,255,255,.74) 90%, rgba(255,255,255,.10) 100%);
  }
  .bm-triad-seg--investicii .bm-triad-tuman,
  .bm-triad-seg--aktivy .bm-triad-tuman {
    background: linear-gradient(180deg, rgba(11,18,32,.84) 0%,
                rgba(11,18,32,.74) 90%, rgba(11,18,32,.08) 100%);
  }
}
@media (hover: none) {
  .bm-triad-podrobno { grid-template-rows: 1fr; opacity: 1; }
}
/* Brand polish changes typography and timing, never the polygon or flex ratios. */
.brand-motion .bm-triad-seg{transition:flex-grow .65s cubic-bezier(.22,.75,.22,1)}
.brand-motion .bm-triad-imya{font-family:Inter,Arial,sans-serif!important;line-height:1.08;font-weight:750;letter-spacing:-.04em!important;text-wrap:initial}
.bm-triad-marka{display:block;font-size:max(12px,.52em);letter-spacing:.015em;margin-bottom:8px;opacity:.85}
.bm-triad-razdelitel{display:inline;font-size:.7em}
.bm-triad-slovo{text-transform:none}
.bm-triad-podrobno{transition:grid-template-rows .55s cubic-bezier(.22,.75,.22,1),opacity .4s ease .12s}
.bm-triad-podrobno-telo{transform:translateY(10px);transition:transform .55s cubic-bezier(.22,.75,.22,1)}
.bm-triad-seg:is(:hover,:focus-visible) .bm-triad-podrobno-telo{transform:translateY(0)}
.bm-triad-akcent{border-radius:0;background:#C99C541C;border-color:#C99C5466}
.bm-triad-dalshe{min-height:44px;font-size:13px}
.bm-triad-seg--nedvizhimost{color:var(--bm-ink)}
.bm-triad-seg--nedvizhimost :is(.bm-triad-nadzag,.bm-triad-opisanie,.bm-triad-podrobno-tekst){color:#334155}
.bm-triad-seg--investicii .bm-triad-tuman,.bm-triad-seg--aktivy .bm-triad-tuman{background:linear-gradient(180deg,rgba(7,21,46,.89),rgba(7,21,46,.8) 65%,rgba(16,42,73,.22))}
.bm-triad-seg--nedvizhimost .bm-triad-holst,body.brand-motion .np-geroy--nedvizhimost .np-geroy-holst{view-transition-name:napravlenie-nedvizhimost!important}
.bm-triad-seg--investicii .bm-triad-holst,body.brand-motion .np-geroy--investicii .np-geroy-holst{view-transition-name:napravlenie-investicii!important}
.bm-triad-seg--aktivy .bm-triad-holst,body.brand-motion .np-geroy--aktivy .np-geroy-holst{view-transition-name:napravlenie-aktivy!important}
@media(max-width:1023.98px){.bm-triad-podrobno-telo{transform:none}.bm-triad-seg--investicii .bm-triad-tuman,.bm-triad-seg--aktivy .bm-triad-tuman{background:linear-gradient(180deg,rgba(7,21,46,.89),rgba(7,21,46,.8) 90%,rgba(16,42,73,.22))}}
@media(hover:none){.bm-triad-podrobno-telo{transform:none}}
html[data-bm-motion="paused"] :is(.bm-triad-holst,.np-geroy-holst){view-transition-name:none!important}
html[data-bm-motion="paused"] .bm-triad-seg,html[data-bm-motion="paused"] .bm-triad-seg *{transition:none!important}
@media(prefers-reduced-motion:reduce){body.brand-motion :is(.bm-triad-holst,.np-geroy-holst){view-transition-name:none!important}.bm-triad-podrobno-telo{transform:none}}

/* ==========================================================================
   Компенсация живой разметки (fix-раунд 1 задачи 6, 17.10.2026).
   В живой разметке np-классы сохранены рядом с bm-triad-* (стражи
   dostupne/blok_napravleniy и селектор аналитики a.np-seg требуют их
   присутствия). Базовые правила motion.css (#napravleniya, строки 9-11)
   матчат живые np-* и глушат механику эталона: flex:auto!important,
   podrobno 1fr!important, прямоугольные карточки вместо клиньев.
   В эталоне (prototypes/motion/triad.css:109-113, docs/redesign/
   2026-10-16-original-geometry.md — категорическое требование заказчика)
   базовые правила под этот блок не пишутся: там разметка заменена на
   bm-triad-*. Эти правила восстанавливают эталонные пропорции
   1.5 / 0.75 / 0.75 и раскрытие podrobno на hover/focus; touch и
   мобильный шаг (<1024px) — всегда открыто (базовые правила там и так
   открывают podrobno). Специфичность выше базовых (np-класс удвоен
   bm-классом), !important — зеркально базовым. Медиа-охват как в эталоне:
   только десктоп с hover-указателем.
   ========================================================================== */
@media (min-width: 1024px) and (hover: hover) and (pointer: fine) {
  /* лента — flex-полоса клиньев во всю высоту (не сетка карточек) */
  .brand-motion #napravleniya .np-lenta.bm-triad-lenta {
    display: flex !important;
    grid-template-columns: none !important;
    height: 100svh; min-height: 620px;
    gap: 0; overflow: hidden;
  }
  /* сегмент — клин с нахлёстом и золотой подложкой стыка */
  .brand-motion #napravleniya .np-seg.bm-triad-seg {
    flex: 1 1 0 !important;
    margin: 0 0 0 calc(var(--np-skos) * -1) !important;
    clip-path: polygon(var(--np-skos) 0, 100% 0,
                       calc(100% - var(--np-skos)) 100%, 0 100%) !important;
    background: var(--kap-gold) !important;
    border: 0;
    transition: flex-grow .65s cubic-bezier(.22, .75, .22, 1);
    overflow: hidden;
  }
  .brand-motion #napravleniya .np-seg.bm-triad-seg:first-child {
    margin-left: 0 !important;
    clip-path: polygon(0 0, 100% 0, calc(100% - var(--np-skos)) 100%, 0 100%) !important;
  }
  .brand-motion #napravleniya .np-seg.bm-triad-seg:last-child {
    clip-path: polygon(var(--np-skos) 0, 100% 0, 100% 100%, 0 100%) !important;
  }
  /* холст — абсолютная подложка с полигоном, сдвинутым внутрь на 2px */
  .brand-motion #napravleniya .np-holst.bm-triad-holst {
    position: absolute !important;
    inset: 0 !important;
    display: block;
    height: auto; min-height: 0;
    clip-path: polygon(calc(var(--np-skos) + 2px) 0, calc(100% - 2px) 0,
                       calc(100% - var(--np-skos) - 2px) 100%, 2px 100%) !important;
  }
  .brand-motion #napravleniya .np-seg:first-child .np-holst.bm-triad-holst {
    clip-path: polygon(0 0, calc(100% - 2px) 0,
                       calc(100% - var(--np-skos) - 2px) 100%, 0 100%) !important;
  }
  .brand-motion #napravleniya .np-seg:last-child .np-holst.bm-triad-holst {
    clip-path: polygon(calc(var(--np-skos) + 2px) 0, 100% 0, 100% 100%, 2px 100%) !important;
  }
  /* фото — без зума карточного вида; туман возвращён (контраст текста на фото) */
  .brand-motion #napravleniya .np-foto.bm-triad-foto,
  .brand-motion #napravleniya .np-seg:hover .np-foto.bm-triad-foto {
    transform: none !important;
  }
  .brand-motion #napravleniya .np-tuman.bm-triad-tuman {
    display: block !important;
  }
  /* тело — колонка на всю высоту клина с клиновидным левым отступом */
  .brand-motion #napravleniya .np-telo.bm-triad-telo {
    position: relative; z-index: 2;
    display: flex; flex-direction: column;
    height: 100% !important; min-height: 0; flex: none;
    padding: clamp(80px, 12vh, 140px) 40px 0 calc(var(--np-skos) + 40px) !important;
    color: inherit !important;
  }
  .brand-motion #napravleniya .np-seg:first-child .np-telo.bm-triad-telo {
    padding-left: 40px !important;
  }
  /* механика эталона: покой — podrobno свёрнут (0fr) */
  .brand-motion #napravleniya .np-podrobno.bm-triad-podrobno {
    grid-template-rows: 0fr !important;
    opacity: 0 !important;
  }
  .brand-motion #napravleniya .np-podrobno-telo.bm-triad-podrobno-telo {
    overflow: hidden !important;
  }
  /* механика эталона: hover/focus — пропорции 1.5 против 0.75 */
  .brand-motion #napravleniya .np-lenta.bm-triad-lenta:has(
      .np-seg.bm-triad-seg:is(:hover, :focus-visible))
    .np-seg.bm-triad-seg { flex-grow: .75 !important; }
  .brand-motion #napravleniya .np-lenta.bm-triad-lenta:has(
      .np-seg.bm-triad-seg:is(:hover, :focus-visible))
    .np-seg.bm-triad-seg:is(:hover, :focus-visible) { flex-grow: 1.5 !important; }
  .brand-motion #napravleniya .np-seg.bm-triad-seg:is(:hover, :focus-visible)
    .np-podrobno.bm-triad-podrobno {
    grid-template-rows: 1fr !important;
    opacity: 1 !important;
  }
  /* сжатые соседи — мелкий надзаголовок (эталон, строки 118-121);
     имя сжимается правилом .bm-triad-imya 15px самого triad.css */
  .brand-motion #napravleniya .np-lenta.bm-triad-lenta:has(
      .np-seg.bm-triad-seg:is(:hover, :focus-visible))
    .np-seg.bm-triad-seg:not(:hover):not(:focus-visible)
    .np-nadzag.bm-triad-nadzag { font-size: 9px !important; }
  /* типографика клина по эталону (перебой карточных кеглей motion.css) */
  .brand-motion #napravleniya .np-nadzag.bm-triad-nadzag {
    font-size: 12px; letter-spacing: .22em; margin-bottom: 14px;
  }
  .brand-motion #napravleniya .np-marka.bm-triad-marka {
    font-size: max(12px, .52em) !important; color: inherit;
    letter-spacing: .015em; margin-bottom: 8px; opacity: .85;
    display: block;
  }
  .brand-motion #napravleniya .np-slovo.bm-triad-slovo {
    font-size: inherit !important; font-weight: inherit !important;
    letter-spacing: -.01em;
  }
  .brand-motion #napravleniya .np-opisanie.bm-triad-opisanie {
    font-size: clamp(14px, .95vw, 16px) !important; line-height: 1.6 !important;
    min-height: 0 !important; max-width: 34ch; color: inherit !important;
  }
  .brand-motion #napravleniya .np-podzag.bm-triad-podzag {
    font-size: clamp(15px, 1.15vw, 19px) !important; font-weight: 700 !important;
    line-height: 1.3 !important; padding-top: 18px !important; margin-top: 0 !important;
    max-width: 30ch; color: inherit !important;
  }
  .brand-motion #napravleniya .np-podrobno-tekst.bm-triad-podrobno-tekst {
    font-size: 14px !important; line-height: 1.65 !important;
    max-width: 42ch; color: inherit !important;
  }
  .brand-motion #napravleniya .np-dalshe.bm-triad-dalshe {
    color: inherit !important; margin-top: 24px;
  }
  .brand-motion #napravleniya .np-dalshe.bm-triad-dalshe svg {
    color: inherit;
  }
  /* цвета сегментов эталона: недвижимость — светлый туман, прочие — тёмные */
  .brand-motion #napravleniya .np-seg.bm-triad-seg--nedvizhimost { color: #0B1220 !important; }
  .brand-motion #napravleniya .np-seg.bm-triad-seg--nedvizhimost .np-nadzag,
  .brand-motion #napravleniya .np-seg.bm-triad-seg--nedvizhimost .np-opisanie,
  .brand-motion #napravleniya .np-seg.bm-triad-seg--nedvizhimost .np-podrobno-tekst {
    color: #334155 !important;
  }
  .brand-motion #napravleniya .np-seg.bm-triad-seg--investicii,
  .brand-motion #napravleniya .np-seg.bm-triad-seg--aktivy { color: #FFFFFF !important; }
  .brand-motion #napravleniya .np-seg.bm-triad-seg--investicii .np-nadzag,
  .brand-motion #napravleniya .np-seg.bm-triad-seg--aktivy .np-nadzag,
  .brand-motion #napravleniya .np-seg.bm-triad-seg--investicii .np-opisanie,
  .brand-motion #napravleniya .np-seg.bm-triad-seg--aktivy .np-opisanie,
  .brand-motion #napravleniya .np-seg.bm-triad-seg--investicii .np-podrobno-tekst,
  .brand-motion #napravleniya .np-seg.bm-triad-seg--aktivy .np-podrobno-tekst {
    color: #E2E8F0 !important;
  }
}
