:root{--paper:#eeede9;--ink:#171717;--muted:#686862;--line:#cccac3;--blue:#29209f}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Helvetica Neue",Arial,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:6px}button:disabled{opacity:.35;cursor:default}img{display:block;width:100%;height:auto}button{background:none;border:0;padding:0}main{min-height:70vh}.skip{position:fixed;top:-70px;left:16px;padding:14px;background:#fff;z-index:100}.skip:focus{top:12px}.site-header{display:flex;align-items:center;gap:40px;justify-content:space-between;padding:24px 4.5%;border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:20}.wordmark{font-size:25px;font-weight:600;letter-spacing:-1px;display:flex;align-items:baseline;gap:13px}.wordmark span{font-size:11px;font-weight:400;letter-spacing:2px}.site-header nav{display:flex;gap:34px;margin-left:auto;font-size:13px}.site-header nav a{padding:7px 0}.site-header nav a.active{border-bottom:1px solid}.language{font-size:12px;border-left:1px solid var(--line);padding-left:30px;min-width:61px}.wrap{max-width:1640px;margin:auto;padding:0 4.5%}.hero{padding:70px 0 60px;display:grid;grid-template-columns:1.2fr .8fr;gap:7%;align-items:end}.eyebrow{text-transform:uppercase;font-size:10px;letter-spacing:1.5px;line-height:1.8;color:var(--muted);margin:0 0 28px}.hero h1{font-size:clamp(55px,7.4vw,112px);line-height:.97;font-weight:500;letter-spacing:-5px;margin:0}.hero-copy{max-width:440px;padding-bottom:5px}.hero-copy p{font-size:17px;line-height:1.65;margin:0 0 28px;color:#4b4b46}.text-link{display:inline-flex;gap:22px;align-items:center;font-size:12px;padding-bottom:7px;border-bottom:1px solid currentColor}.hero-copy .text-link{margin-right:22px}.section-top{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:21px 0 30px;gap:24px}.section-top h2{font-size:12px;letter-spacing:1.2px;font-weight:500;text-transform:uppercase;margin:0}.filters{display:flex;gap:24px;font-size:11px;flex-wrap:wrap}.filters button{padding:4px 0;color:var(--muted);border-bottom:1px solid transparent}.filters button.active{color:var(--ink);border-color:var(--ink)}.work-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:28px;row-gap:48px;padding-bottom:85px}.project-card{min-width:0}.project-image{aspect-ratio:1.6;background:#d9d9d3;overflow:hidden;position:relative}.project-image img{height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1)}.project-card:hover .project-image img{transform:scale(1.035)}.image-arrow{position:absolute;bottom:18px;right:20px;display:grid;place-items:center;width:35px;height:35px;background:var(--paper);font-size:21px;transition:transform .25s}.project-card:hover .image-arrow{transform:translate(3px,-3px)}.project-info{display:flex;justify-content:space-between;align-items:start;gap:14px;padding-top:17px}.project-info h3{font-size:23px;font-weight:500;letter-spacing:-.5px;margin:0 0 6px}.project-info p{font-size:11px;line-height:1.6;color:var(--muted);margin:0}.project-year{font-size:11px;color:var(--muted);padding-top:6px}.portkeys-art{height:100%;background:#1b1b1c;color:#f5f4ed;display:flex;flex-direction:column;justify-content:space-between;padding:7%;position:relative;overflow:hidden}.portkeys-art:after{content:"";position:absolute;width:50%;height:85%;border:1px solid #494a48;right:-10%;bottom:-25%;transform:rotate(-24deg)}.portkeys-art small{font-size:10px;letter-spacing:2.4px;color:#adada7;z-index:1}.portkeys-art strong{font-size:clamp(34px,5.2vw,81px);font-weight:400;line-height:.95;letter-spacing:-3px;z-index:1}.portkeys-art em{font-size:12px;line-height:1.6;font-weight:400;font-style:normal;color:#bfbfb6;z-index:1}.approach{padding:65px 0 85px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 2fr;gap:30px}.approach h2{font-size:11px;font-weight:500;letter-spacing:1.2px;text-transform:uppercase;margin:0}.approach p{font-size:clamp(25px,3.2vw,47px);line-height:1.28;letter-spacing:-1.2px;margin:0;font-weight:400}.approach .small{font-size:14px;line-height:1.8;letter-spacing:0;max-width:600px;margin:25px 0}.site-footer{background:var(--ink);color:var(--paper);padding:65px 4.5% 25px}.footer-top{display:flex;justify-content:space-between;align-items:end;gap:30px;padding-bottom:70px}.footer-top p{font-size:clamp(28px,4.5vw,67px);line-height:1.1;letter-spacing:-2px;margin:0}.footer-top>a{font-size:16px;border-bottom:1px solid #70706a;padding:8px 0;white-space:nowrap}.footer-bottom{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #41413c;padding-top:21px;font-size:10px;letter-spacing:.2px;color:#b5b5ab}.privacy{color:#b5b5ab}.case-top{padding:38px 0 34px}.back{font-size:11px;color:var(--muted)}.case-intro{display:grid;grid-template-columns:1.3fr .7fr;gap:9%;padding:25px 0 55px}.case-intro h1{font-size:clamp(53px,7vw,104px);line-height:1;letter-spacing:-4px;font-weight:500;margin:0 0 18px}.case-intro .subtitle{font-size:18px;line-height:1.55;color:var(--muted);margin:0;max-width:620px}.case-meta{margin:0;display:grid;grid-template-columns:1fr 2fr;gap:14px 20px;align-content:start;padding-top:10px;font-size:11px;line-height:1.7}.case-meta dt{color:var(--muted)}.case-meta dd{margin:0}.case-hero{margin-bottom:0;background:#ddd}.case-hero img{width:100%}.case-hero .portkeys-art{aspect-ratio:2.3}.case-hero .portkeys-art strong{font-size:clamp(60px,10vw,150px)}.story{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding:65px 0}.story h2,.contribution h2{font-size:11px;text-transform:uppercase;letter-spacing:1.3px;color:var(--muted);font-weight:400;margin:0 0 20px}.story p{font-size:17px;line-height:1.8;margin:0;max-width:640px}.gallery{display:grid;gap:24px;padding-bottom:45px}.gallery button{display:block;width:100%;background:#e1e0db;text-align:left;overflow:hidden;position:relative}.gallery .zoom-note{position:absolute;bottom:16px;right:18px;background:#eeede9de;padding:7px 9px;font-size:10px;opacity:0;transition:opacity .2s}.gallery button:hover .zoom-note,.gallery button:focus-visible .zoom-note{opacity:1}.contribution{padding:60px 0 65px;border-top:1px solid var(--line)}.contribution-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}.contribution-grid article{padding-top:18px;border-top:1px solid var(--line)}.contribution-grid span{font-size:10px;color:var(--muted)}.contribution-grid h3{font-size:18px;font-weight:500;margin:25px 0 16px;line-height:1.3}.contribution-grid p{font-size:13px;line-height:1.8;color:#55554e}.reference-links{display:flex;gap:25px;flex-wrap:wrap;padding:0 0 15px}.reference-note{font-size:11px;color:var(--muted);line-height:1.7;margin:8px 0 45px;max-width:700px}.next-case{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:45px 0 70px;border-top:1px solid var(--line)}.next-case small{font-size:11px;color:var(--muted)}.next-case a{font-size:clamp(30px,4vw,58px);font-weight:400;letter-spacing:-1.5px}.about-intro{padding:70px 0;max-width:1040px}.about-intro h1{font-size:clamp(56px,8vw,110px);line-height:1.02;letter-spacing:-4px;font-weight:500;margin:0 0 35px}.about-intro>p{font-size:21px;line-height:1.65;max-width:800px}.about-table{padding:20px 0 75px}.about-row{display:grid;grid-template-columns:1fr 2fr 1fr;gap:30px;border-top:1px solid var(--line);padding:25px 0;font-size:13px;line-height:1.7}.about-row h2{font-size:11px;text-transform:uppercase;letter-spacing:1px;margin:0;font-weight:400;color:var(--muted)}.about-row p{margin:0}.about-row .date{color:var(--muted);text-align:right}.about-links{display:flex;gap:28px;flex-wrap:wrap;margin-top:30px}dialog{width:100vw;height:100dvh;max-width:none;max-height:none;border:0;padding:20px 32px;background:#181818f7;color:white;inset:0;margin:0}dialog::backdrop{background:#171717}dialog[open]{display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:15px}.lightbox-controls,.lightbox-bottom{width:100%;display:flex;justify-content:space-between;align-items:center;font-size:12px;gap:20px}.lightbox-controls button,.lightbox-bottom button{padding:10px 0}#full-image{width:100%;height:calc(100dvh - 145px);object-fit:contain}.no-scroll{overflow:hidden}.empty{padding:60px 0;font-size:20px}.site-header nav a:hover,.text-link:hover{color:var(--blue)}body:has(dialog[open]){overflow:hidden}
@media(min-width:1700px){.site-header,.site-footer{padding-left:calc((100vw - 1492px)/2);padding-right:calc((100vw - 1492px)/2)}}
@media(max-width:800px){.site-header{padding:20px 5%;gap:18px}.wordmark{font-size:23px}.wordmark span{display:none}.site-header nav{gap:20px;font-size:12px}.language{padding-left:18px;min-width:46px}.wrap{padding:0 5%}.hero{padding:50px 0 42px;grid-template-columns:1fr;gap:30px}.hero h1{letter-spacing:-3px;font-size:clamp(54px,10vw,78px)}.hero-copy{max-width:570px}.hero-copy p{font-size:15px;margin-bottom:20px}.eyebrow{margin-bottom:21px}.work-grid{gap:34px 18px;padding-bottom:55px}.project-info h3{font-size:20px}.project-info p{font-size:10px}.image-arrow{bottom:12px;right:12px;width:29px;height:29px;font-size:17px}.portkeys-art strong{font-size:40px}.portkeys-art small{font-size:8px;letter-spacing:1px}.portkeys-art em{font-size:9px}.section-top{align-items:start;flex-direction:column;gap:17px}.filters{gap:22px}.approach{padding:45px 0;grid-template-columns:1fr;gap:25px}.approach p{font-size:29px}.site-footer{padding:45px 5% 25px}.footer-top{align-items:start;flex-direction:column;padding-bottom:50px}.footer-top p{font-size:42px}.footer-top>a{font-size:14px}.footer-bottom{flex-wrap:wrap;gap:15px 25px}.footer-bottom>*{min-width:40%}.case-intro{grid-template-columns:1fr;gap:25px;padding-bottom:35px}.case-intro h1{font-size:65px;letter-spacing:-3px}.case-intro .subtitle{font-size:16px}.case-meta{grid-template-columns:100px 1fr;font-size:11px;gap:9px 18px}.case-hero .portkeys-art{aspect-ratio:1.7}.case-hero .portkeys-art strong{font-size:75px}.story{padding:35px 0;grid-template-columns:1fr;gap:30px}.story p{font-size:15px}.gallery{gap:16px}.gallery .zoom-note{opacity:1;font-size:9px;padding:5px 7px;bottom:9px;right:9px}.contribution{padding:35px 0}.contribution-grid{grid-template-columns:1fr 1fr;gap:20px}.contribution-grid h3{font-size:16px;margin:18px 0 12px}.contribution-grid p{font-size:12px}.about-intro{padding:50px 0}.about-intro h1{font-size:66px;letter-spacing:-3px}.about-intro>p{font-size:17px}.about-row{grid-template-columns:1fr;gap:10px}.about-row .date{text-align:left}.about-row h2{margin-bottom:5px}.next-case{padding:30px 0 50px}.next-case a{font-size:35px}dialog{padding:14px 18px}}
@media(max-width:480px){.site-header nav{gap:15px;font-size:11px}.site-header{gap:13px}.language{font-size:11px;padding-left:13px}.work-grid{grid-template-columns:1fr;gap:34px}.project-info h3{font-size:23px}.project-info p{font-size:11px}.project-image .portkeys-art strong{font-size:65px}.portkeys-art small{font-size:9px}.portkeys-art em{font-size:11px}.hero h1{font-size:56px}.hero-copy .text-link{margin-right:16px;font-size:11px}.case-intro h1{font-size:53px}.case-hero .portkeys-art strong{font-size:60px}.contribution-grid{grid-template-columns:1fr}.footer-bottom{font-size:9px}.footer-top>a{white-space:normal;word-break:break-word}.case-meta{grid-template-columns:83px 1fr}.next-case a{font-size:28px}.about-intro h1{font-size:55px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}