Why are my header and paragraph distanced so far apart without a margin or padding?
Solution 1:
It's because you are positioning your paragraph absolutely on the page. You have it set as top: 50%, which means place the paragraph in the middle of the page vertically.
To center it, you can simply use
.center-text {
text-align: center;
}