.docs-heading, .docs { --s: 1; }
@media screen and (min-width: 1280px) { .docs-heading, .docs { --s: var(--scale); } }

.docs-heading { padding-top: 96px; padding-bottom: 0; }
.docs-heading__title { margin-bottom: calc(32px * var(--s)); }

.docs { display: flex; flex-direction: column; gap: calc(64px * var(--s)); padding-top: calc(64px * var(--s)); padding-bottom: calc(100px * var(--s)); }
.docs-section { display: flex; flex-direction: column; gap: calc(32px * var(--s)); }
.docs-section__head { display: flex; flex-direction: column; gap: calc(16px * var(--s)); }
.docs-section__text { max-width: calc(960px * var(--s)); }
.docs-section__text p + p { margin-top: 1em; }
.docs-section__text a { color: var(--white-70); text-decoration: underline; text-underline-offset: 3px; }
.docs-section__text a:hover { color: var(--white); }
.docs-section__cards { display: grid; gap: calc(24px * var(--s)); }
.docs-section_grid .docs-section__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.docs-card { min-width: 0; display: flex; flex-direction: column; gap: calc(24px * var(--s)); padding: calc(32px * var(--s)); border: 1px solid var(--white-05); border-radius: calc(16px * var(--s)); background: var(--gray-dark-90); }
.docs-section_grid .docs-card { min-height: calc(464px * var(--s)); }
.docs-section_rows .docs-card { display: grid; grid-template-columns: calc(420px * var(--s)) minmax(0, 1fr); align-items: start; gap: calc(42px * var(--s)); }
.docs-card__head { display: flex; flex-direction: column; gap: calc(12px * var(--s)); min-width: 0; }
.docs-card__caption { font-size: calc(12px * var(--s)); line-height: 130%; }
.docs-card__list { min-width: 0; padding: 0; margin: 0; list-style: none; }

.docs-link { display: flex; gap: calc(16px * var(--s)); align-items: center; padding: calc(20px * var(--s)) calc(16px * var(--s)); border-bottom: 1px solid rgba(255, 255, 255, .08); border-radius: calc(8px * var(--s)); color: var(--white); transition: background .16s; }
.docs-link:focus-visible { background: #1c1c1c; }
@media (hover: hover) and (pointer: fine) { .docs-link:hover { background: #1c1c1c; } }
.docs-link__format { flex: 0 0 calc(28px * var(--s)); font-size: calc(12px * var(--s)); color: var(--accent); }
.docs-link__title { flex: 1 1 0; min-width: 0; }
.docs-link__arrow { flex: 0 0 auto; width: calc(24px * var(--s)); height: calc(24px * var(--s)); }

@media screen and (min-width: 1280px) { .docs-heading { padding-top: calc(168px * var(--scale)); } }
@media screen and (min-width: 701px) and (max-width: 1279px) { .docs-heading { padding-top: 124px; } }

@media screen and (max-width: 1279px) {
  .docs { padding-top: 52px; }
  .docs-section_grid .docs-section__cards { grid-template-columns: minmax(0, 1fr); }
  .docs-section_grid .docs-card { min-height: 0; }
  .docs-section_rows .docs-card { display: flex; gap: 24px; }
  .docs-card { padding: 24px; }
}

@media screen and (max-width: 700px) {
  .docs { gap: 48px; padding-top: 32px; padding-bottom: 64px; }
  .docs-heading__title { margin-bottom: 24px; }
  .docs-section { gap: 24px; }
  .docs-card { padding: 16px; }
}
