@import"https://fonts.googleapis.com/css2?family=Bungee&family=Bungee+Inline&family=Bungee+Shade&display=swap";*{margin:0;padding:0;box-sizing:border-box}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-width:320px;min-height:100vh}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom,#00000080,#00000080),url(/background.png) center/cover;z-index:-1}.trigram{display:none;position:fixed;gap:3em;right:2em;top:2em;height:2.8em;width:2.8em;padding:.4em .5em 0;border-radius:5px;border:1px solid white;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);cursor:pointer;opacity:1;transition:all .1s ease-in;transform:translateY(-15em) scale(.5);animation:no-transform 1s cubic-bezier(0,.9,.3,1.2) forwards;z-index:10}.trigram svg{height:2em;margin:0 auto;fill:#f4a460}.trigram.show{position:fixed;top:4.5em}.trigram.no-animation{animation:none;transform:none}.hide{display:none;opacity:0;animation:none}.show{display:flex!important;justify-content:space-between;align-items:space-between;opacity:1!important;animation:none!important;transform:none!important}nav{display:flex;position:fixed;gap:3em;right:3em;top:2em;font-family:Bungee,sans-serif;opacity:0;transition:all .1s ease-in;transform:translateY(-15em) scale(.5);animation:no-transform 1s cubic-bezier(0,.9,.3,1.2) forwards;z-index:10}nav:before{content:"";position:fixed;width:100%;top:-3em;right:-1em;height:5em;width:22.6em;border-radius:15px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:-1}nav a{font-size:17px;text-decoration:none;color:#fff;transition:font-size .5s ease-in,transform .1s ease-in,color .1s ease-in}nav a.hide{opacity:0;display:none;visibility:collapse}nav a:hover{color:#f4a460;transform:scale(1.1)}nav a:active{transform:scale(.9)}header{display:flex;justify-content:center;align-items:center;flex-direction:column;position:relative;height:100vh}header .hero{max-width:1000px;padding-bottom:6em;text-align:center;display:flex;flex-direction:column;transition:opacity .5s ease-out,transform .5s ease-in}header .hero.hide{opacity:0;transform:translateY(-2em)}header .hero h2{font-family:Bungee,sans-serif;font-weight:400;font-style:normal;font-size:3.5rem;transition:font-size .5s ease-out}header .hero h1{font-family:Bungee,sans-serif;font-weight:400;font-style:normal;font-size:4rem;transition:font-size .5s ease-out;color:#f4a460}header .down-arrow{position:absolute;left:50%;bottom:2em;transform:translate(-50%);height:5em;width:2em;transition:width .1s ease-out,opacity .5s ease-out,transform .5s ease-out;cursor:pointer}header .down-arrow.hide{opacity:0;transform:translate(-1em,-5em)}header .down-arrow a{text-decoration:none}header .down-arrow:hover{width:2.5em}header .down-arrow:active{width:1.5em}header .down-arrow .chevron{position:absolute;width:2.1rem;height:.48rem;opacity:0;width:100%;transform:scale(.3);animation:move-chevron 3s 2s ease-out infinite}header .down-arrow .chevron:first-child{animation:move-chevron 3s 3s ease-out infinite}header .down-arrow .chevron:nth-child(2){animation:move-chevron 3s 4s ease-out infinite}header .down-arrow .chevron:before,header .down-arrow .chevron:after{content:"";position:absolute;top:0;height:100%;width:50%;background:#f4a460}header .down-arrow .chevron:before{left:0;transform:skewY(30deg)}header .down-arrow .chevron:after{right:0;width:50%;transform:skewY(-30deg)}.socials{position:fixed;bottom:-4em;left:2em;display:flex;align-items:center;gap:20px;flex-direction:column;transition:bottom .5s ease-out,left .5s ease-out;opacity:0;transform:translateY(15rem) scale(.5);animation:no-transform 1s 1s cubic-bezier(0,.9,.3,1.2) forwards;z-index:10}.socials .socials-bar{height:17em;width:.5em;border-top-left-radius:10px;border-top-right-radius:10px;background-color:#f4a460;color:sand}.socials svg{fill:#fff;height:2.2em;transition:fill .1s ease-in,font-size .1s ease-in,transform .1s ease-in}.socials svg:hover{fill:#f4a460;transform:scale(1.1)}.socials svg:active{transform:scale(.9)}.socials:before{content:"";position:absolute;top:-1em;right:-.6em;width:3.2em;height:11.4em;border-radius:20px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:-1}.pipe{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif!important;animation:pipe-pulse 1s .5s infinite}.about{display:flex;justify-content:center;align-items:center;width:100%;min-height:100vh;position:relative;overflow:hidden}.about .text{padding:2em;margin:2em 0;width:75%;max-width:1000px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:left;position:relative;border-radius:10px;background-color:#00000080;border:1px solid rgba(255,255,255,.1);box-shadow:0 0 3px #ffffff40;opacity:0;transform:translateY(2.5em);transition:opacity .5s .25s ease-out,transform .5s .25s ease-out,width .2s ease-in,padding .2s ease-in}.about .text.is-visible{transform:none;opacity:1}.about .text p{font-size:1.2em}.projects{display:flex;justify-content:center;align-items:center;width:100%;min-height:100vh;position:relative;overflow:hidden}.projects .items{padding:2em;margin:0 2.3em;max-width:1300px;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:1.1em;opacity:0;transform:translateY(2.5em);transition:opacity .5s .25s ease-out,transform .5s .25s ease-out}.projects .card{padding:1em;min-height:300px;width:400px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:10px;background-color:#00000080;border:1px solid rgba(255,255,255,.1);box-shadow:0 0 3px #ffffff40;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:.5em}.projects .card .technology{display:flex;gap:.6em;flex-wrap:wrap}.projects .card span{border:1px solid white;padding:0 .8em;border-radius:2px;color:#7fffd4}.projects .card span.secondary{color:#faebd7}.projects .items.is-visible{transform:none;opacity:1}.projects .items p{font-size:1.1em}a.link{text-decoration:none;color:#f4a460;text-align:center;margin:0 auto;transition:transform .1s ease-in,color .1s ease-in}a:hover.link{color:#fff;transform:scale(1.1)}a:active.link{color:gray;transform:scale(.9)}a.disabled{color:gray;cursor:default;pointer-events:none}a:hover.disabled,a:active.disabled{color:gray;transform:none}@keyframes no-transform{to{opacity:1;transform:none}}@keyframes pipe-pulse{0%{opacity:1}50%{opacity:0}to{opacity:1}}@keyframes move-chevron{25%{opacity:1}33.3%{opacity:1;transform:translateY(2.28rem)}66.6%{opacity:1;transform:translateY(3.12rem)}to{opacity:0;transform:translateY(4.8rem) scale(.5)}}@media screen and (max-width: 768px){header .hero h2{font-size:1.3em}header .hero h1{font-size:1.8em}nav{display:none;margin:0 auto;gap:1.5em}nav:before{top:-1em;right:1.5em;width:20.6em;height:5em}.trigram{display:block}.about{margin-bottom:4em}.about .text{padding:2em 1em;width:93%}.projects .items{margin:1em 0;padding:0;width:93%}.socials{display:none;left:1em}.socials .socials-bar{height:7em}.socials svg{font-size:.9em}.socials:before{content:"";position:absolute;top:-1em;right:-.6em;width:3em;height:11em;border-radius:20px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:-1}}@media screen and (min-width: 769px) and (max-width: 1023px){header .hero h2{font-size:3em}header .hero h1{font-size:3.5em}.about .text{padding:2em 1em;width:85%}.projects .items{margin:0}.socials{position:fixed;bottom:-8em;left:1em;display:flex;align-items:center;gap:20px;flex-direction:column}}