/* Animations reprises du site iZiPay d'origine (template izi) */
@keyframes animate-svg-stroke-1 {
  0% {
    stroke-dashoffset: 491.84796142578125px;
    stroke-dasharray: 491.84796142578125px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 491.84796142578125px;
  }
}
@keyframes animate-svg-stroke-2 {
  0% {
    stroke-dashoffset: 981.7376098632812px;
    stroke-dasharray: 981.7376098632812px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 981.7376098632812px;
  }
}
@keyframes animate-svg-stroke-3 {
  0% {
    stroke-dashoffset: 188.7481689453125px;
    stroke-dasharray: 188.7481689453125px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 188.7481689453125px;
  }
}
@keyframes animate-svg-stroke-4 {
  0% {
    stroke-dashoffset: 170.3905487060547px;
    stroke-dasharray: 170.3905487060547px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 170.3905487060547px;
  }
}
@keyframes animate-svg-stroke-5 {
  0% {
    stroke-dashoffset: 129.54100036621094px;
    stroke-dasharray: 129.54100036621094px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 129.54100036621094px;
  }
}
@keyframes animate-svg-stroke-6 {
  0% {
    stroke-dashoffset: 167.3074951171875px;
    stroke-dasharray: 167.3074951171875px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 167.3074951171875px;
  }
}
@keyframes animate-svg-stroke-7 {
  0% {
    stroke-dashoffset: 269.781494140625px;
    stroke-dasharray: 269.781494140625px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 269.781494140625px;
  }
}
@keyframes animate-svg-stroke-8 {
  0% {
    stroke-dashoffset: 167.30728149414062px;
    stroke-dasharray: 167.30728149414062px;
  }

  100% {
    stroke-dashoffset: 0;
    stroke-dasharray: 167.30728149414062px;
  }
}
@keyframes animate-svg-fill-1 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(223, 0, 81);
  }
}
@keyframes animate-svg-fill-2 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(223, 0, 81);
  }
}
@keyframes animate-svg-fill-3 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(255, 255, 255);
  }
}
@keyframes animate-svg-fill-4 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(255, 255, 255);
  }
}
@keyframes animate-svg-fill-5 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(255, 255, 255);
  }
}
@keyframes animate-svg-fill-6 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(255, 255, 255);
  }
}
@keyframes animate-svg-fill-7 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(255, 255, 255);
  }
}
@keyframes animate-svg-fill-8 {
  0% {
    fill: transparent;
  }

  100% {
    fill: rgb(255, 255, 255);
  }
}
@keyframes pulse {
	0% {
		transform: scale(0.77);
		box-shadow: 0 0 0 0 rgba(223, 0, 81, 0.7);
	}

	70% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgba(223, 0, 81, 0);
	}

	100% {
		transform: scale(0.77);
		box-shadow: 0 0 0 0 rgba(223, 0, 81, 0);
	}
}
@keyframes pulse2 {
	0% {
		box-shadow: 0 0 0 0 rgba(223, 0, 81, 0.7);
	}

	70% {
		box-shadow: 0 0 0 10px rgba(223, 0, 81, 0);
	}

	100% {
		box-shadow: 0 0 0 0 rgba(223, 0, 81, 0);
	}
}
@keyframes pulse3 {
	0% {
		box-shadow: 0 0 0 0 rgba(223, 0, 81, 0.9);
	}

	70% {
		box-shadow: 0 0 0 10px rgba(223, 0, 81, 0);
	}

	100% {
		box-shadow: 0 0 0 0 rgba(223, 0, 81, 0);
	}
}
@keyframes float2 {
	0% {
		transform: translatey(0px);
	}
	50% {
		transform: translatey(-7px);
	}
	100% {
		transform: translatey(0px);
	}
}
.izisvg-1 {
  -webkit-animation: animate-svg-stroke-1 1s linear 0s both, animate-svg-fill-1 1s ease-in 0s both;
          animation: animate-svg-stroke-1 1s linear 0s both, animate-svg-fill-1 1s ease-in 0s both;
}
.izisvg-2 {
  -webkit-animation: animate-svg-stroke-2 1s linear 0.3s both,
                       animate-svg-fill-2 1s ease-in 0.3s both;
          animation: animate-svg-stroke-2 1s linear 0.3s both,
               animate-svg-fill-2 1s ease-in 0.3s both;
}
.izisvg-3 {
  -webkit-animation: animate-svg-stroke-3 1s linear 0.6s both,
                       animate-svg-fill-3 1s ease-in 0.6s both;
          animation: animate-svg-stroke-3 1s linear 0.6s both,
               animate-svg-fill-3 1s ease-in 0.6s both;
}
.izisvg-4 {
  -webkit-animation: animate-svg-stroke-4 1s linear 0.8999999999999999s both,
                       animate-svg-fill-4 1s ease-in 0.8999999999999999s both;
          animation: animate-svg-stroke-4 1s linear 0.8999999999999999s both,
               animate-svg-fill-4 1s ease-in 0.8999999999999999s both;
}
.izisvg-5 {
  -webkit-animation: animate-svg-stroke-5 1s linear 1.2s both,
                       animate-svg-fill-5 1s ease-in 1.2s both;
          animation: animate-svg-stroke-5 1s linear 1.2s both,
               animate-svg-fill-5 1s ease-in 1.2s both;
}
.izisvg-6 {
  -webkit-animation: animate-svg-stroke-6 1s linear 1.5s both,
                       animate-svg-fill-6 1s ease-in 1.5s both;
          animation: animate-svg-stroke-6 1s linear 1.5s both,
               animate-svg-fill-6 1s ease-in 1.5s both;
}
.izisvg-7 {
  -webkit-animation: animate-svg-stroke-7 1s linear 1.7999999999999998s both,
                       animate-svg-fill-7 1s ease-in 1.7999999999999998s both;
          animation: animate-svg-stroke-7 1s linear 1.7999999999999998s both,
               animate-svg-fill-7 1s ease-in 1.7999999999999998s both;
}
.izisvg-8 {
  -webkit-animation: animate-svg-stroke-8 1s linear 2.1s both,
                       animate-svg-fill-8 1s ease-in 2.1s both;
          animation: animate-svg-stroke-8 1s linear 2.1s both,
               animate-svg-fill-8 1s ease-in 2.1s both;
}

/* Préchargeur : logo qui se dessine (repris du site d'origine) */
.preloader{position:fixed;inset:0;z-index:999;background:#fff;display:grid;place-items:center;transition:opacity .5s ease,visibility .5s}
.preloader.done{opacity:0;visibility:hidden}
#logosvg{width:140px;height:140px;border-radius:22%;animation:pulse 2s infinite}
#logosvg path{stroke:#DF0051;stroke-width:1}

/* Logo d'en-tête flottant */
.header__logo img{animation:float2 3.77s ease-in-out infinite}

/* Boutons « Télécharger l'application » qui pulsent */
.header__cta,.pulse{animation:pulse2 3s infinite}

/* Grand logo de l'accueil : halo rose */
.hero__logo{border-radius:22%;animation:pulse3 2s infinite;filter:none;box-shadow:0 0 0 0 rgba(223,0,81,.9)}

/* Titre partenaires : effet machine à écrire */
.typed{display:inline-block;min-width:1ch}
.typed::after{content:"";display:inline-block;width:3px;height:.9em;background:currentColor;margin-left:4px;vertical-align:-.08em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

/* Apparitions du site d'origine */
.reveal.flip{transform:perspective(600px) rotateX(-90deg);transform-origin:top;transition-duration:.6s}
.reveal.flip.in{transform:none}
.reveal.zoom.slow{transition-duration:.777s;transition-delay:.5s}
@media (prefers-reduced-motion:reduce){.preloader{display:none}}
