/* The typography trial files are for local evaluation only. Obtain web licenses before public use. */
.article {
  --article-font-display: 'Geologica', Arial, sans-serif;
  --article-font-body: 'Object Sans Preview', Arial, sans-serif;
  --article-width: 760px;
  --article-body-size: 20px;
  --article-body-line: 1.6;
  --article-lead-size: 24px;
  --article-h1: 60px;
  --article-h2: 44px;
  --article-h3: 28px;
  --article-caption: 15px;
  --space-paragraph: 24px;
  --space-section: 72px;
  font-family: var(--article-font-body);
  overflow-wrap: break-word;
}
.article .head { width: min(1160px, calc(100% - 112px)); padding-block: 72px 48px; }
.article .headline { max-width: 1050px; font: 800 var(--article-h1)/1 var(--article-font-display); letter-spacing: -.035em; text-transform: none; text-wrap: balance; }
.article .summary { max-width: 760px; margin: 30px 0; font: 500 var(--article-lead-size)/1.48 var(--article-font-body); }
.article .story { width: min(var(--article-width), calc(100% - 112px)); font: 400 var(--article-body-size)/var(--article-body-line) var(--article-font-body); }
.article .story p { margin: 0 0 var(--space-paragraph); }
.article .story h2 { margin: var(--space-section) 0 28px; font: 700 var(--article-h2)/1.05 var(--article-font-display); letter-spacing: -.025em; text-transform: none; text-wrap: balance; }
.article .story h3 { margin: 48px 0 18px; font: 800 var(--article-h3)/1.2 var(--article-font-body); }
.article .byline { font: 500 15px/1.4 var(--article-font-body); }
.article .byline b, .article .byline .reading { font-weight: 700; }
.article .byline small { display: block; color: var(--muted); }
.article .byline .reading { margin-left: 18px; padding-left: 18px; border-left: 1px solid var(--line); }
.article .category { font: 400 12px/1.4 var(--article-font-body); }
.article .tag { font: 500 15px/1.4 var(--article-font-body); padding: 8px 16px; }
.article .story a { color: var(--ink); text-decoration-color: var(--pink); }
.article .story figcaption, .article .hero figcaption { font: 500 var(--article-caption)/1.45 var(--article-font-body); color: var(--muted); }
.article .hero { width: min(1160px, calc(100% - 112px)); }
.article .hero img { display: block; width: 100%; height: auto; max-height: none; object-fit: contain; }
.article .story blockquote { font-family: var(--article-font-display); }
.article .story .author.article-author { display: flex; align-items: flex-start; gap: 20px; margin-top: 72px; padding: 28px 0; border-block: 1px solid var(--line); }
.article .article-author > img { width: 76px; height: 76px; flex: none; border-radius: 50%; object-fit: cover; }
.article .article-author h2 { margin: 0 0 8px; font: 700 28px/1.15 var(--article-font-display); }
.article .article-author p { margin: 0 0 12px; font: 400 16px/1.5 var(--article-font-body); color: var(--muted); }
.article .article-author .social { display: flex; flex-wrap: wrap; gap: 14px; }
.article .article-author .social a { font: 700 14px/1.4 var(--article-font-body); }
.article .story .ask, .article .story .official, .article .story .article-expert-cta { margin: 56px 0; padding: 30px; background: var(--light-pink); border: 1px solid #feaace; }
.article .story .ask h2, .article .story .official h2, .article .story .article-expert-cta h2 { margin: 0 0 18px; font-size: 30px; line-height: 1.15; }
.article .story .ask p:last-child, .article .story .official p:last-child { margin-bottom: 0; }
.article .story .ask a, .article .story .official a, .article .story .article-expert-cta a { color: var(--ink); }
.article .story .ask .button, .article .story .article-expert-cta > a { display: inline-block; margin: 8px 10px 8px 0; padding: 12px 18px; border: 1px solid var(--ink); border-radius: 999px; background: var(--pink); font: 800 14px/1.4 var(--article-font-body); text-decoration: none; text-transform: uppercase; }
.article .story .official a { display: block; padding: 10px 0; }
.article .story pre { max-width: 100%; padding: 20px; overflow-x: auto; background: #f5f2ee; font-size: 15px; }
.article .story .budget-grid h2, .article .story .fact-grid h2, .article .story .mini-grid h2, .article .story .article-route h2, .article .story article h2 { margin: 0 0 12px; font: 800 24px/1.2 var(--article-font-body); }
.article .story .more h2 { margin-top: 0; font-size: 30px; }
.article-cms .story .more { margin-top: 72px; padding-top: 22px; border-top: 1px solid var(--line); }
.article-cms .story .more > h2, .article-cms .story .more > b, .article-cms .story .more > span:first-child { display: block; margin: 0 0 22px; font: 700 30px/1.15 var(--article-font-display); }
.article-cms .story .more > a { display: grid; grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) 24px; align-items: center; gap: 16px; min-height: 0; margin: 0; padding: 18px 0; border: 0; border-top: 1px solid var(--line); color: var(--ink); font: 500 20px/1.3 var(--article-font-body); text-decoration: none; transition: padding-left .2s ease; }
.article-cms .story .more > a:last-child { border-bottom: 1px solid var(--line); }
.article-cms .story .more > a::before { content: "Статья"; color: var(--muted); font: 500 12px/1.3 var(--article-font-body); letter-spacing: .06em; text-transform: uppercase; }
.article-cms .story .more > a::after { content: "→"; justify-self: end; font-size: 25px; line-height: 1; }
.article-cms .story .more--editorial > a::before, .article-cms .story .more--editorial > a::after { content: none; }
.article-cms .story .more__category { color: var(--muted); font: 500 12px/1.3 var(--article-font-body); letter-spacing: .06em; text-transform: uppercase; }
.article-cms .story .more__title { font: 600 20px/1.3 var(--article-font-body); }
.article-cms .story .more__arrow { justify-self: end; font: 400 25px/1 var(--article-font-body); }
.article-cms .story .more > a:hover, .article-cms .story .more > a:focus-visible { padding-left: 8px; text-decoration: none; }
.article-cms .story .more > a:hover .more__title, .article-cms .story .more > a:focus-visible .more__title { text-decoration: underline; text-decoration-color: var(--pink); text-underline-offset: 5px; }
.article-cms .story .more > a:hover .more__arrow, .article-cms .story .more > a:focus-visible .more__arrow { color:inherit; }
.article-cms .story .more > a:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.article .story .gallery--portrait-slider { width: min(760px, 100%); margin: 56px auto; }
.article .story .gallery--portrait-slider .gallery-track { display: flex; gap: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-inline: contain; }
.article .story .gallery--portrait-slider .gallery-track::-webkit-scrollbar { display: none; }
.article .story .gallery--portrait-slider .gallery-track figure { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; scroll-snap-stop: always; text-align: center; }
.article .story .gallery--portrait-slider .gallery-track img { display: block; width: 100%; height: min(68vh, 620px); object-fit: contain; background: var(--paper); }
.article .story .gallery--portrait-slider .gallery-controls { display: flex; align-items: center; justify-content: space-between; margin-top: 18px; }
.article .story .gallery--portrait-slider .gallery-controls button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--ink); border-radius: 50%; background: var(--paper); color: var(--ink); font: 800 20px/1 'Nunito Sans', sans-serif; cursor: pointer; }
.article .story .gallery--portrait-slider .gallery-controls button:disabled { opacity: .35; cursor: default; }
.article .story .gallery--portrait-slider .gallery-controls button:focus-visible { outline: 3px solid var(--pink); outline-offset: 3px; }
.article .story .gallery--portrait-slider .gallery-count { font: 700 14px/1.3 var(--article-font-body); font-variant-numeric: tabular-nums; }
.article .story .article-route-promo { margin-top: 56px; }
@media (max-width: 1024px) {
  .article { --article-width: 700px; --article-body-size: 19px; --article-lead-size: 22px; --article-h1: 52px; --article-h2: 38px; --article-h3: 26px; --space-section: 64px; }
  .article .head, .article .story, .article .hero { width: min(var(--article-width), calc(100% - 64px)); }
  .article .hero { width: calc(100% - 64px); }
}
@media (max-width: 640px) {
  .article { --article-body-size: 18px; --article-lead-size: 19px; --article-h1: 38px; --article-h2: 32px; --article-h3: 24px; --space-section: 56px; }
  .article .head, .article .story, .article .hero { width: calc(100% - 40px); }
  .article .head { padding-block: 48px 36px; }
  .article .headline { line-height: 1.04; }
  .article .byline { gap: 10px; }
  .article .byline .reading { flex-basis: 100%; margin-left: 0; padding-left: 0; border: 0; }
  .article .story .author.article-author { gap: 14px; }
  .article .article-author > img { width: 56px; height: 56px; }
  .article .story .ask, .article .story .official, .article .story .article-expert-cta { padding: 22px 20px; }
  .article .story .ask h2, .article .story .official h2, .article .story .article-expert-cta h2 { font-size: 26px; }
  .article-cms .story .more > a { grid-template-columns: minmax(0, 1fr) 24px; gap: 6px 12px; padding: 16px 0; font-size: 18px; }
  .article-cms .story .more > a::before, .article-cms .story .more__category { grid-column: 1; font-size: 11px; }
  .article-cms .story .more__title { grid-column: 1; font-size: 18px; }
  .article-cms .story .more > a::after, .article-cms .story .more__arrow { grid-column: 2; grid-row: 1 / span 2; }
  .article .story .gallery--portrait-slider .gallery-track img { height: min(65vh, 500px); }
}

/* Annotation: expert panels match their CTA. */
.article .story :is(.ask,.article-expert-cta){background:#fbf3a8;color:#181412;border-color:#181412}
.article .story .official{background:transparent;color:var(--ink);border-color:var(--line)}
.article .story :is(.ask,.article-expert-cta) :is(h2,p,a){color:#181412}
.article .story .official :is(h2,p,a){color:var(--ink)}
.article .story :is(.ask .button,.article-expert-cta>a){background:#feaace;color:#181412}
.article .story .author.article-author{border-block:0}
.article-cms .story .more{border-top:0}
.article-cms .story .more>a,.article-cms .story .more>a:last-child{border-block:0}