/* SPARK Logistics — preloader splash */

.preloader {
  position: fixed;
  inset: 0;
  z-index: var(--z-preloader);
  display: grid;
  place-items: center;
  background: var(--color-white);
  transition:
    opacity var(--dur-slow, 0.6s) var(--ease-out),
    visibility 0s linear 0.6s;
}

/* Logo breathes softly while assets load */
.preloader img {
  inline-size: clamp(11rem, 30vw, 17rem);
  block-size: auto;
  animation: preloader-breathe 1.6s ease-in-out infinite alternate;
  transition: translate 0.6s var(--ease-out);
}

@keyframes preloader-breathe {
  from { scale: 1; opacity: 0.82; }
  to   { scale: 1.04; opacity: 1; }
}

/* Exit state — JS removes the node after the fade */
.preloader.is-done {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity var(--dur-slow, 0.6s) var(--ease-out),
    visibility 0s linear 0.6s;
}

.preloader.is-done img {
  translate: 0 -0.75rem;
  animation-play-state: paused;
}

/* Freeze the page while the splash is up */
html.is-preloading {
  overflow: hidden;
}