/* Seller Build hero: Option B (word reveal, mouse spotlight, 3D card tilt, KPI count-up). Preview 20260926anim */

/* H1 word-by-word reveal (JS wraps each word; text content is unchanged) */
.hero h1.hb-split{opacity:1;transform:none;transition:none}
.hb-w{display:inline-block;opacity:0;transform:translateY(.42em);
  animation:hb-word .75s cubic-bezier(.22,1,.36,1) forwards;animation-delay:calc(.15s + var(--i,0) * 75ms)}
.hero h1 .accent .hb-w{background:linear-gradient(90deg,var(--sb-lime),var(--sb-lime-2) 55%,var(--sb-lime-3));
  -webkit-background-clip:text;background-clip:text;color:transparent}
@keyframes hb-word{to{opacity:1;transform:none}}

/* Mouse-following lime spotlight (desktop, fine pointer only; element added by JS) */
.hb-spot{position:absolute;left:0;top:0;width:560px;height:560px;margin:-280px 0 0 -280px;border-radius:50%;
  pointer-events:none;opacity:0;transition:opacity .5s ease;will-change:transform;
  background:radial-gradient(closest-side,rgba(188,239,18,.21),rgba(188,239,18,.075) 45%,transparent 100%);
  transform:translate3d(var(--hb-x,50vw),var(--hb-y,40%),0)}
.hero.hb-spot-on .hb-spot{opacity:1}

/* 3D tilt of the snapshot card (class added after its entrance animation ends) */
.hero-visual{perspective:1000px}
.hero-card.hb-tilt{animation:none;transform:rotateX(var(--hb-rx,0deg)) rotateY(var(--hb-ry,0deg));
  transition:transform .35s cubic-bezier(.22,1,.36,1);transform-style:preserve-3d;will-change:transform}

.hero-count{font-variant-numeric:tabular-nums}

@media (prefers-reduced-motion: reduce){
  .hb-w{animation:none;opacity:1;transform:none}
  .hb-spot{display:none}
  .hero-card.hb-tilt{transform:none;transition:none}
}