/* One continuous arrival: horizontal light, independent sparks, then the hero. */
.opening-field, .opening-skip { display: none; }
.opening-active .opening-field {
  display: block; position: absolute; top: 64%; left: 0; right: 0; height: 1px;
  z-index: 2; pointer-events: none;
}
.opening-field:before {
  content: ''; position: absolute; inset: 0; height: 1px;
  background: linear-gradient(90deg, transparent, #a78bfa88 25%, #ffb4ce 50%, #a78bfa88 75%, transparent);
  box-shadow: 0 0 16px 2px #a78bfa40;
  animation: opening-horizon 1500ms var(--ease) both;
}
.opening-spark {
  position: absolute; left: var(--left); top: 0; width: var(--size); height: var(--size);
  border-radius: 50%; background: var(--color); box-shadow: 0 0 8px 2px var(--color);
  animation: opening-spark var(--flight) linear var(--delay) both;
}
.opening-active .opening-skip {
  display: inline-flex; align-items: center; gap: 15px; position: absolute;
  z-index: 4; right: 5vw; bottom: 5%; min-height: 44px; padding: 10px 0;
  color: var(--bone); font-size: 12px; letter-spacing: .1em;
}
.opening-skip span { color: var(--violet); }
.opening-skip:hover { color: var(--pink); }
.opening-active .hero-haze { animation: opening-haze 1500ms var(--ease) both; }
.opening-active .orbit-stage { animation: opening-sea 1500ms var(--ease) both; }
.opening-active .hero:after { animation: opening-sea 1500ms var(--ease) both; }
.opening-active .hero-copy { animation: opening-copy 1500ms var(--ease) both; }
.opening-active .hero-hud, .opening-active .hero-foot,
.opening-active .hero-scroll, .opening-active .hero-preview-note,
.opening-active .spark-button, .opening-active .site-header nav {
  animation: opening-details 1500ms var(--ease) both;
}
@keyframes opening-horizon {
  0% { transform: scaleX(0); opacity: 0; }
  25% { opacity: 1; }
  60% { transform: scaleX(1); opacity: .7; }
  100% { transform: scaleX(1); opacity: 0; }
}
@keyframes opening-spark {
  0% { opacity: 0; transform: translate(0, 8px); }
  25% { opacity: .8; }
  70% { opacity: .55; }
  100% { opacity: 0; transform: translate(var(--drift), var(--rise)); }
}
@keyframes opening-haze {
  0% { opacity: 0; }
  40% { opacity: .35; }
  100% { opacity: 1; }
}
@keyframes opening-sea {
  0%, 25% { opacity: 0; }
  80%, 100% { opacity: 1; }
}
@keyframes opening-copy {
  0%, 45% { opacity: 0; translate: 0 14px; }
  100% { opacity: 1; translate: 0 0; }
}
@keyframes opening-details {
  0%, 55% { opacity: 0; }
  100% { opacity: 1; }
}
@media (max-width: 800px) {
  .opening-active .opening-skip { right: 24px; bottom: 3%; font-size: 11px; }
  .opening-spark { box-shadow: 0 0 6px 1px var(--color); }
}
@media (prefers-reduced-motion: reduce) {
  .opening-active .opening-field, .opening-active .opening-skip { display: none; }
}
