Editorial Standards Footer Block for Vue

Edit SECTIONS (each a title and its links), STANDARDS (a title, one line and an href) and LEGAL. Every link is a plain anchor with href="#": point it at its page. Four sections fit the row on a wide screen; the standards band is three cells, so add or remove a cell and change the column count to match.

The block is a footer. The sections and the standards sit in one nav labelled Footer. Each section is a small h2 over a list, so a screen reader can jump between desks by heading. Each standards title is a link inside its own h2, with the sentence after it. The policy links are a list named Legal. Every link shows the theme's focus ring.

This footer's feature is the standards band: where the newsroom corrects the record, who owns it, and the ethics policy. A signup is a different footer. Adding one here would put a second job in the block.

The masthead comes first, then the four sections two by two (one row of four from lg), then the three standards stacked (one row from sm), then the legal row. The long wordmark wraps. Nothing scrolls sideways at 320 pixels.

The footer uses the same spine as every block: the page column, the two side rails and one top rule with + marks where it meets them. Placed under any other block, that rule is the only line between the two. The standards band and the legal band each open with their own rule. The footer keeps its bottom padding and draws no rule under the legal row, because it is the end of the page.

It is the current year, read when the footer renders, so it never goes stale. The component has no state; the year is read when it renders.