.contacts__section {
  gap: 48px;
  padding-block: 64px;
}

.contacts__content {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}

.contacts__cards--wrapper,
.contacts__form--wrapper {
  flex: 1 1 100%;
  max-width: 620px;
  margin-inline: auto;
}

.contacts__head--wrapper {
  max-width: 608px;
}

.contacts__head--title {
  font-size: var(--title-l);
  margin-bottom: 16px;
}
.contacts__head--text {
  font-size: var(--text-sm);
}

.contacts__form--wrapper {
  background: var(--grey-background);
  border: 2px solid var(--grey-border-secondary);
  min-width: 300px;
  min-height: 300px;
  padding: 16px;
}

/* CONTACT CARDS */

.contacts__cards--wrapper {
  gap: 16px;
}

.contact__card,
.contact__address-card--container {
  background: var(--grey-background);
  border: 2px solid var(--grey-border-secondary);
  padding: 16px;
  gap: 8px;
  align-items: start;
  width: 100%;
  flex: 1 1 auto;
  border-radius: 24px;
}

.cc--fp {
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 0 16px;
}

.cc--sp {
  justify-content: space-between;
  gap: 8px;
}

.cc--languages {
  order: 2;
}

.cc--position {
  order: 3;
  flex: 1 0 auto;
}

.cc--email-link {
  padding: 10px;
}
.cc--email-link .btn__label {
  display: none;
}

/* ADDRESS CARD */

.cac--title {
  color: var(--red-primary);
}

.cac--map-link {
  flex-grow: 1;
  width: 100%;
}

@media (width >= 678px) {
  .contacts__section {
    padding-block: 80px;
  }
  .contacts__content {
    gap: 16px;
  }

  .contact__card,
  .contact__address-card--container {
    padding: 24px;
  }

  /* CONTACT CARDS */
  .contact__card {
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
  }
  .cc--fp {
    flex-direction: column;
    align-items: flex-start;
  }
  .cc--sp {
    flex-direction: column;
    align-items: flex-end;
  }

  .cc--email-link .btn__label {
    display: inline;
  }

  .cc--languages {
    order: 3;
  }

  .cc--position {
    order: 2;
    margin-bottom: 12px;
  }

  .contact__address-card--container {
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
  }
  .cac--content {
    flex: 0 1 40%;
  }
  .cac--button {
    flex: 0 0 auto;
    width: auto;
  }

  /* ADDRESS CARD */


  .contacts__form--wrapper{
    padding: 24px;
  }
}

@media (width >= 1084px) {
}

@media (width >= 1248px) {
  .contacts__content {
    width: 100%;
    gap: 32px;
  }

  .contacts__cards--wrapper {
    flex: 1 1 48%;
    justify-content: flex-start;
  }

  .contacts__form--wrapper {
    flex: 1 1 48%;
  }

  .contact__card,
  .contact__address-card--container {
    padding: 32px 16px;
    max-width: 606px;
    max-height: 166px;
  }

  .cac--content {
    flex: 0 1 50%;
  }
}

@media (width >= 1440px) {
  .contacts__section {
    padding-block: 120px;
  }
}


