/* =========================================================
   Component — Section head

   The block that opens a section: eyebrow, title, lead. Lived in
   pages/home.css until a second page needed it (م2), which is the
   point at which the constitution says to promote it.
   ========================================================= */
.section-head {
  max-width: 56ch;
  margin-bottom: var(--space-12);
}

/* Arabic headlines here run two lines at most; balancing them keeps
   a single word from being left alone on the second. */
.section-head__title {
  margin: 0 0 var(--space-4);
  text-wrap: balance;
}
.section-head__lead {
  margin: 0;
  font-size: var(--fs-lg);
  line-height: var(--lh-relaxed);
  color: var(--color-text-secondary);
}

/* A centred head, for the sections that lead a grid rather than sit
   beside a picture. */
.section-head--center {
  max-width: 46rem;
  margin-inline: auto;
  text-align: center;
}
.section-head--center .eyebrow { justify-content: center; }