body{
margin:0;
font-family:Arial, Helvetica, sans-serif;
background:#07070a;
color:white;
overflow:hidden;
}

/* partículas */

#particles{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
z-index:0;
}

/* panel central */

.panel{

position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);

background:rgba(20,20,30,0.6);

backdrop-filter:blur(10px);

padding:50px;

border-radius:15px;

text-align:center;

z-index:2;

box-shadow:0 0 40px rgba(236, 33, 36,0.3);
opacity: 0;
animation: panelEntry 1.5s ease forwards;
}

/* logo */

.logo{
width:220px;
margin-bottom:20px;

filter:drop-shadow(0 0 15px #ec2124cc);
}

h1{
color:#ec2124cc;
margin-bottom:10px;
}

p{
color:#cccccc;
}

/* autoelevador */

.forklift{

position:absolute;
bottom:60px;

right:-300px;

width:180px;

z-index:1;

animation:drive 20s linear infinite;
}

@keyframes drive{

0%{
right:-300px;
}

100%{
right:110%;
}

}

/* footer */

footer{

position:absolute;
bottom:10px;
width:100%;

text-align:center;

font-size:12px;

color:#888;

z-index:2;
}

@keyframes panelEntry{

0%{
opacity:0;
transform:translate(-50%,-30%);
}

100%{
opacity:1;
transform:translate(-50%,-50%);
}

}