/**
 * 121 Platform
 * Text Link
 *
 * Reusable supporting link with animated arrow.
 *
 * @package 121_Platform
 */

.nd-text-link,
.nd-text-link > a {
	display: inline-flex;
	align-items: center;
	color: var(--wp--preset--color--primary);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: var(--wp--custom--typography--weight-medium);
	text-decoration: none;
}

.nd-text-link:is(a)::after,
.nd-text-link:not(a) > a::after {
	content: "→";
	display: inline-block;
	margin-left: 0.5em;
	transition:
	transform var(--wp--custom--motion--duration-fast)
	var(--wp--custom--motion--easing-standard);
}

.nd-text-link:hover,
.nd-text-link > a:hover {
	color: var(--wp--preset--color--accent);
}

.nd-text-link:is(a):hover::after,
.nd-text-link:not(a) > a:hover::after {
	transform: translateX(5px);
}

.nd-text-link:focus-visible,
.nd-text-link > a:focus-visible {
	outline: var(--wp--custom--focus--outline-width) solid var(--wp--preset--color--accent);
	outline-offset: var(--wp--custom--focus--outline-offset);
}

@media (prefers-reduced-motion: reduce) {
	.nd-text-link:is(a)::after,
	.nd-text-link:not(a) > a::after {
		transition: none;
	}

	.nd-text-link:is(a):hover::after,
	.nd-text-link:not(a) > a:hover::after {
		transform: none;
	}
}