@import url(https://fonts.googleapis.com/css2?family=Manrope:wght@400;700&display=swap);@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css);:root{--text:#fcfcfc;--textDim:#999;--background:#121212;--primary:#80d4ff;--primaryBg:#00aaff1a;--primaryHi:#00a6ff40;--primaryFg:#cef;--blue:#80d4ff;--green:#0f0;--purple:#93f;--buttonBlue:#80d4ff;--buttonBlueBorder:#80d4ff;--buttonBlueGradientStart:#0af;--buttonBlueGradientEnd:#00a6ff9e}html{scroll-behavior:smooth}body{margin:0}.App,body{background-color:#000;padding:0}.App{align-items:center;color:#fff;display:flex;flex-direction:column;font-family:Manrope,sans-serif;min-height:100vh;position:relative;text-align:center}.App:before{bottom:10px;color:#999;color:var(--textDim);content:attr(data-message);cursor:pointer;font-size:.8rem;left:50%;opacity:.7;position:fixed;transform:translateX(-50%);transition:opacity .3s ease;z-index:1001}.App:before:hover{opacity:1}.ClipboardText{bottom:10px;color:#999;color:var(--textDim);cursor:pointer;display:inline-block;font-size:.8rem;left:50%;opacity:.7;padding:2px 5px;position:fixed;transform:translateX(-50%);transition:opacity .3s ease;z-index:1001}.ClipboardText:hover{opacity:1}@keyframes glowPulse{0%{opacity:.1;transform:translate(-50%,-50%) scale(.8)}50%{opacity:.1;transform:translate(-50%,-50%) scale(1.2)}to{opacity:.1;transform:translate(-50%,-50%) scale(.8)}}.TopBarContainer{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(180deg,#000000f2 0,#0000);box-shadow:0 8px 25px #000000b3;justify-content:center;left:0;z-index:5000}.TopBar,.TopBarContainer{display:flex;position:-webkit-sticky;position:sticky;top:0;width:100%}.TopBar{align-items:center;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);background:#0000;border-radius:25px;box-shadow:0 10px 25px #00000080;justify-content:space-between;max-width:1200px;padding:10px 20px;z-index:1000}.NavButton button{cursor:pointer}.TopSectionGlow{animation:topGlowPulse 6s ease-in-out infinite;background:radial-gradient(circle at 0 50%,#00a6ff40 0,#0000 70%);background:radial-gradient(circle at 0 50%,var(--primaryHi) 0,#0000 70%);border-radius:50%;height:600px;opacity:.4;pointer-events:none;position:fixed;right:0;top:50px;width:600px;z-index:-1}@keyframes topGlowPulse{0%{opacity:.4;transform:scale(.8)}50%{opacity:.6;transform:scale(1)}to{opacity:.4;transform:scale(.8)}}.Logo{background-image:url(https://via.placeholder.com/40?text=Logo);background-position:50%;background-size:cover;height:40px;width:40px}.Logo:hover img{transform:scale(1.1);transition:transform .3s ease}.NavContainer{justify-content:center;width:100%}.NavContainer,.NavLinks{align-items:center;display:flex;gap:30px}.NavLinks{margin-right:-40px}.NavLink{color:#fff;cursor:pointer;font-family:Manrope,sans-serif;font-size:14px;font-weight:400;text-decoration:none;transition:color .3s ease}.NavLink:hover{color:#cef;color:var(--primaryFg)}.NavButton{align-items:center;display:flex;height:36px;justify-content:center;width:110px}.NavButton a{color:inherit;cursor:pointer;display:block;height:100%;position:relative;text-decoration:none;width:100%}.NavButton button{align-items:center;background-color:#00aaff1a;background-color:var(--primaryBg);border:none;border-radius:8px;box-shadow:inset 0 -2px 10px 0 #00a6ff40;box-shadow:0 -2px 10px 0 var(--primaryHi) inset;-webkit-clip-path:path("M 0 18 C 0 -5, -5 0, 55 0 S 110 -5, 110 18, 115 36 55 36, 0 41, 0 18");clip-path:path("M 0 18 C 0 -5, -5 0, 55 0 S 110 -5, 110 18, 115 36 55 36, 0 41, 0 18");color:#cef;color:var(--primaryFg);display:flex;font-family:Manrope,sans-serif;font-size:11px;font-weight:400;height:36px;justify-content:center;transform:translateY(0);transition:all .2s ease;width:110px}.NavButton span{background-color:#00a6ff40;background-color:var(--primaryHi);border-radius:100%;filter:blur(10px);height:30px;left:50%;opacity:60%;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .3s ease;width:60px}.NavButton:hover span{filter:blur(15px);height:50px;opacity:80%;width:80px}.NavButton:hover button{transform:translateY(3px)}.Sections{margin-top:40px;width:100%}.Sections,section{display:flex;flex-direction:column}section{justify-content:center;margin-top:120px;min-height:100vh;width:1860px}.Introduction{max-width:none;position:relative;text-align:center;top:-215px;width:100%;z-index:2}.Introduction .Background{height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%;z-index:-1}.Introduction .GradientOverlay{height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.Introduction .ParticleContainer{height:100%;left:0;position:absolute;top:0;width:100%;z-index:2}.Introduction .GridSvg{height:100%;opacity:.9;width:100%;z-index:3}.Introduction .Particle{animation:particleFloat 8s ease-in-out infinite;background:#80d4ff;background:var(--primary);border-radius:50%;height:6px;opacity:0;position:absolute;width:6px}.Introduction .Particle:first-child{left:10%;top:20%}.Introduction .Particle:nth-child(2){left:80%;top:60%}.Introduction .Particle:nth-child(3){left:30%;top:40%}.Introduction .TextContainer{animation:fadeIn 1.5s ease-out;padding:40px 20px;width:100%}.Introduction h2{animation:fadeInScale 1.5s ease-out;background:linear-gradient(90deg,#80d4ff,#cef);background:linear-gradient(90deg,var(--primary) 0,var(--primaryFg) 100%);-webkit-background-clip:text;background-clip:text;color:#0000;font-size:3rem;font-weight:700;letter-spacing:.05rem;margin-bottom:15px}@keyframes fadeInScale{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.GlowingCursor{animation:blink 1s step-end infinite;color:#80d4ff;color:var(--primary);display:inline-block;font-weight:700;text-shadow:0 0 1px #80d4ff;text-shadow:0 0 1px var(--primary)}@keyframes glowText{0%{text-shadow:0 0 5px #80d4ff,0 0 15px #00a6ff40;text-shadow:0 0 5px var(--primary),0 0 15px var(--primaryHi)}to{text-shadow:0 0 10px #80d4ff,0 0 20px #00a6ff40;text-shadow:0 0 10px var(--primary),0 0 20px var(--primaryHi)}}.Introduction h1{color:#80d4ff;color:var(--primary);font-size:4rem;font-weight:700;margin-bottom:20px}.Introduction p{color:#999;color:var(--textDim);font-size:1.2rem;line-height:1.6;margin:0 auto 40px}.TypingAnimation{color:#80d4ff;color:var(--primary);display:inline-block;font-family:Manrope,sans-serif;font-size:1.5rem;font-weight:400;line-height:1.8;margin:20px auto;max-width:90%;min-height:2.7rem}.Cursor{animation:blink .7s step-end infinite;display:inline-block;font-weight:700}@keyframes blink{50%{opacity:0}}.ButtonGroup{display:flex;gap:15px;justify-content:center;margin-bottom:40px}.ActionButton{border:1px dotted #80d4ff;border:1px dotted var(--buttonBlueBorder);border-radius:.5ch;color:#80d4ff;color:var(--buttonBlue);font-family:Manrope,sans-serif;font-size:1.2rem;font-weight:400;opacity:.9;padding:.95ch 1.79ch;position:relative;text-decoration:none;transition:filter .35s,transform .35s,opacity .35s}.ActionButton:hover{filter:brightness(75%);opacity:1}.ActionButton:active{transform:scale(.95);transition:transform .1s}.ActionButton:before{background:radial-gradient(190.82% 190.82% at 50% 100%,#0af 0,#00a6ff9e 18.09%);background:radial-gradient(190.82% 190.82% at 50% 100%,var(--buttonBlueGradientStart) 0,var(--buttonBlueGradientEnd) 18.09%);content:"";filter:blur(2px);inset:0;opacity:.2;position:absolute}.FeatureBoxes{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:120px}.FeatureBox{-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);background-color:#0000;border:.5px dotted #000;border-radius:10px;height:240px;overflow:hidden;padding:25px;position:relative;text-align:center;transition:all .3s ease;width:400px}.FeatureBox.blue{--boxColor:var(--blue)}.FeatureBox.green{--boxColor:var(--green)}.FeatureBox.purple{--boxColor:var(--purple)}.FeatureBox:hover{border-color:var(--boxColor);transform:scale(1.01)}.FeatureBox .Icon,.FeatureBox .fab,.FeatureBox .fas{color:var(--boxColor)!important;font-size:1.42rem!important;height:.1rem!important;margin-bottom:25px;width:.5rem!important}.FeatureBox h3{color:#fcfcfc;color:var(--text);font-size:2rem;font-weight:700;margin-bottom:10px}.FeatureBox p{color:#999;color:var(--textDim);font-size:1.2rem;line-height:1.8;margin:0 auto;max-width:95%}.Contact,.Portfolio{max-width:none;position:relative;text-align:center;width:100%}.Contact .Background,.Portfolio .Background{height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%;z-index:-1}.Contact .GradientOverlay,.Portfolio .GradientOverlay{background:radial-gradient(circle at center,#00aaff1a 0,#000000f2 80%);background:radial-gradient(circle at center,var(--primaryBg) 0,#000000f2 80%);height:100%;left:0;position:absolute;top:0;width:100%;z-index:1}.Contact h2,.Portfolio h2{animation:fadeIn 1s ease-out;color:#fcfcfc;color:var(--text);font-size:2.5rem;font-weight:700;margin-bottom:40px}.Portfolio{max-width:none;top:-80px!important;width:100%}.Portfolio,.PortfolioHeader{position:relative;text-align:center}.PortfolioHeader{margin-bottom:40px;overflow:hidden}.PortfolioHeader h2{animation:pulseShift 3s ease-in-out infinite;background:linear-gradient(90deg,#80d4ff,#cef);background:linear-gradient(90deg,var(--primary) 0,var(--primaryFg) 100%);-webkit-background-clip:text;background-clip:text;color:#0000;font-size:2.5rem;font-weight:700;position:relative;z-index:1}.PortfolioHeader h2:before{animation:flare 3s ease-in-out infinite;background:radial-gradient(circle,#ffffff1a 0,#0000 70%);content:"";height:140%;left:-10%;opacity:0;position:absolute;top:-20%;width:120%;z-index:-1}.PortfolioHeader .HeaderDescription{animation:fadeInUp 1s ease-out .5s forwards;color:#999;color:var(--textDim);font-size:1.2rem;margin:10px auto 0;max-width:600px;opacity:0}@keyframes fadeInUp{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.Portfolio .Background{height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%;z-index:-1}.NavigationArrows{display:flex;justify-content:space-between;left:0;margin:0 auto 20px;max-width:5280px;padding:0;position:absolute;top:55%;transform:translateY(-50%);width:90%;z-index:2}.Arrow{color:#80d4ff;color:var(--primary);cursor:pointer;font-size:1.5rem;opacity:.7;position:relative;transition:opacity .3s ease}.Arrow:hover{opacity:1}.PrevArrow{left:140px}.NextArrow{right:-50px}.ProjectGridWrapper{box-sizing:border-box;margin:0 auto;max-width:1320px;overflow:hidden;padding-right:130px;position:relative;width:100%}.ProjectGrid{display:flex;flex-wrap:nowrap;gap:20px;position:relative;width:1335px}.ProjectGrid,.ProjectGrid.left,.ProjectGrid.right{transition:transform .3s ease-in-out}.ProjectCard{animation:slideInCard .5s ease-out forwards;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000000b3;border:1px solid #ffffff1a;border-radius:15px;box-shadow:0 4px 12px #0000004d;box-sizing:border-box;cursor:pointer;display:flex;flex:0 0 425px;flex-direction:column;height:500px;opacity:0;overflow:hidden;padding:15px;position:relative;text-decoration:none;transform:translateX(50px);transition:all .3s ease}.ProjectCard:hover{border-color:#0f0;border-color:var(--hover-border-color,#0f0);box-shadow:0 8px 24px #0009;transform:scale(1.02)}.BufferOverlay{pointer-events:none;z-index:10}@keyframes slideInCard{0%{opacity:0;transform:translateX(50px)}to{opacity:1;transform:translateX(0)}}.ImageWrapper{background:linear-gradient(180deg,#0000 0,#000000b3 50%,#000000b3);height:300px;margin:0;overflow:hidden;padding:0;position:relative;width:100%}.ImageWrapper img{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.StatusBox{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#00000080;border:1px solid #fff3;border-radius:6px;box-shadow:0 1px 3px #0003;color:#fcfcfc;color:var(--text);font-size:.8rem;font-weight:700;left:20px;padding:5px 10px;position:absolute;text-transform:uppercase;top:25px}.StatusBox.completed{background-color:#0f03}.StatusBox.in-progress{background-color:#ff03}.StatusBox.archived{background-color:#80808033}.ProjectInfo{flex-grow:1;padding:10px;text-align:left}.ProjectInfo h3{color:#fcfcfc;color:var(--text);font-size:1.5rem;font-weight:700;margin-bottom:6px}.Description{color:#999;color:var(--textDim);font-size:.9rem;line-height:1.4;margin-bottom:8px}.ProjectDetails{display:flex;flex-direction:column;gap:4px}.ProjectDetails p{align-items:center;color:#999;color:var(--textDim);display:flex;font-size:.8rem;gap:6px}.ProjectDetails i{color:#80d4ff;color:var(--primary);font-size:1rem}.Card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#00aaff1a;background:var(--primaryBg);border-radius:15px;box-shadow:0 6px 18px #00000080;padding:25px;text-align:left;transition:transform .4s ease,box-shadow .4s ease}.Card:hover{box-shadow:0 10px 20px #000000b3;transform:scale(1.05)}.Card img{border-radius:10px;height:250px;margin-bottom:15px;object-fit:cover;width:100%}.Card h3{color:#fcfcfc;color:var(--text);font-size:1.8rem;font-weight:700;margin-bottom:10px}.Card p{color:#999;color:var(--textDim);font-size:1.1rem;line-height:1.7;margin-bottom:15px}.CardLink{color:#80d4ff;color:var(--primary);display:inline-block;font-size:1rem;font-weight:700;margin-top:15px;text-decoration:none;transition:color .3s ease,transform .3s ease}.CardLink:hover{color:#cef;color:var(--primaryFg);transform:translateX(5px)}.Contact{max-width:none;min-height:65vh;padding-top:0;position:relative;text-align:center;width:100%}.Contact .Background{overflow:hidden;z-index:-1}.Contact .Background,.Contact .GradientOverlay{height:100%;left:0;position:absolute;top:0;width:100%}.Contact .GradientOverlay{background:radial-gradient(circle at center,#0000001a 0,#000000e6 80%);z-index:1}.ContactForm{animation:fadeIn 1s ease-out;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border:1px solid #ffffff1a;border-radius:15px;box-shadow:0 4px 12px #0000004d;display:flex;flex-direction:column;gap:15px;margin:0 auto;max-width:600px;padding:25px;width:100%}.InputGroup{margin-bottom:15px;position:relative}.ContactInput{box-sizing:border-box;padding:12px 40px 12px 12px;width:100%}.ContactInput:focus{border-color:#80d4ff;border-color:var(--primary);outline:none}.ValidationIcon{font-size:1.2rem;line-height:1;opacity:.9;pointer-events:none;position:absolute;right:12px;top:50%;transform:translateY(-50%);transition:color .6s ease,opacity .6s ease;z-index:1}.ValidationIcon.valid{color:#80d4ff;color:var(--primary)}.ValidationIcon.invalid{color:#c90606}.ContactButton{background:#0000;border:1px dotted #80d4ff;border:1px dotted var(--primary);border-radius:8px;color:#80d4ff;color:var(--primary);cursor:pointer;font-family:Manrope,sans-serif;font-size:1.2rem;font-weight:700;overflow:hidden;padding:12px 24px;position:relative;transition:border-color .3s ease,color .3s ease,transform .3s ease,box-shadow .3s ease}.ContactButton:before{background:linear-gradient(135deg,#0080ff0d,#0080ff26);content:"";height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .3s ease;width:100%;z-index:-1}.ContactButton:hover:before{opacity:1}.ContactButton:hover{border-color:#cef;border-color:var(--primaryFg);box-shadow:0 1px 15px #0080ff33;color:#cef;color:var(--primaryFg);transform:translateY(-2px)}.ContactInput{background:#0000;border:1px solid #fff3;border-radius:8px;color:#fcfcfc;color:var(--text);font-size:1rem;padding:12px;resize:none;transition:border-color .3s ease}.ContactInput,.SuccessMessage{font-family:Manrope,sans-serif}.SuccessMessage{animation:fadeIn 1s ease-out;color:#80d4ff;color:var(--primary);font-size:1.2rem}.SocialLinks{display:flex;gap:20px;justify-content:center;margin-top:20px}.SocialLink{border-bottom:1px dotted #fff3;color:#999;color:var(--textDim);font-family:Manrope,sans-serif;font-size:1rem;font-weight:400;text-decoration:none;transition:color .3s ease,border-color .3s ease}.SocialLink:hover{border-color:#80d4ff;border-color:var(--primary);color:#80d4ff;color:var(--primary)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideIn{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes particleFloat{0%{opacity:0;transform:translate(0)}50%{opacity:.5;transform:translate(10px,-10px)}to{opacity:0;transform:translate(0)}}::-webkit-scrollbar{background-color:initial;width:8px}::-webkit-scrollbar-track{background:#0000;border-radius:4px}::-webkit-scrollbar-thumb{background-color:#80d4ff;background-color:var(--primary);border-radius:4px;-webkit-transition:background-color .3s ease;transition:background-color .3s ease}::-webkit-scrollbar-thumb:hover{background-color:#cef;background-color:var(--primaryFg)}*{scrollbar-color:#80d4ff #0000;scrollbar-color:var(--primary) #0000;scrollbar-width:thin}.NavigationDots{display:flex;flex-direction:column;gap:10px;position:fixed;right:20px;top:50%;transform:translateY(-50%);z-index:1000}.Dot{background-color:#999;background-color:var(--textDim);border-radius:50%;cursor:pointer;height:10px;transition:background-color .3s ease,transform .3s ease;width:10px}.Dot:hover{transform:scale(1.2)}.Dot.active{background-color:#80d4ff;background-color:var(--primary);transform:scale(1.3)}