.hero {
  grid-column-gap: 80px;
  grid-row-gap: 80px;
  background-image: linear-gradient(#00000080, #00000080), url('../images/landscape-kaz-kreol.webp');
  background-position: 0 0, 50%;
  background-size: auto, cover;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 100dvh;
  display: flex;
}

.bouton-plateformes {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: #00ccc0;
  border-radius: 8px;
  flex: 0 auto;
  justify-content: center;
  align-self: center;
  align-items: center;
  padding: 24px;
  text-decoration: none;
  display: flex;
}

.bouton-plateformes.deliveroo {
  align-self: stretch;
}

.bouton-plateformes.uber-eat {
  background-color: #06c167;
  align-self: stretch;
  display: flex;
}

.bouton-plateformes.laddition {
  background-color: #fff;
  align-self: stretch;
  display: flex;
}

.texte-bouton {
  color: #fff;
  font-family: Braah One, sans-serif;
  font-size: 16px;
  text-decoration: none;
}

.texte-bouton.uber-eat {
  color: #000;
}

.texte-bouton.laddition {
  color: #ff0555;
}

.container-boutons-plateforme {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-flow: column;
  justify-content: flex-start;
  align-self: center;
  align-items: stretch;
  min-width: 431px;
  display: flex;
}

.image {
  max-width: 682px;
}

.footer {
  background-color: #222;
}

.text-block {
  color: #fff;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  height: 75px;
  font-family: Braah One, sans-serif;
  display: flex;
}

.link {
  color: #fff;
  padding-left: 5px;
  text-decoration: none;
}

.body {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  background-color: #222;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  padding-bottom: 24px;
  padding-left: 20px;
  padding-right: 20px;
  font-family: Braah One, sans-serif;
  display: flex;
}

.image-2 {
  max-width: 30%;
}

.link-2 {
  color: #fff;
  padding-right: 4px;
  text-decoration: none;
}

.text-block-2 {
  opacity: .42;
  color: #fff;
  font-family: Braah One, sans-serif;
  position: absolute;
  inset: auto auto 0% 0%;
}

.rich-text-block {
  color: #fff;
  max-width: 960px;
}

.link-3, .link-4, .link-5 {
  color: #fff;
}

.link-6 {
  color: #333;
}

.link-6.w--current {
  color: #fff;
  text-decoration: underline;
}

.image-3 {
  filter: drop-shadow(0 5px 5px #000000b3);
  pointer-events: auto;
  object-fit: cover;
  width: 200px;
  max-width: 450px;
  height: 500px;
  position: absolute;
  inset: auto 3% 0% auto;
  transform: rotate(3deg);
}

@media screen and (max-width: 767px) {
  .container-boutons-plateforme {
    z-index: 1;
    position: relative;
  }

  .image {
    width: 70%;
  }

  .image-3 {
    z-index: 0;
    max-width: 400px;
    bottom: -1%;
    right: -24%;
    transform: rotate(4deg);
  }
}

@media screen and (max-width: 479px) {
  .hero {
    background-image: linear-gradient(#000000b3, #000000b3), url('../images/landscape-kaz-kreol.webp');
    background-position: 0 0, 35% 10%;
    background-repeat: repeat, repeat;
    background-size: auto, 350dvw;
    justify-content: center;
    align-items: center;
    max-width: 100vw;
    padding-left: 24px;
    padding-right: 24px;
  }

  .container-boutons-plateforme {
    min-width: 0;
    max-width: 100vw;
  }

  .image {
    z-index: 1;
    width: 90%;
    position: relative;
  }

  .text-block {
    flex-flow: column;
  }

  .image-3 {
    max-width: 200px;
    inset: 34% -11% 0% auto;
  }

  .body-2 {
    overflow-x: hidden;
  }
}