@font-face {
  font-family: 'Unbounded'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('assets/fonts/unbounded-700-cyrillic.woff2') format('woff2');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face {
  font-family: 'Unbounded'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('assets/fonts/unbounded-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
:root { --paper: #f5f4f2; --ink: #232725; --muted: #666b68; --green: #087f65; --line: #dce2dd; }
* { box-sizing: border-box; }
html { scroll-padding-top: 24px; }
body { margin: 0; color: var(--ink); background: var(--paper); font: 18px/1.75 'Golos Text', sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--green); text-underline-offset: .2em; }
a:hover { text-decoration-thickness: 2px; }
a:focus-visible, summary:focus-visible { outline: 3px solid #8b3f98; outline-offset: 5px; }
img { display: block; max-width: 100%; height: auto; }
p, figure { margin: 0; }
h1, h2 { font-family: 'Unbounded', sans-serif; font-weight: 700; line-height: 1.25; letter-spacing: -.025em; text-wrap: balance; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: absolute; left: 16px; top: -100px; z-index: 10; background: white; padding: 12px 18px; }
.skip-link:focus { top: 12px; }
.reading-wrap { width: min(1180px, calc(100% - 80px)); margin-inline: auto; }
.reading-header { border-bottom: 1px solid var(--line); }
.reading-nav { display: flex; align-items: center; gap: 32px; min-height: 96px; }
.reading-brand { display: flex; align-items: center; min-height: 48px; flex-shrink: 0; }
.reading-links { display: flex; align-items: center; gap: 28px; margin-left: auto; }
.reading-links a { display: inline-flex; align-items: center; min-height: 48px; color: var(--ink); text-decoration: none; font-size: 15px; }
.reading-links a[aria-current] { color: var(--green); text-decoration: underline; }
.reading-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 10px 20px; border-radius: 14px; background: var(--green); color: white; text-decoration: none; font-size: 15px; font-weight: 600; }
.reading-button:hover { background: #076f58; }
.reading-menu { display: none; position: relative; }
.reading-menu summary { display: flex; align-items: center; min-height: 48px; padding: 8px; cursor: pointer; color: var(--green); }
.reading-menu nav { position: absolute; z-index: 5; top: 56px; right: 0; width: 260px; padding: 12px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper); box-shadow: 0 12px 30px #23272512; }
.reading-menu nav a { display: flex; align-items: center; min-height: 48px; padding: 8px 12px; color: var(--ink); }
.collection { padding-block: 88px 120px; }
.collection h1 { font-size: clamp(34px, 5vw, 64px); margin: 0 0 24px; }
.collection-intro { max-width: 640px; color: var(--muted); font-size: 21px; }
.article-card { margin-top: 56px; border: 1px solid var(--line); border-radius: 28px; overflow: hidden; background: #fffdf9; }
.article-card > a { display: grid; grid-template-columns: 1.2fr 1fr; align-items: center; color: var(--ink); text-decoration: none; }
.article-card img { width: 100%; }
.article-card-copy { padding: 36px; }
.article-card-copy p { max-width: 420px; }
.article-card-copy .read-link { display: inline-flex; align-items: center; gap: 12px; min-height: 48px; margin-top: 24px; color: var(--green); font-weight: 600; }
.article-card > a:hover .read-link { text-decoration: underline; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 10px; padding-top: 34px; font-size: 15px; }
.breadcrumbs a { display: inline-flex; align-items: center; min-height: 44px; }
.article-hero { display: grid; grid-template-columns: 1.3fr .7fr; align-items: center; gap: 32px; padding-block: 44px 66px; }
.article-hero h1 { font-size: clamp(34px, 3.4vw, 49px); margin: 0; }
.article-hero img { width: 100%; }
.article-body { width: min(760px, calc(100% - 80px)); margin: 0 auto 100px; font-size: 19px; }
.article-body > p, .article-body > ul { margin-block: 0 26px; }
.article-body h2 { margin: 64px 0 26px; font-size: clamp(25px, 2.5vw, 32px); }
.article-body li + li { margin-top: 10px; }
.article-body strong { font-weight: 650; }
.table-wrap { overflow-x: auto; margin-block: 30px; border: 1px solid var(--line); border-radius: 18px; background: #fffdf9; }
table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
caption { text-align: left; padding: 20px 22px 8px; color: var(--muted); font-size: 15px; }
th, td { padding: 12px 22px; text-align: left; border-bottom: 1px solid var(--line); }
th:last-child, td:last-child { text-align: right; white-space: nowrap; }
tr:last-child td { border-bottom: 0; }
.article-figure { margin: 48px auto; max-width: 620px; }
.article-figure > a { display: block; border: 1px solid var(--line); border-radius: 22px; overflow: hidden; }
.article-figure img { width: 100%; }
figcaption { margin-top: 16px; color: var(--muted); font-size: 15px; line-height: 1.6; }
.article-cta { padding: 30px; margin-top: 34px; border-radius: 24px; background: #e6f0e9; }
.article-cta p + p { margin-top: 20px; }
.article-cta .reading-button { margin-top: 24px; }
.reading-footer { border-top: 1px solid var(--line); padding-block: 40px; }
.reading-footer .reading-wrap { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.reading-footer nav { display: flex; gap: 24px; flex-wrap: wrap; }
.reading-footer nav a { display: inline-flex; align-items: center; min-height: 44px; font-size: 15px; }
@media (max-width: 760px) {
  .reading-wrap { width: calc(100% - 40px); }
  .reading-nav { min-height: 80px; gap: 12px; }
  .reading-brand img { width: 112px; }
  .reading-links { display: none; }
  .reading-menu { display: block; margin-left: auto; }
  .reading-nav > .reading-button { display: none; }
  .collection { padding-block: 52px 72px; }
  .collection-intro { font-size: 18px; }
  .article-card { margin-top: 34px; border-radius: 22px; }
  .article-card > a { grid-template-columns: 1fr; }
  .article-card-copy { padding: 24px; }
  .breadcrumbs { padding-top: 20px; }
  .article-hero { grid-template-columns: 1fr; gap: 12px; padding-block: 22px 36px; }
  .article-hero h1 { font-size: clamp(29px, 7.5vw, 42px); }
  .article-hero img { width: min(300px, 90%); margin-inline: auto; }
  .article-body { width: calc(100% - 40px); font-size: 18px; margin-bottom: 64px; }
  .article-body h2 { margin-top: 46px; font-size: 25px; }
  th, td { padding: 10px 16px; }
  caption { padding-inline: 16px; }
  .article-figure { margin-block: 34px; }
  .article-figure > a { border-radius: 16px; }
  .article-cta { padding: 24px; }
  .reading-footer { padding-block: 28px; }
  .reading-footer nav { gap: 12px 24px; }
}
