.w-contact-form, .w-request-quote-form {
  & .modal-header {
    border: 0;
  }

  & .modal-body {
    padding-top: 0;
    padding-right: 50px;
    padding-bottom: 50px;
    padding-left: 50px;
  }

  & .modal-footer {
    justify-content: center;
    border: 0;
    margin-top: -40px;
    padding-bottom: 50px;
  }

  & .modal-title {
    margin-bottom: 50px;
    text-align: center;
  }
}

.contact-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0 20px;

  & .modal-title {
    margin-bottom: 50px;
  }
}

& form {
  display: flex;
  flex-direction: column;
  max-width: 500px;

  & fieldset {
    & label[placeholder] {
      display: none;
    }

    /* & label span:empty {
      display: none;
    } */

    & .field {
      flex-grow: 1;
      /* margin-bottom: 16px; */

      & .input {
        input,
        & textarea {
          width: 100% !important;
          padding: 9px 15px;
          border-radius: 12px;
          background: var(--2, #f5f6fa);
          border: 0;
          /* color: var(--4, #bbc0d5); */
          font-family:
            "Greycliff CF", ui-sans-serif, system-ui, sans-serif,
            "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol",
            "Noto Color Emoji";
          font-size: 16px;
          font-style: normal;
          font-weight: normal;
          line-height: 20px; /* 111.111% */

          &::placeholder {
            color: var(--4, #bbc0d5);
          }
        }

        & input {
          & &.error {
            border: 1px solid red;
          }
        }

        & textarea {
          resize: none;
        }

        & input[type="checkbox"] {
          /* margin-top: 16px; */
          -webkit-appearance: none;
          -moz-appearance: none;
          appearance: none;
          width: 18px !important;
          height: 18px !important;
          border: 1px solid #B2B8CD;
          border-radius: 4px;
          background-color: #fff;
          cursor: pointer;
          padding: 0;
          font-size: 14px;
          line-height: 1;
          text-align: center;
        }

        & input[type="checkbox"]:checked {
          background-color: #F5671F;
          border-color: #F5671F;
        }

        & input[type="checkbox"]::before {
          content: '\2713'; /* Unicode checkmark character */
          text-align: center;
          color: #fff;
          opacity: 0;
          display: inline;
          line-height: 1;
        }

        & input[type="checkbox"]:checked::before {
          opacity: 1;
        }

        & .inputs-list {
          display: flex;
          list-style: none;
          padding: 0;

          & li {
            flex-grow: 1;
            text-align: center;

            & input {
              margin-right: 6px;
            }
          }
        }

        select {
          background: var(--2, #f5f6fa);
          border: 0;
          border-radius: 12px;
          font-family:
            Greycliff CF,
            ui-sans-serif,
            system-ui,
            sans-serif,
            Apple Color Emoji,
            Segoe UI Emoji,
            Segoe UI Symbol,
            Noto Color Emoji;
          font-size: 16px;
          font-style: normal;
          font-weight: 400;
          line-height: 20px;
          padding: 9px 15px;
          width: 100% !important;
          color: var(--4, #bbc0d5);
          appearance: none;
          background-image: url(data:image/svg+xml,%3Csvg%20width%3D%2214%22%20height%3D%228%22%20viewBox%3D%220%200%2014%208%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M13%201.00005C13%201.00005%208.58107%206.99999%206.99995%207C5.41884%207.00001%201%201%201%201%22%20stroke%3D%22%236B7185%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E);
          background-repeat: no-repeat;
          background-position: right 10px center;
        }
      }
    }

    legend {
      font-size: 1rem;
    }

    .hs-dateinput:before {
      right: 15px;
    }
}

& .hs_error_rollup {
  display: none !important;
}

& .hs-error-msgs {
  list-style-type: none;
  padding: 5px;
  margin-bottom: 0;

  & li {
    font-size: 0.75rem;
    color: #ff0000;
  }
}

& .hs-dependent-field {
  margin-top: 16px;
  margin-bottom: 16px;
}

& .actions {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 16px;
}

@media (max-width: 400px),
  (min-device-width: 320px) and (max-device-width: 480px) {
  .w-contact-form {
    top: 80px;
  }
  & .form-columns-2 {
    & .input {
      margin-right: 0 !important;
    }
  }
}