/* ==============================
   CornGPT Splash Screen
   Version 1.0
============================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial, Helvetica, sans-serif;
}

body{
    width:100%;
    height:100vh;
    overflow:hidden;

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

    background:#050505;
    color:white;
}

/* Background Glow */

.background-glow{

    position:fixed;

    width:700px;
    height:700px;

    border-radius:50%;

    background:radial-gradient(circle,
    rgba(255,213,74,.22) 0%,
    rgba(0,229,255,.08) 45%,
    transparent 70%);

    filter:blur(40px);

    animation:glow 6s ease-in-out infinite;
}

@keyframes glow{

0%{
transform:scale(.9);
opacity:.6;
}

50%{
transform:scale(1.1);
opacity:1;
}

100%{
transform:scale(.9);
opacity:.6;
}

}

/* Splash */

.splash{

    position:relative;
    z-index:10;

    display:flex;
    flex-direction:column;

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

    text-align:center;

    animation:fadeUp 1s ease;
}

/* Logo */

.logo{

    width:180px;

    margin-bottom:25px;

    animation:float 3s ease-in-out infinite;
}

@keyframes float{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-12px);

}

}

/* Title */

h1{

    font-size:56px;

    color:#FFD54A;

    letter-spacing:2px;

    font-weight:700;

    text-shadow:
    0 0 10px #FFD54A,
    0 0 30px rgba(255,213,74,.45);
}

/* Tagline */

.tagline{

    margin-top:15px;

    color:#d9d9d9;

    font-size:18px;

    letter-spacing:1px;
}

/* Loader */

.loader{

    margin-top:40px;

    display:flex;
    gap:10px;
}

.dot{

    width:14px;
    height:14px;

    border-radius:50%;

    background:#FFD54A;

    animation:bounce .8s infinite alternate;
}

.dot:nth-child(2){

animation-delay:.2s;

}

.dot:nth-child(3){

animation-delay:.4s;

}

@keyframes bounce{

from{

transform:translateY(0);

}

to{

transform:translateY(-15px);

}

}

/* Fade */

@keyframes fadeUp{

from{

opacity:0;

transform:translateY(25px);

}

to{

opacity:1;

transform:translateY(0);

}

}

/* Responsive */

@media(max-width:768px){

.logo{

width:150px;

}

h1{

font-size:42px;

}

.tagline{

font-size:15px;

}

.background-glow{

width:500px;
height:500px;

}

}