#preloader {
  position: fixed;
  inset: 0;
  background: #0a2a66;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;
}

/* LOGO */
.preloader-logo {
  width: 1050px;
  max-width: 65vw;

  opacity: 0;
  transform: scale(0.7);

  will-change: transform, opacity;

  animation: logoSmooth 1.2s ease-out forwards;
}

/* ANIMACIÓN NATURAL */
@keyframes logoSmooth {

  /* entrada rápida */
  0% {
    opacity: 0;
    transform: scale(0.7);
  }

  40% {
    opacity: 1;
    transform: scale(1.15);
  }

  /* micro rebote (esto quita lo robótico) */
  55% {
    transform: scale(1);
  }

  70% {
    transform: scale(1.05);
  }

  /* salida */
  100% {
    opacity: 0;
    transform: scale(1.6);
  }
}

/* fade overlay */
#preloader.hide {
  opacity: 0;
  transition: opacity 0.35s ease;
  pointer-events: none;
}