/* Gentle editorial motion for the public Maira landing page. */
.motion-ready [data-motion] {
  transition: opacity .65s ease, transform .75s cubic-bezier(.2,.75,.25,1);
  transition-delay: var(--motion-delay, 0ms);
}
.motion-ready [data-motion]:not(.is-visible) {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
}
.motion-ready .hero2-scene[data-motion]:not(.is-visible) {
  transform: translate3d(0, 28px, 0) scale(.965);
}
.hero2-scene.is-visible .hero2-arc {
  animation: maira-arc-in 1.1s cubic-bezier(.2,.75,.25,1) both;
}
@keyframes maira-arc-in {
  from { opacity: .35; transform: scale(.91); }
  to { opacity: 1; transform: scale(1); }
}
.next-image img,
.recorded-cover::before {
  transition: transform .7s cubic-bezier(.2,.75,.25,1);
}
.hero2-image img { transition: transform .8s cubic-bezier(.2,.75,.25,1); }
@media (hover: hover) {
  .hero2-scene:hover .hero2-image img { transform: scale(1.035); }
}
.next-card:hover .next-image img { transform: scale(1.045); }
.recorded-card:hover .recorded-cover::before { transform: translate(-14px, -9px) scale(1.04); }
.recorded-card:hover .recorded-bottom a,
.recorded-card:focus-within .recorded-bottom a { color: var(--rose); }
.recorded-bottom a { transition: color .2s ease; }
.catalog-view {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 21px 0 18px;
}
.catalog-view > span {
  margin-right: auto;
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.catalog-view-button {
  border: 1px solid var(--line);
  border-radius: 100px;
  padding: 7px 15px;
  background: #fff;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.catalog-view-button:hover,
.catalog-view-button:focus-visible { border-color: var(--plum); }
.catalog-view-button.is-active {
  color: #fff;
  background: var(--plum);
  border-color: var(--plum);
}
.recorded-grid.is-list { grid-template-columns: 1fr; }
.recorded-grid.is-list .recorded-card {
  display: grid;
  grid-template-columns: minmax(220px, 32%) minmax(0, 1fr);
  min-height: 210px;
}
.recorded-grid.is-list .recorded-cover { height: 100%; min-height: 210px; }
.recorded-grid.is-list .recorded-cover b { max-width: 360px; }
.recorded-grid.is-list .recorded-card-body { justify-content: center; }
.demo-progress i { transform-origin: left center; }
.motion-ready .demo-progress:not(.is-visible) i { transform: scaleX(0); }
.motion-ready .demo-progress.is-visible i {
  transform: scaleX(1);
  transition: transform .85s cubic-bezier(.2,.75,.25,1);
}
@media (max-width: 520px) {
  .catalog-view { flex-wrap: wrap; }
  .catalog-view > span { flex-basis: 100%; margin-bottom: 5px; }
  .recorded-grid.is-list .recorded-card { grid-template-columns: 1fr; }
  .recorded-grid.is-list .recorded-cover { min-height: 160px; height: 160px; }
  .recorded-grid.is-list .recorded-cover b { font-size: 25px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .motion-ready [data-motion], .motion-ready [data-motion]:not(.is-visible) {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .hero2-scene.is-visible .hero2-arc { animation: none; }
  .hero2-image img, .next-image img, .recorded-cover::before, .catalog-view-button,
  .recorded-card, .mode-card, .btn, .demo-progress i { transition: none; }
}
@media print {
  .motion-ready [data-motion], .motion-ready [data-motion]:not(.is-visible) {
    opacity: 1;
    transform: none;
  }
}