/* Homepage hero refinements.
   The main composition, gradients, positioning, and typography are defined in
   styles.css. This file only enhances the subtle motion and dust treatment. */

/* Prevent the legacy static links from appearing for a frame before nav.js
   replaces them with the final compact navigation. Modern browsers reveal the
   nav as soon as the generated Archive dropdown exists. */
#site-nav{visibility:hidden}
#site-nav:has(.nav-dropdown){visibility:visible}

.hero-bg{
  animation:heroDrift 24s ease-in-out infinite alternate;
  transform-origin:70% 50%;
  will-change:transform;
}

.hero-dust{opacity:1}
.hero-dust span{
  box-shadow:0 0 12px rgba(217,190,131,.5);
  animation-name:dustVisibleRise;
  animation-timing-function:linear;
  animation-iteration-count:infinite;
}

@keyframes heroDrift{
  0%{transform:scale(1.035) translate3d(0,0,0)}
  100%{transform:scale(1.075) translate3d(-.7%,-.45%,0)}
}

@keyframes dustVisibleRise{
  0%{transform:translate3d(0,8vh,0) scale(.72);opacity:0}
  10%{opacity:.72}
  55%{opacity:.5}
  88%{opacity:.28}
  100%{transform:translate3d(var(--drift),-118vh,0) scale(1.18);opacity:0}
}

@media(max-width:800px){
  .hero-bg{animation-duration:28s}
}

@media(prefers-reduced-motion:reduce){
  .hero-bg{animation:none!important;transform:scale(1.04)!important}
  .hero-dust{display:none!important}
}