Duda académica con :nth-child()

en el código se empiezan a contar los child de .destaques__secundarios desde 2

.destaques__secundario:nth-child(2){
    background: url('../img/pubg.jpg') center / cover no-repeat;    
    grid-column: 4 / 5;    
    grid-row: 1 / 2;

}

pero el html solo tiene 4 elementos de .destaques__secundarios:

<div class="destaques__secundario box">
                <h3 class="destaques__titulo">PUBG</h3>
            </div>
            <div class="destaques__secundario box">
                <h3 class="destaques__titulo">Slack</h3>
            </div>
            <div class="destaques__secundario box">
                <h3 class="destaques__titulo">Whatsapp</h3>
            </div>
            <div class="destaques__secundario box">
                <h3 class="destaques__titulo">CS: GO</h3>
            </div>

Por qué se empiezan a contar los child desde 2 y no 1?