/*===============================
      Premium AI Loader
================================*/

#page-loader{
    position:fixed;
    inset:0;
    display:flex;
    justify-content:center;
    align-items:center;
    background:#07131F;
    z-index:999999;
    transition:.7s ease;
}

#page-loader.hide{
    opacity:0;
    visibility:hidden;
    pointer-events:none;
}

.loader-container{
    position:relative;
    width:260px;
    height:260px;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-direction:column;
}

/* Rings */

.ring{
    position:absolute;
    border-radius:50%;
    border:1px solid rgba(255,255,255,.08);
}

.ring1{
    width:150px;
    height:150px;
    animation:spin 8s linear infinite;
}

.ring2{
    width:210px;
    height:210px;
    animation:spinReverse 12s linear infinite;
}

/* Orbit dots */

.dot{
    position:absolute;
    width:10px;
    height:10px;
    border-radius:50%;
    background:#ff812d;
    box-shadow:0 0 15px #e8bc0c;
}

.dot1{
    top:25px;
    animation:orbit1 5s linear infinite;
}

.dot2{
    right:20px;
    animation:orbit2 7s linear infinite;
}

.dot3{
    bottom:25px;
    animation:orbit3 6s linear infinite;
}

.dot4{
    left:20px;
    animation:orbit4 8s linear infinite;
}

/* Center */

.center-logo{

    width:78px;
    height:78px;
    border-radius:50%;
    background:linear-gradient(135deg,#e9bf07,#e5da0c);

    display:flex;
    justify-content:center;
    align-items:center;

    box-shadow:
    0 0 25px rgba(199, 158, 9, 0.5),
    inset 0 0 10px rgba(255,255,255,.25);

    animation:pulse 2s ease infinite;

    z-index:10;
}

.center-logo span{

    color:#fff;
    font-size:36px;
    font-weight:700;
    font-family:'Red Hat Display',sans-serif;

}

.loader-container h3{

    margin-top:160px;
    color:#fff;
    letter-spacing:8px;
    font-size:24px;
    font-weight:700;

}

.loader-container p{

    margin-top:8px;
    color:#7E97B5;
    font-size:13px;
    letter-spacing:2px;

}

/* Animations */

@keyframes pulse{

0%,100%{
transform:scale(1);
}

50%{
transform:scale(1.08);
}

}

@keyframes spin{

from{
transform:rotate(0deg);
}

to{
transform:rotate(360deg);
}

}

@keyframes spinReverse{

from{
transform:rotate(360deg);
}

to{
transform:rotate(0deg);
}

}

@keyframes orbit1{

0%{transform:translate(0,0);}
25%{transform:translate(85px,35px);}
50%{transform:translate(0,80px);}
75%{transform:translate(-85px,35px);}
100%{transform:translate(0,0);}

}

@keyframes orbit2{

0%{transform:translate(0,0);}
25%{transform:translate(-35px,85px);}
50%{transform:translate(-80px,0);}
75%{transform:translate(-35px,-85px);}
100%{transform:translate(0,0);}

}

@keyframes orbit3{

0%{transform:translate(0,0);}
25%{transform:translate(-80px,-35px);}
50%{transform:translate(0,-80px);}
75%{transform:translate(80px,-35px);}
100%{transform:translate(0,0);}

}

@keyframes orbit4{

0%{transform:translate(0,0);}
25%{transform:translate(35px,-85px);}
50%{transform:translate(80px,0);}
75%{transform:translate(35px,85px);}
100%{transform:translate(0,0);}

}