/* WPCF7 Global Styles */

.wpcf7-form .wpcf7-form-group {
  width: 100%;
}

.wpcf7-form .wpcf7-submit {
  padding: 0 !important;
  font-size: var(--base-font-size) !important;
}

.wpcf7-form .wpcf7-spinner {
  width: 14px;
  height: 14px;
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  transform: translate(-50%, -50%);
}

.wpcf7-form .wpcf7-not-valid-tip {
  font-size: var(--md-font-size);
  text-align: start;
  margin-top: 10px;
}

.wpcf7 form .wpcf7-response-output {
  margin: 30px 0 0;
  border: 0;
  padding: 5px 0;
  text-align: center;
  color: #dc3232;
  background-color: #ffcdd2;
}

/* Get In Touch Form */

.wpcf7-get-in-touch .form-wrapper {
  display: flex;
  gap: 20px;
}

.wpcf7-get-in-touch .wpcf7-form-group {
  flex: 1;
}

.wpcf7-get-in-touch .wpcf7-email {
  border: 0;
  padding: 0 0 2px 0;
  outline: 0;
  color: var(--dark);
  font-size: var(--base-font-size);
  line-height: 1.5;
  background-color: transparent;
  border-bottom: 0.5px solid;
  text-transform: uppercase;
}

.wpcf7-get-in-touch .wpcf7-email::placeholder {
  color: var(--dark);
  opacity: 1;
}

.wpcf7-get-in-touch .wpcf7-submit-wrap {
  max-height: 28px;
}

/* Contact Form */

.wpcf7-contact-form {
  text-align: center;
}

.wpcf7-contact-form .wpcf7-form-control {
  font-size: var(--md-font-size);
  line-height: 1.25;
  border: 0.5px solid;
  border-radius: 4px;
  text-align: center;
  padding: 10px 50px;
}

.wpcf7-contact-form .name-wrapper,
.wpcf7-contact-form .number-email-wrapper {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
}

.wpcf7-contact-form .name-wrapper,
.wpcf7-contact-form .number-email-wrapper,
.wpcf7-contact-form .address {
  margin-bottom: 20px;
}

.wpcf7-contact-form .message {
  margin-bottom: 30px;
}

.wpcf7-contact-form .wpcf7-submit {
  font-size: var(--md-font-size) !important;
  line-height: 1.3;
}

@media screen and (min-width: 768px) {
  .wpcf7-contact-form .name-wrapper,
  .wpcf7-contact-form .number-email-wrapper {
    gap: 20px;
  }
}

@media screen and (min-width: 1200px) {
  .wpcf7-contact-form .name-wrapper,
  .wpcf7-contact-form .number-email-wrapper {
    gap: 30px;
  }
}