<style> .process { display: flex; justify-content: center; align-items: center; gap: 2rem; flex-wrap: wrap; padding: 2rem; background: #f9f9f9; } .step { position: relative; background: white; border-radius: 1rem; padding: 1.5rem; text-align: center; box-shadow: 0 4px 12px rgba(0,0,0,0.08); width: 220px; cursor: default; overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease; } .step:hover { transform: translateY(-4px); box-shadow: 0 8px 20px rgba(0,0,0,0.12); } .step h3 { color: #57BAA2; font-size: 1.2rem; font-weight: 600; letter-spacing: 1px; margin: 0; } .step p { color: #555; font-size: 0.9rem; line-height: 1.4; margin-top: 1rem; opacity: 0; max-height: 0; transition: all 0.4s ease; } .step:hover p { opacity: 1; max-height: 200px; /* suffisante pour afficher le texte */ } .arrow { font-size: 2rem; color: #57BAA2; font-weight: bold; opacity: 0.7; } </style>