A page is a negotiation between your markup, your stylesheet, the browser defaults, and the window size. When the result is wrong, the answer is in what the browser computed, and reading that is a skill worth learning rather than guessing at.
About 1 min of reading
Find the real breakpoint.
Narrow slowly
Before you run it, say out loud what it will print. Then open the answer.
Write it where it broke
Before you run it, say out loud what it will print. Then open the answer.
A bug in a full page is the same bug in a small one, and the small one is readable. Cutting the markup down to the element and its parent is the step that turns a hunt into a read.
A stylesheet that is cached, a build step that did not run, or a file you are not loading all look correct in the editor and wrong in the browser. Checking the loaded URL is the first move when nothing changes.
The browser reports the size each element ended up with. A percentage, a flex rule, and a max width resolve to a number, and reading that number tells you which input was wrong.
The tool shows the rules that matched and were overridden, with the reason. That list is the answer to 'why is this blue' and it saves the reasoning that usually gets it wrong.
Resize slowly and watch where the layout breaks. The width where it breaks is the breakpoint you needed, found by observation rather than by guessing a device width.
Each one is defined here on this site. Open the entry for the full definition and the other words it points at.