/* text — one rich-text BODY through the shared .sk-richtext trope, a titled
 * FACTS list on the shared hairline rows, and a DETAILS list. Every part is
 * optional: the band renders only what its data carries. */

.sk-text-inner {
  display: flex;
  flex-direction: column;
  /* The prose beat — the column's uniform gap; the list seams below add one
     extra step where a heading opens a new movement. */
  gap: var(--kit-space-3);
  /* The gutter itself rides the shared BAND GUTTER home. */
}

/* Prose holds the reading measure (no shared rule caps a paragraph's
 * measure). Muted body copy… */
.sk-text-body > * {
  max-width: var(--sk-measure);
}
.sk-text-body p {
  color: var(--sk-ink-muted);
}
/* The LEAD opens the fragment: full ink, one ramp step up. Scoped to
 * first-child, not first-of-type, so a fragment opening on a heading has no
 * lead. */
.sk-text[data-lead="true"] .sk-text-body > p:first-child {
  color: var(--sk-ink);
  font-size: var(--sk-text-h4-size);
}

/* QUALIFIED to two classes on purpose: the shared tier zeroes heading margins
 * at (0,2,0), so the single-class form silently loses. The adjacency keeps a
 * band that OPENS with the list from carrying dead air. */
.sk-text-inner > * + .sk-text-facts-title,
.sk-text-inner > * + .sk-text-details {
  margin: var(--kit-space-4) 0 0;
}

.sk-text-facts {
  list-style: none;
  margin: 0;
  padding: 0;
  /* A facts list is a DATA row, not an editorial one — it reads the data-row
     air dial rather than the journal's (a container may
     re-declare --sk-ruled-pad). */
  --sk-ruled-pad: var(--sk-data-row-pad);
}
/* The heading opens the list — no rule between it and the first row. */
.sk-text-facts > :first-child {
  border-top: 0;
}
.sk-text-fact {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--kit-space-3);
}
.sk-text-fact-value {
  color: var(--sk-ink-muted);
  text-align: right;
  /* Spec values align as a column of figures ("est. 1987" over "14 makers"). */
  font-variant-numeric: tabular-nums;
}

.sk-text-details {
  margin: 0;
  display: flex;
  flex-direction: column;
  /* Between GROUPS, not between lines: a label and its value are one unit, so
     the group gap has to be clearly larger than the 4px that binds them, or
     the block reads as one undifferentiated column of small type. */
  gap: var(--kit-space-4);
}
.sk-text-detail dt {
  font-size: var(--sk-text-detail-size);
  font-weight: var(--kit-weight-eyebrow);
  letter-spacing: calc(var(--kit-track-eyebrow) * 1em);
  text-transform: uppercase;
  /* The accent, like the kit's other small labels that carry meaning (a
     journal row's tag): a details block is a LIST of labelled facts, and the
     label is what the eye scans down. */
  color: var(--sk-accent);
  margin-bottom: 4px;
}
.sk-text-detail dd {
  margin: 0;
  max-width: var(--sk-measure);
  /* Muted against the accent label: the label is the scan target, the value
     the thing you read. Both at full ink flattens the pair into one block. */
  color: var(--sk-ink-muted);
}

/* The facts title BALANCES its wrap and wears the theme's title edge, corner
 * and pad dials, like every titled part. */
.sk-text-facts-title {
  text-wrap: balance;
  border-width: var(--kit-edge-title);
  border-style: var(--kit-edge-style-title);
  border-color: currentcolor;
  border-radius: var(--kit-round-title);
  padding: var(--kit-pad-title);
}
