CSS container queries: адаптив карточки по ширине контейнера
container-type, @container и когда они лучше media queries по viewport.
Container queries меняют layout компонента по ширине родителя, а не экрана — идеально для sidebar + main и переиспользуемых card.
Задайте `container-type: inline-size` на wrapper и используйте `@container (min-width: ...)`.
- CSS container queries — MDN — Синтаксис и примеры.
- Container queries — web.dev — Паттерны и migration.
Design system
Документируйте container names для сложных grid.
Не заменяйте все media queries — viewport breakpoints нужны для global nav.