/* ============================================================
   Lexoft — extra components (SVG figures, info-blocks)
   Loaded on singular posts/pages in addition to article.css
   ============================================================ */

.lx-figure {
  margin: 32px 0;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--sh-1);
}
.lx-figure > svg { display: block; width: 100%; height: auto; background: #fff; }
.lx-figure figcaption {
  font-size: 13px; color: var(--ink-3);
  padding: 12px 18px; border-top: 1px solid var(--line); background: var(--bg-2);
}
.lx-figure figcaption b { color: var(--ink-2); font-weight: 700; }

/* Key-fact strip */
.lx-keyfacts {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 30px 0;
}
.lx-keyfact {
  background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--r);
  padding: 18px 20px;
}
.lx-keyfact b { display: block; font-size: 24px; font-weight: 800; color: var(--accent); letter-spacing: -.02em; }
.lx-keyfact span { font-size: 13.5px; color: var(--ink-3); line-height: 1.4; display: block; margin-top: 4px; }

/* Definition / note inline block */
.lx-note {
  border-left: 3px solid var(--accent); background: var(--accent-soft);
  border-radius: 0 var(--r) var(--r) 0; padding: 14px 18px; margin: 24px 0;
  font-size: 15.5px; color: var(--ink-2); line-height: 1.6;
}
.lx-note b { color: var(--ink); }

/* Legal / long-form page typography reuse of .article-body already covers it */
.lx-toc-inline {
  background: var(--bg-2); border: 1px solid var(--line); border-radius: var(--r);
  padding: 18px 22px; margin: 24px 0;
}
.lx-toc-inline h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); margin-bottom: 10px; }
.lx-toc-inline ol { counter-reset: lxc; display: flex; flex-direction: column; gap: 7px; }
.lx-toc-inline li { counter-increment: lxc; font-size: 14.5px; }
.lx-toc-inline a { color: var(--accent); }

@media (max-width: 600px) {
  .lx-keyfacts { grid-template-columns: 1fr; }
}