@import"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap";*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%}:root{--font-family: "Roboto", sans-serif;--color-bg: #F5F5F5}body{font-family:var(--font-family);background-color:var(--color-bg)}img{width:100%}.container{position:relative;max-width:90vw;margin:auto}.portfolio-logo{font-size:1.5rem;line-height:1;font-weight:800;text-align:center;padding:1.2rem;margin-bottom:.5rem}.navbar{max-width:fit-content;margin:auto;background-color:#000;border-radius:4rem}.navbar ul{display:flex;align-items:center;justify-content:space-between;padding:.4rem}.navbar ul li{list-style-type:none}.navbar ul li a{display:block;text-decoration:none;color:#fff;padding:.6rem 2rem;text-align:center}.navbar ul .active{background-color:#fff;color:#000;border-radius:4rem}.mobile-menu{display:none;font-size:1.5rem;color:#000}@media screen and (max-width: 600px){.mobile-menu{display:block;padding-right:1.2rem}header{display:flex;align-items:center;justify-content:space-between}.navbar{display:none;position:fixed;width:320px;max-width:100%;height:100%;right:0;top:0;border-radius:0;z-index:1000}.nav-items{flex-direction:column;align-items:flex-end}.nav-items li{width:100%}.nav-items li a{text-align:right!important}.nav-items li a.active{border-radius:0}}.portfolio-footer{position:relative;background-color:#000;padding:4rem 0 2rem}.quick-link h3{text-align:center;color:#fff;font-size:1rem;letter-spacing:.01rem}.quick-link ul{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4rem;padding:2rem}.quick-link ul li{list-style-type:none}.quick-link ul li a{text-decoration:none;font-size:.9rem;color:#fff}.social{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:2rem;margin-bottom:2rem}.social a{color:#fff;font-size:.8rem}.copyright{text-align:center;color:#fff;font-size:.6rem;letter-spacing:.1rem}.banner{margin-top:3rem;padding:3rem 2rem}.banner h1{font-size:10rem;text-align:center}.banner-text{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:3rem;gap:2rem}.lets-talk a{font-size:.9rem;line-height:1;font-weight:300;color:#000}.scroll-down{display:flex;flex-direction:column;align-items:center;position:absolute;left:50%;transform:translate(-50%)}.scroll-down span{font-size:1rem;font-weight:500}.scroll-down .down-arrow{font-size:3rem}.info{position:relative;border:.02rem solid #000000;padding:1rem;max-width:310px}.info .info-title{position:absolute;width:fit-content;top:-20px;font-size:1rem;font-weight:500;background-color:#f5f5f5;padding:.5rem}.info p{font-size:1rem;line-height:1.5}.our-work{overflow-x:hidden;margin-top:3rem;border-top:1px solid #cccccc}.our-work .container{display:flex;justify-content:space-between;gap:3rem;padding-top:5rem;flex-wrap:wrap}.our-work .container .text{max-width:320px}.our-work .container .text .heading{font-size:2rem;margin-bottom:.6rem}.our-work .container .text p{font-size:1rem;line-height:1.4rem}.our-work .container .more-link{display:flex;align-items:center;justify-content:flex-end;gap:.4rem}.our-work .container .more-link a{font-size:1rem;font-weight:600;color:#000;text-decoration:none}.our-work .container .more-link .right-arrow{font-size:2rem}.our-work .project-list{display:flex;flex-shrink:0;gap:1.5rem}.tech-skills{margin-top:5rem;padding:5rem 0;border-top:1px solid #cccccc}.tech-skills .text{max-width:60vw;margin:auto;text-align:center}.tech-skills .text .heading{font-size:2rem;margin-bottom:.6rem}.tech-skills .text p{font-size:1rem;line-height:1.4rem}.our-work .project-list .project{width:3vw}@media screen and (max-width: 600px){.scroll-down{display:none}.banner h1{font-size:3rem}.banner{margin-top:0;padding-top:0}}.project{position:relative;width:12vw;flex:1 0 100%}.project .project-img{background-color:#000;padding:2rem;border-radius:1rem;margin-bottom:1rem}.project .project-img img{width:100%;height:22vw;object-fit:cover;object-position:top}.project .project-category span{font-size:.8rem}.project:nth-child(2) .project-img{background-color:#b7ed3f}.project:nth-child(3) .project-img{background-color:#8ed1fc}.project-detail{position:absolute;right:1rem;bottom:0;display:flex;align-items:center;gap:.3rem;opacity:0}.project-detail a{text-decoration:none;color:#000;font-size:1rem;font-weight:600}.project:hover .project-detail{opacity:1}.tech-skill-list{max-width:70vw;margin:auto;margin-top:3rem;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.8rem}.tech-skill-list .tech-skill{background-color:#000;border-radius:4rem;padding:.6rem 2rem;color:#fff;cursor:pointer}.tech-skill-list .tech-skill:hover{background-color:#ccc;color:#000}.projects{max-width:90vw;margin:auto;padding:4rem 1rem}.projects h1{font-size:4rem;padding-bottom:1rem;margin-bottom:1rem}.project-grid{gap:2rem;display:grid;grid-template-columns:repeat(2,1fr);justify-content:center}.project-grid .project{width:100%}.project-details{max-width:90vw;margin:auto;padding:4rem 1rem}.project-details .project-title{font-size:4rem;line-height:1;text-align:center}.project-details .project-category{display:block;padding:1.2rem;font-size:1rem;text-align:center}.project-details .project-screenshot{background-color:#000;padding:2rem;border-radius:1rem;margin-bottom:1rem}.project-details .project-screenshot img{width:100%;height:40vw;object-fit:cover;object-position:top}.project-details h4{font-size:1rem;font-weight:500;margin-bottom:.1rem;padding-bottom:.1rem}.client-duration-platform{display:flex;justify-content:space-between;padding-top:2rem;padding-bottom:2rem;margin-bottom:2rem;border-bottom:.01rem solid #CCCCCC}.project-desc{padding:0 0 2rem;margin-bottom:2rem;border-bottom:.1px solid #CCCCCC}.tech-stack,.role,.team-size{padding-bottom:2rem;margin-bottom:2rem;border-bottom:.01rem solid #CCCCCC}.tech-stack ul{display:flex;gap:.3rem;padding-top:.6rem}.tech-stack ul li{list-style-type:none;background-color:#000;border-radius:1rem;text-align:center;color:#fff;padding:.5rem 1.5rem;font-size:.8rem;width:fit-content}.project-live-link{display:flex;align-items:center;gap:.3rem;justify-content:flex-end}.project-live-link a{color:#048704}.next-project{display:flex;align-items:center;gap:.8rem}.next-project img{width:10vw;height:5vw;object-fit:cover;object-position:top}.next-project a{text-decoration:none;font-size:.9rem;font-weight:600;color:#043df3}.next-project a:hover{color:#000}