.service-motion-controls {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 18px;
  margin: -18px 0 22px;
  padding-right: 40px;
  color: #526376;
  font-size: 11px;
}
.service-motion-controls[hidden] { display: none; }
.service-motion-controls > span { display: inline-flex; gap: 9px; align-items: center; }
.service-motion-controls button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 0 17px;
  flex-shrink: 0;
  border: 1px solid #bbc3ca;
  border-radius: 30px;
  color: #17334f;
  background: rgba(255,255,255,.65);
  cursor: pointer;
  font: inherit;
}
.service-motion-controls button:hover { background: #fff; border-color: #17334f; }
.service-motion-controls button:disabled { cursor: default; opacity: .75; }
.service-motion-controls [data-motion-icon] { width: 12px; font-size: 13px; }
@media (max-width: 680px) {
  .service-motion-controls { align-items: flex-start; margin-top: 0; padding-right: 0; gap: 12px; }
  .service-motion-controls > span { display: block; max-width: 135px; line-height: 1.7; }
  .service-motion-controls > span > span { display: none; }
}
