/* Shared badge size: 80% of the original 164 × 54px store button. */
.hero .download-buttons,
.download-section .download-buttons {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  width: 409.6px;
  max-width: 100%;
}
.download-section .download-buttons { margin-inline: auto; }
.hero .store-button,
.download-section .store-button {
  width: 100%;
  min-width: 0;
  min-height: 0;
  height: auto;
  aspect-ratio: 164 / 54;
  padding: 6.6px 9.9px;
  gap: 6px;
  border-radius: 8px;
  border: 1px solid #607167;
  background: #09140e;
  box-shadow: inset 0 1px 0 #d5ebdc08;
  transition: transform .2s, background .2s, border-color .2s;
}
.download-buttons .store-button:hover {
  transform: translateY(-3px);
  background: #16291c;
  border-color: #8eb69a;
}
.download-buttons .store-button .store-badge {
  display: block;
  width: 100%;
  height: auto;
  max-height: 100%;
  stroke: none;
  mix-blend-mode: screen;
}
.download-buttons .chrome-store-icon { width: 23px; height: 23px; }
.download-buttons .store-button small { font-size: 7px; line-height: 1.25; letter-spacing: 0; white-space: nowrap; }
.download-buttons .store-button strong { font-size: 14.5px; line-height: 1.15; letter-spacing: -.35px; white-space: nowrap; }
.download-buttons .store-chrome sup { font-size: 6px; margin-left: 0; }
@media (max-width: 960px) and (min-width: 601px) {
  .hero .download-buttons { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 270.4px; }
  .hero .store-chrome { grid-column: 1; }
}
@media (max-width: 600px) {
  .hero-copy { width: 100%; max-width: 100%; }
  .hero .download-buttons { margin-inline: auto; }
  .hero .store-button, .download-section .store-button { padding: 5.5px 7.7px; gap: 5px; }
  .download-buttons .chrome-store-icon { width: 20px; height: 20px; }
  .download-buttons .store-button small { font-size: 6px; }
  .download-buttons .store-button strong { font-size: 12px; }
}
@media (max-width: 360px) {
  .hero .download-buttons, .download-section .download-buttons { width: max-content; grid-template-columns: repeat(2, 131.2px); }
  .download-buttons .store-chrome { grid-column: 1 / -1; width: 131.2px; justify-self: center; }
}

@media (min-width: 601px) and (max-width: 720px) {
  .hero .store-chrome { padding-inline: 6.6px; gap: 4px; }
  .hero .store-chrome .chrome-store-icon { width: 20px; height: 20px; }
  .hero .store-chrome small { font-size: 6px; }
  .hero .store-chrome strong { font-size: 12px; }
}