/* A brief brand arrival before the homepage, independent of network or JS. */
.homepage-intro {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  place-items: center;
  background: radial-gradient(ellipse at 50% 55%, #ff6a0017, transparent 45%), #080a0b;
  animation: homepage-intro-out .3s ease 1s forwards;
}
.homepage-intro-mark { width: 150px; text-align: center; }
.homepage-intro-mark img {
  width: 112px;
  height: 112px;
  object-fit: contain;
  margin: 0 auto 26px;
  filter: drop-shadow(0 0 18px #ff6a0038);
  animation: homepage-intro-in .6s ease-out both;
}
.homepage-intro-track {
  display: block;
  height: 2px;
  background: #f47b36;
  transform-origin: left;
  animation: homepage-intro-progress .85s ease-out both;
}
@keyframes homepage-intro-in {
  from { opacity: 0; transform: translateY(8px) scale(.96); }
  to { opacity: 1; transform: none; }
}
@keyframes homepage-intro-progress {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}
@keyframes homepage-intro-out {
  to { opacity: 0; visibility: hidden; pointer-events: none; }
}
/* Keyboard users can reach the page immediately; reduced motion skips the intro. */
body:has(:focus-visible) > .homepage-intro { display: none; }
@media (prefers-reduced-motion: reduce) {
  .homepage-intro { display: none; }
}