header{padding-top:3.9rem}.logo{font-family:Space Grotesk Bold;font-size:3.2rem;text-transform:lowercase}.header-inner{display:flex;justify-content:space-between;align-items:center}.social{display:flex;justify-content:space-between;align-items:center;gap:3.2rem;padding-right:3.2rem}.social svg{fill:var(--color-white-400);transition:all .15s}.social svg:hover{fill:var(--color-primary-400)}@media (max-width: 1174px){header{padding-top:3.2rem}}main{padding-top:12.7rem}#hero{position:relative}#hero h1{max-width:70.6rem;margin-bottom:4.3rem}#hero p{max-width:44.5rem;margin-bottom:6.6rem}#hero .btn{margin-bottom:21.9rem}#hero .portrait{position:absolute;top:-19.9rem;right:0;z-index:-1}#hero .circle{position:absolute;top:32.3rem;right:44.5rem;transform:translate(50%);z-index:-1}#hero .rings{position:absolute;top:0;left:0;transform:translate(-50%,-50%);z-index:-1}#hero .name{position:relative}#hero .name:after{content:"";position:absolute;left:0;right:0;display:block;background-color:var(--color-primary-400);height:6px}#skills{display:grid;grid-template-columns:repeat(3,1fr);grid-column-gap:3rem;grid-row-gap:5.8rem;padding:7.2rem 0}.skill h2{margin-bottom:1.4rem}#projects{margin-bottom:6.7rem;padding:7.2rem 0}.projects-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8rem}.projects-list{display:grid;grid-template-columns:repeat(2,1fr);grid-column-gap:3rem;grid-row-gap:6.9rem}.thumbnail-container{position:relative;margin-bottom:2rem;overflow:hidden}.thumbnail-container .overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#000;opacity:0;transition:opacity .2s;z-index:-1}.thumbnail-container:hover .overlay{opacity:.75;z-index:1}.thumbnail-container .middle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:4.8rem}.thumbnail-container:hover .middle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;gap:4.8rem;z-index:2}.thumbnail-container .btn-from-left{transform:translate(calc(-21rem - 100%))}.thumbnail-container .btn-from-right{transform:translate(calc(21rem + 100%))}.thumbnail-container:hover .btn-from-left{animation:fromLeft .3s forwards .1s}.thumbnail-container:hover .btn-from-right{animation:fromRight .3s forwards .2s}@keyframes fromLeft{60%{transform:translate(4rem)}to{transform:translate(0)}}@keyframes fromRight{60%{transform:translate(-4rem)}to{transform:translate(0)}}.project h3{margin-bottom:1.2rem}.tech-list{list-style:none;display:flex;align-items:center;gap:1.8rem;font-size:1.8rem;line-height:normal;color:var(--color-white-500)}.tech-icon>svg{font-size:3.2rem;color:var(--color-white-500);cursor:pointer;transition:all .15s}.tech-icon:hover>svg{transform:scale(1.3)}.tech-icon.html:hover>svg{color:var(--color-html)}.tech-icon.css:hover>svg{color:var(--color-css)}.tech-icon.js:hover>svg{color:var(--color-js)}.tech-icon.svelte:hover>svg{color:var(--color-svelte)}.tech-icon.vue:hover>svg{color:var(--color-vue)}@media (max-width: 1174px){main{padding-top:9rem}#hero h1{max-width:44.5rem;margin-bottom:6rem}#hero .btn{margin-bottom:9.8rem}#hero p{max-width:44.5rem;margin-bottom:3.4rem}#hero .portrait{top:-15.4rem;right:-3.2rem}#hero .circle{top:unset;bottom:9.8rem;right:0;transform:translate(calc(50% + 3.2rem))}}@media (max-width: 991px){#skills{grid-template-columns:repeat(2,1fr);grid-column-gap:.7rem;grid-row-gap:5.2rem;padding:5.2rem 0}#projects{padding:5rem 0}.projects-header{margin-bottom:6rem}.projects-list{grid-column-gap:2.4rem;grid-row-gap:6rem}}@media (max-width: 767px){#skills{grid-template-columns:1fr;grid-row-gap:2.4rem;padding:4rem 0;border-bottom:2px solid var(--color-white-400)}.skill{text-align:center}.skill h2{margin-bottom:1px}#projects{padding:8rem 0}.projects-header{margin-bottom:4rem}.projects-list{grid-template-columns:1fr;grid-row-gap:4rem}}footer{background-color:var(--color-black-300);padding:8.4rem 0}.footer-inner{display:flex;justify-content:space-between;margin-bottom:9.2rem}.footer-left{max-width:44.5rem}.footer-left h1{max-width:44.5rem;margin-bottom:3.6rem}.footer-right{max-width:44.5rem}.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:4.8rem}.btn-submit{display:block;margin-left:auto}