@import "https://fonts.googleapis.com/css2?family=Hind:wght@300;400;500;600&family=Roboto:wght@400;500&family=Work+Sans:wght@400;500;600;700;800&display=swap";:root{--bg:#fff;--ink:#222;--muted:gray;--rule:#3a3a3a;--ph:#ececec;--footer:#bdbdbd;--gap:24px}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--muted);-webkit-font-smoothing:antialiased;margin:0;padding:0;font-family:Hind,Helvetica Neue,Arial,PingFang SC,Microsoft YaHei,sans-serif;font-size:16px;line-height:1.7}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}.site-header{padding:0}.header-inner{justify-content:space-between;align-items:center;gap:20px;max-width:1400px;margin:0 auto;padding:34px 5% 18px;display:flex}.brand img{width:auto;height:58px}.menu-toggle{appearance:none;cursor:pointer;background:0 0;border:0;flex-direction:column;justify-content:center;gap:5px;margin:-10px;padding:10px;display:inline-flex}.menu-toggle span{background:var(--ink);height:2px;transition:transform .3s,opacity .3s,width .3s;display:block}.menu-toggle span:first-child{width:10px}.menu-toggle span:nth-child(2){width:20px}.menu-toggle span:nth-child(3){width:30px}body.menu-open .menu-toggle span:first-child{width:30px;transform:translateY(7px)rotate(45deg)}body.menu-open .menu-toggle span:nth-child(2){opacity:0}body.menu-open .menu-toggle span:nth-child(3){width:30px;transform:translateY(-7px)rotate(-45deg)}.site-header,.page-main,.site-footer{transition:transform .38s cubic-bezier(.4,0,.2,1)}body.page-stack-right .site-header,body.page-stack-right .page-main,body.page-stack-right .site-footer{transform:translate(-320px)}.site-header{z-index:110;position:relative}.menu-backdrop{opacity:0;z-index:90;background:#00000059;transition:opacity .35s;position:fixed;inset:0}body.menu-open .menu-backdrop{opacity:1}.slide-menu{z-index:100;background:#000;outline:none;flex-direction:column;gap:48px;width:min(100vw,320px);height:100dvh;padding:44px 36px;transition:transform .38s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;right:0;transform:translate(100%)}body.menu-open .slide-menu{transform:translate(0)}.slide-menu:before,.slide-menu:after{content:"";opacity:0;background:#696969;height:100vh;transition:opacity .3s;position:absolute;bottom:0;left:0}.slide-menu:before{width:16px;top:20px}.slide-menu:after{width:8px;top:10px}body.menu-open .slide-menu:before,body.menu-open .slide-menu:after{opacity:1}.slide-logo img{width:100px;height:21px}.slide-nav{flex-direction:column;gap:8px;display:flex}.slide-link{letter-spacing:.5px;color:#fff;opacity:0;font-family:Work Sans,Hind,sans-serif;font-size:26px;font-weight:400;line-height:50px;transition:opacity .4s,transform .4s cubic-bezier(.22,.61,.36,1),color .2s;display:inline-block;position:relative;transform:translate(30px)}.slide-link:before{content:"";transform-origin:0;background:#fff;width:100%;height:2px;transition:transform .3s;position:absolute;bottom:8px;left:0;transform:scaleX(0)}.slide-link:hover{color:#fff}.slide-link:hover:before{transform:scaleX(1)}.slide-link.active{color:#fff}body.menu-open .slide-link:first-child{opacity:1;transition-delay:.12s;transform:translate(0)}body.menu-open .slide-link:nth-child(2){opacity:1;transition-delay:.22s;transform:translate(0)}.mobile-dropdown{display:none}.page-main{max-width:1400px;margin:0 auto;padding:20px 5% 0}.portfolio-grid{gap:var(--gap);grid-template-columns:repeat(3,1fr);display:grid}.thumb{aspect-ratio:4/3;background:var(--ph);display:block;position:relative;overflow:hidden}.thumb-media,.thumb-media img{width:100%;height:100%;position:absolute;inset:0}.thumb-media img{object-fit:cover;transition:transform .5s}.thumb:hover .thumb-media img{transform:scale(1.03)}.thumb-ph{background:var(--ph);position:absolute;inset:0}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.thumb{animation:.55s cubic-bezier(.22,.61,.36,1) both fadeUp}.thumb-overlay{z-index:10;text-align:center;opacity:0;background:#fff;justify-content:center;align-items:center;padding:24px;transition:opacity .25s ease-in-out;display:flex;position:absolute;inset:15px}.thumb:hover .thumb-overlay{opacity:.9}.thumb-title{text-transform:uppercase;letter-spacing:1px;color:#222;opacity:0;font-family:Roboto,Helvetica Neue,Arial,PingFang SC,Microsoft YaHei,sans-serif;font-size:14px;font-style:normal;font-weight:500;line-height:30px;transition:opacity .15s cubic-bezier(.25,.46,.45,.94),transform .15s cubic-bezier(.25,.46,.45,.94);transform:translateY(15px)}.thumb:hover .thumb-title{opacity:1;transition:opacity .3s cubic-bezier(.455,.03,.515,.955) .1s,transform .3s cubic-bezier(.455,.03,.515,.955) .1s;transform:translateY(0)}.detail{padding-bottom:40px}.detail-head{padding:30px 0 50px}.detail-title{color:#232323;margin:0 0 16px;font-family:Work Sans,Hind,sans-serif;font-size:26px;font-weight:500;line-height:1.3}.detail-subtitle{letter-spacing:2px;color:#5a5a5a;align-items:center;gap:12px;margin:0;font-family:Work Sans,Hind,sans-serif;font-size:15px;font-weight:500;display:flex}.detail-rule{background:var(--rule);flex:none;width:30px;height:2px;display:inline-block}.detail-gallery{display:block}.detail-gallery figure{text-align:center;max-width:1200px;margin:0 auto 90px}.detail-gallery img{width:auto;max-width:100%;height:auto;margin:0 auto}.detail-gallery figcaption{color:var(--muted);margin-top:14px;font-size:18px;line-height:1.5}.detail-gallery video{width:100%;max-width:1200px;height:auto;margin:0 auto;display:block}.work-nav{letter-spacing:.5px;color:var(--ink);border-top:1px solid #f0f0f0;flex-wrap:wrap;justify-content:space-between;gap:30px;margin-top:20px;padding:30px 0 90px;font-family:Work Sans,Hind,sans-serif;font-size:15px;font-weight:500;display:flex}.work-nav a{color:var(--ink);transition:color .2s}.work-nav a:hover{color:#9a9a9a}.work-nav-side{flex:none}.about{max-width:1100px;padding-bottom:80px}.about-avatar{max-width:800px;margin:0 0 40px}.about-avatar img{background:var(--ph);width:100%;height:auto}.about-name{text-transform:none;letter-spacing:-.5px;color:#222;margin:0 0 18px;font-family:Work Sans,Hind,Helvetica Neue,Arial,PingFang SC,Microsoft YaHei,sans-serif;font-size:25px;font-style:normal;font-weight:400;line-height:38px}.about-cn,.about-en{color:#4a4a4a;margin:0 0 18px;font-size:16px;line-height:1.9}.about-en{color:#333;font-weight:500}.about-actions{flex-wrap:wrap;gap:16px;margin-top:28px;display:flex}.pill-btn{appearance:none;letter-spacing:1px;color:#4a4a4a;cursor:pointer;background:0 0;border:1px solid #4a4a4a;border-radius:999px;padding:9px 26px;font-family:Work Sans,Hind,sans-serif;font-size:13px;font-weight:500;transition:background .2s,color .2s;display:inline-block}.pill-btn:hover{color:#fff;background:#4a4a4a}.qr-lightbox{z-index:200;background:#0009;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.qr-lightbox[hidden]{display:none}.qr-lightbox-inner{text-align:center;background:#fff;border-radius:6px;max-width:85vw;padding:24px;position:relative}.qr-lightbox-inner img{width:320px;max-width:100%;height:auto;margin:0 auto}.qr-caption{color:#666;margin:14px 0 0;font-size:14px}.qr-close{color:#888;cursor:pointer;background:0 0;border:0;font-size:28px;line-height:1;position:absolute;top:6px;right:10px}.qr-close:hover{color:#222}.site-footer{background:#ebebeb;padding:45px 0}.footer-inner{max-width:1400px;margin:0 auto;padding:0 5%}.copyright{color:#888;text-align:center;margin:0;font-size:14px}@media (width<=900px){.portfolio-grid{grid-template-columns:repeat(2,1fr);gap:16px}}@media (width<=960px){.slide-menu,.menu-backdrop{display:none}body.page-stack-right .site-header,body.page-stack-right .page-main,body.page-stack-right .site-footer{transform:none}.mobile-dropdown{opacity:0;background:#fff;max-height:0;transition:max-height .3s ease-out,opacity .3s ease-out,transform .3s ease-out;display:block;overflow:hidden;transform:translateY(-10px)}body.menu-open .mobile-dropdown{opacity:1;max-height:200px;transform:translateY(0)}.mobile-link{color:#222;text-align:left;border-bottom:1px solid #eee;padding:6px 5% 6px 7%;font-family:Work Sans,Hind,sans-serif;font-size:20px;font-weight:400;line-height:40px;display:block}.mobile-link.active{color:#222}.mobile-link:hover{color:#000}}@media (width<=600px){.header-inner{padding:24px 5% 12px}.portfolio-grid{grid-template-columns:1fr}.detail-head{padding:20px 0 34px}.detail-gallery figure{margin-bottom:54px}}@media (prefers-reduced-motion:reduce){.thumb{animation:none}.thumb-media img{transition:none}.thumb:hover .thumb-media img{transform:none}.thumb-overlay{transition:opacity 10ms linear}.thumb-title{transition:opacity 10ms linear;transform:none}.site-header,.page-main,.site-footer{transition:none}body.page-stack-right .site-header,body.page-stack-right .page-main,body.page-stack-right .site-footer{transform:none}.menu-backdrop,.slide-menu,.slide-link{transition-duration:10ms}.mobile-dropdown{transition:none;transform:none}}
