/* generated from the design canvas */
.sx a{color:#22d3ee}.sx a:hover{color:#a5f3fc}
.sx *{box-sizing:border-box}
.sx{font-family:"Zen Kaku Gothic New",system-ui,sans-serif;color:#eaf6ff;background:#04121f;overflow-x:clip}
.en{font-family:"Anton","Zen Kaku Gothic New",sans-serif;letter-spacing:.02em}
.outline{color:transparent;-webkit-text-stroke:1.5px rgba(165,243,252,.45)}

@keyframes up{from{transform:translateY(110%)}to{transform:translateY(0)}}
.ln{display:block;overflow:hidden}
.ln>span{display:inline-block;transform:translateY(110%);animation:up 1.1s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes fadeup{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.fu{opacity:0;animation:fadeup 1s cubic-bezier(.2,.8,.2,1) forwards}
@supports (animation-timeline: view()){
 .rv{animation:fadeup linear both;animation-timeline:view();animation-range:entry 5% cover 30%}
 .grow{animation:growx linear both;animation-timeline:view();animation-range:entry 10% cover 40%}
}
@keyframes growx{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* bg pipes */
@keyframes draw{to{stroke-dashoffset:0}}
.pipe{stroke-dasharray:2400;stroke-dashoffset:2400;animation:draw 3s cubic-bezier(.6,0,.2,1) .2s forwards}
.pipe.d2{animation-delay:.8s}
@keyframes flow{to{stroke-dashoffset:-120}}
@keyframes show{from{opacity:0}to{opacity:1}}
.flow2{stroke-dasharray:14 46;animation:flow 1.3s linear infinite,show .8s ease 2.2s both}
.flowg{filter:drop-shadow(0 0 6px rgba(34,211,238,.9))}
@keyframes spin{to{transform:rotate(360deg)}}
.spin{transform-box:fill-box;transform-origin:center;animation:spin 5s linear infinite}
@keyframes glow{0%,100%{opacity:.35}50%{opacity:1}}
.glow{animation:glow 1.6s ease-in-out infinite}
@keyframes sweep{from{transform:translateX(0)}to{transform:translateX(2400px)}}
.sweep{animation:sweep 7s cubic-bezier(.5,0,.5,1) 2.5s infinite}
@keyframes wave{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.wave{position:absolute;left:0;bottom:0;width:200%;height:min(90px,10svh);animation:wave 12s linear infinite}
.wave.w2{animation-duration:20s;opacity:.5;bottom:10px}

/* chips */
@keyframes pop{from{opacity:0;transform:translateY(12px) scale(.96)}to{opacity:1;transform:none}}
.chip{transition:background .3s,border-color .3s,translate .3s}
.chips.pre .chip{opacity:0}
.chips.pre.is-in .chip{animation-name:pop;animation-duration:.5s;animation-timing-function:cubic-bezier(.2,.8,.2,1);animation-fill-mode:both}
.chip:nth-child(1){animation-delay:0.03s}.chip:nth-child(2){animation-delay:0.06s}.chip:nth-child(3){animation-delay:0.09s}.chip:nth-child(4){animation-delay:0.12s}.chip:nth-child(5){animation-delay:0.15s}.chip:nth-child(6){animation-delay:0.18s}.chip:nth-child(7){animation-delay:0.21s}.chip:nth-child(8){animation-delay:0.24s}.chip:nth-child(9){animation-delay:0.27s}.chip:nth-child(10){animation-delay:0.30s}.chip:nth-child(11){animation-delay:0.33s}.chip:nth-child(12){animation-delay:0.36s}.chip:nth-child(13){animation-delay:0.39s}.chip:nth-child(14){animation-delay:0.42s}.chip:nth-child(15){animation-delay:0.45s}.chip:nth-child(16){animation-delay:0.48s}.chip:nth-child(17){animation-delay:0.51s}.chip:nth-child(18){animation-delay:0.54s}.chip:nth-child(19){animation-delay:0.57s}.chip:nth-child(20){animation-delay:0.60s}.chip:nth-child(21){animation-delay:0.63s}.chip:nth-child(22){animation-delay:0.66s}.chip:nth-child(23){animation-delay:0.69s}.chip:nth-child(24){animation-delay:0.72s}.chip:nth-child(25){animation-delay:0.75s}.chip:nth-child(26){animation-delay:0.78s}.chip:nth-child(27){animation-delay:0.81s}.chip:nth-child(28){animation-delay:0.84s}.chip:nth-child(29){animation-delay:0.87s}.chip:nth-child(30){animation-delay:0.90s}.chip:nth-child(31){animation-delay:0.93s}.chip:nth-child(32){animation-delay:0.96s}.chip:nth-child(33){animation-delay:0.99s}.chip:nth-child(34){animation-delay:1.02s}.chip:nth-child(35){animation-delay:1.05s}.chip:nth-child(36){animation-delay:1.08s}.chip:nth-child(37){animation-delay:1.11s}.chip:nth-child(38){animation-delay:1.14s}.chip:nth-child(39){animation-delay:1.17s}.chip:nth-child(40){animation-delay:1.20s}.chip:nth-child(41){animation-delay:1.23s}.chip:nth-child(42){animation-delay:1.26s}
.chip:hover{background:rgba(34,211,238,.14);border-color:#22d3ee;translate:0 -3px}

.sx .nav a{position:relative;color:#eaf6ff;text-decoration:none}
.nav a::after{content:"";position:absolute;left:0;bottom:-6px;height:2px;width:100%;background:#22d3ee;transform:scaleX(0);transform-origin:right;transition:transform .4s}
.nav a:hover::after,.nav a.cur::after{transform:scaleX(1);transform-origin:left}
.btn{transition:transform .3s,box-shadow .3s}
.btn:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(34,211,238,.45)}
.sx .flink{color:#c4d6e4;text-decoration:none;transition:color .3s,padding-left .3s}
.sx .flink:hover{color:#22d3ee;padding-left:8px}
@keyframes fillup{0%{background-position:0 100%}100%{background-position:0 0}}
.fillt{background:linear-gradient(180deg,transparent 50%,var(--ac) 50%);background-size:100% 200%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:1.5px var(--ac);animation:fillup 3.5s cubic-bezier(.6,0,.3,1) infinite alternate}
.wave.w3{animation-duration:26s;opacity:.3;bottom:28px}
footer .wave.w3{height:min(120px,14svh)}
.mbtn{display:none}
.row{transition:background .3s}
.row:hover{background:rgba(34,211,238,.06)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(34,211,238,.6)}100%{box-shadow:0 0 0 22px rgba(34,211,238,0)}}
.pulse{animation:pulse 2s ease-out infinite}

@media (max-width:1000px){.nav a:not(.btn){display:none}.mbtn{display:inline-flex}}
@media (max-width:760px){.nav .btn{padding:10px 16px!important;font-size:12px}}
@media (max-width:600px){.kv{grid-template-columns:minmax(0,1fr)!important}.kv dt{border-bottom:0!important;padding-bottom:0!important}}
@media (prefers-reduced-motion: reduce){.sx *,.sx *::before{animation:none!important;opacity:1!important;transform:none!important;stroke-dashoffset:0!important}}