:root{--ink:#16202e;--muted:#66717f;--blue:#234ce8;--blue-deep:#173cc9;--line:#dde2e9;--paper:#fff;--soft:#f4f6f9;--ease:cubic-bezier(.2,.7,.2,1);--sy:80px;--sy-sm:64px;--header-h:76px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 20px)}body{color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,sans-serif;font-size:16px;line-height:1.75}a{color:inherit;text-decoration:none}:focus-visible{outline:3px solid var(--blue);outline-offset:4px;border-radius:4px}::selection{color:var(--ink);background:#dfe6fd}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}img{max-width:100%;display:block}h1,h2,h3,p,figure{margin:0}h1,h2,h3{text-wrap:balance;font-weight:650;line-height:1.25}p{color:var(--muted);text-wrap:pretty}.wrap{max-width:1240px;margin-inline:auto;padding-inline:48px}.header{z-index:5;border-bottom:1px solid var(--line);-webkit-backdrop-filter:saturate(180%)blur(12px);backdrop-filter:saturate(180%)blur(12px);background:#fffffff0;position:sticky;top:0}.header-inner{height:var(--header-h);justify-content:space-between;align-items:center;max-width:1440px;margin:auto;padding:0 48px;display:flex}.brand{align-items:center;gap:14px;font-weight:650;display:flex}.monogram{color:var(--blue);font-size:28px;font-weight:800;line-height:1}.brand-sub{letter-spacing:1px;color:var(--muted);font-size:12px;font-weight:400}nav{align-items:center;gap:32px;font-size:14px;display:flex}nav a,.text-link,footer a,.back,.tel{transition:color .2s,border-color .2s,background-color .2s}nav a:not(.nav-resume),.text-link,footer a{transition:color .2s,background-size .3s var(--ease);background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat}nav a:hover,.text-link:hover,footer a:hover,.tel:hover{color:var(--blue)}nav a:not(.nav-resume):hover,.text-link:hover,footer a:hover{background-size:100% 1px}.nav-resume{border:1px solid var(--line);border-radius:5px;padding:9px 17px}.nav-resume:hover{border-color:var(--blue);background:#f3f6ff}.nav-resume span{padding-left:12px}.skip{background:var(--blue);color:#fff;z-index:10;padding:10px 20px;position:fixed;top:-100px;left:16px}.skip:focus{top:10px}.hero{padding-top:var(--sy);padding-bottom:var(--sy);grid-template-columns:1fr 280px;align-items:center;gap:64px;display:grid}.hero-actions{flex-wrap:wrap;align-items:center;gap:14px 28px;display:flex}.hero-actions .text-link{margin-left:0}.eyebrow{letter-spacing:1.5px;color:var(--muted);margin-bottom:22px;font-size:12px;font-weight:600}.hero .eyebrow{letter-spacing:.7px;color:#48566c}.dot{background:var(--blue);vertical-align:middle;border-radius:50%;width:7px;height:7px;margin-right:10px;display:inline-block}.hero h1{letter-spacing:-2px;font-size:clamp(38px,4.5vw,60px);line-height:1.32}.blue{color:var(--blue)}.hero-desc{margin:23px 0 29px;font-size:16px;line-height:1.9}.button{min-height:48px;transition:background .2s,transform .25s var(--ease),box-shadow .25s;border-radius:5px;justify-content:space-between;align-items:center;gap:32px;padding:11px 22px;font-size:14px;font-weight:550;display:inline-flex}.button>span{transition:transform .25s var(--ease)}.primary{background:var(--blue);color:#fff}.primary:hover{background:var(--blue-deep);transform:translateY(-2px);box-shadow:0 8px 20px #234ce833}.primary:hover>span{transform:translate(3px)}.primary[href^=\#]:hover>span{transform:translateY(3px)}.primary:active{box-shadow:none;transform:translateY(0)}.text-link{margin-left:26px;font-size:14px}.identity{border-top:3px solid var(--blue);background:#f0f3f8;padding:18px 19px 23px;transform:rotate(2deg)}.identity-top{letter-spacing:1px;color:var(--muted);justify-content:space-between;margin-bottom:16px;font-size:10px;display:flex}.portrait-wrap{background:#e4e9f1;height:244px;overflow:hidden}.portrait{object-fit:cover;object-position:center 22%;width:100%;height:100%}.identity-bottom{justify-content:space-between;align-items:end;margin-top:17px;display:flex}.identity-bottom strong{letter-spacing:2px;font-size:20px;display:block}.identity-bottom div>span{letter-spacing:1.5px;color:var(--muted);font-size:10px}.location{color:var(--muted);font-size:12px}.work{padding-top:var(--sy-sm);padding-bottom:var(--sy);border-top:1px solid var(--line)}.section-heading{justify-content:space-between;align-items:end;gap:24px;margin-bottom:36px;display:flex}.section-heading .eyebrow{margin-bottom:10px}.section-heading h2,.about h2,.contact h2{letter-spacing:-.8px;font-size:32px;line-height:1.4}.section-heading>p{font-size:14px}.project{border:1px solid var(--line);transition:transform .35s var(--ease),box-shadow .35s,border-color .35s;background:#fff;border-radius:10px;grid-template-columns:1.15fr 1fr;margin-bottom:32px;display:grid;overflow:hidden}.project:last-child{margin-bottom:0}.project:hover{border-color:#9eaedd;transform:translateY(-4px);box-shadow:0 18px 40px #16202e14}.project:focus-visible{outline-offset:4px;border-radius:10px}.project img{transition:transform .6s var(--ease)}.project:hover .browser-stage>img{transform:scale(1.02)}.project h3{transition:color .2s}.project:hover h3{color:var(--blue)}.project-visual{background:#e9eefb;min-width:0;position:relative}.browser-stage{flex-direction:column;padding:32px 28px 0;display:flex;overflow:hidden}.browser-stage>img{object-fit:cover;object-position:top;border-inline:1px solid #dde1ed;width:100%;height:310px}.browser-bar{background:#fff;border:1px solid #dde1ed;border-radius:6px 6px 0 0;flex-shrink:0;align-items:center;gap:4px;height:29px;padding:0 10px;display:flex}.browser-bar i{background:#d5dce5;border-radius:50%;width:5px;height:5px}.browser-bar span{color:#75818f;margin-left:10px;font-size:10px}.project-body{flex-direction:column;padding:29px 34px;display:flex}.project-meta{letter-spacing:1px;color:var(--muted);justify-content:space-between;margin-bottom:23px;font-size:11px;display:flex}.project h3{letter-spacing:-.5px;margin-bottom:12px;font-size:29px}.project-lead{color:var(--ink);margin-bottom:10px;font-size:17px;font-weight:550}.project-body>p:not(.project-lead){font-size:14px;line-height:1.85}.tags{flex-wrap:wrap;gap:7px;margin-top:20px;display:flex}.tags span{background:var(--soft);color:#526178;border-radius:3px;padding:4px 9px;font-size:12px}.project-bottom{color:var(--muted);justify-content:space-between;align-items:center;gap:12px;margin-top:22px;font-size:12px;display:flex}.round-arrow{border:1px solid var(--line);width:38px;height:38px;color:var(--ink);transition:background .25s,color .25s,border-color .25s,transform .35s var(--ease);border-radius:50%;flex-shrink:0;place-items:center;font-size:20px;display:grid}.project:hover .round-arrow{background:var(--blue);border-color:var(--blue);color:#fff;transform:translate(2px,-2px)}.ppt-stage{background:#eee9e6;align-items:center;padding:36px 28px 50px;display:flex}.ppt-stage img{width:100%;height:auto;transform:rotate(-2deg);box-shadow:0 12px 25px #37221826}.project:hover .ppt-stage img{transform:rotate(-1deg)scale(1.02)}.image-note{color:#796c63;font-size:11px;position:absolute;bottom:16px;left:28px}.about{padding-top:var(--sy);padding-bottom:var(--sy);border-top:1px solid var(--line);grid-template-columns:1fr 1.1fr;gap:80px;display:grid}.about-intro{margin-top:22px;font-size:14px}.principles>div{border-bottom:1px solid var(--line);gap:24px;padding:22px 0;display:flex}.principles>div:first-child{padding-top:0}.principles>div>span{color:var(--blue);padding-top:2px;font-size:12px}.principles h3{margin-bottom:8px;font-size:18px}.principles p{font-size:14px}.contact{background:var(--soft);margin-bottom:var(--sy-sm);border-radius:10px;padding-top:56px;padding-bottom:56px}.contact-row{justify-content:space-between;align-items:center;gap:30px;display:flex}.contact-row>div>p{margin-top:15px;font-size:14px}.contact .eyebrow{margin-bottom:12px}footer{border-top:1px solid var(--line);max-width:1240px;color:var(--muted);justify-content:space-between;gap:18px;margin:0 auto;padding:22px 48px 30px;font-size:12px;display:flex}.case{max-width:1140px;padding-top:40px}.back{color:var(--muted);gap:8px;font-size:14px;display:inline-flex}.back>span{transition:transform .25s var(--ease)}.back:hover{color:var(--blue)}.back:hover>span{transform:translate(-4px)}.case-head{padding:42px 0 35px}.case-head .eyebrow{margin-bottom:16px}.case-head h1{letter-spacing:-1.5px;font-size:52px}.case-subtitle{margin-top:18px;font-size:21px}.case-visual{background:var(--soft);border:1px solid var(--line);border-radius:8px;overflow:hidden}.case-visual>img{object-fit:cover;object-position:top;width:100%;height:auto;max-height:620px}.case-visual figcaption{color:var(--muted);padding:13px 20px;font-size:12px}figcaption a{color:var(--blue);text-underline-offset:3px;text-decoration:underline;text-decoration-thickness:1px}figcaption a:hover{color:var(--blue-deep);text-decoration-thickness:2px}.ppt-detail>img{object-fit:contain;max-height:none}.case-facts{border-bottom:1px solid var(--line);grid-template-columns:repeat(3,1fr);gap:26px;padding:27px 0 34px;display:grid}.case-facts span{color:var(--muted);margin-bottom:5px;font-size:12px;display:block}.case-facts strong{font-size:16px;font-weight:550}.case-section{padding:var(--sy-sm) 0;border-bottom:1px solid var(--line);grid-template-columns:190px 1fr;gap:32px;display:grid}.section-label{letter-spacing:1px;color:var(--blue);padding-top:8px;font-size:12px}.case-section h2{letter-spacing:-.6px;margin-bottom:23px;font-size:28px;line-height:1.5}.case-section p{margin-bottom:16px;line-height:1.9}.case-section p:last-child{margin-bottom:0}blockquote{border-left:3px solid var(--blue);color:#264583;background:#f0f4ff;margin:24px 0;padding:18px 24px;font-size:19px;line-height:1.8}.role-list>div{border-bottom:1px solid var(--line);grid-template-columns:95px 1fr;gap:20px;padding:19px 0;display:grid}.role-list b{font-size:14px}.role-list p{font-size:15px}.small-note{margin-top:18px;color:#75808e!important;font-size:12px!important}.decision{gap:22px;margin-bottom:28px;display:flex}.decision-number{background:var(--blue);color:#fff;border-radius:4px;flex-shrink:0;place-items:center;width:32px;height:32px;font-size:14px;display:grid}.decision h3{margin-bottom:12px;font-size:20px}.decision p{font-size:15px}.change{border:1px solid var(--line);color:#566272;background:var(--soft);align-items:center;gap:14px;padding:12px 15px;font-size:12px;display:flex}.change b{color:var(--blue)}.reflection{background:var(--soft);margin:25px 0;padding:26px 28px}.reflection h3{margin-bottom:13px;font-size:19px}.reflection p,.reflection li{font-size:15px}.reflection span{color:var(--muted);margin-top:12px;font-size:12px;display:block}.reflection ul{margin:0;padding-left:20px}.reflection li{color:#586472;margin:9px 0}.next-project{margin:48px 0 var(--sy);background:var(--ink);color:#fff;transition:background .25s,transform .35s var(--ease),box-shadow .35s;border-radius:8px;padding:28px 32px;display:block}.next-project strong>span{transition:transform .3s var(--ease)}.next-project:hover strong>span{transform:translate(6px)}.next-project>span{color:#aab6c7;font-size:12px}.next-project strong{justify-content:space-between;margin-top:10px;font-size:27px;font-weight:500;display:flex}.next-project:hover{background:#233853;transform:translateY(-2px);box-shadow:0 14px 30px #16202e26}.flow{background:var(--soft);flex-wrap:wrap;align-items:center;gap:14px;margin:22px 0;padding:18px 22px;font-size:13px;display:flex}.flow b{color:var(--blue)}.timeline article{border-bottom:1px solid var(--line);gap:24px;padding:24px 0;display:flex}.timeline article>span{color:var(--blue);padding-top:3px;font-size:12px}.timeline h3{margin-bottom:10px;font-size:20px}.timeline p{font-size:15px}@media (min-width:1500px){.hero{padding-top:90px;padding-bottom:96px}}@media (max-width:1000px){.wrap{padding-inline:32px}.hero{grid-template-columns:1fr 230px;gap:32px}.hero h1{font-size:44px}.portrait-wrap{height:220px}.project-body{padding:24px}.project h3{font-size:25px}.browser-stage{padding:25px 20px 0}.project-meta{letter-spacing:.5px;font-size:10px}.about{gap:42px}.case-section{grid-template-columns:145px 1fr}.brand-sub{display:none}.header-inner{padding-inline:32px}:root{--sy:64px;--sy-sm:52px}}@media (max-width:700px){:root{--sy:44px;--sy-sm:36px;--header-h:64px}.wrap,.header-inner{padding-inline:22px}.brand{gap:8px;font-size:14px}.monogram{font-size:26px}nav{gap:18px;font-size:13px}.nav-resume{padding:7px 10px}.nav-resume span{display:none}.hero{grid-template-columns:1fr;gap:30px}.hero h1{letter-spacing:-1.5px;font-size:40px}.hero .eyebrow{letter-spacing:0;font-size:11px}.hero-desc{font-size:15px}.hero-desc .desktop{display:none}.identity{border-top:0;border-left:3px solid var(--blue);align-items:center;gap:16px;padding:13px 15px;display:flex;transform:none}.identity-top{display:none}.portrait-wrap{flex-shrink:0;width:54px;height:68px}.identity-bottom{flex:1;align-items:center;margin:0}.identity-bottom strong{font-size:18px}.identity-bottom div>span{font-size:10px}.section-heading{margin-bottom:23px;display:block}.section-heading h2,.about h2,.contact h2{font-size:27px}.section-heading>p{margin-top:10px;font-size:13px}.eyebrow{font-size:11px}.project{grid-template-columns:1fr;margin-bottom:24px}.browser-stage{padding:22px 22px 0}.browser-stage>img{height:225px}.project-body{padding:23px}.project-meta{margin-bottom:17px;font-size:11px}.project h3{font-size:27px}.project-lead{font-size:16px}.project-body>p:not(.project-lead){font-size:14px}.project-bottom{margin-top:18px}.ppt-stage{min-height:240px;padding:34px 25px 45px}.image-note{font-size:10px;bottom:13px;left:25px}.about{grid-template-columns:1fr;gap:28px}.principles>div{gap:20px}.contact{border-radius:8px;margin:0 22px 32px;padding:32px 22px}.contact-row{display:block}.contact-row>div{margin-top:24px}.contact-row>div>p{font-size:13px}.contact h2 br{display:none}footer{flex-wrap:wrap;padding:20px 22px 25px;font-size:11px}footer a:nth-child(2){flex-basis:100%;order:3}.case{padding-top:25px}.case-head{padding:28px 0}.case-head h1{font-size:38px}.case-subtitle{font-size:18px}.case-visual>img{max-height:340px}.ppt-detail>img{max-height:none}.case-visual figcaption{padding:11px 14px;font-size:11px}.case-facts{grid-template-columns:1fr;gap:13px;padding:22px 0}.case-facts>div{justify-content:space-between;align-items:center;gap:14px;display:flex}.case-facts span{margin:0}.case-facts strong{font-size:14px}.case-section{grid-template-columns:1fr;gap:15px}.section-label{padding:0}.case-section h2{margin-bottom:17px;font-size:24px}.case-section p{font-size:15px}.case-section blockquote{padding:15px 18px;font-size:17px}.role-list>div{grid-template-columns:70px 1fr;gap:13px}.decision{gap:14px}.decision h3{font-size:18px;line-height:1.6}.change{flex-direction:column;align-items:start;gap:5px}.change b{transform:rotate(90deg)}.reflection{padding:21px}.next-project{margin:32px 0 var(--sy);padding:22px}.next-project strong{font-size:24px}.timeline article{gap:17px}.timeline h3{font-size:18px}.flow{gap:10px;padding:16px}.text-link{margin-left:18px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}[data-reveal]{opacity:1!important;translate:none!important}.project:hover,.primary:hover,.next-project:hover,.project:hover img,.project:hover .round-arrow{transform:none!important}.project:hover .ppt-stage img{transform:rotate(-2deg)!important}}@media print{.header,footer,.button,.next-project,.back,.skip{display:none}[data-reveal]{opacity:1!important;translate:none!important}.case-section{break-inside:avoid}.wrap{max-width:none;padding:0}.hero{padding-top:0}.project{break-inside:avoid}}.reveal-ready [data-reveal]{opacity:0;transition:opacity .8s var(--ease),translate .8s var(--ease),transform .35s var(--ease),box-shadow .35s,border-color .35s,background .25s;translate:0 24px}.reveal-ready [data-reveal].is-visible{opacity:1;translate:none}.reveal-ready .principles>[data-reveal]:nth-child(2),.reveal-ready .timeline>[data-reveal]:nth-child(2),.reveal-ready .project-ppt[data-reveal]{transition-delay:80ms}.reveal-ready .principles>[data-reveal]:nth-child(3),.reveal-ready .timeline>[data-reveal]:nth-child(3){transition-delay:.16s}.reveal-ready [data-reveal].is-visible:hover{transition-delay:0s}.notfound{min-height:calc(100vh - var(--header-h) - 90px);padding-top:var(--sy);padding-bottom:var(--sy);flex-direction:column;justify-content:center;max-width:1000px;display:flex}.notfound-code{letter-spacing:-.04em;color:#0000;-webkit-text-stroke:2px var(--blue);margin:-8px 0 20px;font-size:clamp(96px,16vw,184px);font-weight:800;line-height:1}.notfound h1{letter-spacing:-1px;font-size:clamp(30px,4vw,44px)}.notfound-desc{max-width:34em;margin:16px 0 30px}.notfound-links{grid-template-columns:1fr 1fr;gap:16px;margin:52px 0 0;padding:0;list-style:none;display:grid}.notfound-links a{border:1px solid var(--line);transition:border-color .25s,transform .35s var(--ease),box-shadow .35s;border-radius:8px;padding:20px 22px;display:block}.notfound-links a:hover{border-color:#9eaedd;transform:translateY(-3px);box-shadow:0 12px 28px #16202e10}.notfound-links a>span{letter-spacing:1px;color:var(--muted);font-size:11px;display:block}.notfound-links strong{justify-content:space-between;margin-top:6px;font-size:18px;font-weight:600;display:flex}.notfound-links strong>span{color:var(--blue);transition:transform .3s var(--ease)}.notfound-links a:hover strong>span{transform:translate(4px)}@media (max-width:700px){.notfound{min-height:0}.notfound-links{grid-template-columns:1fr;margin-top:36px}}@media (prefers-reduced-motion:reduce){.notfound-links a:hover,.notfound-links a:hover strong>span{transform:none!important}}
