/* =========================================================================
   Component — split: prose beside something
   Two columns above 900 px, stacked below it — the same breakpoint the top
   navigation collapses at (DESIGN_TOKENS.md §7).
   ========================================================================= */

.split {
  display: grid;
  grid-template-columns: 1.02fr .98fr;
  gap: clamp(24px, 4vw, 56px);
  align-items: center;
}

.split > :last-child > :last-child {
  margin-bottom: 0;
}

@media (max-width: 900px) {
  .split {
    grid-template-columns: 1fr;
  }
}