/* Blur Fade and Shine Border (Magic UI, MIT), native adaptation for FLYVECTOR.
   License retained in premium-motion.js; sources in design/21st-premium-motion.md. */
.home-copy h1 .headline-line { display: block; }
.home-airspace {
  transform: translate3d(var(--scene-x, 0px), var(--scene-y, 0px), 0) rotate(var(--scene-turn, 0deg));
  transform-origin: 52% 60%;
  transition: transform .55s cubic-bezier(.2,.7,.2,1);
}
.premium-scene-active .home-airspace { transition-duration: .28s; }

/* A single glint travelling along the dock edge, not a glowing backdrop. */
@supports ((mask-composite: exclude) or (-webkit-mask-composite: xor)) {
  .home-dock::after {
    content: '';
    position: absolute;
    inset: -8px;
    padding: 1px;
    z-index: 3;
    border-radius: 28px;
    pointer-events: none;
    background-image: radial-gradient(transparent, transparent, #a9d5f200, #f5fcffda, #8cc5eaaa, transparent, transparent);
    background-size: 300% 300%;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
  }
  .premium-effects-active .home-dock::after {
    opacity: .82;
    animation: fv-premium-shine 18s infinite linear;
  }
}

/* Blur Fade's opacity + offset + blur states, staggered for the three lines. */
@media (hover: hover) and (pointer: fine) and (min-width: 769px) and (prefers-reduced-motion: no-preference) {
  .premium-headline-enter .headline-line {
    animation: fv-premium-blur-fade .85s cubic-bezier(.2,.75,.25,1) both;
  }
  .premium-headline-enter .headline-line:nth-child(1) { animation-delay: .04s; }
  .premium-headline-enter .headline-line:nth-child(2) { animation-delay: .14s; }
  .premium-headline-enter .headline-line:nth-child(3) { animation-delay: .24s; }
  .premium-headline-enter .headline-line:nth-child(4) { animation-delay: .34s; }
}
@keyframes fv-premium-blur-fade {
  from { opacity: 0; filter: blur(6px); transform: translateY(9px); }
  to { opacity: 1; filter: blur(0); transform: translateY(0); }
}
@keyframes fv-premium-shine {
  0% { background-position: 0% 0%; }
  50% { background-position: 100% 100%; }
  100% { background-position: 0% 0%; }
}
@media (hover: none), (pointer: coarse), (max-width: 768px), (prefers-reduced-motion: reduce) {
  .home-airspace { transform: none; transition: none; }
  .home-dock::after { display: none; animation: none; }
  .home-copy h1 .headline-line { animation: none; opacity: 1; filter: none; transform: none; }
}
