:root{--ink:#0b0b0b;--paper:#f7f7f4;--white:#fff;--muted:#6e6e6a;--rule:#cececa;--pad:clamp(20px,3.2vw,58px)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:84px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p{margin-top:0}
::selection{background:var(--ink);color:#fff}
a:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.skip-link{position:fixed;z-index:100;top:-100px;left:12px;background:#fff;color:#000;padding:10px 16px}
.skip-link:focus{top:12px}
.section-wrap{padding-left:var(--pad);padding-right:var(--pad)}
.site-header{position:fixed;inset:0 0 auto;z-index:30;height:84px;padding:0 var(--pad);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;color:#fff;border-bottom:1px solid rgba(255,255,255,.45);transition:background .3s,border-color .3s}
.site-header.is-solid{background:rgba(8,8,8,.94);border-color:#555;backdrop-filter:blur(16px)}
.brand{width:137px;line-height:0}
.brand img{width:100%;height:auto}
.site-nav{display:flex;gap:clamp(22px,2.6vw,50px)}
.site-nav a,.header-code{font-size:11px;line-height:1;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
.site-nav a{padding:10px 0;border-bottom:1px solid transparent}
.site-nav a:hover{border-color:#fff}
.header-code{justify-self:end;white-space:nowrap}
.hero{min-height:820px;height:100svh;max-height:1100px;position:relative;overflow:hidden;background:#171717;color:#fff}
.hero-photo,.hero-shade{position:absolute;inset:0;width:100%;height:100%}
.hero-photo{object-fit:cover;object-position:center 43%;filter:contrast(1.07) brightness(.84);transform:scale(1.04);animation:hero-scale 1.8s cubic-bezier(.2,.7,.2,1) both}
.hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.69) 0%,rgba(0,0,0,.22) 49%,rgba(0,0,0,.1) 100%),linear-gradient(0deg,rgba(0,0,0,.75),transparent 46%)}
.hero-topline{position:absolute;top:108px;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;gap:20px;font-size:11px;font-weight:700;letter-spacing:.15em}
.hero-content{position:absolute;left:var(--pad);right:var(--pad);bottom:75px}
.hero-kicker{font-size:13px;text-transform:uppercase;font-weight:700;letter-spacing:.13em;margin:0 0 25px}
.hero h1{font-size:clamp(84px,11.6vw,205px);line-height:.79;letter-spacing:-.09em;font-weight:800;margin:0 0 43px -11px;text-transform:uppercase}
.hero h1>span{display:block}
.hero h1>span:nth-child(2){font-weight:500;letter-spacing:-.095em}
.period{font-weight:800}
.hero-bottom{display:flex;align-items:end;justify-content:space-between;gap:30px;border-top:1px solid rgba(255,255,255,.7);padding-top:21px}
.hero-bottom p{font-size:clamp(18px,1.65vw,27px);line-height:1.25;letter-spacing:-.035em;max-width:670px;margin:0}
.round-link{width:62px;height:62px;border:1px solid #fff;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;font-size:32px;line-height:1;transition:background .25s,color .25s,transform .25s}
.round-link:hover{background:#fff;color:#000;transform:rotate(-45deg)}
.hero-scroll{position:absolute;bottom:21px;left:var(--pad);right:var(--pad);display:flex;justify-content:space-between;font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:700}
@keyframes hero-scale{from{opacity:.5;transform:scale(1.12)}to{opacity:1;transform:scale(1.04)}}
.section-index{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--ink);padding-top:14px;font-size:11px;line-height:1.3;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.position{padding-top:95px;padding-bottom:110px}
.position-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:8vw;align-items:end;margin-top:85px}
.position h2{font-size:clamp(58px,6.7vw,128px);line-height:.84;letter-spacing:-.09em;font-weight:800;margin:0 0 0 -7px}
.position h2 span{font-weight:400;white-space:nowrap}
.position-aside{display:flex;flex-direction:column;align-items:flex-start}
.position-aside p{font-size:clamp(23px,1.8vw,32px);line-height:1.25;letter-spacing:-.04em;margin:0}
.work-heading{padding-top:28px;padding-bottom:0;background:var(--paper)}
.work-heading .section-index{margin-bottom:34px}
.work-heading h2{font-size:clamp(24px,3vw,52px);line-height:1.15;letter-spacing:-.045em;margin:0 0 45px;font-weight:500}
.feature{display:grid;grid-template-columns:1fr 1fr;min-height:720px;border-top:1px solid var(--ink)}
.feature-copy{padding:35px var(--pad) 30px;display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.feature-meta{width:100%;display:flex;justify-content:space-between;gap:20px;font-size:11px;line-height:1.3;font-weight:700;letter-spacing:.09em}
.feature h3{font-size:clamp(54px,5.2vw,99px);line-height:.88;letter-spacing:-.082em;font-weight:800;margin:auto 0 45px -5px}
.feature h3 em{font-weight:400;font-style:normal}
.feature-copy>p{font-size:clamp(20px,1.55vw,28px);line-height:1.24;letter-spacing:-.03em;max-width:580px;margin:0 0 65px}
.feature-tag{display:block;width:100%;border-top:1px solid var(--ink);padding-top:12px;text-transform:uppercase;font-size:11px;font-weight:700;letter-spacing:.1em}
.feature-media{position:relative;min-height:720px;overflow:hidden;background:#555}
.feature-media img{height:100%;width:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.feature-media:hover img{transform:scale(1.04)}
.image-corner{position:absolute;right:20px;bottom:20px;padding:9px 11px;background:#fff;color:#111;font-size:10px;font-weight:700;letter-spacing:.1em}
.feature-scale .feature-media{order:0}
.feature-scale .feature-copy{order:1;background:#ececea}
.practice{min-height:820px;background:#090909;color:#fff;overflow:hidden;position:relative}
.practice-top{display:flex;justify-content:space-between;border-top:1px solid #777;padding-top:14px;margin:35px var(--pad) 0;padding-left:0;padding-right:0;font-size:11px;letter-spacing:.1em;font-weight:700}
.practice-body{position:relative;z-index:2;padding-top:150px;padding-bottom:125px}
.practice-label{font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:28px;font-weight:700}
.practice h3{font-size:clamp(58px,8.5vw,160px);line-height:.84;letter-spacing:-.088em;max-width:1650px;margin:0 0 80px;font-weight:800}
.practice h3 span{font-weight:400}
.practice-body>p:not(.practice-label){max-width:620px;margin:0 0 0 auto;font-size:clamp(21px,1.85vw,31px);line-height:1.23;letter-spacing:-.035em}
.studio{padding-top:90px;padding-bottom:110px}
.studio-grid{display:grid;grid-template-columns:1fr 1fr;gap:10vw;align-items:end;margin-top:85px}
.studio h3{font-size:clamp(62px,7vw,130px);line-height:.84;letter-spacing:-.09em;margin:0;font-weight:800}
.studio h3 span{font-weight:400}
.studio-list{align-self:end}
.studio-list p{font-size:clamp(23px,2vw,36px);line-height:1.2;letter-spacing:-.04em;max-width:550px;margin:0 0 65px}
.studio-list div{display:grid;grid-template-columns:52px 1fr;gap:16px;border-top:1px solid var(--ink);padding:20px 0;font-size:clamp(17px,1.3vw,23px);line-height:1.25}
.studio-list div:last-child{border-bottom:1px solid var(--ink)}
.studio-list div span:first-child{font-size:11px;font-weight:700;letter-spacing:.08em}
.site-footer{background:#080808;color:#fff;padding-top:65px;padding-bottom:35px;display:flex;justify-content:space-between;align-items:end;gap:50px}
.site-footer img{width:170px;height:auto}
.site-footer p{font-size:14px;margin:25px 0 0}
.footer-right{display:flex;flex-direction:column;align-items:end;gap:40px;font-size:11px;font-weight:700;letter-spacing:.09em}
.footer-right a{border-bottom:1px solid currentColor;padding-bottom:4px}
.has-js [data-reveal]{opacity:0;transform:translateY(42px);transition:opacity .75s ease,transform 1s cubic-bezier(.16,1,.3,1)}
.has-js [data-reveal].is-visible{opacity:1;transform:none}
@media(max-width:1100px){
.site-header{grid-template-columns:1fr auto}.header-code{display:none}
.hero h1{font-size:12vw}
.position-grid{grid-template-columns:1fr .55fr}
.feature{min-height:590px}.feature-media{min-height:590px}
.feature h3{font-size:5.8vw}.feature-copy>p{font-size:20px;margin-bottom:40px}
.studio h3{font-size:7vw}
}
@media(max-width:760px){
:root{--pad:20px}
[id]{scroll-margin-top:68px}
.site-header{height:68px;grid-template-columns:1fr auto}.brand{width:112px}.site-nav{gap:16px}.site-nav a{font-size:10px}.site-nav a:last-child{display:none}
.hero{height:100svh;min-height:660px;max-height:none}.hero-photo{object-position:61% center}.hero-shade{background:linear-gradient(0deg,rgba(0,0,0,.84),rgba(0,0,0,.26) 70%)}
.hero-topline{top:86px;font-size:9px}.hero-topline span:last-child{display:none}
.hero-content{bottom:82px}.hero-kicker{font-size:11px;margin-bottom:18px}.hero h1{font-size:clamp(57px,13.1vw,103px);margin:0 0 31px -4px}.hero-bottom{align-items:end}.hero-bottom p{font-size:17px;max-width:480px}.round-link{width:48px;height:48px;font-size:25px}
.section-index{font-size:10px}.section-index span:last-child{display:none}
.position{padding-top:78px;padding-bottom:100px}.position-grid{display:block;margin-top:73px}.position h2{font-size:clamp(55px,11vw,90px);margin-bottom:65px}.position-aside{max-width:550px}.cross{font-size:38px;margin-bottom:23px}.position-aside p{font-size:22px;margin-bottom:35px}
.work-heading{padding-top:24px;padding-bottom:70px}.work-heading .section-index{margin-bottom:65px}.work-heading h2{font-size:clamp(24px,3vw,52px);line-height:1.15;letter-spacing:-.045em;margin:0 0 45px;font-weight:500}
.feature{display:flex;flex-direction:column;min-height:0}.feature-copy{min-height:580px;padding:25px var(--pad) 26px}.feature h3{font-size:clamp(57px,10vw,88px);margin:75px 0 45px}.feature-copy>p{font-size:20px;margin-bottom:50px}.feature-media{min-height:450px;height:58vw}.feature-scale .feature-media{order:1}.feature-scale .feature-copy{order:0}
.practice{min-height:670px}.practice-top{font-size:10px;margin-top:25px}.practice-body{padding-top:115px;padding-bottom:85px}.practice h3{font-size:clamp(55px,10vw,95px);margin-bottom:95px}.practice-body>p:not(.practice-label){font-size:21px;max-width:520px}.practice-orbit{right:-115px;top:20%;opacity:.23}
.studio{padding-top:90px;padding-bottom:110px}.studio-grid{display:block;margin-top:80px}.studio h3{font-size:clamp(58px,10vw,100px);margin-bottom:85px}.studio-list p{font-size:23px;margin-bottom:42px}.studio-list div{font-size:18px}
.site-footer{padding-top:65px;padding-bottom:30px}.site-footer img{width:250px}.site-footer p{font-size:13px}.footer-right{font-size:10px}
}
@media(max-width:480px){
.site-nav a:nth-child(2){display:none}
.hero h1{font-size:13vw}.hero-bottom p{font-size:15px}.round-link{width:42px;height:42px}
.position h2{font-size:12vw}.position-aside p{font-size:20px}
.work-heading h2{font-size:clamp(24px,3vw,52px);line-height:1.15;letter-spacing:-.045em;margin:0 0 45px;font-weight:500}
.practice h3{font-size:10vw}.practice-body>p:not(.practice-label){font-size:18px}
.studio h3{font-size:10.4vw}
.site-footer{display:block}.footer-right{margin-top:90px;flex-direction:row;align-items:end;justify-content:space-between;gap:20px}.site-footer p{margin-top:25px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}.has-js [data-reveal]{opacity:1;transform:none}}

.chapter-nav{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ink)}
.chapter-nav a{display:flex;align-items:center;gap:20px;padding:24px 0;font-size:19px;letter-spacing:-.025em;transition:padding .25s}
.chapter-nav a:hover{padding-left:12px}
.chapter-nav span{font-size:10px;font-weight:700;letter-spacing:.1em}
.chapter-nav b{margin-left:auto;margin-right:25px;font-size:24px;font-weight:400}
.signature{background:#fff;border-top:1px solid var(--ink);padding-top:30px;padding-bottom:30px;overflow:hidden}
.signature-heading{display:flex;justify-content:space-between;align-items:start;gap:30px;margin-top:35px}
.signature-heading h2{font-size:clamp(42px,5vw,90px);line-height:1;letter-spacing:-.065em;font-weight:500;margin:0}
.signature-heading p{font-size:17px;line-height:1.3;letter-spacing:-.025em;margin:4px 0 0}
.signature-stage{width:min(100%,760px);margin:-5px auto 30px;position:relative}
.signature-svg{display:block;width:100%;height:auto;overflow:visible}
/* One cumulative mask reveals the original mark without moving or clipping pieces. */
.signature-stroke{stroke-dasharray:1;stroke-dashoffset:0}
.has-js .signature-stroke{stroke-dashoffset:1}
.signature-wordmark{width:180px;margin:4px auto 0;opacity:1}
.signature-wordmark img{width:100%;height:auto}
.has-js .signature-wordmark{opacity:0}
.is-playing .signature-arc{animation:signature-draw 1.65s cubic-bezier(.4,0,.25,1) .15s forwards}
.is-playing .signature-diagonal{animation:signature-draw 1.15s cubic-bezier(.4,0,.25,1) 1.45s forwards}
.is-playing .signature-shoulder{animation:signature-draw 1.65s cubic-bezier(.4,0,.25,1) 2.3s forwards}
.is-playing .signature-wordmark{animation:signature-name 1s cubic-bezier(.22,1,.36,1) 3.5s forwards}
@keyframes signature-draw{to{stroke-dashoffset:0}}
@keyframes signature-name{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.signature-bottom{display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid var(--ink);padding-top:15px;font-size:10px;letter-spacing:.1em;font-weight:700}
.motion-replay{font:inherit;letter-spacing:.08em;text-transform:uppercase;color:var(--ink);background:transparent;border:0;padding:7px 0;cursor:pointer;display:flex;align-items:center;gap:18px}
.motion-replay span{font-size:24px;line-height:1;font-weight:400}
.motion-replay:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
@keyframes arrive-arc{from{opacity:0;transform:translate(-100px,22px)}25%{opacity:1}to{opacity:1;transform:translate(0,0)}}
@keyframes arrive-diagonal{from{opacity:0;transform:translate(0,85px)}25%{opacity:1}to{opacity:1;transform:translate(0,0)}}
@keyframes arrive-shoulder{from{opacity:0;transform:translate(105px,-20px)}25%{opacity:1}to{opacity:1;transform:translate(0,0)}}
@keyframes draw-stroke{to{stroke-dashoffset:0}}
@keyframes final-lock{to{opacity:1}}
@keyframes parts-clear{to{opacity:0}}
@keyframes wordmark-in{to{opacity:1;clip-path:inset(0)}}
@media(max-width:1100px){.position-grid{grid-template-columns:1fr .7fr}.position h2{font-size:6.4vw}.studio h3{font-size:7vw}}
@media(max-width:760px){
.position{padding-top:70px;padding-bottom:80px}.position-grid{display:block;margin-top:65px}.position h2{font-size:10.4vw;margin-bottom:45px}.position-aside p{font-size:21px}
.work-heading{padding-top:20px;padding-bottom:0}.work-heading .section-index{margin-bottom:27px}.work-heading h2{font-size:25px;margin-bottom:35px}
.chapter-nav{grid-template-columns:1fr 1fr}.chapter-nav a{font-size:17px;padding:19px 0;border-bottom:1px solid var(--rule)}.chapter-nav b{margin-right:18px}
.studio{padding-top:75px;padding-bottom:80px}.studio-grid{display:block;margin-top:65px}.studio h3{font-size:11vw;margin-bottom:55px}
.site-nav a:last-child{display:block}
.signature-heading{display:block;margin-top:45px}.signature-heading h2{font-size:46px;margin-bottom:22px}.signature-heading p{font-size:16px}.signature-stage{margin:30px auto 65px}.signature-wordmark{width:140px;margin:-5px auto 0}.signature-bottom{font-size:9px}.motion-replay{font-size:10px}.signature-bottom>span{max-width:180px;line-height:1.5}
.site-footer img{width:150px;height:auto}
}
@media(prefers-reduced-motion:reduce){.logo-part{display:none}.has-js .logo-final{opacity:1;animation:none}.has-js .signature-wordmark{opacity:1;clip-path:inset(0);animation:none}}

.practice-link{display:flex;justify-content:space-between;gap:30px;max-width:620px;margin:28px 0 0 auto;border-top:1px solid #696969;padding-top:20px;min-height:44px;font-size:12px}.practice-link span{font-size:22px;line-height:1}
@media(max-width:480px){.site-header{gap:16px}.site-nav{gap:12px}.site-nav a[href="#system"]{display:none}}
@media(max-width:360px){.feature h3{font-size:13.8vw}.chapter-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.chapter-nav a{gap:12px}.chapter-nav b{margin-right:12px}}

@media(prefers-reduced-motion:reduce){.has-js .signature-stroke{stroke-dashoffset:0;animation:none}.has-js .signature-wordmark{opacity:1;transform:none;clip-path:none;animation:none}}

.is-playing .signature-arc{animation:signature-draw 2.6s cubic-bezier(.4,0,.25,1) .1s forwards}.is-playing .signature-shoulder{animation:signature-draw 1.8s cubic-bezier(.4,0,.25,1) 2.45s forwards}.is-playing .signature-leg{animation:signature-draw .8s cubic-bezier(.4,0,.25,1) 3.5s forwards}.is-playing .signature-wordmark{animation:signature-name 1s cubic-bezier(.22,1,.36,1) 4s forwards}

.signature-canvas{display:block;width:82.7%;height:auto;margin:6% auto 8%;aspect-ratio:621/367}
