*{margin:0;padding:0;font-family:Inter;box-sizing:border-box}html{scroll-behavior:smooth}body{background-color:#0f172a;color:#93a4b7}::selection{background:#5eead4;color:#134e4a}.hover-effect:before{--size: 0;content:"";position:fixed;left:var(--x);top:var(--y);width:var(--size);height:var(--size);background:radial-gradient(circle closest-side,rgba(100,100,255,.12),transparent);transform:translate(-50%,-50%);transition:width .2s ease,height .2s ease;pointer-events:none;z-index:999999}.hover-effect:hover:before{--size: 700px}h1{color:#e5e7eb;font-weight:600;letter-spacing:-.5px;line-height:48px;font-size:48px;white-space:nowrap}h2.title{margin-top:12px;color:#e5e7eb;font-size:20px;line-height:28px;font-weight:300}p.slogan{margin-top:16px;max-width:380px;font-weight:300}ul.chips{margin-top:8px;display:flex;flex-wrap:wrap;list-style-type:none}ul.chips li{margin:8px 6px 0 0;list-style-type:none;line-height:26px}.chips .chip{display:flex;background-color:#2dd4bf1a;color:#5eead4;font-size:12px;font-weight:400;line-height:20px;justify-content:center;align-items:center;padding:4px 12px;border-radius:9999px}:root{--page-margin-y: 64px;--page-margin-x: 48px}.app{padding:0 48px;display:flex;justify-content:center}.app .header-and-main{display:flex;justify-content:space-between;max-width:1184px;gap:16px}header{flex:1 1 200px;position:sticky;top:0;display:flex;flex-direction:column;justify-content:space-between;height:calc(100vh - 96px);padding:var(--page-margin-y) var(--page-margin-x) 0 var(--page-margin-x)}nav ul{list-style-type:none;margin-top:64px;width:max-content}nav ul li a{color:#93a4b7;text-decoration:none;vertical-align:middle;padding:10px 0;display:flex;align-items:center}nav ul li .bullet{display:inline-block;width:32px;height:1px;border-bottom:1px solid #64748b;transform-origin:center left;margin:0 15px 0 0;transition:.2s}nav ul li .text{color:#64748b;display:inline-block;transition:.2s;font-size:12px;letter-spacing:.1em;font-weight:500}nav ul li a:hover .text{color:#dce4ef;transform:translate(32px)}nav ul li a:hover .bullet{border-bottom:1px solid #e2e8f0;transform:scaleX(2)}nav ul li.active a{color:#e2e8f0}nav ul li.active .bullet{border-bottom:1px solid #e2e8f0;transform:scaleX(2)}nav ul li.active .text{color:#dce4ef;transform:translate(32px)}.social-media{list-style-type:none;margin-left:4px;margin-top:32px}.social-media .social-media-logo{text-decoration:none;padding:0;margin-right:20px;display:inline}.social-media .social-media-logo svg{width:24px;height:24px;fill:#93a4b7}.social-media .social-media-logo a:hover svg{fill:#e5e7eb}main#content{flex:1 1 300px;margin-bottom:64px}section{padding-top:96px}section .section-header{position:sticky;background-color:#0f172abf;top:0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:20px var(--page-margin-x);font-size:14px;font-weight:500;color:#dce4ef;letter-spacing:.1em;z-index:500}.resume{margin-top:48px}.header-link a{color:#e2e8f0;font-weight:400;line-height:20px;font-size:16px;text-decoration:none}.header-link .arrow svg{fill:#e5e7eb}.header-link a:hover{color:#5eead4}.header-link a .arrow svg{margin-left:4px;transition:.2s ease}.header-link a:hover .arrow svg{fill:#5eead4;transform:translate(3px,-3px)}section#about p.passage{color:#94a3b8;margin-bottom:16px;font-size:16px;font-weight:300;letter-spacing:.017em;line-height:26px}section#experience ol li.experience{list-style-type:none;margin-bottom:48px}section#experience .grid{display:grid;grid-template-columns:repeat(8,minmax(40px,1fr));gap:16px}section#experience .grid .dates{grid-column:1 / 3}section#experience .grid .dates{font-size:12px;margin:4px 0 8px}section#experience .grid .description{grid-column:3 / 9}section#experience .grid p.passage{font-size:14px;line-height:21px;font-weight:300;margin:8px 0 0}section#experience .grid h3{line-height:22px;font-size:16px;font-weight:300}section#experience .grid h3.current-position{color:#e2e8f0}section#experience .grid h3.previous-position{color:#64748b}section#projects .grid{display:grid;grid-template-columns:repeat(8,minmax(40px,1fr));gap:16px;margin-bottom:4px}section#projects .grid .image{grid-column:1 / 3}section#projects .grid .image img{padding:2px;width:100%;cursor:pointer}section#projects .description{grid-column:3 / 9}section#projects .description h3{color:#e5e7eb;font-weight:300;font-size:16px}section#projects .description .passage{color:#94a3b8;line-height:21px;font-weight:300;font-size:14px;margin-top:8px}section#projects ul{list-style:none}section#projects ul.experiences li.experience{margin-bottom:48px}section#projects .youtube-player-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0009;opacity:0;pointer-events:none;transition:all .4s}section#projects .youtube-player-overlay.active{opacity:1;z-index:700;pointer-events:auto}section#projects .youtube-player-overlay.active .youtube-player-popup{transform:translate(-50%)}section#projects .youtube-player-popup{position:fixed;left:50%;transform:translate(-50%,-100%);transition:all .4s ease}section#projects .youtube-player-popup iframe{width:100%;aspect-ratio:16/9}@media only screen and (min-width: 641px){body .youtube-player-popup{width:80%}}@media only screen and (max-width: 640px){body{--page-margin-y: 48px;--page-margin-x: 24px}body h1{font-size:32px}body section#experience .grid{display:block}body section#projects .grid{display:flex;flex-direction:column-reverse}body section#projects .grid .image img{width:200px}body .youtube-player-popup{width:100%}}@media only screen and (max-width: 1023px){body nav{display:none}body .app .header-and-main{flex-direction:column}body section{position:relative}body header{position:relative}body .app{padding:0}body section{padding:0}body section .content{padding:20px var(--page-margin-x) 0px var(--page-margin-x)}body section{margin-bottom:96px}}@media only screen and (min-width: 1024px){section .section-header{display:none}header{padding:96px 0 0}}