/* ═══════════════════════════════════════════════════════════
   Честный брокер — коммерческие предложения (образцы)
   Одна структура на все КП: шапка, полоса итогов, нумерованные
   разделы, таблицы, подвал. Печатается на A4 без правок.
   ═══════════════════════════════════════════════════════════ */

:root{
  --ink:#142E50; --ink-soft:#3D5578; --save:#1B6B45; --warn:#8F6009;
  --cream:#F7F6F3; --white:#fff; --rule:#E3E1DB; --dim:#657081;
  --sans:'IBM Plex Sans',-apple-system,'Segoe UI',sans-serif;
  --mono:'IBM Plex Mono','SF Mono',monospace;
}
*{ margin:0; padding:0; box-sizing:border-box; }
body{
  font-family:var(--sans); color:var(--ink); background:#EDEBE6;
  line-height:1.6; font-size:16px; -webkit-font-smoothing:antialiased;
  padding:28px 20px 64px;
}

/* ── Возврат на сайт (на печати скрыт) ── */
.kp-bar{
  max-width:960px; margin:0 auto 16px; display:flex; align-items:center;
  justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-family:var(--mono); font-size:12px; letter-spacing:.8px; text-transform:uppercase;
}
.kp-bar a{ color:var(--ink); text-decoration:none; border-bottom:1px solid rgba(20,46,80,.25); padding-bottom:2px; }
.kp-bar a:hover{ border-bottom-color:var(--save); color:var(--save); }
.kp-bar .kp-bar-note{ color:var(--dim); letter-spacing:.4px; text-transform:none; font-size:12.5px; }

/* ── Лист ── */
.kp{
  max-width:960px; margin:0 auto; background:var(--white);
  border:1px solid var(--rule); border-radius:4px; overflow:hidden;
}

/* ── Шапка: одинаковая на всех КП ── */
.kp-head{ padding:34px 40px 30px; background:var(--cream); border-bottom:2px solid var(--ink); }
.kp-head-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:24px; }
.kp-brand{ display:flex; align-items:center; gap:12px; }
.kp-brand .br{ font-family:var(--mono); font-size:24px; font-weight:600; letter-spacing:-6px; color:var(--ink); line-height:1; padding-right:6px; }
.kp-brand .nm{ font-size:16px; font-weight:600; line-height:1.2; }
.kp-brand .sb{ font-family:var(--mono); font-size:10.5px; letter-spacing:1.2px; color:var(--dim); }
.kp-meta{ text-align:right; font-family:var(--mono); font-size:10.5px; letter-spacing:1.2px; text-transform:uppercase; color:var(--dim); line-height:1.9; }
.kp-kicker{ font-family:var(--mono); font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--save); margin-bottom:10px; }
.kp-title{ font-size:29px; line-height:1.2; font-weight:600; letter-spacing:-.4px; max-width:24ch; margin-bottom:14px; text-wrap:pretty; }
.kp-lead{ font-size:15px; line-height:1.7; color:var(--ink-soft); max-width:78ch; }
.kp-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.kp-chip{
  font-family:var(--mono); font-size:11px; letter-spacing:.8px; color:var(--ink);
  background:var(--white); border:1px solid var(--rule); border-radius:3px; padding:5px 10px;
}
.kp-chip.hid{ color:var(--dim); border-style:dashed; }

/* ── Полоса итогов ── */
.kp-sum{ display:grid; grid-template-columns:repeat(4,1fr); border-bottom:1px solid var(--rule); }
.kp-sum > div{ padding:20px 22px; border-right:1px solid var(--rule); }
.kp-sum > div:last-child{ border-right:0; }
.kp-sum .pick{ box-shadow:inset 0 3px 0 var(--save); background:rgba(27,107,69,.035); }
.kp-sum .k{ font-family:var(--mono); font-size:9.5px; letter-spacing:1.4px; text-transform:uppercase; color:var(--dim); margin-bottom:9px; line-height:1.6; }
.kp-sum .v{ font-family:var(--mono); font-size:22px; font-weight:700; letter-spacing:-.5px; font-variant-numeric:tabular-nums; line-height:1.1; }
.kp-sum .v small{ font-size:13px; font-weight:400; color:var(--dim); }
.kp-sum .v.g{ color:var(--save); }
.kp-sum .s{ font-size:12.5px; line-height:1.5; color:var(--dim); margin-top:8px; }
.kp-sum .s em{ font-style:normal; color:var(--warn); }

/* ── Разделы ── */
.kp-body{ padding:32px 40px 12px; }
.kp-sec{ margin-bottom:34px; }
.kp-sec-h{ display:flex; align-items:baseline; gap:12px; padding-bottom:10px; border-bottom:2px solid var(--ink); margin-bottom:18px; }
.kp-sec-h .n{ font-family:var(--mono); font-size:12px; font-weight:600; color:var(--save); }
.kp-sec-h h2{ font-size:17px; font-weight:600; letter-spacing:.2px; text-transform:uppercase; }
.kp-sec-h .aside{ margin-left:auto; font-family:var(--mono); font-size:10.5px; letter-spacing:1px; text-transform:uppercase; color:var(--dim); }

.kp-formula{
  font-family:var(--mono); font-size:20px; letter-spacing:1px; color:var(--ink);
  padding:2px 0 10px;
}
.kp-formula b{ color:var(--save); }
.kp-expl{ font-size:14px; line-height:1.7; color:var(--ink-soft); margin-bottom:18px; max-width:88ch; }
.kp-expl b{ color:var(--ink); }

/* ── Таблицы ── */
.kp-t{ width:100%; border-collapse:collapse; font-size:14px; }
.kp-t th{
  font-family:var(--mono); font-size:9.5px; font-weight:400; letter-spacing:1.3px;
  text-transform:uppercase; color:var(--dim); text-align:right; padding:0 0 9px; border-bottom:1px solid var(--rule);
}
.kp-t th:first-child, .kp-t td:first-child{ text-align:left; }
.kp-t td{ padding:11px 0; border-bottom:1px solid var(--rule); text-align:right; font-variant-numeric:tabular-nums; }
.kp-t td + td{ padding-left:18px; }
.kp-t th + th{ padding-left:18px; }
.kp-t .num{ font-family:var(--mono); }
.kp-t .max{ font-family:var(--mono); color:var(--warn); }
.kp-t .new{ font-family:var(--mono); color:var(--save); font-weight:600; }
.kp-t .dt{ font-family:var(--mono); color:var(--save); font-weight:600; }
.kp-t .muted{ color:var(--dim); font-family:var(--sans); text-align:center; }
.kp-t tr.total td{ border-bottom:0; border-top:2px solid var(--ink); font-weight:600; padding-top:12px; }
.kp-note{ font-size:12.5px; line-height:1.65; color:var(--dim); margin-top:12px; max-width:92ch; }
.kp-note b{ color:var(--ink-soft); }

/* ── Карточки внутри раздела ── */
.kp-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.kp-card{ border:1px solid var(--rule); border-radius:3px; padding:18px 20px; }
.kp-card.pick{ border-color:var(--save); box-shadow:inset 0 3px 0 var(--save); }
.kp-card .k{ font-family:var(--mono); font-size:9.5px; letter-spacing:1.4px; text-transform:uppercase; color:var(--dim); margin-bottom:12px; }
.kp-card .big{ font-family:var(--mono); font-size:28px; font-weight:700; letter-spacing:-.5px; line-height:1; }
.kp-card .big small{ font-family:var(--sans); font-size:13px; font-weight:400; color:var(--ink-soft); letter-spacing:0; }
.kp-card .big.g{ color:var(--save); }
.kp-card p{ font-size:13px; line-height:1.6; color:var(--ink-soft); margin-top:12px; }

/* ── Столбики премий ── */
.kp-bars{ display:grid; gap:9px; }
.kp-bar-row{ display:grid; grid-template-columns:180px 1fr 130px; align-items:center; gap:16px; }
.kp-bar-row .lb{ text-align:right; font-size:13.5px; line-height:1.3; }
.kp-bar-row .lb span{ display:block; font-family:var(--mono); font-size:9.5px; letter-spacing:1px; text-transform:uppercase; color:var(--dim); margin-top:3px; }
.kp-track{ height:22px; background:var(--cream); border:1px solid var(--rule); }
.kp-fill{ height:100%; background:#D9D6CF; }
.kp-fill.pick{ background:var(--ink); }
.kp-fill.alt{ background:repeating-linear-gradient(135deg,#D9D6CF 0 5px,#EDEBE6 5px 10px); }
.kp-bar-row .vl{ font-family:var(--mono); font-size:14px; font-variant-numeric:tabular-nums; text-align:right; }
.kp-legend{ display:flex; flex-wrap:wrap; gap:18px; margin-top:14px; font-size:12px; color:var(--dim); }
.kp-legend i{ display:inline-block; width:13px; height:11px; margin-right:7px; vertical-align:middle; border:1px solid var(--rule); }

/* ── Подвал ── */
.kp-foot{
  padding:18px 40px 22px; border-top:1px solid var(--rule); background:var(--cream);
  display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap;
  font-family:var(--mono); font-size:10.5px; letter-spacing:1px; text-transform:uppercase; color:var(--dim);
}
.kp-foot .r{ text-align:right; }

/* ── Узкий экран ── */
@media (max-width:820px){
  body{ padding:16px 12px 48px; }
  .kp-head{ padding:24px 20px 22px; }
  .kp-title{ font-size:23px; max-width:none; }
  .kp-body{ padding:22px 20px 8px; }
  .kp-sum{ grid-template-columns:1fr 1fr; }
  .kp-sum > div:nth-child(2n){ border-right:0; }
  .kp-sum > div:nth-child(-n+2){ border-bottom:1px solid var(--rule); }
  .kp-cards{ grid-template-columns:1fr; }
  .kp-bar-row{ grid-template-columns:1fr; gap:5px; }
  .kp-bar-row .lb{ text-align:left; }
  .kp-bar-row .vl{ text-align:left; }
  .kp-foot{ padding:16px 20px 20px; }
  .kp-foot .r{ text-align:left; }
  .kp-scroll{ overflow-x:auto; }
  .kp-scroll .kp-t{ min-width:640px; }
}

/* ── Печать: один лист, без интерфейса ── */
@media print{
  @page{ size:A4; margin:12mm; }
  body{ background:#fff; padding:0; font-size:10.5pt; }
  .kp-bar{ display:none; }
  .kp{ max-width:none; border:0; border-radius:0; }
  .kp-head{ padding:0 0 18px; background:#fff; }
  .kp-body{ padding:18px 0 0; }
  .kp-foot{ padding:12px 0 0; background:#fff; }
  .kp-sec{ break-inside:avoid; }
}
