@charset 'utf-8';

.contact.sec-bg {
  position: relative;
}

.contact form {
  max-width: 51.875rem;
  margin: auto;
  position: relative;
  z-index: 1;
}

.message-label {
  align-self: flex-start;
}

label > br {
  display: none;
}

textarea {
  resize: none;
}

form p {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 1.125rem;
  font-weight: 600;
  font-family: var(--font-primary);
}

form p+p {
  margin-top: var(--space-30);
}

.wpcf7-form-control-wrap input, .wpcf7-form-control-wrap textarea {
  width: 37.5rem;
  padding: var(--space-15) var(--space-10);
  font-size: 1rem;
  font-family: var(--font-secondary);
  border: 1px solid var(--clr-neutral-100);
  transition: border-color .3s;
  border-radius: .625rem;
}

.wpcf7-form-control.invalid {
  border-color: #ff0000;
}

.error, .wpcf7-not-valid-tip {
  color: #ff0000;
  font-weight: 700;
  font-size: .875rem;
  margin-top: var(--space-5);
}

input::placeholder, textarea::placeholder {
  color: #D0D0D0;
}

:focus-visible {
  border: none;
  outline: none;
}

.required::after {
  content: '*';
  color: #ff0000;
  margin-left: 5px;
}

.wpcf7-submit {
  margin: auto;
  cursor: pointer;
  border: 2px solid var(--clr-primary);
  font-size: 1rem;
  color: var(--clr-neutral-100);
}

p > .btn-contact.btn-trigger {
  margin: auto;
}

.wpcf7-spinner {
  position: absolute;
}

.circle-canvas.right {
  top: 10%;
  right: -8%;
}

.wpcf7-form-control-wrap input:focus, .wpcf7-form-control-wrap textarea:focus {
  border: 1px solid var(--clr-primary);
}

.wpcf7-form-control-wrap input:hover,
.wpcf7-form-control-wrap textarea:hover {
  border: 1px solid var(--clr-primary);
}

.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
  border-color: #ff0000;
  border-radius: 10px;
}

.marquee-wrap {
  display: none;
}

@media (hover: hover) {
  .btn-contact:hover {
    color: var(--clr-neutral-900);
    border: 2px solid var(--clr-primary);
  }
}

.grecaptcha-badge {
  visibility: visible;
}

@media(max-width: 48em) {
  form {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .circle-canvas.right {
    top: 5%;
    right: -30%;
  }

  form p {
    flex-direction: column;
    align-items: flex-start;
    display: inline-block;
    max-width: 100%;
  }

  .wpcf7-form-control-wrap input, .wpcf7-form-control-wrap textarea {
    max-width: 100%;
  }

  form p+p {
    margin-top: var(--space-10);
  }

  form p:last-of-type {
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .wpcf7-spinner {
    position: absolute;
    left: 11%;
  }

  .error, .wpcf7-not-valid-tip {
    font-size: .75rem;
  }
}