.navbar{display:flex;justify-content:space-between;align-items:center;padding:15px 40px;background:#111111f2;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);position:sticky;top:0;z-index:1000;box-shadow:0 2px 10px #0003}.nav-links{display:flex;gap:20px}.nav-links button{background:none;border:none;color:#fff;font-size:16px;cursor:pointer;position:relative;transition:color .3s}.nav-links button.active,.nav-links button:hover{color:#00bcd4}.nav-links button.active:after,.nav-links button:hover:after{content:"";position:absolute;left:0;bottom:-5px;width:100%;height:2px;background:#00bcd4;border-radius:2px}.hamburger{display:none;flex-direction:column;cursor:pointer;gap:5px}.hamburger span{width:25px;height:3px;background:#fff;transition:.3s}.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)}@media (max-width: 768px){.nav-links{position:absolute;top:70px;right:-100%;flex-direction:column;background:#111111f2;width:200px;padding:20px;gap:15px;transition:right .3s ease;border-radius:10px 0 0 10px}.nav-links.open{right:0}.hamburger{display:flex}}.home{display:flex;align-items:center;justify-content:space-between;height:100vh;padding:0 10%;background:#0d1117;color:#f8fafc;gap:2rem}.home-left{flex:1;display:flex;flex-direction:column;gap:1rem}.greeting{font-size:1.2rem;opacity:.8}.intro{font-size:3rem;font-weight:700;margin-bottom:.1rem}.intro .highlight{color:#f39c12;font-size:8rem}.tagline{font-size:1.6rem;opacity:.9;max-width:600px;min-height:30px}.cta-buttons{display:flex;gap:1rem;margin-top:1.5rem;flex-wrap:wrap}.btn{padding:.8rem 1.5rem;border-radius:8px;font-size:1rem;text-decoration:none;font-weight:500;transition:all .3s ease}.btn.primary{border:2px solid #00ff6a;background:#161b22;color:#00ff6a}.btn.primary:hover{background:#0d1117;color:#00ff6a;box-shadow:0 0 8px #00ff6a}.home-right{flex:1;display:flex;justify-content:center;align-items:center}.profile-container{border-radius:50%;padding:5px;background:linear-gradient(135deg,#00ff6a,#00e0ff)}.profile-pic{width:400px;height:400px;border-radius:50%;object-fit:cover;border:5px solid #0d1117;transition:transform .3s ease}.profile-pic:hover{transform:scale(1.05)}@media (max-width: 1024px){.intro{font-size:2.5rem}.intro .highlight{font-size:5rem}.profile-pic{width:300px;height:300px}}@media (max-width: 768px){.home{flex-direction:column;text-align:center;height:auto;padding:40px 5%}.home-left{align-items:center}.tagline{font-size:1.4rem;max-width:90%}.intro{font-size:2rem}.intro .highlight{font-size:4rem}.profile-pic{width:250px;height:250px;margin-top:20px}.cta-buttons{justify-content:center}}@media (max-width: 480px){.intro{font-size:1.6rem}.intro .highlight{font-size:2.8rem}.tagline{font-size:1.1rem}.profile-pic{width:180px;height:180px}.btn{width:100%;text-align:center}}.about{padding:60px 10%;background-color:#0d1117;color:#e6edf3}.about-container{display:flex;gap:50px;align-items:flex-start}.about-bio,.about-skills{flex:1}.about h2{font-size:3rem;margin-bottom:20px;color:#58a6ff}.about-bio p{font-size:1.1rem;line-height:1.6;margin-bottom:15px}.about-collab h3{font-size:1.6rem;margin-bottom:10px;color:#58a6ff}.highlight{color:#f39c12;font-weight:700}.skill-category{margin-bottom:25px}.skill-category h3{font-size:1.2rem;color:#f39c12;margin-bottom:10px}.skill-list{display:flex;flex-wrap:wrap;gap:10px}.skill-pill{background:#161b22;border:2px solid #00ff6a;padding:6px 14px;border-radius:50px;font-size:.95rem;color:#e6edf3;transition:all .3s ease;cursor:default}.skill-pill:hover{background:#0d1117;border-color:#00ff6a;color:#00ff6a;box-shadow:0 0 8px #00ff6a}@media (max-width: 900px){.about-container{flex-direction:column}}.about-collab{text-align:center;margin-top:40px}.about-collab h3{font-size:1.6rem;margin-bottom:10px}.about-collab p{font-size:1.1rem;margin-bottom:15px}.arrow{font-size:2rem;cursor:pointer;animation:bounce 1.5s infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(8px)}}@media (max-width: 1024px){.about{padding:50px 8%}.about h2{font-size:2.5rem}.about-container{gap:30px}}.arrow:hover{color:#00ff6a}@media (max-width: 768px){.about{padding:40px 6%}.about-container{flex-direction:column;gap:25px}.about h2{font-size:2.2rem;text-align:center}.about-bio p{font-size:1rem;text-align:center}.about-skills{text-align:center}.skill-pill{font-size:.9rem;padding:6px 12px}}@media (max-width: 480px){.about{padding:30px 5%}.about h2{font-size:1.8rem}.about-bio p{font-size:.95rem}.about-collab h3{font-size:1.3rem}.about-collab p{font-size:1rem}.skill-pill{font-size:.85rem;padding:5px 10px}.arrow{font-size:1.5rem}.arrow:hover{color:#00ff6a}}.projects{padding:40px 20px;text-align:center;background:#0d1117;color:#fff;position:relative}.projects h2{font-size:2.5rem;margin-bottom:5px;color:#58a6ff}.project-slide{display:flex;align-items:center;justify-content:center;gap:40px;max-width:1100px;margin:0 auto;flex-wrap:wrap;opacity:0;transform:translateY(20px);animation:fadeIn .6s ease forwards}@keyframes fadeIn{to{opacity:1;transform:translateY(0)}}.project-image img{width:450px;max-width:100%;height:auto;margin:2px;border-radius:12px;box-shadow:0 6px 25px #0006;transition:transform .4s ease}.project-image img:hover{transform:scale(1.03)}.project-details{max-width:500px;text-align:left;padding:15px}.project-details h3{font-size:1.8rem;color:#f39c12;margin-bottom:10px}.project-details .desc{color:#bbb;margin-bottom:20px;font-size:1rem;line-height:1.5}.project-details p{margin:5px 0;font-size:.95rem}.project-links{margin-top:20px}.project-links a{margin-right:20px;text-decoration:none;font-weight:600;color:#58a6ff;transition:color .3s ease}.project-links a:hover{color:#1f6feb}.project-nav{display:flex;justify-content:center;align-items:center;margin-top:30px;gap:20px;font-size:1.2rem;color:#aaa}.project-nav button{background:#58a6ff26;border:none;padding:12px 18px;border-radius:50%;cursor:pointer;color:#58a6ff;font-size:1.5rem;transition:all .3s ease}.project-nav button:hover{background:#58a6ff;color:#0d1117}.project-nav span{font-size:1rem;color:#bbb}.container{transform-style:preserve-3d;perspective:1000px;margin-top:8px;display:flex;justify-content:center}.pane{outline:2px solid #00ff6a;box-shadow:0 0 10px #00ff6a77,inset 0 0 10px #00ff6a77;height:1cm;width:4.5cm;border-radius:5px;position:relative;overflow:hidden;transition:.7s ease;display:flex}.label{flex:1;font-weight:600;font-size:22px;position:relative;z-index:1;color:#00ff6a;text-align:center;line-height:1cm;cursor:pointer;transition:.3s;-webkit-user-select:none;user-select:none}.selection{position:absolute;height:1cm;width:50%;z-index:0;left:0;top:0;background-color:#00ff6a;transition:transform .3s ease;border-radius:3px}.pane:has(.label:first-child:hover) .selection{transform:translate(100%)}.pane:has(.label:last-child:hover) .selection{transform:translate(100%)}.project-details h4{color:#00ff6a;margin-bottom:15px;font-size:1.4rem;font-weight:600;border-bottom:1px solid #333;padding-bottom:5px;letter-spacing:.5px}.project-info{margin-top:15px;border-top:1px solid #222;border-bottom:1px solid #222}.project-info-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #222}.project-info-row:last-child{border-bottom:none}.project-info-row strong{font-size:1rem;font-weight:600;color:#fff}.project-info-row span{font-size:1rem;color:#bbb}.button-group{display:flex;gap:1rem;margin-top:20px}.btn{display:inline-flex;gap:-.5rem;padding:.7rem 1.3rem;font-size:1rem;font-weight:600;border:2px solid #00ff6a;background:#161b22;color:#00ff6a;border-radius:9999px;text-decoration:none;transition:all .3s ease}.btn i{font-size:1.2rem}.btn:hover{transform:translateY(-3px) scale(1.05);background:#0d1117;color:#00ff6a;box-shadow:0 0 8px #00ff6a}.project-slider{overflow:hidden;width:100%;max-width:1200px;margin:0 auto}.project-track{display:flex}.project-slide{min-width:100%;display:flex;align-items:center;justify-content:center;gap:40px;padding:20px;box-sizing:border-box}@media (max-width: 1024px){.projects h2{font-size:2.2rem}.project-slide{gap:25px;flex-wrap:wrap}.project-details h3{font-size:1.6rem}}@media (max-width: 768px){.projects{padding:30px 15px}.projects h2{font-size:2rem}.project-slide{flex-direction:column;text-align:center}.project-details{text-align:center;max-width:100%}.project-info-row{flex-direction:column;align-items:flex-start;gap:4px}.btn{font-size:.95rem;padding:.6rem 1.1rem}.label{font-size:18px}}@media (max-width: 480px){.projects h2{font-size:1.7rem}.project-details h3{font-size:1.3rem}.project-details h4{font-size:1.1rem}.project-details .desc,.project-info-row strong,.project-info-row span{font-size:.9rem}.project-nav button{padding:8px 12px;font-size:1.2rem}.label{font-size:16px;line-height:.9cm}.pane{width:3.5cm;height:.9cm}}.contact{padding:80px 5%;background-color:#0d1117;color:#e6edf3}.contact-container{display:flex;gap:60px;align-items:flex-start;max-width:1200px;margin:0 auto;flex-wrap:wrap}.contact-form{flex:1.2;min-width:300px}.contact-form h2{font-size:2.5rem;color:#58a6ff;margin-bottom:15px}.contact-form p{font-size:1.1rem;margin-bottom:25px}.contact-form form{display:flex;flex-direction:column;gap:15px}.form-row{display:flex;gap:15px}.form-row input{flex:1}.contact-form input,.contact-form textarea{padding:12px 15px;border-radius:8px;border:2px solid #161b22;background-color:#161b22;color:#e6edf3;font-size:1rem;resize:none;transition:all .3s ease;width:100%}.contact-form input:focus,.contact-form textarea:focus{border-color:#38bdf8;box-shadow:0 0 8px #38bdf880;outline:none}.contact-form button{padding:14px 28px;border-radius:8px;border:none;background-color:#38bdf8;color:#111;font-weight:700;font-size:1.1rem;cursor:pointer;transition:all .3s ease}.contact-form button:hover{background-color:#0ea5e9;transform:translateY(-3px)}.contact-info{flex:.8;min-width:280px;background:#ffffff0d;padding:25px;border-radius:12px;box-shadow:0 6px 14px #00000059}.contact-info h2{font-size:2rem;color:#58a6ff;margin-bottom:15px}.contact-info p{font-size:1rem;margin-bottom:10px}.contact-info a{color:#38bdf8;text-decoration:none;transition:color .3s ease}.contact-info a:hover{color:#f39c12}.social-links{display:flex;gap:15px;margin:15px 0;flex-wrap:wrap}.social-links a{display:inline-flex;align-items:center;justify-content:center;width:45px;height:45px;border-radius:50%;background:#161b22;transition:all .3s ease}.social-links a:hover{background:#38bdf8;transform:scale(1.2);box-shadow:0 4px 12px #0000004d;color:#111}.social-links a svg{width:20px;height:20px;color:#e6edf3}.location{margin-top:10px;font-size:.9rem;color:#8b949e}@media (max-width: 1024px){.contact-container{gap:40px}.contact-form h2,.contact-info h2{font-size:2rem}}@media (max-width: 768px){.contact-container{flex-direction:column;gap:30px}.contact-form,.contact-info{width:100%}.form-row{flex-direction:column}.contact-form h2{font-size:2rem}.contact-form p{font-size:1rem}.contact-info h2{font-size:1.6rem}}.back-to-top-container{display:flex;justify-content:center;margin-top:25px}.button{width:50px;height:50px;border-radius:50%;background-color:#141414;border:none;font-weight:600;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 4px #b4a0ff41;cursor:pointer;transition-duration:.3s;overflow:hidden;position:relative}.svgIcon{width:12px;transition-duration:.3s}.svgIcon path{fill:#fff}.button:hover{width:140px;border-radius:50px;transition-duration:.3s;background-color:#58a6ff;align-items:center}.button:hover .svgIcon{transition-duration:.3s;transform:translateY(-200%)}.button:before{position:absolute;bottom:-20px;content:"Back to Top";color:#fff;font-size:0px}.button:hover:before{font-size:13px;opacity:1;bottom:unset;transition-duration:.3s}.footer{background:#0f0f0f;color:#e5e7eb;padding:20px 0;text-align:center;margin-top:0;border-top:1px solid rgba(255,255,255,.1)}.footer-content{display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center}.footer p{margin:0;font-size:14px;color:#aaa}.footer-links{display:flex;gap:20px}.footer-links a{text-decoration:none;color:#58a6ff;font-size:14px;transition:color .3s ease}.footer-links a:hover{color:#fff}.loading-container{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;background:#0a0a0a;color:#fff}.loading-text{font-size:1.2rem;font-weight:500;letter-spacing:1px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-screen{display:flex;justify-content:center;align-items:center;height:100vh;width:100%;background:#0d1117}.loader{color:#00ff6a;font-family:Poppins,sans-serif;font-weight:500;font-size:25px;box-sizing:content-box;height:40px;padding:10px;display:flex;border-radius:8px;text-shadow:0 0 6px rgba(0,255,106,.8),0 0 12px rgba(0,255,106,.5)}.words{overflow:hidden;position:relative}.words:after{content:"";position:absolute;inset:0;background:linear-gradient(var(--bg-color) 10%,transparent 30%,transparent 70%,var(--bg-color) 90%);z-index:20}.word{display:block;height:100%;padding-left:6px;color:#58a6ff;animation:spin_4991 5s infinite}@keyframes spin_4991{0%,15%{transform:translateY(0)}20%,35%{transform:translateY(-100%)}40%,55%{transform:translateY(-200%)}60%,75%{transform:translateY(-300%)}80%,90%{transform:translateY(-400%)}to{transform:translateY(0)}}.navbar{position:sticky;top:0;width:100%;background:#111;display:flex;justify-content:space-between;align-items:center;padding:15px 40px;z-index:1000}.logo{color:#fff;font-size:22px;font-weight:700}.nav-links{list-style:none;display:flex;gap:20px}.nav-links li a{color:#fff;text-decoration:none;font-size:16px;transition:color .3s}.nav-links li a:hover{color:#00bcd4}.App{display:flex;flex-direction:column;min-height:100vh}.main-content{flex:1}html{scroll-behavior:smooth;font-size:16px}@media (max-width: 768px){.navbar{padding:12px 20px}.logo{font-size:20px}.nav-links{gap:12px}.nav-links li a{font-size:14px}}@media (max-width: 480px){.navbar{flex-direction:column;align-items:flex-start;padding:10px 15px}.nav-links{flex-direction:column;gap:10px;margin-top:10px;width:100%}.nav-links li a{font-size:14px;display:block;padding:5px 0}.logo{font-size:18px}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#fff;color:#333;line-height:1.6;font-size:16px;overflow-x:hidden}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}@media (max-width: 768px){body{font-size:15px}.container{padding:0 15px}}@media (max-width: 480px){body{font-size:14px;line-height:1.5}.container{padding:0 10px}}
