/* BRASA — the short loading state. Dark ground, an ember, then the hero.
   It removes itself after ~900ms and is skipped entirely on a warm cache. */

.preloader {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 1.1rem;
  background: var(--black);
  transition: opacity .7s var(--ease-out), visibility .7s;
}
.preloader[hidden] { display: none; }
.preloader.is-done {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.preloader .ember-mark { width: 34px; height: 40px; }

.preloader__word {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 7vw, 3.6rem);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--cream);
  overflow: hidden;
}
.preloader__word > i {
  display: block;
  font-style: normal;
  animation: pre-rise .8s var(--ease-out) both;
}
.preloader__line {
  font-size: var(--t-label);
  letter-spacing: var(--track-label);
  text-transform: uppercase;
  color: var(--cream-52);
  opacity: 0;
  animation: pre-fade .6s var(--ease-out) .35s forwards;
}

@keyframes pre-rise { from { transform: translateY(105%); } to { transform: none; } }
@keyframes pre-fade { to { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  .preloader__word > i, .preloader__line { animation: none; opacity: 1; transform: none; }
}