#quem-somos.section-page {
  align-items: center;
  display: flex;
  gap: 80px;
  margin-top: 100px;
  width: 1200px;

  > .content {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding-left: 40px;

    > .title {
      width: 100%;
      display: flex;
      gap: 16px;
    }

    > .text {
      margin-top: 24px;
      background: linear-gradient(
        180deg,
        #fff 65.73%,
        rgba(255, 255, 255, 0) 90.52%
      );
      background-clip: text;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    > button {
      margin-top: 24px;
      background-color: #d0ddff;
      color: #1c026c;
      margin-top: -40px;
    }
  }

  > .images {
    display: grid;
    grid-template-columns: repeat(2, 1fr 1fr);
    gap: 16px;
    grid-template-areas:
      "one two"
      "one three";

    > .image-1 {
      grid-area: one;
    }

    > .image-2 {
      grid-area: two;
    }

    > .image-3 {
      grid-area: three;
    }
  }

  @media (max-width: 1100px) {
    > .images {
      > img {
        width: 200px;
      }
    }
  }

  @media (max-width: 960px) {
    gap: 40px;

    > .content {
      > .title {
        > .icon {
          > svg {
            width: 40px;
          }
        }
      }
      > .text {
        > span {
          display: none;
        }
      }
    }
  }

  @media (max-width: 840px) {
    flex-direction: column;

    >.content{
        padding: 0;
        >.text{
            width: 80vw;
        }
    }

    >.images{
        align-items: center;
        max-width: 90vw;
        grid-template-columns: inherit;
        
        >img{
            width: 40vw;
        }
    }
  }
}