/*
 * Éclore Aesthetics — Generic page (legal / utility)
 * ─────────────────────────────────────────────────────────────────────────────
 * Narrow editorial prose on Bone for pages served by page.php (Privacy,
 * Terms, Accessibility, Return, Cancellation…). Dated caps eyebrow over a
 * hairline, lede-sized opening paragraph, Familjen in-content headings on
 * the shared rhythm. No CTA band — these pages stay quiet by design.
 */

.page-body {
  padding-block: var(--section-y-tight);
}

/* "Last updated — date" — tracked caps meta over a hairline rule. */
.page-body__updated {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 0.8125rem; /* 13px */
  text-transform: uppercase;
  letter-spacing: var(--tracking-label);
  color: var(--color-text-muted);
  padding-bottom: var(--space-sm);
  margin-bottom: var(--space-lg);
  border-bottom: 1px solid var(--color-hairline);
}

/* Opening paragraph reads as the lede (§3 Body-large) — first prose
   paragraph after the dated eyebrow. */
.page-body > .container > .page-body__updated + p {
  font-size: clamp(1.125rem, 1.4vw, 1.3125rem);
  line-height: 1.5;
}

/* In-content headings (the_content H2/H3) — Familjen faces inherited from
   global element styles; set the section rhythm here. */
.page-body :is(h2, h3) {
  margin-top: var(--space-lg);
  margin-bottom: var(--space-sm);
}

.page-body p,
.page-body li {
  color: var(--color-text);
}

.page-body :is(ul, ol) {
  padding-inline-start: 1.25em;
  margin-block: var(--space-sm);
}

.page-body li + li {
  margin-top: var(--space-3xs);
}