.hero-media-controls {
  position: absolute;
  right: 4%;
  bottom: 150px;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 12px;
}

.hero-media-controls .hero-music-toggle,
.hero-media-controls .hero-video-toggle {
  position: static;
}

@media (min-width: 761px) {
  .hero-bottom > a {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
  }
}

@media (max-width: 760px) {
  .hero-media-controls {
    left: 6%;
    right: auto;
  }

  .hero .hero-content {
    bottom: 208px;
  }
}