:root{--primary: #0a192f;--secondary: #112240;--text: #ccd6f6;--highlight: #64ffda;--muted: #8892b0}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,sans-serif}html{scroll-behavior:smooth}body{background-color:var(--primary);color:var(--text);overflow-x:hidden;opacity:0;animation:fadeIn .5s ease-in forwards;animation-delay:.2s}@keyframes fadeIn{to{opacity:1}}a:focus,button:focus,input:focus,textarea:focus{outline:2px solid var(--highlight);outline-offset:2px}a:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none}::selection{background-color:var(--highlight);color:var(--primary)}::-moz-selection{background-color:var(--highlight);color:var(--primary)}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:var(--primary)}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--highlight) 0%,#3a76f0 100%);border-radius:6px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#4dd4ac,#2863e5)}#bg-canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1}.loader{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,var(--primary) 0%,var(--secondary) 100%);display:flex;justify-content:center;align-items:center;z-index:9999;transition:opacity .5s ease-out}.loader.hidden{opacity:0;pointer-events:none;visibility:hidden}.loader-content{text-align:center}.loader-icon{width:50px;height:50px;border:5px solid var(--secondary);border-top:5px solid var(--highlight);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 20px}.loader-text{color:var(--text);font-size:18px;margin-bottom:20px;letter-spacing:1px}.loader-progress{width:200px;height:4px;background-color:var(--secondary);border-radius:2px;overflow:hidden;margin:0 auto}.loader-progress-bar{height:100%;background:linear-gradient(90deg,var(--highlight),#3a76f0);width:0%;animation:loading 1.5s ease-in-out forwards;border-radius:2px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes loading{0%{width:0%}to{width:100%}}header{padding:20px;position:fixed;top:0;width:100%;background-color:#0a192fcc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;transition:transform .3s ease}header.hidden{transform:translateY(-100%)}nav{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}.logo{font-size:24px;font-weight:700;color:var(--highlight)}.nav-links{display:flex;gap:30px}.nav-links a{color:var(--text);text-decoration:none;font-size:16px;transition:color .3s ease;font-weight:500}.nav-links a:hover{color:var(--highlight)}.mobile-menu{display:none;font-size:24px;cursor:pointer;color:var(--text)}section{min-height:100vh;padding:100px 20px;max-width:1200px;margin:0 auto;position:relative;scroll-margin-top:100px}.hero{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:20px;padding:120px 20px 80px}.header-badge{display:inline-block;color:var(--text);background-color:#112240cc;font-size:18px;font-weight:500;padding:8px 20px;border-radius:50px;margin-bottom:20px;border:1px solid var(--highlight)}.main-name{font-size:72px;font-weight:800;line-height:1.1;margin-bottom:10px;background:linear-gradient(to right,var(--text) 0%,var(--highlight) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-2px}.specialty-text{color:var(--highlight);font-size:24px;font-weight:500;margin-bottom:20px;height:36px}.blinking-cursor{animation:blink 1s step-end infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.hero-desc{font-size:18px;max-width:650px;color:var(--muted);margin:0 auto 30px;line-height:1.6}.hero-buttons{display:flex;gap:20px;justify-content:center;margin-bottom:30px}.cta{display:inline-block;padding:12px 25px;border-radius:4px;text-decoration:none;font-weight:600;transition:all .3s ease;font-size:16px;letter-spacing:.5px}.primary-button{background-color:#3a76f0;color:#fff;border:none;box-shadow:0 4px 14px #3a76f04d}.primary-button:hover{background-color:#2863e5;transform:translateY(-3px);box-shadow:0 7px 14px #3a76f066}.secondary-button{background-color:transparent;color:var(--text);border:1px solid var(--text)}.secondary-button:hover{background-color:#ccd6f61a;transform:translateY(-3px)}.social-icons{display:flex;gap:25px}.social-icons a{color:var(--text);font-size:22px;transition:all .3s ease}.social-icons a:hover{color:var(--highlight);transform:translateY(-3px)}.about{display:grid;grid-template-columns:3fr 2fr;gap:50px}.about-image{position:relative}.image-placeholder{width:100%;aspect-ratio:4/5;background:linear-gradient(135deg,var(--secondary) 0%,rgba(100,255,218,.1) 100%);border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:80px;color:var(--highlight);transition:all .5s ease}.image-placeholder:hover{transform:scale(1.05)}.about-image:after{content:"";position:absolute;top:15px;left:15px;width:100%;height:100%;border:2px solid var(--highlight);border-radius:5px;z-index:-1;transition:all .3s ease}.about-image:hover:after{top:10px;left:10px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;margin-top:40px}.stat-card{background:linear-gradient(135deg,var(--secondary) 0%,rgba(100,255,218,.05) 100%);padding:30px 20px;border-radius:8px;text-align:center;border:1px solid rgba(100,255,218,.1);transition:all .3s ease}.stat-card:hover{transform:translateY(-5px);border-color:var(--highlight);box-shadow:0 10px 30px #64ffda33}.stat-number{font-size:36px;font-weight:800;color:var(--highlight);margin-bottom:8px;background:linear-gradient(135deg,var(--highlight) 0%,#4dd4ac 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-label{font-size:14px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}.section-title{position:relative;margin-bottom:60px;display:flex;align-items:center;font-size:42px}.section-title:before{content:"";margin-right:20px;width:50px;height:3px;background-color:var(--highlight)}.section-title:after{content:"";flex:1;height:1px;background-color:var(--muted);margin-left:20px}.skills{padding-top:140px}.skills-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:30px}.skill-category{background-color:var(--secondary);padding:25px;border-radius:5px;box-shadow:0 10px 30px #020c1bb3;transition:all .3s ease;position:relative;overflow:hidden}.skill-category:before{content:"";position:absolute;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--highlight),#3a76f0);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}.skill-category:hover:before{transform:scaleX(1)}.skill-category:hover{transform:translateY(-5px) scale(1.02);box-shadow:0 15px 30px #020c1be6;border-color:var(--highlight)}.skill-category h3{font-size:24px;margin-bottom:10px;color:var(--highlight);font-weight:600}.skill-list{list-style-type:none;margin-top:15px}.skill-list li{display:flex;align-items:center;margin-bottom:10px}.skill-list li:before{content:"▹";color:var(--highlight);margin-right:10px}.projects{padding-top:140px}.project-card{margin-bottom:100px;position:relative}.project-card.featured .project-content{background:linear-gradient(135deg,var(--secondary) 0%,rgba(100,255,218,.05) 100%);border:2px solid rgba(100,255,218,.2)}.project-badge{display:inline-block;background:linear-gradient(135deg,var(--highlight) 0%,#4dd4ac 100%);color:var(--primary);padding:6px 16px;border-radius:20px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;margin-bottom:15px;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{box-shadow:0 0 #64ffdab3}50%{box-shadow:0 0 0 10px #64ffda00}}.project-content{background-color:var(--secondary);padding:40px;border-radius:5px;box-shadow:0 10px 30px #020c1bb3;transition:transform .3s ease,box-shadow .3s ease;position:relative;overflow:hidden}.project-content:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(100,255,218,.1),transparent);transition:left .5s ease}.project-content:hover:before{left:100%}.project-content:hover{transform:translateY(-5px);box-shadow:0 15px 40px #020c1be6}.project-title{font-size:26px;margin-bottom:15px;color:var(--highlight)}.project-description{margin-bottom:20px;color:var(--muted);line-height:1.6}.project-tech{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.project-tech span{background-color:#64ffda1a;color:var(--highlight);padding:5px 10px;border-radius:3px;font-size:14px}.project-links{display:flex;gap:15px}.project-links a{color:var(--text);font-size:20px;transition:color .3s ease}.project-links a:hover{color:var(--highlight)}.contact{text-align:center;padding-top:140px;padding-bottom:100px}.contact-title{font-size:50px;margin-bottom:20px}.contact-desc{max-width:600px;margin:0 auto 50px;color:var(--muted)}.contact-form{max-width:600px;margin:0 auto}.form-group{margin-bottom:20px}.form-group label{display:block;text-align:left;margin-bottom:5px;color:var(--text)}.form-group input,.form-group textarea{width:100%;padding:12px 15px;background-color:var(--secondary);border:1px solid var(--muted);border-radius:4px;color:var(--text);font-size:16px;transition:all .3s ease}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:var(--highlight);box-shadow:0 0 0 2px #64ffda33}.form-group textarea{min-height:150px;resize:vertical}.submit-btn{background-color:transparent;color:var(--highlight);border:1px solid var(--highlight);padding:12px 30px;font-size:16px;border-radius:4px;cursor:pointer;transition:all .3s ease}.submit-btn:hover{background-color:#64ffda1a;transform:translateY(-3px);box-shadow:0 5px 15px #64ffda33}footer{padding:30px 20px;text-align:center;color:var(--muted);font-size:14px;border-top:1px solid var(--secondary)}.social-links{display:flex;justify-content:center;gap:20px;margin:0 auto 20px}.social-links a{color:var(--text);font-size:20px;transition:all .3s ease}.social-links a:hover{color:var(--highlight);transform:translateY(-3px)}.back-to-top{position:fixed;bottom:30px;right:30px;width:40px;height:40px;background-color:var(--secondary);color:var(--highlight);border-radius:50%;display:flex;justify-content:center;align-items:center;text-decoration:none;opacity:0;visibility:hidden;transition:all .3s ease;box-shadow:0 5px 15px #020c1b80;z-index:99}.back-to-top.visible{opacity:1;visibility:visible}.back-to-top:hover{transform:translateY(-3px);box-shadow:0 8px 20px #020c1bb3}.quick-contact-fab{position:fixed;bottom:90px;right:30px;width:56px;height:56px;background:linear-gradient(135deg,var(--highlight) 0%,#3a76f0 100%);color:var(--primary);border-radius:50%;display:flex;justify-content:center;align-items:center;text-decoration:none;font-size:20px;box-shadow:0 4px 20px #64ffda66;z-index:98;transition:all .3s ease;animation:float 3s ease-in-out infinite}.quick-contact-fab:hover{transform:scale(1.1) translateY(-3px);box-shadow:0 8px 30px #64ffda99}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.mobile-nav{position:fixed;top:0;right:0;width:75%;max-width:300px;height:100vh;background-color:var(--secondary);z-index:101;padding:80px 20px 20px;transform:translate(100%);transition:transform .3s ease;box-shadow:-10px 0 30px #020c1bb3}.mobile-nav.open{transform:translate(0)}.mobile-nav-links{display:flex;flex-direction:column;gap:20px}.mobile-nav-links a{color:var(--text);text-decoration:none;font-size:18px;font-weight:500;padding:10px;border-bottom:1px solid rgba(140,147,175,.1);transition:color .3s ease}.mobile-nav-links a:hover{color:var(--highlight)}.close-menu{position:absolute;top:20px;right:20px;font-size:24px;color:var(--text);cursor:pointer;transition:color .3s ease}.close-menu:hover{color:var(--highlight)}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0a192fb3;z-index:100;opacity:0;visibility:hidden;transition:all .3s ease}.overlay.open{opacity:1;visibility:visible}.scroll-indicator{position:fixed;bottom:40px;left:50%;transform:translate(-50%);z-index:90;opacity:1;transition:opacity .3s ease}.scroll-indicator.hidden{opacity:0;pointer-events:none}.mouse{width:26px;height:40px;border:2px solid var(--highlight);border-radius:15px;display:flex;justify-content:center;margin:0 auto 8px}.wheel{width:4px;height:8px;background-color:var(--highlight);border-radius:2px;margin-top:6px;animation:scroll 1.5s ease-in-out infinite}@keyframes scroll{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(12px)}}.arrow-down{display:flex;flex-direction:column;align-items:center}.arrow-down span{display:block;width:8px;height:8px;border-right:2px solid var(--highlight);border-bottom:2px solid var(--highlight);transform:rotate(45deg);margin:-4px 0;animation:arrow 1.5s ease-in-out infinite}.arrow-down span:nth-child(2){animation-delay:.2s}@keyframes arrow{0%,to{opacity:0}50%{opacity:1}}@media (max-width: 1024px){.main-name{font-size:56px}.about{grid-template-columns:1fr}.about-image{max-width:400px;margin:0 auto}.stats-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.nav-links{display:none}.mobile-menu{display:block}.main-name{font-size:42px;letter-spacing:-1px}.section-title{font-size:28px}.section-title:before{width:30px;margin-right:15px}.section-title:after{margin-left:15px}.hero{padding:100px 15px 60px}.hero-desc{font-size:16px;max-width:100%}.hero-buttons{flex-direction:column;width:100%;max-width:300px}.cta{width:100%}.specialty-text{font-size:20px}section{padding:80px 15px}.stats-grid{grid-template-columns:1fr;gap:15px}.stat-number{font-size:28px}.skills-container{grid-template-columns:1fr;gap:20px}.project-content{padding:25px}.project-title{font-size:22px}.project-tech{gap:8px}.project-tech span{font-size:12px;padding:4px 8px}.contact-title{font-size:36px}.contact-desc,.form-group input,.form-group textarea{font-size:16px}.scroll-indicator{bottom:20px}.back-to-top{bottom:20px;right:20px;width:50px;height:50px}.quick-contact-fab{bottom:80px;right:20px;width:50px;height:50px;font-size:18px}}@media (max-width: 480px){.main-name{font-size:32px}.header-badge{font-size:14px;padding:6px 16px}.specialty-text{font-size:18px}.section-title,.stat-number{font-size:24px}.stat-label{font-size:12px}.project-card{margin-bottom:60px}.social-icons{gap:20px}.social-icons a{font-size:20px}}
