:root{
  --icon-motion-duration:640ms;
  --icon-motion-ease:cubic-bezier(.22,1,.36,1);
}

.motion-icon{
  width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;
  flex:0 0 auto;margin:0 0 18px;color:var(--teal,#217C74);
}
.motion-icon svg{width:100%;height:100%;display:block;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.motion-icon :is(path,line,polyline,polygon,circle,rect){vector-effect:non-scaling-stroke}
.motion-icon .ai-part{transform-box:fill-box;transform-origin:center}

.motion-icon.is-icon-active .ai-draw{
  animation:icon-draw var(--icon-motion-duration) var(--icon-motion-ease) both;
}
.motion-icon.is-icon-active .ai-check{
  animation:icon-draw 420ms 160ms var(--icon-motion-ease) both;
}
.motion-icon.is-icon-active .ai-lift{
  animation:icon-lift var(--icon-motion-duration) var(--icon-motion-ease) both;
}
.motion-icon.is-icon-active .ai-left{
  animation:icon-shift-left var(--icon-motion-duration) var(--icon-motion-ease) both;
}
.motion-icon.is-icon-active .ai-right{
  animation:icon-shift-right var(--icon-motion-duration) var(--icon-motion-ease) both;
}
.motion-icon.is-icon-active .ai-orbit{
  animation:icon-orbit 720ms var(--icon-motion-ease) both;
}
.motion-icon.is-icon-active .ai-pulse{
  animation:icon-pulse 560ms var(--icon-motion-ease) both;
}
.motion-icon.is-icon-active .ai-send{
  animation:icon-send 620ms var(--icon-motion-ease) both;
}

@keyframes icon-draw{from{stroke-dasharray:1;stroke-dashoffset:1;opacity:.35}to{stroke-dasharray:1;stroke-dashoffset:0;opacity:1}}
@keyframes icon-lift{0%{transform:translateY(2px);opacity:.5}100%{transform:translateY(0);opacity:1}}
@keyframes icon-shift-left{0%{transform:translateX(3px)}100%{transform:translateX(0)}}
@keyframes icon-shift-right{0%{transform:translateX(-3px)}100%{transform:translateX(0)}}
@keyframes icon-orbit{0%{transform:rotate(-18deg);opacity:.55}100%{transform:rotate(0);opacity:1}}
@keyframes icon-pulse{0%{transform:scale(.78);opacity:.45}60%{transform:scale(1.06);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes icon-send{0%{transform:translate(-3px,3px);opacity:.45}100%{transform:translate(0);opacity:1}}

.model-card.has-motion-icon,.cert-card.has-motion-icon{position:relative}
.model-card.has-motion-icon>.motion-icon,.cert-card.has-motion-icon>.motion-icon{width:44px;height:44px;margin-bottom:20px}
.ann-meta.has-motion-icon>.motion-icon{width:32px;height:32px;margin-bottom:12px}
.step-copy.has-motion-icon>.motion-icon{width:32px;height:32px;margin-bottom:10px}
.topic-filter button.has-motion-icon,.send.has-motion-icon,.nav-cta.has-motion-icon{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.topic-filter button.has-motion-icon>.motion-icon,.send.has-motion-icon>.motion-icon,.nav-cta.has-motion-icon>.motion-icon{width:18px;height:18px;margin:0}
.direct.has-motion-icon>h2{display:flex;align-items:center;gap:14px}
.direct.has-motion-icon>h2>.motion-icon{width:34px;height:34px;margin:0}
.ico.motion-icon{display:block}
.ico.motion-icon svg{stroke-width:2.2}

@media(hover:hover){
  [data-animated-icon]:hover>.motion-icon,.card:hover .ico.motion-icon,.item:hover .ico.motion-icon,.pill:hover .ico.motion-icon{color:var(--dark,#1B3764)}
}

@media(prefers-reduced-motion:reduce){
  .motion-icon,.motion-icon *{animation:none!important;transition:none!important;transform:none!important;stroke-dashoffset:0!important;opacity:1!important}
}