@property --angle{syntax: "<angle>"; initial-value: 0deg; inherits: false;}@keyframes spin{0%{--angle: 0deg }to{--angle: 360deg }}nav{position:fixed;width:100vw;top:0;z-index:999}nav .wrapper{position:relative;display:flex;align-items:center;justify-content:space-between;height:4em;background-color:#121212;padding-right:1em}nav .wrapper:after,nav .wrapper:before{content:"";width:100%;height:100%;position:absolute;top:.15em;left:0;z-index:-2;background-image:conic-gradient(from var(--angle),#40C9FF,#c000ff,#40C9FF);animation:3s spin linear infinite}nav .wrapper:before{filter:blur(1em);opacity:.5}nav .wrapper .links{display:flex;align-items:center;justify-content:center;gap:1em;margin-right:1em}nav .wrapper a:not(.svg){text-decoration:none;border-radius:2em;padding:.5em 1em;outline:none}nav .wrapper a:not(.svg):hover,nav .wrapper a:not(.svg):focus-visible{background-color:#2a2a2a}nav .wrapper a:not(.svg):visited,nav .wrapper a:not(.svg):link{color:#fff}nav .svg{display:flex;align-items:center;justify-content:center;width:2.5em;height:2.5em;border-radius:100%;padding:.6em;margin-left:1em;opacity:0;transition:opacity .5s ease;outline:none}nav .svg:hover,nav .svg:focus-visible{background-color:#2a2a2a}nav.mobile .icon{position:relative;margin-right:1em;width:2em;height:2em}nav.mobile .icon span{position:absolute;left:50%;transform:translate(-50%);width:75%;height:.1em;background-color:#fff;transition:.5s ease}nav.mobile .icon span:nth-of-type(1){top:25%}nav.mobile .icon span:nth-of-type(2){top:50%}nav.mobile .icon span:nth-of-type(3){top:75%}nav.mobile .icon.show span:nth-of-type(1){transform:rotate(45deg);top:50%;left:0}nav.mobile .icon.show span:nth-of-type(2){opacity:0}nav.mobile .icon.show span:nth-of-type(3){transform:rotate(-45deg);top:50%;left:0}.modal{display:flex;align-items:flex-start;justify-content:space-between;flex-direction:column;-webkit-backdrop-filter:blur(2em);backdrop-filter:blur(2em);padding-top:1em;position:fixed;top:4em;z-index:10;height:calc(100vh - 4em);width:100%;transform:translate(100%);transition:.5s ease}.modal.show{transform:translate(0)}.modal .navLinks{display:flex;align-items:flex-start;justify-content:flex-start;flex-direction:column;width:100%}.modal .navLinks a{position:relative;padding:.5em 1em;font-size:2em;width:100%}.modal .navLinks a:hover,.modal .navLinks a:focus-visible{background-color:#2a2a2a}.modal .navLinks a:link,.modal .navLinks a:visited{color:#fff;text-decoration:none}.modal .links{display:flex;align-items:center;justify-content:center;gap:5em;height:10em;width:100%}.modal .links a{position:relative;display:flex;align-items:center;justify-content:center;background-color:#2a2a2a;width:4em;height:4em;border-radius:100%}.modal .links a:hover:before,.modal .links a:focus-visible:before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;translate:-50% -50%;padding:.15em;border-radius:1em;background-image:linear-gradient(#c000ff,#40c9ff);filter:blur(1em);opacity:.5}.modal .links a:hover svg,.modal .links a:hover path,.modal .links a:focus-visible svg,.modal .links a:focus-visible path{fill:url(#gradient)}.modal .links a svg{width:2em;height:2em}#hero{position:relative}#hero canvas{mask-image:linear-gradient(#000,#000 85%,#0000);-webkit-mask-image:linear-gradient(rgb(0,0,0) 0%,rgb(0,0,0) 85%,rgba(0,0,0,0) 100%)}#hero h1{position:absolute;top:35%;left:50%;translate:-50% 50%;text-align:center}#about{display:flex;align-items:center;justify-content:center;flex-direction:column}#about h1{margin-bottom:1em}#about .container{position:relative;display:flex;align-items:center;justify-content:center;gap:2em;width:100%;height:60em}#about .container canvas{mask-image:linear-gradient(#0000,#000 20%,#000 80%,#0000);-webkit-mask-image:linear-gradient(rgba(0,0,0,0) 0%,rgb(0,0,0) 20%,rgb(0,0,0) 80%,rgba(0,0,0,0) 100%)}@media (max-width: 30rem){#about .container{flex-direction:column}}#about .text{position:absolute;width:100%;display:flex;align-items:center;justify-content:center;left:-20%}@media (max-width: 30rem){#about .text{left:-10%}}#about .wrapper{position:relative;background-color:#121212;width:25em;padding:1.5em;border-radius:1em}#about .wrapper:after,#about .wrapper:before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;translate:-50% -50%;padding:.15em;z-index:-2;border-radius:1em;background-image:conic-gradient(from var(--angle),#40C9FF,#c000ff,#40C9FF);animation:3s spin linear infinite}#about .wrapper:before{filter:blur(1em);opacity:.5}#about .wrapper .links{display:flex;gap:2em;margin-top:2em}@media (max-width: 30rem){#about .wrapper .links{margin-top:1em}}#about .wrapper .links a{position:relative;display:flex;align-items:center;justify-content:center;background-color:#2a2a2a;width:2.5em;height:2.5em;border-radius:100%;outline:none}#about .wrapper .links a svg{width:1.5em;height:1.5em}#about .wrapper .links a:hover:before,#about .wrapper .links a:focus-visible:before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;translate:-50% -50%;padding:.15em;border-radius:1em;background-image:linear-gradient(#c000ff,#40c9ff);filter:blur(1em);opacity:.5}#about .wrapper .links a:hover svg,#about .wrapper .links a:hover path,#about .wrapper .links a:focus-visible svg,#about .wrapper .links a:focus-visible path{fill:url(#gradient)}#about .fader{opacity:0;transition:1s ease}#about .fader.fadein{opacity:1}#skills{display:flex;align-items:center;justify-content:center;flex-direction:column}#skills .fader{display:flex;align-items:center;justify-content:center;opacity:0;transition:1s ease}#skills .fader.fadein{opacity:1}#skills .container{display:flex;align-items:flex-start;justify-content:space-between;position:relative;background-color:#121212;padding:1em;border-radius:1em;margin-top:3em}#skills .container:after,#skills .container:before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;translate:-50% -50%;padding:.15em;z-index:-2;border-radius:1em;background-image:conic-gradient(from var(--angle),#40C9FF,#c000ff,#40C9FF);animation:3s spin linear infinite}#skills .container:before{filter:blur(1em);opacity:.5}@media (max-width: 30rem){#skills .container{display:block;columns:2;width:90%}}#skills .container .category{display:flex;align-items:flex-start;justify-content:center;flex-direction:column;gap:1em;margin:1em}#skills .container .category .separator{font-size:.9em;width:100%}@media (max-width: 30rem){#skills .container .category{display:inline-block}#skills .container .category span{margin:1em 0}}#skills span{position:relative;display:flex;align-items:center;justify-content:center;width:fit-content;gap:.5em;border-radius:2em;background-color:#2a2a2a;padding:.5em 1em}#skills img{margin-right:.2em;max-height:1.5em}#all-projects{display:flex;align-items:center;justify-content:center;flex-direction:column;height:auto}#all-projects .header{margin-bottom:1em}#all-projects .fader{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5em;opacity:0;transition:1s ease}#all-projects .fader.fadein{opacity:1}.project{position:relative;display:flex;align-items:center;justify-content:center;background-color:#121212;border-radius:1em;padding:2em;gap:2em}.project:after,.project:before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;translate:-50% -50%;padding:.15em;z-index:-2;border-radius:1em;background-image:conic-gradient(from var(--angle),#40C9FF,#c000ff,#40C9FF);animation:3s spin linear infinite}.project:before{filter:blur(1em);opacity:.5}@media (max-width: 75rem){.project{flex-direction:column}.project.reverse .preview{order:1}.project.reverse .details{order:2}}.project .details{display:flex;align-items:flex-start;justify-content:flex-start;flex-direction:column;position:relative;width:30em;height:30em}.project .details h2{margin-bottom:.5em}.project .details h3{margin:.5em 0}.project .details ul{margin-left:2em}.project .details li{margin-bottom:1em}.project .more{position:absolute;display:flex;align-items:center;justify-content:center;margin-left:2em;gap:1em;bottom:15%;left:0}.project .links{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:1em;width:100%}.project .links a{display:flex;align-items:center;justify-content:center;background-color:#2a2a2a;width:100%;height:100%;text-decoration:none;position:relative;z-index:10;border-radius:2em;outline:none}.project .links a:link,.project .links a:visited{color:#fff}.project .button-container:nth-child(1){position:relative;width:9em;height:2.7em}.project .button-container:nth-child(1):hover:after,.project .button-container:nth-child(1):hover:before,.project .button-container:nth-child(1):focus-within:after,.project .button-container:nth-child(1):focus-within:before{display:block;opacity:1;padding:.15em}.project .button-container:nth-child(1):hover+button{color:#fff}.project .button-container:nth-child(1):after,.project .button-container:nth-child(1):before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;translate:-50% -50%;z-index:4;border-radius:2em;background-image:conic-gradient(from var(--angle),#40C9FF,#c000ff,#40C9FF);animation:3s spin linear infinite;transition:.5s ease;opacity:0}.project .button-container:nth-child(1):before{display:none;filter:blur(.5em);opacity:.5}.project .button-container:nth-child(2){position:relative;width:6em;height:2.7em}.project .button-container:nth-child(2):hover:after,.project .button-container:nth-child(2):hover:before,.project .button-container:nth-child(2):focus-within:after,.project .button-container:nth-child(2):focus-within:before{display:block;opacity:1;padding:.15em}.project .button-container:nth-child(2):hover+button{color:#fff}.project .button-container:nth-child(2):after,.project .button-container:nth-child(2):before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;translate:-50% -50%;z-index:4;border-radius:2em;background-image:conic-gradient(from var(--angle),#40C9FF,#c000ff,#40C9FF);animation:3s spin linear infinite;transition:.5s ease;opacity:0}.project .button-container:nth-child(2):before{display:none;filter:blur(.5em);opacity:.5}.project .preview{position:relative;width:30em;height:30em;display:flex;align-items:center;justify-content:center}.project .preview .buttons{cursor:pointer;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;padding:0 1em;display:flex;align-items:center;justify-content:space-between}.project .preview .buttons span{position:relative;display:flex;align-items:center;justify-content:center;border-radius:100%;width:3em;height:3em;background-color:#2a2a2ab3;outline:none}.project .preview .buttons span svg{width:1.6em;height:1.6em}.project .preview .buttons span:hover:before,.project .preview .buttons span:focus-visible:before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;translate:-50% -50%;padding:.15em;border-radius:1em;background-image:linear-gradient(#c000ff,#40c9ff);filter:blur(1em);opacity:.5}.project .preview .buttons span:hover svg,.project .preview .buttons span:hover path,.project .preview .buttons span:focus-visible svg,.project .preview .buttons span:focus-visible path{fill:#40c9ff}.project .preview .zoom{display:none}.project .preview .zoom.open{display:flex;align-items:center;justify-content:center;position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;background-color:#2a2a2ab3}@media (max-width: 45rem){.project .preview .zoom.open{display:none}}.project .preview .zoom .content{position:relative;display:flex;align-items:center;justify-content:center;height:50em;max-height:80%}.project .preview .zoom .content img{border-radius:.5rem;cursor:default}.project .preview .zoom .content .buttons{cursor:default}.project .preview .zoom .content .buttons span{cursor:pointer}.project .preview .zoom span{width:3.5em;height:3.5em}.project .preview img{cursor:pointer;width:100%;height:100%}#contact{display:flex;align-items:center;justify-content:center;flex-direction:column}#contact h1{text-align:center}#contact .fader{opacity:0;transition:1s ease}#contact .fader.fadein{opacity:1}#contact form{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;background-color:#121212;color:#fff;margin-top:2em;border-radius:1em;padding:1em 2em;width:40em}#contact form:after,#contact form:before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;translate:-50% -50%;padding:.15em;z-index:-2;border-radius:1em;background-image:conic-gradient(from var(--angle),#40C9FF,#c000ff,#40C9FF);animation:3s spin linear infinite}#contact form:before{filter:blur(1em);opacity:.5}#contact form .input{width:100%;height:3em;margin:1.5em 0;border-radius:2em;background-color:#2a2a2a;position:relative}#contact form input{position:absolute;border-radius:2em;padding:1em;top:50%;left:50%;translate:-50% -50%;width:100%;height:100%;background:none;color:#fff}#contact form input.filled+label,#contact form input:focus+label,#contact form input:valid+label{opacity:0}#contact form .textarea{width:100%;height:7em;margin:1.5em 0;border-radius:1em;background-color:#2a2a2a;position:relative}#contact form .textarea label{top:20%}#contact form textarea{position:absolute;border-radius:2em;padding:1em;top:50%;left:50%;translate:-50% -50%;width:100%;height:100%;background:none;color:#fff}#contact form textarea:focus+label,#contact form textarea:valid+label{opacity:0}#contact form label{position:absolute;z-index:3;margin-left:1em;top:50%;left:0;translate:0 -50%;background:"none";border-radius:1em;color:#fff;transition:.2s ease;opacity:.5;transform-origin:left}#contact form .button-container{position:relative;width:5.5em;height:2.7em}#contact form .button-container:hover:after,#contact form .button-container:hover:before,#contact form .button-container:focus-within:after,#contact form .button-container:focus-within:before{display:block;opacity:1;padding:.15em}#contact form .button-container:hover+button{color:#fff}#contact form .button-container:after,#contact form .button-container:before{content:"";width:100%;height:100%;position:absolute;top:50%;left:50%;translate:-50% -50%;z-index:4;border-radius:2em;background-image:conic-gradient(from var(--angle),#40C9FF,#c000ff,#40C9FF);animation:3s spin linear infinite;transition:.5s ease;opacity:0}#contact form .button-container:before{display:none;filter:blur(.5em);opacity:.5}#contact form .button{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#ffffff80;padding:1em 2em;margin-bottom:1em;border-radius:2em;background-color:#2a2a2a;z-index:5;transition:.2s ease;cursor:pointer;border:none;outline:none;white-space:nowrap}#contact form .button:hover,#contact form .button:focus-visible{color:#fff}#contact input,#contact textarea,#contact button{resize:none;outline:none;border:none}@font-face{font-display:swap;font-family:Montserrat;font-style:normal;font-weight:400;src:url(/fonts/montserrat-v26-latin-regular.woff2) format("woff2")}*{font-family:Montserrat}#hero h1{text-wrap:nowrap}.header,h1{font-size:2.5rem}@media (max-width: 60rem){.header,h1{font-size:1.6666666667rem}}@media (max-width: 30rem){.header,h1{font-size:1.25rem}}#about{font-size:1.3rem}@media (max-width: 60rem){#about{font-size:.8666666667rem}}@media (max-width: 30rem){#about{font-size:.65rem}}#skills{font-weight:700;letter-spacing:1px}#skills p{font-size:1.2rem}@media (max-width: 30rem){#skills p{font-size:.8rem}}@media (max-width: 60rem){#contact,#skills,#all-projects{font-size:.6666666667rem}}@media (max-width: 30rem){#contact,#skills,#all-projects{font-size:.5rem}}#all-projects .link{color:#c000ff;text-decoration:none;font-weight:700}.more{text-wrap:nowrap}label,button{letter-spacing:1px}*{padding:0;margin:0;box-sizing:border-box}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}#root,#__next{isolation:isolate}html,body,#root{width:100%;height:100%;background-color:#121212;position:relative;color:#fff;scroll-behavior:smooth}section{height:100vh;width:100%}
