/* Blog of zavodsporta.pro: article and listing blocks on top of /catalog/catalog.css (fonts, header, footer, lead form). */
/* Palette of the catalog: accent #afca0b, text #2e2e2e #424242 #828282, lines #ebebeb, soft background #f8f8f8, no rounding. */
.st-page { padding-bottom: 72px; }
.st-page:not(.st-blog) { max-width: 860px; }

.st-crumbs { font-size: 13px; color: #828282; padding-top: 18px; line-height: 1.5; }
.st-crumbs a { color: #828282; }
.st-crumbs a:hover { color: #000; }
.st-crumbs__sep { margin: 0 7px; }
.st-crumbs__current { color: #424242; }

.st-post__head { margin: 22px 0 30px; }
.st-h1 { color: #2e2e2e; font-size: 40px; font-weight: 700; text-transform: uppercase; line-height: 1.15; margin: 0 0 16px; }
.st-date, .st-author { font-size: 14px; line-height: 1.5; color: #828282; }
.st-author__name { color: #424242; font-weight: 600; }

.st-article { color: #2e2e2e; font-size: 18px; line-height: 1.6; }
.st-article .t-redactor__text { margin: 0 0 18px; }
.st-article .t-redactor__h2 { color: #2e2e2e; font-size: 30px; font-weight: 700; line-height: 1.2; margin: 52px 0 18px; scroll-margin-top: 90px; }
.st-article .t-redactor__h2::before { content: ""; display: block; width: 44px; height: 4px; background: #afca0b; margin: 0 0 16px; }
.st-article .t-redactor__h3 { color: #2e2e2e; font-size: 22px; font-weight: 600; line-height: 1.3; margin: 32px 0 12px; }
.st-article strong { font-weight: 600; }
.st-article a { color: #2e2e2e; text-decoration: underline; text-decoration-color: #afca0b; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.st-article a:hover { text-decoration-color: #2e2e2e; }

.st-list, .st-steps { margin: 0 0 22px; padding: 0; list-style: none; }
.st-list li, .st-steps li { position: relative; margin: 0 0 10px; padding-left: 30px; }
.st-list li::before { content: ""; position: absolute; left: 4px; top: .62em; width: 8px; height: 8px; background: #afca0b; }
.st-steps { counter-reset: st; }
.st-steps li { counter-increment: st; padding-left: 38px; }
.st-steps li::before { content: counter(st); position: absolute; left: 0; top: .1em; min-width: 26px; height: 26px; padding: 0 4px;
  background: #2e2e2e; color: #fff; font-size: 15px; font-weight: 600; line-height: 26px; text-align: center; }

.st-summary { background: #f8f8f8; border-left: 4px solid #afca0b; padding: 20px 24px; margin: 0 0 26px; }
.st-summary__title, .st-toc__title, .st-related__title { font-size: 18px; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; margin: 0 0 12px; }
.st-summary ul { margin: 0; padding-left: 20px; }
.st-summary li { margin: 0 0 8px; line-height: 1.5; font-size: 17px; }
.st-summary li:last-child { margin-bottom: 0; }
.st-toc { border: 1px solid #ebebeb; padding: 18px 24px; margin: 0 0 30px; }
.st-toc ol { margin: 0; padding-left: 22px; }
.st-toc li { margin: 0 0 6px; font-size: 17px; line-height: 1.45; }
.st-article .st-toc a { text-decoration: none; }
.st-article .st-toc a:hover { text-decoration: underline; text-decoration-color: #afca0b; }

.st-note { background: #f8f8f8; border-left: 4px solid #ebebeb; padding: 16px 20px; margin: 0 0 24px; }
.st-note .t-redactor__text { margin: 0; }

.st-figure { margin: 30px 0; }
.st-figure img { display: block; width: 100%; height: auto; background: #f8f8f8; }

.st-table { overflow-x: auto; margin: 0 0 26px; }
.st-table table { border-collapse: collapse; width: 100%; font-size: 16px; line-height: 1.45; }
.st-table th, .st-table td { border: 1px solid #ebebeb; padding: 11px 13px; text-align: left; vertical-align: top; }
.st-table th { background: #f8f8f8; font-weight: 600; color: #2e2e2e; }

.st-cta { background: #2e2e2e; color: #fff; padding: 28px 30px; margin: 36px 0; }
.st-cta__title { font-size: 24px; font-weight: 700; text-transform: uppercase; line-height: 1.2; margin: 0 0 10px; }
.st-article .st-cta .t-redactor__text { color: #ebebeb; margin: 0 0 20px; font-size: 17px; }
.st-cta__btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 30px; border: 0; cursor: pointer;
  background: #afca0b; color: #2e2e2e; font-family: inherit; font-size: 16px; font-weight: 600; transition: filter .15s; }
.st-cta__btn:hover { filter: brightness(.92); }
.st-cta__btn:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

.st-faq details { border-bottom: 1px solid #ebebeb; padding: 14px 0; }
.st-faq details:first-of-type { border-top: 1px solid #ebebeb; }
.st-faq summary { cursor: pointer; font-size: 19px; font-weight: 600; line-height: 1.4; list-style: none; position: relative; padding-right: 32px; }
.st-faq summary::-webkit-details-marker { display: none; }
.st-faq summary::after { content: "+"; position: absolute; right: 4px; top: -2px; font-size: 26px; font-weight: 400; color: #afca0b; }
.st-faq details[open] summary::after { content: "\2013"; }
.st-faq__a { padding: 10px 0 2px; }
.st-faq__a .t-redactor__text { margin: 0; }

.st-sources ol { padding-left: 22px; font-size: 15px; line-height: 1.5; }
.st-sources li { margin: 0 0 6px; }
.st-related { margin: 30px 0 0; padding: 20px 24px; background: #f8f8f8; }
.st-related ul { margin: 0; padding-left: 20px; }
.st-related li { margin: 0 0 6px; }

.st-blog .h1 { margin: 22px 0 32px; }
.st-cards { list-style: none; margin: 0 0 20px; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 22px; }
.st-card { border: 1px solid #ebebeb; background: #fff; transition: border-color .18s; }
.st-card:hover { border-color: #afca0b; }
.st-card__link { display: flex; flex-direction: column; height: 100%; color: #2e2e2e; }
.st-card__img { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: #f8f8f8; }
.st-card__img img { width: 100%; height: 100%; object-fit: cover; }
.st-card__body { display: flex; flex-direction: column; flex: 1; padding: 18px 20px 22px; }
.st-card__date { font-size: 13px; color: #828282; }
.st-card__title { font-size: 20px; font-weight: 600; text-transform: uppercase; line-height: 1.3; color: #2e2e2e; margin: 8px 0 10px; }
.st-card__desc { font-size: 16px; font-weight: 300; line-height: 1.5; color: #424242; flex: 1; }
.st-card__more { margin-top: 18px; font-size: 15px; font-weight: 600; text-decoration: underline; text-decoration-color: #afca0b;
  text-decoration-thickness: 2px; text-underline-offset: 4px; }

@media (max-width: 979px) {
  .st-h1 { font-size: 32px; }
  .st-article .t-redactor__h2 { font-size: 26px; margin-top: 44px; }
  .st-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .st-post__head { margin: 16px 0 22px; }
  .st-h1 { font-size: 25px; line-height: 1.2; }
  .st-article { font-size: 17px; }
  .st-article .t-redactor__h2 { font-size: 22px; margin: 38px 0 14px; }
  .st-article .t-redactor__h3 { font-size: 19px; }
  .st-summary { padding: 16px 18px; }
  .st-summary li, .st-toc li { font-size: 16px; }
  .st-toc { padding: 16px 18px; }
  .st-figure { margin: 22px 0; }
  .st-table table, .st-table thead, .st-table tbody, .st-table tr, .st-table td { display: block; width: 100%; }
  .st-table thead { display: none; }
  .st-table tr { border: 1px solid #ebebeb; margin: 0 0 12px; }
  .st-table td { border: 0; border-bottom: 1px solid #ebebeb; padding: 9px 13px; }
  .st-table td:last-child { border-bottom: 0; }
  .st-table td::before { content: attr(data-label); display: block; font-size: 13px; color: #828282; margin: 0 0 3px; }
  .st-cta { padding: 22px 20px; margin: 30px 0; }
  .st-cta__title { font-size: 20px; }
  .st-cta__btn { width: 100%; }
  .st-faq summary { font-size: 17px; }
  .st-cards { grid-template-columns: 1fr; gap: 22px; }
  .st-card__title { font-size: 18px; }
}
@media (hover: none) {
  .st-cta__btn:hover { filter: none; }
  .st-card:hover { border-color: #ebebeb; }
}