/* Canonical interactions, extracted from the selected Home page.
   Load after component/page styles on Home, all internal pages and specimens. */
:root {
  --ml-interaction-insight-hover:#e7e3dc;
  --ml-interaction-blue:#79a9d0;
  --ml-interaction-ease:cubic-bezier(.22,1,.36,1);
}
:is(.insight-art,.ml-insight-art,.card-art,.featured-art) {
  position:relative;
  overflow:hidden;
  background:#fff;
  transition:background .4s;
}
:is(.insight-art,.ml-insight-art,.card-art,.featured-art)::after {
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:2px;
  z-index:2;
  pointer-events:none;
  background:var(--ml-interaction-blue);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .7s var(--ml-interaction-ease);
}
:is(.insight-card,.ml-insight-card,.editorial-card>a,.featured-insight>a):is(:hover,:focus-visible) :is(.insight-art,.ml-insight-art,.card-art,.featured-art) {
  background:var(--ml-interaction-insight-hover);
}
:is(.insight-card,.ml-insight-card,.editorial-card>a,.featured-insight>a):is(:hover,:focus-visible) :is(.insight-art,.ml-insight-art,.card-art,.featured-art)::after {
  transform:scaleX(1);
}
/* Insight images do not zoom. The 2px underline also works with approved photography. */
:is(.card-art,.featured-art)>img { transition:none; }
:is(.button,.ml-button):focus-visible { color:#060e15; border-color:var(--ml-interaction-blue); box-shadow:0 3px 20px #0000000a; }
:is(.button,.ml-button):focus-visible::before { transform:translateY(0); }
:is(.insight-card,.ml-insight-card,.editorial-card>a,.featured-insight>a):focus-visible { outline:2px solid currentColor; outline-offset:6px; }
.motion-paused *, .motion-paused *::before, .motion-paused *::after { animation-play-state:paused!important; transition:none!important; }
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto!important; }
  *,*::before,*::after { animation:none!important; transition:none!important; }
}
