/* --- Bloc card - Effet aggrandissant au hover --- */
.cards{
  display:flex;
  gap: 1rem;
}

.cards .card{
	position: relative;
	overflow: hidden;
	border-radius: 16px;
	transition: flex 500ms ease, transform 300ms ease;
}

/* La card active est grande */
.cards .card.is-featured{
	flex: 3 1 0%;
}

/* sinon petite */
.cards .card:not(.is-featured){
	flex: 1 1 0%;
}

/* Le titre est petit par défaut */
.cards .card h2,
.cards .card h4{ 
	transform: scale(0.85);
	transform-origin: left bottom;
	transition: transform 300ms ease;
}

/* grand quand actif */
.cards .card.is-featured h2,
.cards .card.is-featured h4{ 
	transform: scale(1); 
}

/* Contenu du texte  */
.cards .card:not(.is-featured)  .content-trim
.elementor-widget-container,
.cards .card.is-featured .content-trim
.elementor-widget-container{
	overflow: hidden;
 	display: -webkit-box;
 	-webkit-box-orient: vertical;
 	-webkit-line-clamp: var(--lines);
}

.cards .card:not(.is-featured)  .content-trim
.elementor-widget-container{
	max-height: 100px;
	 --lines: 5;
}

.cards .card.is-featured .content-trim
.elementor-widget-container{
	 --lines: 10;
}


/* Icône flèche */
.cards .card .elementor-icon{
	transform: scale(0.5);
	transform-origin: left bottom;
	transition: transform 300ms ease;
}

.cards .card.is-featured .elementor-icon{
	transform: scale(1);
}

/* Hover */
.cards .card:hover{ 
	transform: translateZ(0);
}