@font-face{font-family:Rubik;font-display:swap;src:url(/fonts/Rubik-VariableFont_wght.woff2) format("woff2"),local(Arial)}@font-face{font-family:SpaceGrotesk;font-display:swap;src:url(/fonts/SpaceGrotesk-VariableFont_wght.woff2),local(Arial)}*,*:before,*:after{box-sizing:border-box}*{margin:0}body{margin:0;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}*{font-family:SpaceGrotesk;--text: #e9f1f8;--background: #0d0f12;--primary: #8bbfe7;--secondary: #1b2532;--accent: #369eeb}html{scroll-behavior:smooth}body{color:var(--text);background-color:var(--background)}body>.background{position:fixed;height:1800px;width:1200px;z-index:-999;background:#1a1a1a;background:radial-gradient(circle,#1a1a1acc 12%,#0d0f12 63%);background-position:left}h2,h3,h4,h5{margin:1rem 0;font-family:Rubik;font-weight:700}a{color:var(--text);text-decoration:none}a.link{color:var(--text);text-decoration:underline}a.link:hover{color:var(--primary);text-decoration:none}p{margin-bottom:1rem}::selection{background-color:#ffffff4d;color:#fff}.sub-text{color:var(--primary);font-size:1.2rem}.logo a{font-family:SpaceGrotesk;font-weight:700;color:var(--text);text-decoration:none;-webkit-user-select:none;user-select:none}.logo a:before,h2:before{content:"//";display:inline-block;position:relative;padding-right:.5rem;top:calc((1em * .5) - .6em);font-size:.8em;font-family:SpaceGrotesk;font-weight:700;-webkit-user-select:none;user-select:none}.navbar{position:fixed;width:100vw;background-color:#0d0f12cc;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:#ffffff1a;top:0;z-index:100}.navbar .nav-content{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin:0 auto;padding:1rem}.navbar .logo a{font-size:24px}.navbar .items a{font-family:SpaceGrotesk;font-weight:500;font-size:1.15rem;text-decoration:none;padding:10px;border-radius:10px;transition:all .2s ease}.navbar .items a:hover{transition-duration:.2s;color:#d3d3d3}main{margin:8rem auto;display:flex;flex-direction:column;gap:5rem}.wrapper{max-width:1000px}#hero{display:block;overflow-x:hidden;margin-top:4rem;padding:1rem}.hero-heading h1{font-size:clamp(32px,2.6vw,64px);font-family:Rubik;font-weight:900;line-height:1.25em;margin:1rem 0}.hero-content{display:flex;flex-direction:column;justify-content:start;gap:.5rem}.hero-content p{color:var(--header-secondary);max-width:70ch}.technologies{justify-content:center;align-items:center;padding-left:1rem;padding-right:1rem}#projects{display:flex;flex-direction:column;margin:0 auto;padding-left:1rem;padding-right:1rem}.footer{border-top-style:solid;border-top-width:1px;border-top-color:#ffffff1a;padding:2rem 0;margin:auto;font-size:1.1rem;background-color:inherit}.footer-content{display:flex;justify-content:space-between;margin:auto}.footer .logo a{font-size:24px}.social-links{display:flex;gap:.5rem}.social-links svg{width:35px;font-size:x-large;transition:all .2s ease}.social-links svg:hover{color:#d3d3d3}@media all and (max-width: 560px){.hero-right{display:none}}@font-face{font-family:Rubik;font-display:swap;src:url(/fonts/Rubik-VariableFont_wght.woff2) format("woff2"),local(Arial)}/**
* @license
*
* Font Family: Space Grotesk
* Designed by: Florian Karsten
* URL: https://www.fontshare.com/fonts/space-grotesk
* © 2025 Indian Type Foundry
*
* Space Grotesk Variable (Variable font)
*
*/@font-face{font-family:SpaceGrotesk;font-display:swap;src:url(/fonts/SpaceGrotesk-VariableFont_wght.woff2),local(Arial)}#projects .cards{display:flex;flex-direction:column;gap:1rem;max-width:1000px}#projects .cards .card{display:flex;flex-direction:row;gap:1.25rem;padding:1.25rem;border-radius:12px;border:1px solid rgba(255,255,255,.2);background-color:inherit;transition:background-color .1s ease-in,border .1s ease-in;min-height:280px}#projects .cards .card:hover{animation:movingshadow 1.25s infinite;border:1px solid var(--accent);background-color:#0a0a0a}#projects .cards .card .link-icon{margin-left:.4rem}#projects .cards .card>*{max-width:50%}#projects .cards .card-img{align-self:center;max-width:435px;max-height:240px;overflow-y:hidden;width:100%}#projects .cards .card-img img{border-radius:8px;height:100%;width:auto;object-fit:cover}#projects .cards .card .card-description a{display:block;width:fit-content}#projects .cards .card .card-description .stack{display:flex;margin-top:1rem;gap:.4rem;flex-wrap:wrap;list-style:none;padding:0}#projects .cards .card .card-description .stack li{font-weight:600;font-size:.9rem;padding:.25em .75em;background-color:var(--secondary);color:var(--primary);border-radius:1em;-webkit-user-select:none;user-select:none}@media (max-width: 800px){#projects .cards .card{flex-direction:column}#projects .cards .card .card-img,#projects .cards .card .card-description{max-width:95%}}@keyframes movingshadow{0%,to{box-shadow:-2px 0 24px transparent}50%{box-shadow:-2px 0 24px #3296dc99}}.block{display:block}.inactive{filter:brightness(.4)}.grid-heading{display:block;font-weight:700;font-size:1.25rem}.grid-heading>.block>span{color:var(--primary);font-weight:600;font-size:1.8rem}.grid-stack{display:flex;justify-content:start;flex-wrap:wrap;gap:1rem;margin-top:3rem}.grid-stack i{font-size:2.5rem;padding:1.25rem;background-color:inherit;border:1px solid transparent;border-radius:8px;width:fit-content;transition:all .15s ease-in}.grid-stack i:hover{animation:movingshadow 1.25s infinite;transform:translateY(-.25em) scale(1.12) rotate(360deg);border:1px solid var(--accent);background-color:#0a0a0a}@keyframes movingshadow{0%{box-shadow:-2px 0 24px transparent}50%{box-shadow:-2px 0 24px #3296dc99}to{box-shadow:-2px 0 24px transparent}}@media only all and (max-width: 560px){.grid-stack{grid-template-columns:repeat(5,1fr)}.grid-stack i{font-size:2.25rem}}@media only all and (max-width: 460px){.grid-stack{grid-template-columns:repeat(4,1fr)}.grid-stack i{font-size:1.8rem;padding:1rem}}
