.team {
  padding-top: 70px;
  padding-bottom: 70px;
  border-top: 1px solid #191919;
  border-bottom: 1px solid #191919;
  @media (max-width: 1024px) {
    padding-top: 50px;
    padding-bottom: 50px;
  }
  @media (max-width: 768px) {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .section-container {
    h2 {
      margin-top: 0;
      margin-bottom: 40px;
      text-align: center;
      @media (max-width: 1024px) {
        margin-top: var(--g-md);
      }
    }
    .team-items {
      display: grid;
      grid-gap: var(--sp-sm);
      grid-template-columns: repeat(3, 1fr);
      align-items: start;

      @media (max-width: 768px) {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
      }
      article {
        flex: 1;
        display: flex;
        flex-direction: column;
        margin-bottom: var(--g-md);
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        gap: 30px;
        figure {
          position: relative;
          width: 220px;
          height: 220px;
          &:before {
            display: block;
            position: absolute;
            content: '';
            width: 100%;
            height: 100%;
            top: -10px;
            left: -10px;
            border: 1px solid var(--c-gray-900);
            border-radius: 50%;
            z-index: 2;
          }
          img {
            position: absolute;
            width: 100%;
            height: 100%;
            left: 0;
            top: 0;
            border-radius: 50%;
            object-fit: cover;
            z-index: 1;
          }
        }
        .team-content {
          flex: 1;
          display: flex;
          flex-direction: column;
          .team-top {
            flex: 1;
            h3 {
              margin: 0 0 16px;
            }
            h5 {
              margin-block: 16px;
              color: var(--c-primary-200);
              font-weight: 700;
              @media (max-width: 768px) {
                margin-block: 8px;
              }
            }
            .text {
              display: none;
            }
          }
        }
      }
    }
  }
  &.tiles {
    padding-top: 0;
    border-top: none;
    .section-container {
      .team-items {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: var(--g-md);
        align-items: stretch;
        @media (max-width: 768px) {
          grid-template-columns: 1fr;
        }
        article {
          max-width: none;
        }
      }
    }
  }
}