/* Shared interaction finish for directory cards. Keep color and layout in each page stylesheet. */
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  html body.jlt-product-list .pro-list .pro-card,
  html body.jlt-news-list .news-cont .grid > .item,
  html body .ss-directory .sd-card {
    transition: transform .26s ease, border-color .26s ease, box-shadow .26s ease !important;
  }
  html body.jlt-product-list .pro-list .pro-card:hover,
  html body.jlt-news-list .news-cont .grid > .item:hover,
  html body .ss-directory .sd-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 14px 34px rgba(21, 61, 88, .10) !important;
  }
  html body.jlt-news-list .news-cont .grid > .item .mx,
  html body .ss-directory .sd-card-link { transition: color .2s ease, transform .2s ease; }
  html body.jlt-news-list .news-cont .grid > .item:hover .mx,
  html body .ss-directory .sd-card:hover .sd-card-link { transform: translateX(4px); }
}
html body.jlt-product-list .pro-list .pro-card:focus-visible,
html body.jlt-news-list .news-cont .grid > .item:focus-within,
html body .ss-directory .sd-card:focus-visible {
  outline: 2px solid #007bc4;
  outline-offset: 4px;
}
html body.jlt-news-list .news-cont .grid > .item .txt > p {
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
}
@media (prefers-reduced-motion: reduce) {
  html body.jlt-product-list .pro-list .pro-card,
  html body.jlt-news-list .news-cont .grid > .item,
  html body .ss-directory .sd-card,
  html body.jlt-news-list .news-cont .grid > .item .mx,
  html body .ss-directory .sd-card-link { transition: none !important; transform: none !important; }
  html body.jlt-product-list .pro-list .pro-card,
  html body.jlt-news-list .news-cont .grid > .item,
  html body .ss-directory .sd-card { transition: none !important; transform: none !important; box-shadow: none !important; }
}
