El objetivo de esta entrada es posicionar la imagen en el lado que queremos, izquierda o derecha, esto se logra con la "float" y que el texto, digamos, sigua al perímetro de la imagen a cierta distancia de esta.
La distancias la determinamos con el margin del contenedor de la imagen, la imagen la ponemos como background de un div.

Insertamos un div o una sección, eso ya depende de los gustos de cada uno, dentro de ese div o sección al cual nos vamos a referir como "contenedor principal " y dentro de este metemos un div que será el que llevará como background la foto o imagen.
📌 - Los valores de las propiedades pueden ser adaptados al gusto y necesidad de cada uno, propiedades como width, height, border-radius, margin.
📌 -  Se recomienda para background-size usar cover u para background-position usar center. Pero esto puede variar en función de cada cual.
🔺 - El valor de float puede ser: left, right o none. Para posicionar el contenedor de la imagen a la izquierda, a la derecha y none es el valor por defecto que será lo mismo que no poner la propiedad.
🔺 - shape-outside: circle() esta propiedad con este valor es lo que hace que el texto se posicione adecuadamente rodeando la imagen.

.contenedor-foto{
	width: 200px;
	height: 200px;
	background: url(lorenzo-card.jpg);
	background-size: cover;
	background-position: center;
	border-radius: 50%;
	margin: 60px 30px 30px 0;
	float: left; /* Posicionar la imagen a la izquierda.*/
	shape-outside: circle(); /* Para hacer que el texto rodee la imagen.*/
}

Click para Copiar

Copiado

El orden de los elementos debe ser, por lo general, para un card como este debía de ser(ver imagen siguiente):
1º - Un div principal que tendrá dentro todos los elementos.
2º - Dentro del anterior un div vacio que será el que tenga la imagen a mostrar como background.
3º - Un texto que hará las funciones de título o donde se mostrará el nombre, preferiblemente que vaya dento de un div para tener mas control sobre el mismo.
4º - El texto descriptivo.

La propiedad shape-outside que define como se ajusta el texto alrededor del elemento flotante exige algunas condiciones básicas:
- que el elemento sea flotante ( elemento{float:left;} - por ejemplo ).
- que tenga dimensiones claramente definidas ( width, height ).
Si quieres ampliar conocimientos sobre esta propiedad te aconsejamos te paser por esta web