/* Документы Организации: полный текст под раскрывающейся кнопкой.
 *
 * Файл отдельный от layout.css по той же причине, по какой у карты свой
 * map.css: документы нужны одной странице («О нас»), а правила для них
 * живут своей жизнью и не должны попадать на остальные страницы.
 *
 * Раскрытие — нативный <details>: работает без JavaScript, доступен с
 * клавиатуры и скринридеру, а состояние «открыто» переживает перезагрузку
 * страницы. <summary> оформлен как кнопка сайта, стрелка в нём —
 * CSS-треугольник, а не значок: иконки-эмодзи запрещены ТЗ 4.3.
 */
.doc {
  margin-top: 1.5rem;
}

.doc__summary {
  list-style: none;
  cursor: pointer;
}

.doc__summary::-webkit-details-marker {
  display: none;
}

/* Стрелка раскрытия — вниз: так она читается как «ещё текст», а не как
 * переход вправо. В раскрытом виде поворачивается вверх. */
.doc__summary::after {
  content: "";
  display: inline-block;
  margin-left: 0.6rem;
  border: 0.35rem solid transparent;
  border-top-color: currentColor;
  transition: transform 200ms ease;
}

.doc[open] .doc__summary::after {
  transform: rotate(180deg);
}

.doc__summary:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

/* Раскрытый документ — с отступом слева.
 *
 * Текст стоял по той же левой линии, что и кнопка «Подробнее», и читался
 * как продолжение абзаца над ней: заголовок документа, центрированный,
 * начинался ровно под рамкой кнопки, и границы между описанием сверху и
 * самим документом не было видно. Отступ с тонкой линией отделяет
 * документ от страницы — теперь видно, где кончилось описание и начался
 * текст документа. Правый край при этом остаётся на месте: 70ch — это
 * ширина блока целиком, и полоса набора текста внутри него сужается на
 * величину отступа, а не выходит за границу колонки. */
.doc__body {
  margin-top: 2rem;
  max-width: 70ch;
  padding-left: 2rem;
  border-left: 1px solid rgba(255, 255, 255, .12);
}

/* На узком экране отступ меньше: два рема от полосы съедали бы текст. */
@media (max-width: 720px) {
  .doc__body {
    padding-left: 1.25rem;
  }
}

/* Заголовочный блок документа — как в самом документе. */
.doc__title {
  margin: 1.5rem 0 2rem;
  text-align: center;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0;
}

/* Разделы документа: «1. Общие положения» и далее. */
.doc__section {
  margin: 2rem 0 0.75rem;
  font-size: 0.95rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.doc__body p {
  margin-top: 0.75rem;
  line-height: 1.7;
}

.doc__list {
  margin: 0.5rem 0 0;
  padding-left: 1.25rem;
}

.doc__list li {
  margin-top: 0.35rem;
  line-height: 1.7;
}