/* Particle Rocket — canvas stage on the home hero */

.hero-home {
  position: relative;
}
.hero-home.has-rocket-stage {
  /* Reserve a stage area to the right of the hero copy on wide screens.
     On narrow screens it stacks above the copy. */
}

/* Anchor the existing brand glow to the same right-side spot as the rocket
   so the rocket sits inside its own halo of light — replaces the old
   bottom-right corner glow + the removed cursor spotlight. */
.hero-home.has-rocket-stage::after {
  bottom: auto;
  right: 4%;
  top: 50%;
  width: 560px;
  height: 560px;
  transform: translateY(-50%);
  background: radial-gradient(
    circle,
    rgba(89, 175, 240, 0.32) 0%,
    rgba(30, 95, 200, 0.18) 30%,
    transparent 65%
  );
}

.rocket-stage {
  position: absolute;
  top: 50%;
  right: 4%;
  transform: translateY(-50%);
  width: 520px;
  height: 520px;
  z-index: 1;
  pointer-events: none;
  filter: drop-shadow(0 0 28px rgba(89, 175, 240, 0.28));
}
.rocket-stage canvas {
  display: block;
  width: 100%;
  height: 100%;
}

/* On narrower screens, drop the stage in behind the copy at full bleed */
@media (max-width: 1100px) {
  .hero-home.has-rocket-stage::after {
    top: 0;
    right: auto;
    left: 50%;
    transform: translate(-50%, 0);
    width: min(560px, 95%);
    height: 420px;
  }
  .rocket-stage {
    top: 0;
    left: 50%;
    right: auto;
    transform: translate(-50%, 0);
    width: min(520px, 90%);
    height: 380px;
    opacity: 0.7;
  }
}

@media (max-width: 700px) {
  .rocket-stage {
    height: 300px;
    opacity: 0.55;
  }
}

.hero-home > .hero-copy {
  position: relative;
  z-index: 2;
}

/* On wide screens, give the hero a true split layout: copy lives in a
   constrained left column, rocket + glow live cleanly on the right.
   No more title-text overlap with the rocket. */
@media (min-width: 1100px) {
  .page-home .hero-home {
    text-align: left;
  }
  .page-home .hero-copy {
    max-width: 560px;
    margin-left: 4%;
    margin-right: auto;
    text-align: left;
  }
  .page-home .hero-copy .hero-actions {
    justify-content: flex-start;
  }
}