a differenza di come potrebbe sembrare, non è solo l'elemento div in quanto contenitore di p a determinare la distanza di p dal lato superiore della pagina, ma sono anche i margini di p stesso e di body, che se non vengono azzerati, hanno un valore di default.
Questo valore (e qui viene la parte più difficile da spiegare) dei margini di due elementi si comporta in maniera diversa a seconda che i due elementi siano separati o meno da bordi o padding (anche di altri elementi: nel nostro caso il div).
Se non sono separati, i margini verticali collassano in un margine unico (di valore pari al più ampio dei due); mentre se sono separati (quando aggiungevi il bordo al div) i margini si sommano.

So di non essere molto chiaro: dovresti provare assegnando colori di sfondo diversi a body, div e p e poi provando ad azzerare i margini di body e p (prima uno alla volta, poi tutti e due) per vedere la differenza di comportamento.