:root {
    --bg-gradient-start: #15202B;
    --bg-gradient-mid: #1c2b3a;
    --bg-gradient-end: #0f1720;
    --particle-color: rgba(64, 179, 162, 0.5); /* Quinio Teal with opacity */
    --particle-connect-color: rgba(64, 179, 162, 0.2);
}

.dynamic-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -2;
    background: linear-gradient(-45deg, var(--bg-gradient-start), var(--bg-gradient-mid), var(--bg-gradient-end), var(--bg-gradient-start));
    background-size: 400% 400%;
    animation: gradientBG 20s ease infinite;
}

@keyframes gradientBG {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

#particles-canvas {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
}