/* ==========================================================================
   Thinkhub — Preloader
   Overlay de carga a pantalla completa con el isotipo animado por código:
   cada punto del logo aparece y se retrae en secuencia, como si el propio
   isotipo se fuera armando en loop (sin depender de un gif). Se oculta vía
   JS (assets/js/preloader.js) apenas termina de cargar la página, con un
   mínimo de tiempo visible para que no parpadee en conexiones rápidas.
   Vive en su propio archivo para poder incluirse igual en todas las
   páginas del sitio sin pisar main.css.
   ========================================================================== */

html.is-loading,
html.is-loading body {
  overflow: hidden;
  height: 100%;
}

.preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #FFFFFF;
  transition: opacity .5s cubic-bezier(.4,0,.2,1), visibility .5s;
}

.preloader__iso {
  width: clamp(64px, 9vw, 96px);
  height: auto;
  overflow: visible;
}

.preloader__iso .iso-dot {
  transform-box: fill-box;
  transform-origin: center;
  opacity: 0;
  animation: iso-pop 2s cubic-bezier(.4,0,.2,1) infinite;
}

/* Stagger: cada punto entra un poco después del anterior, armando el
   isotipo de a poco y desarmándolo igual, en loop continuo. */
.preloader__iso .iso-dot:nth-child(1)  { animation-delay: .00s; }
.preloader__iso .iso-dot:nth-child(2)  { animation-delay: .05s; }
.preloader__iso .iso-dot:nth-child(3)  { animation-delay: .10s; }
.preloader__iso .iso-dot:nth-child(4)  { animation-delay: .15s; }
.preloader__iso .iso-dot:nth-child(5)  { animation-delay: .20s; }
.preloader__iso .iso-dot:nth-child(6)  { animation-delay: .25s; }
.preloader__iso .iso-dot:nth-child(7)  { animation-delay: .30s; }
.preloader__iso .iso-dot:nth-child(8)  { animation-delay: .35s; }
.preloader__iso .iso-dot:nth-child(9)  { animation-delay: .40s; }
.preloader__iso .iso-dot:nth-child(10) { animation-delay: .45s; }
.preloader__iso .iso-dot:nth-child(11) { animation-delay: .50s; }
.preloader__iso .iso-dot:nth-child(12) { animation-delay: .55s; }
.preloader__iso .iso-dot:nth-child(13) { animation-delay: .60s; }
.preloader__iso .iso-dot:nth-child(14) { animation-delay: .65s; }
.preloader__iso .iso-dot:nth-child(15) { animation-delay: .70s; }
.preloader__iso .iso-dot:nth-child(16) { animation-delay: .75s; }
.preloader__iso .iso-dot:nth-child(17) { animation-delay: .80s; }

@keyframes iso-pop {
  0%   { opacity: 0; transform: scale(0); }
  14%  { opacity: 1; transform: scale(1.2); }
  26%  { opacity: 1; transform: scale(1); }
  66%  { opacity: 1; transform: scale(1); }
  82%  { opacity: 0; transform: scale(.3); }
  100% { opacity: 0; transform: scale(0); }
}

.preloader.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .preloader__iso .iso-dot {
    animation: none;
    opacity: 1;
    transform: none;
  }
}
