/* Rocket flight path: a rocket rides the right edge as you scroll, leaves a lime trail, and docks in the contact section. */
.rp-track {
  position: fixed; z-index: 70; top: 0; bottom: 0; right: 22px; width: 2px; pointer-events: none;
  background: repeating-linear-gradient(to bottom, rgba(201,243,29,.85) 0 5px, transparent 5px 13px);
  filter: drop-shadow(0 0 1px rgba(11,14,17,.75));
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 14%, #000 86%, transparent); mask-image: linear-gradient(to bottom, transparent, #000 14%, #000 86%, transparent);
  transition: opacity .4s ease;
}
/* the solid glowing trail is switched off; only the dotted track + rocket remain */
.rp-trail { display: none; }
.rp-rocket {
  position: fixed; z-index: 72; left: 0; top: 0; width: 34px; height: 34px; margin: -17px 0 0 -17px; pointer-events: none;
  will-change: transform; transform: translate3d(var(--rx, 0px), var(--ry, 0px), 0) rotate(var(--ra, 180deg));
}
.rp-rocket img { display: block; width: 100%; height: 100%; transform: rotate(-45deg); filter: drop-shadow(0 0 1px rgba(11,14,17,.9)) drop-shadow(0 2px 3px rgba(11,14,17,.45)) drop-shadow(0 0 8px rgba(201,243,29,.6)); }
.rp-rocket::after { /* exhaust, sits at the rocket's tail */
  content: ''; position: absolute; left: 50%; top: 86%; width: 6px; height: calc(8px + var(--flame, 0) * 34px); margin-left: -3px; border-radius: 0 0 6px 6px;
  background: linear-gradient(#c9f31d, rgba(201,243,29,0)); opacity: calc(.25 + var(--flame, 0) * .75); filter: blur(1px);
}
.rp-dock {
  position: absolute; z-index: 2; width: 92px; height: 92px; right: 14%; top: 17%; margin: 0; border-radius: 50%; pointer-events: none;
  border: 1.5px dashed rgba(201,243,29,.6); display: grid; place-items: center; opacity: .55; transition: opacity .5s ease, transform .6s cubic-bezier(.2,1.4,.4,1);
}
.rp-dock::before { content: ''; position: absolute; inset: 14px; border-radius: 50%; border: 1px solid rgba(255,255,255,.35); }
.rp-dock.is-docked { opacity: 1; transform: scale(1.12); }
.rp-dock.is-docked::after {
  content: ''; position: absolute; inset: -2px; border-radius: 50%; border: 2px solid #c9f31d; animation: rp-ping 1.6s ease-out infinite;
}
@keyframes rp-ping { from { transform: scale(1); opacity: .9; } to { transform: scale(1.9); opacity: 0; } }

@media (max-width: 680px) {
  .rp-track, .rp-trail { right: 12px; }
  .rp-rocket { width: 26px; height: 26px; margin: -13px 0 0 -13px; }
  .rp-dock { width: 70px; height: 70px; right: 8%; top: 8%; }
}
@media (prefers-reduced-motion: reduce) { .rp-track, .rp-trail, .rp-rocket, .rp-dock { display: none; } }
