@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400&family=Noto+Serif+TC:wght@300;400;500&family=Noto+Sans+TC:wght@300;400;500&display=swap');
:root{--paper:#faf9f6;--ink:#24231f;--muted:#77756f;--line:#dedbd4;--sans:'Noto Sans TC',sans-serif;--serif:'Noto Serif TC',serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--paper);color:var(--ink);font:300 13px var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;background:none;border:0}a:focus-visible,button:focus-visible,summary:focus-visible{outline:1px solid var(--ink);outline-offset:6px}img{display:block;max-width:100%}figure{margin:0}
.site-header{min-height:116px;padding:24px 5%;display:flex;align-items:center;justify-content:space-between;gap:32px;border-bottom:1px solid var(--line)}.brand{display:inline-flex;flex-direction:column;align-items:flex-start;gap:9px;white-space:nowrap}.brand>span{font:400 32px/1.2 var(--serif);letter-spacing:7px}.brand i{display:none}.brand small{font:400 8px/1.5 var(--sans);letter-spacing:2.4px}.site-header nav{display:flex;gap:30px;font-size:11px;letter-spacing:1px}.site-header nav a{padding:14px 0}.site-header nav a:hover{opacity:.5}.language{display:flex;align-items:center;gap:8px;font:400 10px var(--sans);letter-spacing:.5px;white-space:nowrap}.language a{display:inline-flex;align-items:center;min-height:44px;color:#8c8880}.language a[aria-current=page]{color:var(--ink)}.language>span{color:#c5c0b8;font-size:9px}.menu-button{display:none}
main{--gutter:7%;max-width:1760px;margin:auto}.hero{margin:0 var(--gutter);padding-bottom:34px;border-bottom:1px solid var(--line)}.hero-copy{padding:72px 0 42px}.hero h1{font:300 34px/1.7 var(--sans);letter-spacing:5px;margin:0 0 18px}.hero h1 br{display:none}.hero h1 span{font-style:normal}.hero .intro{font:300 12px/2.2 var(--sans);letter-spacing:1px;color:#69665f;margin:0}.hero .intro br{display:none}.arrow-link{display:table;width:auto;margin:30px 0 0 auto;padding-bottom:7px;border-bottom:1px solid #b7b2a8;font:300 12px/1.8 var(--sans);letter-spacing:1px;color:#66635c;transition:opacity .2s}.arrow-link:hover{opacity:.55}.arrow-link span{display:none}.hero-photo{width:100%;overflow:hidden}.hero-photo img{width:100%;height:auto;aspect-ratio:1.72;object-fit:cover;filter:grayscale(1) sepia(.18) brightness(.96)}
.section{margin:0 var(--gutter);padding:90px 0;border-bottom:1px solid var(--line)}.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:26px}.section h2{font:400 14px/2 var(--sans);letter-spacing:1px;margin:0}.section-heading>.arrow-link{font-size:9px;letter-spacing:1px;border:0;margin:0;padding:0;color:var(--muted)}.service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:49px 28px}.service-grid article{min-width:0}.services summary{display:block;position:relative;cursor:pointer;list-style:none}.services summary::-webkit-details-marker{display:none}.mini-photo{aspect-ratio:4/3;overflow:hidden;background:#e8e5dd}.mini-photo img{width:100%;height:100%;object-fit:cover;filter:saturate(.5);transition:transform .8s}.services summary:hover img{transform:scale(1.025)}.service-grid h3{font:300 12px/1.9 var(--sans);letter-spacing:.6px;margin:18px 24px 0 0}.service-grid p{font:300 12px/2.2 var(--sans);color:#69665f;letter-spacing:.3px;margin:18px 0 0;max-width:560px}.service-more{position:absolute;bottom:2px;right:0;color:var(--muted);font-size:15px}.service-more::before{content:'+'}.services details[open] .service-more::before{content:'−'}
.shop{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.shop-label{font:300 9px/1.8 var(--sans);color:var(--muted);letter-spacing:2px;margin:0 0 20px}.shop-copy h2{margin-bottom:20px}.shop-copy>p:last-child{font:300 14px/2.6 var(--sans);letter-spacing:1px;color:#5d5a54;margin:0}.shop-status{position:relative}.shop-status img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:grayscale(1) sepia(.18)}.shop-status-copy{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:18px;color:var(--muted)}.shop-status-copy span{font-size:11px;letter-spacing:1px}.shop-status-copy small{font-size:9px;letter-spacing:1px}.look-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.photo-frame{aspect-ratio:3/4;overflow:hidden;background:#e8e5dd}.photo-frame img{width:100%;height:100%;object-fit:cover;filter:saturate(.5)}.look-grid p{font:300 11px/1.8 var(--sans);letter-spacing:.6px;margin:18px 0 0}.project-disclosure>summary{font:300 12px/1.8 var(--sans);letter-spacing:1px;color:#66635c;width:fit-content;cursor:pointer}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:49px 28px;margin-top:32px}.project-poster>div{aspect-ratio:3/4;background:#eeece6;padding:8%;display:flex;align-items:center;justify-content:center}.project-poster img{width:100%;height:100%;object-fit:contain}.project-poster figcaption{font:300 11px/1.8 var(--sans);margin-top:18px;letter-spacing:.6px}
.about{display:grid;grid-template-columns:1.4fr 1fr;gap:12%;padding-block:85px 95px;border-bottom:0;align-items:center}.about h2{margin-bottom:28px}.about p{font:300 14px/2.6 var(--sans);letter-spacing:1px;color:#5d5a54;margin:0 0 20px}.about blockquote{font:300 20px/2.6 var(--sans);letter-spacing:2px;color:#77756f;margin:0;padding:35px 0 35px 15%;border-left:1px solid var(--line)}
footer{border-top:1px solid var(--line);padding:40px 5%;display:flex;flex-wrap:wrap;gap:28px;align-items:center;font-size:10px;line-height:2;letter-spacing:.5px}footer .brand>span{font-size:27px}footer .brand small{font-size:7px}footer p{font-size:9px;color:var(--muted);letter-spacing:1px;margin:0 auto 0 0}footer em{font-size:9px;font-style:normal;color:var(--muted)}footer>a:not(.brand):hover{opacity:.55}
html[lang=en] .hero h1{letter-spacing:2px;font-family:'Jost',var(--sans)}html[lang=en] .about p{letter-spacing:.4px}html[lang=en] .about blockquote{letter-spacing:1px}
@media(min-width:1760px){.site-header,footer{max-width:1760px;margin-inline:auto}}
@media(max-width:1050px){.site-header nav{gap:18px;font-size:10px}.site-header{gap:20px}.hero h1{font-size:30px}.about{gap:6%}footer{gap:20px}}
@media(max-width:850px){.site-header{display:grid;grid-template-columns:1fr auto auto;padding:22px 6%;min-height:100px;gap:20px}.site-header .brand{grid-column:1;grid-row:1}.menu-button{display:block;grid-column:2;grid-row:1;font-size:10px;letter-spacing:1px;min-height:44px;padding:0}.language{grid-column:3;grid-row:1}.site-header nav{display:none;grid-column:1/-1;grid-row:2;flex-wrap:wrap;gap:8px 24px}.site-header.open nav{display:flex}.site-header nav a{padding:8px 0}.hero h1{font-size:28px;letter-spacing:3px}.about{grid-template-columns:1fr}.about blockquote{border-left:0;border-top:1px solid var(--line);padding:40px 0 0;margin-top:20px;font-size:18px}.about blockquote br{display:none}}
@media(max-width:700px){main{--gutter:6%}.brand>span{font-size:26px;letter-spacing:5px}.brand small{font-size:7px;letter-spacing:1.5px;margin:0}.hero-copy{padding:52px 0 32px}.hero h1{font-size:27px;letter-spacing:3px;margin-bottom:16px}.hero h1 br{display:block}.hero .intro{font-size:11px;letter-spacing:.5px}.hero .intro br{display:block}.hero-photo img{aspect-ratio:1.35;object-position:70% center}.hero{padding-bottom:24px}.section{padding:65px 0}.section-heading{margin-bottom:24px}.service-grid{gap:35px 18px}.service-grid h3{font-size:11px;letter-spacing:0;margin-top:14px}.service-grid p{font-size:11px;line-height:2}.mini-photo{aspect-ratio:4/5}.shop{grid-template-columns:1fr;gap:30px}.shop-copy>p:last-child{letter-spacing:.5px}.shop-status img{aspect-ratio:4/3}.look-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:29px 15px}.look-grid p,.project-poster figcaption{font-size:10px;margin-top:12px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:29px 15px}.about{padding-block:66px 72px}.about p{font-size:14px;letter-spacing:.5px}.about blockquote{font-size:16px}.arrow-link{font-size:12px;margin-top:32px}footer{padding:30px 6%;gap:20px}footer p{width:calc(100% - 120px);font-size:8px}footer em{width:100%}html[lang=en] .hero h1{font-size:26px;letter-spacing:1px}html[lang=en] .service-grid h3{line-height:1.8}}
@media(max-width:370px){.site-header{gap:12px}.brand small{letter-spacing:1px}.hero h1{font-size:25px}.service-grid{grid-template-columns:1fr}.mini-photo{aspect-ratio:4/3}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

.shop-entry { display: block; text-decoration: none; color: inherit; }
.shop-entry:focus-visible { outline: 2px solid #776a5e; outline-offset: 5px; }
.shop-entry:hover .shop-status-copy span:first-child { text-decoration: underline; text-underline-offset: .25em; }
