/* Existing underlined text buttons keep their resting rule. On interaction,
   the rule clears to the right, then draws back in from the left like Menu. */
@media(min-width:1025px){
  body :is(.exchange-link,.awards-links a,.text-link,.intro .intro-learn-more,#news .more-news-link,.upcoming-event-details,.activity-detail-link){
    position:relative;border-bottom-color:transparent!important;text-decoration:none!important;
  }
  body :is(.exchange-link,.awards-links a,.text-link,.intro .intro-learn-more,#news .more-news-link,.upcoming-event-details,.activity-detail-link)::after{
    content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:currentColor;
    pointer-events:none;transform:scaleX(1);transform-origin:left center;
  }
  body .intro .intro-learn-more::after{bottom:10px!important}
  body .activity-detail-link::after{bottom:-2px!important}
  body :is(.exchange-link,.awards-links a,.text-link,.intro .intro-learn-more,#news .more-news-link,.activity-detail-link):focus-visible::after,
  body .upcoming-event-details:focus-visible::after{animation:cta-underline-redraw .62s cubic-bezier(.22,1,.36,1) both}
  @media(hover:hover) and (pointer:fine){
    body :is(.exchange-link,.awards-links a,.text-link,.intro .intro-learn-more,#news .more-news-link,.activity-detail-link):hover::after,
    body .upcoming-event-details:hover::after{animation:cta-underline-redraw .62s cubic-bezier(.22,1,.36,1) both}
  }
  @keyframes cta-underline-redraw{
    0%{transform:scaleX(1);transform-origin:right center}
    32%{transform:scaleX(0);transform-origin:right center}
    33%{transform:scaleX(0);transform-origin:left center}
    100%{transform:scaleX(1);transform-origin:left center}
  }
  @media(prefers-reduced-motion:reduce){
    body :is(.exchange-link,.awards-links a,.text-link,.intro .intro-learn-more,#news .more-news-link,.upcoming-event-details,.activity-detail-link)::after{animation:none!important}
  }
}
