Now let me generate a design that matches The Courier's newspaper style, and check for any read-only example components that might be useful.

Now I have a clear picture of the project. Let me build this out — I'll create the full homepage matching The Courier's newspaper style, with the hero section and grid from the screenshot, plus personalized recommendation sections. Let me first update the design tokens to match the newspaper aesthetic, then build the components.

Good. Now let me generate images for the articles and build the full page. I'll create the components first, then generate article images.

Now let me build the components and page. I'll start with the globals.css update, then create all components.

Now let me update the layout with proper fonts and metadata:

Now update the tailwind config for font families:

Now let me create the components. First, the site header:

Now the key part — the personalised recommendation sections:

Now create the page that ties it all together:

The homepage is now complete with three personalised recommendation sections. Each section ("Because you read opinions", "More interviews for you", and "Investigations you might have missed") features a distinct colour-coded border and header to differentiate the content type, with a featured article on the left and a stacked list of additional articles on the right. The layout closely mirrors The Courier's newspaper aesthetic using a serif font for headlines, a clean grid structure, and matching article card patterns with author attribution, read times, and category badges.