@import"https://fonts.googleapis.com/css?family=Overlock:400,400i,700|Oleo+Script";:root{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;margin:0;padding:0;overflow-x:hidden;width:100vw;max-width:100vw}body{min-height:100vh;display:flex;flex-direction:column}#root,#app{flex:1 0 auto}footer{flex-shrink:0}.menu-container>.overlay,.menu-container.active>.overlay{position:absolute;right:0;height:calc(100vh - 120px);width:calc(100vw - 120px);background:#181d23}.menu-container.active>.overlay{animation:overlay-slide-in .3s forwards .3s}@keyframes overlay-slide-in{0%{width:calc(100vw - 120px)}to{width:0}}.menu-container>.overlay{animation:overlay-slide-out .3s forwards}@keyframes overlay-slide-out{0%{left:0;width:0}to{left:0;width:calc(100vw - 120px)}}.menu-container{position:fixed;inset:0;background:#181d23;border:60px solid #181d23;display:flex;justify-content:center;align-items:center;z-index:999;overflow:hidden;flex-direction:column}.menu-container:before,.menu-container:after{content:"";position:absolute;width:100%;min-height:100vh;z-index:-1}.menu-container.deactive{animation:fade-out .6s forwards}@keyframes fade-out{0%{opacity:1;z-index:999}50%{opacity:1;z-index:999}to{opacity:0;z-index:-1}}.menu-container.active{animation:fade-in .3s forwards}@keyframes fade-in{0%{opacity:0;z-index:-1}to{opacity:1;z-index:999}}.menu-container ul,.menu-container .social{margin-left:-80px;opacity:0;animation:slide-out .2s forwards}.menu-container ul{list-style-type:none!important;font-size:3rem}@keyframes slide-out{0%{opacity:1;margin-left:0}to{opacity:0;margin-left:-80px}}.menu-container.active ul,.menu-container.active .social{animation:slide-in .3s forwards .6s}@keyframes slide-in{0%{opacity:0;margin-left:-80px}to{opacity:1;margin-left:0}}.menu-container ul li{border-left:.2rem solid transparent;transition:border-left .2s}.menu-container ul li a{font-size:3rem;padding-left:.5rem}.menu-container ul li a:after{content:" »";font-size:2.5rem;color:transparent;transition:color .2s}.menu-container ul li a:hover:after{color:#009af3}.menu-container ul li a,.menu-container ul li a:visited{text-decoration:none!important;border-bottom:none!important}.social{padding:1rem 0 0 .5rem}.social a{font-size:1.5rem;padding:.2rem}.menu-container a,.menu-container a:visited{color:#fafafa}.menu-container a:hover,.menu-container a:active{color:#009af3}@media only screen and (max-width: 649px){.menu-container{border:none}.menu-container>.overlay,.menu-container.active>.overlay{height:100vh;width:100vw}.menu-container.active>.overlay{animation:overlay-slide-in .3s forwards .3s}@keyframes overlay-slide-in{0%{width:100vw}to{width:0}}.menu-container>.overlay{animation:overlay-slide-out .3s forwards}@keyframes overlay-slide-out{0%{left:0;width:0}to{left:0;width:100vw}}}#navbar{position:fixed;top:0;left:0;width:100%;z-index:9999;background:#181d23;padding:0;height:60px;display:flex;align-items:center;justify-content:center}.nav-wrapper{width:100%;max-width:1400px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding:0 2rem;height:60px;position:relative}.brand{font-size:2rem;color:#fafafa;font-family:Overlock,Arial,Helvetica,sans-serif;font-weight:700;letter-spacing:1px}.menu-button{position:absolute;top:50%;right:0;transform:translateY(-50%);height:32px;width:40px;background:none;border:none;outline:none;cursor:pointer;z-index:10000;display:flex;align-items:center;justify-content:center}.menu-button span,.menu-button span:before,.menu-button span:after{display:block;position:absolute;width:32px;height:4px;background:#fafafa;border-radius:2px;transition:.3s;content:""}.menu-button span{position:relative;background:#fafafa}.menu-button span:before{content:"";top:-10px}.menu-button span:after{content:"";top:10px}.menu-button.active>span{background:transparent}.menu-button.active>span:before{transform:rotate(-45deg);top:0}.menu-button.active>span:after{transform:rotate(45deg);top:0}#welcome-section{background:#181d23;background:linear-gradient(to bottom,#181d23,#181d2380 80%);background-attachment:fixed;background-size:cover;position:relative;min-height:100vh;margin:0;padding:0;z-index:1}#welcome-section:before{content:"";position:fixed;background-color:#181d23;background-attachment:fixed;width:100%;min-height:100vh;z-index:-1;opacity:0;animation:stars-move-in 1s .3s forwards}@keyframes stars-move-in{0%{background-position-y:-100px}to{opacity:1;background-position-y:0}}.forest{position:absolute;bottom:-300px;left:0;background-color:#181d23;background-size:cover;width:100%;height:80%;opacity:0;animation:forest-move-in 1s .5s forwards;border-bottom:300px solid #181d23}@keyframes forest-move-in{0%{background-position-y:150%}to{opacity:1;background-position-y:100%}}.silhouette{position:absolute;bottom:0;left:0;background-color:#181d23;background-position:bottom left;background-repeat:no-repeat;width:50%;height:50%;opacity:0;animation:silhouette-move-in 1s .8s forwards}@keyframes silhouette-move-in{0%{background-position-x:0}to{opacity:1;background-position-x:50%}}.moon{position:fixed;top:0;right:0;background-color:#181d23;background-position:right 150%;background-repeat:no-repeat;background-size:40% 40%;background-attachment:fixed;width:100%;height:100%;z-index:-1;opacity:0;animation:moon-move-in 1.2s 1s forwards}@keyframes moon-move-in{0%{opacity:0;background-position:right 150%}to{opacity:1;background-position:top right}}#welcome-section .container{width:fit-content;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);opacity:0;animation:text-fade-in-center 1s .8s forwards;text-align:center}@keyframes text-fade-in-center{0%{opacity:0;transform:translate(-50%,-60%)}to{opacity:1;transform:translate(-50%,-50%)}}#welcome-section .container h1{font-size:4rem;font-weight:400;font-style:italic;color:#fafafa;line-height:3rem;justify-content:center;align-items:center}#welcome-section .container h1 .line:first-child{margin-left:1rem}#welcome-section .container h1 .line:last-child{margin-left:2rem}#welcome-section .container .buttons{display:flex;margin-top:1rem}#welcome-section .container .buttons a,#welcome-section .container .buttons a:visited{text-decoration:none!important}#welcome-section .container .buttons a,#welcome-section .container .buttons a:visited{width:100%;padding:1rem;border:1px solid #fafafa;color:#fafafa;text-align:center;text-transform:uppercase;font-size:1rem}#welcome-section .container .buttons a:hover,#welcome-section .container .buttons a:active{border:1px solid #009af3;transform:translateY(-2px);box-shadow:0 10px 100px -20px #009af3}#welcome-section .container .buttons a.cta,#welcome-section .container .buttons a.cta:visited{background:#009af3;border:1px solid transparent;color:#fafafa;font-weight:700}#welcome-section .container .buttons a.cta:hover,#welcome-section .container .buttons a.cta:active{background:transparent;border:1px solid #009af3}#welcome-section .container .buttons a:first-child{margin-right:1rem}.line{display:block}.color{color:#009af3;font-style:italic}#about{min-height:100vh;font-size:1.4rem;position:relative;clip-path:polygon(0 0,20% 5%,100% 0,100% 100%,80% 95%,0 100%);z-index:5;background:#181d23!important;color:#fafafa;background-attachment:fixed;margin:0;padding:0}#about .wrapper{padding:4rem 10rem;height:100%;min-height:100vh;max-width:1400px;margin:0 auto}#about article{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:1rem;padding:3rem 0}#about .title{grid-column-end:span 4;display:flex;flex-direction:column;align-items:center}#about .title h3{font-size:2.4rem}#about .separator{background:#009af3;width:150px;height:2px;margin:1rem 0;padding:0}#about .subtitle{font-size:1.6rem;text-align:center;color:inherit;padding-bottom:1.5rem}#about p{padding-bottom:1.5rem;color:#fafafa;line-height:1.9rem}#about .desc.full{grid-column-end:span 4;margin-bottom:2rem}#about .desc{grid-column-end:span 2;background:#181d23!important;color:#fafafa;padding:2rem;text-align:justify}.about-photo{width:160px;height:160px;object-fit:cover;border-radius:50%;border:4px solid #009af3;box-shadow:0 4px 24px #0003;background:#fafafa}#projects{min-height:100vh;font-size:1.4rem;position:relative;background:#181d23!important;background:linear-gradient(215deg,#181d23,#fafafa);z-index:1;margin:0;padding:0}#projects a,#projects a:visited{color:#009af3}#projects a:hover,#projects a:active{color:#fff}#projects .projects-container{max-width:1400px;margin:0 auto;width:100%;padding:4rem 5rem}#projects .heading .title{text-align:center;font-size:2.4rem;line-height:2.4rem;color:#fafafa}#projects .heading .separator{background:#009af3;width:150px;height:2px;margin:1rem auto;padding:0;color:#f0f0f0}#projects .heading .subtitle{font-size:1.4rem;text-align:center;width:70%;margin:0 auto;text-align:justify;color:#f0f0f0}#projects .project{margin:1rem auto;width:70%;padding:2rem;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr;grid-gap:2rem}#projects .project .project-link{display:block;margin:auto 0;color:#fafafa;overflow:hidden;text-align:center;border-radius:50%;border:1px solid #fafafa;box-shadow:0 20px 10px -10px #25293450;transition:.3s}#projects .project .project-link:hover>img{filter:saturate(1);transform:scale(1.05)}#projects .project .project-image{width:100%;transform:scale(1.2);filter:saturate(0);transition:all .3s}#projects .project .project-details{margin:auto 0;color:#fafafa}#projects .project-details .project-tile{font-size:2rem;text-transform:uppercase;font-weight:700;margin-bottom:0;color:#009af3}#projects .project-details .icons{margin:0;color:#fff}#projects .project-details .icons i{margin-right:.4rem;font-weight:400;font-size:1.4rem}#projects .project-details small{font-style:italic}#projects .project-details p{margin:1rem 0}#projects .project-details .buttons{display:flex;justify-content:space-between}#projects .project-details .buttons a{width:49%;padding:.5rem;border:none;border-bottom:1px solid #009af3;background:transparent;color:#fff;text-decoration:none;font-weight:700;transition:.2s;display:inline-block;box-shadow:0 10px 100px -20px #009af3;font-size:1.2rem;text-align:center}#projects .project-details .buttons a:hover{background:#009af3;color:#fafafa}#projects .project-details .buttons i{font-size:.8rem;vertical-align:middle;margin-left:.5rem}#contact{background:#181d23 no-repeat right;clip-path:polygon(0 0,20% 100px,100% 0,100% 100%,0 100%);color:#fafafa;min-height:0;width:100%;padding:1.5rem;display:flex;justify-content:center;align-items:center;position:relative;z-index:1;margin:0}#contact .container{width:70%;max-width:1200px;padding:2rem 0}#contact .container .heading-wrapper{display:flex;justify-content:space-between}#contact .heading-wrapper .social a{color:#fafafa}#contact .heading-wrapper .social a:hover{color:#009af3}.heading-wrapper .heading .title{font-size:3rem;line-height:2.4rem}.heading-wrapper .heading .separator{background:#009af3;width:150px;height:2px;margin:1rem 0}.heading-wrapper .heading .subtitle{font-size:1.4rem}#contact-form{margin-top:1rem}input,textarea{border:none;padding:1rem;font-family:Overlock,Arial,Helvetica,sans-serif;width:100%;height:40%;transition:.2s}input[type=text],input[type=email],input[type=text]:not(output):not(:focus),input[type=email]:not(output):not(:focus),textarea{border-bottom:1px solid #fafafa;background:transparent;color:#fafafa;font-size:1.8rem;box-shadow:none;outline:none}input[type=text]:focus,input[type=email]:focus,input[type=text]:not(output):focus,input[type=email]:not(output):focus,textarea:focus{border-bottom:1px solid #009af3}input[type=submit]{background:#009af3;color:#fafafa;border:none;padding:1rem 2.5rem;font-size:1.2rem;font-weight:700;border-radius:30px;cursor:pointer;margin:1.5rem auto 0;transition:background .2s,color .2s,box-shadow .2s;box-shadow:0 2px 12px #00000014;letter-spacing:1px;width:40%;display:block}input[type=submit]:hover,input[type=submit]:focus{background:#007acc;color:#fff;box-shadow:0 4px 24px #009af326}::placeholder{color:#fafafa}.mail{display:inline-block;font-style:italic}.mail .at,.mail .dot{font-size:.9rem;margin:0 .1rem;color:#009af3}footer{background:#181d23;color:#fafafa;width:100%;text-align:center;flex-shrink:0;z-index:10000;position:relative}footer .wrapper{display:flex;width:100%;padding:1.5rem 2rem .5rem;max-width:1400px;align-items:center;justify-content:space-between}footer .social a,footer .social a:visited{color:#fafafa!important}footer .social a:hover,footer .social a:active{color:#009af3!important}@media only screen and (max-width: 1149px){#about article{grid-template-columns:1fr;grid-gap:0}#about .desc.full,#about .desc{grid-column-end:-1}#projects .project{grid-template-columns:1fr 2fr}#contact .social a{display:block}}@media only screen and (max-width: 949px){#about{clip-path:polygon(0 0,20% 2%,100% 0,100% 100%,80% 98%,0 100%);background-position:top left;background-size:cover}#projects .project{grid-template-columns:1fr}}@media only screen and (max-width: 849px){#navbar{background:#181d23}}@media only screen and (max-width: 649px){#welcome-section .container{left:50%;top:50%;width:80%;transform:translate(-50%,-50%);animation:text-fade-in-center-mobile 1s .8s forwards}@keyframes text-fade-in-center-mobile{0%{opacity:0;transform:translate(-50%,-60%)}to{opacity:1;transform:translate(-50%,-50%)}}#about .wrapper{padding:2rem}#projects{background:#f0f0f0}#projects .projects-container,#projects .project{padding:2rem 0}#contact{clip-path:polygon(0 0,20% 5%,100% 0,100% 100%,0 100%);padding:0}#contact .container{padding:2rem 0}}.tech-stack-title{font-size:2.5rem;font-weight:700;margin-bottom:1rem;text-align:center}.tech-stack{display:flex;gap:1.5rem;margin-top:2rem;flex-wrap:wrap;align-items:center;justify-content:center}.tech-stack img{width:96px;height:96px;border-radius:50%;background:#fff;padding:6px;box-shadow:0 2px 8px #00000014;object-fit:contain;transition:transform .2s;cursor:pointer}.tech-stack img:hover{transform:scale(1.1);box-shadow:0 4px 16px #009af326}