:root{--ink:#101010;--paper:#f5f4ef;--fog:#e5e4de;--line:#9b9a94;--white:#fbfaf6}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,'Noto Sans SC',sans-serif}.topbar{height:76px;position:absolute;z-index:10;width:100%;padding:0 3.6vw;display:grid;grid-template-columns:1fr 1fr auto;align-items:center;color:#fff}.brand{color:inherit;text-decoration:none;font-size:21px;font-weight:700;letter-spacing:-1.2px}.brand small{font:9px 'DM Mono',monospace;letter-spacing:1.2px;margin-left:6px}.studio-name,.nav-button,.section-no,.kicker{font:10px 'DM Mono','Noto Sans SC',sans-serif;letter-spacing:.45px;margin:0}.header-actions{display:flex;align-items:center;gap:24px}.language-switcher{display:flex;gap:2px;border:1px solid rgba(255,255,255,.42);padding:2px}.language-button{appearance:none;border:0;background:transparent;color:#aaa9a5;min-width:30px;height:23px;padding:0 6px;cursor:pointer;font:9px 'DM Mono','Noto Sans SC',sans-serif;transition:.2s}.language-button:hover,.language-button.active{background:#fff;color:#101010}.nav-button{border:0;background:transparent;color:inherit;cursor:pointer;padding:7px 0;display:flex;align-items:center;gap:10px}.menu-icon{width:21px;height:14px;display:grid;align-content:space-between}.menu-icon b{display:block;width:100%;border-top:1px solid currentColor}.nav{display:none;position:absolute;right:3.6vw;top:60px;padding:20px 22px;background:#fff;min-width:132px;flex-direction:column;gap:14px}.nav.open{display:flex}.nav a{font-size:12px;color:var(--ink);text-decoration:none}.hero{height:100svh;min-height:650px;background:var(--ink);color:#fff;padding:106px 7.8vw 34px;position:relative;overflow:hidden}.kicker{position:relative;z-index:1}.hero-title{position:absolute;left:7.8vw;bottom:13vh}.hero h1{font-size:clamp(87px,15vw,245px);line-height:.74;letter-spacing:-.105em;margin:0;font-weight:600}.hero h1 em{font-family:Georgia,serif;font-weight:400;letter-spacing:-.1em}.hero-title p{margin:34px 0 0 11px;font-size:13px;line-height:1.7}.hero-bottom{position:absolute;bottom:31px;left:3.6vw;right:3.6vw;border-top:1px solid #484848;padding-top:12px;display:flex;justify-content:flex-end;font:9px 'DM Mono',monospace}.hero-bottom a{color:inherit;text-decoration:none}.about{padding:145px 7.8vw}.about-main{display:grid;grid-template-columns:1.3fr .7fr;gap:10vw;margin-top:130px}.about h2,.approach h2,.contact h2{font-size:clamp(41px,5.3vw,86px);line-height:1.08;letter-spacing:-.075em;font-weight:500;margin:0}.about h2 em,.contact h2 em{font-family:Georgia,'Noto Serif SC',serif;font-weight:400}.about-copy{align-self:end}.about-copy p{font-size:14px;line-height:2;color:#3f3f3b;margin:0 0 30px}
/* 02 / SERVICES — a dark, indexed catalogue */
.services{background:var(--ink);color:var(--white);padding:124px 3.6vw 110px}.services-head{display:grid;grid-template-columns:1fr 1fr;align-items:end;padding:0 4.2vw 92px}.services-head>p:last-child{justify-self:end;margin:0;color:#bebdb8;font:11px/1.7 'DM Mono','Noto Sans SC',sans-serif}.service-row{min-height:172px;border-top:1px solid #60605d;display:grid;grid-template-columns:8% minmax(300px,1.25fr) minmax(230px,.75fr) auto;align-items:center;padding:20px 1.4vw;position:relative;overflow:hidden;transition:background .3s,color .3s}.service-row:last-child{border-bottom:1px solid #60605d}.service-row:before{content:attr(id);position:absolute;right:82px;top:50%;transform:translateY(-48%);font:600 clamp(100px,14vw,210px)/.8 Manrope,sans-serif;letter-spacing:-.13em;color:#fff;opacity:0;transition:opacity .3s}.service-row:hover{background:#f1f0eb;color:var(--ink)}.service-row:hover:before{opacity:.075}.service-row>span{font:10px 'DM Mono',monospace;color:#bbb9b3;align-self:start;margin-top:10px}.service-row h3{font-size:clamp(25px,2.7vw,43px);font-weight:500;letter-spacing:-.07em;line-height:1.04;margin:0;position:relative;z-index:1}.service-row p{font-size:13px;line-height:1.75;max-width:290px;margin:0;color:#c3c2bd;position:relative;z-index:1}.service-row:hover p,.service-row:hover>span{color:#4c4b47}.more-link{color:inherit;text-decoration:none;font:10px 'DM Mono','Noto Sans SC',sans-serif;letter-spacing:.3px;border:1px solid #878682;padding:11px 13px;min-width:70px;text-align:center;position:relative;z-index:1;transition:.25s}.more-link:hover{background:var(--ink);border-color:var(--ink);color:#fff}
/* 03 / APPROACH — three spacious editorial panels */
.approach{background:var(--paper);padding:142px 7.8vw 128px}.approach-title{display:grid;grid-template-columns:1fr 1fr;align-items:start}.approach-title>.section-no{padding-top:12px}.approach h2{justify-self:end;text-align:right;max-width:650px}.approach h2 span{font-family:Georgia,serif;font-style:italic;font-weight:400}.steps{margin-top:122px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}.steps article{min-height:385px;padding:23px 24px 25px;border-left:1px solid var(--ink);position:relative}.steps article:last-child{border-right:1px solid var(--ink)}.steps article:before{content:attr(data-step);position:absolute;right:18px;bottom:12px;font:500 clamp(96px,11vw,165px)/1 Manrope,sans-serif;letter-spacing:-.11em;color:#e0dfd9;z-index:0;pointer-events:none}.steps span{font:10px 'DM Mono',monospace;position:relative;z-index:1}.steps h3{position:absolute;left:24px;bottom:91px;font-size:clamp(26px,2.1vw,35px);font-weight:500;letter-spacing:-.065em;margin:0;z-index:1}.steps p{position:absolute;left:24px;bottom:26px;max-width:220px;font-size:13px;line-height:1.75;margin:0;z-index:1}.statement{background:#171717;color:#fff;overflow:hidden;padding:34px 0;white-space:nowrap}.statement p{display:inline-block;font-size:clamp(37px,6vw,100px);letter-spacing:-.07em;margin:0 35px 0 0;animation:marquee 18s linear infinite}.statement p:nth-child(2){font-weight:400;color:#aaa9a5}@keyframes marquee{to{transform:translateX(-120%)}}.contact{min-height:820px;position:relative;padding:105px 7.8vw 165px;background:var(--ink);color:#f5f4ef}.contact-main{margin:100px 0 0 12vw;padding-bottom:35px}.contact-list{margin-top:58px;max-width:540px;border-top:1px solid #74736e}.contact-list p{display:grid;grid-template-columns:minmax(150px,42%) 1fr;align-items:center;gap:20px;margin:0;padding:13px 0;border-bottom:1px solid #74736e;font-size:12px;line-height:1.4}.contact-list b{font:10px 'DM Mono','Noto Sans SC',sans-serif;letter-spacing:.3px;font-weight:400;color:#c4c3bd}.contact-list span,.contact-list a{color:inherit;text-decoration:none;font-size:12px;justify-self:end;text-align:right}.contact-side{position:absolute;right:6.5vw;top:15%;width:390px;height:360px;overflow:hidden}.contact-side img{position:absolute;width:245%;max-width:none;left:50%;top:56%;transform:translate(-50%,-50%);filter:grayscale(1) invert(1);mix-blend-mode:screen}.contact-side p{position:absolute;left:0;bottom:0;margin:0;color:#c4c3bd;font:9px/1.75 'DM Mono',monospace}footer{position:absolute;left:3.6vw;right:3.6vw;bottom:28px;border-top:1px solid #8b8a85;padding-top:14px;display:flex;justify-content:space-between;font:10px 'DM Mono','Noto Sans SC',sans-serif}footer a{color:inherit;text-decoration:none}html[lang="en"] body{font-family:Manrope,sans-serif}html[lang="zh-TW"] body{font-family:Manrope,'Noto Sans TC',sans-serif}@media(max-width:700px){.topbar{height:63px;padding:0 6vw;grid-template-columns:1fr auto}.studio-name{display:none}.header-actions{gap:12px}.language-switcher{gap:0}.language-button{min-width:27px;padding:0 4px;font-size:8px}.nav{right:6vw;top:50px}.hero{min-height:700px;padding:93px 8vw 30px}.hero-title{left:8vw;bottom:18vh}.hero h1{font-size:26vw}.hero-title p{margin:30px 0 0 4px;font-size:11px}.hero-bottom{left:8vw;right:8vw;font-size:8px}.about{padding:85px 8vw 90px}.about-main{display:block;margin-top:72px}.about h2{font-size:43px}.about-copy{margin-top:58px}.about-copy p{font-size:13px}.services{padding:80px 0}.services-head{padding:0 8vw 56px;display:flex}.services-head>p:last-child{font-size:10px}.service-row{padding:20px 8vw;min-height:184px;grid-template-columns:18% 1fr auto;align-items:start}.service-row:before{display:none}.service-row>span{margin-top:4px}.service-row h3{font-size:25px;line-height:1.1}.service-row p{grid-column:2/3;margin-top:16px;font-size:12px}.more-link{grid-column:3;grid-row:1;padding:8px 9px;min-width:auto;font-size:8px}.approach{padding:88px 8vw}.approach-title{display:block}.approach-title>.section-no{padding:0}.approach h2{justify-self:auto;text-align:right;font-size:44px;margin-top:55px}.steps{display:block;margin-top:72px}.steps article{border-right:1px solid var(--ink);min-height:250px}.steps article:before{font-size:120px;right:18px;bottom:12px}.steps h3{bottom:76px}.steps p{font-size:12px}.statement{padding:24px 0}.statement p{font-size:44px}.contact{min-height:760px;padding:76px 8vw 145px}.contact-main{margin:65px 0 0;padding-bottom:25px}.contact h2{font-size:48px}.contact-list{margin-top:38px}.contact-list p{grid-template-columns:42% 58%;gap:8px}.contact-list p,.contact-list span,.contact-list a{font-size:10px}.contact-list b{font-size:8px}.contact-list span,.contact-list a{white-space:normal}.contact-side{display:block;right:-8vw;top:48%;width:210px;height:210px;opacity:.3}.contact-side img{width:245%}.contact-side p{display:none}footer{left:8vw;right:8vw;flex-wrap:wrap;gap:9px}footer a{width:100%}}