/* Decorative CTA dots shared by the reference homepage and CMS inner pages. */
.action-link{--action-accent:var(--color-my-primary-01,var(--blue,#223b80))}
.action-link--theme{transition:background-color .3s ease,color .3s ease}
.action-link .action-dot{
  display:inline-block;
  flex:0 0 6px;
  width:6px;
  height:6px;
  margin:0;
  float:none;
  align-self:center;
  vertical-align:middle;
  border:0;
  border-radius:50%;
  color:inherit;
  background-color:var(--action-dot-base,currentColor);
  transform:scale(1);
  transform-origin:center;
  pointer-events:none;
  transition:transform .3s cubic-bezier(.22,.7,.2,1),background-color .3s ease;
}
.action-dot--light{--action-dot-base:#fff}
.action-dot--dark{--action-dot-base:#111}
.listing-meta .action-dot{color:var(--ink,#111)}
.content-aside>.action-link{display:flex;align-items:center;justify-content:space-between}
.ref-search-panel button.action-link,.search-panel button.action-link{display:inline-flex;align-items:center;gap:24px}
.action-link:focus-visible .action-dot,.action-link:active .action-dot{transform:scale(2);background-color:var(--action-accent)}
.action-link--theme:focus-visible,.action-link--theme:active{background:#fff;color:#111}
.action-link--theme:focus-visible>[data-hover-text-roll],.action-link--theme:active>[data-hover-text-roll]{color:inherit}
@media(hover:hover) and (pointer:fine){
  .action-link:hover .action-dot{transform:scale(2);background-color:var(--action-accent)}
  .action-link--theme:hover{background:#fff;color:#111}
  .action-link--theme:hover>[data-hover-text-roll]{color:inherit}
}
@media(prefers-reduced-motion:reduce){.action-link .action-dot{transition:none}}
