/* Shared heading hierarchy. Load after component styles. */
@media screen {
  :root {
    --heading-page: 44px;
    --heading-section: 32px;
    --heading-subsection: 22px;
    --heading-detail: 18px;
    --heading-caption: 16px;
    --heading-chapter-label: 11px;
  }
  #document-content .overview-heading h1 {
    font-size: var(--heading-page);
    font-weight: 650;
    line-height: 1.15;
    letter-spacing: -.035em;
  }
  #document-content > .document-section h2 {
    font-size: var(--heading-section);
    font-weight: 650;
    line-height: 1.25;
    letter-spacing: -.03em;
  }
  #document-content > .document-section h3 {
    font-size: var(--heading-subsection);
    font-weight: 650;
    line-height: 1.35;
    letter-spacing: -.02em;
  }
  #document-content > .document-section h4,
  #document-content .summary-title,
  #document-content .heading-detail > summary h3 {
    font-size: var(--heading-detail);
    font-weight: 650;
    line-height: 1.45;
    letter-spacing: -.015em;
  }
  #document-content .master-lane-heading h3,
  #document-content .decision-block h3,
  #document-content .responsibility h3,
  #document-content .control h3,
  #document-content .phase h3 {
    font-size: var(--heading-detail);
    line-height: 1.4;
  }
  #document-content .section-head .kicker,
  #document-content .fw-heading .kicker,
  #document-content .overview-heading .eyebrow {
    font-size: var(--heading-chapter-label);
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: .08em;
  }
  #document-content .section-number {
    font-size: .8em;
    font-weight: 650;
    line-height: inherit;
    letter-spacing: 0;
  }
  /* Diagram cards are compact captions, rather than reading-section headings. */
  #document-content #work-framework .fw-step h4 {
    font-size: 12px;
    line-height: 1.25;
    letter-spacing: -.015em;
  }
}
@media screen and (min-width: 1600px) {
  #document-content #work-framework .fw-step h4 { font-size: 15px; }
}
@media screen and (min-width: 1101px) and (max-height: 850px) {
  #work-framework { padding-block: 8px; }
  #work-framework .fw-heading { margin-bottom: 6px; }
  #work-framework .fw-flow { padding-block: 9px; }
}
@media screen and (max-width: 1100px) {
  :root { --heading-page: 38px; --heading-section: 28px; --heading-subsection: 21px; }
  #document-content #work-framework .fw-step h4 { font-size: var(--heading-caption); }
}
@media screen and (max-width: 640px) {
  :root {
    --heading-page: 30px;
    --heading-section: 24px;
    --heading-subsection: 20px;
    --heading-detail: 17px;
  }
}