:root{--bg: #0a0d14;--bg-nav: #11151d;--line: rgba(110, 130, 170, .2);--grid: rgba(90, 120, 170, .08);--text: #eef0f6;--text-soft: #b4bac9;--text-muted: #8b93a6;--lavender: #b7b4d8;--accent: #7b85c4;--dot: #7f87dc}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100vh;background-color:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,sans-serif}@media(min-width:51rem){html,body,app-root,.page{height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;overflow:hidden}}app-root{display:flex;flex-direction:column;min-height:100vh}.page{display:flex;flex-direction:column;flex:1;min-height:100vh}header,main,footer{width:100%;padding-inline:clamp(1.25rem,3vw,3rem)}main{display:flex;flex-direction:column;flex:1;min-height:0}header{padding-top:1.25rem}nav{display:flex;align-items:center;gap:.75rem;padding:.55rem 1.1rem;border:1px solid var(--line);border-radius:10px;background:var(--bg-nav)}.logo img{display:block;width:auto}nav .logo img{height:1.35rem}.nav-github{display:inline-flex;align-items:center;gap:.45rem;margin-left:auto;color:var(--accent);font-size:.95rem;font-weight:500;text-decoration:none}.nav-github .icon{width:1.25rem;height:1.25rem}.nav-github:hover{color:var(--lavender)}.brand{color:var(--text-soft);font-size:.95rem;font-weight:500}.hero{position:relative;isolation:isolate;flex:0 0 auto;padding:1.5rem 2rem 3.5rem}@media(min-width:51rem){.hero{padding:clamp(.75rem,2.2vh,1.5rem) 2rem clamp(1rem,3.5vh,2.75rem)}}.hero:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:3rem 3rem;-webkit-mask-image:linear-gradient(to bottom,black 0%,transparent 100%);mask-image:linear-gradient(to bottom,black 0%,transparent 100%)}.role,.panel-title{display:flex;align-items:center;gap:.6rem;margin:0 0 1.25rem;color:var(--text-muted);font-size:.95rem;font-weight:500}.role:before,.panel-title:before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:var(--dot)}.panel-title{margin-bottom:.25rem;color:var(--text)}h1{display:flex;flex-direction:column;margin:0 0 1.5rem;font-size:clamp(3.25rem,8vw,5.5rem);font-weight:800;line-height:.92;letter-spacing:-.035em}@media(min-width:51rem){.role{margin-bottom:clamp(.6rem,1.6vh,1.25rem)}h1{margin-bottom:clamp(.7rem,1.8vh,1.5rem);font-size:clamp(2.5rem,8vh,5rem)}.lede{margin-bottom:clamp(.9rem,2.2vh,2rem)}}.first-name{color:var(--text)}.last-name{font-weight:400;color:var(--lavender)}.lede{max-width:36rem;margin:0 0 2rem;color:var(--text-soft);font-size:1.05rem;line-height:1.65}.download{display:inline-flex;align-items:center;gap:.55rem;appearance:none;padding:.75rem 1.35rem;border:1px solid var(--accent);border-radius:10px;background:var(--bg-nav);box-shadow:0 0 .85rem #7b85c447;color:var(--text);font:inherit;font-size:.95rem;font-weight:500;text-decoration:none;cursor:pointer}.download .icon{width:1rem;height:1rem;flex-shrink:0}.download:hover{background:#171c26}.overview{display:grid;grid-template-columns:1fr 1fr 1fr;flex:1;min-height:0;border-top:1px solid var(--line);padding:1.75rem 2rem 0}@media(min-width:51rem){.overview{padding-top:clamp(1rem,2.2vh,1.75rem)}}.panel{display:flex;flex-direction:column;min-width:0;min-height:0;padding:0 1.25rem}.panel+.panel{border-left:1px solid var(--line)}.panel-sub{margin:0 0 1rem;color:var(--text-muted);font-size:.85rem}.panel-body{overflow-y:auto;max-height:16rem;scrollbar-width:none;-ms-overflow-style:none}.panel-body::-webkit-scrollbar{width:0;height:0}@media(min-width:51rem){.panel-body{flex:1;max-height:none;min-height:0}}.skills{display:flex;flex-wrap:wrap;align-content:flex-start;align-items:center;gap:.5rem;margin:0;padding:0;list-style:none}.skills li{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .75rem;border:1px solid var(--line);border-radius:10px;background:var(--bg-nav);color:var(--text-soft);font-size:.8rem}.skills img{width:.9rem;height:.9rem;flex-shrink:0}@media(min-width:51rem){.skills{gap:.4rem}.skills li{padding:.25rem .6rem;font-size:.75rem}.skills img{width:.8rem;height:.8rem}}.career{margin:0;padding:.4rem .2rem .25rem 1.4rem;list-style:none;background-image:linear-gradient(var(--line),var(--line));background-size:1px calc(100% - .55rem);background-repeat:no-repeat;background-position:.5rem .4rem}.career li{position:relative;display:flex;flex-direction:column;gap:.1rem;padding:0 0 1.1rem 1rem}@media(min-width:51rem){.career li{padding-bottom:clamp(.55rem,1.4vh,1.1rem)}}.career li:before{content:"";position:absolute;top:.35rem;left:-.9rem;width:.5rem;height:.5rem;border:1.5px solid #6d7590;border-radius:50%;background:var(--bg);transform:translate(-50%)}.career li:first-child:before{width:.6rem;height:.6rem;border-color:var(--dot);background:var(--dot)}.career strong{font-size:.9rem;font-weight:600}.career span{color:var(--text-muted);font-size:.8rem}.panel-body:has(.project-card){display:flex;flex-direction:column}.project-card{display:flex;gap:.75rem;max-width:22rem;max-height:100%;min-height:0;padding:.5rem;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:#10141c;margin-bottom:10px}.project-thumb{flex:0 0 clamp(2.25rem,4.5vh,3.25rem);width:clamp(2.25rem,4.5vh,3.25rem);height:clamp(2.25rem,4.5vh,3.25rem);border-radius:10px;object-fit:cover}.project-card>div{min-width:0}.project-card h3{margin:0 0 .25rem;font-size:.9rem;font-weight:600}.project-card p{display:-webkit-box;margin:0 0 .5rem;overflow:hidden;color:var(--text-muted);font-size:.75rem;line-height:1.4;-webkit-box-orient:vertical;-webkit-line-clamp:3}.project-card a{display:inline-flex;align-items:center;gap:.35rem;color:var(--lavender);font-size:.85rem;text-decoration:none}.project-card .icon{width:.85rem;height:.85rem}@media(max-width:50rem){.overview{display:block;flex:none}.panel+.panel{border-left:0;border-top:1px solid var(--line);margin-top:1.25rem;padding-top:1.25rem}}footer{flex-shrink:0;padding:3rem 0 2.25rem;text-align:center}@media(min-width:51rem){footer{padding:clamp(.9rem,2.4vh,2rem) 0 clamp(.7rem,1.8vh,1.5rem)}}footer .logo{display:flex;align-items:center;justify-content:center;gap:1rem}footer .logo:before,footer .logo:after{content:"";width:3.25rem;height:1px;background:#ffffff24}footer .logo img{height:2rem}footer p{margin:.5rem 0 0;color:#6d7384;font-size:.72rem;font-weight:400;line-height:1.4}