.animate-in-top{opacity:0;transform:translate3d(0,-4rem,0);animation:animate-in .5s ease-out forwards;}.animate-in-down{opacity:0;transform:translate3d(0,4rem,0);animation:animate-in .5s ease-out forwards;}.animate-in-right{opacity:0;transform:translate3d(2rem,0,0);animation:animate-in .5s ease-out forwards;animation-delay:calc(.05s * sibling-index());}@keyframes animate-in{to{transform:translate3d(0,0,0);opacity:1}}.section-line-bottom{position:relative;}.section-line-bottom::after,.site-header::after{position:absolute;content:"";bottom:0;left:0;width:100%;height:.0625rem;background-color:var(--color-gray-light-extra);transform:scaleX(0);transform-origin:left;animation:loading-lines-h 1.5s ease-out forwards;}.container-lines{position:relative;}.container-lines::before{content:"";position:absolute;top:0;left:0;width:.0625rem;height:100%;background-color:var(--color-gray-light-extra);transform:scaleY(0);transform-origin:top;animation:loading-lines-v 1.5s ease-out forwards;}.container-lines::after{content:"";position:absolute;top:0;right:0;width:.0625rem;height:100%;background-color:var(--color-gray-light-extra);transform:scaleY(0);transform-origin:top;animation:loading-lines-v 1.5s ease-out forwards;}.section-line-left{position:relative;}.section-line-left::before{content:"";position:absolute;top:0;left:0;width:.0625rem;height:100%;background-color:var(--color-gray-light-extra);transform:scaleY(0);transform-origin:top;animation:loading-lines-v 1.5s ease-out forwards;}@keyframes loading-lines-v{to{transform:scaleY(1)}}@keyframes loading-lines-h{to{transform:scaleX(1)}}.navigation-wrapper{display:flex;justify-content:flex-start;align-items:center;gap:1rem;padding:1rem;}@media screen and (min-width:1024px){.header-menu{display:flex;align-items:center;justify-content:flex-start;gap:1rem}}@media screen and (max-width:1024px){.mobile-menu-wrapper{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-end;gap:1rem;position:fixed;top:0;left:0;width:100%;height:100%;transition:var(--transition-norm);transform-origin:top;background-color:var(--color-back-second);padding:8rem 2rem 2rem 2rem;z-index:-1;a.menu-link{font-size:1.5rem;font-weight:400}a.a::after{display:none}}.mobile-menu-wrapper[data-state="closed"]{transform:scaleY(0);opacity:0}.button-menu-toggle{position:relative;z-index:30;margin-left:auto;&>svg{transition:var(--transition-norm)}&[data-state="opened"]>svg{transform:rotate(-90deg)}}.navigation-wrapper{justify-content:flex-end}}.header-container{display:grid;grid-template-columns:1fr 2fr;gap:0;min-height:4rem;}.grid-container{display:grid;grid-template-columns:1fr 2fr;}a.menu-link{color:var(--color-text-second);font-size:1rem;}.header-logo{display:block;height:1.75rem;}.tag-status{position:relative;height:.5rem;aspect-ratio:1/1;border-radius:50%;}.tag-status::before{content:"";position:absolute;top:-.125rem;left:-.125rem;width:calc(100% + .25rem);border-radius:50%;aspect-ratio:1/1;}.tag-status.status-open{background-color:var(--color-main-light);box-shadow:0 0 .75rem .125rem var(--color-second-light);animation:blinking 2s linear infinite;&::before{border:.0625rem solid var(--color-main-light);animation:winking 2s linear infinite;will-change:auto}}@keyframes winking{0%{transform:scale(0);opacity:0}50%{transform:scale(1);opacity:1}100%{transform:scale(2);opacity:0}}@keyframes blinking{0%{box-shadow:0 0 1rem .25rem var(--color-second-light)}50%{box-shadow:0 0 .25rem .25rem var(--color-second-light)}100%{box-shadow:0 0 1rem .25rem var(--color-second-light)}}.skill-item{padding:.5rem 1rem;background-color:var(--color-main-light-extra);color:var(--color-main-dark);font-size:.875rem;line-height:1;border-radius:.25rem;border:.0625rem solid;}ul.experience-wrapper{padding-left:1rem;margin-left:1rem;display:grid;gap:1rem;list-style:none;&>li{position:relative;border:.0625rem solid var(--color-gray-light-extra);padding:1rem;border-radius:.5rem;background-color:var(--color-back-second);&::before{content:"";position:absolute;top:1.5rem;left:-1.75rem;width:.5rem;height:.5rem;border-radius:50%;background-color:var(--color-main-light);outline:.0625rem solid var(--color-main-light);outline-offset:.25rem}}a{text-decoration:none}}.projects-grid{display:grid;grid-template-columns:1fr 1fr 1fr;}img.project-item-image{transition:var(--transition-long);}h3.project-item-title{position:absolute;left:0;bottom:0;width:100%;transition:var(--transition-long);color:var(--color-white);z-index:1;padding:1rem;background-color:rgba(27,33,37,.66);transform:translateY(102%);opacity:0;}.project-item{overflow:hidden;&:hover>img.project-item-image{transition:var(--transition-short)}&:hover>h3.project-item-title{transition:var(--transition-short);transform:translateY(0);opacity:1}}.pagination-wrapper{display:flex;justify-content:center;align-items:center;gap:.5rem;margin-top:2rem;font-size:.875rem;a,span{display:inline-block;padding:.25rem .75rem;border-radius:.25rem;border:.0625rem solid;background-color:var(--color-back-second);color:var(--color-text-second);text-decoration:none;transition:var(--transition-norm)}a:hover{border:.0625rem solid;color:var(--color-text)}a.active{border:.0625rem solid;color:var(--color-text)}}.right-side,.left-side{transition:var(--transition-norm);}body.open-sides{.right-side{transform:translateX(100%)}.left-side{transform:translateX(-100%)}}.footer-padding-block{padding:4rem 1rem;}.footer-menu{display:flex;justify-content:flex-start;align-items:center;gap:1rem;}.page-section-top{padding:8rem 1rem 4rem 1rem;}.page-section{padding:4rem 1rem;}@media screen and (max-width:1024px){.grid-container{display:grid;grid-template-columns:1fr}.container-lines{padding:0 1rem}.container-lines::before{left:1rem}.container-lines::after{right:1rem}.section-line-bottom::after{left:-1rem;width:100vw}.footer-menu{justify-content:center}.footer-padding-block:last-of-type{padding:4rem 1rem 1rem 1rem}.footer-padding-block:first-of-type{padding:1rem 1rem 4rem 1rem}.footer-text-align{text-align:center}.page-section-top{padding:4rem 1rem}.page-section{padding:2rem 1rem}}@media screen and (max-width:768px){.projects-grid{grid-template-columns:1fr 1fr}}@media screen and (max-width:576px){.footer-menu{flex-direction:column}}@media screen and (max-width:320px){.projects-grid{grid-template-columns:1fr}}