:root{--paper:#f5f3ee;--paper-2:#ebe8e0;--ink:#242522;--muted:#777770;--line:rgba(36,37,34,.18);--accent:#96866d;--serif:"Noto Serif SC",serif;--sans:"DM Sans",sans-serif;--ease:cubic-bezier(.22,.61,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans),sans-serif;-webkit-font-smoothing:antialiased;transition:background .45s,color .45s}body.dark{--paper:#20211f;--paper-2:#2a2b28;--ink:#eeeae1;--muted:#aaa99f;--line:rgba(238,234,225,.2);--accent:#c0ad8d}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}.loader{position:fixed;inset:0;z-index:1000;background:var(--paper);display:grid;place-items:center;transition:opacity .8s var(--ease),visibility .8s}.loader.done{opacity:0;visibility:hidden}.loader-mark{font:500 38px var(--serif);letter-spacing:-.1em;animation:mark 1.25s ease-in-out infinite alternate}.loader i{position:absolute;bottom:0;left:0;height:2px;background:var(--accent);animation:loadline 1.2s var(--ease) forwards}@keyframes mark{to{opacity:.35;transform:translateY(-4px)}}@keyframes loadline{to{width:100%}}
.site-header{height:82px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;position:fixed;z-index:100;inset:0 0 auto;transition:transform .5s var(--ease),background .4s,border-color .4s;border-bottom:1px solid transparent;color:#fff}.site-header.scrolled{color:var(--ink);background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(12px);border-color:var(--line)}.site-header.hidden{transform:translateY(-105%)}.brand{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.16em}.brand-mark{font:500 24px var(--serif);letter-spacing:-.11em}.desktop-nav{display:flex;gap:38px;margin-left:130px}.desktop-nav a,.availability{font-size:11px;letter-spacing:.1em}.desktop-nav a{opacity:.78;transition:opacity .2s}.desktop-nav a:hover{opacity:1}.header-actions{display:flex;gap:25px;align-items:center}.availability{opacity:.8}.availability i{display:inline-block;width:6px;height:6px;margin-right:8px;border-radius:50%;background:#a7b08f}.theme-toggle,.menu-toggle{border:0;background:none;cursor:pointer}.theme-toggle{font-size:19px}.menu-toggle{display:none}.mobile-menu{display:none}
.hero{height:min(850px,100svh);min-height:680px;position:relative;overflow:hidden;color:#fff;background:#292a29}.hero-image{position:absolute;inset:0;overflow:hidden}.hero-image img{width:100%;height:100%;object-fit:cover;object-position:center 47%;transform:scale(1.035);animation:heroenter 2s var(--ease) both;filter:brightness(.65) saturate(.72)}@keyframes heroenter{from{transform:scale(1.12);opacity:.6}to{transform:scale(1.035);opacity:1}}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,17,17,.69),rgba(18,19,18,.14) 72%),linear-gradient(0deg,rgba(10,12,12,.44),transparent 35%)}.hero-copy{position:absolute;top:31%;left:12.3%;max-width:500px}.eyebrow{font-size:9px;letter-spacing:.24em;color:var(--muted);margin:0 0 23px}.eyebrow.light{color:rgba(255,255,255,.68)}h1,h2,h3,p{margin-top:0}.hero h1{font:400 clamp(50px,7.1vw,96px)/1.27 var(--serif);letter-spacing:.04em;margin:0 0 24px}.hero h1 em,h2 em{font-style:normal;color:var(--accent)}.hero h1 em{color:#d9c9ae}.hero-intro{font:400 14px/2 var(--serif);letter-spacing:.1em;color:rgba(255,255,255,.82);margin-bottom:31px}.text-link{display:inline-flex;gap:31px;align-items:center;border-bottom:1px solid var(--line);padding:0 0 12px;font-size:10px;letter-spacing:.1em;transition:gap .3s var(--ease)}.text-link:hover{gap:43px}.text-link span{font-size:16px}.light-link{border-color:rgba(255,255,255,.42)}.hero-note,.hero-scroll,.hero-index{position:absolute;font-size:9px;letter-spacing:.16em;color:rgba(255,255,255,.72)}.hero-note{right:5vw;bottom:43px;display:flex;gap:28px}.hero-scroll{left:5vw;bottom:41px;display:flex;align-items:center;gap:13px}.hero-scroll i{height:1px;width:46px;background:#fff;transform-origin:left;animation:scrollline 1.8s ease-in-out infinite alternate}@keyframes scrollline{to{transform:scaleX(.45)}}.hero-index{right:5vw;top:50%;writing-mode:vertical-rl}.hero-index span{padding:10px 0;opacity:.55}
.section-pad{padding-left:12.3%;padding-right:12.3%}.intro{padding-top:118px;padding-bottom:128px}.section-kicker{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:9px;letter-spacing:.17em;border-top:1px solid var(--line);padding-top:17px}.section-kicker span:last-child{letter-spacing:.08em}.intro-grid{display:grid;grid-template-columns:1.3fr .7fr;align-items:end;margin-top:70px;gap:10%}.intro h2,.compare h2,.about h2,.services h2,.contact h2{font:400 clamp(35px,5vw,64px)/1.48 var(--serif);letter-spacing:.045em;margin:0}.intro-grid>p{max-width:285px;font:12px/2.2 var(--serif);color:var(--muted);margin:0 0 9px}.works{padding-top:26px}.work-heading{display:flex;justify-content:space-between;align-items:end;padding-bottom:50px}.work-heading h2{font:400 27px var(--serif);margin:0}.work-heading .eyebrow{margin-bottom:12px}.project{width:75.4%;margin:0 auto 120px}.project-wide{width:78%}.project-split{width:63%;margin-left:12.3%}.project-reverse{margin-left:auto;margin-right:12.3%}.image-button{display:block;position:relative;overflow:hidden;padding:0;border:0;background:#dad8d1;width:100%;cursor:none;text-align:left}.project-wide .image-button{height:min(70vw,690px)}.project-split .image-button{height:min(61vw,620px)}.image-button img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.2s var(--ease),filter .5s}.project-wide img{object-position:center}.project-split img{object-position:center}.image-button:hover img{transform:scale(1.035);filter:saturate(.88)}.image-wash{position:absolute;inset:0;background:linear-gradient(0deg,rgba(13,14,13,.24),transparent 44%);opacity:0;transition:opacity .5s}.image-button:hover .image-wash{opacity:1}.image-cursor{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.8);width:75px;height:75px;border-radius:50%;background:var(--paper);color:var(--ink);display:grid;place-content:center;text-align:center;font-size:8px;line-height:1.5;letter-spacing:.14em;opacity:0;transition:opacity .35s,transform .35s}.image-button:hover .image-cursor{opacity:1;transform:translate(-50%,-50%) scale(1)}.project-meta{display:grid;grid-template-columns:1fr auto 34px;align-items:end;gap:30px;padding:20px 0 0;border-bottom:1px solid var(--line);padding-bottom:17px}.project-meta h3{font:400 25px var(--serif);margin:9px 0 0}.project-meta p{font-size:11px;color:var(--muted);margin:9px 0 0}.project-meta>span{font-size:9px;letter-spacing:.08em;color:var(--muted);padding-bottom:4px}.project-number{font-size:8px;letter-spacing:.17em;color:var(--muted)}.open-project{border:0;background:none;font-size:19px;cursor:pointer}.project-foot{display:flex;justify-content:space-between;color:var(--muted);font-size:9px;letter-spacing:.16em;padding-top:4px;padding-bottom:116px}
.compare-section{padding-top:38px;padding-bottom:145px;background:var(--paper-2)}.compare-heading{display:flex;align-items:end;justify-content:space-between;margin:66px 0 42px}.compare-heading h2{font-size:clamp(37px,5vw,60px)}.compare-heading>p{color:var(--muted);font:11px/2.1 var(--serif);margin:0 10% 8px 0}.compare{height:clamp(340px,54vw,650px);position:relative;overflow:hidden;background:#a0988d;--split:52%;cursor:ew-resize;touch-action:pan-y}.compare img{display:block;width:100%;height:100%;object-fit:cover}.compare-after{filter:saturate(.78) contrast(.94) sepia(.08)}.compare-before{position:absolute;inset:0 auto 0 0;width:var(--split);overflow:hidden;border-right:1px solid rgba(255,255,255,.85);filter:saturate(.5) brightness(.86)}.compare-before img{width:calc(100vw - 24.6vw);max-width:none;object-position:center}.compare-label{position:absolute;bottom:23px;color:#fff;font-size:8px;letter-spacing:.18em;text-shadow:0 1px 8px #000}.before-label{left:24px}.after-label{right:24px}.compare input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}.compare-handle{position:absolute;left:var(--split);top:50%;transform:translate(-50%,-50%);height:43px;width:43px;border:1px solid #fff;border-radius:50%;display:grid;place-items:center;background:rgba(245,243,238,.12);pointer-events:none;backdrop-filter:blur(4px)}.compare-handle i{height:1px;width:15px;background:white;position:relative}.compare-handle i:before,.compare-handle i:after{content:"";position:absolute;top:-3px;width:1px;height:7px;background:white}.compare-handle i:before{left:0}.compare-handle i:after{right:0}.compare-caption{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.17em;color:var(--muted);margin:16px 0 0}
.about{padding-top:120px;padding-bottom:130px}.about-body{display:grid;grid-template-columns:.8fr 1.2fr;gap:9%;margin-top:80px;align-items:start}.about-mark{font:400 180px/.8 var(--serif);color:var(--paper-2);margin:0;letter-spacing:-.12em}.about h2{font-size:clamp(39px,5.2vw,66px)}.about-copy{max-width:370px;color:var(--muted);font:12px/2.2 var(--serif);margin:31px 0 28px}.about-photo{width:52%;height:480px;margin:100px 0 0 auto;position:relative}.about-photo img{width:100%;height:100%;object-fit:cover;object-position:center 40%}.about-photo span{position:absolute;left:calc(100% + 16px);bottom:6px;white-space:nowrap;writing-mode:vertical-rl;font-size:8px;letter-spacing:.16em;color:var(--muted)}
.services{background:#e8e5dc;padding-top:52px;padding-bottom:125px}.dark .services{background:#2b2c29}.services-title{display:flex;justify-content:space-between;align-items:end;margin:67px 0 55px}.services-title h2{font-size:clamp(42px,5.5vw,70px)}.services-title>p{font:11px/2.1 var(--serif);color:var(--muted);margin:0 8% 9px 0}.service-list{border-top:1px solid var(--line)}.service-list a{display:grid;grid-template-columns:50px 1fr 220px 35px;align-items:center;padding:21px 0;border-bottom:1px solid var(--line);transition:padding .3s var(--ease)}.service-list a:hover{padding-left:10px;padding-right:10px}.service-list span,.service-list small{font-size:8px;letter-spacing:.15em;color:var(--muted)}.service-list b{font:400 18px var(--serif)}.service-list i{font-style:normal;font-size:17px;text-align:right}
.contact{padding-top:56px;padding-bottom:53px;position:relative}.contact>.eyebrow{margin-top:86px}.contact h2{font-size:clamp(47px,7.4vw,95px);line-height:1.35}.contact-link{display:inline-flex;gap:38px;align-items:center;font-size:12px;letter-spacing:.08em;border-bottom:1px solid var(--line);padding-bottom:13px;margin-top:36px}.contact-link span{font-size:19px;transition:transform .25s}.contact-link:hover span{transform:translate(3px,-3px)}.contact-bottom{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:120px;padding-top:15px;color:var(--muted);font-size:8px;letter-spacing:.12em}.site-footer{height:74px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);font-size:8px;letter-spacing:.13em;color:var(--muted)}.site-footer .brand{color:var(--ink)}.site-footer .brand-mark{font-size:19px}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform .9s var(--ease)}.reveal.visible{opacity:1;transform:translateY(0)}.custom-cursor{position:fixed;z-index:150;left:0;top:0;width:64px;height:64px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.8);border-radius:50%;color:#fff;font-size:8px;letter-spacing:.14em;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.7);transition:opacity .2s,transform .2s;mix-blend-mode:difference}.custom-cursor.show{opacity:1;transform:translate(-50%,-50%) scale(1)}.lightbox{position:fixed;inset:0;background:rgba(18,19,18,.97);z-index:300;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .5s,visibility .5s}.lightbox.open{opacity:1;visibility:visible}.lightbox>img{max-width:82vw;max-height:82vh;object-fit:contain;transform:scale(.97);transition:transform .5s var(--ease)}.lightbox.open>img{transform:scale(1)}.lightbox-close,.lightbox-prev,.lightbox-next{position:absolute;background:none;border:0;color:#fff;cursor:pointer}.lightbox-close{right:5vw;top:30px;font-size:36px;font-weight:200}.lightbox-prev,.lightbox-next{top:50%;font-size:25px}.lightbox-prev{left:4vw}.lightbox-next{right:4vw}.lightbox-caption{position:absolute;left:9vw;bottom:39px;color:white;display:flex;gap:18px;align-items:baseline}.lightbox-caption span{font:18px var(--serif)}.lightbox-caption small{color:#aaa;font-size:9px;letter-spacing:.1em}
@media(max-width:800px){.site-header{height:68px;padding:0 6vw}.desktop-nav,.availability{display:none}.header-actions{gap:17px}.menu-toggle{display:flex;flex-direction:column;gap:5px;padding:8px}.menu-toggle span{height:1px;width:20px;background:currentColor;display:block}.mobile-menu{display:flex;position:fixed;inset:0;background:var(--paper);z-index:90;flex-direction:column;justify-content:center;padding:15vw 10vw;gap:22px;transform:translateY(-105%);transition:transform .7s var(--ease)}.mobile-menu.open{transform:translateY(0)}.mobile-menu>a{font:400 32px var(--serif);border-bottom:1px solid var(--line);padding-bottom:14px}.mobile-menu small{float:right;color:var(--muted);font:9px var(--sans);padding-top:16px}.mobile-menu p{font-size:9px;letter-spacing:.12em;color:var(--muted);margin-top:30px}.hero{min-height:620px;height:92svh}.hero-image img{object-position:56% center}.hero-copy{left:8vw;top:34%}.hero h1{font-size:clamp(50px,12vw,78px)}.hero-index{display:none}.hero-note{right:7vw;bottom:28px}.hero-scroll{left:7vw;bottom:28px}.section-pad{padding-left:8vw;padding-right:8vw}.intro{padding-top:78px;padding-bottom:90px}.section-kicker span:last-child{max-width:45%;text-align:right}.intro-grid{grid-template-columns:1fr;gap:25px;margin-top:46px}.intro-grid>p{max-width:360px}.work-heading{padding-bottom:30px}.project,.project-wide,.project-split,.project-reverse{width:84%;margin:0 auto 78px}.project-wide .image-button{height:110vw;max-height:640px}.project-split .image-button{height:105vw;max-height:610px}.project-meta{grid-template-columns:1fr auto;gap:12px}.project-meta>span{grid-row:2;grid-column:1}.project-meta h3{font-size:21px}.open-project{grid-column:2;grid-row:1/3}.project-foot{padding-bottom:80px}.compare-section{padding-top:35px;padding-bottom:85px}.compare-heading{margin:48px 0 28px}.compare-heading>p{margin-right:0}.compare{height:70vw;min-height:270px}.compare-before img{width:84vw}.compare-caption{font-size:7px}.about{padding-top:83px;padding-bottom:90px}.about-body{grid-template-columns:1fr;gap:25px;margin-top:50px}.about-mark{font-size:100px}.about-photo{width:75%;height:400px;margin-top:67px}.services{padding-top:38px;padding-bottom:88px}.services-title{display:block;margin:50px 0 40px}.services-title>p{margin:20px 0 0}.service-list a{grid-template-columns:28px 1fr 26px;gap:8px}.service-list b{font-size:16px}.service-list small{display:none}.contact{padding-top:38px;padding-bottom:37px}.contact>.eyebrow{margin-top:65px}.contact h2{font-size:clamp(45px,12vw,76px)}.contact-bottom{margin-top:90px;gap:18px;font-size:7px}.site-footer{padding:0 6vw}.site-footer>span{display:none}.lightbox>img{max-width:92vw;max-height:75vh}.lightbox-prev{left:2vw}.lightbox-next{right:2vw}.lightbox-caption{left:6vw;bottom:24px}}
@media(max-width:420px){.hero-note{font-size:7px;gap:12px}.hero-scroll{font-size:7px}.compare-heading{display:block}.compare-heading>p{margin-top:20px}.about-photo{width:82%;height:340px}.site-footer a:last-child{font-size:7px}.lightbox-caption{flex-direction:column;gap:5px}}
/* Full archive: each frame keeps its original aspect ratio and remains uncropped. */
.hero-image{background:#343532}
.hero-image img{object-fit:contain;object-position:right center;filter:brightness(.84) saturate(.78)}
.about-photo img{object-fit:contain;background:var(--paper-2)}
.compare img{object-fit:contain;background:#aaa69c}
.compare-before img{object-fit:contain}
.compare-before,.compare-after{filter:none}
.archive-count{font-size:9px;letter-spacing:.12em;color:var(--muted);padding-bottom:6px}
.archive-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:15px}
.category-tabs,.subfolder-tabs{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.category-tab{border:1px solid var(--line);border-radius:40px;background:transparent;padding:11px 17px;font-size:13px;letter-spacing:.04em;white-space:nowrap;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.category-tab sup{margin-left:8px;font:10px var(--sans);opacity:.68}
.category-tab:hover,.category-tab.active{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.archive-search{display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--line);padding:9px 2px;color:var(--muted);min-width:200px}
.archive-search span{font:19px var(--sans)}.archive-search input{font:10px var(--sans);letter-spacing:.05em;color:var(--ink);border:0;outline:0;background:transparent;width:155px}.archive-search input::placeholder{color:var(--muted)}
.subfolder-tabs{padding-top:5px;padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:35px}
.subfolder-tabs[hidden]{display:none}.subfolder-tabs .category-tab{font-size:12px;padding:9px 14px}
.archive-group{padding:30px 0 36px;border-bottom:1px solid var(--line)}
.archive-group-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:18px}
.archive-group-heading h3{font:400 22px var(--serif);margin:0;letter-spacing:.04em}
.archive-group-heading span{font-size:8px;letter-spacing:.1em;color:var(--muted);text-align:right}
.media-grid{columns:3;column-gap:18px}
.media-card{break-inside:avoid;margin:0 0 23px;display:inline-block;width:100%;vertical-align:top}
.media-button{display:block;width:100%;padding:0;border:0;background:var(--paper-2);cursor:zoom-in;overflow:hidden}
.media-button img{display:block;width:100%;height:auto;max-height:78vh;object-fit:contain;transition:transform .8s var(--ease),opacity .4s}
.media-button:hover img{transform:scale(1.018)}
.media-card figcaption{display:flex;justify-content:space-between;gap:10px;align-items:baseline;padding:9px 1px 0}
.media-card figcaption strong{font:400 11px var(--serif);overflow-wrap:anywhere}
.media-card figcaption span{font-size:7px;color:var(--muted);letter-spacing:.04em;text-align:right}
.video-card{width:100%;aspect-ratio:4/3;border:0;background:#2d2e2b;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;cursor:pointer;text-align:center;padding:16px}
.video-card .video-play{width:39px;height:39px;border:1px solid rgba(255,255,255,.6);border-radius:50%;display:grid;place-items:center;font-size:11px;padding-left:2px;transition:background .25s,color .25s}
.video-card:hover .video-play{background:var(--paper);color:var(--ink)}.video-card strong{font:400 12px var(--serif);overflow-wrap:anywhere}.video-card small{font-size:8px;color:rgba(255,255,255,.6);letter-spacing:.15em}
.archive-empty{padding:40px 0;color:var(--muted);font:13px var(--serif)}
.contact-methods{display:flex;gap:40px;flex-wrap:wrap}.contact-methods .contact-link{margin-top:36px}.wechat-link{cursor:pointer;font:12px var(--sans);letter-spacing:.08em;border-top:0;border-left:0;border-right:0;background:transparent}.copy-note{height:16px;color:var(--muted);font-size:9px;margin:12px 0 0}
.lightbox [hidden]{display:none!important}.lightbox>img{object-fit:contain}.lightbox>video{max-width:88vw;max-height:80vh;width:auto;height:auto;background:#111}
@media(max-width:800px){
  .hero-image img{object-position:center}
  .archive-toolbar{align-items:flex-start;flex-direction:column}
  .category-tabs{flex-wrap:nowrap;max-width:100%;overflow-x:auto;padding-bottom:7px;scrollbar-width:none}
  .category-tabs::-webkit-scrollbar{display:none}
  .archive-search{align-self:stretch;min-width:0}.archive-search input{width:100%}
  .subfolder-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:15px}
  .subfolder-tabs::-webkit-scrollbar{display:none}
  .media-grid{columns:2;column-gap:11px}.media-card{margin-bottom:15px}
  .archive-group{padding:23px 0 27px}.archive-group-heading h3{font-size:18px}
  .media-card figcaption{display:block}.media-card figcaption span{display:block;text-align:left;margin-top:4px}
  .contact-methods{display:block}.contact-methods .contact-link{margin-top:26px}
}
@media(max-width:420px){.media-grid{columns:1}.media-button img{max-height:none}.archive-group-heading span{max-width:54%}.archive-count{font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}