diff --git a/packages/myst-to-react/src/hashLink.tsx b/packages/myst-to-react/src/hashLink.tsx
index d4e2e8e4..e7749b5b 100644
--- a/packages/myst-to-react/src/hashLink.tsx
+++ b/packages/myst-to-react/src/hashLink.tsx
@@ -84,7 +84,8 @@ export function HashLink({
     <a
       className={classNames('no-underline text-inherit hover:text-inherit', className, {
         'select-none': !canSelectText,
-        'transition-opacity opacity-0 focus:opacity-100 group-hover:opacity-70': hover,
+        '[@media(hover:hover)]:transition-opacity [@media(hover:hover)]:opacity-0 [@media(hover:hover)]:focus:opacity-100 [@media(hover:hover)]:group-hover:opacity-70':
+          hover,
         'hover:underline': !hover,
       })}
       onClick={scroll}