
:root{--black:#050505;--white:#f7f7f5;--text:#1c1c1c;--muted:#a2a2a2;--line:#d7d7d2;--shell:92%;--content:76%}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--white);color:var(--text);font-family:Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}img{display:block;width:100%;height:100%;object-fit:cover}.shell{width:var(--shell);margin:auto;max-width:1760px}.content-shell{width:var(--content);margin:auto;max-width:1440px}.hero{height:100svh;min-height:680px;background:#000;color:#fff;display:grid;grid-template-rows:auto auto 1fr auto;padding:28px 0 26px;position:relative;overflow:hidden}.hero>*:not(.hero-particles){position:relative;z-index:2}.hero-nav{display:grid;grid-template-columns:1fr 1fr auto;align-items:center;font-size:13px;font-weight:600}.menu-button{width:38px;height:28px;border:0;background:none;padding:0;display:flex;flex-direction:column;justify-content:center;gap:8px}.menu-button span{display:block;height:1px;background:#fff}.hero-meta{display:flex;justify-content:space-between;padding-top:50px;font-size:15px;line-height:1.35}.location{text-align:right}.hero-title{display:grid;grid-template-columns:18% 1fr;align-items:end}.edition{padding-bottom:33px}.edition strong{font-size:clamp(60px,8vw,120px);display:block;letter-spacing:-.08em}.edition span{font-size:12px;font-weight:600}.hero h1{font-size:clamp(92px,13.7vw,220px);line-height:.77;letter-spacing:-.087em;margin:0;font-weight:500}.hero-footer{display:flex;justify-content:space-between;border-top:1px solid #333;padding-top:12px;font-size:12px;font-weight:600}.hero-footer div{display:flex;gap:28px}.section{position:relative;padding:34px 0 90px;background:var(--white)}.intro{padding-bottom:0}.section-rule{display:flex;align-items:center;gap:12px;font-size:12px;margin-bottom:65px}.section-rule i{height:1px;flex:1;background:var(--line)}.section-rule b{font-size:12px}.side-label{position:absolute;left:2.5%;top:210px;color:#dededb;font-size:72px;font-weight:600;line-height:1;writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:-.06em}.intro-content h2{font-size:clamp(36px,4.2vw,64px);line-height:1.12;letter-spacing:-.055em;margin:0 0 64px;font-weight:500}.intro-content h2 em,.about-copy h2 em{font-style:normal;color:#999}.intro-info{display:grid;grid-template-columns:225px 1fr 245px;gap:20px;align-items:center}.intro-info img{aspect-ratio:1.15;border-radius:8px;object-position:top}.intro-copy{font-size:15px;line-height:1.45}.corner-button{position:relative;display:grid;place-items:center;width:220px;height:70px;font-size:12px;font-weight:600}.corner-button:before{content:"";position:absolute;inset:0;background:linear-gradient(#222,#222) left top/8px 1px no-repeat,linear-gradient(#222,#222) left top/1px 8px no-repeat,linear-gradient(#222,#222) right top/8px 1px no-repeat,linear-gradient(#222,#222) right top/1px 8px no-repeat,linear-gradient(#222,#222) left bottom/8px 1px no-repeat,linear-gradient(#222,#222) left bottom/1px 8px no-repeat,linear-gradient(#222,#222) right bottom/8px 1px no-repeat,linear-gradient(#222,#222) right bottom/1px 8px no-repeat}.worked-with{border-top:1px solid var(--line);margin-top:90px;padding:40px 0;display:flex;align-items:center;gap:44px;color:#999;overflow:hidden}.worked-with b{color:#222;font-size:12px;white-space:nowrap;flex-shrink:0}.logo-marquee{flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}.logo-track{display:flex;align-items:center;gap:64px;width:max-content;animation:scroll-logos 24s linear infinite}.logo-track img{height:26px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.5;transition:opacity .3s,filter .3s}.logo-track img:hover{filter:none;opacity:1}@keyframes scroll-logos{from{transform:translateX(0)}to{transform:translateX(-50%)}}.featured{padding-bottom:0;padding-top:0}.massive-title{font-size:clamp(72px,8.2vw,132px);line-height:.9;letter-spacing:-.075em;margin:0 0 50px;font-weight:600}.featured-stack{display:block}.featured-stack figure{margin:0 0 60px;position:sticky;top:100px;background:var(--white);box-shadow:0 -30px 60px -20px rgba(0,0,0,.15)}.featured-stack figure figcaption{font-size:12px;font-weight:600;margin-top:14px;letter-spacing:.02em}.featured-stack figure a{display:block;cursor:pointer;border-radius:7px;overflow:hidden}.featured-stack figure img{transition:transform .4s ease;object-fit:contain;height:auto}.featured-stack figure a:hover img{transform:scale(1.04)}.featured-stack figure img{aspect-ratio:auto}.project-caption{font-size:12px;font-weight:600;margin:18px 0 80px}.principles{padding-top:0}.principle-intro{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-bottom:42px}.principle-intro p{font-size:15px}.principle-intro h3{font-size:36px;line-height:1.18;margin:0;font-weight:500}.case-scroll{display:flex;gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:16px;scrollbar-width:thin;max-width:min(1374px,92vw)}.case-scroll::-webkit-scrollbar{height:6px}.case-scroll::-webkit-scrollbar-thumb{background:var(--line);border-radius:10px}.case-item{flex:0 0 auto;scroll-snap-align:start}.case-header{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;margin-bottom:20px;flex-wrap:wrap}.case-title h3{font-size:26px;font-weight:700;margin:0 0 4px}.case-title h3 em{font-style:normal;color:#8b5cf6}.case-title h3 em.accent-orange{color:#e2571c}.case-title h3 em.accent-yellow{color:#ffe800}.case-board.case-board-3{display:flex;flex-direction:column;gap:10px}.cb3-top{display:flex;gap:10px}.cb3-col{display:flex;flex-direction:column;gap:10px}.case-board-3 .cb3-icons{width:336px;height:125px;background:#ffe800}.case-board-3 .cb3-equipment{width:336px;height:261px}.case-board-3 .cb3-pump{width:335px;height:193px}.case-board-3 .cb3-hardhat{width:334px;height:189px}.case-board-3 .cb3-wordmark{width:686px;height:394px;background:#000}.case-board-3 .cb3-browser{width:1373px;height:202px}.case-title p{font-size:13px;font-weight:600;margin:0;color:#555}.case-desc{font-size:14px;line-height:1.5;color:#555;max-width:420px;margin:0}.case-board{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:auto auto;gap:10px;align-items:start}.case-board.case-board-2{display:flex;gap:10px;align-items:flex-start}.case-board-2 .cb2-logo{width:326px;height:433px;flex-shrink:0}.cb2-stack{display:flex;flex-direction:column;gap:10px}.cb2-row{display:flex;gap:10px}.case-board-2 .cb2-icons{width:731px;height:341px}.case-board-2 .cb2-side{width:263px;height:202px}.case-board-2 .cb2-apron{width:303px;height:268px}.case-board-2 .cb2-wide{width:697px;height:261px}.case-board figure{margin:0;border-radius:8px;overflow:hidden;background:#f2f2ee}.case-board{grid-template-columns:333px 326px 317px 325px}.case-board .cb-logo{grid-column:1/3;grid-row:1;height:301px}.case-board .cb-icons{grid-column:3/5;grid-row:1;height:173px;align-self:end}.case-board .cb-phone{grid-column:1;grid-row:2;height:260px;background:#fff}.case-board .cb-subway{grid-column:2;grid-row:2;height:177px}.case-board .cb-badge{grid-column:3;grid-row:2;height:282px}.case-board .cb-swatch{grid-column:4;grid-row:2;height:184px}.portfolio-layout{display:grid;grid-template-columns:2.3fr 1fr;gap:60px 30px}.project img{border-radius:8px;object-fit:cover}.project h3{font-size:12px;margin:18px 0 3px}.project p{font-size:12px;margin:0}.project-main img{aspect-ratio:1918/1075}.project-small img{height:230px}.project-wide{grid-column:1/-1}.project-wide img{aspect-ratio:1420/1000;object-fit:contain;background:#fff}.project-medium{grid-column:2}.project-medium img{aspect-ratio:1.55}.all-work{margin-top:90px}.about-top{display:grid;grid-template-columns:190px 1fr 45%;gap:30px;align-items:start}.mini-stats p{display:grid;grid-template-columns:65px 1fr;font-size:13px}.about-copy h2{font-size:37px;line-height:1.25;letter-spacing:-.05em;margin:0}.about-copy p{font-size:14px;line-height:1.5;margin-top:42px}.social-mini{font-size:12px;margin-top:44px}.about-top>img{aspect-ratio:1.28;border-radius:8px;object-position:top}.facts{display:grid;grid-template-columns:1fr 1fr;margin-top:60px;border-top:1px solid var(--line);border-left:1px solid var(--line)}.facts>*{min-height:165px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:30px}.facts h2{font-size:34px;margin:0}.facts div{display:flex;align-items:end;gap:18px}.facts strong{font-size:78px;line-height:.8;letter-spacing:-.08em}.facts span{font-size:14px}.experience-images{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:90px}.experience-images img{aspect-ratio:1.45;border-radius:8px}.services .massive-title{margin-bottom:55px}.service-row{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:0 0 80px;margin-bottom:65px;border-bottom:1px solid var(--line)}.service-row h3{font-size:38px;margin:0 0 22px;letter-spacing:-.05em}.service-row p{font-size:14px;line-height:1.45;max-width:470px}.service-projects{display:grid;grid-template-columns:1fr 1fr;gap:10px}.service-projects figure{margin:0}.service-projects img{aspect-ratio:1.25;border-radius:8px}.service-projects figcaption{font-size:12px;font-weight:600;line-height:1.3;margin-top:14px}.service-projects figcaption span{font-weight:400}.footer{background:#000;color:#fff;padding:46px 0 28px}.footer-links{display:grid;grid-template-columns:1.4fr repeat(6,1fr);gap:20px;border-bottom:1px solid #333;padding-bottom:16px;font-size:12px;color:#777}.footer-links b{color:#fff}.footer-inner{padding-top:95px}.footer-top{display:flex;justify-content:space-between;align-items:center}.footer-top p{font-size:13px;color:#777}.footer-top h2{font-size:36px;font-weight:500;margin:18px 0}.corner-button.inverse:before{background:linear-gradient(#fff,#fff) left top/8px 1px no-repeat,linear-gradient(#fff,#fff) left top/1px 8px no-repeat,linear-gradient(#fff,#fff) right top/8px 1px no-repeat,linear-gradient(#fff,#fff) right top/1px 8px no-repeat,linear-gradient(#fff,#fff) left bottom/8px 1px no-repeat,linear-gradient(#fff,#fff) left bottom/1px 8px no-repeat,linear-gradient(#fff,#fff) right bottom/8px 1px no-repeat,linear-gradient(#fff,#fff) right bottom/1px 8px no-repeat}.footer h3{font-size:clamp(76px,10.5vw,170px);line-height:.8;letter-spacing:-.075em;margin:65px 0 40px}.footer-image{height:65px;background:linear-gradient(110deg,#f4a36d,#1b0d0b 35%,#ffbd77 73%,#27130d);margin-bottom:30px}.footer-bottom{display:flex;justify-content:space-between;color:#777;font-size:12px}.reveal{opacity:0;transform:translateY(30px);transition:.8s ease}.reveal.show{opacity:1;transform:none}
@media(max-width:900px){:root{--shell:92%;--content:86%}.hero{min-height:620px}.hero-nav{grid-template-columns:1fr auto}.hero-nav>a:nth-child(2){display:none}.hero-title{grid-template-columns:1fr}.edition{display:none}.hero h1{font-size:17vw}.side-label{display:none}.section-rule{margin-bottom:45px}.intro-info{grid-template-columns:160px 1fr}.intro-info .corner-button{grid-column:2}.worked-with{gap:22px}.portfolio-layout{grid-template-columns:1fr 1fr}.project-wide{grid-column:1/-1}.about-top{grid-template-columns:1fr 1fr}.mini-stats{display:none}.about-top>img{grid-column:2}.facts{grid-template-columns:1fr 1fr}.service-row{grid-template-columns:1fr}.footer-links{grid-template-columns:repeat(3,1fr)}.footer-top{align-items:flex-end}}
@media(max-width:620px){:root{--content:90%}.hero-nav,.hero-meta,.hero-footer{font-size:10px}.hero-title{align-items:center}.hero h1{font-size:20vw}.section{padding-bottom:65px}.massive-title{font-size:17vw}.intro-content h2{font-size:9vw}.intro-info{grid-template-columns:1fr}.intro-info img{width:65%}.intro-info .corner-button{grid-column:auto}.worked-with{overflow:hidden}.principle-intro{grid-template-columns:1fr}.principle-intro h3{font-size:28px}.case-scroll{max-width:92vw}.case-item{width:92vw}.case-board{grid-template-columns:1fr}.case-header{flex-direction:column;gap:14px}.case-board .cb-logo{grid-column:1;height:auto;aspect-ratio:678/301}.case-board .cb-icons{grid-column:1;height:auto;aspect-ratio:676/173;align-self:auto}.case-board .cb-phone{grid-column:1;height:auto;aspect-ratio:333/260}.case-board .cb-subway{grid-column:1;height:auto;aspect-ratio:326/177}.case-board .cb-badge{grid-column:1;height:auto;aspect-ratio:317/282}.case-board .cb-swatch{grid-column:1;height:auto;aspect-ratio:325/184}.cb3-top{flex-direction:column}.case-board-3 .cb3-icons{width:100%;height:auto;aspect-ratio:336/125}.case-board-3 .cb3-equipment{width:100%;height:auto;aspect-ratio:336/261}.case-board-3 .cb3-pump{width:100%;height:auto;aspect-ratio:335/193}.case-board-3 .cb3-hardhat{width:100%;height:auto;aspect-ratio:334/189}.case-board-3 .cb3-wordmark{width:100%;height:auto;aspect-ratio:686/394}.case-board-3 .cb3-browser{width:100%;height:auto;aspect-ratio:1373/202}.case-board-2{flex-direction:column}.case-board-2 .cb2-logo{width:100%;height:auto;aspect-ratio:326/433}.cb2-row{flex-direction:column}.case-board-2 .cb2-icons{width:100%;height:auto;aspect-ratio:731/341}.case-board-2 .cb2-side{width:100%;height:auto;aspect-ratio:263/202}.case-board-2 .cb2-apron{width:100%;height:auto;aspect-ratio:303/268}.case-board-2 .cb2-wide{width:100%;height:auto;aspect-ratio:697/261}.portfolio-layout{grid-template-columns:1fr}.project-wide,.project-medium{grid-column:auto}.about-top{grid-template-columns:1fr}.about-top>img{grid-column:auto}.facts{grid-template-columns:1fr}.facts strong{font-size:65px}.experience-images{grid-template-columns:1fr}.service-projects{grid-template-columns:1fr 1fr}.footer-links{grid-template-columns:1fr 1fr}.footer-top{display:block}.footer-top .corner-button{margin-top:35px}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:8px}}
.cs-list{display:flex;flex-direction:column;gap:70px;margin-bottom:60px}.cs-row{display:flex;align-items:center;justify-content:flex-end;gap:32px;border-radius:10px;overflow:hidden;background:var(--white);padding-right:8%;text-decoration:none;color:inherit;cursor:pointer}.cs-row img{width:100%;max-width:900px;aspect-ratio:2190/1394;object-fit:cover;flex-shrink:0}.cs-row-b img{aspect-ratio:2146/1394}.cs-row-text{padding:20px;width:260px;flex-shrink:0}.cs-row-text h3{font-size:24px;font-weight:700;margin:0 0 6px}.cs-row-text p{font-size:14px;color:#777;margin:0}
@media(max-width:620px){.cs-row{flex-direction:column;align-items:stretch}.cs-row img{max-width:100%}}
.project-wide a{display:block;cursor:pointer}.project-wide img{transition:transform .4s ease}.project-wide a:hover img{transform:scale(1.02)}
.hero-scroll{overflow-x:auto;margin-top:90px;max-width:100%;cursor:grab;scrollbar-width:none}.hero-scroll::-webkit-scrollbar{display:none}.hero-scroll.dragging{cursor:grabbing}.hero-track{display:flex;gap:20px;width:max-content}.hero-item{flex:0 0 auto;width:min(1030px,92vw);border-radius:10px;overflow:hidden}.hero-item img{aspect-ratio:1030/560;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
@media(max-width:620px){.hero-item{width:92vw}}
.hero-particles{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.hero-particles .p{position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.9) 0%,rgba(255,255,255,.15) 55%,rgba(255,255,255,0) 75%);filter:blur(1px);opacity:.5}
.hero-particles .p1{width:6px;height:6px;left:8%;top:22%;animation:floatA 16s ease-in-out infinite}
.hero-particles .p2{width:4px;height:4px;left:22%;top:68%;animation:floatB 13s ease-in-out infinite 1s}
.hero-particles .p3{width:8px;height:8px;left:48%;top:15%;animation:floatC 19s ease-in-out infinite .5s}
.hero-particles .p4{width:5px;height:5px;left:68%;top:55%;animation:floatA 14s ease-in-out infinite 2s}
.hero-particles .p5{width:7px;height:7px;left:83%;top:30%;animation:floatB 17s ease-in-out infinite 1.5s}
.hero-particles .p6{width:3px;height:3px;left:35%;top:80%;animation:floatC 12s ease-in-out infinite 3s}
@keyframes floatA{0%,100%{transform:translate(0,0)}50%{transform:translate(28px,-42px)}}
@keyframes floatB{0%,100%{transform:translate(0,0)}50%{transform:translate(-24px,-36px)}}
@keyframes floatC{0%,100%{transform:translate(0,0)}50%{transform:translate(20px,32px)}}
