/* ===== Oristyle · Article Base Styles (v1.4) ===== */
:root{
  --ox-font: system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif;
  --ox-text:#14161a; --ox-muted:#6b7280; --ox-bg:#fff; --ox-border:#e5e7eb;
  --ox-primary:#1B3D6D; --ox-accent:#0ea5e9;
  --ox-maxw:820px; --ox-radius:14px; --ox-gap:18px; --ox-lead:20px;
}

.ox-article{font-family:var(--ox-font);color:var(--ox-text);background:var(--ox-bg);}
.ox-ctr{max-width:var(--ox-maxw);margin:0 auto;padding:0 16px;}

.ox-breadcrumbs{font-size:14px;color:var(--ox-muted);margin:8px 0 16px;}
.ox-breadcrumbs a{color:inherit;text-decoration:none}
.ox-breadcrumbs a:hover{text-decoration:underline}

.ox-header{margin:8px 0 20px}
.ox-header h1{font-size:clamp(28px,4vw,40px);line-height:1.15;margin:8px 0 10px}
.ox-sub{font-size:18px;color:var(--ox-muted);margin-top:4px}
.ox-meta{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;font-size:14px;color:var(--ox-muted);margin-top:10px}
.ox-meta .dot{width:4px;height:4px;background:var(--ox-border);border-radius:50%;display:inline-block;margin:0 6px}

.ox-lead{font-size:var(--ox-lead);line-height:1.6;margin:14px 0 18px}

.ox-keypoints{display:grid;gap:8px;margin:18px 0;padding:12px;border:1px dashed var(--ox-border);border-radius:var(--ox-radius);background:#fcfcff}
.ox-keypoints .kp-title{font-weight:600;color:var(--ox-primary);font-size:14px}

.ox-body h2{font-size:clamp(22px,3.2vw,28px);margin:26px 0 10px}
.ox-body h3{font-size:clamp(18px,2.6vw,22px);margin:20px 0 8px}
.ox-body p,.ox-body li{line-height:1.7}
.ox-body a{color:var(--ox-primary);text-underline-offset:2px}
.ox-body a:hover{text-decoration:none}

.ox-note{background:#f7fbff;border:1px solid var(--ox-border);border-left:4px solid var(--ox-accent);padding:10px 12px;border-radius:var(--ox-radius);font-size:15px}
.ox-quote{border-left:4px solid var(--ox-primary);padding-left:14px;color:#334155;background:#f8fafc;border-radius:0 8px 8px 0}

.ox-proscons{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin:14px 0}
.ox-card{border:1px solid var(--ox-border);border-radius:var(--ox-radius);padding:12px;background:#fff}

.ox-steps ol{counter-reset:step;list-style:none;padding-left:0;margin:0}
.ox-steps li{counter-increment:step;margin:12px 0;padding-left:44px;position:relative}
.ox-steps li::before{content:counter(step);position:absolute;left:0;top:0;width:32px;height:32px;border-radius:8px;border:1px solid var(--ox-border);display:grid;place-items:center;font-weight:600;color:var(--ox-primary);background:#fff}

.ox-faq details{border:1px solid var(--ox-border);border-radius:var(--ox-radius);padding:10px 12px;background:#fff;margin:8px 0}
.ox-faq summary{font-weight:600;cursor:pointer;color:var(--ox-text)}
.ox-faq details[open]{background:#f9fbff}

.ox-cta{border:1px solid var(--ox-primary);background:#f5f9ff;border-radius:var(--ox-radius);padding:14px 16px;margin:24px 0}

/* Источники (без «навигации по источникам»; 1–5 шт., часть может быть кликабельной) */
.ox-sources{font-size:14px;color:var(--ox-muted);margin-top:18px}
.ox-sources ol{margin:6px 0 0 18px}
.ox-sources a{color:var(--ox-primary);text-decoration:none}
.ox-sources a:hover{text-decoration:underline}
.ox-source-host{opacity:.8}

/* Теги */
.ox-tags{margin-top:14px;font-size:14px;color:var(--ox-muted)}
.ox-tags a{background:#eef2ff;padding:4px 8px;border-radius:999px;margin-right:6px;text-decoration:none;color:#1f2937}
.ox-tags a:hover{background:#e0e7ff}

/* Таблицы и код */
.ox-body table{width:100%;border-collapse:collapse;margin:14px 0;border:1px solid var(--ox-border)}
.ox-body th,.ox-body td{padding:10px;border:1px solid var(--ox-border);text-align:left}
.ox-body pre{background:#0b1220;color:#f1f5f9;padding:14px;border-radius:10px;overflow:auto;font-size:14px}
.ox-body code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace}

/* Утилиты */
.ox-muted{color:var(--ox-muted)!important}
.ox-center{text-align:center}
.ox-hide{display:none!important}

/* ===== Изображения: используем ваш <figure class="post__figure"> ===== */
.post__figure{margin:18px 0;border:1px solid var(--ox-border);border-radius:var(--ox-radius);overflow:hidden;background:#f8fafc}
.post__figure img{display:block;width:100%;height:auto}
.post__figure figcaption{font-size:13px;color:var(--ox-muted);padding:8px 12px;background:#fff}

/* Вариации изображений (опциональные) */
.post__figure--wide{margin-left:calc(50% - min(50%, var(--ox-maxw)/2));margin-right:calc(50% - min(50%, var(--ox-maxw)/2))}
.post__figure--full{border:none;border-radius:0;background:transparent;margin-left:0;margin-right:0}
@media (min-width:1024px){
  .post__figure--float-left{float:left;max-width:45%;margin:6px 18px 12px 0}
  .post__figure--float-right{float:right;max-width:45%;margin:6px 0 12px 18px}
}

/* Печать */
@media print{
  .ox-cta,.ox-proscons,.post__figure{break-inside:avoid}
  a{color:#000;text-decoration:underline}
}

/* ===== Oristyle · UI Blocks (v1.5) ===== */

/* Таблицы: универсальные модификаторы */
.ox-scroll-x{overflow-x:auto}
.ox-table{width:100%;border-collapse:collapse;border:1px solid var(--ox-border);margin:14px 0}
.ox-table th,.ox-table td{padding:10px;border:1px solid var(--ox-border);text-align:left}
.ox-table.is-compact th,.ox-table.is-compact td{padding:6px 8px;font-size:14px}
.ox-table.is-striped tbody tr:nth-child(odd){background:#fafafa}
.ox-table.is-fixed{table-layout:fixed}
.ox-table caption{caption-side:bottom;font-size:12px;color:var(--ox-muted);padding:6px 0}

/* Callout/примечания с типами состояния */
.ox-callout{
  padding:12px 14px;border:1px solid var(--ox-border);border-radius:var(--ox-radius);
  background:#fff; margin:14px 0; position:relative
}
.ox-callout h3{margin:0 0 6px;font-size:16px}
.ox-callout.is-info{border-left:4px solid var(--ox-info); background:var(--ox-info-bg)}
.ox-callout.is-success{border-left:4px solid var(--ox-success); background:var(--ox-success-bg)}
.ox-callout.is-warning{border-left:4px solid var(--ox-warning); background:var(--ox-warning-bg)}
.ox-callout.is-danger{border-left:4px solid var(--ox-danger); background:var(--ox-danger-bg)}

/* Pullquote — акцентная цитата */
.ox-pullquote{
  margin:16px 0; padding:14px 16px; background:#f8fafc; border-left:4px solid var(--ox-primary);
  border-radius:0 10px 10px 0; color:#334155; font-size:18px; line-height:1.6
}

/* Список-чеклист */
.ox-checklist{list-style:none;padding-left:0;margin:12px 0}
.ox-checklist li{position:relative;padding-left:28px;margin:8px 0}
.ox-checklist li::before{
  content:"✓"; position:absolute; left:0; top:0; width:20px; height:20px;
  display:grid; place-items:center; font-weight:700; color:var(--ox-success);
}
.ox-checklist li.is-negative::before{content:"✕"; color:var(--ox-danger)}

/* Сетка сравнения (2–3 колонки) */
.ox-compare{display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); margin:14px 0}
.ox-compare__col{border:1px solid var(--ox-border); border-radius:var(--ox-radius); background:#fff; padding:12px}
.ox-compare__title{font-weight:600; margin-bottom:6px}
.ox-compare__list{margin:0; padding-left:18px}

/* Карточки-метрики (KPI) */
.ox-stats{display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); margin:14px 0}
.ox-stat{border:1px solid var(--ox-border); border-radius:14px; padding:12px; background:#fff}
.ox-stat__value{font-size:28px; font-weight:700; line-height:1}
.ox-stat__label{color:var(--ox-muted); font-size:13px; margin-top:4px}

/* Временная шкала */
.ox-timeline{position:relative; margin:16px 0; padding-left:24px}
.ox-timeline::before{content:""; position:absolute; left:10px; top:0; bottom:0; width:2px; background:var(--ox-border)}
.ox-timeline__item{position:relative; margin:12px 0}
.ox-timeline__item::before{
  content:""; position:absolute; left:-2px; top:4px; width:10px; height:10px; border-radius:999px; background:var(--ox-primary)
}
.ox-timeline__date{font-weight:600; margin-bottom:4px}
.ox-timeline__content{color:var(--ox-text)}

/* Бейджи (inline) */
.ox-badge{
  display:inline-block; padding:2px 8px; border-radius:999px; background:#eef2ff; color:#1f2937;
  font-size:12px; line-height:1; border:1px solid var(--ox-border)
}