Какой должен быть порядок следования @media queris при формате «Сначала десктоп»?
Если кто-то путает окно браузера с областью просмотра, да ещё к min-width и min-width экран монитора приплетает — у него не только лыжи не едут, а в голове смазки маловато:)
1. Обрабатываются все media queries. От первого и до последнего.
2. Если выполняются условия в нескольких @media, то для конфликтующих правил вступает в силу обычный расчёт каскада (читай приоритет правил).
Относительно синтаксиса неплохо бы почитать спецификацию, да и вот хорошее описание.
Простая логика: Насколько больше можно реализовать на =>1440px, нежели на 320?
Следовательно, наворачиваем всё, что задумали на десктопе, а потом с помощью медиа прописываем поведение на более малых величинах.
Поверьте, что кол-во кода стилей при таком подходе будет существенно отличаться от того, когда идут от противного.
В прпинципе, достаточно примерно такого:
media screen and (min-width: 320px) and (max-width: 479px) {}
media screen and (min-width: 480px) and (max-width: 639px) {}
media screen and (min-width: 640px) and (max-width: 767px) {}
media screen and (min-width: 768px) and (max-width: 779px) {}
media screen and (min-width: 800px) and (max-width: 1023px) {}
media screen and (min-width: 1200px) and (max-width: 1681px) {}
но я часто добавлю  ещё несколько значений, для которых существуют общие значения.
И лучше на этапе разработки подключать отдельный файл стилей для медиа