{% require_css %}
  <style>
    {% scope_css %}
      .signup-form__form-wrapper form {
          display: flex;
          flex-direction: row;
          border: 1px solid var(--primary-900);
          border-radius: 48px;
      }

      .signup-form__form-wrapper .hs-form-field {
          margin-bottom: 0;
          width: 100%;
      }

      .signup-form__form-wrapper .hs-form-field > label {
          padding: 0;
          width: unset;
      }

      .signup-form__form-wrapper input[type="email"] {
          height: 100%;
          border-radius: 48px;
          padding: 12px 32px;
          background-color: transparent;
          border: none;
          color: var(--text-color, #333);
      }

      .signup-form__form-wrapper input[type="submit"] {
          background-color: black !important;
          color: white !important;
          border: none !important;
          border-radius: 0 48px 48px 0;
          padding: 0 24px;
          height: 100%;
          cursor: pointer;
          font-weight: bold;
          transition: background-color 0.3s ease-in-out;
      }

      .signup-form__form-wrapper input[type="submit"]:hover {
          background-color: #333 !important;
      }

      .signup-form__form-wrapper input[type="submit"]:focus {
          outline: 2px solid white;
          background-color: #222 !important;
      }

      .signup-form__form-wrapper .hs-form-field .input {
          width: 100%;
          margin-left: 0;
      }

      .signup-form__module-layout {
          align-items: center;
          text-align: center;
          max-width: 64ch;
      }

      .signup-form__form-wrapper {
          width: 100%;
      }

      @media screen and (min-width: 960px) {
          .signup-form__form-wrapper input[type="email"] {
              padding: 4px 32px;
          }

          .signup-form__form-wrapper input[type="submit"] {
              padding: 0 40px;
          }

          .signup-form__module-layout--right .signup-form__title {
              max-width: 360px;
              width: 60%;
          }

          .signup-form__module-layout--right {
              flex-direction: row;
              gap: 24px;
          }

          .signup-form__form-wrapper {
              width: 80%;
              max-width: 560px;
              margin-left: auto;
          }
      }
    {% end_scope_css %}
  </style>
{% end_require_css %}