.legal {
  min-height: 100svh;
  padding: 10rem 0 var(--space-section);
}

.legal__inner {
  max-width: 46rem;
}

.legal h1 {
  font-size: var(--text-2xl);
  letter-spacing: -0.03em;
  margin-bottom: 0.75rem;
}

.legal__updated {
  margin: 0 0 var(--space-lg);
  font-size: var(--text-xs);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-muted);
}

.legal__body {
  line-height: 1.65;
  color: color-mix(in oklch, var(--color-text) 82%, var(--color-bg));
}

.legal__body h2 {
  margin: var(--space-lg) 0 var(--space-sm);
  font-size: var(--text-xl);
  line-height: 1.15;
}

.legal__body h3 {
  margin: var(--space-md) 0 0.5rem;
  font-size: var(--text-lg);
  line-height: 1.2;
}

.legal__body p,
.legal__body ul,
.legal__body ol {
  margin: 0 0 1rem;
}

.legal__body ul {
  padding-left: 1.25rem;
}

.legal__body ol {
  padding-left: 1.6rem;
}

.legal__body li > ul,
.legal__body li > ol {
  margin: 0.5rem 0 0;
}

.legal__body li {
  margin-bottom: 0.5rem;
}

.legal__body li::marker {
  color: var(--color-accent);
}

.legal__body strong {
  font-weight: 600;
  color: var(--color-text);
}

.legal__body a {
  color: var(--color-text);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

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

.legal__back {
  margin-top: var(--space-lg);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-size: var(--text-xs);
}

@media (max-width: 640px) {
  .legal {
    padding-top: 7.5rem;
  }
}