.documents-page { background: var(--light); }

.documents-page .desktop-nav__group {
  border-left: 0;
}
.documents-cover { position: relative; display: flex; min-height: 605px; padding: 375px 3.125vw 0; flex-direction: column; align-items: flex-start; overflow: hidden; color: var(--light); background: var(--dark); }
.documents-cover__title { margin: 0; font-family: "LT Superior", Arial, sans-serif; font-size: 6.7708vw; font-weight: 450; line-height: 1; }
.documents-content { --documents-inner-height: 9736px; --documents-bottom-line-offset: 159px; position: relative; display: grid; grid-template-columns: 34.7917vw 1fr; min-height: 9896px; border-bottom: 1px solid var(--dark); background: var(--light); }
.documents-contact { padding: 33px 3.125vw 0; border-right: 1px solid var(--dark); color: var(--dark); }
.documents-contact__sticky { position: sticky; top: 100px; height: max-content; margin-bottom: calc(var(--documents-bottom-line-offset) + 60px); }
.documents-contact__eyebrow { font-size: 16px; line-height: 1.4; text-transform: uppercase; }
.documents-contact h2 { max-width: 543px; margin-top: 105px; font-family: "LT Superior", Arial, sans-serif; font-size: 40px; font-weight: 450; line-height: 1; }
.documents-contact__details { display: flex; flex-direction: column; gap: 40px; margin-top: 105px; font-size: 19px; line-height: 1.4; text-transform: uppercase; }
.documents-contact__links { display: flex; flex-direction: column; gap: 7px; }
.documents-contact a, .document-section__text a { text-decoration: underline; text-underline-position: from-font; }
.documents-area { min-width: 0; }
.documents-tabs { display: flex; min-height: 86px; }
.documents-tab { flex: 1 1 50%; min-width: 0; padding: 12px 38px; border-bottom: 1px solid var(--dark); color: var(--muted); background: var(--light); font-size: 16px; font-weight: 500; line-height: 1.2; text-align: center; text-transform: uppercase; }
.documents-tab + .documents-tab { border-left: 1px solid var(--dark); }
.documents-tab.is-active { color: var(--dark); }
.documents-tab:hover, .documents-tab:focus-visible { color: var(--dark); }
/* Высоту пункта задаёт его текст, ритм — padding секции. Раньше каждому
   пункту прописывали высоту, снятую с макета: на 820px это давало 1576px
   пустоты суммарно, на 1920px текст, наоборот, вылезал за нижнюю границу.
   В Bitrix текст документов редактируется, и любая правка ломала бы разметку. */
.document-section { display: flex; gap: 20px; padding: 100px 20px 60px; border-bottom: 1px solid var(--dark); color: var(--dark); }
.document-section--last { border-bottom: 0; }
.document-section__number { flex: 0 0 110px; font-family: "LT Superior", Arial, sans-serif; font-size: 40px; font-weight: 450; line-height: 1; }
.document-section__body { width: min(890px, 100%); }
.document-section h2 { max-width: 739px; margin: 0 0 40px; font-family: "LT Superior", Arial, sans-serif; font-size: 40px; font-weight: 450; line-height: 1; }
.document-section__text { font-family: "LT Superior", Arial, sans-serif; font-size: 22px; font-weight: 450; line-height: 1.2; overflow-wrap: anywhere; }
.document-section__text p { margin: 0 0 1.2em; }
.document-section__text p:last-child { margin-bottom: 0; }
.document-section__text ul { margin: 0 0 1.2em; padding-left: 33px; }
.document-section__text li { margin-bottom: 1.2em; padding-left: 0; }
.document-section__text li:last-child { margin-bottom: 0; }
.document-section__text li::marker { font-size: .7em; }
.documents-panel[hidden] { display: none; }
.documents-footer { background: var(--dark); }

@media (max-width: 1199px) {
  .documents-contact { display: none; }
}

@media (min-width: 1200px) {
  .documents-page .desktop-nav__group { height: 10.4167vw; }
  .documents-page .desktop-nav__group:last-child { height: 10.4167vw; }
  .documents-page .desktop-nav__group::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 100%;
    background: var(--light);
    content: "";
    transition: transform 420ms cubic-bezier(.22, 1, .36, 1);
    will-change: transform;
  }

  .documents-page.is-scrolled .desktop-nav__group::before {
    transform: translateY(-100%);
  }
  .documents-content { min-height: 0; border-bottom: 0; }
  .documents-area { padding-bottom: 160px; }
  .documents-content::after { position: absolute; z-index: 2; right: 0; bottom: var(--documents-bottom-line-offset); left: 0; height: 1px; background: var(--dark); content: ""; }
}

@media (min-width: 1200px) and (max-width: 1919px) {
  .documents-content { --documents-bottom-line-offset: 8.2813vw; }
  .documents-cover { min-height: 31.5104vw; padding-top: 19.5313vw; }
  .documents-contact { padding: 1.7188vw 3.125vw 0; }
  .documents-contact__sticky { top: 5.2083vw; }
  .documents-contact__eyebrow { font-size: .8333vw; }
  .documents-contact h2 { max-width: 28.2813vw; margin-top: 5.4688vw; font-size: 2.0833vw; }
  .documents-contact__details { gap: 2.0833vw; margin-top: 5.4688vw; font-size: .9896vw; }
  .documents-contact__links { gap: .3646vw; }
  .documents-area { padding-bottom: 8.3333vw; }
  .documents-tabs { min-height: 4.4792vw; }
  .documents-tab { padding: .625vw 1.9792vw; font-size: .8333vw; }
  .document-section { gap: 1.0417vw; padding: 5.2083vw 1.0417vw 3.125vw; }
  .document-section__number { flex-basis: 5.7292vw; font-size: 2.0833vw; }
  .document-section__body { width: min(46.3542vw,100%); }
  .document-section h2 { max-width: 38.4896vw; margin-bottom: 2.0833vw; font-size: 2.0833vw; }
  .document-section__text { font-size: 1.1458vw; }
  .document-section__text ul { padding-left: 1.7188vw; }
}

@media (min-width: 600px) and (max-width: 1199px) {
  .documents-cover { min-height: 430px; padding: 280px 4.1667vw 0; }
  .documents-cover__title { font-size: 7.7865vw; }
  .documents-content { display: block; min-height: 0; }
  .documents-contact { min-height: 430px; padding: 32px 4.1667vw 0; border-right: 0; border-bottom: 1px solid var(--dark); }
  .documents-contact__sticky { display: contents; }
  .documents-contact h2 { margin-top: 51px; font-size: 40px; }
  .documents-contact__details { display: grid; grid-template-columns: 1fr 1fr; gap: 0 62px; margin-top: 50px; font-size: 16px; }
  .documents-contact__details > p { margin: 0; }
  .documents-contact__details > p:last-child { margin-top: 28px; }
  .documents-tabs { width: 100%; min-height: 86px; }
  .document-section { gap: 20px; padding: 60px 4.1667vw 50px; }
  .document-section__number { flex-basis: 70px; font-size: 36px; }
  .document-section__body { width: calc(100% - 90px); }
  .document-section h2 { margin-bottom: 32px; font-size: 36px; }
  .document-section__text { font-family: "Roboto", Arial, sans-serif; font-size: 16px; line-height: 1.45; }
  .document-section__text ul { padding-left: 24px; }
  .document-section__text p, .document-section__text li { margin-bottom: 1.45em; }
  .documents-footer { min-height: 1056px; }

}

@media (max-width: 599px) {
  .documents-cover { min-height: 300px; padding: 215px 15px 0; }
  .documents-cover__title { font-size: 60px; }
  .documents-content { display: block; min-height: 0; }
  .documents-contact { min-height: 452px; padding: 44px 15px 0; border-right: 0; border-bottom: 1px solid var(--dark); }
  .documents-contact__sticky { display: contents; }
  .documents-contact__eyebrow { font-size: 16px; }
  .documents-contact h2 { margin-top: 33px; font-size: 30px; }
  .documents-contact__details { gap: 16px; margin-top: 33px; font-size: 19px; }
  .documents-tabs { display: block; min-height: 140px; }
  .documents-tab { display: flex; width: 100%; min-height: 70px; align-items: center; justify-content: center; padding: 12px 38px; font-size: 14px; }
  .documents-tab + .documents-tab { border-left: 0; }
  .document-section { gap: 0; display: block; margin: 0 15px; padding: 35px 0 45px; }
  .document-section__number { display: block; min-height: 31px; font-family: "Roboto", Arial, sans-serif; font-size: 28px; font-weight: 500; line-height: 1.1; }
  .document-section__body { width: 100%; margin-top: 24px; }
  .document-section h2 { margin-bottom: 24px; font-family: "Roboto", Arial, sans-serif; font-size: 28px; font-weight: 500; line-height: 1.1; }
  .document-section__text { font-family: "Roboto", Arial, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.45; }
  .document-section__text p { margin-bottom: 1.45em; }
  .document-section__text ul { margin-bottom: 1.45em; padding-left: 24px; }
  .document-section__text li { margin-bottom: 1.45em; }
}