/* Legal pages: date pill, title and long-form text */

.legal__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  max-width: calc(800px + 2 * var(--gutter));
  padding-top: 180px;
  padding-bottom: 120px;
}
.legal__inner > h1 { align-self: stretch; text-align: center; }

.prose { align-self: stretch; }
.prose h1 { font: 60px/60px var(--font-book); letter-spacing: -1.8px; text-align: center; }
.prose h2 { margin-top: 40px; font: 52px/52px var(--font-book); text-align: center; }
.prose h3 { margin-top: 40px; font: 44px/48.4px var(--font-book); letter-spacing: -0.88px; }
.prose h5 { margin-top: 40px; font: 28px/33.6px var(--font-book); letter-spacing: -0.28px; }
.prose h1, .prose h2, .prose h3, .prose h5 { color: var(--ink); white-space: pre-wrap; }
.prose p,
.prose li { color: var(--ink-2); font: 24px/38.4px var(--font-book); white-space: pre-wrap; }
.prose p { margin-top: 20px; }
.prose > p:first-child { margin-top: 0; }
.prose ul { position: relative; padding: 0; }
.prose li { list-style: none; padding-left: 2ch; }
.prose li::before { content: "•"; position: absolute; left: 0; }
.prose strong { font-weight: 700; }

@media (max-width: 1439.98px) {
  .legal__inner { padding-top: 140px; }
  .prose h1 { font-size: 48px; line-height: 48px; letter-spacing: -1.44px; }
  .prose h2 { font-size: 34px; line-height: 34px; }
  .prose h3 { font-size: 34px; line-height: 37.4px; letter-spacing: -0.68px; }
  .prose h5 { font-size: 24px; line-height: 28.8px; letter-spacing: -0.24px; }
}

@media (max-width: 809.98px) {
  .prose h1 { font-size: 36px; line-height: 36px; letter-spacing: -1.08px; }
  .prose h2 { font-size: 22px; line-height: 22px; }
  .prose h3 { font-size: 24px; line-height: 26.4px; letter-spacing: -0.48px; }
  .prose h5 { font-size: 20px; line-height: 24px; letter-spacing: -0.2px; }
}
