.Project {
  position: relative;
  background: var(--clr-bg-trietary);
  border-radius: var(--radius-md);
  width: calc(33% - var(--gap-lg));
  min-width: 320px;
}

.preview {
  position: relative;
  display: block;
  border-radius: var(--radius-md) var(--radius-md) 0 0;
  left: 0;
  top: 0;
  width: 100%;
  height: 250px;
  object-fit: cover;
  object-position: top;
}

.body {
  padding: var(--gap-sm);
  text-align: left;
  height: 107px;
}

.name {
  font-weight: 300;
}

.description {
  padding-top: var(--gap-sm);
  font: var(--font-sm);
}

@media screen and (max-width: 1464px) {
  .Project {
    width: calc(50% - var(--gap-lg));
  }
}