Notes

A three-way comparison for a sailing club: hire, a syndicate share or your own dinghy, laid out as a matrix of Breakdance Divs in one CSS grid, with the recommended column on a brand tint and a pill sitting on its top edge. Ticks and crosses are text glyphs in small circle Divs, so they follow your tokens in light and dark mode, and a decision line under the matrix turns the choice into three pills. On phones the matrix is hidden and a separate stack of option cards is shown instead (Hide on breakpoint in each wrapper's settings), so change copy in both places. To move the recommendation, swap the tint, side borders and pill onto another column.