
@keyframes slideIn-btn {
  from { transform: translateX(40px); }
  to   { transform: translateX(0); }
}

@keyframes fadeIn-btn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.bouton-cta {
  max-width: 320px;
  width: 100%;
  margin-left: auto;
  animation:
    fadeIn-btn 2s cubic-bezier(0.16, 1, 0.3, 1) 0.2s forwards,
    slideIn-btn 2s cubic-bezier(0.16, 1, 0.3, 1) 0.2s none;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  @media (width < 990px) {
    float: none !important;
    margin-inline-start: 0 !important;
  }
}

/* --- Flèche SVG : animation au survol du bouton --- */

@keyframes arrow-nudge {
  0%   { transform: translateX(0); }
  30%  { transform: translateX(2px); }
  60%  { transform: translateX(-1px); }
  100% { transform: translateX(0); }
}

.bouton-cta .arrow-icon {
  transition: transform 0.1s ease;
}

.bouton-cta:hover .arrow-icon {
  animation: arrow-nudge 0.4s ease forwards;
}



/* --- Pour que le lien recouvre 100% de la surface du bouton --- */

/* Rend le conteneur prêt pour le lien étendu */
.bouton-cta {
  position: relative;
}
/* Étend le lien sur toute la boîte du bouton */
.bouton-cta a::after {
  content: "";
  position: absolute;
  inset: 0; /* top: 0, right: 0, bottom: 0, left: 0 */
  z-index: 10;
  cursor: pointer;
}
/* Enlève le soulignement classique du lien */
.bouton-cta a {
  text-decoration: none;
  color: inherit;
}

