.legal {
  padding-top: var(--space-16);
  padding-bottom: var(--space-16);
}

.legal .page-header {
  margin-bottom: var(--space-8);
}

.legal h1 {
  font-size: var(--fs-7);
  margin-bottom: var(--space-3);
}

.legal h2 {
  font-size: var(--fs-6);
  margin-top: var(--space-8);
  margin-bottom: var(--space-3);
}

.legal h3 {
  font-size: var(--fs-5);
  margin-top: var(--space-6);
  margin-bottom: var(--space-2);
}

.legal p,
.legal li {
  color: var(--text-2);
  font-size: var(--fs-3);
}

.legal a {
  color: var(--text-1);
}

.legal ul,
.legal ol {
  padding-left: var(--space-6);
  display: grid;
  gap: var(--space-2);
}

.legal section {
  padding: 0;
}

.legal .card {
  padding: var(--space-5);
}

.main-content {
  display: grid;
  gap: var(--space-8);
}

.container-narrow {
  max-width: 860px;
  margin: 0 auto;
}

.page-subtitle {
  color: var(--text-2);
}

.page-header {
  margin-bottom: var(--space-6);
}

.page-title {
  font-size: var(--fs-7);
}

.last-updated {
  background: rgba(255, 255, 255, 0.03);
  border: var(--bw-1) solid var(--border);
  border-radius: var(--r-md);
  padding: var(--space-4);
  color: var(--text-2);
}

.toc {
  margin-top: var(--space-6);
  margin-bottom: var(--space-6);
  padding: var(--space-5);
  border: var(--bw-1) solid var(--border);
  border-radius: var(--r-lg);
  background: var(--surface-0);
}

.toc ul {
  padding-left: 0;
}

.toc li {
  list-style: none;
}

.content-section {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-6);
  border-radius: var(--r-lg);
  border: var(--bw-1) solid var(--border);
  background: var(--surface-0);
}

.highlight,
.important-notice {
  padding: var(--space-5);
  border-radius: var(--r-lg);
  border: var(--bw-1) solid var(--border);
  background: rgba(255, 255, 255, 0.04);
  color: var(--text-2);
}

.contact-info {
  margin-top: var(--space-8);
  padding: var(--space-5);
  border: var(--bw-1) solid var(--border);
  border-radius: var(--r-lg);
  background: var(--surface-0);
  color: var(--text-2);
}

.contact-info a {
  color: var(--text-1);
}

.footer-content {
  text-align: center;
  color: var(--text-2);
}

footer {
  border-top: var(--bw-1) solid var(--border);
  padding: var(--space-8) 0;
}

.language-selector select {
  background: var(--surface-0);
  color: var(--text-1);
  border: var(--bw-1) solid var(--border);
  border-radius: var(--r-pill);
  padding: 8px 12px;
}

.back-link {
  color: var(--text-2);
}

@media (max-width: 768px) {
  .legal {
    padding-top: var(--space-10);
  }
}
