.contact-section {
  > .container {
    padding-top: 3rem;
    padding-bottom: 3rem;
    @media (width >= 768px) {
      padding-top: 6rem;
      padding-bottom: 6rem;
    }
  }
}

.bg-image {
  position: relative;
  overflow: hidden;
  aspect-ratio: 21/9;
  
  img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
  }
  
  @media (width >= 768px) {
    aspect-ratio: initial;
    min-height: 32rem;
  }
}

.wpforms-container.contact-form {
  .wpforms-form {
    .wpforms-field-container {
      .wpforms-field {
        padding: 0;
        margin-bottom: 1rem;
        .wpforms-field-label {
          font-size: var(--text-sm);
          font-weight: 400;
          color: var(--color-gray-1);
          margin-bottom: .5em;
        }
        input,
        textarea {
          outline: none;
          font-size: var(--text-base);
          border: 1px solid #eee;
          background-color: #f5f5f5;
          border-radius: .5rem;
          padding: .5rem 1rem;
          transition: all .3s;
          
          &:hover,
          &:focus-visible {
            border-color: var(--color-gray-1);
          }
        }
		  
		  textarea {
			  padding: 1rem;
			  height: auto !important;
			  min-height: 130px !important;
		  }

        em.wpforms-error {
          font-size: var(--text-sm);
          padding: .25em 0;
        }
      }
    }
    .wpforms-submit-container {
      button {
        width: 100%;
        font-size: var(--text-sm);
        color: var(--color-white);
        border: 1px solid #333;
        background-color: #333;
        border-radius: .75rem;
        padding: .75rem 1rem;
        transition: all .3s;
        
        &:hover,
        &:focus-visible {
          border-color: var(--color-black-1);
          background-color: var(--color-black-1);
        }
      }
    }
  }
}