.glow-card {
    --glow-border: 1px;
    --glow-radius: 12px;
    --glow-size: 250px;
    --glow-border-spot-size: 160px;
    --glow-color: rgba(221, 234, 228, 0.45);
    --glow-bg: #fff;
    --glow-bg-hover: #fff;

    position: relative;
    z-index: 0;
    overflow: hidden;
    border-radius: var(--glow-radius);
    background: #fff;
    border: var(--glow-border) solid var(--glow-border-color, #fff);
}

.glow-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    padding: var(--glow-border);
    border-radius: inherit;
    opacity: 0;
    background: radial-gradient(
        var(--glow-border-spot-size) circle at var(--glow-cursor-x, 50%) var(--glow-cursor-y, 50%),
        var(--glow-border-hover-color, var(--drpml-color-brand-300, #86AF9F)) 0%,
        transparent 70%
    );
    transition: opacity 0.2s ease;
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
}

.glow-card__inner {
    position: relative;
    z-index: 1;
    height: 100%;
    border-radius: var(--glow-radius);
    background: var(--glow-bg);
    backdrop-filter: blur(80px);
    -webkit-backdrop-filter: blur(80px);
    transition: background 0.3s ease;
}

.glow-card:hover {
    border-color: var(--glow-border-color, #fff);
}

.glow-card:hover::before {
    opacity: 1;
}

.glow-card:hover .glow-card__inner {
    background: var(--glow-bg-hover);
}

.glow-card__blob {
    position: absolute;
    width: var(--glow-size);
    height: 80%;
    left: calc(50% - var(--glow-size) / 2);
    border-radius: 50%;
    background: var(--glow-color);
    filter: blur(40px);
    z-index: -1;
    opacity: 0;
    transition: opacity 0.3s 0.3s linear;
    pointer-events: none;
}

.glow-card .text {
    text-decoration: none;
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 1px;
    transition: background-size 0.3s ease;
}

.glow-card .brxe-text-link:hover .text {
    background-size: 100% 1px;
}

.glow-card__fakeblob {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    border-radius: 50%;
    visibility: hidden;
    z-index: -1;
    pointer-events: none;
}
