@import"https://fonts.googleapis.com/css2?family=Fira+Sans:wght@500;800;900&display=swap";:root{--primary-clr: hsl(0, 0%, 0%);--secondary-clr: hsl(0, 0%, 11%);--other-clr: hsl(0, 0%, 61%);--tag-clr: hsl(0, 0%, 55%);--accent-clr: hsl(50, 87%, 50%);--accent-other-clr: hsl(50, 87%, 50%);--main-clr: hsl(0, 0%, 95%);--section-mt: 8rem;--transition: cubic-bezier(.25, .32, .85, .58);--transition-clr: color .3s var(--transition);font-size:10px;scrollbar-width:thin;scrollbar-color:var(--other-clr) hsl(0,0%,73%);scrollbar-gutter:stable}:root.dev-light{--primary-clr: #ffffff;--secondary-clr: #f4f4f6;--other-clr: hsl(0, 0%, 35%);--tag-clr: hsl(0, 0%, 80%);--main-clr: #111111}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background-color:#e3e3e3}::-webkit-scrollbar-thumb{background-color:var(--other-clr)}::selection{background:var(--accent-clr);color:var(--primary-clr)}*:focus:not(:focus-visible){outline:none}:focus-visible{outline:2px dotted var(--accent-clr);outline-offset:3px}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}@media screen and (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}body{font-family:-apple-system,BlinkMacSystemFont,Fira Sans,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:clamp(1.4rem,1vw,1.6rem);line-height:1.6;background:var(--primary-clr);color:var(--main-clr);min-height:100vh;text-rendering:optimizeSpeed}a{text-decoration:none;color:currentColor}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit;all:unset}ul li{list-style:none}h1,h2,h3{line-height:1.2;font-weight:900}.bounce-in-left{animation:bounce-in-left 1.1s both .3s}.slide-in-top{animation:slide-in-top .5s cubic-bezier(.175,.885,.32,1.275) both}.fade-in{animation:fade-in 1.2s cubic-bezier(.39,.575,.565,1) .5s both}@keyframes bounce-in-left{0%{transform:translate(-600px);animation-timing-function:ease-in;opacity:0}38%{transform:translate(0);animation-timing-function:ease-out;opacity:1}55%{transform:translate(-68px);animation-timing-function:ease-in}72%{transform:translate(0);animation-timing-function:ease-out}81%{transform:translate(-28px);animation-timing-function:ease-in}90%{transform:translate(0);animation-timing-function:ease-out}95%{transform:translate(-8px);animation-timing-function:ease-in}to{transform:translate(0);animation-timing-function:ease-out}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-in-top{0%{transform:translateY(-1000px);opacity:0}to{transform:translateY(0);opacity:1}}.container{max-width:1200px;margin-inline:auto;padding:0 1rem}.subtitle{text-transform:uppercase;letter-spacing:2px;font-size:clamp(1.2rem,1vw,1.35rem);color:var(--accent-clr)}.title{font-size:clamp(3.2rem,3vw,6rem)}.info{max-width:500px;font-size:1.35rem;padding-block-start:1.3rem;color:var(--other-clr)}.btn{padding:.8rem 3rem;margin-block-start:2rem;color:var(--main-clr);border-radius:.2rem;cursor:pointer}.btn:active{transform:scale(.98)}.hover-effect:after{position:absolute;content:"";left:0;bottom:-2px;width:100%;height:1.5px;background:var(--accent-clr);transform:scaleX(0);transform-origin:left;transition:all .3s ease-in-out}.hover-effect:hover:after{transform-origin:right;transform:scaleX(1)}small{color:var(--other-clr)}.skip-to-content{position:absolute;background:var(--accent-clr);color:var(--secondary-clr);padding:.75rem 1rem;left:1.5rem;top:0;border-radius:0 0 .5rem .5rem;font-size:1.4rem;transform:translateY(-200%);transition:all .35s ease-in}.skip-to-content:focus{transform:translateY(0)}.nav{width:100%;padding:0;background:var(--secondary-clr);position:sticky;top:0;z-index:100}.nav .container{display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;margin:0 auto;max-width:1200px;border-radius:0;font-size:1.4rem}.nav-list li a{font-weight:700}.nav-logo h3{font-weight:800}.logo{width:40px;height:40px;border-radius:50%}.hamburger{display:none}.hamburger{position:relative;z-index:1100}.nav-list{display:flex;align-items:center;gap:5rem}.nav-links{position:relative;transition:var(--transition-clr);display:inline-flex;align-items:center;gap:.9rem;line-height:1}.nav-links svg{width:20px;height:20px;flex-shrink:0;display:block}.nav-links:hover{color:var(--accent-clr)}.control-nav{display:flex;align-items:center;gap:1.2rem}.nav-list .menu-controls{display:none}.social-nav{display:flex;align-items:center;gap:2.5rem}.social-nav a{line-height:0;width:28px;height:28px;border-radius:50%;background:transparent;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.25,.32,.85,.58)}.social-nav a:hover{background:var(--accent-other-clr);color:var(--secondary-clr)}.hero{padding:0 1rem}.hero .container{margin-block-start:var(--section-mt);display:grid;place-items:center;gap:5rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.hero-intro{display:flex;flex-direction:column;justify-content:center}.name{font-size:clamp(4rem,5vw,6rem)}.intro{margin-top:15px;color:var(--other-clr)}.hero .img-wrapper{max-width:375px}.hero .img-wrapper img{aspect-ratio:auto}.hero .code{filter:drop-shadow(0 0 .75rem var(--secondary-clr))}.hero-btn-container{margin-block-start:5rem;display:flex}.hire-btn{text-transform:uppercase;letter-spacing:1px;display:inline-block;border:1px solid var(--accent-clr);color:var(--accent-clr);transition:all .3s cubic-bezier(.25,.32,.85,.58);z-index:1;position:relative;font-size:inherit;overflow:hidden}.hire-btn:before{content:"";z-index:-1;position:absolute;top:100%;right:100%;width:2rem;height:1em;border-radius:50%;background-color:var(--accent-clr);transform-origin:center;transform:translate3d(50%,-50%,0) scale3d(0,0,0);transition:transform .45s ease-in-out}.hire-btn:hover{cursor:pointer;color:#171717;border:0}.hire-btn:hover:before{transform:translate3d(50%,-50%,0) scale3d(15,15,15)}.download-link{color:var(--other-clr);transition:color .45s ease-in-out}.download-link:hover{color:#fff}.download-link:focus{outline:none}.about-me{margin-block-start:var(--section-mt);background:var(--secondary-clr);padding:var(--section-mt) 1rem}.about-me .container{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));place-items:center;gap:8rem;position:relative}.about-me img{align-self:end;justify-self:end;width:425px;box-shadow:0 0 2.2px #00000002,0 0 5.3px #00000002,0 0 10px #00000003,0 0 17.9px #00000003,0 0 33.4px #00000004,0 0 80px #00000005}.about{padding-block-start:1.25rem}.about p{padding-block-start:2rem;line-height:1.8}.my-skills{margin-block-start:var(--section-mt);padding:4rem 1rem}.my-skills ul{padding-block-start:5rem;display:grid;grid-template-columns:repeat(4,1fr);gap:3.2rem 1rem}.icon-list{list-style:none;padding:0;display:flex;flex-direction:column}.icon-list li{display:flex;align-items:center;margin-bottom:10px}.icon-list li img{margin-right:10px}.icon-list li span{white-space:nowrap}.projects-section{margin-block-start:var(--section-mt);padding:4rem 1rem}.projects{padding-block-start:5rem;display:flex;flex-direction:column;gap:12rem}.project{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:"img text";place-items:center;gap:5rem}.project a{width:100%;grid-area:img}.project a img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:8px}.project div{grid-area:text}.img-wrapper{position:relative;width:100%}.img-wrapper img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:8px;display:block}.img-wrapper.portrait img{aspect-ratio:auto;object-fit:contain;height:auto}.about-me .img-wrapper{max-width:425px}.img-wrapper.portrait .skeleton{aspect-ratio:4/5}.skeleton{width:100%;aspect-ratio:16/10;border-radius:8px;background:linear-gradient(90deg,#222 25%,#333 37%,#222 63%);background-size:400% 100%;animation:shimmer 1.2s infinite}@keyframes shimmer{0%{background-position:100% 0}to{background-position:-100% 0}}.project-img{pointer-events:none;transition:opactiy .3s ease-in-out;position:relative;display:inline-block;height:100%}.project-img:hover{opacity:.9}.project.reverse{grid-template-areas:"text img"}.project h3{font-size:clamp(2rem,3vw,4rem);font-weight:500;letter-spacing:5px;color:var(--other-clr)}.project h2{padding-block-start:clamp(1.5rem,2vw,3rem);font-size:clamp(2.5rem,3vw,4rem)}.project p{padding-block-start:1.5rem;max-width:500px}.tech-stack,.project-links{display:flex;flex-wrap:wrap;align-items:center;gap:2rem;padding-block-start:2rem}.project-links{column-gap:5rem;padding-block-start:3.2rem}.tech-stack li{padding:.2rem .5rem;background:var(--tag-clr);border-radius:2px;color:var(--primary-clr);font-size:clamp(1.15rem,1vw,1.3rem)}.tech-stack li:hover{color:var(--accent-clr)}.project-links a{display:flex;align-items:center;gap:.5rem;position:relative;transition:var(--transition-clr)}.project-links a:hover{color:var(--accent-clr)}.other-noteworthy-project{margin-block-start:15rem}.other-noteworthy-project h3{text-align:center;font-size:3rem}.other-projects{padding-block-start:calc(var(--section-mt) / 2);display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:4rem;max-width:1000px;margin:0 auto}.other-projects a{height:100%;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;background:var(--secondary-clr);border-radius:.3rem;overflow:hidden;font-size:1.45rem;box-shadow:0 0 2.2px #00000003,0 0 5.3px #00000004,0 0 10px #00000005,0 0 17.9px #00000006,0 0 33.4px #00000007,0 0 80px #0000000a;transition:background .3s ease-in-out}.other-projects a:hover{background:transparent;box-shadow:0 0 1px var(--other-clr)}.other-projects a img{height:300px}.other-projects div{padding:2rem;display:flex;flex-direction:column;justify-content:space-between;gap:1rem}.other-projects h4{font-size:clamp(1.5rem,2vw,2rem)}.other-projects ul{display:flex;align-items:center;gap:1rem;color:var(--accent-clr);font-size:clamp(1.15rem,1vw,1.3rem)}.other-projects p{font-size:clamp(1.15rem,1vw,1.3rem)}.contact{margin-block-start:var(--section-mt);padding:4rem 1rem}.mail-link{display:flex;margin-block-start:var(--section-mt);width:max-content;transition:var(--transition-clr);position:relative;text-transform:uppercase;letter-spacing:1px}.mail-link:hover{color:var(--accent-clr);text-decoration:none}.footer{margin-block-start:var(--section-mt);background:var(--secondary-clr);padding:0 1rem}.footer .container{margin-block-start:var(--section-mt);font-size:1.35rem;padding:2rem 1rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between}.footer em{color:var(--other-clr)}.footer div{display:flex;align-items:center;gap:5rem}.footer ul{display:flex;align-items:center;gap:2rem}.footer a{letter-spacing:1px;transition:var(--transition-clr);position:relative}.footer a:hover{color:var(--accent-clr)}.top{display:flex;align-items:center;justify-content:center;line-height:0;font-size:1.15rem}.scroll{display:flex;flex-direction:column;gap:1.2rem;align-items:flex-end}.back-to-top{position:fixed;right:1.6rem;bottom:2rem;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--secondary-clr);color:var(--main-clr);box-shadow:0 10px 25px #00000059;opacity:0;transform:translateY(20px);transition:opacity .25s ease,transform .25s ease,background .3s ease-in-out;z-index:950}.back-to-top:hover{background:var(--accent-other-clr);color:var(--secondary-clr)}.back-to-top.show{opacity:.85;transform:translateY(0)}.back-to-top:hover{opacity:1}@media screen and (max-width:50em){:root{--section-mt: 5rem;--nav-mobile-height: 64px}body:after{content:none}body.open:after{content:none}body.open{overflow:hidden}.skip-to-content{display:none}.nav{position:relative;z-index:1}.nav-list,.social-nav{transition:opacity .3s ease-in-out}.nav-list{flex-direction:column;position:fixed;top:var(--nav-mobile-height);left:0;bottom:0;justify-content:flex-start;align-items:stretch;gap:.25rem;opacity:1;pointer-events:none;z-index:1000;background:var(--secondary-clr);color:var(--main-clr);width:min(380px,80vw);height:calc(100vh - var(--nav-mobile-height));overflow-y:auto;margin:0;padding:1rem;border-radius:0 16px 16px 0;box-shadow:0 10px 25px #00000059;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transform:translate(-105%);transition:transform .3s ease-in-out}.nav-list li{width:100%}.nav-list .nav-links{display:flex;align-items:center;gap:1rem;padding:1rem 1.4rem;border-radius:8px;font-size:1.8rem}.nav-list .nav-links svg{width:20px;height:20px}.nav-list .nav-links:hover{background:#1111110f}.nav-list .nav-links:after{content:none}.nav-list .menu-controls{display:flex;align-items:center;gap:1rem;padding:.9rem 1.2rem}.nav-list .menu-controls a{display:inline-flex;align-items:center}.nav-list .menu-controls{gap:1.2rem}.nav-list .menu-controls svg{width:24px;height:24px}.nav-list .menu-controls a{font-size:2.2rem;line-height:1}.social-nav{opacity:0;pointer-events:none;position:fixed;bottom:8%;left:50%;transform:translate(-50%);z-index:1000}.social-nav:nth-of-type(2){bottom:16%}.nav-list.open,.social-nav.open{opacity:1;pointer-events:all}.nav-list.open{transform:translate(0)}.nav .container>a{position:relative;z-index:1101}body.open .nav .container>a{visibility:visible}.mobile-overlay{position:fixed;left:0;right:0;top:var(--nav-mobile-height);bottom:0;background:#00000073;-webkit-backdrop-filter:blur(1px);backdrop-filter:blur(1px);pointer-events:all;z-index:900}.control-nav,.close-btn{display:none}.hero-btn-container{justify-content:center}.hamburger{width:25px;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;transition:transform .33s ease-out}.line-menu{background:#fff;width:100%;height:1.5px}.line-menu:not(:first-child){margin-block-start:.75rem}.line-menu.half{width:50%}.line-menu.start{transition:transform .33s cubic-bezier(.54,-.81,.57,.57);transform-origin:right}.line-menu.end{align-self:flex-end;transition:transform .33s cubic-bezier(.54,-.81,.57,.57);transform-origin:left}.hero .container{min-height:auto;text-align:center;position:relative}.hero .img-wrapper{display:block}.footer .scroll{display:none}.my-skills ul{grid-template-columns:repeat(2,1fr)}.about-me .container{gap:3.5rem}.projects{gap:6rem}.project{grid-template-columns:1fr;grid-template-areas:"img" "text"}.project a{grid-area:img}.project div{grid-area:text}.project.reverse{grid-template-areas:"img" "text"}.project-links{column-gap:2rem}.other-noteworthy-project{margin-block-start:8rem}.other-projects{grid-template-columns:1fr;text-align:center}.other-projects ul{justify-content:center}.footer .container{justify-content:center;gap:3rem}.mail-link{justify-content:center}.back-to-top{right:1rem;bottom:1.6rem;width:42px;height:42px}}.video-popup{display:none;position:fixed;z-index:1;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#0006}.video-content{position:relative;margin:5% auto;padding:20px;width:90%;max-width:900px;background:#fff;box-shadow:0 5px 15px #0000004d}video{width:100%;height:auto}.close-button{color:#aaa;float:right;font-size:28px;font-weight:700}.close-button:hover,.close-button:focus{color:#000;text-decoration:none;cursor:pointer}