*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;background:#06080f;color:#c9d1d9;overflow-x:hidden}
h1,h2,h3,h4,h5,h6,.font-display{font-family:'Outfit',sans-serif}

::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:#0b0f1a}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#00e68a,#3b82f6);border-radius:10px}

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

.text-gradient-warm{background:linear-gradient(135deg,#00e68a,#60a5fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

.card{background:linear-gradient(145deg,rgba(16,23,41,.8),rgba(11,15,26,.9));border:1px solid rgba(255,255,255,.04);border-radius:16px}
.card-glow:hover{box-shadow:0 24px 48px -12px rgba(0,230,138,.08),inset 0 1px 0 rgba(0,230,138,.1)}

.btn{display:inline-flex;align-items:center;gap:8px;font-family:'Outfit',sans-serif;font-weight:600;border-radius:12px;transition:all .25s;cursor:pointer;text-decoration:none;border:none;font-size:15px;letter-spacing:-.01em}
.btn-mint{background:linear-gradient(135deg,#00e68a,#00b36b);color:#06080f;padding:14px 28px;box-shadow:0 4px 16px rgba(0,230,138,.2)}
.btn-mint:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,230,138,.3)}
.btn-ghost{background:transparent;color:#00e68a;padding:13px 27px;border:1.5px solid rgba(0,230,138,.3)}
.btn-ghost:hover{background:rgba(0,230,138,.06);border-color:rgba(0,230,138,.5);transform:translateY(-2px)}
.btn-sm{padding:10px 20px;font-size:13px;border-radius:10px}

.nav-item{font-family:'Outfit',sans-serif;font-weight:500;font-size:14.5px;color:#8b949e;cursor:pointer;position:relative;padding:6px 0;transition:color .25s;letter-spacing:-.01em;text-decoration:none}
.nav-item:hover,.nav-item.active{color:#e6edf3}
.nav-item::after{content:'';position:absolute;bottom:-2px;left:0;height:2px;width:0;background:#00e68a;border-radius:2px;transition:width .25s}
.nav-item:hover::after,.nav-item.active::after{width:100%}

.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:100px;font-size:12.5px;font-weight:600;letter-spacing:.02em}

.stat-pill{text-align:center;padding:20px 12px;border-radius:14px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.04)}

.input{width:100%;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:13px 16px;color:#e6edf3;font-size:14px;font-family:'DM Sans',sans-serif;outline:none;transition:border-color .25s,box-shadow .25s}
.input:focus{border-color:rgba(0,230,138,.4);box-shadow:0 0 0 3px rgba(0,230,138,.06)}
.input::placeholder{color:#484f58}

.price-card{position:relative;overflow:hidden}
.price-card .popular-tag{position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#00e68a,#3b82f6,#8b5cf6)}

.wa-btn{position:fixed;bottom:24px;right:24px;z-index:999;width:56px;height:56px;border-radius:50%;background:#25d366;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(37,211,102,.35);cursor:pointer;transition:transform .25s}
.wa-btn:hover{transform:scale(1.08)}

.chat-window{position:fixed;bottom:92px;left:24px;z-index:998;width:370px;max-width:calc(100vw - 48px);height:500px;max-height:calc(100vh - 120px);border-radius:20px;background:#0b0f1a;border:1px solid rgba(255,255,255,.06);box-shadow:0 24px 64px rgba(0,0,0,.6);display:none;flex-direction:column;overflow:hidden}
.chat-window.open{display:flex;animation:fadeUp .3s ease}
.chat-bubble-bot{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.04);border-radius:16px 16px 16px 4px;padding:12px 16px;font-size:13px;line-height:1.65;max-width:88%;color:#c9d1d9}
.chat-bubble-user{background:linear-gradient(135deg,rgba(0,230,138,.12),rgba(59,130,246,.08));border:1px solid rgba(0,230,138,.1);border-radius:16px 16px 4px 16px;padding:12px 16px;font-size:13px;line-height:1.65;max-width:88%;color:#e6edf3}
.chat-btn{position:fixed;bottom:24px;left:24px;z-index:999;width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#00e68a,#00b36b);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 20px rgba(0,230,138,.3);transition:transform .25s;border:none}
.chat-btn:hover{transform:scale(1.08)}

.hamburger span{display:block;width:20px;height:2px;background:#c9d1d9;margin:5px 0;transition:all .3s;border-radius:1px}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}
.mob-menu{max-height:0;overflow:hidden;transition:max-height .35s ease}.mob-menu.open{max-height:320px}

@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes pulse-ring{0%{transform:scale(1);opacity:.6}100%{transform:scale(1.6);opacity:0}}
@keyframes dot-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes spin-slow{to{transform:rotate(360deg)}}

.process-line{position:absolute;top:32px;left:calc(50% + 60px);right:calc(-50% + 60px);height:1px;background:linear-gradient(90deg,rgba(0,230,138,.3),rgba(59,130,246,.3));z-index:0}

@media(max-width:768px){.chat-window{left:12px;right:12px;bottom:88px;width:auto;height:70vh}}
@media(max-width:480px){.process-line{display:none}}

.contact-icon{transition:all .4s cubic-bezier(.16,1,.3,1)}
.contact-icon svg{transition:transform .5s cubic-bezier(.16,1,.3,1)}
.contact-card-hover{transition:all .35s cubic-bezier(.16,1,.3,1)}
.contact-card-hover:hover{transform:translateX(6px);border-color:rgba(255,255,255,.08)}
.contact-card-hover:hover .contact-icon{transform:scale(1.1)}
.contact-card-hover:hover .contact-icon svg{animation:iconSpin 1.2s cubic-bezier(.16,1,.3,1)}
@keyframes iconSpin{0%{transform:rotate(0deg) scale(1)}30%{transform:rotate(-15deg) scale(1.15)}60%{transform:rotate(10deg) scale(1.05)}100%{transform:rotate(0deg) scale(1)}}

.contact-input{transition:all .3s cubic-bezier(.16,1,.3,1)}
.contact-input:focus{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,230,138,.08),0 0 0 3px rgba(0,230,138,.06)}

#formMood{transition:all .5s cubic-bezier(.16,1,.3,1)}
#formMood.happy{filter:grayscale(0);opacity:1;transform:scale(1.2) rotate(5deg)}
#formMood.sad{filter:grayscale(.5) hue-rotate(180deg);opacity:.8;transform:scale(.9) rotate(-5deg)}

#formTypeText::after{content:'|';animation:blink-cursor .7s step-end infinite;color:#00e68a}
@keyframes blink-cursor{0%,100%{opacity:1}50%{opacity:0}}

@keyframes bhPulse{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.6}50%{transform:translate(-50%,-50%) scale(1.3);opacity:1}}
@keyframes footerIconFloat{0%,100%{transform:rotate(0deg)}50%{transform:rotate(8deg)}}
.footer-icon-spin{animation:footerIconFloat 3s ease-in-out infinite}
footer .card,footer li{transition:all .25s cubic-bezier(.16,1,.3,1)}

.cursor-glow{position:fixed;width:400px;height:400px;border-radius:50%;pointer-events:none;z-index:0;background:radial-gradient(circle,rgba(0,230,138,.06) 0%,rgba(59,130,246,.03) 40%,transparent 70%);transform:translate(-50%,-50%);transition:opacity .3s}

[data-reveal]{opacity:0;transform:translateY(40px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}
[data-reveal].visible{opacity:1;transform:none}
[data-reveal="left"]{transform:translateX(-50px)}[data-reveal="left"].visible{transform:none}
[data-reveal="right"]{transform:translateX(50px)}[data-reveal="right"].visible{transform:none}
[data-reveal="scale"]{transform:scale(.88);filter:blur(4px)}[data-reveal="scale"].visible{transform:none;filter:none}

.card{transition:all .4s cubic-bezier(.16,1,.3,1);transform-style:preserve-3d}
.card:hover{transform:translateY(-6px) rotateX(2deg) rotateY(-2deg);box-shadow:0 32px 64px -16px rgba(0,230,138,.08),0 0 0 1px rgba(0,230,138,.08)}

.btn-mint{position:relative;overflow:hidden;transition:all .3s cubic-bezier(.16,1,.3,1)}
.btn-mint::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.15),transparent);opacity:0;transition:opacity .3s}
.btn-mint:hover::before{opacity:1}
.btn-mint:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(0,230,138,.35),0 0 80px rgba(0,230,138,.1)}

.text-gradient{background:linear-gradient(135deg,#00e68a 0%,#3b82f6 50%,#8b5cf6 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:gradientShift 6s ease infinite;background-size:200% 200%}
@keyframes gradientShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}

.stat-pill{transition:all .35s}
.stat-pill:hover{background:rgba(0,230,138,.05);border-color:rgba(0,230,138,.12);transform:translateY(-2px)}

.badge span[style*="border-radius:50%"]~span{animation:pulse-ring 2s cubic-bezier(.4,0,.6,1) infinite}

.nav-item::after{background:linear-gradient(90deg,#00e68a,#3b82f6);box-shadow:0 0 8px rgba(0,230,138,.4)}

@keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.hero-float{animation:heroFloat 4s ease-in-out infinite}

.counter{font-variant-numeric:tabular-nums}

#three-hero{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none}

[data-reveal="cascade"]{opacity:0;transform:translateY(50px) scale(.95);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
[data-reveal="cascade"].visible{opacity:1;transform:none}

[data-reveal="slide-left"]{opacity:0;transform:translateX(-60px) rotate(-2deg);transition:opacity .75s cubic-bezier(.16,1,.3,1),transform .75s cubic-bezier(.16,1,.3,1)}
[data-reveal="slide-left"].visible{opacity:1;transform:none}
[data-reveal="slide-right"]{opacity:0;transform:translateX(60px) rotate(2deg);transition:opacity .75s cubic-bezier(.16,1,.3,1),transform .75s cubic-bezier(.16,1,.3,1)}
[data-reveal="slide-right"].visible{opacity:1;transform:none}

[data-reveal="pop"]{opacity:0;transform:scale(.7);transition:opacity .5s cubic-bezier(.34,1.56,.64,1),transform .5s cubic-bezier(.34,1.56,.64,1)}
[data-reveal="pop"].visible{opacity:1;transform:none}

[data-reveal="blur"]{opacity:0;filter:blur(8px);transform:translateY(20px);transition:opacity .8s ease,filter .8s ease,transform .8s ease}
[data-reveal="blur"].visible{opacity:1;filter:none;transform:none}

[data-reveal="flip"]{opacity:0;transform:perspective(800px) rotateY(25deg) translateX(-30px);transition:opacity .8s cubic-bezier(.16,1,.3,1),transform .8s cubic-bezier(.16,1,.3,1)}
[data-reveal="flip"].visible{opacity:1;transform:none}

[data-reveal="rise"]{opacity:0;transform:translateY(60px) rotate(3deg);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
[data-reveal="rise"].visible{opacity:1;transform:none}

.svc-card{position:relative;overflow:hidden}
.svc-card::after{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(135deg,transparent 40%,rgba(0,230,138,.03) 50%,transparent 60%);transform:translateX(-100%) rotate(25deg);transition:none}
.svc-card:hover::after{transform:translateX(100%) rotate(25deg);transition:transform .8s ease}

.price-spotlight{position:relative;overflow:hidden}
.price-spotlight::before{content:'';position:absolute;top:-100px;left:50%;width:200px;height:200px;background:radial-gradient(circle,rgba(0,230,138,.06),transparent 70%);border-radius:50%;transform:translateX(-50%);opacity:0;transition:opacity .5s}
.price-spotlight:hover::before{opacity:1}

.team-tilt{transition:transform .5s cubic-bezier(.16,1,.3,1),box-shadow .5s}
.team-tilt:hover{transform:translateY(-8px) rotateX(3deg) rotateY(-3deg) scale(1.01);box-shadow:0 30px 60px -15px rgba(0,230,138,.12)}

.project-glow{position:relative}
.project-glow::before{content:'';position:absolute;inset:-1px;border-radius:17px;background:linear-gradient(135deg,rgba(0,230,138,.2),rgba(59,130,246,.15),rgba(139,92,246,.15));opacity:0;transition:opacity .4s;z-index:-1}
.project-glow:hover::before{opacity:1}

.faq-item{transition:all .3s}
.faq-item:hover{background:rgba(0,230,138,.02);border-color:rgba(0,230,138,.08)}
.faq-ans{transition:max-height .4s cubic-bezier(.16,1,.3,1),padding .3s}

.skill-tag{opacity:0;transform:scale(.5) translateY(10px);transition:opacity .4s,transform .4s cubic-bezier(.34,1.56,.64,1)}
.skill-tag.visible{opacity:1;transform:none}

.value-icon{transition:transform .5s cubic-bezier(.16,1,.3,1)}
.card:hover .value-icon{transform:translateY(-4px) scale(1.1)}

.heading-line{display:block;width:0;height:2px;background:linear-gradient(90deg,#00e68a,#3b82f6);margin:12px auto 0;border-radius:2px;transition:width .8s cubic-bezier(.16,1,.3,1)}
.heading-line.visible{width:60px}

.counter-glow{text-shadow:0 0 20px rgba(0,230,138,.3)}

@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}
.typing-cursor::after{content:'|';animation:blink 1s infinite;color:#00e68a;margin-left:2px}

.parallax-slow{transition:transform .1s linear}

@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
.card-shimmer{background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.02) 50%,rgba(255,255,255,0) 100%);background-size:200% 100%;animation:shimmer 3s infinite}
