A page has to work at a phone width and a desktop width, and the work is the same at both if you build it right. Fluid widths, a max width, and a media query for the real change cover most designs without a second stylesheet.
About 1 min of reading
Make a column that caps itself.
Fluid with a cap
Before you run it, say out loud what it will print. Then open the answer.
Check the narrow end
Before you run it, say out loud what it will print. Then open the answer.
A line of text under about 45 characters reads well and over about 90 it does not. That limit, not the device width, is what decides a column's maximum, and it is the reason a max width belongs on the text.
A link that is a few pixels tall is hard to hit on a touch screen. Padding around the target grows it without changing the design, which is the fix rather than a different control.
A column at a percentage of its container shrinks with the window. A max width stops a line of text becoming unreadably wide on a large screen. Those two together give a layout that needs no breakpoints.
Change the layout at the width where it genuinely stops working, not at the width where it looks nicer. A layout that survives to 380 pixels needs one query, not four.
Build at the small width and grow. A design that works narrow and grows is easier than one built wide that has to be squeezed, and the squeeze is where the failures are.
Each one is defined here on this site. Open the entry for the full definition and the other words it points at.