为第一个没上课的孩子设计样式

Question

使用CSS可以定位第一个没有课程的孩子

<div class="parent">
  <p class="hidden">Paragraph 1</p>
  <p class="hidden">Paragraph 2</p>
  <p>Paragraph 3</p>
  <p>Paragraph 4</p>
</div>

像这样...

.parent p:not(.hidden):first-child {
  color:#ff0000
 }

理想的效果是第3段现在变成红色