.properties-list {
  margin-bottom: 70px;
  @media (max-width: 1680px) {
    margin-bottom: 60px;
  }
  @media (max-width: 1440px) {
    margin-bottom: 50px;
  }
  @media (max-width: 1024px) {
    margin-bottom: 40px;
  }
  .properties-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    @media (max-width: 1680px) {
      grid-gap: 24px;
    }
    @media (max-width: 1024px) {
      grid-template-columns: repeat(2, 1fr);
    }
    @media (max-width: 768px) {
      grid-template-columns: 1fr;
    }
    article {
      display: flex;
      flex-direction: column;
      border-bottom: 1px solid var(--c-gray-200);
      * {
        transition: color 0.3s ease-in-out;
      }
      figure {
        width: 100%;
        a {
          display: block;
          img {
            width: 100%;
          }
        }
      }
      .article-body {
        flex: 1;
        display: flex;
        flex-direction: column;
        padding: 20px 0;
        justify-content: space-between;
        width: 100%;
        ul {
          margin: 0;
          padding: 0;
          list-style: none;
          li {
            font-size: var(--fs-sm);
          }
        }
        .article-top {
          margin-bottom: 1em;
          h6 {
            display: flex;
            gap: 30px;
            margin: 0 0 0.4em;
            span {
              position: relative;
              &:before {
                display: block;
                position: absolute;
                content: '';
                width: 6px;
                height: 6px;
                top: 50%;
                left: 100%;
                transform: translate(12px, -50%);
                background-color: var(--c-gray-500);
              }
              &:last-of-type {
                &:before {
                  display: none;
                }
              }
            }
          }
          h4 {
            margin: 0 0 0.6em;
            text-transform: none;
            a {
              display: block;
              color: var(--c-primary-200);
              &:hover {
                color: var(--c-gray-500);
              }
            }
          }
          ul {
            li {
              font-weight: 300;
            }
          }
        }
        .agent {
          h6 {
            margin: 0 0 0.4em;
            text-transform: none;
          }
        }
      }
    }
  }
}