feat(typography): use variable fonts instead of statics one by default

### Feature Description

Hi 🙌
I propose replacing the current static fonts for Roboto and Material Symbols with their variable font counterparts.

It will bring minor but valuable improvements especially for newcomers :

- Reduced file sizes and HTTP requests.
- Greater control over font properties (e.g., weight, width).
- Aligns with the latest web standards.

This change would enhance Angular Material’s efficiency, design capabilities, and relevance.

Here is a quick example of new default font import proposal :

```html

```

Thank you for considering this request.

### Use Case

- Enhance getting started with Angular Material experience
- Promote modern font technologies
- Align with latest web standards
- Better maintenability and performance

No files, tests, or entry points are named in the issue. Start by locating where Angular Material currently imports or documents the static Roboto and Material Symbols fonts, then compare that setup with the proposed variable-font imports. Done means the default font setup uses the variable counterparts and the getting-started experience retains the intended typography.

Written by the indexing model from the issue text.