@charset "UTF-8";
@font-face {
  font-family: "Lufga";
  src: url("fonts/lufgaregular-webfont.woff2") format("woff2"), url("fonts/lufgaregular-webfont.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Lufga";
  src: url("fonts/lufgabold-webfont.woff2") format("woff2"), url("fonts/lufgabold-webfont.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
.site-header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 10;
  background-color: transparent;
}

.header-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-logo {
  display: flex;
  align-items: center;
}
.header-logo img {
  max-height: 42px;
  width: auto;
  display: block;
}

.header-nav .nav-menu {
  display: flex;
  align-items: center;
  gap: 32px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.header-nav .nav-menu li {
  margin: 0;
}
.header-nav .nav-menu a {
  font-family: "Lufga", sans-serif;
  font-size: 17px;
  font-weight: 400;
  color: #310579;
  text-decoration: none;
  transition: all 0.3s ease;
}
.header-nav .nav-menu a:hover {
  color: #33057E;
}

.header-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 22px;
  border-radius: 999px;
  background-color: #F6E860;
  color: #33057E;
  font-family: "Lufga", sans-serif;
  font-size: 13px;
  font-weight: 400;
  text-decoration: none;
  transition: all 0.3s ease;
}
.header-cta:hover {
  background-color: #33057E;
  color: #ffffff;
}
.header-cta:hover svg path {
  fill: #fff;
}

.menu-toggle {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  flex-direction: column;
  gap: 6px;
}
.menu-toggle span {
  width: 26px;
  height: 3px;
  background: #310579;
  border-radius: 3px;
  transition: all 0.3s ease;
}
.menu-toggle.active span:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}
.menu-toggle.active span:nth-child(2) {
  opacity: 0;
}
.menu-toggle.active span:nth-child(3) {
  transform: rotate(-45deg) translate(6px, -6px);
}

.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: rgba(51, 5, 126, 0.6);
  backdrop-filter: blur(12px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  padding: 20px;
}
.mobile-menu.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.mobile-menu.active .mobile-nav {
  transform: scale(1) translateY(0);
  opacity: 1;
}
.mobile-menu.active .mobile-nav-menu li {
  opacity: 1;
  transform: translateX(0);
}

.mobile-nav {
  background: linear-gradient(145deg, #33057E 0%, #4a1699 100%);
  border-radius: 30px;
  padding: 50px 30px 40px;
  width: 100%;
  max-width: 440px;
  max-height: 85vh;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  text-align: center;
  position: relative;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), 0 0 0 2px rgba(246, 232, 96, 0.3) inset;
  transform: scale(0.9) translateY(30px);
  opacity: 0;
  transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.mobile-nav::-webkit-scrollbar {
  width: 6px;
}
.mobile-nav::-webkit-scrollbar-track {
  background: rgba(246, 232, 96, 0.1);
  border-radius: 10px;
}
.mobile-nav::-webkit-scrollbar-thumb {
  background: linear-gradient(135deg, #F6E860 0%, #f0dd40 100%);
  border-radius: 10px;
}

.menu-close {
  position: absolute;
  top: 20px;
  right: 20px;
  background: #F6E860;
  border: none;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  font-size: 20px;
  cursor: pointer;
  color: #33057E;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(246, 232, 96, 0.5);
  font-weight: 700;
  z-index: 1;
}
.menu-close:hover {
  transform: rotate(90deg) scale(1.1);
  box-shadow: 0 6px 20px rgba(246, 232, 96, 0.7);
  background: #fef570;
}
.menu-close:active {
  transform: rotate(90deg) scale(0.95);
}

.mobile-nav-menu {
  list-style: none;
  padding: 0;
  margin: 0 0 20px 0;
}
.mobile-nav-menu li {
  margin-bottom: 12px;
  opacity: 0;
  transform: translateX(-20px);
  transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.mobile-nav-menu li:nth-child(1) {
  transition-delay: 0.05s;
}
.mobile-nav-menu li:nth-child(2) {
  transition-delay: 0.1s;
}
.mobile-nav-menu li:nth-child(3) {
  transition-delay: 0.15s;
}
.mobile-nav-menu li:nth-child(4) {
  transition-delay: 0.2s;
}
.mobile-nav-menu li:nth-child(5) {
  transition-delay: 0.25s;
}
.mobile-nav-menu li:nth-child(6) {
  transition-delay: 0.3s;
}
.mobile-nav-menu li:nth-child(7) {
  transition-delay: 0.35s;
}
.mobile-nav-menu li:nth-child(8) {
  transition-delay: 0.4s;
}
.mobile-nav-menu li:nth-child(9) {
  transition-delay: 0.45s;
}
.mobile-nav-menu li:nth-child(10) {
  transition-delay: 0.5s;
}
.mobile-nav-menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: "Lufga", sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #F6E860;
  text-decoration: none;
  padding: 18px 24px;
  border-radius: 16px;
  background: rgba(246, 232, 96, 0.08);
  border: 2px solid rgba(246, 232, 96, 0.15);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}
.mobile-nav-menu a::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(246, 232, 96, 0.2);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 0;
  border-radius: 14px;
}
.mobile-nav-menu a::after {
  content: "→";
  font-size: 18px;
  font-weight: 700;
  opacity: 0;
  transform: translateX(-10px);
  transition: all 0.3s ease;
}
.mobile-nav-menu a:hover {
  color: #F6E860;
  transform: translateX(4px);
  font-weight: 700;
  border-color: rgba(246, 232, 96, 0.4);
  background: rgba(246, 232, 96, 0.12);
  box-shadow: 0 4px 12px rgba(246, 232, 96, 0.2);
}
.mobile-nav-menu a:hover::before {
  opacity: 1;
}
.mobile-nav-menu a:hover::after {
  opacity: 1;
  transform: translateX(0);
}
.mobile-nav-menu a:active {
  transform: translateX(4px) scale(0.98);
}
.mobile-nav-menu .current_page_item a {
  background: rgba(246, 232, 96, 0.2);
  border-color: rgba(246, 232, 96, 0.4);
  font-weight: 700;
  position: relative;
}
.mobile-nav-menu .current_page_item a::before {
  content: "";
  position: absolute;
  left: 24px;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  background: #F6E860;
  border-radius: 50%;
  box-shadow: 0 0 8px rgba(246, 232, 96, 0.6);
}
.mobile-nav-menu .current_page_item a {
  padding-left: 40px;
}

.mobile-cta {
  margin-top: 30px;
  align-self: stretch;
  padding: 18px 32px;
  border-radius: 16px;
  background: #F6E860;
  color: #33057E;
  font-family: "Lufga", sans-serif;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  text-align: center;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 8px 20px rgba(246, 232, 96, 0.4);
  position: relative;
  overflow: hidden;
}
.mobile-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.mobile-cta:hover {
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 12px 30px rgba(246, 232, 96, 0.6);
}
.mobile-cta:hover::before {
  opacity: 1;
}
.mobile-cta:active {
  transform: translateY(0);
  box-shadow: 0 6px 20px rgba(246, 232, 96, 0.4);
}

.nav-menu li {
  opacity: 0;
  transform: translateY(-10px);
  animation: fadeInUp 0.5s ease forwards;
}

.nav-menu li:nth-child(1) {
  animation-delay: 0.2s;
}

.nav-menu li:nth-child(2) {
  animation-delay: 0.3s;
}

.nav-menu li:nth-child(3) {
  animation-delay: 0.4s;
}

.nav-menu li:nth-child(4) {
  animation-delay: 0.5s;
}

.header-cta {
  opacity: 0;
  animation: fadeIn 0.8s ease forwards;
  animation-delay: 0.7s;
  transition: all 0.3s ease;
}

.header-cta:hover svg {
  animation: bounceDown 0.8s infinite;
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes bounceDown {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(4px);
  }
}
.nav-menu li a {
  position: relative;
  transition: color 0.3s ease;
}

.nav-menu li a::after {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 0;
  width: 0;
  height: 2px;
  background-color: #33057E;
  transition: width 0.3s ease;
}

.nav-menu li a:hover::after {
  width: 100%;
}

.header-cta:active {
  transform: scale(0.95);
}

.header-cta svg {
  transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes logo-pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.03);
  }
  100% {
    transform: scale(1);
  }
}
@media (max-width: 480px) {
  .mobile-nav {
    padding: 40px 24px 32px;
    max-width: calc(100vw - 40px);
  }
  .mobile-nav-menu a {
    font-size: 16px;
    padding: 16px 20px;
  }
  .mobile-nav-menu .current_page_item a {
    padding-left: 36px;
  }
  .mobile-nav-menu .current_page_item a::before {
    left: 20px;
    width: 5px;
    height: 5px;
  }
  .mobile-cta {
    font-size: 15px;
    padding: 16px 28px;
  }
}
body:has(.mobile-menu.active) #scrollBtn {
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 992px) {
  .header-nav,
  .header-cta {
    display: none;
  }
  .menu-toggle {
    display: flex;
  }
}
@media (min-width: 993px) {
  .mobile-menu {
    display: none !important;
  }
}
@media (max-width: 370px) {
  .mobile-nav {
    max-width: 90%;
    padding: 36px 20px;
  }
  .mobile-nav-menu a {
    font-size: 18px;
  }
}
.site-footer {
  position: relative;
  z-index: 10;
}

.footer-hero {
  position: relative;
  padding: 150px 20px 60px;
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  margin-top: -20px;
  clip-path: ellipse(120% 80% at 50% 80%);
}

.footer-content {
  position: relative;
  max-width: 1400px;
  margin: 0 auto;
  color: #fff;
  z-index: 3;
}
.footer-content .footer-logo {
  height: auto;
  width: 100%;
  max-width: 400px;
  margin: 0 auto 20px;
  display: block;
}
.footer-content h2 {
  color: #F6E860;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 58px;
  font-weight: 500;
  line-height: 72px;
  letter-spacing: -0.2px;
  max-width: 700px;
  margin: 2rem auto;
}
.footer-content > p {
  color: #CCC;
  text-align: center;
  font-family: "Inter", sans-serif;
  font-size: 24px;
  font-weight: 500;
  line-height: 32px;
  max-width: 650px;
  margin: 1rem auto 40px;
}

.footer-stores {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
}
.footer-stores .store-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 30px;
  position: relative;
  text-decoration: none;
  color: #fff;
  transition: all 0.3s ease;
}
.footer-stores .store-item img {
  width: 22px;
  height: auto;
}
.footer-stores .store-item span {
  font-size: 15px;
  font-weight: 500;
}
.footer-stores .store-item:hover {
  color: #F6E860;
  transform: translateY(-2px);
}
.footer-stores .store-item:not(:last-child)::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 20px;
  width: 1px;
  background-color: rgba(255, 255, 255, 0.4);
}

.footer-content > div:not(.footer-stores) {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  width: 90%;
  margin: auto;
  max-width: 1400px;
  gap: 20px;
}
.footer-content > div:not(.footer-stores) .footer-left {
  flex: 1;
}
.footer-content > div:not(.footer-stores) .footer-left a {
  text-align: left;
  color: #FFF;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
}
.footer-content > div:not(.footer-stores) .footer-privacy {
  flex: 1;
  text-align: center;
}
.footer-content > div:not(.footer-stores) .footer-privacy a {
  color: #FFF;
  font-size: 13px;
  text-decoration: none;
}
.footer-content > div:not(.footer-stores) .footer-privacy a:hover {
  opacity: 1;
  color: #F6E860;
}
.footer-content > div:not(.footer-stores) > div:last-child {
  flex: 1;
  text-align: right;
}
.footer-content > div:not(.footer-stores) > div:last-child .footer-socials {
  display: inline-flex;
  gap: 15px;
  margin-bottom: 8px;
}
.footer-content > div:not(.footer-stores) > div:last-child .footer-socials a {
  display: flex;
  transition: all 0.3s ease;
}
.footer-content > div:not(.footer-stores) > div:last-child .footer-socials a:hover {
  transform: rotate(15deg) scale(1.1);
  filter: drop-shadow(0 0 5px #F6E860);
}
.footer-content > div:not(.footer-stores) > div:last-child .footer-socials a img {
  width: 20px;
  height: 20px;
}
.footer-content > div:not(.footer-stores) > div:last-child .footer-right {
  display: block;
  color: #FFF;
  font-size: 11.5px;
  font-weight: 600;
}

.footer-logo, .footer-content h2, .footer-content > p,
.footer-stores, .footer-left, .footer-privacy, .footer-right-column, .footer-right {
  opacity: 0;
  filter: blur(5px);
  transform: translateY(20px);
  transition: all 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.site-footer.is-visible .footer-logo, .site-footer.is-visible .footer-content h2, .site-footer.is-visible .footer-content > p,
.site-footer.is-visible .footer-stores, .site-footer.is-visible .footer-left, .site-footer.is-visible .footer-privacy, .site-footer.is-visible .footer-right-column, .site-footer.is-visible .footer-right, .page .site-footer .footer-logo, .page .site-footer .footer-content h2, .page .site-footer .footer-content > p,
.page .site-footer .footer-stores, .page .site-footer .footer-left, .page .site-footer .footer-privacy, .page .site-footer .footer-right-column, .page .site-footer .footer-right {
  opacity: 1;
  filter: blur(0);
  transform: translateY(0);
}
.site-footer.is-visible .footer-logo, .page .site-footer .footer-logo {
  transition-delay: 0.1s;
}
.site-footer.is-visible .footer-content h2, .page .site-footer .footer-content h2 {
  transition-delay: 0.2s;
}
.site-footer.is-visible .footer-content > p, .page .site-footer .footer-content > p {
  transition-delay: 0.3s;
}
.site-footer.is-visible .footer-stores, .page .site-footer .footer-stores {
  transition-delay: 0.4s;
}
.site-footer.is-visible .footer-left, .page .site-footer .footer-left {
  transition-delay: 0.5s;
}
.site-footer.is-visible .footer-privacy, .page .site-footer .footer-privacy {
  transition-delay: 0.6s;
}
.site-footer.is-visible .footer-right, .page .site-footer .footer-right {
  transition-delay: 0.7s;
}

@media (max-width: 992px) {
  .footer-content > div:not(.footer-stores) {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .footer-content > div:not(.footer-stores) .footer-left, .footer-content > div:not(.footer-stores) .footer-privacy, .footer-content > div:not(.footer-stores) > div:last-child {
    text-align: center;
    flex: none;
  }
  .footer-content > div:not(.footer-stores) .footer-socials {
    justify-content: center;
  }
}
@media (max-width: 768px) {
  .footer-hero {
    padding: 80px 20px 40px;
  }
  .footer-content h2 {
    font-size: 30px;
    line-height: 38px;
  }
  .footer-content > p {
    font-size: 16px;
    line-height: 24px;
  }
  .footer-stores {
    flex-direction: column;
    gap: 15px;
  }
  .footer-stores .store-item {
    padding: 0;
  }
  .footer-stores .store-item::after {
    display: none;
  }
}
body, html {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Lufga", sans-serif;
  overflow-x: hidden;
}

.scroll-button {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 1000;
  width: 60px;
  height: 60px;
  background-color: #4B1D5E;
  border: 3px solid #F3EA5F;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
}

.chevron {
  width: 15px;
  height: 15px;
  border-top: 3px solid #F3EA5F;
  border-left: 3px solid #F3EA5F;
  transform: rotate(45deg);
  margin-top: 8px;
  transition: transform 0.3s ease;
}

.scroll-button.down .chevron {
  transform: rotate(225deg);
  margin-top: -8px;
}

.hero-main {
  position: relative;
  width: 100%;
  background-size: cover;
  display: flex;
  align-items: center;
  padding-top: 7rem;
}

.hero-container {
  max-width: 1200px;
  margin: 0 auto;
  gap: 40px;
  padding: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.hero-content {
  flex: 1;
  min-width: 280px;
}

.hero-content h1 {
  color: #000;
  font-family: "Lufga", sans-serif;
  font-size: 56.937px;
  margin: 0;
  font-weight: 700;
  line-height: 75.542px;
  position: relative;
}

.hero-content p {
  color: #000;
  font-family: "Lufga", sans-serif;
  font-size: 15.408px;
  font-weight: 400;
  line-height: 28.247px;
}

.hero-content p strong {
  color: var(--Color, #33057E);
  font-family: "Lufga", sans-serif;
  font-size: 15.408px;
  font-style: normal;
  font-weight: 600;
  line-height: 28.247px;
}

.highlight-yellow {
  position: relative;
  display: inline-block;
}

.highlight-yellow::after {
  content: "";
  position: absolute;
  left: -5%;
  bottom: 8px;
  width: 110%;
  height: 12px;
  background: #F7E15E;
  z-index: -1;
  border-radius: 10px;
  opacity: 0.8;
}

.hero-text::after {
  content: "";
  display: block;
  width: 255px;
  height: 60px;
  margin-left: -5rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='255' height='60' viewBox='0 0 255 60' fill='none'%3E%3Cpath d='M18.8905 28.3872C18.0394 27.9762 18.1671 27.5247 19.3403 27.1272C20.5123 26.7299 22.622 26.42 25.2233 26.263C27.826 26.1063 30.735 26.1147 33.3195 26.2859C35.9027 26.4571 37.9442 26.7773 39.0896 27.1703C40.1502 27.5298 41.2672 27.8911 42.4281 28.2485C45.1203 29.077 48.041 29.8923 51.1349 30.6951C64.5734 34.1708 80.774 37.648 102.894 40.06C115.03 41.3782 128.459 42.4079 142.484 43.0407C145 43.1544 147.535 43.2557 150.082 43.3433C152.681 43.4347 154.821 43.7022 156.066 44.0673C157.309 44.4325 157.549 44.8689 156.746 45.2771C155.941 45.6856 154.158 46.0286 151.803 46.2267C149.448 46.4244 146.701 46.4649 144.209 46.3196C141.425 46.1596 138.673 45.9901 135.955 45.8123C120.806 44.8203 106.681 43.5663 93.4688 42.1328C69.6656 39.5399 46.6773 36.5301 31.2037 32.5475C27.692 31.6362 24.5853 30.6815 21.9747 29.689C20.8493 29.2611 19.8098 28.8252 18.8905 28.3872Z' fill='%23F6E860'/%3E%3Cpath d='M57.7926 16.6232C56.4474 15.9859 55.2157 15.3353 54.1357 14.683C53.4174 14.2536 53.9462 13.8008 55.5157 13.4269C57.0876 13.0527 59.5934 12.7875 62.46 12.6906C65.3243 12.5938 68.2978 12.6733 70.7144 12.9124C73.1299 13.1515 74.8038 13.5302 75.2791 13.968C75.8918 14.5442 76.6977 15.1255 77.6629 15.6992C79.9058 17.032 83.0384 18.3409 86.8749 19.6024C103.818 25.1128 132.375 29.6762 164.217 33.1163C178.73 34.6765 193.583 36.2635 210.443 37.131C213.986 37.3129 217.575 37.4657 221.212 37.5882C224.943 37.7136 228.721 37.807 232.492 37.8645C235.348 37.9105 237.864 38.1522 239.509 38.5165C241.154 38.8812 241.787 39.3432 241.278 39.7954C240.767 40.2473 239.156 40.6487 236.808 40.9086C234.46 41.168 231.562 41.2679 228.771 41.1656C224.507 41.0124 220.273 40.8424 216.097 40.6581C212.028 40.4787 208.017 40.2867 204.032 40.0821C185.225 39.1163 166.528 37.9753 150.228 36.2256C114.571 32.3556 87.4317 26.9477 68.8995 20.9254C64.674 19.5357 60.9172 18.1033 57.7926 16.6232Z' fill='%23F6E860'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
}

.hero-image {
  width: 40%;
  text-align: right;
  min-width: 280px;
  opacity: 0;
  animation: fadeInRight 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
  animation-delay: 0.6s;
}
.hero-image img {
  /* L'image flotte en continu une fois apparue */
  animation: floatPhone 4s ease-in-out infinite;
  animation-delay: 1.6s;
}

.hero-image img {
  max-width: 550px;
  width: 100%;
  height: auto;
  display: block;
}

.hero-apps .btn-app {
  opacity: 0;
  transform: translateY(30px) scale(0.9);
  animation: btnReveal 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  position: relative;
  overflow: hidden;
}
.hero-apps .btn-app:nth-child(1) {
  animation-delay: 0.7s;
}
.hero-apps .btn-app:nth-child(2) {
  animation-delay: 0.85s;
}
.hero-apps .btn-app {
  /* Transition plus complexe pour un effet "ressort" */
  transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.3s ease, background-color 0.3s ease;
}
.hero-apps .btn-app:hover {
  transform: translateY(-8px) scale(1.03);
  box-shadow: 0 15px 30px rgba(49, 5, 121, 0.2);
  background-color: #1a1a1a;
}
.hero-apps .btn-app:hover::after {
  left: 120%;
}
.hero-apps .btn-app::after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.2), transparent);
  transform: skewX(-25deg);
  transition: left 0.6s ease;
}

@keyframes btnReveal {
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
.hero-apps {
  display: flex;
  gap: 15px;
  margin-top: 30px;
  flex-wrap: wrap;
}

.btn-app-white-bg {
  background: #fff !important;
}

.btn-app {
  background: #000;
  color: #fff;
  padding: 10px 20px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  text-decoration: none;
}

.btn-text-dark .small-txt {
  color: #000 !important;
}

.btn-text-dark .big-txt {
  color: #000 !important;
}

.btn-text {
  display: flex;
  flex-direction: column;
  margin-left: 12px;
}

.small-txt {
  color: #FFF;
  font-family: "Lufga", sans-serif;
  font-size: 13px;
  font-weight: 300;
  text-transform: uppercase;
}

.big-txt {
  font-size: 16px;
  font-weight: 600;
}

.purple-pill-icon {
  display: inline-block;
  width: 120px;
  height: 52px;
  vertical-align: text-bottom;
  margin: 0 5px 10px 5px;
  background-image: url("data:image/svg+xml,%3Csvg width='86' height='44' viewBox='0 0 86 44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='5.21922' y='5.21922' width='74.967' height='33.2132' rx='16.6066' stroke='url(%23paint0_linear_26_736)' stroke-width='10.4384'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_26_736' x1='0' y1='21.8258' x2='85.4054' y2='21.8258' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2333057E'/%3E%3Cstop offset='1' stop-color='%23CFA0FF'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

/* Apparition vers le haut */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* Apparition de l'image (glissement latéral) */
@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translateX(50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
/* Flottaison douce pour le téléphone */
@keyframes floatPhone {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
}
/* Animation pour le "scribble" jaune sous le texte */
@keyframes drawUnderline {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
@media (max-width: 991px) {
  .hero-container {
    flex-direction: column;
    text-align: center;
  }
  .hero-image img {
    margin-top: 30px;
  }
}
@media (max-width: 490px) {
  .hero-content h1 {
    font-size: 2rem;
  }
  .purple-pill-icon {
    width: 70px;
    height: 30px;
    margin: 0 5px 5px 5px;
  }
  .btn-app {
    width: 100%;
    max-width: 200px;
    padding: 8px 12px;
    align-self: center;
  }
  .hero-apps {
    flex-direction: column;
  }
  .hero-text::after {
    width: 180px;
    height: 40px;
    margin-left: -2rem;
  }
}
@media (max-width: 320px) {
  .hero-apps {
    flex-direction: column;
    gap: 10px;
  }
  .hero-text::after {
    width: 150px;
    height: 35px;
    margin-left: -1rem;
  }
  .hero-container {
    padding: 15px;
  }
}
.pink-experience-section {
  background-color: #222;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 80px 20px;
  color: #fff;
  text-align: center;
  position: relative;
}

.testimonials-section .container {
  max-width: 1200px;
  margin: 0 auto;
  width: 90%;
}

.section-title {
  margin-bottom: 50px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #FFF;
  text-align: center;
  font-family: "Lufga", sans-serif;
  font-size: 50px;
  font-style: normal;
  font-weight: 600;
  line-height: 38px;
}

.cards-grid {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 50px;
  flex-wrap: wrap;
  padding: 40px 0;
  gap: 10px;
}

.experience-card.card-0 {
  transform: rotate(10deg);
  margin-top: -3rem;
  z-index: 2;
}

.experience-card.card-1 {
  transform: rotate(0deg);
  z-index: 2;
}

.experience-card.card-2 {
  transform: rotate(-10deg);
  margin-top: -3rem;
}

.experience-card {
  transition: transform 0.3s ease;
}

.experience-card:hover {
  transform: rotate(0deg) scale(1.05);
  z-index: 10;
}

.experience-card {
  width: 25%;
  padding: 30px;
  border-radius: 20px;
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  position: relative;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.experience-card.style-white {
  background-color: #fff;
  color: #333;
}

.experience-card.style-gradient {
  border-radius: 32px;
  border: 1px solid #EFE8DE;
  background: radial-gradient(100% 202.78% at 50% 0%, #F6E860 0%, #F6E860 11.67%, #CFA0FF 81.73%);
  box-shadow: 0 10px 20px 4px rgba(17, 17, 17, 0.05);
  color: #310579;
  position: relative;
  z-index: 1;
}

.card-title {
  color: #310579;
  font-family: "Lufga", sans-serif;
  font-size: 25px;
  font-style: normal;
  font-weight: 600;
  line-height: 32px;
  letter-spacing: -0.39px;
  margin-bottom: 5px;
}

.card-subtitle {
  display: block;
  color: #958F8C;
  font-family: "Lufga", sans-serif;
  font-size: 17.4px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: -0.18px;
  margin-bottom: 15px;
}

.card-text {
  color: #111;
  font-family: "Lufga", sans-serif;
  font-size: 17.3px;
  font-weight: 400;
  line-height: 27px;
  letter-spacing: -0.18px;
  margin-top: 15px;
}

.card-visual img {
  max-width: 100%;
  height: auto;
  display: block;
}

.style-gradient .card-visual {
  order: 3;
  margin-top: auto;
}

.btn-pink {
  display: inline-block;
  background: linear-gradient(90deg, #D8B4FE, #FDE68A);
  padding: 15px 30px;
  border-radius: 30px;
  text-decoration: none;
  color: #310579;
  text-align: center;
  font-family: "Inter";
  font-size: 15.577px;
  font-weight: 400;
  line-height: 24.231px;
  letter-spacing: -0.38px;
  transition: transform 0.2s;
}

.btn-pink:hover {
  transform: scale(1.05);
}

@media (max-width: 1024px) {
  .experience-card {
    width: 45%;
  }
  .experience-card.card-0,
  .experience-card.card-1,
  .experience-card.card-2 {
    transform: rotate(0deg);
    margin-top: 0;
  }
}
@media (max-width: 768px) {
  .pink-experience-section {
    padding: 40px 15px;
  }
  .section-title {
    font-size: 1.8rem;
    flex-direction: column;
  }
  .cards-grid {
    flex-direction: column;
    gap: 30px;
    padding: 20px 0;
  }
  .experience-card {
    width: 70%;
    max-width: 400px;
    margin: 0 auto !important;
    transform: rotate(0deg) !important;
  }
  .experience-card:hover {
    transform: none;
  }
  .card-title {
    font-size: 1.4rem;
  }
  .btn-pink {
    width: 100%;
    max-width: 280px;
    box-sizing: border-box;
  }
}
.app-social-section {
  padding: 100px 0;
  background: #fff;
  overflow: hidden;
}

.app-container {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 1400px;
  margin: 0 auto;
}

.app-col {
  flex: 1;
  position: relative;
}

.app-col.phone-right-wrapper {
  margin-bottom: 5rem;
}

.phone-img img {
  width: 100%;
  object-fit: cover;
  object-position: center;
  filter: drop-shadow(0 30px 60px rgba(0, 0, 0, 0.12));
}

.phone-left-wrapper .badges-container {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 5;
}

.app-badge {
  position: absolute;
  width: 160px;
  transform: rotate(-10deg);
}

.app-content {
  text-align: center;
  max-width: 600px;
  flex: 1.5;
}

.app-title {
  color: #111;
  text-align: center;
  font-family: "Lufga", sans-serif;
  font-size: 45px;
  font-weight: 700;
  line-height: 57px;
  letter-spacing: -1.134px;
  margin-bottom: 25px;
}

.app-desc {
  color: #000;
  text-align: center;
  font-family: "Lufga", sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 28.247px;
}

.app-buttons {
  display: flex;
  gap: 15px;
  justify-content: center;
  margin-top: 30px;
}

.app-btn {
  background: #000;
  color: #fff;
  padding: 10px 20px;
  border-radius: 10px;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 12px;
  transition: transform 0.2s;
}

.app-btn:hover {
  transform: scale(1.05);
}

.app-btn i {
  font-size: 28px;
}

.btn-text {
  display: flex;
  flex-direction: column;
  text-align: left;
  line-height: 1;
}

.app-col .hero-apps {
  display: flex;
  justify-content: center !important;
}

@media (max-width: 1400px) {
  .app-content {
    text-align: center;
    padding: 0 40px;
    max-width: 600px;
    flex: 2;
  }
  .phone-img img {
    width: 100%;
    height: auto;
    filter: drop-shadow(0 30px 60px rgba(0, 0, 0, 0.12));
  }
}
@media (min-width: 1025px) {
  .app-social-section .phone-left-wrapper {
    opacity: 0;
    transform: translateX(-80px);
  }
  .app-social-section .phone-right-wrapper {
    opacity: 0;
    transform: translateX(80px);
  }
  .app-social-section .app-content {
    opacity: 0;
    transform: translateY(30px);
  }
  .app-social-section .app-badge {
    opacity: 0;
    transform: scale(0.5) rotate(-10deg);
  }
  .app-social-section.is-visible .phone-left-wrapper {
    animation: revealSocialSide 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
  }
  .app-social-section.is-visible .phone-right-wrapper {
    animation: revealSocialSide 1s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
    animation-delay: 0.2s;
  }
  .app-social-section.is-visible .app-content {
    animation: revealSocialContent 0.8s ease forwards;
    animation-delay: 0.4s;
  }
  .app-social-section.is-visible .app-badge {
    animation: revealBadgePop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  }
  .app-social-section.is-visible .app-badge:nth-child(1) {
    animation-delay: 0.6s;
  }
  .app-social-section.is-visible .app-badge:nth-child(2) {
    animation-delay: 0.8s;
  }
  .app-social-section.is-visible .app-badge img {
    animation: floatingBadge 4s ease-in-out infinite;
    animation-delay: 1.2s;
  }
}
@keyframes revealSocialSide {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes revealSocialContent {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes revealBadgePop {
  to {
    opacity: 1;
    transform: scale(1) rotate(-10deg);
  }
}
@keyframes floatingBadge {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
}
@media (max-width: 1024px) {
  .app-container {
    flex-direction: column;
  }
  .phone-left-wrapper, .phone-right-wrapper {
    width: 60%;
  }
  .phone-left-wrapper {
    margin-top: 1rem;
  }
  .app-social-section {
    padding: 20px 0;
  }
  .app-col.phone-left-wrapper {
    max-width: 300px;
  }
  .app-col.phone-right-wrapper {
    max-width: 300px;
    margin-bottom: 0;
  }
}
@media (max-width: 450px) {
  .app-badge img {
    width: 70px;
  }
  .app-social-section {
    padding: 30px 0 0 0;
    background: #fff;
    overflow: hidden;
  }
  .app-content {
    width: 90%;
  }
}
.app-slider-section {
  padding: 80px 0;
  overflow: hidden;
  position: relative;
  background-color: rgba(207, 160, 255, 0.11);
  background-position: bottom right;
  background-size: 45%;
  background-repeat: no-repeat;
}

.app-slider-section .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.slider-header {
  text-align: center;
  margin-bottom: 60px;
}

.slider-header .main-title {
  margin-bottom: 16px;
  color: var(--Color-2, #4D2161);
  text-align: center;
  font-family: "Lufga", sans-serif;
  font-size: 44px;
  font-weight: 700;
  line-height: 57px;
  margin-bottom: 0.5rem;
  text-transform: capitalize;
  position: relative;
  display: inline;
  z-index: 2;
}

.title-wrapper {
  display: inline-block;
  position: relative;
  padding-right: 20px;
}

.main-title::after {
  content: "";
  position: absolute;
  top: 20px;
  right: -70px;
  width: 150px;
  height: 70px;
  background-image: url("data:image/svg+xml,%3Csvg width='199' height='96' viewBox='0 0 199 96' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M42.6864 67.3134C42.2031 67.2603 42.1876 67.0194 42.6881 66.6252C43.1882 66.2313 44.1579 65.7188 45.3923 65.196C46.6273 64.673 48.0393 64.1776 49.3219 63.8168C50.6038 63.4562 51.6487 63.2609 52.2715 63.2548C52.8475 63.2469 53.4512 63.2303 54.0754 63.2043C55.5231 63.1437 57.0793 63.0374 58.7173 62.8955C65.8302 62.2731 74.2826 61.1771 85.4221 58.5482C91.5333 57.1032 98.2215 55.2965 105.13 53.195C106.37 52.818 107.616 52.4319 108.866 52.0371C110.142 51.635 111.226 51.3972 111.892 51.3604C112.558 51.3241 112.749 51.4944 112.43 51.8303C112.11 52.1666 111.304 52.6391 110.196 53.1395C109.088 53.6398 107.763 54.1311 106.53 54.4887C105.153 54.8891 103.789 55.2795 102.441 55.6601C94.9247 57.7805 87.8608 59.5979 81.2082 61.1717C69.2213 64.002 57.5579 66.4902 49.3712 67.2162C47.512 67.3774 45.8416 67.4479 44.4054 67.415C43.7863 67.4008 43.2074 67.3679 42.6864 67.3134Z' fill='%23F6E860'/%3E%3Cpath d='M59.5291 54.9291C58.7674 54.851 58.0584 54.7471 57.4228 54.6162C57.0008 54.5314 57.1794 54.221 57.8762 53.7702C58.5741 53.3188 59.7436 52.76 61.1169 52.2207C62.4891 51.6819 63.9445 51.2099 65.1574 50.9108C66.3696 50.6119 67.2463 50.5081 67.552 50.6388C67.948 50.813 68.4386 50.9564 69.0051 51.0689C70.3215 51.33 72.0652 51.4267 74.1421 51.3795C83.3038 51.1419 97.9337 48.4509 113.964 44.6509C121.269 42.9152 128.743 41.1342 137.068 38.6595C138.816 38.1394 140.583 37.5971 142.368 37.0319C144.198 36.4521 146.046 35.8485 147.885 35.2289C149.277 34.7608 150.539 34.4459 151.399 34.3401C152.259 34.2345 152.645 34.3498 152.476 34.6565C152.306 34.9633 151.594 35.4345 150.5 35.9639C149.406 36.4927 148.018 37.0388 146.647 37.4685C144.553 38.1265 142.471 38.7712 140.415 39.3988C138.411 40.0105 136.433 40.6063 134.466 41.1914C125.181 43.9526 115.919 46.6102 107.715 48.5606C89.761 52.8074 75.6734 54.8455 65.6534 55.1078C63.3659 55.1595 61.2983 55.1102 59.5291 54.9291Z' fill='%23F6E860'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  z-index: -1;
  pointer-events: none;
}

.slider-header .main-subtitle {
  max-width: 600px;
  margin: 0.5rem auto;
  color: #000;
  text-align: center;
  font-family: "Lufga", sans-serif;
  font-size: 15.408px;
  font-weight: 400;
  line-height: 28.247px;
}

.app-mockup-swiper {
  position: relative;
  padding: 40px 0 60px;
}

.app-mockup-swiper .swiper-wrapper {
  align-items: flex-end;
}

.swiper-slide {
  height: auto;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.phone-container {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding: 10px;
  width: 100%;
}

.phone-container {
  transition: transform 0.5s linear;
  transform: scale(1);
  will-change: transform;
}

.app-mockup-swiper {
  overflow: visible !important;
}

.phone-container img {
  max-width: 100%;
  height: auto;
  border-radius: 20px;
  transition: transform 0.3s ease;
}

.swiper-slide-active .phone-container {
  transform: scale(1.2);
}

.my-custom-navigation {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  margin-top: 30px;
}

.btn-slider-prev,
.btn-slider-next {
  all: unset;
  width: 60px;
  height: 60px;
  display: flex;
  background: none;
  border: none;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
}

.btn-slider-prev:hover,
.btn-slider-next:hover {
  transform: translateY(-3px);
}

.swiper-button-disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.active-slide-content {
  text-align: center;
  margin-top: 50px;
  min-height: 100px;
}

.active-slide-content h3 {
  color: var(--Color-2, #4D2161);
  text-align: center;
  font-family: "Lufga", sans-serif;
  font-size: 28px;
  font-weight: 400;
  line-height: 48px;
  text-transform: capitalize;
  margin-bottom: 12px;
}

.active-slide-content p {
  color: var(--Color-2, #4D2161);
  text-align: center;
  font-family: "Lufga", sans-serif;
  font-size: 20px;
  font-weight: 300;
  line-height: 32px;
  max-width: 500px;
  margin: 0 auto 30px;
  line-height: 1.6;
}

.swiper-pagination {
  position: relative;
  margin-top: 20px;
}

.swiper-pagination-bullet {
  border-radius: 100px;
  background: rgba(86, 52, 139, 0.23);
  width: 9px;
  height: 9px;
  opacity: 1;
  margin: 0 5px;
  transition: all 0.3s ease;
}

.swiper-pagination-bullet-active {
  width: 20.571px;
  height: 9px;
  border-radius: 100px;
  background: var(--Color-3, #CFA0FF);
}

@media (max-width: 1024px) {
  .custom-nav {
    width: 45px;
    height: 45px;
  }
}
@media (max-width: 768px) {
  .app-slider-section {
    padding: 60px 0;
  }
  .slider-header .main-title {
    font-size: 1.75rem;
  }
  .slider-header .main-subtitle {
    font-size: 1rem;
  }
  .custom-nav {
    width: 40px;
    height: 40px;
  }
  .custom-nav::after {
    font-size: 18px;
  }
  .active-slide-content h3 {
    font-size: 1.25rem;
  }
}
@media (max-width: 480px) {
  .swiper-nav-wrapper {
    padding: 0 10px;
  }
  .custom-nav {
    width: 35px;
    height: 35px;
  }
}
.testimonials-section {
  padding: 80px 0;
  text-align: center;
  background-color: #fff;
}

.testi-main-title {
  display: flex;
  justify-content: center;
  gap: 5px;
  color: #111;
  text-align: center;
  font-family: "Lufga", sans-serif;
  font-size: 45px;
  font-weight: 600;
  line-height: 46px;
  letter-spacing: -0.95px;
  margin-bottom: 40px;
}

.testi-banner-container {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
}

.testi-bg-banner img {
  width: 100%;
  height: 450px;
  object-fit: cover;
  border-radius: 25px;
  display: block;
}

.testi-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
  padding: 0 40px;
  margin-top: -180px;
  position: relative;
  z-index: 5;
}

.testi-card {
  background: #fff;
  padding: 30px;
  border-radius: 20px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
}

.testi-text {
  color: #111;
  font-family: "Lufga", sans-serif;
  font-size: 17.6px;
  font-weight: 400;
  line-height: 27px;
  letter-spacing: -0.18px;
  margin: 0;
}

.testi-user {
  display: flex;
  align-items: center;
  gap: 12px;
}

.user-avatar img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.user-info {
  color: #7A7675;
  font-family: "Lufga", sans-serif;
  font-size: 17.2px;
  font-weight: 600;
  line-height: 24px;
}

.testi-main-title,
.testi-bg-banner,
.testi-card {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.testimonials-section.is-visible .testi-main-title {
  opacity: 1;
  transform: translateY(0);
}

.testimonials-section.is-visible .testi-bg-banner {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.2s;
}

.testimonials-section.is-visible .testi-card {
  opacity: 1;
  transform: translateY(0);
}

.testimonials-section.is-visible .testi-card:nth-child(1) {
  transition-delay: 0.4s;
}

.testimonials-section.is-visible .testi-card:nth-child(2) {
  transition-delay: 0.6s;
}

.testimonials-section.is-visible .testi-card:nth-child(3) {
  transition-delay: 0.8s;
}

.testi-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.testi-card:hover {
  transform: translateY(-10px) !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
  border-bottom: 3px solid #CFA0FF;
}

@media (max-width: 992px) {
  .testi-cards-grid {
    grid-template-columns: 1fr;
    margin-top: 20px;
    padding: 0 20px;
  }
  .testi-main-title {
    flex-direction: column;
    align-items: center;
  }
  .testi-bg-banner img {
    height: 250px;
  }
}
.cta-app {
  position: relative;
  padding: 140px 20px 200px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-color: #000;
}

.cta-app::before {
  content: "";
  position: absolute;
  top: -120px;
  left: -10%;
  width: 120%;
  height: 180px;
  background: #fff;
  border-radius: 0 0 100% 100%;
  z-index: 2;
}

.cta-app::after {
  content: "";
  position: absolute;
  bottom: -160px;
  left: -10%;
  width: 120%;
  height: 220px;
  background: #fff;
  border-radius: 100% 100% 0 0;
  z-index: 2;
}

.cta-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  z-index: 1;
}

.cta-content {
  position: relative;
  max-width: 900px;
  margin: auto;
  text-align: center;
  color: #fff;
  z-index: 3;
}

.cta-content h2 {
  margin-bottom: 20px;
  color: #FFF;
  text-align: center;
  font-family: "Lufga", sans-serif;
  font-size: 50px;
  font-weight: 600;
  line-height: 51.568px;
  letter-spacing: -1.065px;
}

.cta-content p {
  margin-bottom: 40px;
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
  color: #FFF;
  font-family: "Lufga", sans-serif;
  font-size: 19.843px;
  font-weight: 600;
  line-height: 26.905px;
  letter-spacing: -0.202px;
}

.hero-apps-white-bg {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 20px !important;
  flex-wrap: wrap;
}

.hero-apps-white-bg a {
  transition: transform 0.3s ease !important;
}

.hero-apps-white-bg a:hover {
  transform: translateY(-3px) !important;
}

.hero-apps-white-bg img:hover {
  transform: scale(1.05) !important;
}

.cta-app {
  transition: background-size 2s ease-in-out;
}

.cta-content h2,
.cta-content p {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.8s cubic-bezier(0.24, 1.2, 0.5, 1);
}

.cta-content p {
  transition-delay: 0.2s;
}

.btn-app-white-bg {
  opacity: 0;
  transform: scale(0.8);
  transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}

.cta-app.is-visible .cta-content h2,
.cta-app.is-visible .cta-content p {
  opacity: 1;
  transform: translateY(0);
}

.cta-app.is-visible .btn-app-white-bg {
  opacity: 1;
  transform: scale(1);
}

.cta-app.is-visible .btn-app-white-bg:nth-child(1) {
  transition-delay: 0.4s !important;
}

.cta-app.is-visible .btn-app-white-bg:nth-child(2) {
  transition-delay: 0.6s !important;
}

.btn-app-white-bg {
  position: relative;
  overflow: hidden;
}

.btn-app-white-bg::after {
  content: "";
  position: absolute;
  top: -50%;
  left: -60%;
  width: 20%;
  height: 200%;
  background: rgba(255, 255, 255, 0.2);
  transform: rotate(30deg);
  transition: all 0.5s;
}

.btn-app-white-bg:hover::after {
  left: 120%;
}

@media (max-width: 768px) {
  .cta-app {
    padding: 110px 20px 160px;
    background-size: cover;
  }
  .cta-app::before {
    top: -90px;
    height: 140px;
  }
  .cta-app::after {
    bottom: -110px;
    height: 170px;
  }
  .cta-content h2 {
    font-size: 32px;
  }
  .cta-content p {
    font-size: 16px;
  }
  .cta-buttons img {
    height: 48px;
  }
}
@media (max-width: 480px) {
  .cta-app {
    padding: 90px 15px 140px;
  }
  .cta-content h2 {
    font-size: 28px;
  }
  .cta-content p {
    font-size: 15px;
  }
  .cta-buttons {
    gap: 15px;
  }
  .cta-buttons img {
    height: 44px;
  }
}
@media (max-width: 1024px) {
  .slider-header .main-title,
  .app-title,
  .testi-main-title {
    font-size: 2rem;
  }
}
.scroll-button {
  animation: bounce 2s infinite;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-10px);
  }
  60% {
    transform: translateY(-5px);
  }
}
.privacy-main {
  min-height: 100vh;
  padding-bottom: 100px;
}
.privacy-main .container {
  max-width: 850px;
  margin: 0 auto;
  padding: 0 20px;
}
.privacy-main .privacy-hero {
  padding: 120px 0 60px;
  text-align: center;
}
.privacy-main .privacy-hero h1 {
  background: linear-gradient(135deg, #F6E860 0%, #CFA0FF 50%, #4D2161 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-family: "Lufga", sans-serif;
  font-size: 52px;
  font-weight: 800;
  line-height: 1.1;
  filter: drop-shadow(0px 4px 8px rgba(0, 0, 0, 0.1));
}
.privacy-main .privacy-hero .divider {
  width: 60px;
  height: 4px;
  background: #F6E860;
  margin: 0 auto;
  border-radius: 2px;
}
.privacy-main .privacy-body {
  background: #fff;
  margin-top: -40px;
  padding: 60px;
  border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  font-family: "Lufga", sans-serif;
  line-height: 1.8;
  color: #444;
}
.privacy-main .privacy-body h2 {
  color: #1a1a1a;
  font-size: 26px;
  margin: 45px 0 25px;
  font-weight: 700;
  border-left: 5px solid #F6E860;
  padding-left: 20px;
}
.privacy-main .privacy-body strong {
  display: block;
  color: #1a1a1a;
  font-size: 19px;
  font-weight: 700;
  margin-top: 35px;
  margin-bottom: 12px;
  padding-left: 15px;
  border-left: 3px solid #F6E860;
}
.privacy-main .privacy-body em {
  display: block;
  font-style: normal;
  font-family: "Lufga", sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #33057E;
  background: rgba(207, 160, 255, 0.1);
  padding: 10px 20px;
  border-radius: 8px;
  margin: 10px 0;
  border-right: 2px solid #CFA0FF;
  text-align: center;
}
.privacy-main .privacy-body p {
  margin-bottom: 20px;
}
.privacy-main .privacy-body p em:not(:only-child) {
  display: inline;
  background: none;
  padding: 0;
  text-transform: none;
  font-style: italic;
  color: #33057E;
  border: none;
}
.privacy-main .privacy-body ul {
  margin-bottom: 25px;
  padding-left: 5px;
  list-style: none;
}
.privacy-main .privacy-body ul li {
  margin-bottom: 12px;
  position: relative;
  padding-left: 25px;
}
.privacy-main .privacy-body ul li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: #F6E860;
  font-size: 20px;
}
.privacy-main .privacy-body ul li strong {
  display: inline;
  border-left: none;
  padding-left: 0;
  margin: 0;
  font-size: inherit;
  color: #33057E;
}
.privacy-main .privacy-body a {
  color: #33057E;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
}
.privacy-main .privacy-body a:hover {
  color: #F6E860;
  border-bottom-color: #F6E860;
}

@media (max-width: 768px) {
  .privacy-main .privacy-hero h1 {
    font-size: 32px;
  }
  .privacy-main .privacy-body {
    padding: 40px 20px;
    margin-top: 0;
    border-radius: 0;
  }
}

/*# sourceMappingURL=style.css.map */