/* ================================================================
   NO PERRY — Hero base layout (welcome-16)
   Letter formation only — no impact / ballistic / fire portal VFX.
   ================================================================ */

.hero-impact-stage {
  position: relative;
  width: 100%;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

html.np-cinematic:not(.np-entered):not(.np-reduced) .hero-title-no-motion,
html.np-cinematic:not(.np-entered):not(.np-reduced) .hero-title-perry-motion {
  opacity: 0;
  transform: translate3d(0, -48vh, 0);
  will-change: transform;
}

.hero-title-no-motion,
.hero-title-perry-motion {
  display: inline-block;
  position: relative;
}

.hero-title-perry-halo {
  position: absolute;
  left: 50%;
  top: 48%;
  width: 72%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(
    circle at 50% 50%,
    rgba(143, 166, 91, 0.22) 0%,
    rgba(102, 122, 62, 0.10) 32%,
    rgba(63, 76, 39, 0.04) 52%,
    transparent 70%
  );
  filter: blur(28px);
  pointer-events: none;
  z-index: 0;
}

.hero-perry-word {
  position: relative;
  z-index: 2;
  display: inline-block;
  background-image: linear-gradient(
    168deg,
    var(--np-moss-dark, #3F4C27) 0%,
    var(--np-moss-main, #667A3E) 26%,
    var(--np-moss-readable, #8FA65B) 47%,
    var(--np-moss-readable, #8FA65B) 55%,
    var(--np-moss-hover, #5A6E38) 78%,
    var(--np-moss-deep, #303A20) 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--np-moss-readable);
}

/* 34A1 — fail-open / entered must not compete with prologue title ownership */
html.np-reveal-failopen.np-entered:not(.np-copy-prologue) .hero-title-no-motion,
html.np-reveal-failopen.np-entered:not(.np-copy-prologue) .hero-title-perry-motion,
html.np-reveal-failopen.np-copy-done:not(.np-copy-prologue) .hero-title-no-motion,
html.np-reveal-failopen.np-copy-done:not(.np-copy-prologue) .hero-title-perry-motion {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  filter: none !important;
}

html.np-entered:not(.np-copy-prologue) .hero-title-no-motion,
html.np-entered:not(.np-copy-prologue) .hero-title-perry-motion,
html.np-reduced:not(.np-copy-prologue) .hero-title-no-motion,
html.np-reduced:not(.np-copy-prologue) .hero-title-perry-motion {
  opacity: 1;
  transform: none;
}

html.np-entered .hero-impact-stage,
html.np-reduced .hero-impact-stage {
  transform: none;
  filter: none;
}