.contact {
  background-image: url(../../img/background/backgroundVigne.svg);
  background-size: 200%;
  background-repeat: no-repeat;
  padding-block: 9.5vw 15vw;
}
.contact__title {
  font-size: 1.5625rem;
  font-family: var(--ffMXBoIt);
  line-height: 1.875rem;
  text-align: center;
  text-transform: uppercase;
}
.contact__introduction {
  font-size: var(--fsCorps);
  font-family: var(--ffMMe);
  line-height: 1.5625rem;
  text-transform: uppercase;
}
.contact__point {
  font-size: var(--fsOther);
  font-family: var(--ffMXBoIt);
  line-height: var(--fsSubtitle);
  text-transform: uppercase;
}
.contact__description {
  font-size: var(--fsCorpsLess);
  font-family: var(--ffMMe);
  line-height: var(--fsOther);
}
.contact__content {
  display: flex;
  flex-direction: column;
  gap: 4.5vw;
  padding-bottom: 5vw;
}
.contact__item {
  display: flex;
  flex-direction: column;
  gap: 2vw;
}
.contact__list {
  display: flex;
  flex-direction: column;
  gap: 3vw;
}
.contact__illustration {
  min-height: 60vw;
}
.contact__form {
  border: 0.25rem solid var(--sColor);
  display: flex;
  flex-direction: column;
  gap: 5vw;
  padding: 6.5vw 2.5vw 2.5vw 2.5vw;
}
.contact__content > .contact__title {
  text-align: start;
}
aside:has(.contact__form--shop) {
  background-color: var(--grey);
  padding-bottom: 19vw;
}
@media (min-width: 767.98px) {
  .contact__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5vw;
  }
  .contact__item {
    gap: 1vw;
  }
  .contact__introduction {
    width: 65%;
  }
  .contact__content {
    gap: 3.5vw;
  }
  .contact__form {
    gap: 3.5vw;
    padding: 5vw;
  }
}

@media (min-width: 991.98px) {
  .contact {
    display: flex;
    gap: 3.5vw;
    padding-bottom: 10.5vw;
  }
  .contact__content {
    width: 55vw;
  }
  .contact__introduction {
    margin-top: -2vw;
    width: 90%;
  }
  .contact__list {
    gap: 2.5vw 1.5vw;
  }
  .contact__form {
    gap: 2.5vw;
    height: fit-content;
    padding: 3.5vw 2vw 2vw 2vw;
  }
  .contact__illustration {
    min-height: unset;
  }
  .contact__content {
    padding-bottom: 0;
  }
  .contact__title {
    font-size: 2.1875rem;
    line-height: 2.625rem;
  }
  aside:has(.contact__form--shop) {
    padding-bottom: 8vw;
  }
}

@media (min-width: 1199.98px) {
  .contact {
    padding-block: 5vw 10vw;
  }
  .contact__content {
    width: 40vw;
  }
  .contact__form--shop {
    margin-inline: 10vw;
  }
}

@media (min-width: 1399.98px) {
  .contact__content {
    gap: 2vw;
  }
  .contact__introduction {
    margin-top: 0vw;
  }
  .contact__form {
    padding: 2vw;
  }
  .contact__list {
    gap: 1.5vw;
  }
  .contact__form {
    border: 0.625rem solid var(--sColor);
  }
  .contact__form--shop {
      margin-inline: 15vw;
  }
}

@media (min-width: 1599.98px) {
  .contact {
    padding-bottom: 8.5vw;
  }
  .contact__form--shop {
    margin-inline: 20vw;
  }
}

@media (min-width: 1799.98px) {
  .contact {
    gap: 5vw;
  }
  .contact__introduction {
    width: 55%;
  }
  .contact__content {
    gap: 2vw;
    width: 32.5vw;
  }
  .contact__form {
    width: 42vw;
  }
}

@media (min-width: 1919.98px) {
  .contact__introduction {
    width: 75%;
  }
  .contact__form {
    gap: 2vw;
    width: 32vw;
  }
  .contact__form--shop {
    max-width: 660px;
  }
}
