Custom Cursor over video and other embeds

Hey everyone!
I’ve created a custom cursor on my CMS site. However, when I hover over a video or any other sort of embedded link, the custom cursor gets stuck at the edge of the div and I can see the default cursor even if it has been set to none. How can I override those settings? I’m looking for a sustainable solution that will work on all my CMS pages. Any help would be much appreciated. Thanks!


Here is my site Read-Only: https://preview.webflow.com/preview/shreyarege?utm_medium=preview_link&utm_source=designer&utm_content=shreyarege&preview=9ec93ed61b96276a39b446a179d3a550&pageId=6012139ad6508e0652130986&itemId=6012139ad6508e04c61309d4&mode=preview

Hey,

that’s probably because the element’s own website (like Vimeo) has its own cursor settings.

The only solution I can come up with would be to setup some kind of overlay either triggers a modal with the video, or disappears when clicked and the user has to click play two times.

Maybe someone else have some better ideas.