/* Правовые страницы LUFTMOBILE.
 *
 * Отдельный файл, потому что задача другая: здесь не продают, здесь читают. Значит —
 * длина строки под чтение, а не под витрину; никакого движения; максимальный контраст
 * текста. Урок `legal-pages-waren-links-aber-kein-rechtstext`: правовая страница, которую
 * неудобно читать, равна отсутствующей.
 */

body.legal { background: var(--coal); }

.doc { padding-block: 8.5rem 5rem; }
.doc__shell {
  max-width: 60rem;
  margin-inline: auto;
  padding-inline: var(--pad-x);
}

.doc h1 {
  font-size: clamp(2.6rem, 7vw, 5rem);
  margin-block: 1.1rem 1.4rem;
}
.doc__lead {
  font-size: clamp(1.02rem, 1.2vw, 1.18rem);
  color: var(--paper-dim);
  max-width: 52ch;
  padding-bottom: 2.4rem;
  border-bottom: 1px solid var(--line);
}

.doc section { padding-block: 2.6rem; border-bottom: 1px solid var(--line-soft); }
.doc section:last-of-type { border-bottom: none; }
.doc h2 {
  font-size: clamp(1.5rem, 2.6vw, 2.1rem);
  color: var(--paper);
  margin-bottom: 1.2rem;
}
.doc h3 {
  font-size: 1.25rem;
  color: var(--amber);
  margin-block: 1.8rem 0.7rem;
}
/* Мера чтения: 68 знаков. Длиннее — глаз теряет строку на возврате. */
.doc p { max-width: 68ch; color: var(--paper-dim); margin-bottom: 0.9rem; }
.doc p b, .doc li b { color: var(--paper); font-weight: 500; }
.doc a { color: var(--amber); text-decoration: underline; text-underline-offset: 3px; }
.doc a:hover { color: var(--amber-hot); }

/* Содержание: правовую страницу читают не сверху вниз, а по нужному пункту. */
.toc {
  display: flex; flex-wrap: wrap; gap: 0.4rem;
  padding-block: 2.2rem;
  border-bottom: 1px solid var(--line-soft);
}
.toc a {
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.688rem; letter-spacing: 0.1em;
  color: var(--paper-dim); text-decoration: none;
  border: 1px solid var(--line);
  padding: 0.34rem 0.62rem;
  transition: border-color 0.35s var(--ease), color 0.35s var(--ease);
}
.toc a:hover { border-color: var(--amber); color: var(--amber); }

/* Пары «поле — значение»: обязательные сведения ищут глазами, а не читают прозой. */
.pairs {
  display: grid;
  grid-template-columns: minmax(9rem, 15rem) minmax(0, 1fr);
  gap: 0.2rem 2rem;
  margin-bottom: 1.2rem;
}
.pairs dt {
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.688rem; letter-spacing: 0.13em; text-transform: uppercase;
  color: var(--muted);
  padding-block: 0.7rem;
  border-top: 1px solid var(--line-soft);
  hyphens: auto;
}
.pairs dd {
  color: var(--paper);
  padding-block: 0.7rem;
  border-top: 1px solid var(--line-soft);
  max-width: 58ch;
}
.pairs dd em { color: var(--paper-dim); font-style: normal; font-size: 0.938rem; }
.pairs dt:first-of-type, .pairs dd:first-of-type { border-top: none; }

.list { list-style: none; display: grid; gap: 0.6rem; margin-block: 0.9rem 1.4rem; max-width: 68ch; }
.list li { display: flex; gap: 0.75rem; color: var(--paper-dim); }
.list li::before { content: "—"; color: var(--amber); flex: none; }

.hint {
  font-size: 0.938rem;
  color: var(--muted);
  border-left: 2px solid var(--line);
  padding-left: 1rem;
  margin-block: 1.1rem;
}
.hint.warn { border-left-color: var(--amber); color: var(--paper-dim); }

.box {
  border: 1px solid var(--line);
  background: var(--slate);
  padding: 1.2rem 1.4rem;
  max-width: 40ch;
}

.doc__stamp {
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.688rem; letter-spacing: 0.15em; text-transform: uppercase;
  color: var(--muted);
  padding-top: 2.4rem;
}
.doc__nav { display: flex; flex-wrap: wrap; gap: 0.8rem; padding-block: 1.6rem 3rem; }

/* Заметка для владельца: видно на просмотре и снимается одной строкой перед выпуском. */
.doc__note {
  border: 1px dashed var(--amber-deep);
  background: linear-gradient(103deg, rgba(255, 160, 46, 0.05), transparent 62%);
  padding: 1.6rem 1.8rem;
}
.doc__note h3 { margin-top: 0; }
.doc__note p:last-child { margin-bottom: 0; }

@media (max-width: 700px) {
  .doc { padding-block: 6.5rem 3rem; }
  .pairs { grid-template-columns: 1fr; gap: 0; }
  .pairs dt { padding-bottom: 0.15rem; }
  .pairs dd { padding-top: 0; border-top: none; padding-bottom: 0.9rem; }
  .pairs dd:first-of-type { padding-top: 0; }
}