.home-metronome-card {
  position: relative;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 126px;
  padding: 15px 18px;
  overflow: hidden;
  border: 1px solid rgba(246, 205, 155, .48);
  border-radius: 6px;
  background: #101318 url('/assets/home-metronome-card-v1.png') right center / 300px 300px no-repeat;
  color: #fff;
  text-decoration: none;
  transition: border-color .18s, box-shadow .18s;
}
.home-metronome-copy { display: grid; gap: 5px; position: relative; z-index: 1; }
.home-metronome-copy strong { font-size: clamp(18px, 1.55vw, 25px); line-height: 1.3; }
.home-metronome-copy > span:not(.home-metronome-cta) { color: #b8b8b8; font-size: 12px; line-height: 1.6; }
.home-metronome-cta { justify-self: start; margin-top: 5px; padding: 7px 12px; border-radius: 4px; background: #f6cd9b; color: #0f1115; font-size: 13px; font-weight: 700; line-height: 1.3; }
.home-metronome-card:hover { border-color: #ffd9a8; box-shadow: 0 0 20px rgba(246,205,155,.15); }
.home-metronome-card:hover .home-metronome-cta { background: #ffd9a8; }
.home-metronome-card:focus-visible { outline: 2px solid #ffd9a8; outline-offset: 4px; }
@media (min-width: 761px) and (max-width: 1100px) {
  .home-metronome-card { padding-left: 12px; background-size: 240px 240px; background-position: calc(100% + 28px) center; }
  .home-metronome-copy > span:not(.home-metronome-cta) { max-width: 110px; }
}
@media (max-width: 760px) {
  .home-metronome-card { min-height: 128px; }
  .home-metronome-copy strong { font-size: 22px; }
}