/* Glow card */

[data-glow] {
    position: relative;
    /* Spotlight layer */
    background-image: radial-gradient(
        600px circle at var(--cursor-x, -9999px) var(--cursor-y, -9999px),
        rgba(200, 216, 228, 0.4) 0%,
        rgba(232, 213, 224, 0.2) 45%,
        transparent 70%
    );
    background-attachment: fixed;
}

/* Border highlight */
[data-glow]::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background: radial-gradient(
        600px circle at var(--cursor-x, -9999px) var(--cursor-y, -9999px),
        rgba(200, 216, 228, 0.75) 0%,
        rgba(232, 213, 224, 0.45) 40%,
        rgba(245, 230, 232, 0.2) 60%,
        transparent 75%
    );
    background-attachment: fixed;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}