@import"https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif;scroll-behavior:smooth;color:#252525}:root{--bg: #ededed;--text: #151515;--yellow: #d5b26c;--red: rgb(239, 119, 119);--green: rgb(109, 197, 182)}body{overflow:overlay;background-color:var(--bg);max-width:100vw}.App{z-index:1;overflow:hidden}.blob-cont{display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:0;height:500px;width:500px;position:absolute;right:0em;bottom:0em;scale:.5;opacity:.9}@media (max-width: 768px){.blob-cont{right:0em;bottom:-5em}}.blob-cont .blob{border-radius:100px;filter:blur(50px)}.blob-cont .yellow{background-color:var(--yellow);position:absolute;top:200px;left:100px;height:200px;width:200px;animation:yellow 8s infinite ease}.blob-cont .blue{background-color:var(--green);position:absolute;top:80px;right:-20px;height:200px;width:250px;animation:green 8s infinite ease}.blob-cont .red{background-color:var(--red);position:absolute;right:0;top:300px;height:250px;width:200px;animation:red 8s infinite linear}@keyframes yellow{0%{top:200px;left:100px;transform:scale(1)}30%{top:300px;left:150px;transform:scale(1.2)}60%{top:100px;left:200px;transform:scale(1.3)}to{top:200px;left:100px;transform:scale(1)}}@keyframes green{0%{top:80px;right:-20px;transform:scale(1.2)}30%{top:300px;right:-20px;transform:scale(1)}60%{top:200px;right:100px;transform:scale(1)}to{top:80px;right:-20px;transform:scale(1.2)}}@keyframes red{0%{top:250px;right:0px;transform:scale(1)}30%{top:150px;right:150px;transform:scale(1.4)}60%{top:250px;right:100px;transform:scale(1)}to{top:250px;right:0px;transform:scale(1)}}.App-wrapper{position:absolute;top:0;left:0;width:100%;z-index:1;display:flex;flex-direction:column;align-items:center}.App-wrapper>div{width:100%}::-webkit-scrollbar-track{background-color:#f5f5f500}::-webkit-scrollbar{width:6px;background-color:#f5f5f500}::-webkit-scrollbar-thumb{border-radius:4px;background-color:#1515157b}@media (max-width: 768px){.cursor{display:none}}nav{position:sticky;top:0;width:100%;padding:24px 64px;display:flex;justify-content:space-between;backdrop-filter:blur(10px);z-index:99999;flex-direction:row}@media (max-width: 768px){nav{padding:12px;gap:.5rem;align-items:center;justify-content:center;flex-direction:column}}nav .logo{font-weight:600;font-size:20px;letter-spacing:1px}nav .logo a{text-decoration:none}nav .nav-options{display:flex;gap:36px}nav .nav-options a{text-decoration:none}.hero-container{min-width:70vw;min-height:95vh;display:grid;place-content:center;gap:2rem}.hero-container .hero-wrapper{display:grid}.hero-container .top-wrapper{display:flex;gap:1rem;justify-content:space-between;align-items:center}@media (max-width: 768px){.hero-container .top-wrapper{padding:0 4rem 0 2rem;gap:2rem}}.hero-container .top-wrapper>div{background-color:#ffffff50;filter:drop-shadow(0px 0px 4px rgba(0,0,0,.25));padding:.5rem;box-shadow:inset 0 0 5px #00000040;backdrop-filter:blur(50px)}.hero-container .top-wrapper .pfp{position:relative;width:120px;height:120px;aspect-ratio:1/1;border-radius:2rem}@media (max-width: 768px){.hero-container .top-wrapper .pfp{width:100px;height:100px;border-radius:2rem}}.hero-container .top-wrapper .pfp img{border-radius:1.5rem;width:100%;height:100%;object-fit:cover}.hero-container .top-wrapper .socials-wrapper{border-radius:1.5rem;display:flex;align-items:center;gap:4px;justify-content:center;padding:.5rem;aspect-ratio:3/1;height:70%}@media (max-width: 768px){.hero-container .top-wrapper .socials-wrapper{flex-direction:column;height:80%;max-width:4rem;border-radius:1rem}}.hero-container .top-wrapper .socials-wrapper .social-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background-color:#fff;border-radius:1rem;height:100%;width:100%;font-size:12px;padding:.5rem}.hero-container .top-wrapper .socials-wrapper .social-btn svg{width:1rem;height:1rem}.hero-container .top-wrapper .socials-wrapper .social-btn:first-child{border-radius:1rem .5rem .5rem 1rem}@media (max-width: 768px){.hero-container .top-wrapper .socials-wrapper .social-btn:first-child{border-radius:.75rem .75rem 0rem 0rem}}.hero-container .top-wrapper .socials-wrapper .social-btn:last-child{border-radius:.5rem 1rem 1rem .5rem}@media (max-width: 768px){.hero-container .top-wrapper .socials-wrapper .social-btn:last-child{border-radius:0rem 0rem .75rem .75rem}}.hero-container .hero-content{display:grid;gap:1rem}@media (max-width: 768px){.hero-container .hero-content{padding:0 2rem}}.hero-container .title{display:flex;align-items:start;gap:0rem;width:fit-content;flex-direction:column}@media (max-width: 768px){.hero-container .title{align-items:start;gap:0rem}}.hero-container .title span{height:fit-content}.hero-container .title .name-title{font-size:24px;font-weight:300}@media (max-width: 768px){.hero-container .title .name-title{font-size:12px}}.hero-container .title .name{font-weight:700;font-size:32px;letter-spacing:1px;opacity:85%;text-transform:uppercase}@media (max-width: 768px){.hero-container .title .name{font-size:16px}}.hero-container .title .work-title{font-weight:400;font-size:26px;opacity:60%;color:#000000c6}@media (max-width: 768px){.hero-container .title .work-title{font-size:14px}}.hero-container .title .separetor{display:inline-block;height:1px;opacity:60%;width:1.5rem;border-radius:5rem;background-color:#00000040;width:100%}.hero-container .heading{font-weight:700;font-size:26px;letter-spacing:1.4px;opacity:90%}@media (max-width: 768px){.hero-container .heading{font-size:20px}}.hero-container .description{max-width:550px;font-weight:300;font-size:18px;line-height:24px;opacity:60%;text-align:justify}@media (max-width: 768px){.hero-container .description{max-width:90%;font-size:14px}}.hero-container .btn{text-decoration:none;font-weight:400;font-size:16px;border:2px solid #000;width:fit-content;padding:.6rem 1rem;border-radius:.5rem;letter-spacing:1px;display:flex;align-items:center;gap:.5rem;box-shadow:0 0 #000;position:relative;overflow:hidden;backdrop-filter:blur(100px);background-color:#e6e6e633}.hero-container .btn svg{position:absolute;filter:invert(1);width:18px;height:15px;right:-28px}.hero-container .btn:hover{border:2px solid #000;box-shadow:40px 0 #000;overflow:unset}.hero-container .btn:hover svg{transition:all .3s ease;rotate:90deg;scale:1.05}.projects-container{display:grid;gap:64px;width:80%}@media (max-width: 768px){.projects-container{width:100%;gap:32px}}.projects-container .header{font-weight:500;font-size:22px;letter-spacing:-.2px;color:#000000de;align-items:center;height:fit-content;position:relative;padding-left:64px;display:flex;gap:10px}@media (max-width: 768px){.projects-container .header{padding-left:32px}}@media (max-width: 768px){.projects-container .header{font-size:18px}}.projects-container .header svg{width:20px;height:20px;left:-40px}.projects-container .projects-wrapper{display:flex;flex-direction:column;align-items:center;width:100%}.projects-container .projects-wrapper>:nth-child(2n) .project-wrapper{flex-direction:row-reverse}@media (max-width: 768px){.projects-container .projects-wrapper .project-wrapper{flex-direction:column-reverse}.projects-container .projects-wrapper>:nth-child(2n) .project-wrapper{flex-direction:column-reverse}}.projects-container .projects-wrapper .project-container{width:100%;display:flex;flex-direction:column;align-items:center;padding:3rem 0;transform-style:preserve-3d;perspective:1100px;padding:2rem}@media (max-width: 768px){.projects-container .projects-wrapper .project-container{padding:1rem 1.5rem}}.project-wrapper{border-radius:15px;padding:2rem 5rem;display:flex;align-items:center;gap:32px;transform-style:preserve-3d;backdrop-filter:blur(50px);perspective-origin:bottom}@media (max-width: 768px){.project-wrapper{flex-direction:column;gap:1rem;padding:2rem 0rem}}.project-wrapper .project-content{display:flex;flex-direction:column;gap:1rem;max-width:30rem}@media (max-width: 768px){.project-wrapper .project-content{padding:0rem 3rem}}.project-wrapper .project-content .heading{font-weight:600;font-size:20px;letter-spacing:1px}@media (max-width: 768px){.project-wrapper .project-content .heading{font-size:16px}}.project-wrapper .project-content .description{max-width:400px;font-weight:400;font-size:17px;opacity:.8}@media (max-width: 768px){.project-wrapper .project-content .description{font-size:14px}}.project-wrapper .project-content .points{display:flex;flex-direction:column;gap:.5rem;font-weight:400;font-size:13px;opacity:.8}@media (max-width: 768px){.project-wrapper .project-content .points{font-size:12px}}.project-wrapper .project-content .points .point{display:flex;gap:.5rem}@media (max-width: 768px){.project-wrapper .project-content .points .point{gap:.3rem}}.project-wrapper .project-content .points .point svg{width:8px;height:8px}.project-wrapper .project-content .points .point svg circle{fill:#6242b9}.project-wrapper .project-content .points .point .point-text{opacity:.8}@media (max-width: 768px){.project-wrapper .project-content .points .point .point-text{font-size:12px}}.project-wrapper .project-content .links{display:flex;gap:1rem;align-items:center}.project-wrapper .project-content .links div{display:flex;align-items:center;gap:.2rem;transition:all .1s ease-in-out}.project-wrapper .project-content .links div svg{transition:all .1s ease-in-out}.project-wrapper .project-content .links div :hover{transition:all .1s ease-in-out;transform:scale(1.1)}.project-wrapper .project-content .links div a{height:fit-content;text-decoration:none}.project-wrapper .project-content .links .playstore-link svg{width:20px;height:20px;transition:all .1s ease-in-out}.project-wrapper .project-content .links .live-link{font-weight:500;font-size:14px;letter-spacing:.5px;opacity:.8;transition:all .1s ease-in-out}.project-wrapper .project-content .links .live-link a{display:flex;align-items:center;gap:.5rem}.project-wrapper .project-content .links .live-link:hover{opacity:1;transition:all .1s ease-in-out}.project-wrapper .project-content .links .live-link:hover svg{transition:all .1s ease-in-out;rotate:-45deg}.techstack-wrapper{display:flex;gap:.5rem;flex-wrap:wrap}.tech-tag{background:#EEEFF0;box-shadow:0 0 10px #00000026;backdrop-filter:blur(50px);padding:.4rem .8rem;border-radius:10px;font-weight:500;font-size:12px;letter-spacing:1px;color:#000c}@media (max-width: 768px){.tech-tag{font-size:10px;backdrop-filter:none}}.project-img{width:400px;height:300px;display:grid;place-items:center}.project-img img{width:100%;height:100%;object-fit:contain}@media (max-width: 768px){.project-img{width:100%;height:100%;max-height:200px}.project-img img{max-height:200px;max-width:90%;object-fit:contain}}.about-container{min-height:100vh;width:100VW;display:flex;flex-direction:column;align-items:center;justify-content:space-around;gap:64px;overflow:hidden;padding:4rem 0rem}.about-container .header{width:100vw;font-weight:500;font-size:22px;letter-spacing:-.2px;color:#000000de;align-items:center;height:fit-content;position:relative;padding-left:64px;display:flex;gap:10px}@media (max-width: 768px){.about-container .header{padding-left:32px}}.about-container .header svg{width:20px;height:20px}.about-container .about-wrapper{width:80%;display:flex;gap:2rem;align-items:center}@media (max-width: 768px){.about-container .about-wrapper{display:grid}}.about-container .about-wrapper .text{display:flex;flex-direction:column;gap:1rem}.skills-wrapper{width:80%;overflow-x:hidden;display:flex;align-items:center;height:8rem;border-radius:20px}@media (max-width: 768px){.skills-wrapper{width:100%;height:3rem}}.skills-wrapper .skillIcon{max-height:3rem;object-fit:contain;filter:grayscale(20%);opacity:.8}@media (max-width: 768px){.skills-wrapper .skillIcon{max-height:2rem}}.pfp-wrapper{height:100%;display:grid;place-content:center}.pfp{height:250px;aspect-ratio:1/1;border-radius:2rem;background-color:#ffffff50;box-shadow:0 0 10px #0000000d,inset 0 0 10px #0003;padding:.5rem;backdrop-filter:blur(50px)}@media (max-width: 768px){.pfp{width:150px;height:150px;border-radius:2rem}}.pfp img{border-radius:1.5rem;width:100%;height:100%;object-fit:cover}.scroller{display:flex;gap:2rem}@media (max-width: 768px){.scroller{gap:1rem}}.words-wrapper{display:flex;flex-wrap:wrap;align-items:center;justify-content:start;gap:.35rem}.words-wrapper>span{font-size:14px;font-weight:400}@media (max-width: 768px){.words-wrapper>span{font-size:10px}}.words-wrapper>span .boldText{font-weight:600;opacity:1}.words-wrapper>span .normalText{font-weight:400;opacity:.7}.loader-wrapper{position:fixed;z-index:9999999;width:100%;height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#252525}.loader-hello{font-size:2.5rem;font-weight:400;color:#fff}.blobs{height:5rem;width:100%;display:flex;justify-content:center;align-items:center}.blobs .blob{height:1rem;aspect-ratio:1/1;border-radius:50%;background-color:#cfcfcf}.blobs .yellow{background-color:#edb74d}.blobs .red{background-color:#f57c7c}.blobs .blue{background-color:#919fd5}footer{border-top:1px solid rgba(37,37,37,.0588235294);width:100%;padding:48px 64px;background-color:#252525}@media (max-width: 768px){footer{padding:16px}}footer .footer-wrapper{display:flex;gap:1rem;align-items:center;justify-content:space-around}@media (max-width: 768px){footer .footer-wrapper{align-items:center;flex-direction:column;justify-content:center;gap:.5rem;text-align:center}}footer .footer-wrapper .text{font-size:12px;line-height:14px;color:#fff;letter-spacing:.05rem;font-weight:600}@media (max-width: 768px){footer .footer-wrapper .text{font-size:10px;line-height:12px}}footer .footer-wrapper .contact-details{display:flex;flex-direction:column;gap:0rem}@media (max-width: 768px){footer .footer-wrapper .contact-details{gap:.5rem}}footer .footer-wrapper .note{opacity:.8}@media (max-width: 768px){footer .footer-wrapper .note{font-size:12px;line-height:16px}}.contactForm-container{display:flex;flex-direction:column;gap:2rem;padding:64px 0}.contactForm-container .header{width:100vw;font-weight:500;font-size:22px;letter-spacing:-.2px;color:#000000de;display:flex;align-items:center;height:fit-content;position:relative;padding-left:64px;margin-bottom:2rem;gap:10px}@media (max-width: 768px){.contactForm-container .header{padding-left:32px}}.contactForm-container .header svg{width:20px;height:20px}.contactForm-container form,.contactForm-container label{display:flex}.contactForm-container form{padding:0 128px;gap:16px;width:100%;justify-content:center}@media (max-width: 768px){.contactForm-container form{flex-direction:column;padding:0 32px}}.contactForm-container form div{display:flex;flex-direction:column;gap:16px}.contactForm-container label{flex-direction:column;gap:8px}.contactForm-container label input,.contactForm-container label textarea{padding:.5rem 1rem;outline:none;border:none;border:2px solid #ccc;border-radius:.5rem;background-color:#e8e8e8;width:100%;min-width:15rem}.contactForm-container label textarea{min-height:8rem;max-width:20rem}@media (max-width: 768px){.contactForm-container label textarea{max-width:100%}}.contactForm-container .btn-wrapper{padding:0 128px;display:flex;justify-content:center;align-items:center}@media (max-width: 768px){.contactForm-container .btn-wrapper{flex-direction:column;padding:0 32px}}.contactForm-container .btn-wrapper button{min-width:15rem;padding:.5rem 1rem;outline:none;border:none;border:2px solid #ccc;border-radius:.5rem;color:#fff;background-color:#6242b9;max-width:25rem}.contactForm-container .btn-wrapper button:hover{background-color:#6242b9e6}
