/* ==========================================================================
   NÜKT — юридичні сторінки (privacy.html)

   Макета в Figma немає: інженерне рішення в пластиці сайту — білий фон,
   волосяні лінії, ті самі токени кеглів і відступів. Текст юриста довгий,
   тому колонка вузька (~72 знаки в рядку), а не на всю ширину контейнера.
   ========================================================================== */

.legal__inner {
  max-width: calc(760px + 2 * var(--gutter));
}

.legal__head {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  margin-bottom: var(--space-9);
}

.legal__title {
  font-size: var(--font-size-h2);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-display);
  letter-spacing: var(--letter-spacing-display);
  text-wrap: balance;
}

.legal__date {
  color: var(--color-text-muted);
  font-size: var(--font-size-body);
}

/* Примітка "лише англійською" — тільки для DE / FR */
.legal__notice {
  margin-bottom: var(--space-7);
  padding: var(--space-4) var(--space-5);
  background-color: var(--color-bg-tint);
  font-size: var(--font-size-body);
}

html[lang='en'] .legal__notice {
  display: none;
}

/* --------------------------------------------------------------------------
   Текст
   -------------------------------------------------------------------------- */
.legal__body {
  color: var(--color-text);
  font-size: var(--font-size-lead);
  line-height: var(--line-height-lead);
}

.legal__body p + p,
.legal__body p + ul,
.legal__body ul + p,
.legal__body p + address,
.legal__body address + p,
.legal__body p + .legal__table-wrap {
  margin-top: var(--space-4);
}

.legal__body section {
  /* Якорі змісту не ховаються під липким хедером */
  scroll-margin-top: calc(var(--header-height) + var(--space-6));
  margin-top: var(--space-9);
  padding-top: var(--space-6);
  border-top: var(--border-width) solid var(--color-border-soft);
}

.legal__body h2 {
  margin-bottom: var(--space-4);
  font-size: var(--font-size-h4);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-heading);
  letter-spacing: var(--letter-spacing-h4);
}

.legal__body ul {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding-left: 1.25em;
  list-style: disc;
}

.legal__body address {
  font-style: normal;
}

.legal__body a {
  color: var(--color-accent);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Зміст */
.legal__toc {
  margin-top: var(--space-7);
  padding: var(--space-5) var(--space-6);
  background-color: var(--color-bg-soft);
  font-size: var(--font-size-body);
}

.legal__toc ol {
  columns: 2;
  column-gap: var(--space-7);
  padding-left: 1.6em;
  list-style: decimal;
}

.legal__toc li {
  break-inside: avoid;
  padding-block: 2px;
}

.legal__toc a {
  color: var(--color-text);
  text-decoration: none;
}

.legal__toc a:hover {
  color: var(--color-accent);
  text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Таблиця розділу 5
   -------------------------------------------------------------------------- */
.legal__table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--font-size-body);
  line-height: var(--line-height-body);
}

.legal__table th,
.legal__table td {
  padding: var(--space-3) var(--space-3) var(--space-3) 0;
  border-bottom: var(--border-width) solid var(--color-border-soft);
  text-align: left;
  vertical-align: top;
}

.legal__table thead th {
  color: var(--color-text-muted);
  font-size: var(--font-size-label);
  font-weight: var(--font-weight-bold);
  border-bottom-color: var(--color-border);
}

.legal__table tbody th {
  width: 24%;
  font-weight: var(--font-weight-bold);
}

.legal__back {
  margin-top: var(--space-11);
  font-size: var(--font-size-body);
}

.legal__back a {
  color: var(--color-text);
  font-weight: var(--font-weight-bold);
}

.legal__back a:hover {
  color: var(--color-accent);
}

/* Одна колонка: зміст у стовпчик, таблиця — картками з підписами */
@media (max-width: 767px) {
  .legal__toc ol {
    columns: 1;
  }

  .legal__table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  .legal__table tr {
    display: block;
    padding-block: var(--space-4);
    border-bottom: var(--border-width) solid var(--color-border-soft);
  }

  .legal__table th,
  .legal__table td {
    display: block;
    width: auto;
    padding: 0;
    border: 0;
  }

  .legal__table tbody th {
    width: auto;
    margin-bottom: var(--space-2);
  }

  .legal__table td + td,
  .legal__table th + td {
    margin-top: var(--space-2);
  }

  .legal__table td::before {
    content: attr(data-label);
    display: block;
    color: var(--color-text-muted);
    font-size: var(--font-size-label);
  }
}

/* --------------------------------------------------------------------------
   Компактний футер: лише нижня смуга, без великих відступів головної
   -------------------------------------------------------------------------- */
.footer--compact {
  padding-block: var(--space-9);
}

.footer--compact .footer__bar {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}