@layer components {
.store-badges {
  --store-badge-height: 44px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 28px;
  row-gap: 12px;
}

.store-badge {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  /* Keep Google's built-in vertical clear space and align the visible badges. */
  height: calc(var(--store-badge-height) * 250 / 192);
}

.store-badge img {
  display: block;
  width: auto;
  height: var(--store-badge-height);
}

.store-badge-google img {
  height: calc(var(--store-badge-height) * 250 / 192);
}

@media (min-width: 640px) {
  .store-badges:not(.store-badges-sm) {
    --store-badge-height: 56px;
  }
}
}