Волшебная кнопка «Всё хорошо» | Решение всех проблем

SAGE agensy
ВОТ И ВСЁ
 <style>
/* Скрываем курсор на десктопах */
@media (min-width: 992px) {
    body, a, button, input, .t-btn, .t-submit { cursor: none !important; }
    
    .cursor-dot {
        width: 5px; height: 5px; 
        background-color: white; 
        border-radius: 50%;
        position: fixed; top: 0; left: 0; 
        transform: translate(-50%, -50%);
        pointer-events: none; z-index: 9999999; 
        mix-blend-mode: difference;
    }
    
    .cursor-outline {
        width: 30px; height: 30px; 
        border: 1px solid rgba(255, 255, 255, 0.5);
        border-radius: 50%; 
        position: fixed; top: 0; left: 0;
        transform: translate(-50%, -50%); 
        pointer-events: none; z-index: 9999998;
        transition: width 0.2s, height 0.2s, background-color 0.2s;
    }
}
@media (max-width: 991px) { 
    .cursor-dot, .cursor-outline { display: none !important; } 
}
</style> <script>
document.addEventListener('DOMContentLoaded', () => {
    if (window.innerWidth > 991) {
        // Создаем элементы
        const dot = document.createElement('div'); dot.className = 'cursor-dot';
        const outline = document.createElement('div'); outline.className = 'cursor-outline';
        document.body.append(dot, outline);

        // Движение
        window.addEventListener('mousemove', (e) => {
            const x = e.clientX, y = e.clientY;
            dot.style.left = x + 'px'; dot.style.top = y + 'px';
            outline.animate({ left: x + 'px', top: y + 'px' }, { duration: 500, fill: "forwards" });
        });

        // Эффект наведения
        const interact = () => {
             outline.style.width = '50px'; outline.style.height = '50px';
             outline.style.backgroundColor = 'rgba(255, 255, 255, 0.1)';
        };
        const noInteract = () => {
             outline.style.width = '30px'; outline.style.height = '30px';
             outline.style.backgroundColor = 'transparent';
        };
        
        // Реакция на наведение
        document.addEventListener('mouseover', (e) => {
            if(e.target.closest('a, button, .t-btn, .t-submit, [role="button"]')) interact();
        });
        document.addEventListener('mouseout', (e) => {
             if(e.target.closest('a, button, .t-btn, .t-submit, [role="button"]')) noInteract();
        });
    }
});
</script>