fix: Use container queries for navbar to handle AI chat panel (#11532)
## Summary
- Navbar links overlap when the AI chat panel is opened because the
layout uses media queries that don't respond to the reduced available
space
- Switches navbar from media queries (`md:`) to container queries
(`@container`, `@3xl:`, `@4xl:`) so elements hide/show based on actual
container width
- When the chat panel opens and adds `pr-96` padding, the navbar now
correctly collapses to mobile layout
## Testing
1. Open the docs site at a desktop width (~1200px)
2. Open the AI chat panel
3. Verify the nav links collapse to the mobile hamburger menu instead of
overlapping