@import"https://use.typekit.net/jmk3xov.css";@import"https://fonts.googleapis.com/css2?family=Megrim&display=swap";@import"https://fonts.googleapis.com/css2?family=Orbitron&display=swap";main{color:#fff;z-index:99;position:absolute;width:100%;margin:0 auto;padding:120px 0;display:grid;grid-template-columns:60px repeat(11,1fr)}h1,h2,h3,blockquote{font-family:elevon,sans-serif;font-weight:700;font-style:normal}canvas{position:fixed;top:0;left:0}header{background:var(--dark-bg);grid-column:2 / span 5;font-size:2.5rem;padding:2rem;margin-bottom:var(--spacing);background-color:transparent}section{grid-column:2 / 8;padding:1rem;font-size:1.25rem;line-height:1.5;margin-bottom:var(--spacing)}blockquote{margin:0;padding:0;grid-column:2 / span 9;margin-bottom:var(--spacing);background:transparent}blockquote p{color:#fff;background-color:transparent;font-size:4rem;display:inline;line-height:1}.left{grid-column:6 / 12}#word{font-family:Orbitron;position:relative;color:#cf0;transition:all .5s ease}#futuristic-text{font-family:Orbitron,sans-serif;color:#ffe0ff;letter-spacing:.1em;line-height:1.5;transition:all .5s ease}#futuristic-text .word{margin-top:-60px;display:block}#work-history-link{text-decoration:none;color:inherit}.scroll-arrows{display:flex;flex-direction:column;justify-content:center;align-items:center;position:fixed;bottom:20px;left:0;right:0;z-index:10}.arrow{width:100px;height:50px;stroke:#ffff66b3;fill:none;stroke-width:2;animation:flash 1s linear infinite}@keyframes flash{0%,to{opacity:1}50%{opacity:.3}}.project-link{color:#c7db56;text-decoration:none;transition:color .3s ease}.project-link:hover{color:#0ff}.linkedin-icon{position:fixed;top:10px;right:10px;z-index:1000}.linkedin-icon img{width:60px;height:60px}@keyframes glitch2{0%,to{clip:rect(0,9999px,0,0)}10%{clip:rect(0,9999px,0,0);transform:skew(-.5deg,.5deg)}20%,40%,60%,80%{clip:rect(15px,9999px,85px,0);transform:skew(.5deg,-.5deg)}30%,50%,70%{clip:rect(50px,9999px,33px,0);transform:skew(-.5deg,.5deg)}90%{clip:rect(20px,9999px,70px,0);transform:skew(.5deg,-.5deg)}}.glitch-text{position:relative;color:#c7db56;background-color:transparent;display:inline-block}.glitch-text:before,.glitch-text:after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;background-color:transparent;color:#fff}.glitch-text:before{animation:glitch1 3s infinite;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);left:2px;text-shadow:-1px 0 red}.glitch-text:after{animation:glitch2 2s infinite;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);left:-2px;text-shadow:1px 0 blue}.side-menu{position:fixed;left:0;top:0;height:100vh;background:#16001600;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);width:60px;transition:width .3s ease;z-index:1000;font-family:Orbitron,sans-serif}@media screen and (min-width: 1024px){.side-menu{width:200px}.side-menu .menu-item span{opacity:1;transform:translate(0)}main{grid-template-columns:200px repeat(11,1fr)}}@media screen and (max-width: 1023px){.side-menu{width:60px}.side-menu .menu-item span{opacity:0;transform:translate(-10px)}.side-menu.expanded{width:200px}.side-menu.expanded .menu-item span{opacity:1;transform:translate(0)}.side-menu.expanded+main{padding-left:220px}}.menu-toggle{width:100%;height:60px;display:flex;align-items:center;justify-content:center;background:none;border:none;color:#c7db56;cursor:pointer;padding:0;transition:background-color .3s ease}.menu-toggle:hover{background:#c7db561a}.menu-items{padding-top:20px}.menu-item{display:flex;align-items:center;gap:16px;padding:16px;color:#c7db56;text-decoration:none;transition:all .3s ease;position:relative}.menu-item:hover{background:#c7db561a}.menu-item:hover:after{content:"";position:absolute;left:0;top:0;height:100%;width:2px;background:#c7db56;animation:glitch1 3s infinite}.menu-item svg{min-width:24px}.menu-item span{opacity:0;transform:translate(-10px);transition:all .3s ease;white-space:nowrap}.side-menu.expanded .menu-item span{opacity:1;transform:translate(0)}@keyframes glitch1{0%,to{clip:rect(0,9999px,0,0)}10%{clip:rect(0,9999px,0,0);transform:skew(.5deg,-.5deg)}20%,40%,60%,80%{clip:rect(85px,9999px,14px,0);transform:skew(-.5deg,.5deg)}30%,50%,70%{clip:rect(33px,9999px,30px,0);transform:skew(.5deg,-.5deg)}90%{clip:rect(70px,9999px,20px,0);transform:skew(-.5deg,.5deg)}}html{scroll-behavior:smooth}:root{--dark-bg: rgba(15, 15, 15, .95);--spacing: 350px;font-family:brandon-grotesque,sans-serif;font-weight:400;font-style:normal}.menu-divider{height:1px;background:#c7db56;opacity:.5;margin:8px 16px;transition:opacity .3s ease}
