.profile {
  display: flex;
  gap: var(--Spacing-x2);
  justify-content: space-between;
}

.info {
  display: grid;
  gap: var(--Spacing-x-one-and-half) var(--Spacing-x7);
  width: 100%;
  justify-items: flex-start;
}

.item {
  align-items: center;
  display: grid;
  gap: var(--Spacing-x1);
  grid-template-columns: auto auto 1fr;
  justify-items: flex-end;
  width: 100%;
}

@media screen and (min-width: 768px) {
  .info {
    grid-template-columns: repeat(3, auto);
  }
  .item {
    justify-items: flex-start;
  }
}
