/* ---------- site nav dropdown ---------- */
.fx-dd{position:relative;display:inline-flex;align-items:center;gap:6px}
.fx-caret-dd{transition:transform .4s cubic-bezier(.2,.8,.2,1);color:#8592A6}
.fx-dd:hover .fx-caret-dd,.fx-dd:focus-within .fx-caret-dd{transform:rotate(180deg);color:#F07832}
.fx-menu{position:absolute;left:50%;top:100%;transform:translate(-50%,12px);min-width:320px;padding:10px;border-radius:18px;background:rgba(11,16,32,.97);border:1px solid rgba(148,163,184,.16);box-shadow:0 30px 80px -20px rgba(0,0,0,.85);opacity:0;visibility:hidden;transition:opacity .3s,transform .4s cubic-bezier(.2,.8,.2,1),visibility .3s;z-index:60;display:flex;flex-direction:column;gap:2px}
.fx-menu::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.fx-dd:hover .fx-menu,.fx-dd:focus-within .fx-menu{opacity:1;visibility:visible;transform:translate(-50%,4px)}
.fx-mi{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border-radius:12px;transition:background .25s,transform .35s cubic-bezier(.2,.8,.2,1)}
.fx-mi:hover,.fx-mi:focus-visible{background:rgba(82,214,255,.08);transform:translateX(4px)}
.fx-mi-t{display:block;font-weight:500;font-size:14px;color:#F8FAFC}
.fx-mi-d{display:block;font-size:12px;color:#9AA7BA;margin-top:3px;line-height:1.4}
.fx-mi-n{font-family:"Geist Mono",monospace;font-size:11px;color:#F07832;padding-top:2px}


.fx-rise{animation:fx-rise 1.4s cubic-bezier(.16,1,.3,1) both}
@keyframes fx-rise{from{opacity:0;transform:perspective(1400px) rotateX(16deg) translateY(90px) scale(.94);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
.fx-ring{position:absolute;inset:-1px;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--fxa,0deg),rgba(82,214,255,0),rgba(82,214,255,.9),rgba(240,120,50,.9),rgba(82,214,255,0) 40%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:fx-ang 6s linear infinite;pointer-events:none}
@property --fxa{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes fx-ang{to{--fxa:360deg}}
.fx-crumb{color:#9AA7BA;transition:color .3s}.fx-crumb:hover{color:#F07832}
.fx-faq{border-bottom:1px solid rgba(148,163,184,.14)}
.fx-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;font-size:clamp(17px,1.5vw,20px);font-weight:500;min-height:44px;transition:color .3s}
.fx-faq summary::-webkit-details-marker{display:none}
.fx-faq summary:hover{color:#F07832}
.fx-plus{flex:0 0 38px;height:38px;border-radius:50%;border:1px solid rgba(148,163,184,.3);position:relative;color:#F8FAFC;transition:transform .5s cubic-bezier(.2,.8,.2,1),background .3s,border-color .3s,color .3s}
.fx-plus::before,.fx-plus::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:currentColor;transform:translate(-50%,-50%)}
.fx-plus::after{transform:translate(-50%,-50%) rotate(90deg)}
.fx-faq summary:hover .fx-plus{border-color:#F07832}
.fx-faq[open] .fx-plus{transform:rotate(135deg);background:#F07832;border-color:#F07832;color:#07090F}
.fx-faq[open] .fx-faq-a{animation:fx-fadeup .6s cubic-bezier(.16,1,.3,1) both}
.fx-row{transition:background .4s,padding .45s cubic-bezier(.2,.8,.2,1)}
.fx-row:hover{background:rgba(82,214,255,.04);padding-left:16px!important}
.fx-row:hover .fx-ar{transform:translateX(8px)}
.fx-row:hover .fx-row-t{color:#F07832}
.fx-row-t{transition:color .3s}
.fx-svc .fx-svc-n{transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.fx-svc:hover .fx-svc-n{transform:translateY(-6px) scale(1.06)}
.fx-svc:hover .fx-ar{transform:translateX(8px)}


.fx-prose{font-size:17px;line-height:1.8;color:#C7D0DD}
.fx-prose h2{font-size:clamp(24px,2.2vw,30px);line-height:1.2;letter-spacing:-0.025em;font-weight:500;color:#F8FAFC;margin:56px 0 16px;scroll-margin-top:100px;display:flex;gap:14px;align-items:baseline}
.fx-prose h2 .fx-n{font-family:"Geist Mono",monospace;font-size:13px;color:#F07832;letter-spacing:0}
.fx-prose h3{font-size:19px;font-weight:500;color:#F8FAFC;margin:28px 0 10px}
.fx-prose p{margin:0 0 18px}
.fx-prose ul{margin:0 0 22px;padding-left:22px}
.fx-prose li{margin:8px 0}
.fx-prose li::marker{color:#F07832}
.fx-prose strong{color:#F8FAFC;font-weight:500}
.fx-prose a{color:#52D6FF;background:linear-gradient(currentColor,currentColor) left bottom/0% 1px no-repeat;transition:background-size .4s}
.fx-prose a:hover{background-size:100% 1px}
.fx-toc a{display:flex;gap:10px;padding:8px 0 8px 14px;border-left:1.5px solid rgba(148,163,184,.18);color:#9AA7BA;font-size:13.5px;transition:color .3s,border-color .3s,padding .35s}
.fx-toc a span{font-family:"Geist Mono",monospace;font-size:11px;color:#8592A6;padding-top:2px}
.fx-toc a:hover{color:#F8FAFC;border-color:#F07832;padding-left:20px}
.fx-progress{position:sticky;top:0;height:3px;z-index:40;background:linear-gradient(90deg,#52D6FF,#3B82F6,#F07832);transform-origin:left;transform:scaleX(0)}
@supports (animation-timeline: scroll()){.fx-progress{animation:fx-prog linear both;animation-timeline:scroll(root)}}
@keyframes fx-prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}

body{margin:0;background:#07090F}
a{color:#F8FAFC;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid #52D6FF;outline-offset:3px;border-radius:8px}
.fx-mono{font-family:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace}
.fx-serif{font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-weight:400}
.fx-grid{background-image:linear-gradient(rgba(148,163,184,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(148,163,184,.06) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 60% 40%,#000 30%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 60% 40%,#000 30%,transparent 75%);animation:fx-gridmove 40s linear infinite}
@keyframes fx-gridmove{to{background-position:64px 64px,64px 64px}}

/* ---------- ambient loops ---------- */
.fx-flow{animation:fx-flow 3.2s linear infinite}
.fx-flow.d2{animation-delay:-.8s}.fx-flow.d3{animation-delay:-1.6s}.fx-flow.d4{animation-delay:-2.4s}
.fx-spin{animation:fx-spin 60s linear infinite;transform-origin:50px 50px}
.fx-spin.rev{animation-direction:reverse;animation-duration:90s}
.fx-float{animation:fx-float 7s ease-in-out infinite}
.fx-float.d2{animation-delay:-1.75s}.fx-float.d3{animation-delay:-3.5s}.fx-float.d4{animation-delay:-5.25s}
.fx-breathe{animation:fx-breathe 5s ease-in-out infinite}
.fx-conic{animation:fx-turn 14s linear infinite}
.fx-sweep{animation:fx-turn 9s linear infinite}
.fx-wire{background:linear-gradient(90deg,rgba(82,214,255,.12),rgba(82,214,255,.12) 40%,#52D6FF 50%,rgba(82,214,255,.12) 60%,rgba(82,214,255,.12));background-size:300% 100%;animation:fx-wire 2.6s linear infinite}
.fx-wire.o{background:linear-gradient(90deg,rgba(240,120,50,.14),rgba(240,120,50,.14) 40%,#F07832 50%,rgba(240,120,50,.14) 60%,rgba(240,120,50,.14));background-size:300% 100%}
.fx-vwire{background:linear-gradient(180deg,rgba(82,214,255,.1),#52D6FF,rgba(82,214,255,.1));background-size:100% 300%;animation:fx-vwire 2.4s linear infinite}
.fx-marquee{animation:fx-marquee 40s linear infinite}
.fx-mqwrap:hover .fx-marquee{animation-play-state:paused}
.fx-mq{transition:color .3s,text-shadow .3s}.fx-mq:hover{color:#F8FAFC;text-shadow:0 0 18px rgba(82,214,255,.8)}
.fx-blink{animation:fx-blink 1.6s ease-in-out infinite}
.fx-aur1{animation:fx-drift1 22s ease-in-out infinite}
.fx-aur2{animation:fx-drift2 26s ease-in-out infinite}
.fx-aur3{animation:fx-drift3 30s ease-in-out infinite}
.fx-sonar{position:absolute;inset:8%;border-radius:50%;border:1px solid rgba(82,214,255,.6);animation:fx-sonar 4.5s cubic-bezier(.2,.6,.3,1) infinite}
.fx-sonar.d2{animation-delay:1.5s}.fx-sonar.d3{animation-delay:3s;border-color:rgba(240,120,50,.6)}
.fx-shine{background:linear-gradient(100deg,#F07832 0%,#F07832 35%,#FFE0C7 50%,#F07832 65%,#F07832 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:fx-shine 6s ease-in-out infinite}
.fx-shine.c{background-image:linear-gradient(100deg,#52D6FF 0%,#52D6FF 35%,#E6FBFF 50%,#3B82F6 65%,#52D6FF 100%)}

/* ---------- hero entrance ---------- */
.fx-line{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.fx-word{display:inline-block;animation:fx-wordup 1.2s cubic-bezier(.16,1,.3,1) both}
.fx-enter{animation:fx-fadeup 1.1s cubic-bezier(.16,1,.3,1) both}
.fx-enter-net{animation:fx-zoomin 1.8s cubic-bezier(.16,1,.3,1) .25s both}
.fx-rot{display:inline-block;height:1.6em;overflow:hidden;vertical-align:bottom}
.fx-rot-in{display:flex;flex-direction:column;animation:fx-rot 12.5s cubic-bezier(.7,0,.3,1) infinite}
.fx-rot-in span{display:block;height:1.6em;line-height:1.6em;color:#F07832}
.fx-caret{display:inline-block;width:.55em;height:1.05em;background:#F07832;vertical-align:-.18em;margin-left:3px;animation:fx-caret 1s steps(1) infinite}
.fx-tick{animation:fx-tick 6s ease-in-out infinite}
.fx-tick.t2{animation-delay:.9s}.fx-tick.t3{animation-delay:1.8s}
.fx-bar{transform-origin:left;animation:fx-bar 6s ease-in-out infinite}
.fx-typing{animation:fx-typing 7s ease-in-out infinite}
.fx-msg{animation:fx-msg 7s ease-in-out infinite}
.fx-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#52D6FF;animation:fx-dot 1.2s ease-in-out infinite}
.fx-dot.d2{animation-delay:.15s}.fx-dot.d3{animation-delay:.3s}
.fx-cue{animation:fx-cue 2s ease-in-out infinite}
.fx-node{transition:box-shadow .35s,border-color .35s,background .35s;pointer-events:auto;cursor:default}
.fx-node:hover{box-shadow:0 0 36px rgba(82,214,255,.55);border-color:#52D6FF!important;background:rgba(27,42,74,.95)!important}

/* ---------- links & buttons ---------- */
.fx-roll{display:inline-flex;height:1.3em;line-height:1.3em;overflow:hidden;color:#C7D0DD;min-height:0}
.fx-roll>span{display:flex;flex-direction:column;transition:transform .55s cubic-bezier(.7,0,.2,1)}
.fx-roll>span>span{display:block;height:1.3em}
.fx-roll>span>span+span{color:#F07832}
.fx-roll:hover>span,.fx-roll:focus-visible>span{transform:translateY(-1.3em)}
.fx-navi{position:relative;display:inline-flex;align-items:center;min-height:44px}
.fx-navi::after{content:"";position:absolute;left:50%;bottom:6px;width:4px;height:4px;border-radius:50%;background:#F07832;transform:translateX(-50%) scale(0);transition:transform .4s cubic-bezier(.2,.8,.2,1);box-shadow:0 0 10px #F07832}
.fx-navi:hover::after{transform:translateX(-50%) scale(1)}
.fx-arrow{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-weight:600;padding-bottom:2px;background:linear-gradient(currentColor,currentColor) left bottom/0% 1.5px no-repeat,linear-gradient(rgba(148,163,184,.35),rgba(148,163,184,.35)) left bottom/100% 1px no-repeat;transition:background-size .5s cubic-bezier(.2,.8,.2,1),gap .4s}
.fx-arrow:hover{background-size:100% 1.5px,100% 1px;gap:16px}
.fx-ar{display:inline-block;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
a:hover .fx-ar,button:hover .fx-ar{transform:translateX(6px)}
.fx-btn{position:relative;overflow:hidden;isolation:isolate;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease}
.fx-btn::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.65) 50%,transparent 75%);transform:translateX(-130%);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.fx-btn:hover::before{transform:translateX(130%)}
.fx-btn:hover{transform:translateY(-3px);box-shadow:0 18px 50px -14px rgba(240,120,50,.85);color:#07090F}
.fx-pulse{animation:fx-pulse 2.8s ease-out infinite}
.fx-ghost{position:relative;overflow:hidden;isolation:isolate;transition:border-color .4s,transform .35s cubic-bezier(.2,.8,.2,1)}
.fx-ghost::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(82,214,255,.18),rgba(59,130,246,.14));transform:scaleX(0);transform-origin:left;transition:transform .55s cubic-bezier(.7,0,.2,1)}
.fx-ghost:hover::before{transform:scaleX(1)}
.fx-ghost:hover{border-color:rgba(82,214,255,.7)!important;transform:translateY(-3px);color:#F8FAFC}
.fx-foot{display:inline-flex;align-items:center;color:#C7D0DD;transition:color .3s}
.fx-foot::before{content:"";display:inline-block;width:0;height:1.5px;background:#F07832;margin-right:0;transition:width .4s cubic-bezier(.2,.8,.2,1),margin .4s}
.fx-foot:hover{color:#F8FAFC}.fx-foot:hover::before{width:14px;margin-right:8px}

/* ---------- cards & chips ---------- */
.fx-card{position:relative;overflow:hidden;transition:border-color .4s ease,transform .45s cubic-bezier(.2,.8,.2,1),background .4s ease,box-shadow .45s}
.fx-card::after{content:"";position:absolute;left:0;right:0;top:0;height:1.5px;background:linear-gradient(90deg,transparent,#52D6FF,#F07832,transparent);transform:scaleX(0);transition:transform .7s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.fx-card::before{content:"";position:absolute;inset:0;background:radial-gradient(420px circle at 50% 0%,rgba(82,214,255,.12),transparent 60%);opacity:0;transition:opacity .5s;pointer-events:none}
.fx-card:hover::after{transform:scaleX(1)}.fx-card:hover::before{opacity:1}
.fx-card:hover{border-color:rgba(82,214,255,.4)!important;transform:translateY(-6px)!important;box-shadow:0 30px 60px -30px rgba(0,0,0,.8)}
.fx-card svg{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.fx-card:hover svg{transform:scale(1.15) rotate(-8deg)}
.fx-chiph{transition:border-color .3s,color .3s,background .3s,transform .35s cubic-bezier(.2,.8,.2,1)}
.fx-chiph:hover{border-color:#F07832!important;color:#F8FAFC!important;background:rgba(240,120,50,.1);transform:translateY(-3px)}
.fx-tag{transition:border-color .3s,transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.fx-tag:hover{border-color:#52D6FF!important;transform:translateY(-3px);box-shadow:0 10px 30px -10px rgba(82,214,255,.6)}
.fx-layer{transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.fx-layer:hover{transform:translateX(8px) scale(1.01)!important;box-shadow:0 0 70px -20px rgba(82,214,255,.6)}
.fx-li{transition:color .3s,padding-left .4s cubic-bezier(.2,.8,.2,1),border-color .3s}
.fx-li:hover{color:#F8FAFC!important;padding-left:10px;border-color:rgba(82,214,255,.5)!important}
.fx-tab:hover{border-color:#F07832!important;color:#F8FAFC!important}
.fx-step:hover{transform:translateY(-4px)}
.fx-mock{transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.fx-mock:hover{transform:perspective(1400px) rotateY(-3deg) rotateX(2deg) translateY(-6px)}

/* ---------- scroll-driven reveals (progressive enhancement) ---------- */
@supports (animation-timeline: view()) {
.fx-rv{animation:fx-rv linear both;animation-timeline:view();animation-range:entry 0% entry 80%}
.fx-rv2{animation:fx-rv linear both;animation-timeline:view();animation-range:entry 15% entry 100%}
.fx-rvs{animation:fx-rvs linear both;animation-timeline:view();animation-range:entry 0% cover 35%}
.fx-fill{transform-origin:left;animation:fx-fill linear both;animation-timeline:view();animation-range:entry 30% cover 50%}
.fx-par{animation:fx-par linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
.fx-zoomtxt{animation:fx-zoomtxt linear both;animation-timeline:view();animation-range:entry 0% cover 45%}
}

/* ---------- keyframes ---------- */
@keyframes fx-flow{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes fx-spin{to{transform:rotate(360deg)}}
@keyframes fx-turn{to{transform:rotate(360deg)}}
@keyframes fx-float{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,calc(-50% - 8px))}}
@keyframes fx-breathe{0%,100%{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
@keyframes fx-wire{from{background-position:100% 0}to{background-position:-50% 0}}
@keyframes fx-vwire{from{background-position:0 100%}to{background-position:0 -50%}}
@keyframes fx-marquee{to{transform:translateX(-50%)}}
@keyframes fx-blink{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes fx-caret{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes fx-drift1{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(-120px,80px) scale(1.15)}66%{transform:translate(60px,140px) scale(.92)}}
@keyframes fx-drift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(160px,-90px) scale(1.2)}}
@keyframes fx-drift3{0%,100%{transform:translate(0,0) scale(1)}40%{transform:translate(-80px,-120px) scale(1.1)}75%{transform:translate(100px,40px) scale(.95)}}
@keyframes fx-sonar{0%{transform:scale(1);opacity:.85}100%{transform:scale(3.3);opacity:0}}
@keyframes fx-shine{0%{background-position:100% 0}60%,100%{background-position:-50% 0}}
@keyframes fx-wordup{from{transform:translateY(115%) rotate(4deg);opacity:0}to{transform:none;opacity:1}}
@keyframes fx-fadeup{from{opacity:0;transform:translateY(26px);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
@keyframes fx-zoomin{from{opacity:0;transform:scale(.82) rotate(-8deg);filter:blur(14px)}to{opacity:1;transform:none;filter:none}}
@keyframes fx-rot{0%,16%{transform:translateY(0)}20%,36%{transform:translateY(-1.6em)}40%,56%{transform:translateY(-3.2em)}60%,76%{transform:translateY(-4.8em)}80%,96%{transform:translateY(-6.4em)}100%{transform:translateY(-8em)}}
@keyframes fx-tick{0%,8%{opacity:.25;transform:translateX(-6px)}16%,82%{opacity:1;transform:none}94%,100%{opacity:.25;transform:translateX(-6px)}}
@keyframes fx-bar{0%,8%{transform:scaleX(0)}62%,88%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@keyframes fx-typing{0%,30%{opacity:1}36%,94%{opacity:0}100%{opacity:1}}
@keyframes fx-msg{0%,32%{opacity:0;transform:translateY(8px)}40%,90%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-4px)}}
@keyframes fx-dot{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-4px);opacity:1}}
@keyframes fx-cue{0%{transform:translateY(0);opacity:0}30%{opacity:1}80%{transform:translateY(12px);opacity:0}100%{opacity:0}}
@keyframes fx-pulse{0%{box-shadow:0 0 0 0 rgba(240,120,50,.6)}70%,100%{box-shadow:0 0 0 18px rgba(240,120,50,0)}}
@keyframes fx-rv{from{opacity:0;transform:translateY(56px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
@keyframes fx-rvs{from{opacity:0;transform:perspective(1200px) rotateX(18deg) scale(.9) translateY(80px)}to{opacity:1;transform:none}}
@keyframes fx-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes fx-par{from{transform:translateY(50px)}to{transform:translateY(-50px)}}
@keyframes fx-zoomtxt{from{opacity:.15;transform:scale(.9);letter-spacing:.02em}to{opacity:1;transform:none}}
@media (max-width:780px){.fx-hide-sm{display:none!important}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
