/* ==========================================================================
   COMPONENTS · PROSE — the reading column. Wraps long-form report bodies and
   marks the journey through Research Summary → Detailed Analysis → Medical
   Tourism Implications with grotesque kickers and hairline rules. The body is
   already serif from the elements layer; this owns the rhythm between sections.
   ========================================================================== */

.op-prose {
  color: var(--text);
  font-size: var(--text-base);
  line-height: var(--leading-relaxed);
}

.op-prose > * + * { margin-top: var(--gap-prose); }

/* Section heads: a small-caps grotesque label above a serif sub-head, set off
   by a hairline rule — the "journey markers" through the piece. */
.op-prose > h2,
.op-prose > h3 {
  margin-top: var(--space-xl);
  padding-top: var(--space-sm);
  border-top: 1px solid var(--rule);
  font-family: var(--font-reading);
  line-height: var(--leading-snug);
}
.op-prose > h2 { font-size: var(--text-lg); }
.op-prose > h3 { font-size: var(--text-md); border-top-color: var(--rule-faint); margin-top: var(--space-lg); }

.op-prose > h4 {
  margin-top: var(--space-lg);
  font-family: var(--font-furniture);
  font-size: var(--text-xs);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--text-secondary);
}

.op-prose ul,
.op-prose ol { margin-top: var(--gap-prose); }

.op-prose blockquote { margin-block: var(--space-md); }

/* The lead paragraph carries the versal */
.op-prose > .op-dropcap { margin-top: var(--space-md); }

/* A clean hairline section break inside prose */
.op-prose hr { margin-block: var(--space-xl); }
