.download-links .magnetic-button {
    --magnetic-x: 0px;
    --magnetic-y: 0px;
    --magnetic-inner-x: 0px;
    --magnetic-inner-y: 0px;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border-radius: 999px;
    transform: translate3d(var(--magnetic-x), var(--magnetic-y), 0);
    transition:
        transform 420ms cubic-bezier(0.22, 1.35, 0.36, 1),
        color 220ms ease,
        border-color 220ms ease,
        background-color 220ms ease,
        box-shadow 220ms ease;
    will-change: transform;
}

.download-links .magnetic-button::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -55%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(70, 169, 255, 0.26), transparent 58%);
    opacity: 0;
    transform: translate3d(var(--magnetic-inner-x), var(--magnetic-inner-y), 0) scale(0.65);
    transition: opacity 220ms ease, transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.download-links .magnetic-button span {
    position: relative;
    display: block;
    transform: translate3d(var(--magnetic-inner-x), var(--magnetic-inner-y), 0);
    transition: transform 420ms cubic-bezier(0.22, 1.35, 0.36, 1);
    pointer-events: none;
}

.download-links .magnetic-button.is-magnetic {
    border-color: rgba(59, 161, 246, 0.68);
    box-shadow: 0 10px 28px rgba(24, 119, 207, 0.18);
}

.download-links .magnetic-button.is-magnetic::before {
    opacity: 1;
    transform: translate3d(var(--magnetic-inner-x), var(--magnetic-inner-y), 0) scale(1);
}

[data-theme="dark"] .download-links .magnetic-button::before {
    background: radial-gradient(circle, rgba(98, 205, 184, 0.2), transparent 58%);
}

[data-theme="dark"] .download-links .magnetic-button.is-magnetic {
    border-color: rgba(98, 205, 184, 0.54);
    box-shadow: 0 10px 30px rgba(44, 131, 189, 0.2);
}

@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
    .download-links .magnetic-button,
    .download-links .magnetic-button span,
    .download-links .magnetic-button::before {
        transform: none !important;
        transition-duration: 150ms;
    }
}

