:root{--gold:#d1a027;--blue:#0a68a3;--ink:#11120f;--paper:#f8f8f4;--line:#d9d9d1;--soft:#ecece6;--shadow:12px 12px 30px rgba(18,24,23,.10),-8px -8px 20px rgba(255,255,255,.92);--sans:"Montserrat","Noto Sans TC","Noto Sans JP","Noto Sans KR",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#e7e7e2;color:var(--ink);font-family:var(--sans);font-weight:300}button,select,a{font:inherit}button{color:inherit}.prototype{min-height:100vh;padding-top:38px}.utility{position:fixed;z-index:100;top:0;left:0;right:0;height:38px;background:#171816;color:#fff;display:flex;align-items:center;justify-content:center;gap:7px;font-size:10px;letter-spacing:.1em;text-transform:uppercase}.utility button{border:1px solid #4b4c47;background:transparent;color:#bfc0bb;min-width:34px;height:24px;padding:0 8px;cursor:pointer}.utility button:hover,.utility button.on{background:#fff;color:#111}.utility span{opacity:.6;margin-left:8px}.utility em{width:1px;height:16px;background:#555;margin:0 8px}.site-shell{width:100%;max-width:1600px;margin:auto;background:var(--paper);overflow:hidden;min-height:100vh;transition:width .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s}.prototype.desktop .site-shell{width:min(1440px,100%)}.prototype.tablet .site-shell{width:min(820px,100%);box-shadow:0 24px 80px #686862}.prototype.phone .site-shell{width:min(390px,100%);box-shadow:0 24px 80px #686862}.prototype.phone header nav,.prototype.tablet header nav,.prototype.phone .contact-pill{display:none}.prototype.phone .menu-btn,.prototype.tablet .menu-btn{display:flex}
header{position:absolute;z-index:50;width:min(100%,1600px);height:96px;display:flex;align-items:center;padding:0 clamp(24px,5vw,80px);justify-content:space-between;transition:.35s}header.scrolled{position:fixed;top:38px;background:rgba(248,248,244,.88);backdrop-filter:blur(16px);height:74px;border-bottom:1px solid rgba(0,0,0,.08)}.mark{display:flex;align-items:center;text-decoration:none;line-height:1}.mark img{display:block;width:145px;height:auto;mix-blend-mode:multiply;transition:transform .3s}.mark:hover img{transform:translateY(-2px)}nav{display:flex;gap:34px}nav button{border:0;background:transparent;font-size:12px;cursor:pointer;position:relative;padding:12px 0}nav button:after{content:"";position:absolute;left:0;bottom:5px;width:100%;height:1px;background:var(--blue);transform:scaleX(0);transform-origin:right;transition:transform .3s}nav button:hover:after{transform:scaleX(1);transform-origin:left}.header-actions{display:flex;align-items:center;gap:12px}.header-actions select{border:0;background:transparent;font-weight:700;font-size:11px;padding:10px;cursor:pointer}.contact-pill,.primary{border:0;background:var(--blue);color:#fff;min-height:46px;padding:0 20px;font-size:11px;font-weight:700;letter-spacing:.05em;cursor:pointer;box-shadow:4px 5px 0 rgba(10,104,163,.15);transition:.25s}.contact-pill:hover,.primary:hover{transform:translate(-2px,-2px);box-shadow:7px 8px 0 rgba(10,104,163,.18)}.arrow{display:inline-block;margin-left:20px;font-size:16px;transition:transform .25s}.contact-pill:hover .arrow,.primary:hover .arrow,a:hover .arrow,button:hover>.arrow{transform:translate(3px,-3px)}.menu-btn{display:none;border:0;background:transparent;flex-direction:column;gap:5px;cursor:pointer;align-items:flex-end}.menu-btn span{display:block;width:26px;height:1px;background:#111}.menu-btn i{font-style:normal;font-size:8px;text-transform:uppercase;letter-spacing:.1em}
.hero{position:relative;min-height:900px;height:100vh;padding:180px clamp(24px,7vw,112px) 80px;display:grid;grid-template-columns:1.04fr .96fr;align-items:center;overflow:hidden}.hero-copy{position:relative;z-index:3}.eyebrow,.index{font-size:10px;font-weight:700;letter-spacing:.18em;color:var(--blue);text-transform:uppercase}.hero h1{font-size:clamp(60px,8.1vw,130px);line-height:.86;letter-spacing:-.065em;margin:35px 0 42px;display:flex;flex-direction:column;font-weight:300}.hero h1 span{font-weight:300}.hero h1 strong{font-weight:700;color:var(--gold);margin-left:7vw;white-space:nowrap}.hero .lead{max-width:560px;font-size:clamp(14px,1.4vw,19px);line-height:1.8;margin-left:7vw}.hero-buttons{display:flex;align-items:center;gap:30px;margin:38px 0 0 7vw}.primary{padding:0 26px}.text-link{border:0;border-bottom:1px solid #bbb;background:transparent;padding:14px 0;cursor:pointer;font-size:11px;font-weight:700}.text-link span{margin-left:20px}.hero-object{position:relative;height:min(620px,70vh);margin-left:-8%;transform:rotate(-2deg)}.gold-disc{position:absolute;width:58%;aspect-ratio:1;border-radius:50%;background:var(--gold);right:2%;top:4%;box-shadow:20px 28px 50px rgba(209,160,39,.24),inset -9px -9px 22px rgba(125,88,5,.17),inset 8px 8px 18px rgba(255,240,181,.5)}.blue-block{position:absolute;width:48%;height:42%;background:var(--blue);left:7%;bottom:12%;box-shadow:20px 26px 44px rgba(10,104,163,.22),inset -9px -9px 18px rgba(0,48,80,.2),inset 8px 8px 16px rgba(90,180,232,.18)}.white-tile{position:absolute;width:46%;aspect-ratio:1;background:#f5f5f0;right:8%;bottom:2%;box-shadow:var(--shadow);display:flex;flex-direction:column;justify-content:space-between;padding:9%;font-size:clamp(18px,3vw,48px)}.white-tile b:last-child{align-self:flex-end;color:var(--blue)}.white-tile span{font-weight:300;color:var(--gold);font-size:34px}.wave-field,.contact-wave{position:absolute;left:-5%;right:-5%;height:40%;top:34%;z-index:5;display:flex;flex-direction:column;justify-content:center;transform:rotate(-5deg);pointer-events:none}.wave-field i,.contact-wave i{display:block;height:18px;border-top:1px solid rgba(10,104,163,.35);border-radius:50% 35% 50% 35%;transform:skewX(-15deg);margin-top:-7px}.wave-field i:nth-child(even){transform:skewX(20deg) translateX(4%)}.object-label{position:absolute;right:0;bottom:0;font-size:8px;font-weight:700;letter-spacing:.2em;writing-mode:vertical-rl}.scroll-cue{position:absolute;bottom:34px;left:clamp(24px,5vw,80px);font-size:8px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;display:flex;align-items:center;gap:14px}.scroll-cue span{width:42px;height:1px;background:#111}
.work-section,.services{padding:140px clamp(24px,5vw,80px)}.work-section{background:#fff}.section-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:70px}.section-head h2,.about h2,.location h2,.contact h2{font-size:clamp(42px,6vw,88px);letter-spacing:-.055em;line-height:.96;margin:22px 0 0}.section-head>p{max-width:450px;font-size:14px;line-height:1.75;margin:0}.filters{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:36px;overflow-x:auto}.filters button{border:0;background:transparent;white-space:nowrap;padding:14px 18px;cursor:pointer;font-size:11px;position:relative}.filters button span{font-size:8px;color:#999;margin-right:10px}.filters button:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:3px;background:var(--blue);transform:scaleX(0);transition:.3s}.filters button.active{font-weight:700}.filters button.active:after{transform:scaleX(1)}.masonry{columns:3 280px;column-gap:22px}.project-card{width:100%;display:inline-block;margin:0 0 30px;padding:0;border:0;background:transparent;text-align:left;cursor:pointer;break-inside:avoid;animation:cardIn .5s both}.project-card .art{transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s}.project-card:hover .art{transform:translateY(-7px);box-shadow:12px 18px 36px rgba(20,30,25,.16)}.art{position:relative;overflow:hidden;background:#eee;min-height:280px}.tall .art{height:590px}.wide .art{height:380px}.short .art{height:320px}.art>span{position:absolute;left:18px;bottom:16px;font-size:7px;letter-spacing:.15em;font-weight:700}.art i{position:absolute;display:block}.art-sora{background:#e7ddc2}.art-sora i:nth-child(1){width:72%;aspect-ratio:1;border-radius:50%;background:var(--gold);top:10%;left:14%;box-shadow:inset -18px -12px 30px #a8760d}.art-sora i:nth-child(2){width:48%;height:44%;background:var(--blue);left:0;bottom:10%;mix-blend-mode:multiply}.art-sora i:nth-child(3){width:50%;height:38%;background:#f4f1e8;right:0;bottom:0;box-shadow:var(--shadow)}.art-grid{background:#0a68a3}.art-grid i:nth-child(1){inset:12%;border:1px solid rgba(255,255,255,.55);background:repeating-linear-gradient(90deg,transparent 0 39px,rgba(255,255,255,.3) 40px),repeating-linear-gradient(0deg,transparent 0 39px,rgba(255,255,255,.3) 40px)}.art-grid i:nth-child(2){width:28%;height:45%;background:var(--gold);left:22%;top:25%;box-shadow:12px 14px 0 rgba(0,0,0,.15)}.art-grid i:nth-child(3){width:28%;aspect-ratio:1;border-radius:50%;background:#f7f4e9;right:20%;top:20%}.art-garden{background:#f3f1e8}.art-garden:before,.art-garden:after{content:"";position:absolute;border-radius:50%;filter:blur(1px)}.art-garden:before{width:70%;height:90%;background:repeating-radial-gradient(ellipse at center,transparent 0 8px,rgba(10,104,163,.5) 9px 10px);left:5%;top:5%;transform:rotate(25deg)}.art-garden:after{width:38%;aspect-ratio:1;background:var(--gold);right:4%;bottom:8%;mix-blend-mode:multiply}.art-mori{background:#142e25}.art-mori i:nth-child(1){inset:8% 12%;background:#e9e5d6;box-shadow:0 18px 40px #07130f}.art-mori i:nth-child(2){width:50%;height:20%;background:var(--gold);left:20%;top:22%}.art-mori i:nth-child(3){width:42%;aspect-ratio:1;border-radius:50%;background:var(--blue);right:8%;bottom:20%}.art-mori>span{color:#fff}.art-kinetica{background:var(--gold)}.art-kinetica i:nth-child(1),.art-kinetica i:nth-child(2){width:55%;height:26%;background:#10110f;left:22%;top:20%;transform:rotate(24deg)}.art-kinetica i:nth-child(2){background:#fff;top:51%;transform:rotate(-24deg)}.art-commons{background:#deded5}.art-commons i:nth-child(1){width:35%;height:70%;background:var(--blue);left:10%;top:15%;box-shadow:10px 13px 18px rgba(0,0,0,.18)}.art-commons i:nth-child(2){width:35%;height:48%;background:#fff;right:10%;bottom:15%;box-shadow:var(--shadow)}.art-commons i:nth-child(3){width:18%;aspect-ratio:1;border-radius:50%;background:var(--gold);right:18%;top:15%}.art-field{background:#f1efe6}.art-field:before{content:"FIELD / NOTES";position:absolute;font-size:clamp(42px,7vw,100px);font-weight:700;letter-spacing:-.08em;left:4%;top:9%;color:var(--blue);line-height:.75;width:70%}.art-field i:nth-child(1){width:35%;height:80%;right:8%;top:10%;background:repeating-linear-gradient(0deg,var(--gold) 0 2px,transparent 2px 11px);transform:skewX(-12deg)}.art-echo{background:#090a09}.art-echo i:nth-child(1),.art-echo i:nth-child(2),.art-echo i:nth-child(3){border:2px solid var(--gold);border-radius:50%;inset:15% 10%}.art-echo i:nth-child(2){inset:25% 5%;border-color:var(--blue);transform:rotate(55deg)}.art-echo i:nth-child(3){inset:8% 32%;border-color:#fff;transform:rotate(-35deg)}.art-echo>span{color:#fff}.project-meta{display:grid;grid-template-columns:36px 1fr auto;gap:12px;padding:16px 4px 0}.project-meta>span{font-size:8px;color:var(--blue);font-weight:700}.project-meta h3{font-size:15px;margin:0 0 5px;font-weight:700}.project-meta p{font-size:9px;margin:0;color:#777}.project-meta .arrow{font-size:14px}.all-work{margin:70px auto 0;display:flex;align-items:center;border:0;border-bottom:1px solid #111;background:transparent;padding:15px 0;font-weight:700;font-size:12px;cursor:pointer}.all-work>span{font-size:8px;margin-left:8px;color:#777}
.services{background:var(--soft)}.service-list{border-top:1px solid #c9c9c0}.service-list article{display:grid;grid-template-columns:50px 80px 1fr 1fr auto;align-items:center;gap:25px;padding:34px 6px;border-bottom:1px solid #c9c9c0;transition:.35s}.service-list article:hover{background:#fff;padding-left:24px;padding-right:24px}.service-list article>span{font-size:9px;color:var(--blue);font-weight:700}.service-icon{width:58px;height:58px;background:#e9e9e2;box-shadow:6px 6px 13px #c6c6be,-6px -6px 13px #fff;position:relative}.service-icon i:first-child{position:absolute;width:22px;height:22px;background:var(--gold);left:9px;top:9px}.service-icon i:last-child{position:absolute;width:22px;height:22px;border-radius:50%;background:var(--blue);right:8px;bottom:8px}.service-list h3{font-size:clamp(19px,2.1vw,30px);letter-spacing:-.03em}.service-list p{font-size:12px;line-height:1.7;max-width:360px}.about{padding:130px clamp(24px,7vw,112px);display:grid;grid-template-columns:.9fr 1.1fr;gap:8vw;background:#fff;align-items:center}.about-visual{position:relative;min-height:570px}.portrait{height:520px;background:#e8e7df;position:relative;overflow:hidden;box-shadow:18px 20px 38px rgba(22,28,25,.12)}.portrait-shape{position:absolute;width:55%;height:74%;background:var(--blue);left:22%;bottom:0;border-radius:48% 48% 8% 8% / 24% 24% 3% 3%;box-shadow:inset -18px -12px 35px rgba(0,33,55,.25)}.portrait-shape:before{content:"";position:absolute;width:48%;aspect-ratio:1;background:var(--gold);border-radius:50%;left:25%;top:-22%;box-shadow:inset -8px -7px 15px rgba(95,63,0,.2)}.portrait span{position:absolute;top:18px;left:20px;font-size:8px;line-height:1.7;font-weight:700;letter-spacing:.12em}.mini-card{position:absolute;right:-7%;bottom:5%;width:180px;height:150px;background:#f7f7f2;box-shadow:var(--shadow);padding:25px;display:flex;flex-direction:column;justify-content:space-between}.mini-card b{font-size:48px;color:var(--gold)}.mini-card span{font-size:8px;letter-spacing:.12em;line-height:1.5;color:var(--blue);font-weight:700}.about-copy h2{font-size:clamp(42px,5.5vw,82px)}.about-copy>p:not(.index){max-width:600px;line-height:1.85;font-size:14px;margin:40px 0}.principles{display:flex;gap:8px}.principles span{border:1px solid var(--line);padding:12px 16px;font-size:8px;font-weight:700;letter-spacing:.13em}.location{display:grid;grid-template-columns:.7fr 1.3fr;min-height:590px;background:var(--blue);color:#fff}.location-copy{padding:80px clamp(24px,5vw,80px);display:flex;flex-direction:column}.location .index{color:#fff;opacity:.7}.location h2{color:var(--gold);margin:auto 0 25px}.location-copy>p:not(.index){font-size:11px;line-height:1.7;max-width:320px}.location a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.4);align-self:flex-start;padding:14px 0;font-size:11px;font-weight:700}.location iframe{width:100%;height:100%;border:0;filter:grayscale(1) contrast(.9);mix-blend-mode:luminosity}.contact{min-height:540px;padding:100px 24px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden;background:#f8f7f1}.contact>p{font-size:9px;letter-spacing:.22em;font-weight:700;color:var(--blue);z-index:2}.contact h2{font-size:clamp(48px,8vw,118px);max-width:1000px;z-index:2}.contact>a{z-index:2;background:var(--gold);color:#fff;text-decoration:none;padding:18px 25px;font-size:11px;font-weight:700;box-shadow:8px 9px 0 rgba(209,160,39,.18)}.contact-wave{top:40%;opacity:.55}.contact-wave i{border-color:rgba(10,104,163,.25);height:24px}footer{min-height:170px;padding:40px clamp(24px,5vw,80px);display:grid;grid-template-columns:1fr 1fr 1fr;align-items:end;background:#10110f;color:#fff}footer>p{font-size:9px;letter-spacing:.1em;line-height:1.7;color:#aaa;text-align:center}footer>div{display:flex;justify-content:flex-end;gap:20px;font-size:9px}footer a{color:#fff;text-decoration:none}
.menu-overlay{position:fixed;z-index:200;inset:0;background:var(--gold);padding:50px clamp(25px,8vw,100px);display:flex;flex-direction:column;animation:overlayIn .45s}.menu-overlay .mark{position:absolute;top:50px;background:#fff;padding:8px 12px;box-shadow:8px 9px 0 rgba(0,0,0,.08)}.menu-close,.modal-close{position:absolute;right:40px;top:35px;border:0;background:transparent;font-size:11px;font-weight:700;cursor:pointer}.menu-overlay>div{margin:auto 0;display:flex;flex-direction:column}.menu-overlay>div button{border:0;background:transparent;text-align:left;font-size:clamp(45px,8vw,110px);font-weight:700;letter-spacing:-.06em;cursor:pointer}.menu-overlay>div button:hover{color:#fff}.menu-overlay>div span{font-size:10px;margin-right:25px;letter-spacing:0}.menu-overlay>p{font-size:9px;line-height:1.7;font-weight:700;color:#fff}.modal{position:fixed;z-index:180;inset:38px 0 0;background:#f7f7f2;overflow-y:auto;display:grid;grid-template-columns:1.15fr .85fr;animation:overlayIn .45s}.modal-close{z-index:4}.modal-art{min-height:calc(100vh - 38px);padding:6vw;background:#e6e6df}.modal-art .art{height:100%;min-height:600px;box-shadow:20px 25px 60px rgba(20,25,22,.14)}.modal-copy{padding:130px 7vw 80px;display:flex;flex-direction:column}.modal-copy h2{font-size:clamp(50px,6vw,90px);line-height:.95;letter-spacing:-.06em;margin:25px 0 auto}.modal-copy>div{border-top:1px solid var(--line);margin-top:70px}.modal-copy article{display:grid;grid-template-columns:120px 1fr;gap:20px;border-bottom:1px solid var(--line);padding:22px 0}.modal-copy article b{font-size:10px}.modal-copy article p{font-size:11px;line-height:1.7;margin:0}.modal-copy>button{align-self:flex-start;margin-top:35px;border:0;border-bottom:1px solid #111;background:transparent;padding:12px 0;font-size:11px;font-weight:700;cursor:pointer}

footer .mark{justify-self:start}footer .mark img{width:130px}.transparent-mark img{mix-blend-mode:normal;filter:none}
body[data-mode="living"]{--paper:#fbfaf2;--soft:#efeee4;--shadow:16px 16px 30px rgba(55,48,25,.11),-8px -8px 22px #fff}body[data-mode="living"] .hero{grid-template-columns:.9fr 1.1fr}body[data-mode="living"] .hero h1{font-size:clamp(58px,7vw,112px)}body[data-mode="living"] .hero-object{transform:rotate(2deg)}body[data-mode="living"] .project-card .art,body[data-mode="living"] .service-icon,body[data-mode="living"] .white-tile{border-radius:3px}body[data-mode="living"] .services{background:#ece9da}body[data-mode="lab"]{--paper:#fff;--soft:#e9edf0}body[data-mode="lab"] .hero{grid-template-columns:1.2fr .8fr}body[data-mode="lab"] .hero h1{font-size:clamp(68px,9vw,145px)}body[data-mode="lab"] .hero h1 strong{color:var(--blue);margin-left:0}body[data-mode="lab"] .hero-object{transform:rotate(-8deg) scale(1.08)}body[data-mode="lab"] .gold-disc{border-radius:0;clip-path:polygon(50% 0,100% 100%,0 100%)}body[data-mode="lab"] .blue-block{transform:rotate(18deg)}body[data-mode="lab"] .masonry{columns:4 230px}body[data-mode="lab"] .project-card:nth-child(even){transform:translateY(50px)}
@keyframes cardIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes overlayIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@media(max-width:900px){header{height:78px}header nav,.contact-pill{display:none}.menu-btn{display:flex}.hero{min-height:820px;height:auto;grid-template-columns:1fr;padding-top:150px}.hero-copy{z-index:8}.hero-object{position:absolute;width:58%;height:52%;right:-7%;bottom:8%;opacity:.72}.hero .lead{max-width:460px}.section-head{grid-template-columns:1fr}.masonry{columns:2 240px}.service-list article{grid-template-columns:35px 68px 1fr auto}.service-list article>p{display:none}.about{grid-template-columns:1fr}.about-visual{width:75%;order:2}.location{grid-template-columns:1fr}.location iframe{height:480px}.modal{grid-template-columns:1fr}.modal-art{min-height:60vh}.modal-copy{min-height:75vh}footer{grid-template-columns:1fr;gap:30px;text-align:center}footer .mark{align-items:center}footer>div{justify-content:center}}
@media(max-width:600px){.prototype{padding-top:38px}.utility{justify-content:flex-start;padding:0 8px;overflow-x:auto}.utility span{display:none}.utility em{margin:0 2px}.site-shell{width:100%!important}.hero{padding:125px 22px 60px;min-height:760px;display:block}.hero h1{font-size:55px;margin-top:26px}.hero h1 strong{margin-left:0}.hero .lead,.hero-buttons{margin-left:0}.hero .lead{font-size:13px;max-width:90%}.hero-buttons{align-items:flex-start;flex-direction:column;gap:8px}.hero-object{height:300px;width:70%;right:-10%;bottom:5%;opacity:.5}.scroll-cue{display:none}.work-section,.services{padding:95px 20px}.section-head{margin-bottom:40px}.section-head h2{font-size:46px}.filters{margin-right:-20px}.masonry{columns:1}.tall .art{height:470px}.wide .art{height:300px}.service-list article{grid-template-columns:28px 56px 1fr auto;gap:12px;padding:26px 0}.service-icon{width:48px;height:48px}.service-list h3{font-size:18px}.about{padding:90px 20px}.about h2{font-size:44px}.about-visual{width:92%;min-height:480px}.portrait{height:430px}.mini-card{right:-7%;width:145px;height:125px}.location-copy{min-height:480px}.location iframe{height:350px}.contact{min-height:470px}.contact h2{font-size:52px}.modal{top:38px}.modal-art{padding:60px 20px 20px;min-height:55vh}.modal-art .art{min-height:430px}.modal-copy{padding:70px 20px}.modal-copy h2{font-size:48px}.modal-copy article{grid-template-columns:1fr}.modal-close{right:20px;top:20px}footer{padding:55px 20px}.menu-overlay{padding:35px 20px}.menu-close{right:20px;top:25px}.menu-overlay .mark{top:30px}.menu-overlay>div button{font-size:52px}}
