CSS の優先度のルールがあって、優先度の高い方が上書きする。
検索して調べてみて

上書きされるのが嫌なら、
index.html, header.html に個別のクラスをつけて、それらで指定すれば？

例えば、.index, .header を付けて、
p は黒色、p .index は赤色、p .header は青色とか

Rails とか、各フレームワークには、もっと良いやり方があるかも知れないけど