.background-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 58% center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .35s ease;
}

.background-video.is-ready { opacity: 1; }
.group-hero .background-video { z-index: -2; }

.background-toggle {
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, .65);
  background: #0c171fdf;
  color: var(--white);
  font-size: 12px;
  cursor: pointer;
}

.background-toggle:hover { border-color: var(--copper-bright); }
.hero-content .background-toggle { position: absolute; right: 0; bottom: 17px; }

@media (max-width: 740px) {
  .background-toggle { font-size: 11px; }
  .hero-content .background-toggle { right: auto; left: 0; bottom: 10px; }
}