/*
  textBlockGroup — the stack: optional lede, optional stat card group, text blocks, optional Read more arrow
  (component.json textBlockGroup, 6 tokens). Single column always.
  One owner per gap: 32px between every item; the one tighter gap is lede -> stat card group (16px, only before a stat card group).
*/

.text-block-group > * + * {
  margin-block-start: var(--text-block-group-gap-all);
}
.text-block-group > .text-block-group__lede + .stat-card-group {
  margin-block-start: var(--text-block-group-lede-gap-all); /* only before a stat card: the lede leads into the number.
     Before anything else (e.g. an image) the lede keeps the normal 32px (BUILD 22 DECISION 1, Vivek 2026-09-30). */
}
/* Images that follow their text (BUILD 21 DECISION 4, Vivek 2026-09-30): the paragraph -> image gap is the
   normal 32px; two pairs back to back are 64px apart, so each pair reads as its own scene. */
.text-block-group > * + .figure {
  margin-block-start: var(--text-block-group-gap-all); /* beats figure.css's margin: 0 (loaded later, same weight) */
}
.text-block-group > .figure-pair + .figure-pair {
  margin-block-start: var(--text-block-group-entry-gap-all);
}
/* Text-led entries (BUILD 22 DECISIONS 2 and 3, Vivek 2026-09-30): a project told as text, then images under
   the text they prove. Inside it everything is the normal 32px; the next project's title block starts 64px
   below the last image, so each project reads as its own story. */
.text-block-group > * + .text-block--starts-entry {
  margin-block-start: var(--text-block-group-entry-gap-all);
}

/* Standalone lede under the section header: body large (allowed here, never under a paragraph title). */
.text-block-group__lede {
  font-family: var(--text-block-group-lede-text-style-all-font-family);
  font-size: var(--text-block-group-lede-text-style-all-font-size);
  font-weight: var(--text-block-group-lede-text-style-all-font-weight);
  line-height: var(--text-block-group-lede-text-style-all-line-height);
  color: var(--text-block-group-lede-content-all);
}

/* Read more arrow: a visual cue only (no action, no focus, hidden from screen readers).
   Left-aligned with the text, where the eye already runs down the page
   (decided by Vivek 2026-09-26: centered, it got lost). */
.text-block-group__cue {
  display: block;
  width: var(--text-block-group-cue-icon-size-all);
  height: var(--text-block-group-cue-icon-size-all);
  color: var(--text-block-group-cue-content-all);
}