.interactive-grid-pattern {
    width: 100%;
    height: 100%;
    background-image:
            linear-gradient(to right, rgba(255,255,255,0.1) 1px, transparent 1px),
            linear-gradient(to bottom, rgba(255,255,255,0.1) 1px, transparent 1px);
    background-size: 40px 40px;
}

.interactive-grid-pattern:hover {
    background-image:
            linear-gradient(to right, rgba(var(--primary-rgb),0.3) 1px, transparent 1px),
            linear-gradient(to bottom, rgba(var(--primary-rgb),0.3) 1px, transparent 1px);
}

.mask-\[radial-gradient\(400px_circle_at_center\,white\,transparent\)\] {
    mask-image: radial-gradient(400px circle at center, white, transparent);
    -webkit-mask-image: radial-gradient(400px circle at center, white, transparent);
}