What are media queries, and how do you use them for responsive design?

Sample answer preview

Media queries let you apply CSS rules based on device characteristics like screen width, height, orientation, and more. They are fundamental to responsive web design. The basic syntax uses @media followed by a condition: @media (max-width: 768px) { .sidebar { display: none; } }…