/* === css/intel-building/components/preloader.css === v1.0.0 ===
   Intel Building — full-page preloader shown until the page has finished
   loading (see js/intel-building/components/preloader.js), then fades out
   and is removed. Dark, theme-matched to the hero/header overlay tone;
   built entirely from existing design tokens (base/variables.css). The
   mark reuses the same icon geometry as x-intel-building.logo. */

.plx-preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-5);
  background: var(--color-dark);
  transition: opacity 400ms ease, visibility 400ms ease;
}

.plx-preloader[data-plx-hidden="true"] {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.plx-preloader-mark {
  width: 56px;
  height: auto;
  animation: plx-preloader-pulse 1.6s ease-in-out infinite;
}

.plx-preloader-bar {
  width: 120px;
  height: 3px;
  border-radius: var(--radius-pill);
  background: rgba(255, 255, 255, 0.12);
  overflow: hidden;
}

.plx-preloader-bar::after {
  content: '';
  display: block;
  width: 40%;
  height: 100%;
  border-radius: inherit;
  background: var(--color-primary);
  animation: plx-preloader-track 1.2s ease-in-out infinite;
}

@keyframes plx-preloader-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.55; transform: scale(0.92); }
}

@keyframes plx-preloader-track {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(350%); }
}

@media (prefers-reduced-motion: reduce) {
  .plx-preloader-mark,
  .plx-preloader-bar::after {
    animation: none;
  }
}