* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

 ::-webkit-scrollbar {
    width: 4px
}

::-webkit-scrollbar-track {
    background: #05020e
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #7c3aed, #4f8fff);
    border-radius: 3px
}

body {
    background: #05020e;
    margin: 0;
    overflow-x: hidden;
    color: #c4b5fd
}

.nav-blur {
    backdrop-filter: saturate(180%) blur(24px);
    -webkit-backdrop-filter: saturate(180%) blur(24px)
}

.sc-cut {
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px))
}

.sc-cut-sm {
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px))
}

#starfield {
    position: fixed;
    inset: 0;
    z-index: 0
}

#nebula-layer {
    position: fixed;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    opacity: .6
}

.grid-overlay {
    position: absolute;
    inset: 0;
    opacity: .008;
    background-image: linear-gradient(#4f8fff 1px, transparent 1px), linear-gradient(90deg, #4f8fff 1px, transparent 1px);
    background-size: 100px 100px;
    pointer-events: none
}

@keyframes glitch1 {
    0%,
    100% {
        clip-path: inset(0 0 92% 0);
        transform: translate(0)
    }
    20% {
        clip-path: inset(15% 0 65% 0);
        transform: translate(-3px, 2px)
    }
    40% {
        clip-path: inset(55% 0 25% 0);
        transform: translate(3px, -1px)
    }
    60% {
        clip-path: inset(72% 0 8% 0);
        transform: translate(-2px, 1px)
    }
    80% {
        clip-path: inset(8% 0 78% 0);
        transform: translate(2px, -2px)
    }
}

@keyframes glitch2 {
    0%,
    100% {
        clip-path: inset(92% 0 0 0);
        transform: translate(0)
    }
    20% {
        clip-path: inset(38% 0 42% 0);
        transform: translate(3px, -2px)
    }
    40% {
        clip-path: inset(8% 0 72% 0);
        transform: translate(-3px, 1px)
    }
    60% {
        clip-path: inset(62% 0 18% 0);
        transform: translate(2px, -1px)
    }
    80% {
        clip-path: inset(82% 0 0 0);
        transform: translate(-2px, 2px)
    }
}

.glitch {
    position: relative
}

.glitch::before,
.glitch::after {
    content: attr(data-text);
    position: absolute;
    inset: 0
}

.glitch::before {
    color: #4f8fff;
    animation: glitch1 8s infinite linear;
    z-index: -1
}

.glitch::after {
    color: #c840e9;
    animation: glitch2 8s infinite linear;
    z-index: -1
}

.fade-up {
    opacity: 0;
    transform: translateY(40px);
    transition: all .8s cubic-bezier(.16, 1, .3, 1)
}

.fade-up.vis {
    opacity: 1;
    transform: translateY(0)
}

.fade-up.d1 {
    transition-delay: .12s
}

.fade-up.d2 {
    transition-delay: .24s
}

.fade-up.d3 {
    transition-delay: .36s
}

.fade-up.d4 {
    transition-delay: .48s
}

#hero-box {
    position: relative;
}

.hero-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
    transition: all 0.5s ease, transform 0.4s ease;
}

.hero-slide.on {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
    position: relative;
}

.chk {
    transition: all 200ms;
    padding: 5px 8px 5px 10px;
    border-left: 2px solid transparent;
    border-radius: 0 4px 4px 0;
    color: rgba(196, 181, 253, .7)
}

.chk:hover {
    padding-left: 14px;
    border-left-color: #4f8fff;
    background: rgba(79, 143, 255, .06)
}

.gline {
    height: 1px;
    background: linear-gradient(to right, transparent 5%, rgba(79, 143, 255, .15) 30%, rgba(124, 58, 237, .3) 50%, rgba(200, 64, 233, .15) 70%, transparent 95%)
}

.ebar {
    height: 2px;
    background: linear-gradient(90deg, #4f8fff, #c840e9, #00ff41);
    border-radius: 2px;
    box-shadow: 0 0 10px rgba(79, 143, 255, .3), 0 0 20px rgba(200, 64, 233, .15)
}

.gp {
    box-shadow: 0 0 12px rgba(79, 143, 255, .35)
}

.gg {
    box-shadow: 0 0 12px rgba(79, 143, 255, .3)
}

.ptext {
    text-shadow: 0 0 25px rgba(79, 143, 255, .35), 0 0 50px rgba(124, 58, 237, .15)
}

.ptext-g {
    text-shadow: 0 0 16px rgba(0, 255, 65, .3)
}

.plogo {
    filter: grayscale(1) brightness(.25);
    transition: all 400ms
}

.plogo:hover {
    filter: grayscale(0) brightness(.85);
    box-shadow: 0 0 16px rgba(79, 143, 255, .2)
}

.tcard {
    transition: all 400ms cubic-bezier(.16, 1, .3, 1)
}

.tcard:hover {
    transform: translateY(-8px);
    box-shadow: 0 0 40px rgba(79, 143, 255, .08), 0 25px 60px -15px rgba(0, 0, 0, .7)
}

@keyframes scrl {
    0% {
        transform: translateY(0);
        opacity: 1
    }
    100% {
        transform: translateY(12px);
        opacity: 0
    }
}

.scrl {
    animation: scrl 1.8s ease-in-out infinite
}

@keyframes pg {
    0%,
    100% {
        box-shadow: 0 0 4px rgba(0, 255, 65, .3)
    }
    50% {
        box-shadow: 0 0 14px rgba(0, 255, 65, .7)
    }
}

.pg {
    animation: pg 2s ease-in-out infinite
}

@keyframes flk {
    0%,
    100% {
        opacity: 1
    }
    92% {
        opacity: 1
    }
    93% {
        opacity: .15
    }
    94% {
        opacity: 1
    }
    96% {
        opacity: .3
    }
    97% {
        opacity: 1
    }
}

.flk {
    animation: flk 6s infinite
}

@keyframes bk {
    0%,
    100% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
}

.bk {
    animation: bk 1s step-end infinite
}

input:focus,
textarea:focus {
    outline: none;
    border-color: #4f8fff!important;
    box-shadow: 0 0 0 1px rgba(79, 143, 255, .4), 0 0 20px rgba(79, 143, 255, .08)
}

.corner-deco {
    position: relative
}

.corner-deco::before,
.corner-deco::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    border-color: rgba(79, 143, 255, .3);
    border-style: solid;
    pointer-events: none;
    transition: border-color .3s
}

.corner-deco:hover::before,
.corner-deco:hover::after {
    border-color: rgba(0, 255, 65, .5)
}

.corner-deco::before {
    top: -1px;
    left: -1px;
    border-width: 1px 0 0 1px
}

.corner-deco::after {
    bottom: -1px;
    right: -1px;
    border-width: 0 1px 1px 0
}

#globe-container {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden
}

#globe-container canvas {
    display: block
}

#scroll-bar {
    position: fixed;
    top: 0;
    left: 0;
    height: 2px;
    background: linear-gradient(90deg, #1a0a3e, #4f8fff, #c840e9, #00ff41);
    z-index: 10001;
    width: 0;
    box-shadow: 0 0 8px rgba(79, 143, 255, .4);
    transition: none
}

.ticker {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 22px;
    background: rgba(5, 2, 14, .92);
    border-top: 1px solid rgba(79, 143, 255, .1);
    z-index: 98;
    overflow: hidden;
    display: flex;
    align-items: center;
    backdrop-filter: blur(10px)
}

.ticker-inner {
    display: flex;
    animation: tk 120s linear infinite;
    white-space: nowrap
}

.ticker span {
    font-family: 'Share Tech Mono', monospace;
    font-size: 9px;
    letter-spacing: 1px;
    color: rgba(79, 143, 255, .3);
    padding: 0 40px
}

.ticker span b {
    color: rgba(0, 255, 65, .5);
    font-weight: 400
}

@keyframes tk {
    0% {
        transform: translateX(0)
    }
    100% {
        transform: translateX(-50%)
    }
}

.svc-card {
    position: relative;
    overflow: hidden
}

.svc-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 2px;
    height: 0;
    background: linear-gradient(180deg, #4f8fff, #c840e9, #00ff41, transparent);
    transition: height .6s cubic-bezier(.16, 1, .3, 1);
    z-index: 2
}

.svc-card:hover::before {
    height: 100%
}

.nav-scrolled {
    background: rgba(5, 2, 14, .94)!important;
    border-bottom-color: rgba(79, 143, 255, .2)!important
}

@keyframes fadeInMsg {
    from {
        opacity: 0;
        transform: translateY(10px)
    }
    to {
        opacity: 1;
        transform: translateY(0)
    }
}

.fade-in-msg {
    animation: fadeInMsg .5s ease forwards
}

@keyframes heroFloat {
    0%,
    100% {
        transform: translateY(0)
    }
    50% {
        transform: translateY(-10px)
    }
}

.hero-float {
    animation: heroFloat 7s ease-in-out infinite
}

.nebula-section {
    position: relative;
    overflow: hidden
}

.nebula-section::before {
    content: '';
    position: absolute;
    top: -200px;
    left: 50%;
    transform: translateX(-50%);
    width: 800px;
    height: 500px;
    border-radius: 50%;
    filter: blur(120px);
    pointer-events: none;
    z-index: 0
}

.nebula-purple::before {
    background: radial-gradient(circle, rgba(124, 58, 237, .12), transparent 70%)
}

.nebula-blue::before {
    background: radial-gradient(circle, rgba(79, 143, 255, .1), transparent 70%)
}

.nebula-pink::before {
    background: radial-gradient(circle, rgba(200, 64, 233, .08), transparent 70%)
}

.nebula-green::before {
    background: radial-gradient(circle, rgba(0, 255, 65, .06), transparent 70%)
}

@keyframes shootStar {
    0% {
        transform: translateX(0) translateY(0);
        opacity: 1
    }
    100% {
        transform: translateX(300px) translateY(300px);
        opacity: 0
    }
}

.shooting-star {
    position: fixed;
    width: 80px;
    height: 1px;
    background: linear-gradient(90deg, rgba(255, 255, 255, .8), transparent);
    border-radius: 1px;
    pointer-events: none;
    z-index: 2;
    opacity: 0
}

@keyframes driftFloat {
    0%,
    100% {
        transform: translateY(0) rotate(0deg)
    }
    25% {
        transform: translateY(-15px) rotate(1deg)
    }
    75% {
        transform: translateY(10px) rotate(-1deg)
    }
}

.drift-float {
    animation: driftFloat 12s ease-in-out infinite
}

.space-divider {
    position: relative;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden
}

.space-divider::before {
    content: '';
    position: absolute;
    width: 200px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(79, 143, 255, .3), rgba(200, 64, 233, .3), transparent)
}

.space-divider .divider-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #4f8fff;
    box-shadow: 0 0 12px rgba(79, 143, 255, .6);
    position: relative;
    z-index: 1
}

@keyframes speedLines {
    0% {
        transform: translateY(-100%);
        opacity: 0
    }
    10% {
        opacity: .3
    }
    90% {
        opacity: .3
    }
    100% {
        transform: translateY(100vh);
        opacity: 0
    }
}

.speed-line {
    position: fixed;
    width: 1px;
    background: linear-gradient(180deg, transparent, rgba(79, 143, 255, .4), transparent);
    pointer-events: none;
    z-index: 1
}

#btt {
    position: fixed;
    bottom: 36px;
    right: 24px;
    z-index: 97;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: rgba(10, 4, 24, .9);
    border: 1px solid rgba(79, 143, 255, .2);
    color: #4f8fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all .3s ease;
    backdrop-filter: blur(12px)
}

#btt.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0)
}

#btt:hover {
    background: rgba(79, 143, 255, .1);
    border-color: rgba(79, 143, 255, .4);
    box-shadow: 0 0 20px rgba(79, 143, 255, .15)
}

#toast-container {
    position: fixed;
    top: 70px;
    right: 24px;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    gap: 8px;
    pointer-events: none
}

.toast {
    pointer-events: auto;
    background: rgba(10, 4, 24, .95);
    border: 1px solid rgba(0, 255, 65, .25);
    border-radius: 8px;
    padding: 12px 18px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Share Tech Mono', monospace;
    font-size: 11px;
    color: #00ff41;
    backdrop-filter: blur(16px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, .5);
    transform: translateX(120%);
    transition: transform .4s cubic-bezier(.16, 1, .3, 1);
    max-width: 340px
}

.toast.show {
    transform: translateX(0)
}

.toast .toast-icon {
    font-size: 16px;
    flex-shrink: 0
}

.svc-expandable {
    max-height: 320px;
    overflow: hidden;
    position: relative;
    transition: max-height .5s cubic-bezier(.16, 1, .3, 1)
}

.svc-expandable.expanded {
    max-height: 2000px
}

.svc-expandable:not(.expanded)::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 80px;
    background: linear-gradient(transparent, rgba(5, 2, 14, .95));
    pointer-events: none;
    transition: opacity .3s
}

.svc-expand-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 8px 0 4px;
    font-family: 'Share Tech Mono', monospace;
    font-size: 10px;
    letter-spacing: .15em;
    color: rgba(79, 143, 255, .6);
    background: none;
    border: none;
    cursor: pointer;
    transition: color .2s
}

.svc-expand-btn:hover {
    color: #4f8fff
}

.svc-expand-btn .expand-icon {
    transition: transform .3s ease
}

.svc-expand-btn.is-expanded .expand-icon {
    transform: rotate(180deg)
}

.stat-card {
    position: relative;
    overflow: hidden
}

.stat-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(79, 143, 255, .2), transparent)
}

.stat-num {
    font-variant-numeric: tabular-nums
}

.float-group {
    position: relative
}

.float-group input,
.float-group textarea {
    background: rgba(5, 2, 14, .5);
    border: 1px solid rgba(26, 14, 58, .3);
    border-radius: 6px;
    font-family: 'Share Tech Mono', monospace;
    font-size: 12px;
    color: #ede9fe;
    padding: 18px 14px 6px;
    transition: all .25s ease;
    width: 100%;
    box-sizing: border-box
}

.float-group label {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    font-family: 'Share Tech Mono', monospace;
    font-size: 11px;
    color: rgba(139, 92, 246, .4);
    pointer-events: none;
    transition: all .25s cubic-bezier(.16, 1, .3, 1);
    text-transform: uppercase;
    letter-spacing: .1em
}

.float-group textarea~label {
    top: 18px;
    transform: translateY(0)
}

.float-group input:focus~label,
.float-group input:not(:placeholder-shown)~label {
    top: 6px;
    transform: translateY(0);
    font-size: 8px;
    color: rgba(79, 143, 255, .7);
    letter-spacing: .15em
}

.float-group textarea:focus~label,
.float-group textarea:not(:placeholder-shown)~label {
    top: 4px;
    font-size: 8px;
    color: rgba(79, 143, 255, .7);
    letter-spacing: .15em
}

#mob-overlay {
    position: fixed;
    inset: 0;
    z-index: 49;
    background: rgba(5, 2, 14, .7);
    backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    transition: all .3s ease
}

#mob-overlay.open {
    opacity: 1;
    visibility: visible
}

#mob-menu {
    transform: translateX(100%);
    transition: transform .35s cubic-bezier(.16, 1, .3, 1)
}

#mob-menu.open {
    transform: translateX(0)
}

.partner-badge {
    font-family: 'Share Tech Mono', monospace;
    font-size: 10px;
    letter-spacing: .12em;
    color: rgba(139, 92, 246, .3);
    padding: 8px 16px;
    border: 1px solid rgba(79, 143, 255, .08);
    border-radius: 6px;
    background: rgba(10, 4, 24, .4);
    transition: all .4s ease;
    white-space: nowrap;
    user-select: none
}

.partner-badge:hover {
    color: rgba(79, 143, 255, .7);
    border-color: rgba(79, 143, 255, .2);
    background: rgba(79, 143, 255, .04);
    box-shadow: 0 0 20px rgba(79, 143, 255, .06)
}

.typing-cursor {
    display: inline-block;
    width: 7px;
    height: 14px;
    background: rgba(79, 143, 255, .6);
    margin-left: 2px;
    vertical-align: middle;
    animation: cursorBlink 1s step-end infinite
}

@keyframes cursorBlink {
    0%,
    100% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
}

.process-step {
    position: relative
}

.process-step:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 20px;
    left: calc(50% + 24px);
    right: calc(-50% + 24px);
    height: 1px;
    background: linear-gradient(90deg, rgba(79, 143, 255, .25), rgba(200, 64, 233, .15), transparent)
}

@media(max-width:767px) {
    .process-step:not(:last-child)::after {
        display: none
    }
}

@media(prefers-reduced-motion:reduce) {
    *,
    *::before,
    *::after {
        animation-duration: .01ms!important;
        animation-iteration-count: 1!important;
        transition-duration: .01ms!important;
        scroll-behavior: auto!important
    }
    .hero-slide {
        transition: opacity .2s ease!important;
        transform: none!important
    }
    .fade-up {
        opacity: 1;
        transform: none
    }
    .shooting-star,
    .speed-line {
        display: none
    }
    #preloader {
        display: none
    }
}

.g-recaptcha {
    transform: scale(0.80);
    transform-origin: 0 0;
}