What you need to know
Mobile-first CSS begins with a simple narrow-screen layout. It encourages readable defaults and makes larger breakpoints additions to the design rather than patches for a desktop-only structure.
How to apply it
Write the base rules for a narrow viewport, then add min-width queries when content becomes cramped. Use content-driven breakpoints and verify navigation, forms, and long headings at intermediate widths too.
Common mistake to avoid
Do not copy a framework's breakpoint values without checking your own content. A breakpoint should be triggered by the design, not by a named device.