.populares__card width

depois que eu defini o width da classe .populares--card, os cards não se reorganizaram.

.populares {
    padding: 3rem 0;
}

.populares__conteudo {
    display: flex;
    flex-wrap: wrap;
    grid-area: conteudo;
    padding: 1rem  0;
}

.populares__card {
    background: #fdfdfd;
    display: grid;
    grid-template-areas: 
        "card-imagem"
        "card-corpo";
    grid-template-columns: 100%;
    width: 1fr 1fr 1fr 1fr 1fr;
}

.populares__card--imagem {
    grid-area: card-imagem;
    height: 100%;
    width: 100%
}

.populares__card--corpo {
    display: grid;
    grid-template-areas: 
        "card-cabecalho"
        "card-conteudo";
    grid-template-rows: 50px auto;
    gap: .5rem;
    grid-area: card-corpo;
    padding: .75rem;
}

<div class="populares__conteudo">
                    <div class="populares__card">
                        <img class="populares__card--imagem" src="./assets/img/slack.png">
                        <div class="populares__card--corpo">
                            <div class="populares__card--cabecalho">
                                <h5 class="populares__card--titulo">Slack</h5>
                                <time class="populares__card--data" datetime="2013-08-01">08/2013</time>
                            </div>
                            <div class="populares__card--descricao">
                                Traduzido do inglês-O Slack é um conjunto baseado em nuvem de ferramentas e serviços proprietários de colaboração em equipe, fundado por Stewart Butterfield. O Slack começou como uma ferramenta interna usada por sua empresa, Tiny Speck, no desenvolvimento do Glitch, um jogo online agora extinto.
                            </div>
                        </div>
                    </div>
                <div>