/* ============================================================
   VEEDA — homepage (the original coming-soon stage, kept intact)
   Loads after base.css and stage.css.
   ============================================================ */

/* The hallway photo as atmosphere: the corridor's neon door frame
   becomes the apparent source of the page glow. Never the subject. */
.hall {
  position: absolute;
  inset: 0;
  background: url("/assets/photos/hallway.jpg") center 30% / cover no-repeat;
  opacity: 0.20;
  filter: blur(7px) saturate(1.15) brightness(0.92);
  -webkit-mask-image: radial-gradient(ellipse 60% 68% at 50% 44%, #000 0%, transparent 74%);
  mask-image: radial-gradient(ellipse 60% 68% at 50% 44%, #000 0%, transparent 74%);
  transform: scale(1.06);
  animation: hall-drift 36s ease-in-out infinite alternate;
  pointer-events: none;
}

@keyframes hall-drift {
  from { transform: scale(1.06); }
  to   { transform: scale(1.13); }
}

.logo {
  position: relative;
  width: min(78vw, 460px);
  height: auto;
  mix-blend-mode: screen;
  animation: flicker 7s linear infinite;
  transition: transform 0.15s ease-out;
  transform-style: preserve-3d;
  will-change: transform;
}

.intro-logo {
  animation: flicker 7s linear infinite, logo-in 1.1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes flicker {
  0%, 19%, 21%, 23%, 80%, 100% { opacity: 1; }
  20% { opacity: 0.85; }
  22% { opacity: 0.96; }
}

@keyframes logo-in {
  from { width: min(68vw, 400px); }
  to   { width: min(78vw, 460px); }
}

/* Nav arrives after the headline has landed. Opacity animates only on
   leaf elements — never on an ancestor of the blend-mode logo mark
   (Chromium rasterization bug). */
.nav-intro .nav-links a {
  opacity: 0;
  animation: late-in 1s ease-out 1.7s forwards;
}

.nav-intro .nav-mark img {
  opacity: 0;
  animation: late-in 1s ease-out 1.7s forwards, flicker 7s linear 2.7s infinite;
}

@media (prefers-reduced-motion: reduce) {
  .hall { animation: none; }
  .logo, .intro-logo { animation: none; opacity: 1; }
  .nav-intro .nav-mark img, .nav-intro .nav-links a { animation: none; opacity: 1; }
}