:root { --article-ink: #17243a; --article-muted: #66758b; --article-line: #dce4ed; --article-blue: #245aa9; --article-green: #1c725f; }
.article-page { min-height: calc(100vh - 76px); padding: 22px 28px 44px; color: var(--article-ink); background: #eef3f7; }
.article-breadcrumb, .article-layout { width: min(980px, 100%); margin-right: auto; margin-left: auto; }
.article-breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; color: #758399; font-size: 11px; }
.article-breadcrumb a { color: #45668e; }
.article-breadcrumb em { font-style: normal; }
.article-layout { overflow: hidden; background: #fff; border: 1px solid var(--article-line); border-radius: 8px; box-shadow: 0 14px 34px rgba(24, 47, 79, .08); }
.article-header { padding: 42px 54px 34px; border-bottom: 1px solid #e7ecf2; }
.article-tags { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.article-tags span, .article-tags b { min-height: 25px; display: inline-flex; align-items: center; padding: 0 9px; font-size: 10px; border-radius: 4px; }
.article-tags span { color: #fff; background: var(--article-blue); }
.article-tags b { color: #496179; background: #edf2f6; }
.article-header h1 { margin: 20px 0 0; font-size: 34px; line-height: 1.42; }
.article-header > p { max-width: 820px; margin: 17px 0 0; color: var(--article-muted); font-size: 15px; line-height: 1.85; }
.article-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; margin-top: 23px; color: #8490a1; font-size: 11px; }
.article-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(260px, 1.7fr); gap: 1px; margin: 0; background: #dfe7ef; border-bottom: 1px solid #dfe7ef; }
.article-facts > div { min-width: 0; padding: 17px 20px; background: #f5f8fb; }
.article-facts small, .article-facts strong { display: block; }
.article-facts small { color: #7f8b9c; font-size: 9px; }
.article-facts strong { margin-top: 7px; overflow-wrap: anywhere; font-size: 13px; }
.article-facts .numbers strong { color: #b63146; }
.article-content { padding: 24px 54px 12px; }
.article-section { padding: 20px 0; border-bottom: 1px solid #edf0f4; }
.article-section:last-child { border-bottom: 0; }
.article-section h2 { margin: 0 0 14px; font-size: 21px; line-height: 1.5; }
.article-section p { margin: 0 0 13px; color: #34445a; font-size: 15px; line-height: 2; }
.article-section p:last-child { margin-bottom: 0; }
.article-disclaimer { margin: 8px 54px 28px; padding: 17px 20px; background: #fff9eb; border: 1px solid #ead9ae; border-left: 4px solid #b68324; }
.article-disclaimer strong { font-size: 12px; }
.article-disclaimer p { margin: 7px 0 0; color: #726449; font-size: 11px; line-height: 1.8; }
.article-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 54px; background: #f7f9fb; border-top: 1px solid #e5eaf0; }
.article-footer > div { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.article-footer span { color: #7d8999; font-size: 10px; }
.article-footer b { padding: 5px 7px; color: #51657d; font-size: 9px; background: #e9eef4; border-radius: 3px; }
.article-footer > a { flex: 0 0 auto; color: var(--article-blue); font-size: 11px; font-weight: 800; }
@media (max-width: 760px) {
  .article-page { padding: 14px 12px 28px; }
  .article-header { padding: 28px 20px 24px; }
  .article-header h1 { font-size: 25px; }
  .article-header > p { font-size: 13px; line-height: 1.75; }
  .article-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .article-facts .numbers { grid-column: 1 / -1; }
  .article-content { padding: 15px 20px 8px; }
  .article-section { padding: 18px 0; }
  .article-section h2 { font-size: 18px; }
  .article-section p { font-size: 14px; line-height: 1.9; }
  .article-disclaimer { margin: 8px 20px 22px; }
  .article-footer { align-items: flex-start; flex-direction: column; padding: 18px 20px; }
}
