What should be the width of responsive layouts?

Question

css

There are usually three layouts - desktop, tablet and mobile.
Mobile is drawn on a conditionally minimum width - 320px. Up to and including 767px, elements are simply stretched across the width. This is logical, because you need everything to fit at the minimum width, and for slightly larger ones, the layout designer will already come up with something.
The tablet is drawn at a conditionally minimum width for tablets - 768px. In the range 768-1024px (the width of the iPad Pro, it's still a tablet), the elements are also simply stretched to full width according to a certain logic.
The desktop layout is being drawn... And then the logic breaks down. For some reason, it is now customary to draw a desktop layout with a width of 1366px. At the same time, what should happen to elements (which do not fit in particular) in the range of 1025-1365px is absolutely not clear. The desktop layout doesn't fit anymore, and the tablet layout doesn't work yet.
So why are they drawing at 1366 and not at 1025, for example?

Answer 1

Because 1366 is the most popular screen size on the internet right now.
If you open the laptop section in any computer store, you will see that the entire budget segment is completely 1366 * 768.

Answer 2

I think you can build on the current Bootstrap 4 grid
0 - 575,
576 - 767,
768 - 991,
992 - 1199
1200 - ...