[data-component-name='PersonFeedback'] {
  margin: 2.5rem 0;
  position: relative;
  padding: 1.25rem 1.25rem 5rem 1.25rem;
  background-color: #f8f8f8;

  & figure,
  & blockquote,
  & p {
    margin: 0;
    padding: 0;
  }

  & figure {
    padding: 2.5rem 5rem 2.5rem 2.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem 0;

    & blockquote {
      background-color: unset;
    }

    & figcaption {
      position: absolute;
      left: 0;
      bottom: 1.63rem;

      & p {
        position: relative;
        z-index: 0;
        width: fit-content;
        padding: 0.38rem 1.25rem;
        white-space: nowrap;

        color: #fff;

        &.fullname {
        }

        &.position {
          padding-right: 0;

          &::after {
            content: ',';
          }
        }

        &.company {
          padding-left: 0.3rem;
          margin-left: -1px;
        }

        &::before {
          content: '';
          display: block;
          position: absolute;
          inset: 0;
          z-index: -1;
          background-color: #5b00b3;
        }
      }

      & .container {
        display: flex;
        margin-top: -0.625rem;
      }
    }
  }

  @media screen and (max-width: 1215px) {
    & figure {
      padding: 2.5rem;
    }
  }

  @media screen and (max-width: 767px) {
    & figure {
      padding: 1.25rem 0 3.75rem 0;

      & figcaption {
        & p {
          &.fullname {
          }

          &.position {
            padding-right: 1.25rem;
          }

          &.company {
            padding-left: 1.25rem;
            margin-left: 0;
            margin-top: -0.625rem;
          }
        }

        & .container {
          flex-direction: column;
        }
      }
    }
  }
}
