/* Аква Стар — страница документа (политика). Значения — из ../tokens.css */

.doc { padding-block: var(--section-y); }
.doc__inner { max-width: calc(var(--doc-w) + 2 * var(--gutter)); }

.doc__kicker {
  margin-bottom: var(--gap-m);
  font-size: var(--fs-small);
  font-weight: var(--w-medium);
  color: var(--color-muted);
}
.doc__title {
  margin-bottom: var(--gap-l);
  font-size: var(--fs-h2);
  font-weight: var(--w-black);
  line-height: var(--lh-head);
  text-wrap: balance;
}
.doc__lead {
  margin-bottom: var(--gap-xl);
  font-size: var(--fs-lead);
  line-height: var(--lh-tight);
  text-wrap: pretty;
}

.doc__section { margin-bottom: var(--gap-xl); }
.doc__section h2 {
  display: flex;
  align-items: baseline;
  gap: var(--gap-m);
  margin-bottom: var(--gap-m);
  padding-top: var(--gap-m);
  border-top: var(--border) solid var(--color-line);
  font-size: var(--fs-h3);
  font-weight: var(--w-bold);
  line-height: var(--lh-tight);
}
.doc__section h2 span {
  min-width: var(--num-w);
  color: var(--blue-deep);
}
.doc__section p,
.doc__section ul { margin-bottom: var(--gap-s); }
.doc__section ul {
  padding-left: var(--gap-l);
  list-style: disc;
}
.doc__section li { margin-bottom: var(--gap-xs); }
.doc__title { text-transform: uppercase; }
.doc__section a {
  color: var(--blue-deep);
  text-decoration-thickness: var(--border);
  text-underline-offset: var(--gap-xs);
}

/* Реквизиты */
.doc__req {
  margin: 0;
  border-top: var(--border) solid var(--color-line);
}
.doc__req > div {
  display: grid;
  grid-template-columns: var(--req-col) 1fr;
  gap: var(--gap-m);
  padding-block: var(--gap-s);
  border-bottom: var(--border) solid var(--color-line);
}
.doc__req dt {
  font-size: var(--fs-small);
  font-weight: var(--w-medium);
  color: var(--color-muted);
}
.doc__req dd { margin: 0; }
.doc__req a { color: var(--blue-deep); }

.doc__back {
  font-weight: var(--w-medium);
  white-space: nowrap;
  text-decoration: none;
  transition: color var(--transition);
}
.doc__back:hover { color: var(--blue-deep); }

.doc__footer { padding-block: var(--gap-l); }
.doc__footer .doc__back { color: var(--color-muted-dark); }
.doc__footer .doc__back:hover { color: var(--color-on-dark); }

@media (max-width: 519px) {
  .doc__req > div { grid-template-columns: 1fr; gap: var(--gap-xs); }
}