*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{color:#111;-webkit-font-smoothing:antialiased;background:#fff;flex-direction:column;width:100%;min-height:100vh;font-family:Inter,sans-serif;line-height:1.5;display:flex;overflow-x:hidden}.container{width:100%;max-width:1200px;margin:0 auto}a{color:inherit;text-decoration:none}.navbar{z-index:100;background:#fff;border-bottom:1px solid #eee;position:sticky;top:0}.navbar-inner{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:20px 0;display:flex;position:relative}.nav-links{gap:40px;list-style:none;display:flex;position:absolute;left:50%;transform:translate(-50%)}.nav-links a{font-size:18px;transition:opacity .2s}.nav-links a:hover{opacity:.5}.hamburger{cursor:pointer;background:0 0;border:none;flex-direction:column;justify-content:space-between;width:24px;height:18px;margin-left:auto;padding:0;display:none}.hamburger span{transform-origin:50%;background:#111;width:100%;height:2px;transition:all .3s;display:block}.hamburger.open span:first-child{transform:translateY(8px)rotate(45deg)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:translateY(-8px)rotate(-45deg)}.resume-btn{color:#fff;cursor:pointer;background:#111;align-items:center;gap:8px;padding:12px 24px;font-size:15px;font-weight:500;transition:opacity .2s;display:flex}.resume-btn:hover{opacity:.8}.section-title{letter-spacing:-1px;margin-bottom:48px;font-size:42px;font-weight:400}.section-title strong{font-weight:700}.hero{align-items:center;gap:60px;min-height:calc(100vh - 77px);padding:80px 0;display:flex}.hero-left{flex:1}.hero-title{letter-spacing:-1.5px;margin-bottom:24px;font-size:52px;font-weight:400;line-height:1.15}.hero-title strong{font-weight:700}.hero-desc{color:#555;max-width:550px;margin-bottom:12px;font-size:16px;line-height:1.7}.hero-desc:last-of-type{margin-bottom:40px}.social-icons{gap:16px;display:flex}.social-icons a{color:#111;align-items:center;font-size:28px;transition:opacity .2s;display:flex}.social-icons a:hover{opacity:.5}.hero-right{flex-shrink:0;width:420px}.hero-image{width:100%}.hero-portrait{width:100%;height:auto;display:block}.about{border-top:1px solid #eee;align-items:center;gap:80px;padding:100px 0;display:flex}.about-image{opacity:0;flex-shrink:0;justify-content:center;align-items:center;width:380px;padding:20px 0;transition:opacity .7s,transform .7s;display:flex;transform:translate(-60px)}.word-cloud{width:100%;height:400px;position:relative}.word-cloud span{letter-spacing:-.3px;white-space:nowrap;font-weight:700;line-height:1.2;position:absolute}.wc-xl{font-size:28px}.wc-lg{font-size:22px}.wc-md{font-size:17px}.wc-sm{font-size:13px}.about-content{opacity:0;transition:opacity .7s .15s,transform .7s .15s;transform:translate(60px)}.about-visible .about-image,.about-visible .about-content{opacity:1;transform:translate(0)}.about-content .section-title{margin-bottom:16px}.about-content p{color:#444;font-size:16px;line-height:1.8}.about-philosophy{flex-direction:column;margin-bottom:36px;display:flex}.about-education p{margin-bottom:14px}.about-sub{color:#888;font-size:14px;font-style:italic}.skills{border-top:1px solid #eee;padding:100px 0}.skills .section-title{text-align:center}.skills-grid{grid-template-columns:repeat(5,1fr);gap:0;display:grid}.skill-card{cursor:default;border:1px solid #e0e0e0;flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:40px 20px;transition:background .4s;display:flex}.skill-icon{font-size:48px;display:flex}.skill-name{font-size:14px;font-weight:500}.projects{color:#fff;background:#111;width:100vw;margin-left:calc(50% - 50vw);padding:100px calc(50vw - 50%)}.projects-heading{color:#fff;text-align:center;margin-bottom:80px}.projects-list{flex-direction:column;gap:80px;display:flex}.project-item{align-items:center;gap:60px;transition:transform .3s;display:flex}.project-item:nth-child(2n){flex-direction:row-reverse}.project-item:hover{transform:translateY(-6px)}.project-image{border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:560px;height:380px;display:flex;position:relative;overflow:hidden}.project-overlay{opacity:0;background:#000000a6;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:14px;transition:opacity .3s;display:flex;position:absolute;inset:0}.project-item:hover .project-overlay{opacity:1}.overlay-btn{color:#111;background:#fff;border-radius:6px;justify-content:center;align-items:center;gap:8px;width:140px;padding:10px 0;font-size:14px;font-weight:600;text-decoration:none;transition:background .2s,transform .2s;display:inline-flex}.overlay-btn:hover{background:#e5e5e5;transform:scale(1.04)}.overlay-btn--ghost{color:#fff;background:0 0;border:2px solid #fff}.overlay-btn--ghost:hover{background:#ffffff26}.project-image-inner{justify-content:center;align-items:flex-start;width:100%;height:100%;display:flex;overflow:hidden}.project-static-image{object-fit:cover;object-position:top;width:100%;height:100%;display:block}.project-scroll-image{width:100%;animation:14s linear infinite alternate scroll-preview;display:block}.project-item:hover .project-scroll-image{animation-play-state:paused}@keyframes scroll-preview{0%{transform:translateY(0)}to{transform:translateY(calc(320px - 100%))}}.project-info{flex:1;grid-template-areas:"panel";align-items:center;display:grid}.project-info-default{opacity:1;flex-direction:column;grid-area:panel;justify-content:center;transition:opacity .3s,transform .3s;display:flex;transform:translateY(0)}.project-item:hover .project-info-default{opacity:0;pointer-events:none;transform:translateY(-12px)}.project-number{color:#333;margin-bottom:16px;font-size:64px;font-weight:700;line-height:1;display:block}.project-title{margin-bottom:10px;font-size:32px;font-weight:700}.project-category{color:#777;letter-spacing:.3px;margin-bottom:25px;font-size:15px;display:block}.project-info-hover{opacity:0;pointer-events:none;flex-direction:column;grid-area:panel;gap:20px;padding:8px 0;transition:opacity .3s,transform .3s;display:flex;transform:translateY(12px)}.project-item:hover .project-info-hover{opacity:1;pointer-events:auto;transform:translateY(0)}.info-header{align-items:baseline;gap:12px;margin-bottom:16px;display:flex}.info-header .project-number{margin-bottom:0;font-size:36px}.info-header .project-title{margin-bottom:0;font-size:24px}.info-section{flex-direction:column;gap:6px;display:flex}.info-label{text-transform:uppercase;letter-spacing:1.5px;color:#666;font-size:11px;font-weight:700}.info-text{color:#bbb;white-space:pre-line;margin:0;font-size:15px;line-height:1.5}.info-highlights{flex-direction:column;gap:3px;margin:0;padding:0;list-style:none;display:flex}.info-highlights li{color:#bbb;padding-left:14px;font-size:15px;position:relative}.info-highlights li:before{content:"→";color:#555;font-size:12px;position:absolute;left:0}.project-tech{flex-wrap:wrap;gap:4px;margin:0;padding:0;list-style:none;display:flex}.project-tech-tag{color:#ccc;letter-spacing:.5px;text-transform:uppercase;background:#2a2a2a;border:1px solid #444;border-radius:20px;padding:3px 10px;font-size:11px;font-weight:600}.contact{border-top:1px solid #eee;align-items:flex-start;gap:80px;padding:100px 0;display:flex}.contact-left{flex:1}.contact-form{flex-direction:column;gap:16px;display:flex}.contact-form input,.contact-form textarea{resize:none;background:#fff;border:1.5px solid #ddd;outline:none;width:100%;padding:16px 20px;font-family:inherit;font-size:15px;transition:border-color .2s}.contact-form input:focus,.contact-form textarea:focus{border-color:#111}.contact-actions{align-items:center;gap:20px;margin-top:4px;display:flex}.send-btn{color:#fff;cursor:pointer;background:#111;border:none;padding:14px 28px;font-size:15px;font-weight:500;transition:opacity .2s}.send-btn:hover{opacity:.8}.contact-right{flex:1;padding-top:20px}.contact-heading{letter-spacing:-1px;margin-bottom:20px;font-size:42px;font-weight:400;line-height:1.2}.contact-heading strong{color:#999;font-weight:700}.contact-tagline{color:#555;margin-bottom:32px;font-size:15px;line-height:1.7}.contact-email{margin-bottom:12px;font-size:20px;font-weight:600}.footer{color:#fff;background:#111;justify-content:space-between;align-items:center;width:100vw;margin-left:calc(50% - 50vw);padding:24px calc(50vw - 50% + 60px);display:flex}.footer-copy{color:#888;font-size:14px}@media (width<=1024px){.navbar-inner{padding:16px 30px}.hero,.about,.contact,.skills{padding-left:30px;padding-right:30px}.hero{text-align:center;flex-direction:column;gap:40px}.hero-right{width:280px}.hero-desc{max-width:100%}.social-icons{justify-content:center}.about{border-top:none;flex-direction:column;gap:20px;padding:60px 30px;position:relative}.about:before,.about:after{content:"";background:#eee;width:400px;height:1px;display:block;position:absolute;left:50%;transform:translate(-50%)}.about:before{top:0}.about:after{bottom:0}.about-image{display:none}.skills{border-top:none;padding:60px 0;position:relative}.skills:before{content:"";background:#eee;width:400px;height:1px;display:block;position:absolute;top:0;left:50%;transform:translate(-50%)}.skills-grid{grid-template-columns:repeat(3,1fr)}.projects{padding:60px calc(50vw - 50% + 30px)}.projects-heading{margin-bottom:40px}.projects-list{gap:120px}.project-item,.project-item:nth-child(2n){flex-direction:column;gap:24px}.project-image{order:2;width:100%}.project-info{order:1;width:100%;display:block}.project-info-hover{display:none}.project-item:hover .project-info-default{opacity:1;pointer-events:auto;max-height:500px;transform:translateY(0)}.project-item:hover .project-info-hover,.project-item:hover .project-overlay{opacity:0}.project-item.touched .project-info-default{opacity:0;pointer-events:none;max-height:0;transition:opacity .3s,transform .3s,max-height .3s;overflow:hidden;transform:translateY(-8px)}.project-item.touched .project-info-hover{opacity:1;display:flex;transform:translateY(0)}.project-item.touched .project-overlay{opacity:1}.project-scroll-image{object-fit:cover;width:100%;height:100%;animation:none!important;transform:none!important}.contact{flex-direction:column;padding:60px 30px}.contact-right{order:1}.contact-left,.contact-form{order:2;width:100%}}@media (width<=640px){.hamburger{display:flex}.resume-btn{display:none}.nav-links{z-index:101;background:#fff;border-top:1px solid #eee;border-bottom:1px solid #eee;flex-direction:column;align-items:center;gap:32px;width:100%;padding:32px 0;display:none;position:absolute;top:100%}.nav-links.open{display:flex}.section-title{font-size:32px}.hero-title{font-size:36px}.about:before,.about:after,.skills:before{width:200px}.skills-grid{grid-template-columns:repeat(2,1fr)}.projects-list{gap:80px}.project-image{height:240px}.contact{gap:40px}.footer{text-align:center;flex-direction:column;gap:12px;padding:20px 30px}}