tengo el siguiente problema y necesitaria ayuda.
Tengo una card, donde dentro tienen dos elementos, uno para la imagen y otro para unos textos y un button. Puse un hover transform: sacale(), pero al hacer hover me deforma parcialmente el div de mi texto, teniendo unas lineas que aparecen y desaparecen, mas un movimiento indeseado en el texo.

Dejo el link de una pequeña grabacion que hice con respecto al problema: https://screenrec.com/share/xw3yHf1ngc

Y dejo el codigo:

```
<div className="card">
            <div className="card-imageContent">
                <img className="card-img" src={`/${foto}`} alt={nombre} />
            </div>
            <div className="card-text">
                <div className="card-title">{nombre}</div>
                <div className="card-title"><em>Bodega: {bodega}</em></div>
                <div className="card-price">AR$ {(precio * precioDolar).toFixed()} c/u</div>
                <div className="card-price">US$ {precio} c/u</div>
                <Link to={`/detalle/${id}`} className="card-link">
                    <button className="card-btn">VER MAS</button>
                </Link>
            </div>
        </div>
```
```
.card {
    width: 350px;
    height: 550px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border: 4px black solid;
    border-radius: 10px;
    background-color: white;
    margin: 5px;
    transition: all .5s;

    &:hover {
        transform: scale(1.02, 1.02);
        transition: all .5s;
    }

    &-imageContent {
        height: 75%;
    }

    &-img {
        height: 100%;
    }

    &-text {
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        align-items: center;
        height: 25%;
        width: 100%;
        background-color: black;
        color: white;
    }

    &-link {
        width: 100px;
        height: 30px;
        z-index: 0;
    }
        
    &-btn {
        width: 100px;
        height: 30px;
        border: 2px black solid;
        border-radius: 5px;
        background-color: #932b27;
        color: white;
        text-transform: uppercase;
        font-weight: 700;
        z-index: 8;
        cursor: pointer;
    }

}
```


Desde ya se agradece cualquier ayuda que me puedan dar.