input::-webkit-contacts-auto-fill-button {
  visibility: hidden;
  position: absolute;
  right: 0;
}
input:-webkit-autofill,
input:-webkit-autofill:focus {
  transition: background-color 0s 600000s, color 0s 600000s !important;
}

.hs-form-required {
  display: none;
}

.hubspot-form-container {
  display: flex;
  align-items: stretch;
  gap: 16px;
  margin-top: 16px;
  margin-right: 17px;
}

.hubspot-form-container .hs-submit {
  display: none;
}

.hubspot-form-container > div:last-child {
  flex: 1;
}

.hubspot-form {
  min-width: 60%;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  background-color: #D0ECE5;
  padding: 64px 32px;
  box-sizing: border-box;
}

.hubspot-form > div > input[type="submit"] {
  display: none;
}

.hs-form-private {
  display: flex;
  flex-direction: column;
  margin-bottom: 0px !important;
}

.hs-form-private > div > label {
  display: flex;
}

.hs-form-private > div > label > span {
  display: block;
  width: fit-content;
  margin-bottom: 10px;
  font-weight: bold;
  font-size: 15px;
  font-weight: 500;
}

.hs-lastname > label > span,
.hs-phone > label > span,
.hs-email > label > span,
.hs-website > label > span {
  margin-bottom: 0px !important;
}

.hs-phone,
.hs-email,
.hs-website {
  margin-top: 8px;
}

.hs-email legend {
  display: none;
}

.hs-website legend {
  display: none;
}

.form-columns-2 .hs-firstname {
  margin-top: 0px;
}

.hs-firstname > label {
  display: none !important;
}

.hs-form-private p > strong {
  margin: 0;
  font-weight: bold;
  letter-spacing: 0.5px;
}

.hs-main-font-element > p > span {
  font-weight: bold !important;
}

.input {
  border: 0 !important;
  padding: 0 !important;
  font-size: 15px;
  margin: 0 !important;
}

.inputs-list {position: relative; margin: 0; padding: 0; display:flex;flex-wrap:wrap; gap: 2px;}
.inputs-list li {list-style: none; display: inline-block;margin: 0;background-color: #fff;color: #161618; border: 1px solid #E3E3E3; border-radius: 4px; transition: .3s ease-in;}
.options-chooser-black li {border-color:#000;}
.inputs-list li label {display: flex; align-items: center; gap: 4px; padding: 8px 12px; font-weight: 400; opacity: 0.6; transition: .3s ease-in; box-sizing: border-box; border-radius: 4px;}
.inputs-list li label input {margin: 0; cursor: pointer;}
.inputs-list li:last-child{border-right:1px solid #E3E3E3}
.options-chooser-black li:last-child{border-right-color:#000}
.inputs-list span.error {position: absolute;top: -36px;left: 0px}
.inputs-list span.valid {display: none!important}

.inputs-list li:hover > label{
  opacity: 1;
}

.inputs-list li:hover,
.inputs-list li:focus-within {
  border-color: #1D1D1F;
}

.inputs-list li input:checked + span,
.inputs-list li input:checked + span > label {
  border-color: #1D1D1F;
  opacity: 1;
}

.inputs-list li:has(input:checked),
.inputs-list li:has(input:checked) > label {
  border-color: #1D1D1F;
  opacity: 1;
}

.ss-hs-item-selected {
  background-color: #EEECED;
}

.hubspot-form-container .form-columns-0,
.hubspot-form-container .form-columns-1,
.hubspot-form-container .form-columns-2 {
  max-width: 100%;
}

.hubspot-form-container .form-columns-0 > div:first-child,
.hubspot-form-container .form-columns-1 > div:first-child,
.hubspot-form-container .form-columns-2 > div:first-child {
  display: flex;
  flex-direction: column;
}

.hs-custom-richtext {
  margin-bottom: 8px !important;
}

.hs-custom-strong {
  font-weight: 500 !important; 
  font-size: 15px; 
}

.hs-custom-strong > a {
  text-decoration: none;
  color: #3681BA;
}

.hs-custom-p {
  font-size: 13px !important;
  line-height: 19.5px;
  letter-spacing: 0.5px;
  font-weight: 400 !important;
}

.hs-custom-p a {
  text-decoration: none;
  color: #0059C7;
}

.hs-fieldtype-textarea > label,
.hs_workload_cnct > label > span {
  display: inline-block !important;
  font-size: 18px;
  margin-top: 28px;
  margin-bottom: 16px;
  font-weight: bold;
  letter-spacing: 0.5px;
}

.hs_workload_cnct > label > span:last-child {
  display: none !important;
}

.hs-your_plan > label:first-child {
  display: block !important;
  margin-bottom: 10px;
  font-size: 15px;
  font-weight: 500;
}

.hubspot-form-container .form-columns-2 {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

.hubspot-form-container .form-columns-2 div,
.hubspot-form-container .form-columns-2 label,
.hubspot-form-container .form-columns-2 input {
  width: 100% !important;
}

fieldset.form-columns-1 .hs-input {
  width: 100% !important;
  border-radius: 4px;
}

fieldset.form-columns-1 input[type=radio] {
  width: 11px !important;
  height: 11px !important;
}

.hubspot-form-container textarea {
  border: 1px solid #E3E3E3;
  padding: 8px 12px;
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 100%;
  height: 70px;
  font-family: --var(main-font), sans-serif !important;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0.5px;
  line-height: 22.5px;
  outline-color: none !important;
  -webkit-font-smoothing: antialiased;
  transition: all .3s ease-in;
  resize: none !important;
  border-radius: 4px;
}

.hubspot-form-container textarea:hover,
.hubspot-form-container textarea:focus {
  outline: none !important;
  border-color: #1D1D1F;
}

.hubspot-form-container textarea::placeholder,
.hubspot-form-container textarea::placeholder {
  transition: all .3s ease-in;
}

.hubspot-form-container textarea:hover::placeholder {
  color: #161618;
  opacity: 1;
}

.input > input[type=text],
.input > input[type=tel],
.input > input[type=email] {
  padding: 8px 12px;
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 100%;
  border: 1px solid #E3E3E3;
  border-radius: 4px;
  font-family: var(--main-font), sans-serif !important;
  font-size: 15px;
  font-weight: 400;
  line-height: 22.5px;
  letter-spacing: 0.5px;
  outline: 0;
  -webkit-font-smoothing: antialiased;
  transition: all .3s ease-in;
}

.input > input[type=text]:hover,
.input > input[type=tel]:hover,
.input > input[type=email]:hover,
.input > input[type=text]:focus,
.input > input[type=tel]:focus,
.input > input[type=email]:focus {
  border-color: #1D1D1F;
}

.input > input[type=text]::placeholder,
.input > input[type=email]::placeholder {
  transition: all .3s ease-in;
}

.input > input[type=text]:hover::placeholder,
.input > input[type=email]:hover::placeholder {
  color: #161618;
  opacity: 1;
}

.hs-field-desc {
  font-size: 18px;
  margin-top: 28px;
  margin-bottom: 16px;
  padding: 0 !important;
  font-weight: bold;
  letter-spacing: 0.5px;
}

.hs-richtext,
.hs_workload_cnct > label > span {
  font-size: 18px;
  margin-top: 28px;
  margin-bottom: 16px;
}

.hs-richtext > p {
  margin: 0;
}

.no-list li {
  list-style: none;
  display: inline-block;
  border: 0;
  padding: 0;
  margin: 0;
  margin-right: 0;
  margin-top: 0;
  background-color: transparent;
  color: black;
  border-right: 0 !important;
}

.hs-error-msgs li label {
  color: #C43638;
  padding: 4px 0 0 0;
  box-sizing: border-box;
  opacity: 1;
  cursor: default;
}

.no-list li a {
  color: #ffffff !important;
  text-decoration: underline;
}

.hs-fieldtype-intl-phone {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 4px;
  box-sizing: border-box;
  transition: all .3s ease-in;
}

.hs-fieldtype-intl-phone input,
.hs-fieldtype-intl-phone.hs-input input {
  width: 100% !important;
  background-color: transparent;
  outline: 0;
  border: 0;
  border-radius: 4px;
  padding: 8px 12px;
  font-size: 15px;
  font-weight: 400;
  color: #1D1D1F;
  box-sizing: border-box;
  transition: all .3s ease-in;
  background-color: #ffffff !important;
  border: 1px solid #E3E3E3 !important;
}

.hs-fieldtype-intl-phone select:hover,
.hs-fieldtype-intl-phone input:hover {
  border-color: #1D1D1F !important;
  border-right-color: #1D1D1F;
}

.hs-form-field-error input[type=text], 
.hs-form-field-error input[type=tel], 
.hs-form-field-error input[type=email],
.hs-form-field-error .hs-fieldtype-intl-phone input,
.hs-form-field-error .inputs-list li,
.hs-form-field-error .hs-fieldtype-intl-phone select {
  border-color: #C43638 !important;
}

/* reset default select styles */
.hs-fieldtype-intl-phone select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  position: relative;
  background-color: #ffffff !important;
  border: 1px solid #E3E3E3 !important;
  padding: 8px 35px 8px 12px;
  border-radius: 0px !important;
  font-size: 15px;
  font-weight: 400;
  color: #1D1D1F !important;
  cursor: pointer;
  font-family: var(--main-font), sans-serif !important;
  max-width: 200px !important;
  min-width: 200px !important;
  transition: all .3s ease-in;
  outline: none;
}

.hs-fieldtype-intl-phone {
  position: relative;
  display: flex;
  align-items: stretch;
}

.hubspot-form-container textarea,
.hs-form-radio span {
  font-size: 15px;
  letter-spacing: 0.5px;
  line-height: 22.5px;
}

/* .hs-fieldtype-intl-phone.hs-input:after {
  content: none !important;
} */

.hs-fieldtype-intl-phone::after {
  content: "";
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24"><path fill="black" d="M7 10l5 5 5-5z"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  z-index: 10;
  left: 182px;
  top: 50%;
  display: block;
  width: 12px;
  height: 12px;
  transform: translateY(-50%);
  pointer-events: none;
}

.hs-error-msg::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  background-image: url('https://supportyourapp.com/img/Info.svg');
  background-repeat: no-repeat;
  background-size: cover;
}

.cta-kicker {
  max-width: 360px;
  color: #1D1D1F;
  opacity: 0.5;
  margin-bottom: 0;
  margin-top: 16px;
  font-size: 12px !important;
  font-weight: 400;
  letter-spacing: 0.5px;
  line-height: 18px;
}

.cta-kicker::before {
  content: '';
}

.cta-kicker a {
  text-decoration: none;
}

#request-my-quote-button {
  padding: 12px 28px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 15px;
  letter-spacing: 0.5px;
  background-color: transparent;
}

#request-my-quote-button.b-black-filled {
  color: #ffffff;
}


.hs-your_position > label:first-child .hs-form-required {
  display: none !important;
}

.hs-your_position > legend,
.hs-workload_cnct > legend {
  display: inline-block !important;
  white-space: nowrap;
}

fieldset.form-columns-1 .hs-form-checkbox > label input {
  width: fit-content !important;
}

.hs-interested_in_ai legend {
  font-size: 15px !important;
  font-weight: 500;
}

.hs-interested_in_ai a {
  text-decoration: none;
  color: #3681BA;
}

.hs-interested_in_ai span {
  text-transform: uppercase;
}

#request-my-quote-button {
  margin-top: 32px;
}

.cta-kicker:last-child {
  opacity: 1;
}

.hs-custom-richtext > .hs-custom-p {
  font-size: 15px !important;
  line-height: 22.5px !important;
}

.hs-custom-richtext > .hs-custom-p strong {
  font-weight: 500 !important;
}

.form-columns-0 .hs-custom-richtext > .hs-custom-p {
  font-size: 18px !important;
  font-weight: bold !important;
}

.form-columns-0 .hs-custom-richtext > .hs-custom-p  strong {
  font-weight: bold !important;
}

.legal-consent-container {
  display: none !important;
}

@media screen and (max-width: 920px) {
  .hs-fieldtype-intl-phone::after {
    left: 45%;
  }
  
  .hubspot-form {
    min-width: inherit;
  }
}

@media screen and (max-width: 768px) {
  .hubspot-form-container {
    flex-direction: column;
  }

  .hubspot-form-container > div:last-child {
    display: none;
  }

  .inputs-list li:hover > label{
    opacity: 0.6;
  }

  .inputs-list li:hover,
  .hubspot-form-container textarea:hover,
  .input > input[type=text]:hover,
  .input > input[type=tel]:hover,
  .input > input[type=email]:hover {
    border-color: #E3E3E3;
  }

  .hubspot-form-container textarea:hover::placeholder,
  .input > input[type=text]:hover::placeholder,
  .input > input[type=email]:hover::placeholder {
    opacity: 0.6;
  }

  .hs-fieldtype-intl-phone select:hover,
  .hs-fieldtype-intl-phone input:hover {
    border-color: #E3E3E3;
    border-right-color: #E3E3E3;
  }

  .hs-fieldtype-intl-phone input:focus,
  .hs-fieldtype-intl-phone select:focus {
    border-color: #1D1D1F !important;
  }

  .hubspot-form-container textarea:focus,
  .inputs-list li:focus,
  .input > input[type=text]:focus,
  .input > input[type=tel]:focus,
  .input > input[type=email]:focus {
    border-color: #1D1D1F;
  }

  .hs-fieldtype-intl-phone::after {
    left: 182px;
  }
  
}

@media screen and (max-width: 580px) {
  .hubspot-form {
    padding: 32px 16px;
  }

  .hs-fieldtype-intl-phone {
    flex-direction: column;
  }

  .hubspot-form .hs-fieldtype-intl-phone select,
  .hubspot-form .hs-fieldtype-intl-phone.hs-input select {
    max-width: 100% !important;
    width: 100% !important;
  }

  .hubspot-form-container textarea {
    height: 106px;
  }

  #request-my-quote-button {
    width: 100%;
    background-color: #1D1D1F !important;
    color: #fff !important;
  }

  .cta-kicker {
    max-width: 100%;
  }

  .b-black-filled::before {
    background-color: #1D1D1F !important;
    color: #fff !important;
  }

  #request-my-quote-button::before,
  #request-my-quote-button::after {
    content: none !important;
  }

  .hs-fieldtype-intl-phone::after {
    top: 16px;
    left: 93%;
  }

  .hubspot-form-container .form-columns-2 {
    flex-direction: column;
  }

  .hs-fieldtype-textarea > label,
  .hs-form-private p > strong,
  .hs-field-desc,
  .hs_workload_cnct > label > span {
    font-size: 15px;
  }

  .inputs-list li {
    width: 100%;
  }
}

@media screen and (max-width: 400px) {
  .hs-your_position > legend,
  .hs-workload_cnct > legend {
    white-space: wrap;
  }
}

@media (max-device-width: 480px) and (min-device-width: 320px), (max-width: 400px) {
    .hubspot-form-container .hs-phone>.input>.hs-fieldtype-intl-phone.hs-input>select.hs-input {
        width: 100% !important;
    }
}

@media (max-device-width: 480px) and (min-device-width: 320px), (max-width: 400px) {
    .hubspot-form-container .hs-phone>.input>.hs-fieldtype-intl-phone.hs-input>input.hs-input {
        width: 100% !important;
    }
}