:root {
	--ry-link-fill-hover-duration: 1150ms;
	--ry-link-fill-hover-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--ry-link-fill-hover-base-color: #2e1503;
	--ry-link-fill-hover-fill-color: #7a4c31;
	--ry-link-fill-hover-underline-thickness: max(1px, 0.06em);
	--ry-link-fill-hover-underline-offset: 0.16em;
}

a.ry-link-fill-hover {
	display: inline-grid;
	grid-template-areas: "stack";
	position: relative;
	vertical-align: baseline;
	color: inherit;
	text-decoration: none;
}

a.ry-link-fill-hover .ry-link-fill-hover__content,
a.ry-link-fill-hover .ry-link-fill-hover__fill {
	grid-area: stack;
	text-decoration-line: underline;
	text-decoration-color: currentColor;
	text-decoration-thickness: var(--ry-link-fill-hover-underline-thickness);
	text-underline-offset: var(--ry-link-fill-hover-underline-offset);
	text-decoration-skip-ink: auto;
}

a.ry-link-fill-hover .ry-link-fill-hover__content {
	color: var(--ry-link-fill-hover-base-color);
}

a.ry-link-fill-hover .ry-link-fill-hover__fill {
	color: var(--ry-link-fill-hover-fill-color);
	pointer-events: none;
	clip-path: inset(0 100% 0 0);
	transition: clip-path var(--ry-link-fill-hover-duration) var(--ry-link-fill-hover-ease);
	will-change: clip-path;
}

a.ry-link-fill-hover:hover .ry-link-fill-hover__fill,
a.ry-link-fill-hover:focus-visible .ry-link-fill-hover__fill {
	clip-path: inset(0 0 0 0);
}

@media (prefers-reduced-motion: reduce) {
	a.ry-link-fill-hover .ry-link-fill-hover__fill {
		transition: none;
	}
}
