:root{--text-color:#000;--secondary-text-color:#616161}*{box-sizing:border-box;margin:0;padding:0}html,body{color:var(--text-color);-webkit-font-smoothing:antialiased;font-family:Inter,sans-serif;overflow:hidden}.webgl{outline:none;position:fixed;top:0;left:0}.overlay{pointer-events:none;z-index:1;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:2rem;display:flex;position:absolute;top:0;left:0}.nav-logo a,.nav-links a,.nav-socials a,.nav-time p,.hero-section h1,.bar-location p,.bar-projects a,.bar-availability a{opacity:0}.overlay a{color:var(--text-color);pointer-events:all;text-decoration:none}.top-nav{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);gap:1rem;width:100%;padding:1rem;display:flex;position:fixed;top:0;left:0}.top-nav a{color:var(--secondary-text-color);font-size:18px;font-weight:400}.top-nav .nav-logo{width:36%}.top-nav .nav-logo a{letter-spacing:-.04em;color:var(--text-color);font-size:clamp(3.5rem,6vw,5.5rem);font-weight:700}.top-nav .nav-content{flex:1;gap:.5rem;display:flex}.top-nav .nav-content .nav-links,.top-nav .nav-content .nav-socials{flex-direction:column;flex:1;gap:.5rem;display:flex}.top-nav .nav-content .nav-time{color:var(--secondary-text-color);flex:1}.hero-section{justify-content:flex-start;height:60vh;margin-top:40vh;display:flex}.hero-section .spacer{width:36%}.hero-section .spacer-back{width:10%}.hero-section h1{flex:1;font-size:clamp(1.5rem,2.5vw,2rem);font-weight:400}.hero-section h1 .secondary{color:var(--secondary-text-color)}.bottom-bar{justify-content:space-between;width:100%;display:flex}.bottom-bar .bar-location{width:36%}.bottom-bar .bar-projects,.bottom-bar .bar-availability{flex:1}.animated-link{height:1.2em;line-height:1.2;display:inline-block;overflow:hidden}.link-content{flex-direction:column;transition:all .8s cubic-bezier(.34,1.56,.64,1);display:flex;transform:translateY(-50%)}.link-text{white-space:nowrap;align-items:center;height:1.2em;display:flex}.link-text img{width:20px;height:20px;margin-left:.5rem}.animated-link:hover .link-content{color:var(--text-color);transform:translateY(0%)}@media (width<=768px){.overlay{padding:1rem}.top-nav{flex-direction:column;align-items:center;gap:1rem}.top-nav .nav-logo{text-align:center;order:-1;width:100%}.top-nav .nav-logo a{font-size:2rem}.top-nav .nav-content{gap:.5rem;width:100%}.hero-section h1{text-align:center;align-items:center;font-size:1rem}.hero-section .spacer,.hero-section .spacer-back{display:none}.bottom-bar{align-items:flex-end;gap:.5rem;font-size:12px}}
