[Dúvida] DUVIDA CSS FLIP

boa noite pessoal,

alguem consegue me ajudar com flip? o flip em si eu consegui fazer porem n consigo centralizar os elementos tentei com justify-content: center; justify-items: center;

e não funcionou podem me ajudar?

HTML

<link rel="stylesheet" href="../css/flip.css">

<div class="deck">
    <div class="card">
        <div class="flip">
            <div class="front">
                <img class="logo-empresa" src="../imagem/md.png" alt="logomd">
                <p>MD CONSULTORIA</p>
            </div>

            <div class="back">
                <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Sunt voluptatibus ipsam mollitia cum delectus soluta vel omnis nemo atque totam harum, facilis, natus corporis distinctio ad laboriosam quia aperiam sint?</p>
                <a href="#">acesse aqui</a>

            </div>
        </div>
    </div>


    <div class="card">
        <div class="flip">
            <div class="front">
                <img class="logo-empresa" src="../imagem/atn.png" alt="logoatn"> 
                <p>MD CONSULTORIA</p>
            </div>

            <div class="back">
                <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Nobis non distinctio illum tempora molestiae autem facere alias? Molestiae nihil, voluptatibus iusto facilis porro eos expedita adipisci repellat magni reprehenderit similique!</p>
                <a href="#">acesse aqui</a>

            </div>
        </div>
    </div>

    <div class="card">
        <div class="flip">
            <div class="front">
                <img class="logo-empresa" src="../imagem/defensoria.png" alt="logodefensoria"> 
                <p>MD CONSULTORIA</p>
            </div>

            <div class="back">
                <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Cupiditate aperiam illo itaque harum non dignissimos, nesciunt expedita officia iusto, sit atque distinctio accusamus! Numquam debitis, repellendus adipisci praesentium nostrum sint?</p>
                <a href="#">acesse aqui</a>
            </div>
        </div>
    </div>
</div>

CSS

.deck{

    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid;
}

.card{
    position: relative;
    width: 300px;
    height: 400px;
    margin: 10px;
    padding: 10px;
    perspective: 1000px; 
    border: 2px solid;
    background-color: bisque;

}

.flip{
    position: relative;
    transition: transform 0.5s;
    transform-style: preserve-3d;

}

.card:hover .flip{
   transform: rotateY(180deg); 
}

.front, .back{
    width: 100%;
    display: flex;
    border: 2px solid;
    flex-direction: column;
    justify-content: center;
    justify-items: center;
    position: absolute;
    backface-visibility: hidden;


}

.back{


    transform: rotateY(180deg);
}

.logo-empresa{
width: 250px;
height: 250px;
}