.vr {
  padding: clamp(20px, 4vw, 44px) 18px 0;
}

.vr-wrap {
  display: grid;
  gap: 22px;
  width: min(860px, 100%);
  margin: 0 auto;
}

.vr-head {
  padding: clamp(18px, 3vw, 30px);
}

.vr-head .title {
  margin-bottom: 0.3em;
}

.vr-lead {
  margin: 0;
  max-width: 44em;
  font-size: 1.08rem;
}

.vr-entry {
  display: grid;
  grid-template-columns: 11rem minmax(0, 1fr);
  gap: 8px 28px;
  padding: clamp(16px, 3vw, 28px);
}

.vr-entry__head {
  align-self: start;
}

.vr-entry__num {
  margin: 0;
  font: 900 1.45rem var(--font-title);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  line-height: 1.15;
  color: #5a3112;
}

.vr-entry__date {
  display: inline-block;
  margin-top: 6px;
  padding: 2px 12px;
  font: 800 0.88rem var(--font);
  font-variant-numeric: tabular-nums;
  color: var(--cream);
  background: linear-gradient(#6a3f1e, #3b2210);
  border: 2px solid #24130a;
  border-radius: 999px;
}

.vr-kind {
  display: inline-block;
  margin: 0 0 8px;
  padding: 1px 12px;
  font: 900 0.82rem var(--font-title);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--cream);
  border: 2px solid var(--wood-dd);
  border-radius: 999px;
}

.vr-kind--new {
  background: #2a8517;
}

.vr-kind--improved {
  background: #8a5428;
}

.vr-kind--fixed {
  background: #a8221a;
}

.vr-changes {
  margin: 0 0 20px;
  padding: 0 0 0 1.2em;
  max-width: 64ch;
  list-style: disc outside;
}

.vr-changes:last-child {
  margin-bottom: 0;
}

.vr-changes li {
  margin: 0 0 8px;
  line-height: 1.55;
}

.vr-changes li:last-child {
  margin-bottom: 0;
}

.vr-changes li::marker {
  color: var(--wood);
}

.vr-empty {
  margin: 0;
  padding: 22px;
  font-weight: 700;
}

@media (max-width: 720px) {
  .vr-entry {
    grid-template-columns: minmax(0, 1fr);
  }

  .vr-entry__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 14px;
    margin-bottom: 6px;
  }

  .vr-entry__date {
    margin-top: 0;
  }
}