@import '../../styles/breakpoints/index';

.link {
  margin-bottom: 16px;
  outline: none;
  display: block;
  color: inherit;
  text-decoration: none;
}

.link:hover {
  color: var(--color-primary);
}

.title {
  margin-bottom: 8px;
}

.description,
.link:hover .description {
  color: var(--color-text);
}

.image {
  margin-bottom: 16px;
  overflow: hidden;
}

.imageInner {
  transition: transform 0.5s var(--animation-bezier);
}

.link:hover .imageInner {
  transform: scale(1.025);
  transition-duration: 0.25s;
}

.price {
  font-weight: 500;
}

.estimate {
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: var(--size-0);
  font-weight: 500;
  margin-right: .3em;
}

.value {
  font-size: var(--size-1);
  margin-bottom: calc(var(--margin) * 0.5);
  display: flex;
  flex-direction: row;
  align-items: baseline;
}

.tags {
  font-size: var(--size-2);
  margin-bottom: 16px;
}
