Carousel Awards Block for React

Edit AWARDS at the top of the file. Each has a programme, a short title the wreath frames ("Gold", "Top 10"), the category, a one-sentence citation and a fixed year: an award given in 2025 stays 2025. lettering sets the title's type on the badge, and pairs and spread shape its wreath. The slide names, the counter, the dots and the page count are all derived from the list, so adding a plaque needs no other change.

Three from lg, two from md, one below that. On a phone the next plaque peeks in beside the current one as a cue to swipe. The counter, the dots and the arrows follow the number in view: with three plaques per view, eight awards make six pages, one step at a time.

Yes. The arrow buttons and the dots are real buttons, so Tab reaches each of them, and the arrow keys turn the carousel while focus is inside it (the keys follow the page's direction, so the end arrow is always next). The buttons wrap around, so one never disables while it has focus. A polite live region says which plaques are showing after each move.

They are marked inert and hidden from assistive technology, so Tab and screen readers only meet the plaques you can see. Each slide is a group named by its programme, category and place in the list ("Mosswick Awards, Direct booking technology, 1 of 8").

No: it moves only when you press a button, a dot or an arrow key, so there is nothing to pause. The header fades up once on load; with reduced motion that, the dot's width change and the carousel's own slide are all off or instant, as far as the library allows.

No. Mosswick, Hobbsgrove, Whinbrook, Flaxmere, Heathermoor and Nutcombe are made-up programmes and Hostelry a made-up booking engine. The wreaths are drawn by the block, not copied from any award body. If you show a real award, name it in text and use its official badge only where its rules allow it.