/* A luz revela a tinta da headline; as formas tipográficas permanecem estáveis. */
.zx-copy { position: relative; isolation: isolate; }
.zx-title-line, .zx-title-ink { display: block; }
.zx-title-ink { width: fit-content; max-width: 100%; }

@media (prefers-reduced-motion: no-preference) {
  .zx-page.zx-hero-is-entering {
    --hero-enter-ease: cubic-bezier(.19, 1, .22, 1);
  }
  .zx-hero-is-entering .zx-header::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
    background: linear-gradient(90deg, transparent, var(--color-voltage), var(--white-a180), transparent);
    transform-origin: 0 50%; pointer-events: none;
    animation: zx-hero-signal-enter 1000ms var(--hero-enter-ease) both;
  }
  @supports ((background-clip: text) or (-webkit-background-clip: text)) {
    .zx-hero-is-entering .zx-title-ink {
      background-image: linear-gradient(108deg,
        var(--color-ink-primary) 0%, var(--color-ink-primary) 34%,
        white 41%, var(--color-ink-primary) 44%,
        var(--color-ink-secondary) 55%, var(--color-ink-secondary) 100%);
      background-size: 300% 100%; background-position: 100% 0;
      background-clip: text; -webkit-background-clip: text; color: transparent;
      animation: zx-hero-title-exposure var(--dur-enter) var(--ease-out) 60ms both;
    }
    .zx-hero-is-entering .zx-title-line:nth-child(2) .zx-title-ink { animation-delay: 180ms; }
    .zx-hero-is-entering .zx-title-line:last-child .zx-title-ink { animation-delay: 300ms; }
  }
  .zx-hero-is-entering .zx-description { animation: zx-hero-copy-resolve 800ms var(--hero-enter-ease) 340ms both; }
  .zx-hero-is-entering .zx-primary { position: relative; overflow: hidden; isolation: isolate; }
  .zx-hero-is-entering .zx-primary::before {
    content: ''; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
    background: linear-gradient(112deg, transparent 28%, var(--white-a550) 49%, transparent 67%);
    animation: zx-hero-conversion-light 660ms cubic-bezier(.32, 0, .16, 1) 1460ms both;
  }
  .zx-hero-is-entering .zx-arrow { animation: zx-hero-arrow-lock 700ms var(--hero-enter-ease) 1180ms both; }
  .zx-hero-is-entering .zx-reassurance { animation: zx-hero-detail-enter 700ms var(--hero-enter-ease) 620ms both; }
  .zx-hero-is-entering .zx-founder { animation: zx-hero-detail-enter 600ms var(--hero-enter-ease) 980ms both; }
  .zx-hero-is-entering .zx-header-cta { animation: zx-hero-action-enter 650ms var(--hero-enter-ease) 100ms both; }
  .zx-hero-is-entering .zx-visual { perspective: 1400px; }
  .zx-hero-is-entering .zx-deck-stage { animation: zx-hero-deck-enter 1300ms var(--hero-enter-ease) 180ms both; }
  .zx-hero-is-entering .zx-deck-slot[data-deck-depth="front"] .zx-deck-card::before {
    content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(112deg, transparent 18%, var(--white-a060) 45%, var(--white-a090) 50%, transparent 74%);
    animation: zx-hero-light-enter 900ms cubic-bezier(.25, .1, .25, 1) 350ms both;
  }
  .zx-hero-is-entering .zx-deck-example,
  .zx-hero-is-entering .zx-deck-controls,
  .zx-hero-is-entering .zx-hero-utility { animation: zx-hero-detail-enter 600ms var(--hero-enter-ease) 700ms both; }

  @keyframes zx-hero-title-exposure {
    from { background-position: 100% 0; }
    to { background-position: 0% 0; }
  }
  @keyframes zx-hero-copy-resolve {
    from { opacity: .55; transform: translate3d(-8px, 0, 0); }
    to { opacity: 1; transform: translate3d(0, 0, 0); }
  }
  @keyframes zx-hero-conversion-light {
    0% { opacity: 0; transform: translateX(-120%); }
    22% { opacity: .8; }
    78% { opacity: .8; }
    100% { opacity: 0; transform: translateX(120%); }
  }
  @keyframes zx-hero-arrow-lock {
    from { opacity: .6; transform: translate3d(-3px, 3px, 0) rotate(-24deg) scale(.86); }
    to { opacity: 1; transform: translate3d(0, 0, 0) rotate(0) scale(1); }
  }
  @keyframes zx-hero-action-enter {
    from { opacity: .86; translate: 0 8px; }
    to { opacity: 1; translate: 0 0; }
  }
  @keyframes zx-hero-detail-enter {
    from { opacity: .72; translate: 0 5px; }
    to { opacity: 1; translate: 0 0; }
  }
  @keyframes zx-hero-deck-enter {
    from { opacity: .65; transform: translate3d(22px, 24px, -40px) rotateY(-4deg) rotateX(2deg); }
    to { opacity: 1; transform: translate3d(0, 0, 0) rotateY(0) rotateX(0); }
  }
  @keyframes zx-hero-signal-enter {
    0% { transform: scaleX(.02); opacity: 0; }
    32% { opacity: .6; }
    76% { transform: scaleX(1); opacity: .25; }
    100% { transform: scaleX(1); opacity: 0; }
  }
  @keyframes zx-hero-light-enter {
    0% { transform: translateX(-120%); opacity: 0; }
    28% { opacity: .8; }
    72% { opacity: .8; }
    100% { transform: translateX(120%); opacity: 0; }
  }
}
@media (max-width: 900px) and (prefers-reduced-motion: no-preference) {
  .zx-hero-is-entering .zx-deck-stage { animation-name: zx-hero-deck-enter-mobile; }
  @keyframes zx-hero-deck-enter-mobile {
    from { opacity: .65; transform: translate3d(0, 16px, -20px) rotateX(2deg); }
    to { opacity: 1; transform: translate3d(0, 0, 0) rotateY(0) rotateX(0); }
  }
}