:root{--bg:255 255 255;--fg:17 24 39;--muted:107 114 128;--card:248 250 252;--ring:14 165 233;--grad1:14 165 233;--grad2:99 102 241;}
@media (prefers-color-scheme: dark){:root{--bg:3 6 23;--fg:226 232 240;--muted:148 163 184;--card:15 23 42;}}
*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,"Apple Color Emoji","Segoe UI Emoji";color:rgb(var(--fg));background:rgb(var(--bg));line-height:1.6;}
.container{max-width:1100px;margin-inline:auto;padding:24px}
header{position:sticky;top:0;z-index:50;backdrop-filter:saturate(180%) blur(10px);background:color-mix(in oklab,rgb(var(--bg)) 85%,transparent);border-bottom:1px solid color-mix(in oklab,rgb(var(--card)) 70%,rgb(var(--fg)) 5%)}
nav{display:flex;align-items:center;justify-content:space-between;gap:16px}
a{color:inherit;text-decoration:none}.brand{display:flex;align-items:center;gap:12px;font-weight:700}
.dot{width:10px;height:10px;border-radius:999px;background:linear-gradient(135deg,rgb(var(--grad1)),rgb(var(--grad2)))}
.navlinks{display:flex;gap:18px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:999px;border:1px solid color-mix(in oklab,rgb(var(--fg))10%,rgb(var(--card))70%);background:color-mix(in oklab,rgb(var(--card))80%,transparent)}
.btn:hover{box-shadow:0 10px 30px color-mix(in oklab,rgb(var(--grad1))20%,transparent);transform:translateY(-1px)}
.hero{position:relative;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
.kicker{letter-spacing:.15em;text-transform:uppercase;color:rgb(var(--muted));font-weight:600;font-size:12px}
h1{font-size:clamp(32px,6vw,56px);line-height:1.05;margin:8px 0 12px}.lead{font-size:clamp(16px,2.2vw,20px);color:rgb(var(--muted))}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.card{border:1px solid color-mix(in oklab,rgb(var(--fg))10%,rgb(var(--card))70%);background:color-mix(in oklab,rgb(var(--card))92%,transparent);border-radius:18px;padding:20px}
.avatar-wrap{display:grid;place-items:center}.avatar{width:min(360px,80%);aspect-ratio:1/1;border-radius:24px;overflow:hidden;position:relative;box-shadow:0 20px 60px color-mix(in oklab,rgb(var(--grad2))25%,transparent)}
.avatar img{width:100%;height:100%;object-fit:cover}.glow{position:absolute;inset:auto -30% -30% -30%;height:60%;filter:blur(50px);background:radial-gradient(60% 60% at 50% 100%,rgba(var(--grad1),.5),rgba(var(--grad2),0))}
section{padding:56px 0}h2{font-size:clamp(24px,4.5vw,36px);margin:0 0 8px}.muted{color:rgb(var(--muted))}
.socials{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:18px}.socials a{padding:16px;border-radius:14px;display:flex;align-items:center;gap:12px}.socials a:hover{transform:translateY(-2px)}
.chip{font-size:12px;padding:6px 10px;border-radius:999px;border:1px solid color-mix(in oklab,rgb(var(--fg))10%,rgb(var(--card))60%)}
.grid-2{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.col-7{grid-column:span 7}.col-5{grid-column:span 5}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr}.grid-2{grid-template-columns:1fr}.col-7,.col-5{grid-column:auto}}
footer{padding:40px 0;color:rgb(var(--muted));font-size:14px;border-top:1px solid color-mix(in oklab,rgb(var(--card))70%,rgb(var(--fg))5%)}
.fade-up{opacity:0;transform:translateY(8px);transition:all .7s cubic-bezier(.2,.7,.2,1)}.fade-up.show{opacity:1;transform:none}
:focus-visible{outline:2px solid rgb(var(--ring));outline-offset:3px;border-radius:10px}.footer-flex{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.small{font-size:12px}