/* Shared reading style for articles and text pages (privacy, terms, ...).
   A centred column of --measure; base.css resets margins and list markers, this
   puts them back for running text. */
.prose { max-inline-size: var(--measure); margin-inline: auto; }
.prose > * + * { margin-block-start: 1.25rem; }
.prose > :first-child { margin-block-start: 0; }

/* A run of prose between full-width sections on a standard page */
.prose-section { padding-block: clamp(3rem, 6vw, 5rem); }
.prose-section:last-child { padding-block-end: var(--section); }

.prose h2 {
  margin-block-start: 3rem;
  font-size: clamp(1.75rem, 2.2vw + .9rem, 2.75rem);
}
.prose h3 {
  margin-block-start: 2.25rem;
  font-size: clamp(1.375rem, 1vw + 1rem, 1.75rem);
  line-height: 1.2;
  letter-spacing: -.01em;
}
.prose h2 + *,
.prose h3 + * { margin-block-start: 1rem; }

/* Hanging markers: wrapped lines align with the first line, not the marker */
.prose ul,
.prose ol { padding-inline-start: 1.375rem; }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose li + li { margin-block-start: .5rem; }
.prose li::marker { color: var(--ink-muted); }

.prose b,
.prose strong { font-weight: 600; }

.prose a {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
  transition: text-decoration-color .2s;
}
.prose a:hover { text-decoration-color: var(--terracotta); }

/* Block quotes and pull quotes are the serif italic pull line */
.prose blockquote {
  margin-block: 2.5rem;
  margin-inline: 0;
  font: italic 400 clamp(1.6rem, 1.6vw + 1.1rem, 2.25rem)/1.2 var(--font-display);
  letter-spacing: -.01em;
}
.prose blockquote p + p { margin-block-start: 1rem; }

.prose figure { margin-block: 2.5rem; }
.prose figure img { inline-size: 100%; block-size: auto; }
.prose figcaption {
  margin-block-start: .875rem;
  font-size: 1rem;
  color: var(--ink-muted);
}

/* Tall photos ("portrait") are capped in height and small ones at about half the column;
   both centred, caption centred under them. Their natural size, from srcset and sizes,
   is at least the shown size, so the max-* values alone set it, keeping the ratio. */
.prose .prose-figure--portrait img,
.prose .prose-figure--small img {
  inline-size: auto;
  block-size: auto;
  max-block-size: min(66vh, 34rem);
  margin-inline: auto;
}
.prose .prose-figure--small img { max-inline-size: min(23rem, 100%); }
.prose .prose-figure--portrait figcaption,
.prose .prose-figure--small figcaption { text-align: center; }