.path {
    stroke-dasharray: 1780;
    stroke-dashoffset: 1780;
    animation: dash 10s ease-in-out forwards;
    fill: none;
    fill-opacity: 1;
    stroke: #ffffff;
    stroke-width: 0.15;
    stroke-opacity: 1;
}

.path2 {
    stroke-dasharray: 1750;
    stroke-dashoffset: 1750;
    animation: dash 20s ease-in-out forwards;
    fill: none;
    fill-opacity: 1;
    stroke: #ffffff;
    stroke-width: 0.15;
    stroke-opacity: 1;
}

.path3 {
    stroke-dasharray: 1450;
    stroke-dashoffset: 1450;
    animation: dash 4s ease-in-out forwards;
}

.text_vaara {
    font-family: 'Comfortaa', sans-serif;
    font-size: 20px;
    color: white;
}

@keyframes dash {
    to {
        stroke-dashoffset: 0;
    }
}

body {
    margin: 0;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(135deg, #050a14, #1a0f33, #0f2433, #330f24, #0f3324, #050a14);
    background-size: 600% 600%;
    animation: gradientBG 15s ease-in-out infinite;
}

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

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}