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

body{
height:100vh;
display:flex;
justify-content:center;
align-items:center;
background:linear-gradient(
135deg,
#1877f2,
#0f5fd7
);
overflow:hidden;
}

.splash-container{
text-align:center;
color:#fff;
padding:20px;
}

.logo-box{
width:120px;
height:120px;
background:#fff;
border-radius:30px;
display:flex;
justify-content:center;
align-items:center;
margin:auto;
margin-bottom:25px;
box-shadow:0 10px 30px rgba(0,0,0,.2);
animation:zoom 1.5s infinite alternate;
}

.logo{
width:80px;
height:80px;
object-fit:contain;
}

.splash-container h1{
font-size:32px;
font-weight:700;
margin-bottom:10px;
}

.splash-container p{
font-size:16px;
opacity:.9;
margin-bottom:35px;
}

/* Loader */

.loader{
display:flex;
justify-content:center;
gap:8px;
}

.loader span{
width:12px;
height:12px;
background:#fff;
border-radius:50%;
animation:bounce 1s infinite;
}

.loader span:nth-child(2){
animation-delay:.2s;
}

.loader span:nth-child(3){
animation-delay:.4s;
}

@keyframes bounce{

0%,100%{
transform:translateY(0);
opacity:.5;
}

50%{
transform:translateY(-10px);
opacity:1;
}

}

@keyframes zoom{

from{
transform:scale(1);
}

to{
transform:scale(1.08);
}

}