.badge-row { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 12px 14px; }
.accolade { flex: none; display: inline-flex; vertical-align: middle; align-items: center; gap: 2px; opacity: 0.72; rotate: -10deg; translate: 0 0; color: inherit; }
.accolade > img { flex: none; display: block; width: auto; height: 46px; }
.accolade-flip { scale: -1 1; }
.accolade > span { display: grid; justify-items: center; gap: 2px; text-align: center; line-height: 1.15; }
.accolade b { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 700; letter-spacing: -0.01em; white-space: nowrap; }
.accolade .accolade-apple { width: auto; height: 12px; }
.accolade small { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 1px 4px; width: max-content; max-width: 146px; font-size: 10.5px; font-weight: 600; line-height: 1.2; }
.accolade small a { display: inline-flex; align-items: center; gap: 3px; color: inherit; text-decoration: none; }
.accolade small a:hover { text-decoration: underline; }
.accolade small img { width: 14px; height: 14px; border-radius: 4px; }
.accolade--light > img, .accolade--light .accolade-apple { filter: invert(1); }
@media (max-width: 560px) {
  .badge-row { gap: 8px; }
  .badge-row:has(> .accolade:not(.accolade--below)) .badge--big img { width: 148px; height: auto; }
  .accolade > img { height: 46px; }
  .accolade b { font-size: 12px; }
  .accolade small { max-width: 104px; font-size: 10.5px; }
  .accolade--light { display: none; }
}
@media (max-width: 760px) {
  .accolade--below { rotate: -5deg; translate: 0 0; margin: 6px 0 12px 4px; }
  .accolade--below small { max-width: none; }
}
@media (min-width: 901px) and (max-width: 960px) {
  .hero-grid .badge-row { gap: 8px; }
  .hero-grid .accolade > img { height: 40px; }
}