@media (min-width: 991px) {
    body:has([data-cursor]:hover) .cursor {
        opacity: 1;
    }

    .button:hover .button-bg {
        transform: scale(0.95);
    }
}

body:has(a:hover) .cursor-dot,
body:has(button:hover) .cursor-dot,
body:has([data-cursor-dot]:hover) .cursor-dot {
    width: 1rem;
    height: 1rem;
}

@media (hover: none) and (pointer: coarse) {
    .cursor-dot {
        display: none;
    }
}