/* background-particles.css */
.premium-background {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        radial-gradient(ellipse at 15% 15%, rgba(148, 57, 127, 0.05) 0%, transparent 70%),
        radial-gradient(ellipse at 85% 85%, rgba(177, 107, 224, 0.04) 0%, transparent 70%),
        linear-gradient(180deg, #080c14 0%, #0d1321 100%);
}

.particles-container {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

.glow-particle {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    will-change: transform, opacity;
    background: currentColor;
    box-shadow:
        0 0 8px currentColor,
        0 0 16px currentColor,
        0 0 24px currentColor;
    animation: float linear infinite, twinkle ease-in-out infinite;
    filter: blur(0.5px);
}

@keyframes float {
    0% {
        transform: translateY(110vh) translateX(var(--x-start)) rotate(0deg);
        opacity: 0;
    }
    5%    { opacity: 0.9; }
    95%   { opacity: 0.9; }
    100% {
        transform: translateY(-30vh) translateX(var(--x-end)) rotate(720deg);
        opacity: 0;
    }
}

@keyframes twinkle {
    0%, 100% {
        opacity: 0.7;
        transform: scale(0.85);
    }
    50% {
        opacity: 1;
        transform: scale(1.2);
    }
}

/* Optional: reduce motion respect */
@media (prefers-reduced-motion: reduce) {
    .glow-particle {
        animation: none !important;
    }
}