/* Kalryn design layer */
::selection{background:rgba(61,220,132,.35);color:#fff}
.kx-progress{position:fixed;left:0;top:0;right:0;height:2px;z-index:1001;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#3ddc84,#22d3ee,#a78bfa);box-shadow:0 0 12px rgba(61,220,132,.6);pointer-events:none}
.kx-grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* HERO */
.kx-hero{isolation:isolate}
.kx-hero-fx{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;will-change:transform,opacity}
.kx-aurora{position:absolute;inset:0;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.kx-aurora i{position:absolute;display:block;width:70vmax;height:70vmax;border-radius:50%;will-change:transform}
.kx-aurora i:nth-child(1){left:-25vmax;top:-38vmax;background:radial-gradient(closest-side,rgba(61,220,132,.26),transparent);animation:kx-a1 22s ease-in-out infinite alternate}
.kx-aurora i:nth-child(2){right:-32vmax;top:-22vmax;background:radial-gradient(closest-side,rgba(34,211,238,.18),transparent);animation:kx-a2 27s ease-in-out infinite alternate}
.kx-aurora i:nth-child(3){left:15%;bottom:-48vmax;background:radial-gradient(closest-side,rgba(167,139,250,.15),transparent);animation:kx-a3 31s ease-in-out infinite alternate}
@keyframes kx-a1{to{transform:translate3d(14vmax,9vmax,0) scale(1.15)}}
@keyframes kx-a2{to{transform:translate3d(-12vmax,12vmax,0) scale(1.1)}}
@keyframes kx-a3{to{transform:translate3d(-10vmax,-8vmax,0) scale(1.2)}}
.kx-beam{position:absolute;left:50%;top:-30%;width:90vmax;height:90vmax;margin-left:-45vmax;background:conic-gradient(from 180deg at 50% 0%,transparent 165deg,rgba(255,255,255,.055) 180deg,transparent 195deg);transform-origin:50% 0;animation:kx-beam 14s ease-in-out infinite alternate}
@keyframes kx-beam{from{transform:rotate(-9deg)}to{transform:rotate(9deg)}}
.kx-floor{position:absolute;left:-50%;right:-50%;bottom:-8%;height:58%;opacity:.5;background-image:linear-gradient(rgba(61,220,132,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(61,220,132,.11) 1px,transparent 1px);background-size:64px 64px;transform:perspective(520px) rotateX(62deg);transform-origin:50% 100%;-webkit-mask-image:linear-gradient(to top,#000 5%,transparent 85%);mask-image:linear-gradient(to top,#000 5%,transparent 85%);animation:kx-floor 5s linear infinite}
@keyframes kx-floor{to{background-position:0 64px,0 0}}
.kx-flow{position:absolute;inset:0;width:100%;height:100%;display:block;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.kx-vignette{position:absolute;inset:0;background:radial-gradient(ellipse 85% 65% at 50% 40%,transparent 45%,rgba(10,10,10,.8)),linear-gradient(to bottom,transparent 72%,#0a0a0a)}
.kx-hero-fx[data-fx="lite"] .kx-flow,.kx-hero-fx[data-fx="lite"] .kx-beam{display:none}
.kx-hero-fx[data-fx="off"]{display:none}
.kx-hero h1{font-size:clamp(40px,6.2vw,92px)!important;line-height:1!important;letter-spacing:-.04em!important;text-wrap:balance}
.kx-sub{font-size:clamp(16px,1.35vw,19px)!important;line-height:1.55!important;color:rgba(236,236,240,.76)!important;text-wrap:pretty}
.kx-grad,.kx-grad *{background-image:linear-gradient(90deg,#3ddc84,#22d3ee,#a78bfa,#3ddc84);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:kx-shine 9s linear infinite}
@keyframes kx-shine{to{background-position:300% 0}}

/* JOURNEY */
.kx-journey{position:relative;padding:clamp(24px,5vw,64px) 20px clamp(40px,6vw,80px)}
.kx-j-inner{max-width:1080px;margin:0 auto}
.kx-j-cap{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 0 30px;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(236,236,240,.62)}
.kx-dot{width:7px;height:7px;border-radius:50%;background:#3ddc84;animation:kx-ping 2s infinite}
@keyframes kx-ping{0%{box-shadow:0 0 0 0 rgba(61,220,132,.6)}70%,100%{box-shadow:0 0 0 10px rgba(61,220,132,0)}}
.kx-j-track{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);position:relative;z-index:1}
.kx-j-track li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
.kx-j-t{display:flex;flex-direction:column;gap:4px}
.kx-j-ico{width:56px;height:56px;flex:none;border-radius:16px;display:grid;place-items:center;color:rgba(236,236,240,.55);background:#101012;border:1px solid rgba(255,255,255,.1)}
.kx-j-ico svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.kx-j-track b{font:600 15px/1.2 "Space Grotesk",Inter,sans-serif;color:#f2f2f4}
.kx-j-track small{font-size:12.5px;color:rgba(236,236,240,.6)}
.kx-j-track::before,.kx-j-track::after{content:"";position:absolute;left:10%;right:10%;top:27px;height:2px;border-radius:2px;z-index:-1}
.kx-j-track::before{background:rgba(255,255,255,.08)}
.kx-j-track::after{background:linear-gradient(90deg,rgba(61,220,132,.15),#3ddc84 85%,#c8ffe0);box-shadow:0 0 16px rgba(61,220,132,.6);transform-origin:0 50%;transform:scaleX(0);animation:kx-fill 7s linear infinite}
@keyframes kx-fill{0%{transform:scaleX(0);opacity:1}72%,88%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@keyframes kx-fillv{0%{transform:scaleY(0);opacity:1}72%,88%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
.kx-j-track li:nth-child(1) .kx-j-ico{animation:kx-n0 7s linear infinite}
.kx-j-track li:nth-child(2) .kx-j-ico{animation:kx-n1 7s linear infinite}
.kx-j-track li:nth-child(3) .kx-j-ico{animation:kx-n2 7s linear infinite}
.kx-j-track li:nth-child(4) .kx-j-ico{animation:kx-n3 7s linear infinite}
.kx-j-track li:nth-child(5) .kx-j-ico{animation:kx-n4 7s linear infinite}
@keyframes kx-n0{0%{color:rgba(236,236,240,.55);border-color:rgba(255,255,255,.1);box-shadow:0 0 0 0 rgba(61,220,132,0);background:#101012}3%,88%{color:#3ddc84;border-color:rgba(61,220,132,.55);box-shadow:0 0 0 6px rgba(61,220,132,.08),0 0 32px rgba(61,220,132,.35);background:#0d1a13}96%,100%{color:rgba(236,236,240,.55);border-color:rgba(255,255,255,.1);box-shadow:0 0 0 0 rgba(61,220,132,0);background:#101012}}
@keyframes kx-n1{0%,18%{color:rgba(236,236,240,.55);border-color:rgba(255,255,255,.1);box-shadow:0 0 0 0 rgba(61,220,132,0);background:#101012}21%,88%{color:#3ddc84;border-color:rgba(61,220,132,.55);box-shadow:0 0 0 6px rgba(61,220,132,.08),0 0 32px rgba(61,220,132,.35);background:#0d1a13}96%,100%{color:rgba(236,236,240,.55);border-color:rgba(255,255,255,.1);box-shadow:0 0 0 0 rgba(61,220,132,0);background:#101012}}
@keyframes kx-n2{0%,36%{color:rgba(236,236,240,.55);border-color:rgba(255,255,255,.1);box-shadow:0 0 0 0 rgba(61,220,132,0);background:#101012}39%,88%{color:#3ddc84;border-color:rgba(61,220,132,.55);box-shadow:0 0 0 6px rgba(61,220,132,.08),0 0 32px rgba(61,220,132,.35);background:#0d1a13}96%,100%{color:rgba(236,236,240,.55);border-color:rgba(255,255,255,.1);box-shadow:0 0 0 0 rgba(61,220,132,0);background:#101012}}
@keyframes kx-n3{0%,54%{color:rgba(236,236,240,.55);border-color:rgba(255,255,255,.1);box-shadow:0 0 0 0 rgba(61,220,132,0);background:#101012}57%,88%{color:#3ddc84;border-color:rgba(61,220,132,.55);box-shadow:0 0 0 6px rgba(61,220,132,.08),0 0 32px rgba(61,220,132,.35);background:#0d1a13}96%,100%{color:rgba(236,236,240,.55);border-color:rgba(255,255,255,.1);box-shadow:0 0 0 0 rgba(61,220,132,0);background:#101012}}
@keyframes kx-n4{0%,72%{color:rgba(236,236,240,.55);border-color:rgba(255,255,255,.1);box-shadow:0 0 0 0 rgba(61,220,132,0);background:#101012}75%,88%{color:#3ddc84;border-color:rgba(61,220,132,.55);box-shadow:0 0 0 6px rgba(61,220,132,.08),0 0 32px rgba(61,220,132,.35);background:#0d1a13}96%,100%{color:rgba(236,236,240,.55);border-color:rgba(255,255,255,.1);box-shadow:0 0 0 0 rgba(61,220,132,0);background:#101012}}
@media (max-width:760px){
  .kx-j-track{grid-template-columns:1fr;gap:16px;max-width:340px;margin:0 auto}
  .kx-j-track li{flex-direction:row;text-align:left;gap:16px}
  .kx-j-ico{width:52px;height:52px}
  .kx-j-track::before,.kx-j-track::after{left:25px;right:auto;top:26px;bottom:26px;width:2px;height:auto}
  .kx-j-track::after{background:linear-gradient(180deg,rgba(61,220,132,.15),#3ddc84 85%,#c8ffe0);transform-origin:50% 0;transform:scaleY(0);animation-name:kx-fillv}
}

/* SECTIONS */
.kx-sec{isolation:isolate}
.kx-glow{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.kx-glow::before{content:"";position:absolute;top:0;left:12%;right:12%;height:1px;background:linear-gradient(90deg,transparent,rgba(61,220,132,.35),transparent)}
.kx-glow::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:28px 28px;-webkit-mask-image:radial-gradient(ellipse 55% 45% at 50% 0%,#000,transparent);mask-image:radial-gradient(ellipse 55% 45% at 50% 0%,#000,transparent)}
.kx-g0{background:radial-gradient(700px 360px at 12% 0%,rgba(61,220,132,.09),transparent 70%)}
.kx-g1{background:radial-gradient(700px 360px at 88% 10%,rgba(34,211,238,.075),transparent 70%)}
.kx-g2{background:radial-gradient(760px 380px at 50% 0%,rgba(167,139,250,.075),transparent 70%)}

/* CARDS */
.kx-card{transition:border-color .4s ease,box-shadow .5s ease}
.kx-card:hover{border-color:rgba(255,255,255,.17)!important;box-shadow:0 30px 80px -40px rgba(61,220,132,.35)}
.kx-rim,.kx-spot{position:absolute;border-radius:inherit;pointer-events:none;z-index:2}
.kx-rim{inset:calc(var(--bw,1px)*-1);padding:var(--bw,1px);background:radial-gradient(340px circle at var(--mx,-999px) var(--my,-999px),rgba(61,220,132,.6),rgba(34,211,238,.25) 40%,transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.kx-spot{inset:0;opacity:0;transition:opacity .4s ease;background:radial-gradient(520px circle at var(--mx,50%) var(--my,0),rgba(61,220,132,.07),transparent 45%)}
.kx-card:hover .kx-spot{opacity:1}

/* BUTTONS */
.kx-btnp{overflow:hidden;isolation:isolate;box-shadow:0 12px 40px -12px rgba(61,220,132,.55),0 0 0 1px rgba(255,255,255,.25);transition:box-shadow .4s ease}
.kx-btnp:hover{box-shadow:0 16px 50px -10px rgba(61,220,132,.75),0 0 0 1px rgba(61,220,132,.6)}
.kx-shine{position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 35%,rgba(61,220,132,.38) 50%,transparent 65%);transform:translateX(-130%);animation:kx-sweep 5.5s ease-in-out infinite}
@keyframes kx-sweep{0%,60%{transform:translateX(-130%)}85%,100%{transform:translateX(130%)}}

/* STACK MARQUEE */
.kx-mq{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.kx-mq-track{display:flex!important;flex-wrap:nowrap!important;gap:0!important;width:max-content!important;animation:kx-mq 40s linear infinite}
.kx-mq:hover .kx-mq-track{animation-play-state:paused}
.kx-mq-track>*{flex:none!important;white-space:nowrap;margin:0 12px 0 0!important}
@keyframes kx-mq{to{transform:translateX(-50%)}}
.kx-logo{width:18px;height:18px;margin-right:9px;vertical-align:-3px;filter:invert(1);opacity:.85}

@media (prefers-reduced-motion:reduce){
  .kx-hero-fx *,.kx-journey *,.kx-grad,.kx-grad *,.kx-shine,.kx-dot,.kx-mq-track{animation:none!important}
  .kx-j-track::after{animation:none!important;transform:none!important}
}

/* stack-align */
.kx-stack{align-items:center!important}
.kx-stack:not(.kx-mq-track){display:flex!important;flex-wrap:wrap!important;justify-content:center;gap:10px!important}
.kx-stack>*{display:inline-flex!important;align-items:center!important;justify-content:center;gap:10px!important;box-sizing:border-box;height:46px!important;min-height:0!important;padding:0 18px 0 14px!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.1)!important;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.015))!important;font-size:14.5px!important;line-height:1!important;color:#ececf0!important;white-space:nowrap;vertical-align:middle}
.kx-stack>*>*{margin:0!important;line-height:1!important}
.kx-stack>* img,.kx-stack>* svg,.kx-stack .kx-mono{display:block;flex:none;width:18px!important;height:18px!important;margin:0!important}
.kx-stack .kx-logo{filter:invert(1);opacity:.9}
.kx-stack .kx-mono{display:grid!important;place-items:center;border-radius:5px;background:rgba(61,220,132,.16);color:#9ff0c4;font:700 11px/1 "Space Grotesk",sans-serif}
@media (max-width:560px){.kx-stack>*{height:40px!important;padding:0 14px 0 12px!important;font-size:13.5px!important}}