*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:hidden}body{margin:0;background:#fff;color:#111;font-family:Inter,Arial,sans-serif;font-weight:300;line-height:1.5;overflow-x:hidden}a{color:inherit;text-decoration:none}
.pro-nav{height:80px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e5e5e5;position:sticky;top:0;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);z-index:20}
.pro-nav a{font-size:9px;letter-spacing:.16em;color:#111;transition:.3s}
.pro-nav nav{display:flex;gap:28px}
.pro-nav nav a{position:relative;padding-bottom:6px}
.pro-nav nav a:after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:#111;transition:.3s}
.pro-nav nav a:hover:after{right:0}
.pro-nav a.back{font-weight:500;border:1px solid #111;padding:9px 16px;border-radius:999px;letter-spacing:.14em;transition:.3s}
.pro-nav a.back:hover{background:#111;color:#fff}
.label,.section-label{font-size:10px;letter-spacing:.2em;color:#666}

.pro-banner{width:100%;overflow:hidden;line-height:0;border-bottom:1px solid #e5e5e5}
.pro-banner img{width:100%;height:auto;max-height:260px;object-fit:cover;display:block}

.profile-card{display:flex;align-items:center;gap:26px;padding:0 7vw;margin-top:-46px;position:relative;z-index:2;flex-wrap:wrap}
.profile-avatar{width:92px;height:92px;border-radius:50%;overflow:hidden;border:4px solid #fff;background:#111;flex-shrink:0;box-shadow:0 4px 18px rgba(0,0,0,.12)}
.profile-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.profile-info{flex:1;min-width:220px;padding-top:50px}
.profile-name-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.profile-name-row h1{font-size:clamp(24px,3vw,32px);font-weight:500;letter-spacing:-.02em;margin:0}
.badge{font-size:10px;letter-spacing:.06em;color:#0a7a4a;background:#e6f6ee;border:1px solid #bfe8d4;padding:5px 11px;border-radius:999px;white-space:nowrap}
.profile-tagline{margin:8px 0 2px;font-size:14px;color:#333}
.profile-location{margin:0;font-size:12px;color:#888;letter-spacing:.04em}
.profile-actions{display:flex;gap:12px;padding-top:50px;flex-shrink:0}
.profile-actions .button{font-size:10px;letter-spacing:.14em;padding:11px 18px;border-radius:999px;transition:.3s}
.outline-dark{border:1px solid #111;color:#111}
.outline-dark:hover{background:#111;color:#fff}
.solid-dark{background:#111;color:#fff;border:1px solid #111}
.solid-dark:hover{transform:translateY(-2px)}

.pro-hero{min-height:70vh;padding:7vw 7vw 8vw;display:grid;grid-template-columns:1.2fr .8fr;align-items:end;border-bottom:1px solid #e5e5e5;position:relative}
.pro-hero h1{grid-column:1/-1;font-size:clamp(40px,8.5vw,140px);font-weight:300;line-height:1.02;letter-spacing:-.03em;margin:20px 0 0;overflow-wrap:break-word;word-break:break-word}
.hero-intro{max-width:430px;justify-self:end}
.hero-intro p{font-size:20px;line-height:1.4;margin-bottom:35px}
.hero-intro span{font-size:10px;color:#666;letter-spacing:.08em;line-height:1.8}
.hero-video{grid-column:2;justify-self:end;align-self:center;width:100%;max-width:400px;border:1px solid #e5e5e5}
.hero-video video{width:100%;display:block}

.pro-section{padding:10vw 7vw;border-bottom:1px solid #e5e5e5;display:grid;grid-template-columns:220px 1fr;gap:6vw}
.timeline article{display:grid;grid-template-columns:1fr 1fr;gap:5vw;padding:0 0 55px;margin-bottom:55px;border-bottom:1px solid #e5e5e5}
.timeline article:last-child{border:0;margin-bottom:0}
.timeline h2,.education h2{font-size:28px;font-weight:400;letter-spacing:-.03em;margin:0 0 8px}
.timeline p{margin:0;color:#666;font-size:13px}

.project-grid{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:260px;gap:14px}
.project-tile{position:relative;overflow:hidden;background:#111}
.project-tile.large{grid-column:span 2;grid-row:span 1}
.project-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform 1s cubic-bezier(.2,.7,.2,1),filter .5s;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none}
.project-tile:hover img{transform:scale(1.045);filter:brightness(.72)}
.project-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.45) 65%,rgba(0,0,0,.88) 100%);z-index:1}
.project-text{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:22px 26px;color:#fff}
.project-text h2{font-size:22px;font-weight:400;letter-spacing:-.02em;margin:0 0 4px}
.project-text p{font-size:11px;color:#ddd;margin:0;letter-spacing:.05em}

.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:70px 40px}
.skills-grid h3{font-size:10px;letter-spacing:.18em;margin:0 0 20px}
.skills-grid p{font-size:14px;color:#666;line-height:1.9;margin:0}
.education-list article{padding-bottom:50px;margin-bottom:50px;border-bottom:1px solid #e5e5e5}
.education-list article:last-child{border:0;margin:0}
.education h2{max-width:700px}
.education p{font-size:12px;color:#666}
.pro-contact{padding:13vw 7vw;min-height:80vh;display:flex;flex-direction:column;justify-content:center}
.pro-contact h2{font-size:clamp(38px,8vw,125px);font-weight:300;line-height:.9;letter-spacing:-.06em;margin:20px 0 70px;overflow-wrap:break-word;word-break:break-word}
.contact-links{display:flex;gap:30px;flex-wrap:wrap}
.contact-links a{font-size:11px;border-bottom:1px solid #111;padding-bottom:5px}
footer{padding:35px 7vw;border-top:1px solid #e5e5e5;display:grid;grid-template-columns:1fr 1fr auto;gap:20px;font-size:9px;letter-spacing:.12em}
footer span,footer small{color:#777}
.reveal{opacity:0;transform:translateY(24px);transition:1s ease}
.reveal.visible{opacity:1;transform:none}

@media(max-width:800px){
.pro-nav{padding:0 5vw}
.pro-nav nav{display:none}
.pro-banner img{max-height:160px}
.profile-card{margin-top:-30px;padding:0 5vw;gap:16px}
.profile-avatar{width:70px;height:70px}
.profile-info{padding-top:30px}
.profile-actions{padding-top:16px;width:100%}
.pro-hero{display:block;min-height:auto;padding:14vw 5vw 18vw}
.pro-hero h1{font-size:clamp(34px,13vw,80px);margin-bottom:80px}
.hero-intro{max-width:none}
.hero-video{max-width:none;margin-top:30px}
.pro-section{display:block;padding:20vw 5vw}
.section-label{margin-bottom:50px}
.timeline article{display:block}
.timeline article>div+div{margin-top:20px}
.project-grid{grid-template-columns:1fr;grid-auto-rows:220px}
.project-tile.large{grid-column:span 1}
.skills-grid{grid-template-columns:1fr 1fr;gap:45px 25px}
.pro-contact{padding:25vw 5vw}
.pro-contact h2{font-size:clamp(30px,13vw,60px);margin-bottom:60px}
footer{grid-template-columns:1fr;padding:30px 5vw}
}
