.contact-form {
  background-color: #f4f2ff;
  &.dark {
    background-color: #191325;
  }
}
.contact-form.no-anim,
.contact-form.no-anim * {
  animation: none !important;
  transition: none !important;
}

.app-container .contact-form__form .wpcf7-form label input,
.app-container .contact-form__form .wpcf7-form label select,
.app-container .contact-form__form .wpcf7-form label textarea,
.app-container .contact-form__form .wpcf7-form .wpcf7-submit {
  transition: border-color .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.app-container .contact-form__container {
  display: flex;
  padding: 120px 100px;
  z-index: 1;
  max-width: 1192px;
  margin: 0 auto;
  position: relative;
  align-items: flex-start;
  justify-content: center;
  z-index: 3;
  gap: 64px;
}
@media (max-width: 1400px) {
  .app-container .contact-form__container {
    padding: 120px 50px;
  }
}
@media (max-width: 1000px) {
  .app-container .contact-form__container {
    padding: 64px 16px;
    gap: 48px;
  }
}
@media (max-width: 768px) {
  .app-container .contact-form__container {
    flex-direction: column;
  }
}
.app-container .contact-form__wrapper {
  width: 100%;
  background-color: #ffffff;
  padding: 48px;
  border-radius: 8px;
  @media (max-width: 768px) {
    padding: 48px 32px;
  }
  p.title {
    color: #191325;
    font-size: 23px;
    font-weight: 600;
    line-height: 1.2;
    font-family: var(--mainfont);
    margin-bottom: 32px;
    @media (max-width: 1000px) {
      font-size: 19px;
    }
  }
}
.app-container .contact-form__wrapper.nowindow {
  width: 584px;
}
.contact-form__images {
  display: flex;
  gap: 16px;
  margin-top: 32px;
  img {
    width: calc(50% - 8px);
    object-fit: contain;
    &.one {
      width: 100%;
      max-width: 248px;
    }
  }
}
.app-container .contact-form__add {
  width: 100%;
  margin-top: 32px;
  padding-top: 32px;
  border-top: 1px solid #dedce9;
  &.dark {
    border-top: 1px solid #4f4f4f;
  }
}
.app-container .contact-form__add p {
  margin-bottom: 8px;
  font-size: 16px;
}
.app-container .contact-form__window {
  width: 378px;
  min-width: 378px;
  &.dark {
    a.button-arrow {
      color: white;
      svg {
        path {
          fill: white;
        }
      }
    }
  }
  p.title {
    font-size: 19px;
    font-weight: 600;
    color: #191325;
    margin-top: 32px;
  }
  &.dark {
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p.title {
      color: white !important;
      margin-bottom: 16px;
    }
    p,
    ul li {
      color: #ffffffbf !important;
      margin-bottom: 0;
    }
  }
}

@media (max-width: 1000px) {
  .app-container .contact-form__window {
    width: 300px;
    min-width: 300px;
  }
}
@media (max-width: 768px) {
  .app-container .contact-form__window {
    width: 100%;
  }
}
.app-container .contact-form__window a {
  color: #191325;
  text-decoration: none;
}
.app-container .contact-form__window a:hover {
  text-decoration: underline;
}
.app-container .contact-form__window .line-small {
  display: flex;
  background-color: #dc875b;
  height: 2px;
  width: 64px;
  margin: 24px 0;
}
.app-container .contact-form__window a.map {
  display: flex;
  align-items: center;
  gap: 6px;
}
.app-container .contact-form__form .wpcf7-form {
  display: flex;
  flex-wrap: wrap;
  width: 102%;
}
.app-container .contact-form__form .wpcf7-form h4 {
  width: 100%;
  margin-bottom: 32px;
}
@media (max-width: 1000px) {
  .app-container .contact-form__form .wpcf7-form h4 {
    margin-bottom: 24px;
  }
}
.app-container .contact-form__form .wpcf7-form .line-form {
  height: 2px;
  width: 100%;
  background: #e4dbd5;
  margin-top: 16px;
  margin-bottom: 48px;
}
.app-container .contact-form__form .wpcf7-form a.rodo {
  margin-top: 28px;
  text-decoration: none;
  color: #181b1f;
  font-weight: 600;
  width: 100%;
}
@media (max-width: 1000px) {
  .app-container .contact-form__form .wpcf7-form a.rodo {
    font-size: 13px;
  }
}
.app-container .contact-form__form .wpcf7-form a.rodo:hover {
  text-decoration: underline;
}
.app-container .contact-form__form .wpcf7-form::after {
  content: "";
  border: 6px solid #e9e9e9;
  border-top: 6px solid var(--secondarycolor);
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 2s linear infinite;
  position: absolute;
  left: calc(50% - 30px);
  top: calc(50% - 30px);
  transform: translate(-50%, -50%);
  z-index: 5;
  opacity: 0;
  visibility: hidden;
}
.app-container .contact-form__form .wpcf7-form::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(244, 242, 255, 0.494);
  z-index: 4;
  opacity: 0;
  visibility: hidden;
}
@keyframes spin {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
.app-container .contact-form__form .wpcf7-form.submitting::after,
.app-container .contact-form__form .wpcf7-form.submitting::before {
  opacity: 1;
  visibility: visible;
}
.app-container .contact-form__form .wpcf7-form label {
  width: 100%;
  display: flex;
  flex-direction: column;
  color: #191325;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  margin-bottom: 32px;
  margin-right: 2%;
  justify-content: flex-end;
}

.wpcf7-form-control-wrap {
  margin-top: 8px;
  .codedropz-upload-handler {
    border: 1px dashed rgba(25, 19, 37, 0.1);
    border-radius: 2px;
  }
  .dnd-upload-status .dnd-upload-details .name {
    color: #191325;
    padding: 4px 0;
    padding-right: 60px;
    display: flex;
    font-size: 12px;
    em {
      color: #191325;

      font-weight: 400;
      font-family: var(--mainfont);
      font-style: normal;
    }
  }
  .dnd-upload-status .dnd-upload-details span.has-error {
    color: #f50505;
    font-size: 10px;
    font-weight: 400;
    margin-top: 3px;
    display: flex;
  }
  .dnd-upload-status .dnd-upload-details .dnd-progress-bar span {
    padding-right: 6px;
  }
  .dnd-upload-counter {
    display: none;
  }
  .codedropz-upload-inner {
    display: flex;
    flex-direction: column;
    gap: 5px;
    span {
      font-family: var(--mainfont);
      font-style: normal;
      font-weight: 300;
      font-size: 16px;
      line-height: 1.5;
      margin-bottom: 0;
      color: #39282ebf;

      @media (max-width: 1000px) {
        font-size: 14px;
      }
      &:nth-child(2) {
        font-size: 11px;
        font-weight: 300;
      }
    }
    .codedropz-btn-wrap {
      display: flex;
      justify-content: center;
      a {
        background-color: transparent;
        color: #191325;
        border: none;
        cursor: pointer;
        border-radius: 360px;
        font-size: 13px;
        align-items: center;
        font-weight: 600;
        text-decoration: none;
        justify-content: center;
        padding: 8px 14px;
    
        display: flex;
        width: fit-content;
        border: 1px solid #1913251a;
        svg {
          margin-left: 12px;
       
        }
        &:hover {
          background-color: rgba(25, 19, 37, 0.05);
          border: 1px solid transparent;
        }
      }
    }
  }
}
@media (max-width: 768px) {
  .app-container .contact-form__form .wpcf7-form label {
    font-size: 14px;
  }
}
.app-container .contact-form__form .wpcf7-form label .add {
  color: rgba(54, 34, 29, 0.532);
  font-weight: 400;
  font-size: 11px;
  display: flex;
  margin-top: 3px;
}
.app-container .contact-form__form .wpcf7-form label span.more-content {
  display: none;
}
.app-container .contact-form__form .wpcf7-form label input {
  margin-top: 8px;
  width: 100%;
  color: #191325;
  font-family: var(--mainfont);
  font-size: 16px;
  font-style: normal;
  font-weight: 300;
  line-height: 24px;
  padding: 11px 14px;
  border: 1px solid rgba(25, 19, 37, 0.1);
  background: 0 0;
  border-radius: 2px;
  outline: 0;
}
.app-container .contact-form__form .wpcf7-form label input::placeholder {
  color: #191325;
  opacity: 0.5;
}
.app-container .contact-form__form .wpcf7-form label input:focus {
  border: 1px solid var(--secondarycolor);
}
@media (max-width: 1000px) {
  .app-container .contact-form__form .wpcf7-form label input {
    font-size: 15px;
  }
}
.app-container .contact-form__form .wpcf7-form label input.wpcf7-not-valid {
  border: 0;
  border: 1px solid #dc3232;
}
.app-container .contact-form__form .wpcf7-form label select {
  margin-top: 6px;
  width: 100%;
  color: rgba(54, 34, 29, 0.517);
  font-family: var(--mainfont);
  font-size: 16px;
  font-style: normal;
  font-weight: 300;
  line-height: 24px;
  padding: 11px 14px;
  border: 1px solid rgba(56, 54, 18, 0.2);
  outline: 0;
  background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.59 0.295L6 4.875L1.41 0.295L0 1.705L6 7.705L12 1.705L10.59 0.295Z' fill='%23191325' fill-opacity='0.2'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position-x: 93%;
  background-position-y: 20px;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 20px;
}
.app-container .contact-form__form .wpcf7-form label select::-ms-expand {
  display: none;
}
.app-container .contact-form__form .wpcf7-form label select:focus {
  border: 1px solid var(--secondarycolor);
}
@media (max-width: 1000px) {
  .app-container .contact-form__form .wpcf7-form label select {
    font-size: 15px;
  }
}
.app-container .contact-form__form .wpcf7-form label select.wpcf7-not-valid {
  border: 0;
  border: 1px solid #dc3232;
}
.app-container .contact-form__form .wpcf7-form label textarea {
  margin-top: 8px;
  width: 100%;
  font-family: var(--mainfont);
  font-size: 16px;
  font-style: normal;
  font-weight: 300;
  line-height: 24px;
  padding: 11px 14px;
  border: 0;
  font-weight: 300;
  color: #191325;
  border: 1px solid rgba(56, 54, 18, 0.2);
  border-radius: 2px;
  background-color: transparent;
  height: 100px;
  max-width: 100%;
  outline: 0;
  outline: 0;
  font-weight: 300;
}
.app-container .contact-form__form .wpcf7-form label textarea::placeholder {
  color: #191325;
  opacity: 0.5;
}
.app-container .contact-form__form .wpcf7-form label textarea:focus {
  border: 1px solid var(--secondarycolor);
}
.app-container .contact-form__form .wpcf7-form label.half {
  width: 48%;
  margin-right: 2%;
}
.app-container .contact-form__form .wpcf7-form label.half-more {
  width: 54%;
  margin-right: 2%;
  @media (max-width: 550px) {
    width: 100%;
  }
}
.app-container .contact-form__form .wpcf7-form label.half.next {
  width: 49%;
  padding-right: 1%;
}
@media (max-width: 550px) {
  .app-container .contact-form__form .wpcf7-form label.half {
    width: 100%;
  }
}
.app-container .contact-form__form .wpcf7-form label.half.nextline {
  margin-right: 50%;
}
.app-container .contact-form__form .wpcf7-form label.half-full {
  width: 64.6%;
  margin-right: 2%;
}
@media (max-width: 550px) {
  .app-container .contact-form__form .wpcf7-form label.half-full {
    width: 100%;
  }
}
.app-container .contact-form__form .wpcf7-form label.quarter {
  width: 21.6%;
  margin-right: 2%;
}
@media (max-width: 550px) {
  .app-container .contact-form__form .wpcf7-form label.quarter {
    width: 100%;
  }
}
@media (max-width: 550px) {
  .app-container .contact-form__form .wpcf7-form label.quarter {
    width: 31.33%;
  }
}
.app-container .contact-form__form .wpcf7-form label.quarter.nextline {
  margin-right: 65%;
}
.app-container .contact-form__form .wpcf7-form label.quarter-half {
  width: 31.33%;
  margin-right: 2%;
}
@media (max-width: 550px) {
  .app-container .contact-form__form .wpcf7-form label.quarter-half {
    width: 100%;
  }
}
.app-container .contact-form__form .wpcf7-form label.quarter-big {
  width: 41.33%;
  margin-right: 2%;
}
@media (max-width: 550px) {
  .app-container .contact-form__form .wpcf7-form label.quarter-big {
    width: 100%;
  }
}
.app-container .contact-form__form .wpcf7-form .wpcf7-not-valid-tip {
  font-size: 10px;
  font-weight: 300;
  margin-top: 2px;
  position: absolute;
}
.app-container .contact-form__form .wpcf7-form .wpcf7-list-item {
  margin: 0;
}
.app-container .contact-form__form .wpcf7-form .wpcf7-list-item label {
  display: flex;
  flex-direction: row;
}
.app-container .contact-form__form .wpcf7-form .wpcf7-list-item-label {
  color: rgba(54, 34, 29, 0.752);
  font-size: 13px;
  font-style: normal;
  font-family: var(--mainfont);
  font-weight: 400;
  line-height: 1.4;
  opacity: 0.75;
  position: relative;
  top: -1px;
}
.app-container .contact-form__form .wpcf7-form .wpcf7-submit {
  position: relative;
  font-family: var(--mainfont);
  text-decoration: none;
  background-color: var(--secondarycolor);
  color: #fff;
  cursor: pointer;
  padding: 12px 24px;
  margin-top: 24px;
  border-radius: 2px;
  display: flex;
  align-items: center;
  width: fit-content;
  border-radius: 360px;
  text-decoration: none;
  font-size: 16px;
  line-height: 24px;
  text-align: left;
  border: 0;
  font-weight: 600;
}
.app-container .contact-form__form .wpcf7-form .wpcf7-submit:hover {
  background-color: #5018bf;
}
@media (max-width: 1000px) {
  .app-container .contact-form__form .wpcf7-form .wpcf7-submit {
    font-size: 15px;
    padding: 12px 16px;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (max-width: 500px) {
  .app-container .contact-form__form .wpcf7-form .wpcf7-submit {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
}
.app-container .contact-form__form .wpcf7-form .wpcf7-submit svg {
  margin-left: 8px;
}
.app-container .contact-form__form .wpcf7-form .wpcf7-spinner {
  display: none;
}
.app-container .contact-form__form .wpcf7-radio input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 20px;
  height: 20px;
  margin: 0;
}
.app-container .contact-form__form .wpcf7-radio {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 8px;
}
.app-container
  .contact-form__form
  .wpcf7-radio.wpcf7-not-valid
  .wpcf7-list-item
  label {
  border: 1px solid #dc3232;
}
.app-container .contact-form__form .wpcf7-radio .wpcf7-list-item {
  display: flex;
  margin-right: 16px;
  margin-bottom: 8px;
  min-width: 164px;
}
.app-container .contact-form__form .wpcf7-radio .wpcf7-list-item label {
  position: relative;
  cursor: pointer;
  color: #626262;
  margin-bottom: 0;
  border: 1px solid rgba(54, 34, 29, 0.206);
  border-radius: 2px;
  padding: 12px;
  font-size: 13px;
  gap: 10px;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
.app-container
  .contact-form__form
  .wpcf7-radio
  .wpcf7-list-item
  .wpcf7-list-item-label {
  top: 0;
  margin-top: auto;
  margin-bottom: auto;
  font-size: 16px;
  color: #191325;
}
@media (max-width: 768px) {
  .app-container
    .contact-form__form
    .wpcf7-radio
    .wpcf7-list-item
    .wpcf7-list-item-label {
    font-size: 13px;
  }
}
.app-container .contact-form__form .wpcf7-radio .wpcf7-list-item label::before {
  content: "";
  left: 0;
  top: 0;
  width: 20px;
  min-width: 20px;
  display: block;
  height: 20px;
  border: 2px solid rgba(54, 34, 29, 0.202);
  border-radius: 50%;
  background-color: transparent;
}
.app-container .contact-form__form .wpcf7-radio label.checked:after {
  content: "";
  position: absolute;
  top: 18px;
  left: 18px;
  width: 12px;
  height: 12px;
  background-color: #511164;
  opacity: 1;
  border-radius: 50%;
}
.app-container .contact-form__form .wpcf7-checkbox input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 20px;
  height: 20px;
  margin: 0;
}
.app-container .contact-form__form .wpcf7-checkbox {
  min-height: 26px;
  display: flex;
  margin-top: 8px;
  width: 100%;
  flex-wrap: wrap;
}
.app-container
  .contact-form__form
  .wpcf7-checkbox.terms
  .wpcf7-list-item
  label {
  padding: 0;
  border-radius: 0;
  border: 0 !important;
  align-items: flex-start;
}
.app-container
  .contact-form__form
  .wpcf7-checkbox.terms
  .wpcf7-list-item
  .wpcf7-list-item-label {
  font-size: 13px;
  font-weight: 400;
}
.app-container
  .contact-form__form
  .wpcf7-checkbox.terms
  .wpcf7-list-item
  label::before {
  min-width: 18px;
  border: 2px solid #d1d0d3;
}
.app-container
  .contact-form__form
  .wpcf7-checkbox.terms
  .wpcf7-list-item
  label.checked::before {
  border: 2px solid #534e5c;
}
.app-container
  .contact-form__form
  .wpcf7-checkbox.terms
  .wpcf7-list-item
  label.checked:after {
  top: 4px;
  left: 9.4px;
}
.app-container .contact-form__form .wpcf7-checkbox .wpcf7-list-item {
  margin-right: 16px;
  margin-bottom: 8px;
  min-width: 224px;
}
.app-container .contact-form__form .wpcf7-checkbox .wpcf7-list-item.last {
  margin-right: 0;
}
.app-container .contact-form__form .wpcf7-checkbox .wpcf7-list-item label {
  border: 1px solid rgba(54, 34, 29, 0.206);
  border-radius: 2px;
  padding: 12px;
}
.app-container
  .contact-form__form
  .wpcf7-checkbox
  .wpcf7-list-item
  .wpcf7-list-item-label {
  top: 0;
  font-size: 16px;
  color: #191325;
  margin-top: auto;
  margin-bottom: auto;
  font-weight: 300;
}
@media (max-width: 768px) {
  .app-container
    .contact-form__form
    .wpcf7-checkbox
    .wpcf7-list-item
    .wpcf7-list-item-label {
    font-size: 13px;
  }
}
.app-container
  .contact-form__form
  .wpcf7-checkbox.wpcf7-not-valid
  .wpcf7-list-item
  label {
  border: 1px solid #dc3232;
}
.app-container .contact-form__form .wpcf7-checkbox .wpcf7-list-item label {
  position: relative;
  cursor: pointer;
  color: #191325;
  font-size: 16px;
  line-height: 1.2;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
}
.app-container
  .contact-form__form
  .wpcf7-checkbox
  .wpcf7-list-item
  label::before {
  content: "";
  left: 0;
  top: 0;
  width: 18px;
  height: 18px;
  min-width: 18px;
  border: 2px solid rgba(54, 34, 29, 0.204);
  border-radius: 2px;
  background-color: transparent;
  display: block;
}
.app-container .contact-form__form .wpcf7-checkbox label.checked::before {
  background-color: #534e5c;
  border: 2px solid #534e5c;
}
.app-container .contact-form__form .wpcf7-checkbox label.checked:after {
  content: "";
  position: absolute;
  top: 17px;
  left: 21px;
  width: 2px;
  height: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
  opacity: 1;
}
.app-container .contact-form__form .wpcf7-response-output {
  border: 0 !important;
  text-align: center;
  width: 100%;
}

.app-container {
  .contact-form__phone {
    display: flex;
    gap: 12px 24px;
    flex-wrap: wrap;
    a {
      color: #7b4fff;
      font-weight: 600;
      font-size: 16px;
      text-decoration: none;
    }
    &.dark {
      a {
        color: #c8ff50;
      }
    }
  }
}
