What container queries solve
The component adapts to the slot it occupies, not to the size of the whole screen.
If a card lives in a narrow sidebar and later moves into a wide main column, it should react to its own width. With media queries that usually leads to more fragile rules. With `@container`, the component becomes more autonomous.
The key idea is to declare a parent as a container and let its children consult that size to change layout, typography or visual density.
- Responsive behavior at the component level, not only at the page level.
- Less coupling between global layout and internal component styles.
- Better reuse inside design systems.
