main#main .bmc-motion-hero { overflow: hidden; }
main#main .bmc-motion-hero > .bmc-motion-slide {
  opacity: 0;
  transform: perspective(1100px) translateX(8%) rotateY(-12deg) scale(1.24);
  pointer-events: none;
}
main#main .bmc-motion-hero > .bmc-motion-current {
  opacity: 1;
  transform: perspective(1100px) translateX(0) rotateY(0) scale(1.08);
}
.bmc-motion-other-photo .hero-foot > span:last-child { visibility: hidden; }
.bmc-motion-controls[hidden] { display: none !important; }
.bmc-motion-controls { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: 1.2rem; }
.bmc-motion-controls button, .bmc-motion-counter {
  border: 1px solid #ffffff75;
  padding: .32rem .6rem;
  background: #101010c0;
  color: #fff;
  font: 600 .82rem/1.45 var(--body, system-ui, sans-serif);
}
.bmc-motion-controls button { cursor: pointer; }
.bmc-motion-controls button:hover, .bmc-motion-controls button:focus-visible { border-color: var(--accent, #ff7043); }
.bmc-motion-counter { font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: no-preference) {
  main#main .bmc-motion-hero > .bmc-motion-slide { transition: opacity .9s ease, transform 1.45s cubic-bezier(.2,.75,.25,1); }
  main#main .bmc-motion-hero h1 { animation: bmc-motion-title .9s cubic-bezier(.2,.75,.25,1) both; }
  main#main .bmc-motion-hero .intro { animation: bmc-motion-rise .75s ease-out .15s both; }
  main#main .bmc-motion-hero .actions { animation: bmc-motion-rise .75s ease-out .26s both; }
  main#main .bmc-motion-enter { animation: bmc-motion-rise .65s cubic-bezier(.2,.75,.25,1) both; }
  main#main .bmc-motion-tilt {
    transform: perspective(900px) rotateX(var(--bmc-tilt-x, 0deg)) rotateY(var(--bmc-tilt-y, 0deg)) scale(var(--bmc-tilt-active, 1));
    transition: transform .24s ease-out;
  }
}
@media (prefers-reduced-motion: reduce) {
  main#main .bmc-motion-hero > .bmc-motion-slide { transform: none; }
}
@keyframes bmc-motion-title {
  from { clip-path: inset(0 0 100% 0); transform: translateY(18px); }
  to { clip-path: inset(0 0 0 0); transform: translateY(0); }
}
@keyframes bmc-motion-rise {
  from { opacity: .25; transform: translateY(23px); }
  to { opacity: 1; transform: translateY(0); }
}

