/* ==========================================================================
   NEXCORE MOTION PRIMITIVES
   Only transform / opacity / clip-path are animated (spec §24).
   Every primitive has a static resting state, so the page is complete and
   readable with JS off or reduced-motion on (spec §26, §29).
   ========================================================================== */

/* --------------------------------------------------------------------------
   Masked line reveal — the signature headline treatment (§3, §4).
   Text is real, present at first paint, and only *revealed*, never injected.
   -------------------------------------------------------------------------- */
.nx-mask{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
/* Clip is for the vertical rise only — a line narrower than its text must
   wrap, not disappear off the right edge of the mask. */
.nx-mask,.nx-mask__inner{overflow-wrap:break-word}
.nx-mask__inner{display:block;will-change:transform}

/* JS-only starting states. Without .nx-js everything renders at rest. */
.nx-js .nx-mask__inner{transform:translate3d(0,110%,0)}
.nx-js .nx-mask.is-shown .nx-mask__inner{
  transform:translate3d(0,0,0);
  transition:transform var(--dur-major) var(--ease-standard) var(--nx-delay,0ms);
}

/* --------------------------------------------------------------------------
   Generic reveal — data-nx-reveal="up|fade|clip|scale"
   -------------------------------------------------------------------------- */
.nx-js [data-nx-reveal]{opacity:0;will-change:transform,opacity}
.nx-js [data-nx-reveal="up"]     {transform:translate3d(0,22px,0)}
.nx-js [data-nx-reveal="right"]  {transform:translate3d(-22px,0,0)}
.nx-js [data-nx-reveal="scale"]  {transform:scale(.985)}
.nx-js [data-nx-reveal="clip"]   {opacity:1;clip-path:inset(0 0 100% 0)}
.nx-js [data-nx-reveal="line"]   {opacity:1;transform:scaleX(0);transform-origin:left center}

.nx-js [data-nx-reveal].is-shown{
  opacity:1; transform:none; clip-path:inset(0 0 0 0);
  transition:opacity var(--dur-section) var(--ease-standard) var(--nx-delay,0ms),
             transform var(--dur-section) var(--ease-standard) var(--nx-delay,0ms),
             clip-path var(--dur-major) var(--ease-standard) var(--nx-delay,0ms);
}
/* will-change is dropped once the reveal has run (§24). */
.nx-js [data-nx-reveal].is-done{will-change:auto}

/* --------------------------------------------------------------------------
   Image reveal — mask wipe + 1.03 → 1 settle (§7)
   -------------------------------------------------------------------------- */
.nx-reveal-img{position:relative;overflow:hidden;display:block}
.nx-js .nx-reveal-img > img,
.nx-js .nx-reveal-img > picture > img{transform:scale(1.03);will-change:transform}
.nx-js .nx-reveal-img::after{
  content:'';position:absolute;inset:0;background:var(--nx-ink);transform-origin:bottom center;
  transform:scaleY(1);
}
.nx-js .nx-reveal-img.is-shown::after{
  transform:scaleY(0);transform-origin:top center;
  transition:transform var(--dur-major) var(--ease-dramatic) var(--nx-delay,0ms);
}
.nx-js .nx-reveal-img.is-shown > img,
.nx-js .nx-reveal-img.is-shown > picture > img{
  transform:scale(1);
  transition:transform 1100ms var(--ease-standard) var(--nx-delay,0ms);
}

/* --------------------------------------------------------------------------
   Parallax — 3–8% max, transform only (§5)
   -------------------------------------------------------------------------- */
.nx-parallax{will-change:transform}

/* --------------------------------------------------------------------------
   Lattice draw-on (§5 capabilities / §14)
   -------------------------------------------------------------------------- */
.nx-js .nx-lattice [data-draw]{stroke-dasharray:var(--len);stroke-dashoffset:var(--len)}
.nx-js .nx-lattice.is-shown [data-draw]{stroke-dashoffset:0;
  transition:stroke-dashoffset 1400ms var(--ease-standard) var(--nx-delay,0ms)}
.nx-js .nx-lattice circle{transform:scale(0);transform-origin:center;transform-box:fill-box}
.nx-js .nx-lattice.is-shown circle{transform:scale(1);
  transition:transform var(--dur-card) var(--ease-standard) var(--nx-delay,0ms)}

/* --------------------------------------------------------------------------
   Hero entrance timeline (§3): 100ms label → 200–500ms headline →
   500–700ms paragraph → 650–850ms CTA → 700ms+ hero visual.
   Delays are applied as tokens so the sequence is declared, not scattered.
   -------------------------------------------------------------------------- */
.nx-hero .nx-eyebrow{--nx-delay:100ms}
.nx-hero .nx-mask:nth-of-type(1) .nx-mask__inner{--nx-delay:200ms}
.nx-hero .nx-mask:nth-of-type(2) .nx-mask__inner{--nx-delay:290ms}
.nx-hero .nx-mask:nth-of-type(3) .nx-mask__inner{--nx-delay:380ms}
.nx-hero .nx-mask:nth-of-type(4) .nx-mask__inner{--nx-delay:470ms}
.nx-hero [data-nx-hero="lead"]{--nx-delay:560ms}
.nx-hero [data-nx-hero="cta"]{--nx-delay:680ms}
.nx-hero [data-nx-hero="scroll"]{--nx-delay:800ms}
.nx-hero [data-nx-hero="visual"]{--nx-delay:720ms}

/* Header enters after the hero has committed (§10). */
.nx-js .nx-header{transform:translateY(-100%);opacity:0}
.nx-js .nx-header.is-ready{transform:none;opacity:1;
  transition:transform var(--dur-major) var(--ease-standard),opacity var(--dur-section) linear}
.nx-js .nx-header.is-ready.is-hidden{transform:translateY(-102%)}

/* ==========================================================================
   REDUCED MOTION (§26)
   Non-essential motion is removed, never the content or the layout.
   ========================================================================== */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  .nx-js .nx-mask__inner{transform:none!important}
  .nx-js [data-nx-reveal]{opacity:1!important;transform:none!important;clip-path:none!important}
  .nx-js .nx-reveal-img::after{display:none}
  .nx-js .nx-reveal-img > img{transform:none!important}
  .nx-js .nx-lattice [data-draw]{stroke-dasharray:none;stroke-dashoffset:0}
  .nx-js .nx-lattice circle{transform:none}
  .nx-js .nx-header{transform:none;opacity:1}
  .nx-marquee__track{animation:none;transform:none}
  .nx-parallax{transform:none!important}
  .nx-loader,.nx-js .nx-loader{display:none!important}
  .nx-cursor{display:none!important}
  .nx-curtain{display:none}
  .nx-mobile{transition:none}
  .nx-menu-open .nx-mobile__links a > span{transform:none}
}