/*!
  SC SIEM product demos — namespaced marketing runtime.
  Tokens live on .siem-product-demos only. Do not leak into Bootstrap/.btn/.table.
*/

.siem-product-demos {
  --siem-demo-text: #333;
  --siem-demo-muted: #777;
  --siem-demo-line: #e3e3e3;
  --siem-demo-line-soft: #eee;
  --siem-demo-soft: #fafafa;
  --siem-demo-hover: #f4f4f4;
  --siem-demo-bg: #ececec;
  --siem-demo-surface: #ffffff;
  --siem-demo-surface-subtle: #f7f8fa;
  --siem-demo-white: #fff;
  --siem-demo-low: #739e73;
  --siem-demo-medium: #c79121;
  --siem-demo-high: #dc3545;
  --siem-demo-high-icon: #a90329;
  --siem-demo-highest: #e62b57;
  --siem-demo-info: #3276b1;
  --siem-demo-tool: #5b9bd5;
  --siem-demo-note: #70ad47;
  --siem-demo-progress-done: #2e7d32;
  --siem-demo-radius: 4px;
  --siem-demo-radius-card: 6px;
  --siem-demo-shadow: 0 5px 15px rgba(0, 0, 0, .14);
  --siem-demo-ease: cubic-bezier(.16, 1, .3, 1);
  --siem-demo-motion-fast: .12s;
  --siem-demo-motion-base: .35s;
  --siem-demo-motion-slow: .4s;
  --siem-demo-font: "Segoe UI", system-ui, -apple-system, sans-serif;
  --scsiem-text: var(--siem-demo-text);
  --scsiem-muted: var(--siem-demo-muted);
  --scsiem-line: var(--siem-demo-line);
  --scsiem-line-soft: var(--siem-demo-line-soft);
  --scsiem-soft: var(--siem-demo-soft);
  --scsiem-hover: var(--siem-demo-hover);
  --scsiem-bg: var(--siem-demo-bg);
  --scsiem-white: var(--siem-demo-white);
  --scsiem-low: var(--siem-demo-low);
  --scsiem-medium: var(--siem-demo-medium);
  --scsiem-high: var(--siem-demo-high);
  --scsiem-high-icon: var(--siem-demo-high-icon);
  --scsiem-highest: var(--siem-demo-highest);
  --scsiem-info: var(--siem-demo-info);
  --scsiem-tool: var(--siem-demo-tool);
  --scsiem-note: var(--siem-demo-note);
  --scsiem-progress-done: var(--siem-demo-progress-done);
  --scsiem-radius: var(--siem-demo-radius);
  --scsiem-radius-card: var(--siem-demo-radius-card);
  --scsiem-shadow: var(--siem-demo-shadow);
  --scsiem-ease: var(--siem-demo-ease);
  --scsiem-motion-fast: var(--siem-demo-motion-fast);
  --scsiem-motion-base: var(--siem-demo-motion-base);
  --scsiem-motion-slow: var(--siem-demo-motion-slow);
  --scsiem-font: var(--siem-demo-font);
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  font-family: var(--siem-demo-font);
  color: var(--siem-demo-text);
  font-size: 13px;
  line-height: 1.45;
  text-align: left;
}

.siem-product-demos *,
.siem-product-demos *::before,
.siem-product-demos *::after { box-sizing: border-box; }

.siem-product-demos code {
  font-family: Consolas, "Segoe UI Mono", ui-monospace, monospace;
  font-size: 12px;
  color: #333;
  background: transparent;
  padding: 0;
}

.siem-product-demos h1,
.siem-product-demos h2,
.siem-product-demos h3,
.siem-product-demos p,
.siem-product-demos ul,
.siem-product-demos ol,
.siem-product-demos li,
.siem-product-demos table,
.siem-product-demos th,
.siem-product-demos td,
.siem-product-demos button,
.siem-product-demos input {
  font-family: inherit;
  letter-spacing: 0;
  text-transform: none;
}

.siem-demo { min-width: 0; }

.siem-demo-ai { min-height: 268px; }
.siem-demo-correlation { min-height: 292px; }
.siem-demo-search { min-height: 248px; }
.siem-demo-incident { min-height: 188px; }
.siem-demo-enrichment { min-height: 220px; }
.siem-demo-assets { min-height: 188px; }

.siem-product-demos .scsiem-card {
  background: var(--scsiem-white);
  border: 1px solid rgba(0, 0, 0, .18);
  border-radius: var(--scsiem-radius-card);
  box-shadow: var(--scsiem-shadow);
  overflow: hidden;
  width: 100%;
  max-width: 100%;
}

.siem-product-demos .scsiem-card-titlebar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px 8px;
  border-bottom: 1px solid var(--scsiem-line-soft);
  background: #fff;
}

.siem-product-demos .scsiem-card-title {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-width: 0;
}

.siem-product-demos .scsiem-card-title h1,
.siem-product-demos .scsiem-card-title h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--scsiem-text);
}

.siem-product-demos .scsiem-card-title p {
  margin: 4px 0 0;
  color: var(--scsiem-muted);
  font-size: 12.5px;
}

.siem-product-demos .scsiem-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin-top: 2px;
  color: var(--scsiem-info);
}

.siem-product-demos .scsiem-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
}

.siem-product-demos .scsiem-label {
  display: inline-block;
  padding: 2px 7px;
  border-radius: 2px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.4;
  color: #fff;
  white-space: nowrap;
}

.siem-product-demos .scsiem-label-high { background: var(--scsiem-high); }
.siem-product-demos .scsiem-label-medium { background: var(--scsiem-medium); }
.siem-product-demos .scsiem-label-low { background: var(--scsiem-low); }
.siem-product-demos .scsiem-label-status { background: #888; }
.siem-product-demos .scsiem-label-sid {
  background: #f4f4f4;
  color: #555;
  font-weight: 600;
  border: 1px solid var(--scsiem-line);
}

.siem-product-demos .scsiem-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--scsiem-line-soft);
  background: #fbfbfb;
}

.siem-product-demos .scsiem-tabs {
  display: flex;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.siem-product-demos .scsiem-tab {
  appearance: none;
  border: 1px solid transparent;
  border-bottom: 0;
  background: transparent;
  color: #555;
  font: inherit;
  font-size: 13px;
  padding: 7px 14px;
  cursor: pointer;
  border-radius: 3px 3px 0 0;
}

.siem-product-demos .scsiem-tab:hover { color: #111; }
/* Цвет рамки фокуса переведён на канонический из общей дизайн-системы:
   синяя рамка была единственным местом на сайте с другим цветом фокуса.
   Отступ оставлен 1px вместо канонических 3px — в плотном интерфейсе
   консоли рамка с отступом 3px перекрывает соседние вкладки. */
.siem-product-demos .scsiem-tab:focus-visible {
  outline: var(--itb-focus-width, 2px) solid var(--itb-focus-color, #dc3545);
  outline-offset: 1px;
}

.siem-product-demos .scsiem-tab.is-active {
  background: #fff;
  border-color: var(--scsiem-line);
  color: #111;
  font-weight: 600;
  position: relative;
  z-index: 1;
  margin-bottom: -1px;
}

.siem-product-demos .scsiem-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #ccc;
  background: #f6f6f6;
  color: #333;
  font: inherit;
  font-size: 12.5px;
  padding: 5px 10px;
  border-radius: 3px;
  cursor: pointer;
  line-height: 1.2;
  box-shadow: none;
}

.siem-product-demos .scsiem-btn[hidden] { display: none !important; }

.siem-product-demos .scsiem-btn:hover { background: #eee; }
/* То же основание, что и у вкладок выше. */
.siem-product-demos .scsiem-btn:focus-visible {
  outline: var(--itb-focus-width, 2px) solid var(--itb-focus-color, #dc3545);
  outline-offset: 1px;
}

.siem-product-demos .scsiem-btn svg {
  width: 14px;
  height: 14px;
}

.siem-product-demos .scsiem-btn.is-pressed {
  transform: scale(.97);
  background: #e8e8e8;
}

.siem-product-demos .scsiem-btn.is-busy {
  background: #eef5fb;
  border-color: #b7d3ea;
  color: #24557a;
}

.siem-product-demos .scsiem-btn.is-done {
  background: #edf6ee;
  border-color: #c5e0c6;
  color: var(--scsiem-progress-done);
}

.siem-product-demos .scsiem-body { padding: 10px 14px 12px; }
.siem-product-demos .scsiem-pane[hidden] { display: none !important; }

.siem-product-demos .scsiem-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border: 1px solid #ddd;
  margin: 0;
  background: #fff;
}

.siem-product-demos .scsiem-table th,
.siem-product-demos .scsiem-table td {
  padding: 6px 10px;
  border-bottom: 1px solid #eee;
  text-align: left;
  vertical-align: top;
  word-break: break-word;
  overflow-wrap: anywhere;
  color: var(--scsiem-text);
}

.siem-product-demos .scsiem-table th {
  background: #f7f7f7;
  color: #555;
  font-weight: 600;
  font-size: 12px;
}

.siem-product-demos .scsiem-table tr:last-child th,
.siem-product-demos .scsiem-table tr:last-child td { border-bottom: 0; }

.siem-product-demos .scsiem-col h2 {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--scsiem-text);
}

.siem-product-demos .scsiem-timeline {
  position: relative;
  margin: 0;
  padding: 0 0 4px;
  list-style: none;
}

.siem-product-demos .scsiem-timeline::before {
  content: "";
  position: absolute;
  left: 78px;
  top: 4px;
  bottom: 4px;
  width: 2px;
  background: var(--scsiem-line-soft);
}

.siem-product-demos .scsiem-tl-item {
  position: relative;
  padding: 6px 0;
  overflow: hidden;
  opacity: 0;
  transform: translateY(6px);
}

.siem-product-demos .scsiem-tl-item.is-visible {
  opacity: 1;
  transform: none;
  transition: opacity var(--scsiem-motion-base) var(--scsiem-ease), transform var(--scsiem-motion-base) var(--scsiem-ease);
}

.siem-product-demos .scsiem-tl-item.is-new { background: #fafafa; }

.siem-product-demos .scsiem-tl-time {
  float: left;
  width: 62px;
  text-align: right;
  font-size: 11px;
  font-style: italic;
  color: var(--scsiem-muted);
  padding-top: 6px;
}

.siem-product-demos .scsiem-tl-icon {
  position: absolute;
  left: 64px;
  top: 12px;
  z-index: 2;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.siem-product-demos .scsiem-tl-icon svg { width: 13px; height: 13px; }
.siem-product-demos .scsiem-tl-icon-event { background: var(--scsiem-medium); }
.siem-product-demos .scsiem-tl-icon-rule { background: var(--scsiem-info); }
.siem-product-demos .scsiem-tl-icon-incident { background: var(--scsiem-high-icon); }
.siem-product-demos .scsiem-tl-icon-ioc { background: #555; }
.siem-product-demos .scsiem-tl-icon-note { background: var(--scsiem-low); }

.siem-product-demos .scsiem-tl-content {
  margin-left: 106px;
  min-height: 28px;
}

.siem-product-demos .scsiem-tl-content strong {
  display: block;
  font-size: 12.5px;
}

.siem-product-demos .scsiem-tl-content span {
  display: block;
  color: #555;
}

.siem-product-demos .scsiem-tl-content small {
  display: block;
  color: var(--scsiem-muted);
  font-size: 11.5px;
}

.siem-product-demos [hidden] { display: none !important; }

.siem-product-demos footer.scsiem-footer,
.siem-product-demos .scsiem-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0;
  padding: 8px 12px 10px;
  border-top: 1px solid var(--scsiem-line-soft);
  background: var(--siem-demo-surface, #fff);
  background-image: none;
  color: var(--scsiem-muted);
  font-size: 12px;
}

.siem-product-demos .scsiem-footer[hidden] { display: none !important; }

.siem-product-demos .scsiem-footer strong {
  display: block;
  color: var(--scsiem-progress-done);
  font-size: 13px;
}

.siem-product-demos .scsiem-progress {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border-top: 1px solid var(--scsiem-line-soft);
  font-size: 13px;
  color: var(--scsiem-muted);
}

.siem-product-demos .scsiem-progress.is-done { color: var(--scsiem-progress-done); }
.siem-product-demos .scsiem-progress[hidden] { display: none !important; }

.siem-product-demos .scsiem-spinner {
  width: 14px;
  height: 14px;
  border: 2px solid #d0d0d0;
  border-top-color: var(--scsiem-info);
  border-radius: 50%;
}

.siem-product-demos .scsiem-progress.is-done .scsiem-spinner { display: none; }

.siem-product-demos .scsiem-tip {
  position: fixed;
  z-index: 40;
  max-width: 240px;
  background: #111;
  color: #fff;
  font-size: 11px;
  padding: 5px 8px;
  border-radius: 2px;
  pointer-events: none;
  opacity: 0;
  transform: translateY(4px);
}

.siem-product-demos .scsiem-tip.is-on {
  opacity: 1;
  transform: none;
  transition: opacity .15s ease;
}

.siem-product-demos .scsiem-lede {
  margin: 0 0 12px;
  font-size: 13px;
  color: var(--scsiem-text);
}

.siem-product-demos .scsiem-widget-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 14px 6px;
}

.siem-product-demos .scsiem-widget-head h2 {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--scsiem-text);
}

.siem-product-demos .scsiem-widget-body { padding: 0 14px 12px; }

.siem-product-demos .scsiem-datatable {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  margin: 0;
  background: #fff;
}

.siem-product-demos .scsiem-datatable th,
.siem-product-demos .scsiem-datatable td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--scsiem-line-soft);
  text-align: left;
  vertical-align: middle;
  font-size: 12.5px;
}

.siem-product-demos .scsiem-datatable th {
  background: #f7f7f7;
  color: #555;
  font-weight: 600;
  font-size: 11.5px;
  border-bottom: 1px solid #ddd;
}

.siem-product-demos .scsiem-datatable .col-time { width: 78px; color: var(--scsiem-muted); font-style: italic; font-size: 11px; }
.siem-product-demos .scsiem-datatable .col-sev { width: 92px; }
.siem-product-demos .scsiem-datatable .col-status { width: 92px; }
.siem-product-demos .scsiem-datatable .col-sid { width: 118px; }
.siem-product-demos .scsiem-datatable .col-host { width: 148px; }

.siem-product-demos .scsiem-row {
  opacity: 0;
  transform: translateY(6px);
}

.siem-product-demos .scsiem-row.is-visible {
  opacity: 1;
  transform: none;
  transition:
    opacity var(--scsiem-motion-base) var(--scsiem-ease),
    transform var(--scsiem-motion-base) var(--scsiem-ease),
    background var(--scsiem-motion-slow) ease,
    box-shadow var(--scsiem-motion-slow) ease;
}

.siem-product-demos .scsiem-row.is-fresh { background: #f3f3f3; }
.siem-product-demos .scsiem-row.is-linked {
  background: #f7fafc;
  box-shadow: inset 3px 0 0 var(--scsiem-info);
}
.siem-product-demos .scsiem-row.is-pressed { background: #e8e8e8; }
.siem-product-demos .scsiem-row.is-selected {
  background: #f3f3f3;
  box-shadow: inset 3px 0 0 var(--scsiem-info);
}
.siem-product-demos .scsiem-row.is-new-incident .scsiem-label-high {
  box-shadow: 0 0 0 1px rgba(169, 3, 41, .12);
}

.siem-product-demos .scsiem-mark {
  background: transparent;
  color: inherit;
  padding: 0 1px;
  border-radius: 2px;
  font-family: Consolas, "Segoe UI Mono", ui-monospace, monospace;
  font-size: 12px;
}

.siem-product-demos .scsiem-mark.is-on {
  background: rgba(50, 118, 177, .08);
  transition: background var(--scsiem-motion-slow) ease;
}

.siem-product-demos .scsiem-mlist { display: none; }

.siem-product-demos .scsiem-m-item {
  padding: 8px 0;
  border-bottom: 1px solid var(--scsiem-line-soft);
  opacity: 0;
  transform: translateY(6px);
}

.siem-product-demos .scsiem-m-item.is-visible {
  opacity: 1;
  transform: none;
  transition: opacity var(--scsiem-motion-base) var(--scsiem-ease), transform var(--scsiem-motion-base) var(--scsiem-ease);
}

.siem-product-demos .scsiem-m-item.is-linked { box-shadow: inset 3px 0 0 var(--scsiem-info); padding-left: 8px; }
.siem-product-demos .scsiem-m-item.is-fresh { background: #f3f3f3; }
.siem-product-demos .scsiem-m-item.is-selected {
  box-shadow: inset 3px 0 0 var(--scsiem-info);
  padding-left: 8px;
  background: #f3f3f3;
}

.siem-product-demos .scsiem-m-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-bottom: 3px;
  color: var(--scsiem-muted);
  font-size: 11px;
}

.siem-product-demos .scsiem-m-item strong { display: block; font-size: 13px; }
.siem-product-demos .scsiem-m-item span { display: block; color: #555; font-size: 12px; }

.siem-product-demos .scsiem-view[hidden] { display: none !important; }

.siem-product-demos .scsiem-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(220px, .95fr);
  gap: 16px;
  align-items: start;
}

.siem-product-demos .scsiem-detail-grid .scsiem-table th { width: 38%; }

.siem-demo-ai .scsiem-desc-grid .scsiem-table th { width: 38%; }

.siem-demo-ai .scsiem-desc-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(220px, .85fr);
  gap: 16px;
  align-items: start;
}

.siem-demo-ai .scsiem-mini-chain {
  border: 1px solid var(--scsiem-line);
  border-radius: var(--scsiem-radius-card);
  background: #fff;
  padding: 10px 12px 8px;
}

.siem-demo-ai .scsiem-mini-chain h2 {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  color: #555;
}

.siem-demo-ai .scsiem-chain {
  list-style: none;
  margin: 0;
  padding: 0;
}

.siem-demo-ai .scsiem-chain li {
  position: relative;
  padding: 0 0 10px 16px;
  font-size: 12.5px;
}

.siem-demo-ai .scsiem-chain li:last-child { padding-bottom: 0; }

.siem-demo-ai .scsiem-chain li::before {
  content: "";
  position: absolute;
  left: 3px;
  top: 7px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--scsiem-medium);
}

.siem-demo-ai .scsiem-chain li:last-child::before { background: var(--scsiem-high-icon); }

.siem-demo-ai .scsiem-chain li::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 15px;
  bottom: 0;
  width: 1px;
  background: var(--scsiem-line);
}

.siem-demo-ai .scsiem-chain li:last-child::after { display: none; }
.siem-demo-ai .scsiem-chain b { font-weight: 650; }

.siem-demo-ai .scsiem-invest {
  display: grid;
  grid-template-columns: minmax(240px, .92fr) minmax(0, 1.08fr);
  gap: 16px;
  align-items: start;
}

.siem-demo-ai .scsiem-ai {
  border: 1px solid var(--scsiem-line);
  border-radius: var(--scsiem-radius-card);
  overflow: hidden;
  background: #fff;
  min-height: 180px;
}

.siem-demo-ai .scsiem-ai-head {
  padding: 8px 12px;
  border-bottom: 1px solid var(--scsiem-line-soft);
}

.siem-demo-ai .scsiem-ai-head h2 {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--scsiem-text);
}

.siem-demo-ai .scsiem-ai-head svg {
  width: 14px;
  height: 14px;
  color: #4a6f8a;
}

.siem-demo-ai .scsiem-ai-steps { padding: 8px 12px; }

.siem-demo-ai .scsiem-ai-step {
  border-left: 3px solid #d7d7d7;
  padding: 5px 10px;
  margin: 4px 0;
  background: var(--scsiem-soft);
  border-radius: 0 4px 4px 0;
  opacity: 0;
  transform: translateY(4px);
}

.siem-demo-ai .scsiem-ai-step.is-visible {
  opacity: 1;
  transform: none;
  transition: opacity .3s var(--scsiem-ease), transform .3s var(--scsiem-ease);
}

.siem-demo-ai .scsiem-ai-step.is-tool { border-left-color: var(--scsiem-tool); }
.siem-demo-ai .scsiem-ai-step.is-note { border-left-color: var(--scsiem-note); }

.siem-demo-ai .scsiem-ai-step-head {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
}

.siem-demo-ai .scsiem-ai-step-head svg {
  width: 12px;
  height: 12px;
  color: #678;
}

.siem-demo-ai .scsiem-ai-step-body {
  margin-top: 2px;
  font-size: 12.5px;
  font-weight: 400;
  color: #555;
}

.siem-demo-ai .scsiem-ai-step-status {
  margin-left: auto;
  font-size: 11px;
  font-weight: 600;
  color: var(--scsiem-muted);
}

.siem-demo-ai .scsiem-ai-step.is-running .scsiem-ai-step-status { color: var(--scsiem-info); }
.siem-demo-ai .scsiem-ai-step.is-done .scsiem-ai-step-status { color: var(--scsiem-progress-done); }

.siem-demo-ai .scsiem-ai-notes:not(:empty) {
  padding: 8px 12px;
  border-top: 1px solid var(--scsiem-line-soft);
}

.siem-demo-ai .scsiem-ai-answer {
  padding: 0;
  border-top: 0;
  background: transparent;
  box-shadow: none;
}

.siem-demo-ai .scsiem-ai-answer:not(:empty) {
  margin: 8px 10px 12px;
  padding: 12px 14px 14px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  box-shadow: none;
}

.siem-demo-ai .scsiem-ai-status {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 2px;
  padding: 0 0 10px;
  border-bottom: 1px solid #eceef1;
  color: #3f6b52;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.3;
  background: transparent;
}

.siem-demo-ai .scsiem-ai-status::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #3f6b52;
  flex: 0 0 auto;
}

.siem-demo-ai .scsiem-ai-block {
  padding: 10px 0 8px;
  opacity: 0;
  transform: translateY(6px);
  background: transparent;
  border: 0;
  box-shadow: none;
}

.siem-demo-ai .scsiem-ai-block.is-visible {
  opacity: 1;
  transform: none;
  transition: opacity var(--scsiem-motion-slow) var(--scsiem-ease), transform var(--scsiem-motion-slow) var(--scsiem-ease);
}

.siem-demo-ai .scsiem-ai-block + .scsiem-ai-block { border-top: 1px solid #eceef1; }

.siem-demo-ai .scsiem-ai-block h3 {
  margin: 0 0 4px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
  color: var(--scsiem-text);
}

.siem-demo-ai .scsiem-footer {
  background: transparent;
  box-shadow: none;
}

.siem-demo-ai .scsiem-footer strong { display: none; }

.siem-demo-ai .scsiem-ai-block p,
.siem-demo-ai .scsiem-ai-block li {
  margin: 0;
  color: #444;
}

.siem-demo-ai .scsiem-ai-block ul {
  margin: 0;
  padding-left: 18px;
}

.siem-demo-correlation .scsiem-widget + .scsiem-widget,
.siem-demo-correlation .scsiem-strip + .scsiem-widget {
  border-top: 1px solid var(--scsiem-line-soft);
}

.siem-demo-correlation .scsiem-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 14px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: var(--scsiem-radius);
  background: #fff;
  opacity: 0;
  max-height: 0;
  overflow: hidden;
}

.siem-demo-correlation .scsiem-strip.is-visible {
  opacity: 1;
  max-height: 56px;
  margin-top: 4px;
  margin-bottom: 4px;
  padding-top: 8px;
  padding-bottom: 8px;
  border-color: var(--scsiem-line);
  background: #fbfcfd;
  transition:
    opacity var(--scsiem-motion-slow) var(--scsiem-ease),
    max-height var(--scsiem-motion-slow) var(--scsiem-ease);
}

.siem-demo-correlation .scsiem-strip-main {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.siem-demo-correlation .scsiem-strip-main svg {
  width: 14px;
  height: 14px;
  color: var(--scsiem-info);
  flex: 0 0 14px;
}

.siem-demo-correlation .scsiem-strip-main strong {
  font-size: 13px;
  font-weight: 600;
}

.siem-demo-correlation .scsiem-corr-arrow {
  display: none;
  text-align: center;
  color: var(--scsiem-muted);
  font-size: 16px;
  line-height: 1;
  padding: 4px 0 2px;
}

.siem-demo-search .scsiem-live {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--scsiem-muted);
  font-size: 11.5px;
}

.siem-demo-search .scsiem-live svg {
  width: 11px;
  height: 11px;
}

.siem-demo-search .scsiem-count {
  color: var(--scsiem-muted);
  font-size: 12px;
  font-weight: 400;
  margin-left: 8px;
}

.siem-demo-search .scsiem-search {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 14px 10px;
  position: relative;
}

.siem-demo-search .scsiem-search-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.siem-demo-search .scsiem-search-input {
  flex: 1;
  min-width: 0;
  appearance: none;
  border: 1px solid #ccc;
  border-radius: 3px;
  background: #fff;
  color: var(--scsiem-text);
  font: inherit;
  font-size: 12.5px;
  padding: 5px 10px;
  line-height: 1.2;
  box-shadow: none;
}

/* Поле поиска демо. :focus, а не :focus-visible, оставлено намеренно: у
   текстовых полей рамка по спецификации видна и при щелчке мышью, так же
   ведёт себя браузер по умолчанию. Цвет — канонический. */
.siem-demo-search .scsiem-search-input:focus,
.siem-demo-search .scsiem-search-input.is-focus {
  outline: var(--itb-focus-width, 2px) solid var(--itb-focus-color, #dc3545);
  outline-offset: 1px;
  border-color: #9ab;
}

.siem-demo-search .scsiem-detail {
  border-top: 1px solid var(--scsiem-line-soft);
  opacity: 0;
  transform: translateY(6px);
}

.siem-demo-search .scsiem-detail.is-visible {
  opacity: 1;
  transform: none;
  transition: opacity var(--scsiem-motion-base) var(--scsiem-ease), transform var(--scsiem-motion-base) var(--scsiem-ease);
}

.siem-demo-search .scsiem-detail[hidden] { display: none !important; }

.siem-demo-search .scsiem-detail-grid { padding: 10px 14px 4px; }

.siem-demo-search .scsiem-fields {
  border: 1px solid var(--scsiem-line);
  border-radius: var(--scsiem-radius-card);
  padding: 10px 12px;
  background: #fff;
}

.siem-demo-search .scsiem-fields h2 {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  color: #555;
}

.siem-demo-search .scsiem-fields dl {
  margin: 0;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 4px 10px;
  font-size: 12.5px;
}

.siem-demo-search .scsiem-fields dt {
  color: var(--scsiem-muted);
  font-weight: 600;
}

.siem-demo-search .scsiem-fields dd {
  margin: 0;
  min-width: 0;
  word-break: break-word;
}

.siem-demo-search .scsiem-datatable th,
.siem-demo-search .scsiem-datatable td { padding: 4px 8px; }

.siem-ai-capability-copy p + p { margin-top: 1rem; }

.siem-capability-demo .siem-product-demos { margin: 0; }

.siem-product-demos .scsiem-micro-body {
  padding: 4px 14px 8px;
}

.siem-product-demos .scsiem-kv {
  margin: 0;
}

.siem-product-demos .scsiem-kv-row {
  display: grid;
  grid-template-columns: 7.5rem minmax(0, 1fr);
  gap: 0 12px;
  padding: 8px 0;
  border-top: 1px solid #eceef1;
}

.siem-product-demos .scsiem-kv-row:first-child { border-top: 0; }

.siem-product-demos .scsiem-kv-row dt,
.siem-product-demos .scsiem-kv-row .scsiem-kv-key {
  margin: 0;
  color: var(--scsiem-muted);
  font-weight: 600;
  font-size: 12px;
}

.siem-product-demos .scsiem-kv-row dd,
.siem-product-demos .scsiem-kv-row .scsiem-kv-val {
  margin: 0;
  font-size: 13px;
}

.siem-product-demos .scsiem-kv-row.is-hot {
  background: #fafbfc;
}

@media (max-width: 480px) {
  .siem-product-demos .scsiem-kv-row {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px 0;
  }
}

.siem-demo-assets .scsiem-actions {
  padding: 10px 0 4px;
}

.siem-demo-incident .scsiem-footer strong,
.siem-demo-enrichment .scsiem-footer strong,
.siem-demo-assets .scsiem-footer strong {
  color: #555;
  font-size: 12px;
}

.siem-product-demos .scsiem-empty {
  margin: 10px 0 4px;
  color: var(--scsiem-muted);
  font-size: 12.5px;
}

.siem-demo-enrichment .scsiem-threats {
  margin: 8px 0 0;
  padding: 10px 12px;
  border: 1px solid #e5e7eb;
  border-radius: 4px;
  background: #fff;
}

.siem-demo-incident .scsiem-label-status.is-next,
.siem-demo-assets .scsiem-label-status.is-next {
  background: #5a6b7a;
}

.siem-product-demos-slot {
  margin: 1.1rem 0 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

#correlation .siem-product-demos-slot { margin: 0 0 1.15rem; }

#console .siem-console-work .siem-product-demos {
  width: 100%;
  max-width: 100%;
}

#console .siem-console-work .siem-product-demos-slot {
  margin-top: 0;
}

@media (prefers-reduced-motion: reduce) {
  .siem-product-demos .scsiem-tl-item,
  .siem-product-demos .scsiem-btn,
  .siem-product-demos .scsiem-row,
  .siem-product-demos .scsiem-strip,
  .siem-product-demos .scsiem-mark,
  .siem-demo-ai .scsiem-ai-step,
  .siem-demo-ai .scsiem-ai-block,
  .siem-product-demos .scsiem-m-item,
  .siem-demo-search .scsiem-detail {
    transition: none !important;
    transform: none !important;
  }
  .siem-product-demos .scsiem-spinner { animation: none; border-top-color: var(--scsiem-line); }
}

@media (prefers-reduced-motion: no-preference) {
  .siem-product-demos .scsiem-spinner { animation: siem-demo-spin .7s linear infinite; }
  .siem-product-demos .scsiem-btn {
    transition:
      transform var(--scsiem-motion-fast) ease,
      background var(--scsiem-motion-fast) ease,
      border-color var(--scsiem-motion-fast) ease,
      color var(--scsiem-motion-fast) ease;
  }
}

@keyframes siem-demo-spin { to { transform: rotate(360deg); } }

@media (max-width: 1024px) {
  .siem-demo-ai .scsiem-desc-grid,
  .siem-product-demos .scsiem-detail-grid { grid-template-columns: 1fr; }
}

@media (max-width: 991.98px) {
  .siem-demo-ai .scsiem-invest { grid-template-columns: 1fr; }
  .siem-demo-ai .scsiem-invest > .scsiem-col:nth-child(1) { order: 2; }
  .siem-demo-ai .scsiem-invest > .scsiem-col:nth-child(2) { order: 1; }
}

@media (max-width: 820px) {
  .siem-product-demos .scsiem-datatable .col-host,
  .siem-product-demos .scsiem-datatable .col-sid { display: none; }
}

@media (max-width: 640px) {
  .siem-product-demos .scsiem-card-titlebar,
  .siem-product-demos .scsiem-toolbar { flex-direction: column; align-items: stretch; }
  .siem-product-demos .scsiem-badges,
  .siem-product-demos .scsiem-toolbar { justify-content: flex-start; }
  .siem-product-demos .scsiem-tl-time { width: 48px; font-size: 10px; }
  .siem-product-demos .scsiem-timeline::before { left: 62px; }
  .siem-product-demos .scsiem-tl-icon { left: 50px; width: 24px; height: 24px; }
  .siem-product-demos .scsiem-tl-content { margin-left: 84px; }
  .siem-product-demos .scsiem-card-title h1,
  .siem-product-demos .scsiem-card-title h2 { font-size: 14px; }
  .siem-product-demos .scsiem-datatable { display: none; }
  .siem-product-demos .scsiem-mlist { display: block; }
  .siem-demo-correlation .scsiem-corr-arrow.is-visible { display: block; }
  .siem-demo-correlation .scsiem-strip {
    margin-left: 10px;
    margin-right: 10px;
    flex-wrap: wrap;
  }
  .siem-product-demos .scsiem-widget-body { padding: 0 10px 10px; }
  .siem-demo-search .scsiem-search { padding-left: 10px; padding-right: 10px; }
  .siem-demo-search .scsiem-detail-grid { padding-left: 10px; padding-right: 10px; }
}
