/*
 * Section « Trois offres, une seule mission » Elementor V4 — résidu CSS non
 * représentable par les Global Classes : masques d'icônes, dégradés, pseudo-
 * éléments, transitions, et props rejetées par le schéma (flex-grow, list-style).
 */

/* Surlignage marqueur orange du mot-clé dans le titre de section. Remappé sur <em>
   (bouton italique de l'éditeur) + <span> en compat ; font-style:normal -> surligne
   au lieu d'italiser. */
.mist-v4-sec-title span,
.mist-v4-sec-title em {
	font-style: normal;
	padding: 0 0.05em;
	border-radius: 3px;
	background: linear-gradient(transparent 60%, rgba(233, 78, 27, 0.24) 60%);
}

/* Carte offre : lumière haute + micro-interaction. */
.mist-v4-offer-card {
	background-image: linear-gradient(180deg, #ffffff 0%, #fbfbfe 100%);
	transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s;
}

.mist-v4-offer-card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 1px;
	border-radius: 30px 30px 0 0;
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.9), transparent);
}

.mist-v4-offer-card:hover {
	transform: translateY(-6px);
	box-shadow: 0 4px 12px -4px rgba(31, 36, 68, 0.10), 0 20px 48px -18px rgba(62, 73, 130, 0.24);
}

/* Reflet interne du conteneur d'icône (inset non représentable en global class). */
.mist-v4-icon-box {
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

/* Icône = widget e-svg atomique éditable (SVG fill=none par trace -> outline
   préservé + coloré via currentColor). L'e-svg hérite la couleur de l'icon-box. */
.elementor .mist-v4-icon-box svg { color: inherit; width: 24px; height: 24px; }

/*
 * Variantes de couleur en sélecteur COMPOSÉ préfixé « .elementor ».
 * Elementor V4 émet CHAQUE global class sous « .elementor .<label> » (0,2,0) et,
 * ici, sort la base APRÈS les modifieurs -> à spécificité égale, la base (bleu)
 * gagne. Le composé préfixé (0,3,0) passe devant, quel que soit l'ordre.
 * Leçon : comme les badges, une classe de base ne doit pas figer une valeur que
 * ses modifieurs doivent écraser (refacto icon-box « layout-only » à prévoir).
 */
.elementor .mist-v4-icon-box.mist-v4-icon-box-accent {
	background: #fdeee9;
	color: #e94e1b;
}
.elementor .mist-v4-icon-box.mist-v4-icon-box-green {
	background: #e5f4eb;
	color: #2f7d54;
}

/* Liste : flex-grow (pousse le lien en pied) + list-style rejetés par le schéma. */
.mist-v4-offer-list {
	flex: 1;
	list-style: none;
}

/* Puce verte de chaque point (pas de ::before dans le schéma atomique). */
.mist-v4-offer-item::before {
	content: "";
	width: 7px;
	height: 7px;
	flex: 0 0 auto;
	border-radius: 50%;
	background: #6fbf8a;
}

/* Le lien secondaire se cale en bas de carte. */
.mist-v4-offer-card .mist-v4-link-text {
	margin-top: 0;
}

@media (prefers-reduced-motion: reduce) {
	.mist-v4-offer-card {
		transition: none;
	}
	.mist-v4-offer-card:hover {
		transform: none;
	}
}