/* ============================================================ components/topic-block.css The topic block at the end of a single piece: one head, two labelled rows of cards, and the strip that closes it. IT IS LOADED ONLY WHILE THE FLAG IS ON (inc/design-system.php adds it to the component list behind refindustry_topic_block_ enabled). Every component here is its own , so adding it to the fixed list would have changed the of every page on the site while the block itself rendered nowhere, and "nothing changes until the flag is turned on" would have been false in the one place that is easiest to check. ALMOST NOTHING IS DECLARED HERE, and that is the point. The block is .rfi-section, so the 38px above it and the 16px between its parts are the page's own rhythm; the rows are .rfi-grid3, the same grid the related blocks used; the labels are .rfi-t-flab, the small caps the hub's partner slot and the event strip already use. What is left is the inner spacing of a row, which no existing component owns. ============================================================ */ /* A label belongs to the row UNDER it, not between two rows. The section's own 16px gap separates the rows from each other and from the head; this smaller gap ties a label to its cards, so the two read as one thing rather than three stacked bands. */ .rfi-topic-block__row { display: flex; flex-direction: column; gap: 12px; } /* base.css zeroes every margin, so this is not a reset: it is a statement that the label is spaced by its row's gap and by nothing else, which is what keeps it from drifting if a future heading rule adds margins back. */ .rfi-topic-block__label { margin: 0; } /* The strip's own 38px top margin is for a band standing ALONE before the footer, with the page's ground above it. Inside the block it is a member of the section, so the section's gap does that job and the margin would be counted twice. */ .rfi-topic-block .rfi-topic-strip { margin-top: 0; }