/* NovaGrid interactive layer: things that react to the visitor (pointer, tap, hover). */

/* Hero: reactive dot grid */
.ix-grid{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:.9}
.hero > .wrap{position:relative;z-index:2}

/* Headline letters lift toward the cursor */
#heroTitle .ch{transition:translate .35s cubic-bezier(.22,1,.36,1),color .35s}
#heroTitle .ch.ix-hot{color:#FF5A1F}

/* Click ripple + sparks */
.ix-ripple-host{position:relative;overflow:hidden}
.ix-ripple{position:absolute;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(255,138,92,.38) 0%,rgba(255,138,92,.18) 45%,rgba(255,138,92,0) 70%);transform:translate(-50%,-50%) scale(0);animation:ix-ripple .7s cubic-bezier(.22,1,.36,1) forwards}
.btn-cta .ix-ripple{background:radial-gradient(circle,rgba(21,21,21,.55) 0%,rgba(21,21,21,.2) 45%,rgba(21,21,21,0) 70%)}
@keyframes ix-ripple{to{transform:translate(-50%,-50%) scale(1);opacity:0}}
.ix-spark{position:fixed;z-index:9999;width:6px;height:6px;margin:-3px 0 0 -3px;border-radius:50%;background:#FF5A1F;pointer-events:none;box-shadow:0 0 10px rgba(255,90,31,.6)}
.ix-spark.alt{background:#FFB21F;box-shadow:0 0 10px rgba(255,178,31,.6)}
.ix-spark.sq{border-radius:1px;width:5px;height:5px}

/* Text scramble keeps width steady */
.ix-scramble{font-variant-numeric:tabular-nums}

/* Trade tile hover preview */
.ix-peek{position:fixed;left:0;top:0;z-index:60;width:116px;aspect-ratio:390/844;border-radius:16px;overflow:hidden;pointer-events:none;background:#1A1A1A;border:3px solid #1A1A1A;box-shadow:0 30px 60px -24px rgba(0,0,0,.55),0 0 0 1px rgba(21,21,21,.08) inset;opacity:0;scale:.6;rotate:-6deg;transition:opacity .25s,scale .35s cubic-bezier(.22,1,.36,1),rotate .35s cubic-bezier(.22,1,.36,1)}
.ix-peek.on{opacity:1;scale:1;rotate:0deg}
.ix-peek img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.ix-peek span{position:absolute;left:6px;right:6px;bottom:6px;padding:4px 6px;border-radius:8px;background:rgba(26,26,26,.86);color:#EEF1F8;font:500 9px/1.2 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.04em;text-transform:uppercase}

/* Showcase screenshot pans with the cursor */
.work-shot img{transition:translate .5s cubic-bezier(.22,1,.36,1)}

/* FAQ answers reveal word by word */
.faq-body .ixw{display:inline-block;opacity:0;translate:0 .6em;filter:blur(4px);transition:opacity .45s,translate .45s cubic-bezier(.22,1,.36,1),filter .45s}
details[open] .faq-body .ixw{opacity:1;translate:0 0;filter:blur(0)}

/* Footer wordmark letters swell near the cursor */
#footMark .fl{display:inline-block;transform-origin:50% 100%;transition:scale .4s cubic-bezier(.22,1,.36,1),color .4s}
#footMark .fl.hot{color:#FF5A1F}

@media (prefers-reduced-motion: reduce){
  .ix-grid,.ix-peek,.ix-spark,.ix-ripple{display:none!important}
  .faq-body .ixw{opacity:1;translate:none;filter:none;transition:none}
  #heroTitle .ch,#footMark .fl,.work-shot img{transition:none}
}
