html{scroll-snap-type:y mandatory;scroll-behavior:smooth;overflow-y:scroll}*{padding:0;margin:0;box-sizing:border-box;font-family:DM Sans,sans-serif}body{background-color:#0c0c1d;color:#d3d3d3}a{text-decoration:none;color:inherit}section{height:100vh;width:100vw;scroll-snap-align:center;overflow:hidden}.contact{height:100%;max-width:1366px;padding:0 10%;margin:auto;display:flex;flex-direction:column;align-items:center;justify-content:center}.contact .textContainer h2{font-size:80px;margin-bottom:50px}.contact .formContainer{width:60%;position:relative;display:flex;align-items:center;justify-content:center}.contact .formContainer .phoneSvg{stroke:orange;position:absolute;margin:auto;z-index:-1}.contact .formContainer form{display:flex;flex-direction:column;gap:20px;width:100%}.contact .formContainer input,.contact .formContainer textarea{padding:20px;background-color:transparent;border:1px solid #fff;color:#fff;border-radius:5px;font-size:18px}@media (max-width: 900px){.contact .textContainer h2{font-size:7.5vw}.contact .formContainer{width:100%}}@media (max-width: 600px){.contact .formContainer .phoneSvg{width:100%}.contact .formContainer .phoneSvg svg{width:100%}}.btn{position:relative;display:block;max-width:400px;padding:10px 20px;color:#000;background-color:orange;font-size:24px;text-align:center;text-decoration:none;border:3px solid #ffa500;overflow:hidden;transition:color .15s ease-in-out .15s,border-color .3s ease-out,box-shadow .3s ease-in-out,transform .15s ease-in;z-index:1;margin:0 auto;cursor:pointer}.btn:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background-color:#02ac2c;z-index:-1;transform:scaleX(0);transition:transform .3s ease-out .2s}.btn:hover{color:#fff;border-color:#016018;box-shadow:0 0 16px #ffffff1a}.btn:hover:after{transform:scaleX(1);transform-origin:50% 50%;transition:transform .3s ease-out}.btn:active{transform:scale(.94)}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:999;border-radius:10px;width:80%;height:250px;background-color:#fff;padding:5% 10%}.modal .wrapper{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center;row-gap:15px}.modal .wrapper h3{font-size:24px;color:#0f8400}.modal .wrapper p{font-size:16px;color:#000}.modal .wrapper button{padding:10px 25px}.hero{height:calc(100vh - 100px);background:linear-gradient(180deg,#0c0c1d,#111142);overflow:hidden;position:relative}.hero .wrapper{max-width:1366px;height:100%;margin:0 auto;padding:0 10%}.hero .textContainer{height:100%;width:50%;display:flex;flex-direction:column;justify-content:center;gap:40px;position:relative;z-index:20}.hero .textContainer h2{font-size:30px;color:#639;text-transform:uppercase;letter-spacing:6px}.hero .textContainer h1{font-size:88px}.hero .textContainer .buttons{display:flex;gap:20px}.hero .textContainer .buttons a{position:relative;padding:20px;border:1px solid #fff;border-radius:10px;background-color:transparent;color:#fff;font-weight:300;cursor:pointer;z-index:20;overflow:hidden;transition:color .3s ease-in;z-index:5}.hero .textContainer .buttons .navBtn:before{content:"";width:200%;height:100%;background-color:#fff;position:absolute;top:0;left:0;transition:all .5 ease-in;z-index:-1;transform:translate(-200%);transition:transform .4s ease-in;will-change:transform}.hero .textContainer .buttons .navBtn:hover{color:#639}.hero .textContainer .buttons .navBtn:hover.navBtn:before{transform:translate(0);z-index:-10}.hero .textContainer img{width:50px}.hero .imageContainer{height:100%;position:absolute;top:0;right:0;border-radius:50%;z-index:1}.hero .imageContainer img{clip-path:polygon(20% 0%,80% 0%,100% 0,100% 92%,68% 92%,20% 100%,0 100%,0 0);height:100%}.hero .slidingTextContainer{position:absolute;font-size:40vh;bottom:-30px;white-space:nowrap;color:#ffffff09;font-weight:700;width:50%}.hero .nextButton{z-index:30}@media (max-width: 900px){.hero .textContainer{width:100%;height:100%;align-items:center;justify-content:space-around;text-align:center;position:absolute;top:0;left:0}.hero .textContainer h2{font-size:5vw;font-weight:800;position:relative;top:-50px}.hero .textContainer h1{font-size:15vw}.hero .textContainer .buttons{width:100%;display:flex;align-items:center;justify-content:center;font-size:3vw}.hero .imageContainer{top:0%;right:5.5vw}.hero .imageContainer img{width:80vw;height:auto;opacity:.7}}@media (max-width: 600px){.hero{display:flex;flex-direction:column;align-items:center;width:100%}.hero .textContainer{justify-content:space-around}.hero .textContainer h2{top:5px}.hero .textContainer h1{font-size:15vw}.hero .imageContainer{position:relative;width:100%;display:flex;align-items:center;justify-content:center;right:0}.hero .imageContainer img{width:100%;object-fit:contain}}.navbar{height:100px}.navbar .wrapper{max-width:1366px;padding:0 10%;margin:auto;display:flex;align-items:center;justify-content:space-between;height:100%}.navbar span{font-weight:700}.navbar .social{display:flex;gap:20px}.navbar .social img{width:25px;height:25px}@media (max-width: 900px){.navbar .wrapper{padding:0 10%}}@media (max-width: 400px){.navbar .wrapper{padding:0 10% 0 30%}}.sidebar{display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#fff;color:#000;position:relative;z-index:100}.sidebar .bg{position:fixed;top:0;left:0;bottom:0;width:400px;background:white}.sidebar .bg .links{position:absolute;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.sidebar .bg .links a{font-size:40px}.sidebar button{width:50px;height:50px;border-radius:50%;position:fixed;top:30px;left:25px;background-color:transparent;border:none;cursor:pointer}.parallax{height:100%;width:100%;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.parallax h2{font-size:100px}.parallax .mountains{background-image:url(/mountains.png);background-size:cover;background-position:bottom;width:100%;height:100%;position:absolute;z-index:3}.parallax .planets{background-image:url(/planets.png);background-size:cover;background-position:bottom;width:100%;height:100%;position:absolute;z-index:2}.parallax .stars{background-image:url(/stars.png);background-size:cover;background-position:bottom;background-repeat:repeat-x;width:100%;height:100%;position:absolute;z-index:1}@media (max-width: 900px){.parallax h2{font-size:20vw;z-index:30}.parallax .planets{background-position:30% 50%}}.portfolio{position:relative}.portfolio .anchor{width:100px;height:100px;position:absolute;top:100px;left:1px;background-color:#fff;z-index:1000}.portfolio .progress{position:sticky;top:0;left:0;padding-top:30px;text-align:center;color:orange;font-size:36px}.portfolio .progressBar{height:10px;background-color:#fff}.portfolioItem .container{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.portfolioItem .container .wrapper{max-width:1366px;height:100%;margin:0 auto;padding:120px 10% 0;display:flex;flex-direction:column;gap:25px;align-items:center;justify-content:center}.portfolioItem .container .wrapper .imageContainer{height:40%;width:80%}.portfolioItem .container .wrapper .imageContainer img{width:100%;height:100%;object-fit:cover}.portfolioItem .container .wrapper .textContainer{display:flex;flex-direction:column;gap:30px;height:60%}.portfolioItem .container .wrapper .textContainer h3{font-size:36px}.portfolioItem .container .wrapper .textContainer p{color:gray;font-size:18px}.portfolioItem .container .wrapper .textContainer .technologies{display:flex;align-items:baseline;gap:10px}.portfolioItem .container .wrapper .textContainer .technologies .technologiesTitle{color:orange;font-size:20px}.portfolioItem .container .wrapper .textContainer .technologies .technologiesList{display:flex;align-items:flex-start;justify-content:start;gap:10px;flex-wrap:wrap}.portfolioItem .container .wrapper .textContainer .technologies .technologiesList .technology{font-size:17px;color:gray}.portfolioItem .container .wrapper .textContainer .links{width:150px;display:flex;align-items:center;justify-content:space-between}.portfolioItem .container .wrapper .textContainer .links .linkTitle{color:orange;font-size:20px}.portfolioItem .container .wrapper .textContainer .links .link{transition:transform .3s ease-in}.portfolioItem .container .wrapper .textContainer .links .link img{width:35px}.portfolioItem .container .wrapper .textContainer .links .link:hover{transform:scale(1.2)}@media (max-width: 900px){.portfolioItem .container .wrapper{gap:10px;padding:90px 10% 0}.portfolioItem .container .wrapper .imageContainer{height:25%;width:100%}.portfolioItem .container .wrapper .textContainer{gap:15px}.portfolioItem .container .wrapper .textContainer h3{font-size:28px}}@media (max-width: 600px){.portfolioItem{height:97vh;padding-top:130px}.portfolioItem .container .wrapper{gap:10px;padding:25px 10% 0;justify-content:start}.portfolioItem .container .wrapper .textContainer{gap:10px}.portfolioItem .container .wrapper .textContainer h3{font-size:4.5vw}.portfolioItem .container .wrapper .textContainer p{font-size:3vw}.portfolioItem .container .wrapper .textContainer .technologies{display:flex;flex-direction:column;align-items:baseline;gap:10px}.portfolioItem .container .wrapper .textContainer .technologies .technologiesTitle{font-size:3.1vw}.portfolioItem .container .wrapper .textContainer .technologies .technologiesList{display:flex;align-items:flex-start;justify-content:start;row-gap:5px;column-gap:10px}.portfolioItem .container .wrapper .textContainer .technologies .technologiesList .technology{font-size:2.6vw}.portfolioItem .container .wrapper .textContainer .links{width:120px}.portfolioItem .container .wrapper .textContainer .links .linkTitle{font-size:2.6vw}}.slider{width:100%;display:flex;align-items:center;justify-content:center;margin-bottom:20px}.slider .wrapper{width:100%;display:flex;align-items:center;justify-content:center;gap:20px}.slider .wrapper .arrow{fill:#fff;display:flex;align-items:center;cursor:pointer;padding:10px 20px;position:relative;z-index:99}.slider .wrapper .sliderContent{width:640px;height:40px}.slider .wrapper .sliderContent .sliderItem{display:block;width:200px;cursor:pointer;color:#fff}.slider .wrapper .sliderContent .sliderItem.active{color:orange}@media (max-width: 950px){.slider .wrapper .sliderContent{width:50%}}@media (max-width: 600px){.slider .wrapper{gap:5px}.slider .wrapper .sliderContent{width:40%}.slider .wrapper .sliderContent .sliderItem{width:200px}.slider .wrapper .sliderContent .sliderItem{font-size:7.7vw;transform:scale(.7)}}@media (max-width: 450px){.slider .wrapper{padding-left:10vw}.slider .wrapper .sliderContent{width:40%}.slider .wrapper .sliderContent .sliderItem{font-size:8vw}}@media (max-width: 340px){.slider .wrapper{padding-left:20vw}}.skills{background:linear-gradient(180deg,#0c0c1d,#111132);height:100%;display:flex;flex-direction:column;padding:50px 13%}.skills .title{display:flex;align-items:center;justify-content:space-around;margin-bottom:25px}.skills .title .tabName{font-size:3.5vw;font-weight:100;cursor:pointer;position:relative}.skills .title .tabName:after{content:"";width:0%;height:2px;background:orange;position:absolute;bottom:0;left:0;z-index:20;transition:width .5s ease-in}.skills .title .tabName.active{color:orange}.skills .title .tabName.active b{color:#fff}.skills .title .tabName.active.tabName:after{width:100%}@media (max-width: 900px){.skills .title{flex-wrap:wrap;gap:20px}.skills .title .tabName{font-size:4.5vw}}@media (max-width: 600px){.skills .title{flex-direction:column;gap:20px;margin-bottom:5vh}}.skillTab{width:100%;max-width:1366px;margin:0 auto}.skillTab .wrapper{height:100%;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:20px;padding:20px;align-content:center;justify-items:center;margin:0 auto}.skill{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .5s ease-in}.skill .imageContainer{width:100%;height:75%;text-align:center;margin-bottom:15px;padding:5px}.skill .imageContainer img{height:100%;max-width:100%;object-fit:contain}.skill h4{font-size:20px;text-align:center}@media (max-width: 900px){.skillTab .wrapper{grid-template-columns:repeat(auto-fill,minmax(90px,1fr))}}@media (max-width: 620px){.skillTab .wrapper{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:10px}.skill .imageContainer{width:80%;padding:0;margin-bottom:10px}.skill h4{font-size:16px}}@media (max-width: 410px){.skillTab .wrapper{grid-template-columns:repeat(auto-fill,minmax(60px,1fr))}.skill h4{font-size:12px}}
