Brand Split Footer Block for Svelte

It is a link styled as the button, so it navigates like any anchor and keeps the button's light sweep. Each library's own way of rendering a button as a link is already applied in the block, so there is nothing to wire up: change the href and the label.

Edit the arrays at the top of the file: GROUPS and LEGAL; change the button's href and label in the JSX. Every link is a plain anchor with href="#": point each at its page, or swap the anchor for your router's link.

The block is a footer element: placed at the end of the page, outside main, it is the page's content-info landmark. The columns sit in a nav labelled Footer, each group a small h2 over a list. The wordmark is a link home, and its mark is decorative. Every link shows the theme's focus ring when reached by keyboard.

The brand half comes first with the button, a rule separates it from the groups (three in a row from sm, two by two on the smallest screens), and the legal row stacks at the end. Nothing scrolls sideways at 320 pixels.

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.