/* One stable reading entrance for every interactive chapter. */
:root {
  --chapter-title-size: clamp(32px, 3.2vw, 46px);
  --chapter-heading-gap: clamp(42px, 5vw, 68px);
}

#faces > .chapter-heading,
#work > .chapter-heading,
#thinking > .chapter-heading,
#future > .chapter-heading,
#life > .chapter-heading {
  position: relative;
  z-index: 8;
  display: block;
  width: min(100%, var(--river-content-max, 1160px));
  margin: 0 auto var(--chapter-heading-gap) !important;
  padding: 0 0 clamp(22px, 2.3vw, 30px);
  text-align: left;
  border-bottom: 1px solid var(--river-rule);
}

#faces > .chapter-heading .section-label,
#work > .chapter-heading .section-label,
#thinking > .chapter-heading .section-label,
#future > .chapter-heading .section-label,
#life > .chapter-heading .section-label {
  display: flex;
  align-items: center;
  gap: 12px;
  width: auto;
  margin: 0 0 20px;
  color: var(--river-muted) !important;
  font: 500 9px/1.5 var(--mono);
  letter-spacing: .14em;
}

.chapter-heading .section-label span {
  display: inline-grid;
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid var(--river-rule);
  border-radius: 50%;
}

#faces > .chapter-heading h2,
#work > .chapter-heading h2,
#thinking > .chapter-heading h2,
#future > .chapter-heading h2,
#life > .chapter-heading h2 {
  max-width: 760px;
  margin: 0 !important;
  color: var(--river-ink) !important;
  font: 400 var(--chapter-title-size)/1.06 var(--serif) !important;
  letter-spacing: -.04em !important;
  text-align: left;
  white-space: normal;
}

#faces > .chapter-heading h2::after,
#work > .chapter-heading h2::after,
#thinking > .chapter-heading h2::after,
#future > .chapter-heading h2::after,
#life > .chapter-heading h2::after {
  display: none !important;
  content: none !important;
}

#thinking > .chapter-heading > p,
#future > .chapter-heading > p,
#life > .chapter-heading > p {
  max-width: 620px;
  margin: 18px 0 0 !important;
  padding: 0;
  color: var(--river-body) !important;
  font: 400 12px/1.9 var(--sans);
  letter-spacing: .01em;
  text-align: left;
}

/* Content begins on the same baseline after every chapter heading. */
#faces > .resume-editorial,
#work > .project-folder,
#thinking > .workflow-track,
#future > .future-stage,
#life > .life-memory-wheel {
  margin-top: 0 !important;
}

@media (max-width: 760px) {
  :root {
    --chapter-title-size: clamp(30px, 8vw, 36px);
    --chapter-heading-gap: 34px;
  }

  #faces > .chapter-heading,
  #work > .chapter-heading,
  #thinking > .chapter-heading,
  #future > .chapter-heading,
  #life > .chapter-heading {
    padding-bottom: 22px;
  }

  #faces > .chapter-heading .section-label,
  #work > .chapter-heading .section-label,
  #thinking > .chapter-heading .section-label,
  #future > .chapter-heading .section-label,
  #life > .chapter-heading .section-label {
    margin-bottom: 16px;
    font-size: 8px;
  }

  .chapter-heading .section-label span {
    width: 30px;
    height: 30px;
  }

  #thinking > .chapter-heading > p,
  #future > .chapter-heading > p,
  #life > .chapter-heading > p {
    margin-top: 14px !important;
    font-size: 11px;
  }
}