The example you provided only has one paragraph in it. You are adding line breaks to that paragraph by hitting enter to create the appearance of two paragraphs. What you want to do is add new paragraph blocks with the same class name. You can then adjust the css properties on each screen size without effecting the others.
To further explain, when you add a paragraph element to your design you are adding a “p” tag to your html, which represents a paragraph. When you are putting your content into that tag and hit enter you are adding a “br” tag or line break to the html not a new paragraph.
When adjusting the appearance of the design at the different screen sizes your are adjusting various CSS settings to make the changes without actually changing the structure of the html. If you delete elements from your design you are actually removing the html from the whole design.
I hope this helps.