:root {
    --page-x: 50vw;
    --page-y: 50vh;
}
.cursor-reactive-glow-global, .cursor-reactive-glow-card .glow {
    will-change: transform, opacity;
    pointer-events: none;
}
.cursor-reactive-glow-global {
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    z-index: 0;
    position: fixed;
    pointer-events: none;
    will-change: transform;
    box-shadow: 0 0 220px 120px rgb(255 255 255 / 30%);
    transform: translate3d(var(--page-x), var(--page-y), 0);
}
.cursor-reactive-glow-card {
    overflow: hidden;
    isolation: isolate;
    position: relative;
}
.cursor-reactive-glow-card .glow {
    top: 0;
    left: 0;
    opacity: 0;
    width: 1px;
    height: 1px;
    z-index: -1;
    position: absolute;
    pointer-events: none;
    filter: hue-rotate(0deg);
    transition: opacity .15s ease;
    transform: translate3d(50%,50%,0);
    will-change: transform, opacity, filter;
    box-shadow: 0 0 200px 120px hsl(var(--h,210) 100% 60% / .55);
}
.cursor-reactive-glow-card:hover .glow {
    opacity: 1;
}
@media (prefers-reduced-motion: reduce){
    .cursor-reactive-glow-card .glow, .cursor-reactive-glow-global {
        transition: none !important;
    }
}
@media (max-width: 911px){
    .cursor-reactive-glow-global {
        display: none;
    }
}