/* Short, one-shot transitions. No looping motion or scroll-driven layout work. */
@media (prefers-reduced-motion: no-preference) {
  html.motion-ready .button {
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
  }
  html.motion-ready .button > span,
  html.motion-ready .text-link > span,
  html.motion-ready .hero-detail-link > b {
    display: inline-block;
    transition: transform .22s ease;
  }
  html.motion-ready .product-tabs button,
  html.motion-ready .category-tabs a,
  html.motion-ready .gallery-thumbs button,
  html.motion-ready .site-nav a {
    transition: color .2s ease, border-color .2s ease, background-color .2s ease;
  }
  html.motion-ready .product-panel:not([hidden]) {
    animation: mv-panel-in .36s ease-out;
  }
  html.motion-ready .button:focus-visible > span,
  html.motion-ready .text-link:focus-visible > span {
    transform: translate(3px, -2px);
  }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
  html.motion-ready .case-card,
  html.motion-ready .catalog-photo,
  html.motion-ready .hero-detail {
    transition: transform .28s ease;
  }
  html.motion-ready .scenario-row {
    transition: background-color .22s ease;
  }
  html.motion-ready .button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px #181d2214;
  }
  html.motion-ready .button:hover > span,
  html.motion-ready .text-link:hover > span,
  html.motion-ready .hero-detail:hover .hero-detail-link > b {
    transform: translate(3px, -2px);
  }
  html.motion-ready .case-card:hover,
  html.motion-ready .catalog-photo:hover,
  html.motion-ready .hero-detail:hover {
    transform: translateY(-4px);
  }
  html.motion-ready .scenario-row:hover { background-color: #f7f8f9; }
  html.motion-ready .gallery-thumbs button:hover { border-color: var(--red); }
}
@media (prefers-reduced-motion: no-preference) and (min-width: 851px) {
  html.motion-ready .site-nav a:after {
    content: '';
    position: absolute;
    bottom: 19px;
    left: 0;
    right: 0;
    border-bottom: 2px solid var(--red);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .22s ease;
  }
  html.motion-ready .site-nav a[aria-current]:after,
  html.motion-ready .site-nav a:hover:after,
  html.motion-ready .site-nav a:focus-visible:after { transform: scaleX(1); }
}
@media (prefers-reduced-motion: no-preference) and (max-width: 850px) {
  html.motion-ready .site-nav.is-open { animation: mv-menu-in .22s ease-out; }
}
@keyframes mv-panel-in {
  from { opacity: .6; transform: translateY(7px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes mv-menu-in {
  from { opacity: .6; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}