/* Site look for the static Russian pages (/ru/<page>/): same fonts, colors,
   black header and footer as the SPA. Text and JSON-LD of the pages stay as is. */
:root { --offwhite: #F9F9F9; --lightgray: #F1F1F1; --mediumgray: #8A898C; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--offwhite); color: #1f2937; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size: 17px; line-height: 1.75; -webkit-font-smoothing: antialiased; }
a { color: #111827; text-decoration: underline; text-underline-offset: 2px; }
a:hover { color: #4b5563; }

/* Header */
.ks-header { position: sticky; top: 0; z-index: 50; background: #000; padding: 20px 0; }
.ks-wrap { max-width: 1280px; margin: 0 auto; padding: 0 24px; display: flex; justify-content: space-between; align-items: center; }
.ks-logo { color: #fff; text-decoration: none; font-size: 20px; letter-spacing: 6px; font-weight: 300; white-space: nowrap; }
.ks-logo:hover { color: #fff; }
.ks-right { display: flex; align-items: center; gap: 20px; }
.ks-nav { display: none; }
.ks-lang { display: flex; align-items: center; gap: 4px; font-size: 14px; color: #6b7280; }
.ks-lang a { color: #9ca3af; text-decoration: none; padding: 0 4px; }
.ks-lang a:hover { color: #fff; }
.ks-lang a[aria-current] { color: #fff; font-weight: 500; }
/* Always-on burger, fullscreen menu */
.ks-menu { display: block; }
.ks-menu summary { list-style: none; cursor: pointer; padding: 8px; position: relative; z-index: 70; }
.ks-menu summary::-webkit-details-marker { display: none; }
.ks-burger { width: 28px; height: 20px; position: relative; display: block; }
.ks-burger span { position: absolute; right: 0; height: 2px; background: #fff; transition: transform .35s ease, width .35s ease, opacity .25s ease, top .35s ease; }
.ks-burger span:nth-child(1) { top: 0; width: 28px; }
.ks-burger span:nth-child(2) { top: 9px; width: 18px; }
.ks-burger span:nth-child(3) { top: 18px; width: 23px; }
.ks-menu summary:hover .ks-burger span { width: 28px; }
.ks-menu[open] .ks-burger span:nth-child(1) { top: 9px; width: 28px; transform: rotate(45deg); }
.ks-menu[open] .ks-burger span:nth-child(2) { opacity: 0; }
.ks-menu[open] .ks-burger span:nth-child(3) { top: 9px; width: 28px; transform: rotate(-45deg); }
.ks-menu-panel { position: fixed; inset: 0; z-index: 60; background: rgba(0,0,0,.92); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: clamp(14px, 3vh, 28px); padding: 96px 24px 48px; overflow-y: auto; animation: ks-fade .3s ease both; }
.ks-menu-panel .ks-item { color: #d1d5db; text-decoration: none; font-size: clamp(20px, 3.4vw, 34px); letter-spacing: .18em; font-weight: 300; text-align: center; line-height: 1.3;
  animation: ks-slide .5s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(.08s + var(--i) * .06s); }
.ks-menu-panel .ks-item:hover { color: #fff; }
.ks-menu-lang { margin-top: 12px; animation: ks-slide .5s cubic-bezier(.2,.7,.2,1) both; animation-delay: calc(.08s + var(--i) * .06s); }
.ks-menu-lang .ks-lang { font-size: 16px; }
@keyframes ks-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ks-slide { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
body:has(.ks-menu[open]) { overflow: hidden; }
@media (max-width: 767px) {
  .ks-right > .ks-lang { display: none; }
  .ks-logo { font-size: 16px; letter-spacing: 4px; }
}
@media (prefers-reduced-motion: reduce) { .ks-menu-panel, .ks-menu-panel .ks-item, .ks-menu-lang { animation: none; } }

/* Content */
main.ks-main { max-width: 820px; margin: 0 auto; padding: 56px 24px 72px; }
main.ks-main h1 { font-family: 'Playfair Display', Georgia, serif; font-weight: 600; font-size: clamp(32px, 5vw, 46px); line-height: 1.2; color: #111827; margin: 8px 0 16px; }
main.ks-main h2 { font-family: 'Playfair Display', Georgia, serif; font-weight: 500; font-size: clamp(24px, 3.2vw, 30px); line-height: 1.3; color: #111827; margin: 48px 0 16px; }
main.ks-main h3 { font-family: 'Playfair Display', Georgia, serif; font-weight: 500; font-size: 22px; margin: 32px 0 12px; color: #111827; }
main.ks-main p, main.ks-main li { color: #1f2937; }
main.ks-main ul, main.ks-main ol { padding-left: 22px; }
.lead { font-size: 19px; color: #4b5563; margin-bottom: 28px; }
nav.crumbs { font-size: 14px; color: var(--mediumgray); margin-bottom: 8px; }
nav.crumbs a { color: var(--mediumgray); }
table { border-collapse: collapse; width: 100%; margin: 20px 0; font-size: 15px; background: #fff; }
td, th { border-bottom: 1px solid #e5e7eb; padding: 10px 14px; text-align: left; vertical-align: top; }
th { background: var(--lightgray); font-weight: 600; }
figure { margin: 28px 0; }
figure img { width: 100%; height: auto; border-radius: 8px; display: block; }
figure.portrait img { max-width: 480px; }
figcaption { color: #6b7280; font-size: 14px; margin-top: 8px; }
.img-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; margin: 28px 0; }
.img-row figure { margin: 0; }
blockquote, .pull { border-left: 3px solid #111827; margin: 28px 0; padding: 4px 0 4px 20px; font-family: 'Playfair Display', Georgia, serif; font-size: 21px; color: #111827; }
.source-note { background: var(--lightgray); padding: 16px 20px; border-radius: 8px; font-size: 15px; margin: 32px 0; }
.related { margin-top: 48px; padding: 24px; background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; }
.related a { display: block; margin: 6px 0; }
.ks-note { margin-top: 40px; color: var(--mediumgray); font-size: 14px; }

/* Footer */
.ks-footer { background: #000; color: #fff; padding: 32px 0; }
.ks-footer .ks-wrap { justify-content: flex-start; gap: 24px; flex-wrap: wrap; }
.ks-footer nav { display: flex; gap: 16px; flex-wrap: wrap; font-size: 14px; }
.ks-footer nav a { color: #9ca3af; text-decoration: none; }
.ks-footer nav a:hover { color: #fff; text-decoration: underline; }
.ks-footer p { margin: 0; font-size: 14px; color: #d1d5db; }

/* Q&A cards and source box */
.qa { margin-bottom: 24px; padding: 20px 24px; background: #fff; border-left: 3px solid #111827; border-radius: 8px; }
.qa h2 { margin-top: 0 !important; font-size: 22px !important; }
.source-box { padding: 16px 20px; background: var(--lightgray); border-radius: 8px; margin-bottom: 28px; }

/* /ru/politika: сводная страница во всю ширину, оглавление слева */
main.ks-main.ks-wide { max-width: 1280px; }
.ks-hero { max-width: 880px; }
.ks-kicker { font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: #6b7280; margin: 0; }
.ks-grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 56px; align-items: start; }
.ks-toc { position: sticky; top: 96px; font-size: 15px; border-left: 2px solid #e5e7eb; padding-left: 18px; }
.ks-toc-title { font-weight: 600; color: #111827; margin: 0 0 10px; }
.ks-toc ol { list-style: none; padding: 0 !important; margin: 0 0 18px; }
.ks-toc li { margin: 0 0 8px; line-height: 1.35; }
.ks-toc a { color: #374151; text-decoration: none; }
.ks-toc a:hover { color: #111827; text-decoration: underline; }
.ks-wiki { font-weight: 600; color: #111827; }
.ks-body { max-width: 860px; }
.ks-body > section { scroll-margin-top: 90px; border-top: 1px solid #e5e7eb; padding-top: 8px; margin-top: 40px; }
.ks-body > section:first-child { border-top: 0; margin-top: 0; }
.ks-body h4 { font-size: 18px; font-weight: 600; margin: 24px 0 8px; color: #111827; }
.ks-body .qa h3 { margin-top: 0; font-size: 20px; }
.ks-sources li { margin-bottom: 6px; word-break: break-word; }
@media (max-width: 960px) {
  .ks-grid { grid-template-columns: minmax(0,1fr); gap: 24px; }
  .ks-toc { position: static; }
}

@media (max-width: 640px) {
  .ks-wrap { padding: 0 16px; gap: 12px; }
  .ks-lang { flex-shrink: 0; font-size: 13px; }
  .ks-body, .ks-toc { overflow-wrap: anywhere; }
  .ks-body img, .ks-body figure, .ks-body iframe, .ks-body table { max-width: 100%; height: auto; }
}

/* /ru/politika: главное фото страницы под заголовком */
figure.ks-featured { margin: 24px 0 40px; }
figure.ks-featured img { max-width: 640px; }