
body.landing{
  margin:0;
  overflow:hidden;
  background: url('../img/bg.png') center 65% / cover no-repeat;
  animation: slowZoom 40s ease-in-out infinite alternate;
}

@keyframes slowZoom{
  from{ background-size:100%; }
  to{ background-size:110%; }
}

.overlay{
  position:absolute;
  width:100%;
  height:100%;
  background: radial-gradient(circle at center, rgba(0,0,0,.3), rgba(0,0,0,.85));
}

.landing-topbar{
  position:absolute;
  top:20px;
  right:20px;
  display:flex;
  gap:10px;
  z-index:2;
}

.landing-center{
  height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  z-index:2;
  position:relative;
  padding:20px;
}

.landing-logo{
  width:420px;
  max-width:80%;
  margin-bottom:20px;
  animation: glow 3s ease-in-out infinite alternate;
}

@keyframes glow{
  from{ filter:drop-shadow(0 0 10px rgba(255,200,100,.4)); }
  to{ filter:drop-shadow(0 0 35px rgba(255,200,100,.9)); }
}

.landing-center h1{
  font-size:clamp(28px,5vw,48px);
  margin-bottom:12px;
}

.landing-center p{
  max-width:520px;
  margin-bottom:20px;
  color:#ccc;
}

.landing-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:center;
}

.pulse{
  animation:pulseGlow 2s infinite;
}

@keyframes pulseGlow{
  0%{box-shadow:0 0 0 rgba(245,188,67,.4);}
  50%{box-shadow:0 0 20px rgba(245,188,67,.8);}
  100%{box-shadow:0 0 0 rgba(245,188,67,.4);}
}

.mist{
  position:absolute;
  width:200%;
  height:100%;
  background: radial-gradient(circle, rgba(255,255,255,.05), transparent 70%);
  animation: drift 30s linear infinite;
}

@keyframes drift{
  from{ transform:translateX(0); }
  to{ transform:translateX(-50%); }
}

.particles div{
  position:absolute;
  width:3px;
  height:3px;
  background:rgba(255,200,100,.7);
  border-radius:50%;
  animation:float linear infinite;
}

@keyframes float{
  from{ transform:translateY(0); }
  to{ transform:translateY(-100vh); }
}

/* MOBILE OPTIMISATION */
@media (max-width: 768px){

  body.landing{
    animation:none;
    background: url('../img/bg-mobile.png') center 70% / cover no-repeat;
  }

  .mist{
    display:none;
  }

  .particles{
    display:none;
  }

}
