.page{--bg: #18191a;--bg-elevated: #161d27;--surface: #1c2533;--text: #e8edf4;--muted: #8b9aaf;--accent: #5eead4;--accent-dim: rgba(94, 234, 212, .15);--border: rgba(255, 255, 255, .08);--radius: 14px;--radius-lg: 22px;--max: 1080px;--font-display: "Fraunces", Georgia, serif;min-height:100vh;background:var(--bg);color:var(--text)}.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.85rem clamp(1.25rem,4vw,2.5rem);border-bottom:1px solid transparent;transition:background .25s ease,border-color .25s ease,backdrop-filter .25s ease;flex-wrap:wrap}.topbar--scrolled{background:#18191ad1;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom-color:var(--border)}.brand{display:flex;align-items:center;gap:.65rem;font-weight:600;letter-spacing:-.02em}.brand__text{font-size:1rem}.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:2.5rem;height:2.5rem;padding:0;margin-left:auto;border:1px solid var(--border);border-radius:10px;background:var(--bg-elevated);color:var(--text);transition:background .2s ease,border-color .2s ease}.nav-toggle:hover{border-color:var(--muted);background:var(--surface)}.nav-toggle__bar{display:block;width:1.15rem;height:2px;margin:0 auto;background:currentColor;border-radius:1px;transition:transform .2s ease,opacity .2s ease}.nav-toggle--open .nav-toggle__bar:nth-child(1){transform:translateY(7px) rotate(45deg)}.nav-toggle--open .nav-toggle__bar:nth-child(2){opacity:0}.nav-toggle--open .nav-toggle__bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.nav-backdrop{display:none}.nav{display:flex;flex-wrap:wrap;gap:.35rem 1.1rem;font-size:.9rem;align-items:center}@media (max-width: 720px){.nav-toggle{display:flex}.nav{display:none;order:3;width:100%;flex-direction:column;align-items:stretch;gap:0;padding:.75rem 0 .25rem;border-top:1px solid var(--border);margin-top:.35rem}.nav--open{display:flex}.nav__link{padding:.65rem 0;border-bottom:1px solid rgba(255,255,255,.06)}.nav__link:last-child{border-bottom:none}.nav-backdrop{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;margin:0;padding:0;border:none;background:#00000073;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}}.nav__link{color:var(--muted);padding:.35rem 0;position:relative;transition:color .2s ease}.nav__link:hover{color:var(--text)}.nav__link:after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--accent);transition:width .2s ease}.nav__link:hover:after{width:100%}.hero{padding:clamp(2.5rem,6vw,5rem) clamp(1.25rem,4vw,2.5rem) clamp(3rem,8vw,5.5rem)}.hero__grid{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}.hero__copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0}@media (max-width: 840px){.hero__grid{grid-template-columns:1fr}.hero__visual{order:-1;max-width:420px;margin:0 auto}.hero__frame{margin-inline:auto}}.hero__hi{margin:0 0 .4rem;font-size:clamp(.95rem,1.8vw,1.05rem);font-weight:500;letter-spacing:.02em;color:#8f9093}.hero__name{margin:0;font-family:DM Sans,system-ui,sans-serif;font-size:clamp(3.25rem,7.5vw,4.85rem);font-weight:700;letter-spacing:-.02em;line-height:1.06}.hero__role{margin:.35rem 0 .85rem;font-size:clamp(2.2rem,5.2vw,3.35rem);font-weight:600;letter-spacing:-.018em;line-height:1.12;color:#7e7f83}.hero__tagline{margin:0 0 1.75rem;max-width:36ch;color:#a2a3a7;font-size:clamp(.95rem,1.85vw,1.08rem);font-weight:400;letter-spacing:.01em;line-height:1.55}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.65rem 1.35rem;border-radius:999px;font-weight:600;font-size:.92rem;border:1px solid transparent;transition:transform .15s ease,background .2s ease,border-color .2s ease,color .2s ease}.btn:active{transform:scale(.98)}.btn--primary{background:var(--accent);color:#0a1210}.btn--primary:hover{filter:brightness(1.05)}.btn--ghost{background:transparent;border-color:var(--border);color:var(--text)}.btn--ghost:hover{border-color:var(--muted);background:var(--accent-dim)}.btn--large{padding:.85rem 1.75rem;font-size:1rem}.hero__visual{position:relative}.hero__frame{width:62%;margin-inline-start:auto;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border);background:var(--surface);box-shadow:0 24px 48px #00000059}.hero__photo{width:100%;aspect-ratio:4 / 5;object-fit:cover}.section{padding:clamp(2.5rem,5vw,4rem) clamp(1.25rem,4vw,2.5rem)}.section__inner--about{max-width:min(var(--max),920px)}.section__title--about{text-align:center;margin-bottom:clamp(1.75rem,4vw,2.5rem)}.section--projects{padding-bottom:clamp(3rem,6vw,5rem)}.section__inner{max-width:var(--max);margin:0 auto}.section__title{margin:0 0 1.5rem;font-family:var(--font-display);font-size:clamp(1.65rem,3vw,2rem);font-weight:700;letter-spacing:-.02em}.about--split{display:grid;grid-template-columns:auto 1fr;gap:clamp(1.5rem,4vw,2.75rem);align-items:start}.about__avatar-wrap{flex-shrink:0}.about__avatar{display:block;width:clamp(160px,28vw,220px);height:clamp(160px,28vw,220px);border-radius:50%;object-fit:cover;border:1px solid var(--border);box-shadow:0 16px 40px #00000059}.about__main{min-width:0}.about__lead{margin:0 0 1.25rem;color:#bfc1c5;font-size:1.05rem;line-height:1.65;max-width:none}.about__skill-grid{display:grid;grid-template-columns:1fr 1fr;gap:.35rem clamp(1.25rem,4vw,2.5rem);align-items:start}.about__skill-col{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.4rem}.about__skill-col li{display:flex;align-items:baseline;gap:.5rem;font-size:.98rem;color:#bfc1c5}.about__skill-col li:before{content:"▸";flex-shrink:0;color:#bfc1c5;font-size:.85em;line-height:1}@media (max-width: 720px){.about--split{grid-template-columns:1fr;justify-items:center;text-align:center}.about__main{text-align:left;width:100%;max-width:42rem}.about__skill-grid{max-width:20rem;margin-left:auto;margin-right:auto}}.project-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.5rem}.project-card{display:grid;grid-template-columns:minmax(0,280px) 1fr;gap:1.5rem;padding:1.25rem;border-radius:var(--radius-lg);background:var(--bg-elevated);border:1px solid var(--border);align-items:start;transition:border-color .2s ease,box-shadow .2s ease}.project-card:hover{border-color:#5eead440;box-shadow:0 12px 40px #0003}@media (max-width: 720px){.project-card{grid-template-columns:1fr}}.project-card__media{border-radius:var(--radius);overflow:hidden;background:var(--surface);border:1px solid var(--border)}.project-card__media img{width:100%;aspect-ratio:16 / 10;object-fit:cover}.project-card__tags{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.5rem}.tag{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;padding:.2rem .5rem;border-radius:6px;background:var(--accent-dim);color:var(--accent);font-weight:600}.project-card__title{margin:0 0 .5rem;font-size:1.2rem;font-weight:700;letter-spacing:-.02em}.project-card__subtitle{font-weight:500;color:var(--muted);font-size:.95rem}.project-card__desc{margin:0 0 1rem;color:var(--muted);font-size:.95rem;max-width:52ch}.project-card__cta{display:inline-flex;font-weight:600;font-size:.9rem;color:var(--accent);border-bottom:2px solid transparent;transition:border-color .2s ease}.project-card__cta:hover{border-bottom-color:var(--accent)}.social{list-style:none;margin:2rem 0 0;padding:0;display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap}.hero__copy .social--in-hero{margin:0 0 1.75rem;margin-inline:0;padding:0;padding-inline:0;justify-content:flex-start;align-self:stretch;width:100%;max-width:100%;box-sizing:border-box}.hero__copy .social--in-hero>li{list-style:none;padding:0;margin:0}.social__link{display:inline-flex;align-items:center;gap:.5rem;margin:0;padding:0;border:none;color:var(--muted);font-size:.92rem;transition:color .2s ease}.social__link:hover{color:var(--text)}.social__link img{border-radius:6px}.social__glyph--white-back{position:relative;display:inline-flex;width:28px;height:28px;flex-shrink:0;border-radius:6px;overflow:hidden;vertical-align:middle}.social__glyph--white-back:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;border-radius:6px;background:#fff}.social__glyph--white-back img{position:relative;z-index:1;display:block;width:28px;height:28px;object-fit:contain;border-radius:6px}.social__svg{flex-shrink:0;color:var(--muted);transition:color .2s ease}.social__link:hover .social__svg{color:var(--text)}.social__link--popup{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;padding:0;font:inherit;color:inherit;cursor:pointer}.lightbox{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:1.5rem}.lightbox__backdrop{position:absolute;top:0;right:0;bottom:0;left:0;border:none;padding:0;background:#000000b8;cursor:pointer}.lightbox__panel{position:relative;z-index:1;max-width:min(90vw,360px);max-height:90vh;border-radius:var(--radius);overflow:hidden;box-shadow:0 24px 80px #00000073;background:var(--surface)}.lightbox__img{display:block;width:100%;height:auto;vertical-align:middle}.lightbox__close{position:absolute;top:.4rem;right:.4rem;width:2.25rem;height:2.25rem;display:flex;align-items:center;justify-content:center;border:none;border-radius:999px;background:#18191aa6;color:var(--text);font-size:1.35rem;line-height:1;cursor:pointer;transition:background .2s ease}.lightbox__close:hover{background:#18191ae6}.footer{padding:2.5rem 1.25rem 3rem;border-top:1px solid var(--border);text-align:center}.footer__inner{display:flex;flex-direction:column;align-items:center;gap:.65rem}.footer__copy,.footer__credit{margin:0;font-size:.85rem;color:var(--muted)}.footer__credit a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth;background-color:#18191a}body{margin:0;font-family:DM Sans,system-ui,sans-serif;font-optical-sizing:auto;background-color:#18191a;color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}#root{min-height:100vh}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}button{font:inherit;cursor:pointer}