.bf-review-strip {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  width: fit-content;
  max-width: 100%;
  margin: 0.28rem 0 1.08rem;
  padding: 0.38rem 0.68rem;
  border: 1.5px solid var(--border, #D5E0E0);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 5px 14px rgba(31, 77, 76, 0.04);
  color: var(--teal, #1F4D4C);
  font-family: Rubik, Arial, sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.15;
}

.bf-review-stars {
  display: inline-flex;
  align-items: center;
  color: var(--lime, #8DC21F);
  font-size: 0.78rem;
  letter-spacing: 0.03em;
  white-space: nowrap;
}

.bf-review-label,
.bf-review-count {
  color: var(--teal, #1F4D4C);
  white-space: nowrap;
}

.bf-review-score {
  color: var(--teal, #1F4D4C);
  font-size: 0.82rem;
  font-weight: 800;
  white-space: nowrap;
}

.bf-review-link {
  display: inline-flex;
  align-items: center;
  color: var(--teal, #1F4D4C);
  font-size: 0.76rem;
  font-weight: 800;
  text-decoration: none;
  border-bottom: 1px solid rgba(141, 194, 31, 0.7);
  white-space: nowrap;
}

.bf-review-link:hover {
  color: var(--lime-dark, #6EA018);
  border-bottom-color: currentColor;
}

main > .bf-review-strip {
  display: inline-flex;
  margin: 1rem auto 0;
}

@media (max-width: 680px) {
  .bf-review-strip {
    display: inline-grid;
    grid-template-columns: auto auto auto;
    align-items: center;
    justify-items: start;
    gap: 0.28rem 0.42rem;
    width: fit-content;
    max-width: 100%;
    padding: 0.46rem 0.68rem;
    border-radius: 16px;
  }

  .bf-review-label {
    grid-column: 1 / -1;
    white-space: normal;
  }

  .bf-review-stars {
    font-size: 0.76rem;
  }

  .bf-review-link {
    grid-column: 1 / -1;
    white-space: nowrap;
  }
}