.feedback {
  margin-bottom: 100px;
  opacity: 0;

  @media (max-width: 1024px) {
    margin-bottom: 50px;
  }

  .container {
    position: relative;
    padding: var(--section-spacing) 20px;
    color: var(--c-white);
    background: url(../../img/pattern-bg.jpg) center center repeat;
    border-radius: var(--br-md);
    overflow: hidden;

    &:before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: var(--c-primary-200);
      opacity: 0.8;
      z-index: 1;
    }

    .feedback-body {
      position: relative;
      margin: 0 24%;
      z-index: 2;

      @media (max-width: 1024px) {
        margin: 0 14%;
      }

      @media (max-width: 576px) {
        margin: 0 20px;
      }

      h3 {
        text-align: center;
      }

      .feedback-form {
        .form-item {
          margin-bottom: 40px;

          @media (max-width: 576px) {
            margin-bottom: 26px;
          }

          &.cta {
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-bottom: 0;

            .wpcf7-spinner {
              margin-top: 14px;
            }
          }
        }

        .wpcf7-not-valid-tip {
          margin: 6px 0 0 4px;
          color: var(--c-white);
        }

        .wpcf7-response-output {
          margin-top: 0;
        }
      }
    }
  }
}